@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
 :root{
     --bg-1: #FFFFFF;
     --bg-2: #F9F9F9;
     --secondary: #20282D;
}
 body{
    background-color: var(--bg-2);
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     font-family: "Inter", sans-serif;
}
 ul,ol{
     padding: 0;
     margin: 0;
}
 li{
     list-style: none;
}
 h1,h2, h3,h4, h5,h6,p{
     padding: 0;
     margin: 0;
}
 a{
     text-decoration: none;
}

section{
    padding: 70px 0px 90px 0px;
}


/* ===== ALL SECTION TITLE START ===== */
 .all_section_header{
     margin: 0;
     margin-bottom: 20px;
}
 .all_section_header .sectionTitle {
     font-size: 120px;
     color: transparent;
     -webkit-text-stroke: 1px #141a272f;
     text-align: center;
     user-select: none;
}
 .all_section_header .title{
     text-align: center;
     margin-top: -70px;
}
 .all_section_header .title .sectionSubTitle{
     text-transform: uppercase;
     font-size: 12px;
     margin-bottom: 15px;
}
 .all_section_header .title .sectionSlogan{
     font-size: 30px;
     font-weight: 600;
}
/* ===== ALL SECTION TITLE END ===== */
/* ===== TOP HEADER START ===== */
 .top_header{
     position: sticky;
     top: 0;
     background-color: #111;
     z-index: 99999;
     color: #fff;
     display: flex;
     align-items: center;
     height: 40px;
}
 .top_header .top_header_wrapper{
     display: flex;
     justify-content: space-between;
     align-items: center;
}
 .top_header .top_header_wrapper .contact_area{
     display: flex;
     gap: 20px;
     justify-content: center;
     align-items: center;
}
 .top_header .top_header_wrapper .contact_area li{
     font-size: 13px;
}
 .top_header .top_header_wrapper .contact_area li.line{
     height: 15px;
     width: 1px;
     background-color: white;
}
 .top_header .top_header_wrapper .menu_area{
     display: flex;
     gap: 20px;
     justify-content: center;
     align-items: center;
}
 .top_header .top_header_wrapper .menu_area li a{
     font-size: 13px;
}
 .top_header .top_header_wrapper .menu_area li a{
     height: 15px;
     width: 1px;
     color: white;
}
/* ===== TOP HEADER END ===== */
/* ===== HEADER START ===== */
 nav{
     position: sticky;
     top: 40px;
     z-index: 999999;
     width: 100%;
     background: #ffffff;
}
 nav .wrapper{
     position: relative;
     max-width: 1180px;
     padding: 0px 30px;
     height: 70px;
     line-height: 70px;
     margin: auto;
     display: flex;
     align-items: center;
     justify-content: space-between;
}
 .wrapper .logo a img{
     width: 180px;
}
 .wrapper .nav-links{
     display: inline-flex;
}
 .nav-links li{
     list-style: none;
}

.mobile_get_solution_btn{
    background-color: black;
    display: none;
}

.mobile_get_solution_btn a{
    color: white !important;
}


 .nav-links li a{
     color: #000000;
     text-decoration: none;
     font-size: 14px;
     font-weight: 500;
     padding: 9px 15px;
     border-radius: 5px;
     transition: all 0.3s ease;
     position: relative;
}
 .nav-links li a .down_arrow{
     position: absolute;
     right: 0px;
     top: 55%;
     transform: translate(-50%,-50%);
}
 .nav-links .mobile-item{
     display: none;
}
 .nav-links .drop-menu{
     position: absolute;
     background: #ffffff;
     width: 180px;
     line-height: 45px;
     top: 85px;
     opacity: 0;
     visibility: hidden;
     box-shadow: 0 6px 10px rgba(0,0,0,0.15);
}
 .nav-links li:hover .drop-menu, .nav-links li:hover .mega-box{
     transition: all 0.3s ease;
     top: 70px;
     opacity: 1;
     visibility: visible;
}
 .drop-menu li a{
     width: 100%;
     display: block;
     padding: 0 0 0 15px;
     font-weight: 400;
     border-radius: 0px;
}
 .mega-box{
     position: absolute;
     left: 0;
     width: 100%;
     padding: 0 30px;
     top: 85px;
     opacity: 0;
     visibility: hidden;
}


.megamenu_header{
    display: flex;
    gap: 10px;
    align-items: center;
    border-radius: 0px !important;
    padding: 0px 15px !important;
    border-bottom: 1px solid black;
}


 .mega-box .content{
     background: #ffffff;
     padding: 25px 20px;
     display: flex;
     align-items: flex-start;
     width: 100%;
     height: 400px;
     justify-content: space-between;
     box-shadow: 0 6px 10px rgba(0,0,0,0.15);
     overflow-y: scroll;
}
 .mega-box .content .row{
     width: calc(20%);
     line-height: 45px;
}



 .content .row .mega-links{
     border-left: 1px solid rgba(255,255,255,0.09);
     padding: 0;
}
 .row .mega-links li{
    
     width: 100%;
}
 .row .mega-links li a{
     color: #000000;
     line-height: normal;
     font-size: 13px;
     display: block;
     position: relative;
     padding: 10px 20px;
}
 .row .mega-links li a::before{
     position: absolute;
     content: '';
     bottom: 0;
     left: 0;
     background-color: rgba(228, 226, 226, 0.61);
     height: 1px;
     width: 100%;
}
 .row .mega-links li a::after{
     position: absolute;
     content: '';
     bottom: 0;
     left: 0;
     background-color: #1F1F1F;
     height: 1px;
     width: 0%;
     transition: all .3s ease;
}
 .row .mega-links li a:hover:after{
     width: 100%;
}


 .row .mega-links li.megamenu-submenu-item a:hover::after{
    width: 0px;
}


.megamenu-submenu-item .megamenu-submenu{
    display: none;
}






 .get_quote_btn{
     background-color: #0a0a0a;
     color: #f0f0f0;
     padding: 15px 20px !important;
    border-radius: 5px;
    line-height: normal;
}


 .wrapper .btn{
     color: #fff;
     font-size: 20px;
     cursor: pointer;
     display: none;
}
 .wrapper .btn.close-btn{
     position: absolute;
     right: 30px;
     top: 10px;
}
 .mobileMenuOpenBtn{
     cursor: pointer;
}
 .mobile_menu_overlay{
     display: none;
}
 .mobileMenuOpenBtn{
     display: none;
}
/* ===== HEADER END ===== */
/* ===== BANNER START ===== */
 .banner {
     position: relative;
     width: 100%;
     height: 550px;
     overflow: hidden;
}
 .banner-item {
     position: relative;
     height: 550px;
     width: 100%;
}
 .banner-item img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 .slide-content {
     position: absolute;
     display: flex;
     flex-direction: column;
     justify-content: center;
     top: 50%;
     left: 50%;
     transform: translate(-50%,-50%);
     height: 100%;
     width: 80%;
     margin: 0 auto;
     text-align: left;
     color: white;
     z-index: 2;
     gap: 30px;
     padding: 0;
}

 .banner-title{
    max-width: 800px;
 }

 .banner-title, .banner-subtitle, .banner_buttons {
     opacity: 0;
     margin: 0;
     padding: 0;
     transform: translateY(50px);
}
.banner_buttons a{
    padding: 17px 35px;
    border-radius: 5px;
 }

 .animate .banner_buttons {
     opacity: 1;
     transform: translateY(0);
     transition: all 2s ease;
}
 .banner-title {
     font-size: 60px;
     padding: 0;
}
 .banner-subtitle {
     padding: 0;
     max-width: 700px;
}
 .animate .banner-title {
     opacity: 1;
     transform: translateY(0);
     transition: all 1s ease;
}
 .animate .banner-subtitle {
     opacity: 1;
     transform: translateY(0);
     transition: all 1.5s ease;
}
 .banner-item::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0,0,0,0.8);
     z-index: 1;
}
 .banner_buttons{
     margin-top: 10px;
     display: flex;
     gap: 20px;
}
 .slick-prev, .slick-next {
     position: absolute;
     top: 50%;
     z-index: 5;
     transform: translateY(-50%);
     background: white;
     color: black;
     border-radius: 50%;
     width: 40px;
     height: 40px;
     display: flex !important;
     justify-content: center;
     align-items: center;
     font-size: 20px;
     cursor: pointer;
     box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
     opacity: 0.8;
     transition: all 0.3s ease;
}
 .slick-prev:hover, .slick-next:hover {
     background: white;
    ;
     color: black;
}
 .slick-prev {
     left: 20px;
}
 .slick-next {
     right: 20px;
}
 .slick-prev::before, .slick-next::before {
     display: none;
}
/* ===== BANNER END ===== */
/* ===== CONTACT US START ===== */
 .contact{
     padding: 100px 0;
}
 .contact_wrapper {
     background: #fff;
     box-shadow: 0 8px 20px rgba(0,0,0,0.1);
     border-radius: 12px;
     overflow: hidden;
     display: flex;
     flex-wrap: wrap;
}
 .contact-info {
     flex: 1 1 40%;
     background: #1f2937;
     color: #fff;
     padding: 40px;
}
 .contact-info h2 {
     font-size: 28px;
     margin-bottom: 20px;
}
 .contact-info p {
     margin-bottom: 20px;
     line-height: 1.6;
}
 .contact-info .info {
     margin-top: 20px;
}
 .contact-info .info div {
     margin-bottom: 15px;
     display: flex;
     gap: 10px;
     align-items: center;
}
 .contact-info .info div .info_icon{
     margin-right: 10px;
     color: #1F2937;
     background-color: #fff;
     font-size: 18px;
     padding: 10px;
     border-radius: 5px;
}
 .contact-form {
     flex: 1 1 60%;
     padding: 40px;
}
 .contact-form h2 {
     font-size: 28px;
     margin-bottom: 20px;
     color: #1f2937;
}
 .contact-form form input, .contact-form form textarea {
     width: 100%;
     padding: 12px 15px;
     margin-bottom: 20px;
     border: 1px solid #ddd;
     border-radius: 6px;
     font-size: 16px;
}
 .contact-form form textarea {
     resize: vertical;
     height: 120px;
}
 .contact-form form button {
     padding: 12px 25px;
     background: #1f2937;
     color: #fff;
     border: none;
     border-radius: 6px;
     font-size: 16px;
     cursor: pointer;
     position: relative;
     z-index: 9;
     overflow: hidden;
}

 .contact-form form button::after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 0px;
    height: 0px;
     border: none;
     border-radius: 50%;
     background-color: #f71924;
     transition: 0.8s;
     z-index: -1;
}

 .contact-form form button:hover::after{
    width: 300px;
    height: 300px;
 }


 .contact-form form button:hover {
     background: #111827;
}
 @media (max-width: 768px) {
     .container {
         flex-direction: column;
    }
     .contact-info, .contact-form {
         flex: 1 1 100%;
         padding: 30px 20px;
    }
}
 .contact .map{
     margin-top: 50px;
}
 .contact .map iframe{
     width: 100%;
     height: 400px;
     border-radius: 10px;
}
/* ===== CONTACT US END ===== */

/* ===== SERVICES START ===== */
 .services{
     background-color: var(--bg-2);
}
 .services .services_items .item .box{
     display: flex;
     gap: 30px;
    /* background-color: white;
     */
     margin: 10px;
     padding: 40px;
     border-radius: 5px;
}
 .services .services_items .item .box img{
     width: 50px;
     height: 50px;
}
 .services .services_items .item .box p{
     font-size: 12px;
     margin: 15px 0;
     color: #69717A;
}
 .services .services_items .item .box a{
     font-size: 14px;
     color: #ffffff;
     background-color: #20282D;
     padding: 8px 10px;
     border-radius: 3px;
}
/* ===== SERVICES END ===== */
/* Dots container center */
 .slick-dots {
     display: flex !important;
     justify-content: center;
     gap: 10px;
     margin-top: 20px;
}
/* Each dot style */
 .slick-dots li button {
     width: 20px;
     height: 20px;
     border-radius: 50%;
     padding: 0;
     cursor: pointer;
     transition: all 0.3s ease;
     opacity: 0.8;
}
/* Dot inner circle */
 .slick-dots li button:before {
     content: "";
     width: 6px;
     height: 6px;
     background-color: #000000;
     border-radius: 50%;
     display: block;
     margin: auto;
     position: relative;
     top: 0px;
     transition: 0.3s;
}
/* Active dot border */
 .slick-dots li.slick-active button {
     border:1px solid #1F1F1F;
     opacity: 1;
}
/* Active dot inner */
 .slick-dots li.slick-active button:before {
     background-color: transparent;
     border: 1px solid #1F1F1F;
}
 .slick-slide.slick-current.slick-active .box{
     background-color: #FFFFFF;
}
/* ===== TEAM MEMBERS START ===== */
 #team{
     background-color: var(--bg-1);
}
 #team .team_items .team_item .team_item_box{
     background-color: rgb(255, 255, 255);
     display: flex;
     align-items: center;
     padding: 30px;
     border-radius: 10px;
     margin: 20px;
     gap: 30px;
     box-shadow: 0 0 10px 0 rgba(128, 128, 128, 0.096);
}
 #team .team_items .team_item .team_item_box .team_item_image img{
     width: 150px;
     height: 150px;
     border-radius: 50%;
}
 #team .team_items .team_item .team_item_box .team_item_content .name{
     font-size: 25px;
     font-weight: bold;
}
 #team .team_items .team_item .team_item_box .team_item_content .designation{
     font-size: 15px;
     color: gray;
     font-weight: 600;
     margin: 10px 0;
}
 #team .team_items .team_item .team_item_box .team_item_content .experience{
     font-size: 13px;
     color: gray;
     font-weight: 600;
}
/* ===== TEAM MEMBERS END ===== */
 #review{
     background-color: white;
     padding: 80px 0;
}
 #review .stroke-text{
     text-align: left;
}
 .slider-container {
     margin: auto;
     overflow: hidden;
}
 .slider-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 25px 0;
}
 .slider-header h2 {
     margin: 0;
     font-size: 28px;
     color: #212529;
}
 .slider-controls {
     display: flex;
     align-items: center;
     gap: 15px;
}
 .testimonial-counter {
     background: #212529;
     color: #fff;
     padding: 5px 12px;
     border-radius: 20px;
     font-size: 14px;
     min-width: 70px;
     text-align: center;
}
 .slick-arrow-custom {
     background: #F2F2F2;
     color: #2b2b2b;
     border: none;
     border-radius: 50%;
     width: 35px;
     height: 35px;
     display: flex;
     justify-content: center;
     align-items: center;
     cursor: pointer;
     transition: background 0.3s;
     font-size: 14px;
}
 .testimonial-slide {
     display: flex !important;
     flex-direction: row;
     align-items: stretch;
}
 .testimonial-image {
     flex: 0 0 40%;
     background-size: cover;
     background-position: center;
     min-height: 380px;
}
 .testimonial-right {
     flex: 1;
     background: #212529;
     color: #fff;
     padding: 50px 40px;
     display: flex;
     flex-direction: column;
     justify-content: center;
}
 .testimonial-text {
     font-size: 20px;
     line-height: 1.6;
     margin-bottom: 25px;
}
 .testimonial-author {
     font-weight: 600;
     font-size: 16px;
     margin-bottom: 4px;
}
 .testimonial-position {
     font-size: 14px;
     color: #999;
}
 @media(max-width: 768px) {
     .testimonial-slide {
         flex-direction: column;
    }
     .testimonial-image {
         min-height: 250px;
    }
     .testimonial-right {
         padding: 30px 20px;
    }
     .slider-header {
         flex-direction: column;
         align-items: flex-start;
         gap: 15px;
    }
}
/* ===== ABOUT US START ===== */
 #about{
     background-color: var(--bg-1);
}
 .about-section {
     display: flex;
     flex-wrap: wrap;
     gap: 40px;
     align-items: center;
     justify-content: center;
     max-width: 1200px;
     margin: auto;
}
 .left-content {
     position: relative;
     flex: 1 1 450px;
     min-width: 300px;
}
 .left-content img.main-img {
     width: 100%;
     border-radius: 10px;
}
 .experience-box {
     position: absolute;
     top: 20px;
     left: 20px;
     background-color: #000;
     color: #fff;
     padding: 20px;
     border-radius: 10px;
     text-align: center;
     z-index: 2;
}
 .experience-box h3 {
     font-size: 30px;
     font-weight: 700;
}
 .experience-box span {
     font-size: 14px;
     color: #ccc;
}
 .animated-img {
     position: absolute;
     bottom: 10px;
     right: -20px;
     width: 200px;
     border: 5px solid #fff;
     border-radius: 10px;
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
     animation: floatUpDown 3s ease-in-out infinite;
     z-index: 1;
}
 @keyframes floatUpDown {
     0% {
         transform: translateY(0px);
    }
     50% {
         transform: translateY(-15px);
    }
     100% {
         transform: translateY(0px);
    }
}
 .right-content {
     flex: 1 1 400px;
}
 .right-content small {
     color: #888;
     font-weight: 600;
     letter-spacing: 2px;
}
 .right-content h2 {
     font-size: 32px;
     font-weight: 700;
     margin: 10px 0 20px;
     color: #111;
}
 .right-content p {
     font-size: 15px;
     line-height: 1.7;
     color: #555;
     margin-bottom: 20px;
}
 .feature-list {
     list-style: none;
     padding: 0;
     margin-bottom: 25px;
}
 .feature-list li {
     margin-bottom: 10px;
     font-size: 15px;
     color: #222;
}
 .feature-list li::before {
     content: '✔';
     margin-right: 10px;
     color: #007bff;
}
 .contact-box {
     display: flex;
     align-items: center;
     margin-bottom: 15px;
}
 .contact-icon i{
     background: #000;
     color: #fff;
     padding: 12px;
     border-radius: 10px;
     font-size: 16px;
     margin-right: 12px;
}
 .contact-text {
     font-size: 16px;
     color: #000;
}
 .signature {
     font-family: 'Great Vibes', cursive;
     font-size: 26px;
     color: #111;
}
 #about .about-section .all_section_header .sectionTitle{
     text-align: left;
}
 #about .about-section .all_section_header .title{
     text-align: left;
}

.about_page_text{
    background-color: rgb(255, 255, 255);
    font-size: 20px;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px 0 gray;
}

.about_page_text p{
    margin-bottom: 15px;
}
/* ===== ABOUT US END ===== */
/* ===== PROJECT START ====== */
 #project{
     background-color: var(--bg-1);
}
 .section-title small {
     color: #999;
     letter-spacing: 2px;
     font-weight: 600;
     text-transform: uppercase;
}
 .section-title h2 {
     font-weight: 700;
     color: #111;
     margin-top: 10px;
     margin-bottom: 40px;
}
 .project-slider-wrapper .slick-dots {
     position: absolute;
     top: -90px;
     right: 0;
     display: flex !important;
     justify-content: flex-end;
     height: 20px;
     gap: 10px;
}
 .slick-dots li {
     margin: 0;
}
 .slick-dots li button:before {
     font-size: 12px;
     color: #ccc;
     opacity: 1;
}
 .slick-dots li.slick-active button:before {
     color: #007bff;
}
 .project-card {
     position: relative;
     margin: 20px;
}
 .project-card img {
     width: 100%;
     height: 250px;
     object-fit: cover;
     border-radius: 10px;
     display: block;
}
 .project-overlay {
     position: absolute;
     bottom: 20px;
     left: 20px;
     background: #fff;
     padding: 20px;
     border-radius: 10px;
     max-width: 80%;
     box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
 .project-overlay h5 {
     font-weight: 600;
     color: #111;
     margin-bottom: 5px;
     font-size: 18px;
}
 .project-overlay span {
     font-size: 14px;
     color: #464646;
}
 @media (max-width: 768px) {
     .project-card img {
         height: 200px;
    }
     .project-overlay {
         padding: 15px;
    }
     .project-overlay h5 {
         font-size: 16px;
    }
     .project-slider-wrapper .slick-dots {
         top: -35px;
    }
}
/* ===== PROJECT START ====== */
 .page_banner{
     width: 100%;
     height: 200px;
     background: linear-gradient(#0000009d,#00000075), url('../img/all_page_banner.png');
     background-attachment: fixed;
     background-size: cover;
     background-position: center;
}
 .page_banner .page_banner_content{
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     gap: 10px;
     height: 200px;
     text-align: center;
}
 .page_banner .page_banner_content .page_title{
     font-size: 35px;
     font-weight: 600;
     color: #fff;
}

.page_banner .page_banner_content ul{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.page_banner .page_banner_content ul li a{
    text-decoration: none;
    color: white;
}

.page_banner .page_banner_content ul li{
    color: #FCA901;
}
/* ===== SERVICES ALL PAGE DESIGNE START ======== */
 .services_page_wrapper{
     padding: 80px 0;
     background-color: rgb(240, 240, 240);
}
 .services_page_wrapper .services_page_items .services_page_box{
     background-color: white;
     border-radius: 10px;
     box-shadow: 0 0 10px 0 rgb(197, 197, 197);
}
 .services_page_wrapper .services_page_items .services_page_box .image_area{
     border-radius: 5px 5px 0px 0px;
}
 .services_page_wrapper .services_page_items .services_page_box .image_area img{
     width: 100%;
     height: 200px;
     object-fit: cover;
     transition: all linear .3s;
}
 .services_page_wrapper .services_page_items .services_page_box .content_area{
     padding: 20px;
}
 .services_page_wrapper .services_page_items .services_page_box .content_area h5{
     font-size: 20px;
}
 .services_page_wrapper .services_page_items .services_page_box .content_area p{
     font-size: 13px;
     margin: 10px 0;
}
 .services_page_wrapper .services_page_items .services_page_box .content_area .seeMoreBtn{
     font-size: 13px;
     background-color: #111725;
     color: white;
     padding: 10px 15px;
     border-radius: 5px;
}
 .services_page_wrapper .services_page_items .services_page_box .image_area{
     overflow: hidden;
}
 .services_page_wrapper .services_page_items .services_page_box:hover img{
     transform: scale(1.2);
}
/* ===== SERVICES ALL PAGE DESIGNE END ======== */
 .counter-section {
     position: relative;
     background: linear-gradient(rgba(0, 0, 0, 0.473),rgb(7, 8, 82)),url('../img/banner_1.jpg') no-repeat center center/cover;
     background-attachment: fixed;
     color: #fff;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     overflow: hidden;
}

 .counter-box h2 {
     font-size: 50px;
     margin: 0;
     font-weight: bold;
}
 .counter-box p {
     margin: 10px 0 0;
     font-size: 16px;
     letter-spacing: 1px;
}
 @media (max-width: 768px) {
     .counter-box h2 {
         font-size: 40px;
    }
     .counter-box p {
         font-size: 16px;
    }
}
/* ===== ABOUT PAGE STYLE START ===== */
.our_mission{
    background-color: var(--bg-2);
}

.our_mission .section_title{
    text-align: center;
    font-size: 35px;
    font-weight: bold;
    margin-bottom: 25px;
}

 .our_mission .mission_box{
    background-color: white;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 5px 0 rgba(48, 48, 48, 0.288);
    /*height: 180px;*/
 }

  .our_mission .mission_box .title{
    font-weight: bold;
    font-size: 25px;
    margin-bottom: 15px;
  }
/* ===== ABOUT PAGE STYLE END ===== */
 .getInTouch{
     width: 100%;
     height: 150px;
     background: linear-gradient(rgba(0, 0, 0, 0.664),rgba(0, 0, 0, 0.616)), url('../img/banner_2.jpg');
     background-attachment: fixed;
     background-size: cover;
     display: flex;
     align-items: center;
     overflow: hidden;
}
 .getInTouch .getInTouch_wrapper{
     display: flex;
     justify-content: space-between;
     align-items: center;
}
 .getInTouch .getInTouch_wrapper h3{
     color: white;
     font-size: 40px;
}
 .getInTouch .getInTouch_wrapper a{
     background-color: white;
     color: black;
     padding: 15px 30px;
     font-size: 15px;
     border-radius: 30px;
}
 .scroll-to-top {
     position: fixed;
     bottom: 30px;
     right: 30px;
     background-color: black;
     color: white;
     border: none;
     width: 50px;
     height: 50px;
     border-radius: 50%;
     font-size: 20px;
     cursor: pointer;
     display: block;
     z-index: 9999;
     opacity: 0;
     visibility: hidden;
     transition: all linear .2s;
}
 .scroll-to-top.active{
     visibility: visible;
     opacity: 1;
}
/* ===== PARTNER START ====== */
 #partner{
     background-color: var(--bg-2);
}

 #partner .partner_items .partner_item .partner_box{
     margin: 20px;
     display: flex;
     justify-content: center;
     align-items: center;
     height: 200px;
     background-color: white;
     padding: 10px;
     border-radius: 10px;
}
 #partner .partner_items .partner_item .partner_box img{
     width: 150px;
}
/* ===== PARTNER END ====== */
 .nav_right{
     display: flex;
     align-items: center;
     justify-content: center;
}


    .card-box {
      position: relative;
      background-color: #fff;
      overflow: hidden;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.24);
      height: 220px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 20px;
      text-align: center;
    }

    .card-box img {
      width: 150px;
      height: 150px;
      transition: transform 0.4s ease;
    }

    .card-box:hover img {
      transform: scale(1.1);
    }

    .card-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0,0,0,0.7);
      color: #fff;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      opacity: 0;
      transition: opacity 0.4s ease;
    }

    .card-box:hover .card-overlay {
      opacity: 1;
    }

    .card-overlay h5, .card-overlay p {
      transform: translateY(30px);
      opacity: 0;
      transition: all 0.4s ease;
    }

    .card-box:hover .card-overlay h5,
    .card-box:hover .card-overlay p {
      transform: translateY(0);
      opacity: 1;
    }

    .card-overlay h5 {
      font-size: 1.25rem;
      margin-bottom: 0.5rem;
    }

    .card-overlay p {
      font-size: 0.95rem;
      text-align: center;
      max-width: 90%;
    }

    .portfolio_subheader {
      text-align: center;
      margin: 0 auto;
      font-weight: bold;
      max-width: 500px;
      font-size: 35px;
      margin-bottom: 5rem;
    }

    .portfolio_subheader span {
      padding-bottom: 5px;
      color: #333;
    }




        .post-box {
      background-color: #f8f9fa; /* light grey background */
      padding: 25px;
      border-radius: 12px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    }

    .post-image {
      width: 100%;
      height: 400px;
      object-fit: cover;
      border-radius: 8px;
    }

    .post-title {
      font-size: 2rem;
      font-weight: bold;
      margin-top: 20px;
    }

    .post-content {
      font-size: 1.1rem;
      line-height: 1.8;
      margin-top: 15px;
      color: #343a40;
    }



    .testimonial-box {
      background-color: #2c2b34;
      color: #ccc;
      padding: 60px 20px;
      text-align: center;
      position: relative;
      border-radius: 10px;
    }

    .testimonial-box i {
      font-size: 50px;
      color: rgba(255, 255, 255, 0.1);
      position: absolute;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);
    }

    .testimonial-text {
      font-style: italic;
      font-size: 18px;
      color: #bbb;
      max-width: 800px;
      margin: 0 auto 40px auto;
    }

    .testimonial-user {
      display: inline-flex;
      align-items: center;
      padding: 10px 20px;
      border-radius: 4px;
      color: #fff;
      font-weight: 500;
      font-size: 16px;
    }

    .testimonial-user img {
      width: 100px;
      position: relative;
      background-color: rgb(3, 3, 3);
      z-index: 9;
      height: 100px;
      border-radius: 50%;
      margin-right: 15px;
      border: 3px solid #2c2c2c;
    }

    .testimonial-user .user_details {
        background: linear-gradient(to left ,#2C2B34,rgb(30, 31, 30));
        box-shadow: 0 0 10px 0 black;
        border-radius: 0 25px 25px 0;
        padding: 15px 10px 20px 25px;
        position: relative;
        left: -24px;
    }

    .testimonial-user span {
      font-weight: bold;
      color: #fff;
    }

    .testimonial-user small {
      color: #aaa;
      margin-left: 6px;
    }


    #who_we_are{
            background-color: rgb(228, 228, 228);
    }

    #who_we_are img{
        width: 100%;

    }

    #who_we_are .col-md-6{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 20px;
    }

    #who_we_are p{
        font-size: 16px;
        margin-bottom: 15px;
    }

    #who_we_are .title{
        font-size: 35px;
        font-weight: bold;
        text-align: center;
        margin-bottom: 20px;
    }





    /* ===== categories start ====== */
    #categories .categories_title{
        text-align: center;
        font-size: 35px;
        font-weight: bold;
        margin-bottom: 30px;
    }

     #categories .categories_items .categories_box{
        margin-bottom: 10px;
     }

    #categories .categories_items .categories_box a{
        background-color: white;
        box-shadow: 0 0 5px 0 rgba(128, 128, 128, 0.397);
        display: block;
        color: black;
        padding: 10px 20px;
        border-radius: 5px;
        font-weight: bold;
        position: relative;
        text-transform: capitalize;
        z-index: 9;
    }

    #categories .categories_items .categories_box a::after{
        position: absolute;
        content: '';
        left: 0;
        top: 0;
        height: 100%;
        background-color: black;
        border-radius: 5px;
        width: 0%;
        transition: all linear .2s;
        z-index: -1;
    }

    #categories .categories_items .categories_box a:hover::after{
        width: 100%;
    }

    #categories .categories_items .categories_box a:hover{
        color: white;
    }
    /* ===== categories end ====== */



    /* ====== animated button start ===== */


    .animatedDarkButton{
        position: relative;
        display: inline-flex;
        padding: 20px 50px;
        text-decoration: none;
        overflow: hidden;
        background-color: #111725;
        font-weight: bold;
    }

    .animatedDarkButton span{
        position: relative;
        z-index: 1;
        color: white;
        transition: all linear .3s;
    }

    .animatedDarkButton:hover span{
        color: #ffffff;
    }

    .animatedDarkButton::before{
        content: '';
        position: absolute;
        top: var(--y);
        left: var(--x);
        transform: translate(-50%,-50%);
        width: 0px;
        height: 0px;
        border-radius: 50%;
        background-color: #E4313B;
        transition: width 0.5s, height 0.5s;
    }

    .animatedDarkButton:hover:before{
        width: 300px;
        height: 300px;
    }

    .animatedLightButton{
        position: relative;
        display: inline-flex;
        padding: 20px 50px;
        text-decoration: none;
        overflow: hidden;
        background-color: #ffffff;
        font-weight: bold;
    }

    .animatedLightButton span{
        position: relative;
        z-index: 1;
        color: rgb(0, 0, 0);
        transition: all linear .3s;
    }

    .animatedLightButton:hover span{
        color: #ffffff;
    }

    .animatedLightButton::before{
        content: '';
        position: absolute;
        top: var(--y);
        left: var(--x);
        transform: translate(-50%,-50%);
        width: 0px;
        height: 0px;
        border-radius: 50%;
        background-color: #E4313B;
        transition: width 0.5s, height 0.5s;
    }

    .animatedLightButton:hover:before{
        width: 350px;
        height: 300px;
    }

    .animatedLightBorderButton{
        position: relative;
        display: inline-flex;
        padding: 20px 50px;
        text-decoration: none;
        overflow: hidden;
        background-color: transparent;
        border: 1px solid white;
        font-weight: bold;
        transition: all linear .2s;
    }

    .animatedLightBorderButton:hover{
        border: 1px solid #E4313B;
    }

    .animatedLightBorderButton span{
        position: relative;
        z-index: 1;
        color: rgb(253, 252, 252);
        transition: all linear .3s;
    }

    .animatedLightBorderButton:hover span{
        color: #ffffff;
    }

    .animatedLightBorderButton::before{
        content: '';
        position: absolute;
        top: var(--y);
        left: var(--x);
        transform: translate(-50%,-50%);
        width: 0px;
        height: 0px;
        border-radius: 50%;
        background-color: #E4313B;
        transition: width 0.5s, height 0.5s;
    }

    .animatedLightBorderButton:hover:before{
        width: 350px;
        height: 350px;
    }


    /* ====== animated button end ===== */




    
#preloader {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #ffffff;
        z-index: 99999999999999999999999;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .loader {
        border: 10px solid #f3f3f3;
        border-top: 10px solid #3498db;
        border-radius: 50%;
        width: 60px;
        height: 60px;
        animation: spin 1s linear infinite;
    }

    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }












    /* ===== FOOTER START ===== */
 #site_footer{
     background-color: #20282E;
     z-index: -1;
}
 #site_footer .footer_wrapper .foor_content_box{
     padding: 20px;
     border-radius: 10px;
}


 #site_footer .footer_wrapper .foor_content_box .title{
     color: white;
     font-size: 20px;
     position: relative;
     margin-bottom: 40px;
}

#site_footer .footer_wrapper .foor_content_box .info{
    color: #8B8F99;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

#site_footer .footer_wrapper .foor_content_box .info .info_item{
    display: flex;
    align-items: center;
    width: 260px;
}

#site_footer .footer_wrapper .foor_content_box .info .info_icon{
    background-color: white;
    color: black;
    border-radius: 5px;
    padding: 10px;
    margin-right: 10px;
}


 #site_footer .footer_wrapper .foor_content_box .title::before{
     position: absolute;
     content: '';
     width: 50px;
     height: 1px;
     background-color: #FC8E1B;
     bottom: -15px;
     left: 0;
}
 #site_footer .footer_wrapper .foor_content_box .title::after{
     position: absolute;
     content: '';
     width: 10px;
     height: 1px;
     background-color: #20282E;
     bottom: -15px;
     left: 30px;
}
 #site_footer .footer_wrapper .foor_content_box table{
     color: #fff;
     font-size: 12px;
     width: 300px;
}
 #site_footer .footer_wrapper .foor_content_box table tr td{
     padding: 10px 0;
}
 #site_footer .footer_wrapper .foor_content_box .quick_links{
     display: flex;
     flex-direction: column;
     gap: 10px;
     font-size: 12px;
}
 #site_footer .footer_wrapper .foor_content_box .quick_links li a{
     display: inline-flex;
     gap: 10px;
     align-items: center;
     color: #8B8F99;
     transition: all linear .2s;
}
 #site_footer .footer_wrapper .foor_content_box .quick_links li a .fa-location-arrow{
     transform: rotate(50deg);
}
 #site_footer .footer_wrapper .foor_content_box .quick_links li a:hover{
     color: #fff;
}
 #site_footer .footer_wrapper .foor_content_box .signup_text{
     font-size: 12px;
     color: #8B8F99;
     margin-bottom: 20px;
}
 #site_footer .footer_wrapper .foor_content_box .form_box{
     position: relative;
}
 #site_footer .footer_wrapper .foor_content_box .form_box input{
     border: none;
     display: block;
     padding: 10px 50px 10px 10px;
     width: 100%;
     border-radius: 5px;
     outline: none;
}
 #site_footer .footer_wrapper .foor_content_box .form_box button{
     border: none;
     display: block;
     padding: 8px 10px;
     border-radius: 5px;
     outline: none;
     background-color: #20282D;
     color: #fff;
     position: absolute;
     right: 2px;
     top: 2px;
}
 #site_footer .footer_wrapper .foor_content_box .form_box input::placeholder{
     font-size: 12px;
     color: #20282D;
}
 #site_footer .footer_wrapper .foor_content_box .note{
     font-size: 12px;
     color: #8B8F99;
     margin-top: 20px;
}
 .copyright{
     border-top: 1px solid #454546;
     padding: 30px 0;
}
 .copyright p{
     font-size: 12px;
     color: #8B8F99;
     text-align: center;
}
/* ===== FOOTER END ===== */






.no_data_message{
    text-align: center;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: red;
}


.single_post_wrapper{
    background-color: rgb(255, 255, 255);
    margin: 50px 0;
}

.single_post_wrapper .single_post_image {
    padding: 20px 0;
    text-align: center;
}

.single_post_wrapper .single_post_image img{
    height: 400px;
    object-fit: contain;
    border-radius: 10px;
    display: inline-block;
}

.single_post_wrapper .single_post_title{
    padding: 10px 40px;
    font-size: 25px;
    font-weight: bold;
    text-transform: capitalize;
}

.single_post_wrapper .single_post_content{
    padding: 10px 40px 40px 40px;
}







.preloader_wrapper{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: white;
    z-index: 999999999999999;
}



.serviceSolutionPageTitle{
    text-align: center;
    font-size: 40px;
    font-weight: 600;
    padding-bottom: 50px;
    max-width: 500px;
    margin: 0 auto;
}