/* ================= Fonts Section Start ================= */

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Medium.eot');
    src: url('../fonts/Inter-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Inter-Medium.woff2') format('woff2'),
        url('../fonts/Inter-Medium.woff') format('woff'),
        url('../fonts/Inter-Medium.ttf') format('truetype'),
        url('../fonts/Inter-Medium.svg#Inter-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../fonts/Satoshi-Bold.eot');
    src: url('../fonts/Satoshi-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Satoshi-Bold.woff2') format('woff2'),
        url('../fonts/Satoshi-Bold.woff') format('woff'),
        url('../fonts/Satoshi-Bold.ttf') format('truetype'),
        url('../fonts/Satoshi-Bold.svg#Satoshi-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../fonts/Satoshi-Regular.eot');
    src: url('../fonts/Satoshi-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Satoshi-Regular.woff2') format('woff2'),
        url('../fonts/Satoshi-Regular.woff') format('woff'),
        url('../fonts/Satoshi-Regular.ttf') format('truetype'),
        url('../fonts/Satoshi-Regular.svg#Satoshi-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../fonts/Satoshi-Black.eot');
    src: url('../fonts/Satoshi-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Satoshi-Black.woff2') format('woff2'),
        url('../fonts/Satoshi-Black.woff') format('woff'),
        url('../fonts/Satoshi-Black.ttf') format('truetype'),
        url('../fonts/Satoshi-Black.svg#Satoshi-Black') format('svg');
    font-weight: bold;
    font-style: 900;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('../fonts/Satoshi-Medium.eot');
    src: url('../fonts/Satoshi-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Satoshi-Medium.woff2') format('woff2'),
        url('../fonts/Satoshi-Medium.woff') format('woff'),
        url('../fonts/Satoshi-Medium.ttf') format('truetype'),
        url('../fonts/Satoshi-Medium.svg#Satoshi-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


:root {
    --gradient-1:linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%);
    --gradient-2:linear-gradient(112.42deg, #199A82 11.45%, #F0D6F1 58.81%, #E7C32E 116.25%);
    --gradient-3:linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%);
  }

/* ================= Fonts Section End ================= */

body {
	font-size: 18px;
	line-height: 24px;
	font-family: 'Satoshi';
	font-weight: 500;
	font-style: normal;
	color: #fff;
	background-color:#000000; padding: 119px 0 0;
}


a {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	color: #fff;
	text-decoration:none;
}
h1{ color:#fff; font-size:120px; line-height:1; margin:0px; font-family: 'Satoshi'; font-weight:400; letter-spacing:-0.03em;}
h2{ color:#fff; font-family: 'Satoshi'; font-weight: 400; font-size: 120px; line-height: 1; letter-spacing:-0.03em; margin:0px;}
h3{font-family: 'Satoshi'; font-weight: 400; font-size: 50px; line-height: 60px; letter-spacing: 0; margin:0px;}
p { font-size: 18px; line-height: 24px; font-weight: 500;font-family: 'Satoshi';}
p:last-of-type { margin: 0px;}



/* ================= Header Section Start ================= */

.header-section { padding: 21px 0; border-bottom: 1px solid #161616; position: fixed; left: 0; right: 0; top: 0; z-index: 99; background: #000;}
.header-phone-number ul { padding: 0; list-style: none; gap: 20px;  margin: 0;}
.header-grid-block { display: grid; grid-template-columns: auto auto auto; align-items: center; gap: 20px;}
.header-phone-number ul a { color: #fff; font-size: 18px; line-height: 20px; text-decoration: none;}
.header-phone-number ul li.contact-btns a { text-transform: uppercase; font-size: 16px; line-height: 20px; background: #fff; color: #000; display: inline-block; padding: 12px 30px; border-radius: 50px; border: 1px solid #fff;}
.header-phone-number .login-btns a { text-transform: uppercase; font-size: 16px; line-height: 20px; background: transparent; display: inline-block; padding: 12px 30px; border-radius: 50px; border: 1px solid #fff; color: #fff;}

.header-menu ul.navbar-nav { border: 1px solid #3F3F3F; background: #1A1A1A; border-radius: 60px; width: auto; max-width: 100%; padding: 9px 14px; display: inline-flex;  gap: 5px; position: relative;}
.header-menu #navbarSupportedContent { justify-content: center;}
.header-menu ul.navbar-nav li a { font-family: Satoshi; font-weight: 500; font-size: 18px; line-height: 20px; letter-spacing: 0%; text-transform: capitalize; color: #fff; padding: 10px 25px !important; position: relative;}
.header-menu ul.navbar-nav li.dropdown-menu-items a#navbarDropdown::after { background-image: url("../assets/images/menu-dropdown-icon.svg"); border: 0; width: 9px; height: 5px; vertical-align: middle; display: inline-block; margin-left: .255em; content: "";}


.header-menu ul.navbar-nav li a::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: 30px; padding: 1px; background: linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: add, add; -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity:0; visibility: hidden;}
.header-menu ul.navbar-nav li a.active::before, .header-menu ul.navbar-nav li a:hover::before{opacity:1; visibility: visible;}

/* Mega Menu Css */

.mega-menu-content { position: relative;}
.mega-menu-content .mega-menu-title { font-family: Satoshi; font-weight: 500; font-size: 16.6px; line-height: 22px; letter-spacing: 0%; text-transform: capitalize; margin: 0 0 5px;}
.mega-menu-content p { font-weight: 500; font-size: 12px; line-height: 16px; letter-spacing: 0.8px; color: #808080;}
.mega-service-icon { margin: 0 0 5px;}
.header-menu .mega-menu-items a.mega-menu-links { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100%; padding: 0 !important;}
.header-menu .mega-menu-items a.mega-menu-links::before{ display:none;}

/* ================= Header Section End ================= */



/* ================= Banner Section Start ================= */

.banner-section { padding: 100px 0 50px;}
.banner-content-info { max-width: 100%; padding-right: 10%;}
.banner-content-info h1 { margin: 0 0 70px;}
.banner-content-info p {  text-transform: capitalize; max-width: 80%;}
.banner-btns { margin: 35px 0 0;}
a.primary-btns { font-family: 'Satoshi'; font-weight: 700; font-size: 16px; line-height: 20px; letter-spacing: 0; vertical-align: middle; text-transform: uppercase; color: #fff; text-decoration: none; display: inline-block; padding: 1px; position: relative; background-image: linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%); border-radius: 60px;}
a.primary-btns span { background: #000; padding: 14px 35px; display: inline-block; border-radius: 50px;cursor: pointer;}

.hm-video-items img, .hm-video-items iframe { border-radius: 16px;}
.hm-video-items img{ width: 100%;}
.hm-video-items { position: relative;}
.banner-video-items { padding: 4px; background-image: linear-gradient(112.42deg, #199A82 11.45%, #F0D6F1 58.81%, #E7C32E 116.25%); border-radius: 16px;}
.video-btns { position: absolute; left: 0; top: 50%; right: 0; width: 108px; height: 108px; margin: 0 auto; transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); background-color: rgba(255,255,255,0.68); border-radius: 50%; border: 0; box-shadow: 0 0 0 transparent; outline: 0;}
.banner-video-items .video-btns img { width: auto; max-width: 100%; border-radius: 0;}

/* ================= Banner Section End ================= */



/* ================= Banner Logo Section Start ================= */

.banner-logo-section { overflow: hidden; padding: 50px 0;  background: #000; position: relative;}
.top-logos-slider { display: flex; gap: 30px; animation: 35s slide infinite linear;}
.top-logos-items { white-space: nowrap; position: relative; display: flex; gap: 30px;}
.logo-blocks { background: #0A0A0A; padding: 10px; border-radius: 10px; display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 160px; gap: 16px; width: 250px;}
.logo-blocks h5 { font-family: 'Satoshi'; font-weight: 500; font-size: 11.8px; line-height: 15px; letter-spacing: 0.8px; text-align: center; text-transform: uppercase; margin: 0;}
.logo-heading { margin: 0 0 30px; font-family: 'Satoshi'; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-align: center; text-transform: uppercase;}

@keyframes slide{
  from{
    transform:translateX(0) ;
    
  }
  to{
    transform:translateX(-100%) ;
  
  }
}



/* ================= Banner Logo Section End ================= */



/* ================= About Section Start ================= */


.hm-about-section { padding: 50px 0;}
.hm-about-section .container { max-width: 80%;}
.hm-about-content-info h3 { margin: 0 0 30px;}
.hm-about-content-info .abouts-btns { margin: 45px 0 0;}
.hm-about-content-info { width: 100%;  padding: 0 0 0 10%;}
.about-image-block img { width: 100%;}

/* ================= About Section End ================= */



/* ================= Services Tabs Section Start ================= */

.services-tabs-section { padding: 50px 0;}
.services-short-info { max-width: 300px; margin: 0 0 0 auto;}
.services-title-block { max-width: 750px;}
.tab-service-title-box { padding: 0 0 80px;}

.custom-row { display: flex; flex-wrap: wrap;}
.service-tab-menu { border: 1px solid #3F3F3F; background: #0A0A0A; padding: 32px 20px; border-radius: 10px;}
.service-tab-menu ul.nav-tabs li button.nav-link { background: transparent; border: 0; border-radius: 60px; padding: 10px 30px; font-family: Satoshi; font-weight: 500; font-size: 16px; line-height: 22px; letter-spacing: 0; text-transform: capitalize; color: #fff;  margin: 0; margin: 0 auto;}
.service-tab-menu ul.nav-tabs li button.nav-link.active, .service-tab-menu ul.nav-tabs li button.nav-link:hover { background: #fff; color: #000;}
.service-tab-menu ul.nav-tabs { gap: 10px; border: 0;}
.service-tab-menu ul.nav-tabs li { width: 100%; text-align: center;}

#web-tab-pane .accordion-body { background-image: url(../assets/images/tab-back-bg.jpg);}
#commerce-tab-pane .accordion-body { background-image: url(../assets/images/e-commerce-tab-image.jpg);}
#software-tab-pane .accordion-body { background-image: url(../assets/images/customer-software-tab-bg.jpg);}
#design-tab-pane .accordion-body { background-image: url(../assets/images/ui-ux-design-tab-image.jpg);}
#digital-tab-pane .accordion-body { background-image: url(../assets/images/digital-marketing-tab-image.jpg);}
#words-tab-pane .accordion-body { background-image: url(../assets/images/google-adwords-tab-image.jpg);}
.services-tab-content-info .accordion-item .accordion-body { background-size: cover; background-position: center; border-radius: 10px; padding: 40px; position: relative; overflow: hidden;}
.services-tab-content-info .accordion-item { background: transparent; border: 0;}
.tab-right-colm { width: 74%; padding: 0 0 0 14px;}
.tab-left-colm { width: 26%;}
.tab-right-image { position: absolute; right: 0; top: 50%; padding: 40px 80px 40px 0px; width: 62%; border-radius: 10px; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.services-tabs-conatent { position: relative; z-index: 1; max-width: 384px;}
.tab-right-image img { border-radius: 10px; width: 100%; height: 270px; object-fit: cover;}
.services-tabs-conatent h3 { font-family: Satoshi; font-weight: 500; font-size: 22px; line-height: 1; letter-spacing: 0; margin: 0 0 15px;}
.services-tabs-conatent p { color: #9B9B9B;}
.services-tab-header { max-width: 309px;margin: 0 0 18px;}
.services-tabs-conatent ul { padding: 0; list-style: none; margin: 0 0 25px;}
.services-tabs-conatent ul li::before { content: ""; background-image: url(../assets/images/check-icon.svg); position: absolute; left: 0; top: 0; top: 6px; width: 12px; height: 9px;}

.services-tabs-conatent ul li { font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 20px; letter-spacing: 0px; text-transform: uppercase; margin: 0 0 6px; position: relative; padding: 0 0 0 30px;}


/* ================= Services Tabs Section End ================= */



/* ================= Second Logo Carousel Section Start ================= */

.second-logo-carousel { padding: 50px 0; overflow: hidden; position: relative;}
.bottom-carousel-logo { border-style: solid; border-width: 1px 0; padding: 22px 0; border-color: #161616;}
.second-logo-carousel .logo-blocks { width: 240px; min-height: 180px;}


/* ================= Second Logo Carousel Section End ================= */




/* ================= Latest Projects Section Start ================= */

.latest-project-title-box .latest-title-block { padding: 0 0 60px;}
.latest-project-title-box .services-short-info { max-width: 260px;}
.latest-project-title-box { padding: 0 0 80px;}

.latest-project-section { padding: 50px 0px;  background: #000;  position: relative;}
.project-grid-items { display: grid; width: 100%; gap: 144px; grid-template-columns: repeat(5, 1fr);  align-items: flex-end;}

.project-item-info:nth-child(3) .project-item-boxs { max-width: 60%; margin: 0 auto;}

.project-post-thumbnail { padding-top: 67.55%; position: relative; border-radius: 10px;}
.project-post-thumbnail img { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; transition: all ease-in-out 0.5s; border-radius: 10px;object-position: center top;}
.project-item-info:nth-child(3n+2) .project-post-thumbnail { padding-top: 56.27%;}
.project-item-boxs .project-content { gap: 20px; margin: 20px 0 0;}
.pr-right-box a { width: 40px; height: 40px; display: inline-flex; justify-content: center; align-items: center; min-width: 40px;}
.project-content h5 { font-family: Satoshi; font-weight: 500; font-size: 22px; line-height: 22px; letter-spacing: 0; margin: 0 0 5px;}
.project-content h5 a{ color: #fff; text-decoration:none;}
.project-content .project-categories { font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase;}
.project-content .project-categories a{ color: #9B9B9B; text-decoration:none;}

.view-more-btns a.primary-btns .btn-text { display: inline-flex; gap: 10px;align-items: center; padding: 14px 24px;}
a.primary-btns span.btns-icon { background: transparent; padding: 0; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;}
.latest-project-section .view-more-btns { text-align: center; padding: 100px 0 0;}

/* ================= Latest Projects Section End ================= */





/* ================= Brand Section Start ================= */

.brand-section { padding: 50px 0;}
.brand-title-box { padding: 0 0 80px;}
.brand-title-block { padding: 0 10% 0 0;}
.brand-grid-boxs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px;}
.icon-block-card-items { background: #0a0a0a; display: flex; min-height:296px; justify-content: center; padding:30px; width: 100%;}
.icon-block-card-items .icon-content-card { max-width: 312px; margin: 0 auto; text-align: center; width: 100%;}
.number-texts { background: linear-gradient(112.42deg, #199A82 11.45%, #F0D6F1 58.81%, #E7C32E 116.25%); width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; border-radius: 30px; margin: 0 auto 22px; font-family: 'Satoshi'; font-weight: 900; font-size: 11.4px; line-height: 13px; letter-spacing: 0; text-transform: uppercase; color: #000;}
.icon-title-text { font-family: Satoshi; font-weight: 900; font-size: 24px; line-height: 1; letter-spacing: 0; text-align: center; text-transform: uppercase; margin: 0 0 15px;}
.icon-block-card-items p { color: #9B9B9B;}

/* ================= Brand Section End ================= */



/* ================= Testimonials Scrolling Section Start ================= */

.testimonials-scrolling-section { padding: 50px 0;  background: #000;   position: relative;}
.testimonial-main-title { text-align: center; padding: 0 0 60px;}
.testimonials-scrolling-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;}
.card-scrolling-items .testimonials-card-boxs { background: #0A0A0A; padding: 24px; border-radius: 10px;}
.testimonials-author-info { margin: 0 0 20px; gap: 23px;}
.testimonials-author-info .auhter-image { width: 60px; height: 60px; overflow: hidden; min-width: 60px; border-radius: 5px;}
.testimonials-author-info .auhter-image img { width: 100%; height: 60px; object-fit: cover; border-radius: 5px;}
.auhtor-content-boxs .auhtor-title-text { font-family: Satoshi; font-weight: 900; font-size: 18px; line-height: 20px; letter-spacing: 0; text-transform: uppercase; margin: 0 0 5px;}
.auhtor-content-boxs .auhtor-designation { font-family: Satoshi; font-weight: 500; font-size: 11.8px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase; color: #9B9B9B;}
.testimonials-card-body p { font-family: Satoshi; font-weight: 500; font-size: 20px; line-height: 26px; letter-spacing: 0;}
.testimonials-card-body .testimonials-content-boxs { max-width: 80%;}
.testimonials-card-body { border: 1px solid #161616; border-radius: 10px; background: #000; padding: 20px;}



/* ================= Animation for Scrolling ================= */

.card-scrolling-items{ height: 900px; overflow: hidden; position: relative;}
.card-scrolling-items::after, .card-scrolling-items::before { content: ""; position: absolute; left: 0; width: 100%; height: 60px; z-index: 2; pointer-events: none;}
.card-scrolling-items::after { bottom: 0; background: linear-gradient(to top, #000, transparent);}
.card-scrolling-items::before { top: 0; background: linear-gradient(to bottom, #000, transparent);}
.card-scroll-list { display:flex; flex-direction:column; gap:20px; will-change:transform;}


/* ================= Testimonials Scrolling Section End ================= */



/* ================= Related Article Section Start ================= */

.related-article-section { padding: 50px 0; position: relative; background: #000;}
.related-article-title { padding: 0 0 80px; text-align: center;}


.blog-featured-image { position: relative; padding-top: 73.63%; border-radius: 10px; overflow: hidden;}
.recent-blog-items .blog-featured-image img { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; transition: all ease-in-out 0.5s; border-radius: 10px;}
.blog-info-content { margin: 20px 0 0;}
.blog-info-content .blog-post-title { font-family: Inter; font-weight: 500; font-size: 17.3px; line-height: 22px; letter-spacing: 0; margin:0 0 5px;}
.blog-meta-info { color: #9B9B9B; font-family: Inter; font-weight: 500; font-size: 11.8px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase;}
.pr-right-box a { width: 20px; height: 20px; display: inline-flex; justify-content: center; align-items: center; min-width: 40px;}
.blog-custom-row { row-gap: 24px;}

.blog-view-more-btns a.primary-btns .btn-text { display: inline-flex; gap: 10px; align-items: center; padding: 14px 24px;}



/* ================= Related Article Section End ================= */



/* ================= Call Us Section Start ================= */

.call-us-section { padding: 50px 0; position: relative; background: #000;}
.call-section-bg { position: relative;}
.call-section-bg::before { background-image: url("../assets/images/call-us-back-bg.png"); background-position: center; background-size: cover; position: absolute; left:0px; right:0px; content:""; width:100%; height:100%;}
.call-us-section .container { max-width: 90%;}
.call-right-image { position: absolute; right: 0; top: 50%; width: 62%; transform: translateY(-50%); border-radius: 10px;}
.call-us-content { max-width: 80%; position: relative; z-index: 1; padding: 50px 0;}
.call-us-content h3 { margin: 0 0 30px;}
.call-us-content .call-small-text { margin: 30px 0 0;}
.call-us-content p { margin: 0 0 25px;}

.call-upper-text p { text-transform: uppercase;}
.call-upper-text { margin: 25px 0 0;}
.give-call-btns { margin: 45px 0 0;}
.call-us-image-block img { width: 100%;}

/* ================= Call Us Section End ================= */




/* ================= Our Partner Section Start ================= */

.our-partner-section { padding: 50px 0; position: relative; background: #000;}
.our-partner-section .partner-logo-title{ margin: 0 0 30px;} 
.partner-logo-title h5 { text-align: center; margin: 0; font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-align: center; text-transform: uppercase;}
.partner-logo-items ul { list-style: none; padding: 0; max-width: 808px; margin: 0 auto; width: 100%;}
.partner-logo-items ul li { background: #0A0A0A; width: 182px; height: 104px; padding: 10px; border-radius: 10px; display: flex; justify-content: center; align-items: center;}


/* ================= Our Partner Section End ================= */



/* ================= Footer Faq Start ================= */

.footer-contact-section { padding: 50px 0; position: relative; background: #000;}
.footer-form-info h3 { margin: 0 0 24px;}
.footer-form-info .form-top-content { max-width: 488px; margin: 0 0 55px;}
.footer-form-info {  padding-right: 10%;}
.footer-form-info .form-group { margin: 0 0 16px;}
.footer-form-info .form-group input[type="text"], .footer-form-info .form-group input[type="email"], .footer-form-info .form-group input[type="tel"] { width: 100%; background: #0F0F0F; border: 0; border-radius: 10px; height: 68px; font-family: Satoshi; font-weight: 400; font-size: 15.3px; line-height: 100%; letter-spacing: 0%; vertical-align: middle; color: #fff; padding: 10px 22px; outline: 0; box-shadow: 0 0 0 transparent;}
.footer-form-info .form-group textarea { width: 100%; background: #0F0F0F; border: 0; border-radius: 10px; height: 150px; font-family: Satoshi; font-weight: 400; font-size: 15.3px; line-height: 100%; letter-spacing: 0%; vertical-align: middle; color: #fff; padding: 22px; outline: 0; box-shadow: 0 0 0 transparent;}
.footer-form-info .form-group.submit-btns { margin: 0;}
.footer-form-info .form-group button { width: 100%; border: 0; outline: 0; box-shadow: 0 0 0 transparent; font-family: Satoshi; font-weight: 700; font-size: 16px; line-height: 24px; letter-spacing: 0; color: #000; background: #fff; border-radius: 50px; padding: 12px 10px;}
.footer-form-info .form-group select { width: 100%; background-color: #0F0F0F; border: 0; border-radius: 10px; height: 68px; font-family: Satoshi; font-weight: 400; font-size: 15.3px; line-height: 100%; letter-spacing: 0%; vertical-align: middle; color: #fff; padding: 10px 22px; outline: 0; box-shadow: 0 0 0 transparent; background-image: url("../assets/images/menu-dropdown-icon.svg"); background-repeat: no-repeat; background-position: center right 20px; background-size: 15px;}


.footer-faq-accordion .accordion-item .accordion-button { gap: 110px; background: transparent; font-family: Satoshi; font-weight: 700; font-size: 18px; line-height: 20px; letter-spacing: 0%; text-transform: uppercase; color: #fff; padding: 30px 30px 30px 0px; border-bottom: 1px solid #161616; outline: 0; box-shadow: 0 0 0 transparent; border-radius: 0;}
.footer-faq-accordion .accordion-item:first-child .accordion-button { border-top: 1px solid #161616;}
.footer-faq-accordion .accordion-item .accordion-number { font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase;}
.footer-faq-accordion .accordion-item .accordion-button::after { position: absolute; right: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); width: 24px; height: 24px; background-image: url("../assets/images/minus-icon.svg"); background-repeat: no-repeat; background-position: center;}
.footer-faq-accordion .accordion-body { padding: 30px 0 10px;}
.footer-faq-accordion .accordion-item { background: transparent;}
.footer-faq-accordion { margin: 50px 0 0;}


/* ================= Footer Faq End ================= */




/* ================= Footer Section Start ================= */

.footer-menu-items {width:100%; max-width: 332px; margin: 0 0 0 auto; gap: 80px; padding: 70px 0 0}
.footer-menu-title { font-family: Satoshi; font-weight: 500; font-size: 18px; line-height: 20px; letter-spacing: 0; text-transform: uppercase; color: #fff; margin: 0 0 20px;}

.footer-menu-items ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 25px;}
.footer-menu-items ul li{font-family: Satoshi; font-weight: 500; font-size: 18px; line-height: 24px; letter-spacing: 0; text-transform: capitalize;}
.footer-menu-items ul li a { color: rgba(255,255,255,0.6);}
.footer-quick-links:last-child ul { gap: 16px;}
.footer-info-section { padding: 50px 0 0; position: relative; background: #000;}
.footer-main-boxs { padding: 50px 0; background-image: url("../assets/images/footer-bg.png"); background-repeat: no-repeat; background-position: center; background-size: cover; background-color: #000; position: relative;}
.footer-contact-info { max-width: 570px; width: 100%;}
.footer-contact-info .footer-logo img { vertical-align: top;}
.footer-contact-info .footer-logo { margin: 0 0 40px;}
.footer-contact-info .let-work-text { font-family: Satoshi; font-weight: 500; font-size: 100px; line-height: 92px; letter-spacing: -1.6px; text-transform: capitalize; margin: 0 0 50px;}
.footer-social-icon ul { list-style: none; display: flex; justify-content: space-between; max-width: 282px; align-items: center; background-color: rgba(0,0,0,0.1); margin: 0; padding: 12px 20px; border-radius: 200px;}
.footer-social-icon { margin: 0 0 16px;}
.footer-email-text p {font-weight: normal;}
.footer-email-text a{ text-decoration: underline;}


/* ================= Footer Section End ================= */



/* ================= About Page Css Start ================= */



/* ================= About Banner Section Start ================= */


.about-banner-section { padding: 100px 0 50px;}
.banner-short-content { max-width: 80%;}
.banner-content-info .banner-short-content p { max-width: 100%;}

/* ================= About Banner Section End ================= */


/* ================= How We Work Section Start ================= */

.how-we-work-section { padding: 50px 0;}
.center-title-block { text-align: center; padding: 0 0 70px;}
.work-content-items { text-align: center; max-width: 80%; margin: 0 auto;}
.work-number-text { font-family: Satoshi; font-weight: 900; font-size: 40px; line-height: 1; letter-spacing: 0; text-align: center; text-transform: uppercase; background-image: linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin: 0 auto 25px;}
.work-content-items h5 { margin: 0 0 15px; font-family: Satoshi; font-weight: 500; font-size: 22px; line-height: 1; letter-spacing: 0;}
.work-content-items  p { color: #9B9B9B;}
.circle-separate { width: 30px; height: 30px; box-shadow: 0px 4px 4px 0px #00000040; background: #fff; margin: 0 auto 30px; border-radius: 50px; position: relative;}
.circle-separate::before { content: ""; position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100%; background: #fff; border-radius: 50px; filter: blur(17px);}
.how-work-content-info { position: relative;}
.how-work-content-info::before { content: ""; position: absolute; left: 0; right: 0; top: 15px; background-image: linear-gradient(112.42deg, #199A82 11.45%, #F0D6F1 58.81%, #E7C32E 116.25%); width: 100%; height: 2px;}

/* ================= How We Work Section End ================= */


/* ================= About Trusted Section Start ================= */

.about-trusted-section { padding: 50px 0;}
.center-title-block h3 { margin: 0 0 10px;}
.trusted-grid-items > * { padding-left: 5px; padding-right: 5px;}
.trusted-grid-items { margin-left: -5px; margin-right: -5px; row-gap: 10px;}
.trusted-about-items { background: #0A0A0A; padding: 45px 20px; border-radius: 10px;}
.trusted-content-info { max-width: 350px; margin: 0 auto; text-align: center;}
.trusted-content-info .trusted-logo { margin: 0 0 15px; min-height: 40px; display: flex; justify-content: center; align-items: center;}
.trusted-content-info p{color: #9B9B9B}

/* ================= About Trusted Section End ================= */



/* ================= About Website Section Start ================= */

.about-website-section { padding: 50px 0;}
.about-website-title { padding: 0 0 80px;}
.website-content-block { background-image: url("../assets/images/about-services-bg.jpg"); background-position: center; background-size: cover; border-radius: 14px;   padding: 40px;}
.about-services-box { padding: 0 10% 0 0; width: 100%;}
.about-services-content { background: #000; padding: 6%; width: 100%;}
.about-services-item { gap: 20px;}
.about-services-item .about-icon { min-width: 27px; width: 27px;}
.about-services-icon { gap: 16px;}
.about-services-link { width: 26px; min-width: 26px;}
.about-services-listing { gap: 48px; width: 100%;}
.about-services-image img {width: 100%; border-radius: 10px;}
.about-services-image { padding: 0 0 0 5%;}
.about-services-title { font-size: 18px; font-weight: 500;}

/* ================= About Website Section End ================= */


/* ================= About Choose Section Start ================= */

.about-choose-section { padding: 50px 0;}
.about-choose-icon { margin: 0 0 20px;}
.about-choose-section .icon-block-card-items { min-height: inherit; padding: 60px 20px;}
.about-choose-row > * { padding-left: 5px; padding-right: 5px;}
.about-choose-row { margin-left: -5px; margin-right: -5px; row-gap: 10px;}
.how-work-rows { row-gap: 40px;}

/* ================= About Choose Section End ================= */


/* ================= About Team Section Start ================= */

.about-team-section{ padding:50px 0;}
.about-team-image img { width: 100%; vertical-align: top; border-radius: 10px; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.team-content-info { position: absolute; left: 0; right: 0;bottom: 0; padding: 20px; opacity:0; visibility: hidden; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;}
.team-card-items { background: #0A0A0A; border-radius: 10px; overflow: hidden; width: 100%;}
.team-card-items .team-card-info { padding: 25px;}
.team-card-info .team-card-name { font-family: Satoshi; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 0; text-transform: uppercase; margin: 0 0 15px;}
.team-card-info .team-card-position { font-family: Satoshi; font-weight: 500; font-size: 22px; line-height: 1; letter-spacing: 0;}
.about-team-image { background: #000; position: relative;}
.team-card-items:hover .about-team-image img { opacity: 0.5; filter: blur(9px);}
.team-card-items:hover .team-content-info { opacity: 1; visibility: visible;}
.team-content-info p { color: rgba(255,255,255,0.8);}
.team-grid-boxs > * { padding-left: 5px; padding-right: 5px;}
.team-grid-boxs { margin-left: -5px; margin-right: -5px;}
.team-grid-boxs { row-gap: 10px;}


/* ================= About Team Section End ================= */


/* ================= About Page End ================= */



/* ================= Services Page Start ================= */

/* ================= Inner Page Banner Section ================= */

.inner-page-banner{ padding: 100px 0 50px;}
.services-banner-section .about-banner-image { text-align: right;}

/* ================= Inner Page Banner Section End ================= */


/* ================= Services Listing Section ================= */

.services-listing-section { padding: 50px 0;background: #000;}
.services-listing-card { background-position: center; background-size: cover; padding: 4% 3%; border-radius: 14px;}
.web-development-services { background-image: url("../assets/images/web-development-back-bg.png");}
.e-commerce-development-services { background-image: url("../assets/images/e-commerce-tab-image.jpg");}
.custom-software-development-services { background-image: url("../assets/images/customer-software-tab-bg.jpg");}
.ui-ux-design-services { background-image: url("../assets/images/ui-ux-design-tab-image.jpg");}
.digital-marketing-services { background-image: url("../assets/images/digital-marketing-tab-image.jpg");}
.google-adwords-services { background-image: url("../assets/images/google-adwords-tab-image.jpg");}
.services-listing-content { background: #000; padding: 6%; border-radius: 10px; width: 100%; display: flex; flex-direction: column; justify-content: center;}
.services-listing-content h3 { font-family: Satoshi; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 0; text-transform: uppercase; margin: 0 0 20px;}
.services-listing-content p {color: #9B9B9B;}
.services-listing-content ul { padding: 0; list-style: none; margin: 0 0 35px;}

.services-listing-content ul li { font-family: Satoshi; font-weight: 500; font-size: 14px; line-height: 22px; letter-spacing: 0px; text-transform: uppercase; margin: 0 0 6px; position: relative; padding: 0 0 0 30px;}
.services-listing-content ul li::before { content: ""; background-image: url(../assets/images/check-icon.svg); position: absolute; left: 0; top: 7px; width: 12px; height: 9px;}
.services-listing-content .services-card-shot-content { margin: 0 0 25px;}
.services-card-image img { border-radius: 10px; width: 100%;}
.services-card-blocks { padding: 0 10% 0 0; width: 100%;}
.services-card-image { width: 100%;}
.services-listing-grid { display: flex; flex-direction: column; gap: 60px;}
.services-listing-grid .pin-spacer:nth-child(2n) .services-card-blocks { padding: 0 0 0 10%;}
.overlapping-services-boxs { will-change: transform;}

/* ================= Services Listing Section End ================= */

.call-us-content h2 { margin: 0 0 40px;}


/* ================= Services Page End ================= */



/* ================= Contact Page Start ================= */


/* ================= Contact Banner Section Start ================= */

.contact-banner-section .about-banner-image {text-align: right; position: relative; z-index: 1;}
.contact-banner-section::after { position: absolute; right: 0; bottom: 0; width: 196px; height: 196px; content: ""; background: linear-gradient(167.44deg, #0BC7FF 9.95%, #DB0EFE 94.31%); filter: blur(434px);}
.contact-banner-section { position: relative;}

/* ================= Contact Banner Section End ================= */


/* ================= Contact Page Form Section Start ================= */

.contact-page-form-section { padding: 50px 0;}
.contact-page-form-section .contact-info-boxs { padding: 0 10% 0 0;}
.contact-page-form-section .footer-form-info{ padding: 0px;}
.contact-info-boxs h3 { margin: 0 0 40px;}
.contact-info-boxs p { margin: 0 0 30px;}
.contact-info-boxs .contact-our-partner-logo h5 { font-family: Satoshi; font-weight: 500; font-size: 14px; line-height: 20px; letter-spacing: 0.8px; text-transform: uppercase; margin: 0 0 32px;}
.contact-info-boxs .contact-our-partner-logo { margin: 50px 0 0;}
.contact-info-boxs .partner-logo-items ul { max-width: 580px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 0; list-style: none;padding: 0;width: 100%;}
.contact-info-boxs .partner-logo-items ul li { width: 100%;}



.contact-map-section { padding: 50px 0;}
.contact-map-block img { width: 100%;}
.contact-map-info-boxs { position: absolute; left: 30px; top: 50%; transform: translateY(-50%); background-image: url("../assets/images/contact-map-bg.png"); border-radius: 10px; padding: 80px 30px 50px; background-position: center; background-size: cover;max-width: 550px; width: 100%;}
.contact-map-info-boxs h3 { font-weight: 500; letter-spacing: 0; text-transform: uppercase; margin: 0 0 20px;}
.contact-map-info-boxs ul { margin: 0; list-style: none; padding: 0;}
.contact-map-info-boxs ul { margin: 0; list-style: none; padding: 0;}
.contact-map-info-boxs ul li { font-family: Satoshi; font-weight: 500; font-size: 18px; line-height: 30px; letter-spacing: 0;  padding: 0 0 10px;}
.contact-map-info-boxs ul li:last-child { padding: 0;}
.contact-map-info-boxs ul li span { color: #9B9B9B;}
.contact-map-info-boxs ul li:nth-child(3) { display: flex; gap: 5px;}

/* ================= Contact Page Form Section End ================= */


/* ================= Contact Page End ================= */




/* =================Services Inner Page Start ================= */



/* ================= Service Quote Section Start ================= */

.service-quote-section { padding: 50px 0;}
.service-quote-section .container { max-width: 80%;}
.services-quote-text { font-family: Satoshi; font-weight: 400; font-size: 44px; line-height: 60px; letter-spacing: 0; text-align: center; position: relative;}

.gradinet-text-1 { background-image: var(--gradient-1); margin: 0; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.gradinet-text-2{background-image: var(--gradient-2); margin: 0; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.service-quote-block .book-call-btns { text-align: center; padding: 45px 0 0;}


.services-quote-text::before { content: ""; background-image: url("../assets/images/left-quote.svg"); width: 57px; height: 41px; display: inline-block; vertical-align: top; margin: -20px 15px 0px 0px;}
.services-quote-text::after { content: ""; background-image: url("../assets/images/right-quote.svg"); width: 57px; height: 41px; display: inline-block; vertical-align: middle; margin: 20px 0 0 15px;}


/* ================= Service Quote Section End ================= */


/* ================= Services Work Section Start ================= */

.services-work-section { padding: 50px 0;}
.services-work-content-block { position: relative; padding: 1px; width: 100%;}
.services-work-content-block .container { max-width: 1200px;}
.services-work-content-block::before { content: ""; position: absolute; top: 15px; left: 0; right: 0; padding: 1px 1px 1px 0px; background: linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: add, add; mask-composite: add, add; -webkit-mask-composite: xor; mask-composite: exclude; width: 95%; height: calc(100% + 100px); border-radius: 0 280px 280px 0px;}
.services-work-grids { position: relative; row-gap: 100px;}
.services-work-content-block:last-child::before { display: none;}
.services-how-work-rows { position: relative;}

/* ================= Services Work Section End ================= */

/* ================= Services Get Section Start ================= */

.services-get-section { padding: 50px 0;}
.services-get-title-box .services-get-title-block { padding: 0 0 60px;}
.services-get-title-box { padding: 0 0 80px;}
.inner-services-list-1 { background-image: url("../assets/images/web-development-back-bg.png");}
.inner-services-list-2 { background-image: url("../assets/images/website-maintenances-back-bg.jpg");}
.inner-services-list-3 { background-image: url("../assets/images/e-commerce-tab-image.jpg");}
.inner-services-list-4 { background-image: url("../assets/images/ui-ux-design-tab-image.jpg");}
.inner-services-list-5 { background-image: url("../assets/images/search-engine-back-bg.jpg");}

/* ================= Services Get Section End ================= */

/* ================= Services Inner Page End ================= */



/* ================= Blog Page End ================= */


/* ================= Blog Banner Section Start ================= */
.blog-banner-section .about-banner-image {text-align: right; position: relative; z-index: 1;} 
.blog-banner-section { position: relative;}
.blog-banner-section::after { position: absolute; right: 0; top: 0; width: 196px; height: 163px; content: ""; background: linear-gradient(55.42deg, #00B1FF 2.27%, #00FF79 99.23%); filter: blur(421px);}

/* ================= Blog Banner Section End ================= */

.blog-page-section { padding: 50px 0;}


/* ================= Blog Page End ================= */


/* ================= Project Page Start ================= */

/* ================= Project Banner Section Start ================= */

.project-banner-section .about-banner-image {text-align: right; position: relative; z-index: 1;}
.project-banner-section { position: relative;}
.project-banner-section::after { position: absolute; right: 0; bottom: 0; width: 388px; height: 204px; content: ""; background: linear-gradient(90deg, #FFDC4A 0.01%, #5DFF9A 49.01%, #4DDDFB 100.01%); filter: blur(472px);}

/* ================= Project Banner Section End ================= */


.main-project-section { padding: 50px 0;}


/* ================= Project Page End ================= */



/* ================= Project Single Page Start ================= */


/* ================= Single Project Banner Section Start ================= */

.single-project-banner .project-date { color: #9B9B9B; font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase; margin: 0 0 10px;}

/* ================= Single Project Banner Section End ================= */


/* ================= Project Info Section Start ================= */

.project-info-section { padding: 50px 0;}
.project-info-box .project-label { color: #9B9B9B; font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase; margin: 0 0 10px;}
.project-info-box .project-value { font-family: Satoshi; font-weight: 900; font-size: 24px; line-height: 24px; letter-spacing: 0; text-transform: uppercase; color: #fff;}
.project-info-section .project-info-broder { padding: 42px 0; border-style: solid; border-width: 1px 0; border-color: #161616;}
.project-info-section .project-info-grid { gap: 15px;}

/* ================= Project Info Section End ================= */



/* ================= Project Case Study Section Start ================= */


.project-casestudy-content { padding: 50px 0;}
.project-case-content-info .top-case-content { gap: 60px;}
.case-reveal-title h4 { font-family: Satoshi; font-weight: 900; font-size: 22px; line-height: 28px; letter-spacing: 0; text-transform: uppercase;}
.case-reveal-content p { color: #9B9B9B;}
.bottom-borders { border-bottom: 1px solid #161616; padding: 0 0 60px;}

.portfolio-case-reveal-items { gap: 60px; padding: 60px 0 0;}
.portfolio-image-blocks img { width: 100%; border-radius: 10px;}

/* ================= Project Case Study Section End ================= */


/* ================= More Work Section Start ================= */

.more-work-section { padding: 50px 0;  overflow: hidden;}
.more-work-section .more-work-title { padding: 0 0 60px;}
.more-work-items .more-work-image { position: relative; padding-top: 69%; border-radius: 10px;}
.more-work-items .more-work-image img { width: 100%; position: absolute; left: 0; right: 0; top: 0; height: 100%; object-fit: cover; border-radius: 10px;}
.more-work-items .more-work-meta-content { margin: 20px 0 0;}
.more-work-meta-content h5 { font-family: Satoshi; font-weight: 500; font-size: 22px; line-height: 22px; letter-spacing: 0; margin: 0 0 5px;}
.more-work-meta-content .project-categories { font-family: Satoshi; font-weight: 500; font-size: 12px; line-height: 15px; letter-spacing: 0.8px; text-transform: uppercase;color: #9B9B9B;}
.more-work-meta-content .project-categories a{ color: #9B9B9B;}
.more-work-title .scroll-content{display: flex; gap:5em; position: relative;}
.more-work-title .scroll-content h2{white-space: nowrap;}

.scroll-content:before,
.scroll-content:after{ content:""; position:absolute; top:0; width:15%; height:100%;  z-index:3; }
.scroll-content:before{ left:-5%; background:linear-gradient(to right, #000, transparent);}
.scroll-content:after{ right:-5%; background:linear-gradient(to left, #000, transparent);}

/* ================= More Work Section End ================= */


/* ================= Project Single Page End ================= */


/* ================= Get A Quote Modal Section Start ================= */

#get-a-quote-form .modal-dialog { max-width: 1000px;}
.get-a-quote-modal { background: #000; border: 0; border-radius: 20px; padding: 50px;}
.get-a-quote-modal .btn-close { background-image: none; border: 0; box-shadow: 0 0 0 transparent; outline: 0; width: 30px; height: 30px; opacity: 1;}
.get-a-quote-modal .modal-header { border: 0; padding:0px;}
.quote-form-title { text-align: center; padding: 0 0 50px;}
.quote-form-items { display: flex; flex-direction: column; gap: 40px;}
.quote-form-items .forms-title h4 { font-family: Satoshi; font-weight: 900; font-size: 24px; line-height: 1; letter-spacing: 0; text-transform: uppercase; margin: 0;}
.quote-form-items .form-group input[type="text"], .quote-form-items .form-group input[type="tel"], .quote-form-items .form-group input[type="email"] { width: 100%; background: #0F0F0F; border: 0; border-radius: 10px; height: 68px; font-family: Satoshi; font-weight: 400; font-size: 15.3px; line-height: 100%; letter-spacing: 0%; vertical-align: middle; color: #fff; padding: 10px 22px; outline: 0;  box-shadow: 0 0 0 transparent;}
.quote-form-blocks .row { row-gap: 30px;}
.get-a-quote-modal .modal-body { padding: 0;}
.get-a-quote-modal .form-group p { font-family: Satoshi; font-weight: 500; font-size: 20px; line-height: 24px; letter-spacing: 0; margin: 0 0 20px;}
.quote-form-items .form-group textarea{ width: 100%; background: #0F0F0F; border: 0; border-radius: 10px; height: 150px; font-family: Satoshi; font-weight: 400; font-size: 15.3px; line-height: 100%; letter-spacing: 0; vertical-align: middle; color: #fff; padding: 22px; outline: 0; box-shadow: 0 0 0 transparent;}
.quote-form-items .form-group .form-check { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; padding: 0;  margin: 0;}
.quote-form-items .form-group .form-check label { position: relative; font-family: Satoshi; font-size: 16px; line-height: 20px; letter-spacing: 0; color: rgba(255,255,255,0.7); padding: 0 0 0 30px;  cursor: pointer;}
.quote-form-items .form-group .form-check label input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.quote-form-items .form-group .form-check label span::before { position: absolute; left: 0; top: 2px; content: ""; width: 16px; height: 16px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.7);}
.quote-form-items .form-group .form-check label span::after { left: 6px; top: 4px; width: 5px; height: 10px; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); content: ""; position: absolute; border-style: solid; border-width: 0 2px 2px 0; display:none;}
.quote-form-items .form-group .form-check input:checked ~ span::after { display: block;}
.submit-now-btns { text-align: center;}
.submit-now-btns button { font-family: Satoshi; font-weight: 700; font-size: 16px; line-height: 24px; letter-spacing: 0; vertical-align: middle; width: 100%; max-width: 548px; border: 0; border-radius: 100px; padding: 12px 10px; display: inline-block; box-shadow: 0 0 0 transparent; outline: 0;}


/* ================= Get A Quote Modal Section End ================= */



/* ================= Responsive Styles Start ================= */

@media(min-width:991px){
	
.container{ max-width:96%;}		
	
}

@media(min-width:768px){
.project-item-info:nth-child(1) { grid-column: span 3; }
.project-item-info:nth-child(2) { grid-column: span 2; }
.project-item-info:nth-child(3) { grid-column: span 5; } 
.project-item-info:nth-child(n+4):nth-child(4n+0) { grid-column: span 2; } 
.project-item-info:nth-child(n+4):nth-child(4n+1) { grid-column: span 3; } 
.project-item-info:nth-child(n+4):nth-child(4n+2) { grid-column: span 3; } 
.project-item-info:nth-child(n+4):nth-child(4n+3) { grid-column: span 2; } 
	
}

@media(max-width:1600px){

.header-phone-number ul{ gap: 16px;}
.header-menu ul.navbar-nav li a{ font-size: 16px; padding: 10px 20px !important;}
.header-phone-number ul li.contact-btns a, .header-phone-number .login-btns a { padding: 12px 25px;}
.header-phone-number ul a{ font-size: 16px;}	
h1, h2, .footer-contact-info .let-work-text{ font-size: 90px;}
.banner-content-info h1 { margin: 0 0 50px;}
.work-content-items, .trusted-content-info {max-width: 90%;}
.about-services-image { padding: 0%;}
	
}

@media(max-width:1440px){



.header-menu ul.navbar-nav li a{ font-size: 16px; padding: 10px 18px !important;}
.header-phone-number ul li.contact-btns a, .header-phone-number .login-btns a { padding: 10px 20px; font-size: 14px;}


h1, h2, .footer-contact-info .let-work-text{ font-size: 70px;}	
.tab-right-image{ padding: 30px 40px 30px 0px;}	
.service-tab-menu{ padding: 30px 15px;}
.service-tab-menu ul.nav-tabs li button.nav-link{ padding: 10px 25px; font-size: 15px;}
.project-grid-items{ gap: 80px;}
.latest-project-title-box { padding: 0 0 50px;}

.latest-project-section .view-more-btns{ padding: 60px 0 0;}	
.related-article-title { padding: 0 0 50px;	}
	
/* Footer Faq */
.footer-form-info, .contact-page-form-section .contact-info-boxs { padding-right: 5%;}	
.footer-faq-accordion .accordion-item .accordion-button { gap: 50px;}
.call-us-content { max-width: 100%; padding: 0;}
.testimonials-card-body p{ font-size: 18px; line-height: 24px;}	


.services-card-blocks, .services-listing-grid .pin-spacer:nth-child(2n) .services-card-blocks{ padding: 0;}
.services-get-title-box { padding: 0 0 50px;}
.services-get-title-box .services-get-title-block{  padding: 0 0 50px;}

	
}

@media(max-width:1300px){

.header-phone-number ul a { font-size: 14px; }
.header-menu ul.navbar-nav li a { font-size: 14px; padding: 8px 15px !important; }
.services-work-content-block .container { max-width: 80%;}
.services-work-grids{   row-gap: 60px;}
.services-work-content-block::before {height: calc(100% + 60px);}

.services-quote-text{ font-size: 36px; line-height: 50px;}
	
}



@media(max-width:1199px){
	
	

h1, h2, .footer-contact-info .let-work-text { font-size: 50px;}
h3 { font-size: 40px; line-height: 50px;}

/* Header Responsive Css */

.header-section { padding: 20px 10px;}
.header-grid-block { display: flex; justify-content: space-between; gap: 10px;}
.header-menu { display: flex; align-items: center; gap: 20px;}
.header-section .header-menu .navbar-toggler { padding: 0; outline: 0; box-shadow: 0 0 0 transparent; border: 0;}
.header-section .header-menu .navbar-toggler-icon { background-image: url(../assets/images/menu-icon.svg); width: 40px; height: 29px; padding: 0; background-size: 40px; display: flex; align-items: center;}
.header-section .header-menu button[aria-expanded="true"] .navbar-toggler-icon { background-image: url(../assets/images/close-icon.svg); height: 29px; background-size: 29px;}
.header-menu-section { padding: 0px 0; position: fixed; left: 0;  right: 0; top: 105px;  background: #1a1a1a; width: 100%; z-index: 1021; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; transition: all .5s ease; overflow-y: auto; height: calc(100% - 94px);}
.header-menu ul.navbar-nav { width: 100%; border: 0; background: transparent; padding: 0;}
.header-menu ul.navbar-nav li a::before{ display:none;}
.sub-mega-menu { display: none;}
.wpmenu_icon { position: absolute; right: 15px; top: 0; width: 50px; height: 55px; display: flex; justify-content: center; align-items: center; cursor: pointer;}
.wpmenu_icon img { max-width: 18px; width: 100%;}
.header-menu ul.navbar-nav li a { border-bottom: 1px solid rgba(255,255,255,0.3); padding: 10px 20px 16px !important; font-size: 18px; line-height: 28px;}
.header-menu ul.navbar-nav li.dropdown-menu-items { position: relative;}
.sub-mega-menu.active { display: block; padding: 0;}
.mega-menu-content { padding: 20px 30px;}

.header-menu ul.navbar-nav li.dropdown-menu-items a#navbarDropdown::after{ display:none;}
.header-menu-section::before { content: ""; position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 2px; background-image: linear-gradient(60.77deg, #8F6DFC 24.23%, #F0D5ED 59.48%, #F4BF01 124.53%);}

a.header-login-btns { text-transform: uppercase; font-size: 14px; line-height: 20px; background: transparent; display: inline-block; padding: 10px 25px; border-radius: 50px; border: 1px solid #fff; color: #fff;}
a.header-quote-btns { text-transform: uppercase; font-size: 14px; line-height: 20px; background: #fff; display: inline-block; padding: 10px 25px; border-radius: 50px; border: 1px solid #fff; color: #000;}
.header-phone-text { display: flex; align-items: center; gap: 20px;}

/* Header Responsive Css End */



.banner-short-content, .banner-content-info p, .work-content-items, .trusted-content-info{ max-width: 100%;}
.about-banner-section, .inner-page-banner{padding: 50px 0 30px;}
.service-quote-section, .services-work-section, .services-get-section, .blog-page-section  { padding: 30px 0px;}
.how-we-work-section, .about-trusted-section, .about-website-section, .about-choose-section, .about-team-section{ padding:30px 0;}
.center-title-block, .brand-title-box{ padding: 0 0 50px;}
.about-services-box {padding: 0%;}
.website-content-block{ padding: 30px;}
.about-services-listing { gap: 24px;}
.team-card-info .team-card-name{ font-size: 20px;}
.team-card-info .team-card-position{ font-size: 18px;}
.team-card-items .team-card-info { padding: 20px;}


.services-tab-content-info .accordion-item .accordion-body{   padding: 30px 25px;}
.tab-right-colm{ width: 68%;}
.tab-left-colm{width: 32%;}

.banner-content-info h1 { margin: 0 0 30px;}
.banner-content-info{ padding-right: 0;}
.icon-block-card-items .icon-content-card{ max-width: 100%;}
.icon-title-text{ font-size: 20px;}
.hm-about-content-info .abouts-btns { margin: 30px 0 0;}
.hm-about-content-info h3 { margin: 0 0 20px;}
.testimonials-card-body .testimonials-content-boxs{ max-width:100%;}
.card-scrolling-items .testimonials-card-boxs{ padding: 20px;}
.card-scrolling-items { height: 600px;}
.call-section-bg::before {filter: blur(10px);}
/* Footer Faq */
.footer-faq-accordion .accordion-item .accordion-button { gap: 30px; font-size: 16px;}	
.footer-faq-accordion .accordion-item .accordion-button{ padding: 26px 30px 25px 0px;}
.footer-info-section { padding: 30px 0 0;}
.our-partner-section, .footer-contact-section, .call-us-section, .related-article-section, .testimonials-scrolling-section, .brand-section, .latest-project-section, .services-tabs-section, .hm-about-section, .main-project-section { padding:30px 0;}
.banner-section { padding: 50px 0 30px;}
.banner-logo-section, .second-logo-carousel{ padding:30px 0;}
.footer-form-info .form-group input[type="text"], .footer-form-info .form-group input[type="email"], .footer-form-info .form-group input[type="tel"], .footer-form-info .form-group select{ height: 56px;}

.call-us-section .container { max-width: 96%;}
.services-listing-content ul li{font-size: 12px; line-height: 20px;}
.services-listing-content ul li::before {top: 6px;}
.services-listing-content h3{ font-size: 20px; line-height: 26px;}
.services-listing-grid{ gap: 40px;}
.services-listing-content ul{  margin: 0 0 20px;}
.contact-page-form-section .contact-info-boxs{padding: 0%;}

.contact-page-form-section, .contact-map-section { padding: 30px 0;}

.contact-map-info-boxs { max-width: 450px; padding: 50px 30px;}
.service-quote-section .container { max-width:90%;}
.services-get-title-box .services-get-title-block { padding: 0 0 30px;}

.services-work-content-block::before {width: 98%;}


.project-info-section, .project-casestudy-content, .more-work-section { padding: 30px 0;}

/* Popup Css */
#get-a-quote-form .modal-dialog { max-width: 800px;}
.get-a-quote-modal{ padding: 40px;}
.quote-form-items .form-group input[type="text"], .quote-form-items .form-group input[type="tel"], .quote-form-items .form-group input[type="email"]{ height: 56px;}
.quote-form-items .forms-title h4{ font-size: 20px;}
	
}

@media(min-width:992px){
	
.header-menu .sub-mega-menu { position: absolute; top: calc(100% + 30px); transform: translateY(20px); z-index: 99999; left: 0; opacity: 0; visibility: hidden; transition: opacity 0.3s, transform 0.3s, visibility 0.3s ease; pointer-events: none; width: 100%; min-width: 900px; padding: 30px; background: #1A1A1A; border: 1px solid #3F3F3F; border-radius:40px;}

.header-menu ul.navbar-nav li.dropdown-menu-items:hover .sub-mega-menu{display: block;  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0px);}
.header-menu .sub-mega-menu::before { content: ""; height: 40px; width: 100%; position: absolute; top: -40px; left: 0;}
.header-menu .mega-menu-items { max-width: 240px;}

.sub-mega-menu .mega-menu-row { display: grid; grid-template-columns: auto auto auto; gap: 40px 30px;}	
	
	
}

@media(min-width:991px) and (max-width:1199px){

.header-menu .sub-mega-menu {min-width: 780px;}	
.sub-mega-menu .mega-menu-row{ gap: 30px 20px;}	
}


@media(max-width:991px){
body, p {font-size:16px;}
h1, h2, .footer-contact-info .let-work-text { font-size: 50px;}
body{ padding: 108px 0 0;}

.header-phone-text{ gap: 16px;}


 .our-partner-section, .footer-contact-section, .call-us-section, .related-article-section, .testimonials-scrolling-section, .brand-section, .latest-project-section, .services-tabs-section, .hm-about-section { padding: 30px 10px;}
 .how-we-work-section, .about-trusted-section, .about-website-section, .about-choose-section, .about-team-section { padding: 30px 10px;}
.tab-right-colm { width: 100%; padding: 0;} 
.tab-left-colm { width: 100%;}  
.service-tab-menu ul.nav-tabs li { width: auto;}
.service-tab-menu { padding: 0 0 30px; border: 0; background: transparent;}
 .service-tab-menu ul.nav-tabs li button.nav-link { border: 1px solid #3F3F3F; background: #0A0A0A;}
 .service-tab-menu ul.nav-tabs li button.nav-link.active, .service-tab-menu ul.nav-tabs li button.nav-link:hover{ border-color:#fff;}
.second-logo-carousel .logo-blocks, .logo-blocks{ min-height: 150px;}
.hm-about-content-info {padding: 30px 0 0;}
.services-title-block { max-width: 100%; text-align: center; padding: 0 0 30px;}
.tab-service-title-box { padding: 0 0 50px;}
.project-grid-items { gap: 50px 40px;}
.call-us-section .container, .hm-about-section .container, .container { max-width: 100%;}
.brand-grid-boxs{ grid-template-columns: repeat(2, 1fr);}
.brand-title-block { padding: 0 0 30px; text-align: center;}
.services-short-info, .latest-project-title-box .services-short-info { max-width: 500px; margin: 0 auto; text-align: center;}
.brand-title-box { padding: 0 0 50px;}
.latest-project-title-box { padding: 0 0 50px;}
.latest-project-title-box .latest-title-block { padding: 0 0 30px; text-align: center;}
.card-scrolling-items { height:500px;}
.footer-form-info .form-top-content { max-width: 100%; margin: 0 0 40px;}
.footer-faq-accordion { margin: 0;}	
 .footer-form-info { padding: 0 0 50px;}
.footer-contact-info .let-work-text { font-size: 60px; line-height: 1; }		
.footer-contact-info { max-width: 500px;}
.partner-logo-items ul li { width: auto; height: 100px; padding: 20px;}
.partner-logo-items ul { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 20px; justify-content: center !important;}	
.testimonials-scrolling-grid { grid-template-columns: repeat(2, 1fr);}
	
 .brand-title-block { padding: 0 0 20px;}
.how-work-content-info::before { display:none;}	
.website-content-block { padding: 20px;}	
.about-services-title { font-size: 16px;}
  
.contact-info-boxs p { margin: 0 0 20px;} 
.contact-info-boxs .contact-our-partner-logo h5{ margin: 0 0 25px;}
.contact-info-boxs .contact-our-partner-logo { margin: 30px 0 0;} 
.contact-page-form-section, .contact-map-section { padding: 30px 10px;} 
.contact-map-info-boxs ul li{font-size: 16px;line-height: 24px;} 
.contact-map-info-boxs{ padding: 40px 30px;}
.contact-map-info-boxs h3{ margin: 0 0 15px;}
.contact-info-boxs h3 { margin: 0 0 30px;}
.contact-page-form-section .contact-info-boxs{padding: 0 0 40px;}
.services-quote-text { font-size: 30px; line-height: 40px;}
.services-quote-text::before { position: absolute;  background-size: 40px; background-repeat: no-repeat; width: 40px; height: 30px;  margin: 0; left: 0; top: 0;}
.services-quote-text::after { position: absolute; background-size: 40px; background-repeat: no-repeat; width: 40px; height: 30px;  margin: 0; right: 0; bottom: 0;}
.service-quote-section .container { max-width: 100%;}
.service-quote-block .services-quote-text { padding: 0 50px;}
.about-banner-section, .inner-page-banner{padding: 50px 10px 30px;}
.service-quote-section, .services-work-section, .services-get-section, .blog-page-section, .main-project-section   { padding: 30px 10px;}
.services-get-section .services-short-info { text-align: left; max-width: 100%;}

.project-info-section .project-info-broder{ padding: 40px 10px;}
.project-casestudy-content, .more-work-section{ padding:30px 10px;}
.project-case-content-info .top-case-content { gap: 40px;}
.bottom-borders{ padding: 0 0 40px;}
.portfolio-case-reveal-items { gap: 40px; padding: 40px 0 0;}
.more-work-section .more-work-title { padding: 0 0 40px;}


/* Popup form Css */
.get-a-quote-modal{ padding: 40px 30px;}


	
}


@media(max-width:767px){	

body{ padding: 94px 0 72px;}
.header-logo img { max-width: 150px;}
.header-menu-section { top:94px;}

.footer-btns { position: fixed; left: 0; right: 0; bottom: 0; z-index: 99; background: #000; padding: 15px 10px;}
.footer-btns .quote-login-btns { gap: 15px;}
.footer-btns .quote-login-btns a { width: 50%; text-align: center;}

h1, h2, .footer-contact-info .let-work-text { font-size:40px;}
.brand-title-box { padding: 0 0 30px;}
.container { max-width: 100%;}
 h3 {font-size: 30px; line-height: 40px;}
.banner-content-info { padding: 0 0 40px;} 
 .second-logo-carousel .logo-blocks{min-height: 120px;}
.tab-right-image { display: none;}
.services-tabs-conatent p { color: #FFF;} 
.logo-blocks { min-height: 100px; width: 200px;} 
.banner-logo-section .logo-blocks img { height: 50px; object-fit: contain;}

/*  .services-tab-content-info .tab-content > .tab-pane { display: block; opacity: 1;}  */
 
 
 .project-grid-items{ grid-template-columns: repeat(1, 1fr);  gap: 40px;}
 .project-item-info:nth-child(3) .project-item-boxs { max-width: 100%;}
 .project-item-info:nth-child(3n+2) .project-post-thumbnail { padding-top: 67.55%;}
 .testimonials-scrolling-grid{ grid-template-columns: repeat(1, 1fr);}
.brand-grid-boxs { grid-template-columns: repeat(1, 1fr); gap:20px;}
 .icon-block-card-items{ min-height: inherit;}
/* Footer Css */
.footer-contact-info {max-width: 100%; }
.footer-contact-info .let-work-text{ font-size: 40px; margin: 0 0 30px;}
.footer-contact-info .let-work-text { font-size: 40px;}
.footer-menu-items{max-width: 500px; gap: 50px;   padding: 50px 0 0;   margin: 0;  justify-content: space-between;}
.footer-contact-info .footer-logo { margin: 0 0 30px;}	
.footer-faq-accordion .accordion-item .accordion-button { padding: 20px 30px 20px 0px; font-size: 14px;}	
.partner-logo-items ul li { width: auto; height: 80px; padding: 20px;}
.team-card-info .team-card-name { font-size: 16px; margin: 0 0 5px;}
.team-card-info .team-card-position { font-size: 15px;}
.team-card-items .team-card-info { padding: 20px 15px; }
.how-work-rows { row-gap: 50px;}
.center-title-block, .brand-title-box { padding: 0 0 40px;}
.about-services-box { padding: 0 0 40px;}
.services-listing-blocks:nth-child(2n) .services-listing-card .row { flex-direction: column-reverse;}
.about-banner-section, .inner-page-banner{padding: 50px 10px 30px;}
.services-banner-section .about-banner-image { text-align: center;}
.services-listing-content {  margin: 0 0 30px; padding: 20px;}
.services-listing-card { padding: 25px 20px;}
.contact-banner-section .about-banner-image { text-align: center;}
.contact-info-boxs h3 { margin: 0 0 25px;}
.contact-map-info-boxs { position: unset; transform: inherit; margin: 0 0 30px;max-width: 550px; padding: 40px 25px;}
 .service-quote-section .container, .services-work-content-block .container { max-width: 100%; }
.services-quote-text { font-size: 24px; line-height: 34px;}
.services-work-content-block::before{ display:none;}
.services-work-content-block .work-content-items { background: #0A0A0A; padding: 40px 20px; border-radius: 10px;}	
.services-how-work-rows, .services-work-grids { row-gap: 20px;}
	
.blog-banner-section .about-banner-image, .project-banner-section .about-banner-image { text-align: center;}	
.blog-banner-section::after { top: auto; bottom: 0;}	
	
.more-work-content-block .row {row-gap: 40px;}	
.project-info-section .project-info-grid { display: grid !important; grid-template-columns: repeat(2, 1fr); justify-content: inherit !important;  gap: 20px 20px;}
.project-info-box .project-value, .case-reveal-title h4{ font-size: 20px; line-height: 1;}	
/* Popup form Css */
.get-a-quote-modal{ padding: 40px 20px;}	
.quote-form-items .form-group .form-check { grid-template-columns: repeat(1, 1fr); gap: 12px;}
.get-a-quote-modal .form-group p, .quote-form-items .forms-title h4{ font-size: 18px;}	
.quote-form-blocks .row {row-gap: 25px;}	
.quote-form-items .form-group textarea{ height: 100px;}	
.quote-form-title{ padding: 0 0 30px;}	

	
	
}