@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&display=swap');
body {margin: 0px;padding: 0px;font-family: "Source Sans 3", sans-serif;overflow-x: hidden;color: #343434;}
p {color: #343434;font-size: 16px;line-height: 1.625;margin: 0px 0px 15px;letter-spacing: 0.4px;font-family: "Source Sans 3", sans-serif;}
.main-table li {color: #343434;font-size: 16px;line-height: 1.5;margin: 0px 0px 12px;letter-spacing: 0.6px;font-family: "Source Sans 3", sans-serif;}
a {font-family: "Source Sans 3", sans-serif;text-decoration: none !important;}
h1, h2, h3 {font-family: "Poppins", sans-serif;}
h4, h5, h6 {font-family: "Source Sans 3", sans-serif;color: rgb(107, 101, 96);}
.main-table {text-align: left;padding: 5% 0px;}

#widgetsControl_C, #widgetsControl {height: auto !important;}
#Div_body .container-fluid {margin: 0px;padding: 0px;}
#MenuControl .nav-item {margin: 0px;}
#MenuControl .nav-item .nav-link {color: rgb(255, 255, 255);font-size: 15px;padding: 0;font-weight: 600;text-transform: uppercase;}
#MenuControl .nav-fill {width: 100%;}
#MenuControl .bg-light {height: 100%;background: rgb(255, 255, 255) !important;}
#HeaderControl.RadDock_Default .rdMiddle .rdCenter, #HeaderControl.RadDock_Default .rdBottom .rdCenter {background-color: transparent !important;}
#MenuControl_C .bg-light {--bs-bg-opacity: 1;height: 100%;background-color: transparent !important;}
#MenuControl.RadDock_Default .rdMiddle .rdCenter, #MenuControl.RadDock_Default .rdBottom .rdCenter {background-color: transparent !important;}
#HeaderControl, #HeaderControl_C, #MenuControl, #MenuControl_C {height: 110px !important;}
#WidgetControl5 { display: none; }
#HeaderControl_C_ctl00_tr_HeaderBackImage { background: transparent}
@media (min-width: 320px) and (max-width: 768px) {
  .navbar-toggler {position: absolute;right: 15px;top: -50px;background: rgb(255, 255, 255);}
  #MenuControl, #MenuControl_C {height: 0px !important;}
  #HeaderControl, #HeaderControl_C {background: rgb(14 14 14);}
  .navbar-collapse {background: rgb(14 14 14);margin-top: -10px;}
  #WidgetControl4 {display: none;}
}

@media (min-width: 769px) {
  #HeaderControl {position: absolute;left: 0;top: 0;z-i;z-index: 3;width: 25%;text-align: center;background: rgb(0 0 0 / 50%);backdrop-filter: blur(2px);}
  #MenuControl {position: absolute;right: 0;top: 0;width: 75%;z-index: 8 !important;background: rgb(0 0 0 / 50%) !important;backdrop-filter: blur(2px);}
}
.dropdown-menu {
    border-radius: 0 !important;
    padding: 0;
    min-width: 240px;
}
header img {width: 150px;}
.dropdown-menu .dropdown-item { padding: 8px 15px}
.dropdown-menu .dropdown-item:hover { background: #ff0000e0; color: #fff}
/* .navbar.bg-light { background: rgb(0 0 0 / 50%) !important; backdrop-filter: blur(2px);} */
/* .navbar-nav.nav-fill > li:last-child { display: inline-block; background: rgb(200, 150, 90); color: rgb(255, 255, 255); border-radius: 30px; font-size: 14px; font-weight: 500; letter-spacing: 0.5px; transition: 0.3s ease-in-out;} */
.otherpagecss #RadDockZone1.container { max-width: 100%;}
.otherpagecss #RadDockZone1.container #HomepagecontentControl_C table { margin-top: 0px !important;}
.otherpagecss #WidgetControl5 { display: none;}

.heading p {font-size: 20px;font-weight: 600;color: #606060;display: inline-block;border-bottom: 1px solid #ff0000;padding: 0 5px;}
.heading h2 {color: #181f25;font-weight: 700;font-size: 62px;line-height: 1.2;margin: 0 0 20px 0;}
.heading h2 span { color: #ff0000; font-weight: 700;}
.custom-btn { display: inline-block; background: #ff0000; color: #fff; padding: 12px 28px; border-radius: 5px 15px 5px 15px; font-size: 17px; letter-spacing: 0.3px; font-weight: 400;}
.custom-btn1 {display: inline-block;background: #ffffff2e;color: #fff;padding: 14px 38px;border-radius: 30px;font-size: 18px;letter-spacing: 0.3px;font-weight: 400;backdrop-filter: blur(5px);text-transform: uppercase;}
.custom-btn1:hover, .custom-btn:hover { color: #fff}
.sub-heading { color: #181f25; font-weight: 600; font-size: 36px; line-height: 1.28; margin: 0 0 25px 0;}
.sub-heading1 { color: #181f25; font-weight: 600; font-size: 27px; line-height: 1.28; margin: 0 0 18px 0;}
.sub-heading3 { color: #ff0000; font-size: 21px; font-weight: 700; margin: 0 0 18px 0;}
.heading1 {font-size: 78px;text-transform: uppercase;font-weight: 700;letter-spacing: 1px;margin: 0 0 20px 0;line-height: 1.1;}
.heading2 {font-size: 36px;color: #181f25;font-weight: 700;margin: 0 0 30px 0;line-height: 1.3;padding: 0px 0 0px 20px;border-left: 3px solid #ff0000;}
.heading1 span { color: rgba(255, 255, 255, 0); -webkit-text-stroke: 1px #fff;}
.font1 { color: #d8d8d8; font-size: 20px;}
.bg1 { background: #e3e4e5;}
.bg2 { background: #13202c}
.read-more { color: #ff0000; font-size: 20px; font-weight: 700; border-bottom: 1px solid #ff0000; letter-spacing: .5px; display: inline-block; padding: 5px; transition: all .3s ease-in-out;}
.read-more:hover { letter-spacing: 1.5px; color: #ff0000}

.hero-banner { position: relative; width: 100%; min-height: 100vh; height: 800px; overflow: hidden; display: flex; align-items: center;}
.hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1;}
.hero-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.42); z-index: 2;}
.hero-content {position: relative;z-index: 2;width: 100%;padding-left: 5.5%;padding-top: 8%;}
.hero-top-title {color: #fff;font-size: clamp(38px, 4vw, 66px);font-weight: 700;line-height: 1.2;margin: 0 0 20px;max-width: 760px;}
.hero-red-box { position: relative; width: min(50vw, 925px); min-height: 300px; background: #ff0000cc; margin-left: -6%; padding: 35px 70px 35px 5.5%; clip-path: polygon( 0 0, 87% 0, 100% 100%, 0 100%); display: flex; align-items: center; backdrop-filter: blur(7px);}
.hero-red-box h2 { color: #fff; font-size: clamp(62px, 5vw, 80px); line-height: 1.1; font-weight: 700; margin: 0;}

.why-choose-us {background: #e3e4e5;padding: 3% 0;}
.why-choose-us .text-bg {background-image: url("image/text-bg.jpg");background-size: cover;background-position: center;color: transparent;background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;font-size: 110px;font-weight: 900;margin: 0 0 25px 0;text-transform: capitalize;line-height: 105px;}
.why-choose-us .text-bg1 {background-image: url("image/Goals-Passion.jpg")}
.why-choose-us p {font-size: 24px;font-weight: 500;line-height: 1.5;margin: 0 0 20px 0;}

.service-section { padding: 5% 0 0 0;}
.service-section .ser-card { position: relative; overflow: hidden;}
.service-section .ser-card::after { content: ''; position: absolute; width: 100%; height: 100%; background: #0000002c; left: 0; top: 0; transition: all .2s ease-in-out;}
.service-section .ser-card .ser-content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 9;transition: all .3s ease-in-out;min-width: 100%; padding: 30px;text-align: center;}
.service-section .ser-card .ser-content .ser-heading h3 {color: #fff;font-size: 34px;font-weight: 800;letter-spacing: .5px;text-shadow: 2px 2px 2px #00000094;margin: 0;}
.service-section .ser-card .ser-details {position: absolute;top: 50%;left:0;z-index: 9;transition: all .5s ease-in-out;min-width: 100%;text-align: center;padding: 40px; opacity: 0}
.service-section .ser-card .ser-details h3 {color: #fff;font-size: 36px; font-weight: 800; letter-spacing: .5px; margin: 0 0 30px 0; transition: all .3s ease-in-out;}
.service-section .ser-card .ser-details p {color: #fff; font-size: 17px; transition: all .3s ease-in-out;}
.service-section .ser-card .ser-details a { color: #ff0000; font-size: 17px; font-weight: 600; transition: all .3s ease-in-out;}
.service-section .ser-card .ser-details a:hover { letter-spacing: 1px;}
.service-section .ser-card:hover .ser-details { transform: translate( 0, -50%); opacity: 1}
.service-section .ser-card:hover::after { background: #000000a2; backdrop-filter: blur(4px);}
.service-section .ser-card:hover .ser-content .ser-heading h3 { display: none}

.count-bx { margin: 20px 0 0 0; background: linear-gradient(170deg,hsla(0,0%,100%,.3),hsla(0,0%,100%,.2),hsla(0,0%,100%,.1),transparent 20%); padding: 30px 40px; position: relative; border-radius: 70px;}
.count-bx::after {background: linear-gradient(130deg, #fff 5%, hsla(0, 0%, 100%, .2), transparent 30%);border-top-left-radius: 70px;content: "";height: 100%;left: 0;mask-composite: exclude; -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite: xor;padding: 2px;position: absolute;top: 0;width: 100%}
.count-bx h4 { color: #fff; font-size: 64px; font-weight: 600; letter-spacing: .7px; margin: 0 0 10px 0;}
.count-bx h3 { color: #fff; font-size: 21px; font-weight: 600; letter-spacing: .7px; margin: 0 0 20px 0; line-height: 1.5}
.count-bx p { margin: 0; color: #c9c4c4; font-size: 20px;}

.contact-section { position: relative;}
.contact-section .contact-info { background: #ff0000d8; backdrop-filter: blur(2px); position: absolute; width: 40%; height: 100%; top: 0; left: 0; padding: 50px; padding-left: 16%;} 
.contact-section .contact-info p { color: #dbdbdb; font-size: 18px; display: flex;}
.contact-section .contact-info p a { color: #dbdbdb;}
.contact-section .contact-info p i { color: #fff; font-size: 20px; margin: 6px 5px 0 0;}

footer {background: #14181c;padding: 4% 0 0 0;} 
footer h4 {color: #fff;font-size: 19px;font-weight: 600;margin: 0 0 40px 0;letter-spacing: .5px;position: relative;}
footer h4::after {content: '';position: absolute;width: 50px;height: 2px;background: #ff0000;left: 0;bottom: -14px;;}
footer p, footer p a {color: #ffffffa6;font-size: 14px;margin: 0 0 8px 0;}
footer p a:hover { color: #ff0000; padding-left: 5px; transition: 0.3s;}
footer .footer-bottom {/* margin: 4% 0 0 0; */border-top: 1px solid rgba(204, 204, 204, .4);padding: 15px 0;}
footer .footer-bottom p { margin: 0;}
footer p i {color: #ffffffd6;margin: 0 5px 0 0;}
footer .social-icon a {position: relative;color: #fff;background: rgba(255, 255, 255, .1);font-size: 13px;width: 35px;height: 35px;margin: 0 5px 0 0;display: inline-block;border-radius: 50%;text-align: center;line-height: 2.8;transition: all .2s ease-in-out;}
footer .social-icon a i { position: relative; z-index: 3;}
footer .social-icon a::before{ content: ''; position: absolute; width:100%; height: 100%; border-radius: 50%; background: #ff0000;; left: 0; transform: scale(0); transition: all .4s ease-in-out;}
footer .social-icon a:hover { color: #fff;}
footer .social-icon a:hover::before { transform: scale(1);}

.about-banner-section { position: relative;}
.about-banner-section .text {position: absolute;bottom: 0;left: 0;width: 100%;padding: 30px;background-image: linear-gradient( transparent, #181f25);padding: 50px 6%;}
.about-banner-section .text p { color: #fff; font-size: 17px;}
.about-banner-section .text p img { margin: -4px 8px 0 0; width: 16px;}
.about-banner-section .text p a { color: #fff;}
.about-banner-section .text h1 { color: #fff; font-size: 60px; font-weight: 600; margin: 0;}

.about-section { background: #181f25; padding: 5% 0;}
.about-section .about-title { color: #fff; font-size: 37px; font-weight: 600; line-height: 1.4; margin: 0 0 50px 0; position: relative;}
.about-section .about-title::after { content: ''; position: absolute; width: 120px; height: 5px; background: #ff0000; border-radius: 5px; left: 0; bottom: -18px;}
.about-section p {color: #e7e7e7;}

.our-ethos { padding: 5% 0;}
.our-ethos .num { width: 14%;}
.our-ethos .num p {display: inline-block;width: 65px;height: 65px;background: #ff0000;border-radius: 5px;font-size: 24px;text-align: center;color: #fff;font-weight: 600;line-height: 2.7;}
.our-ethos .text { width: 86%;}
.our-ethos .text p {font-size: 17px; margin: 0 0 10px 0;}
.our-ethos .text h4 { color: #343434; font-size: 19px; font-weight: 600;}

.industries-section {position: relative;z-index: 1;padding: 5% 0;}
.industries-section .cs_case_study_1_list {display: flex;}
.industries-section .cs_case_study.cs_style_1.cs_hover_active {/* height: 300px; */}
.industries-section .cs_case_study_1_list > .cs_case_study.cs_style_1 {flex: 1;}
.industries-section .cs_case_study.cs_style_1 {height: 700px;display: flex;align-items: flex-end;position: relative;overflow: hidden;transition: all 0.4s ease;}
.industries-section .cs_case_study.cs_style_1 .cs_case_study_thumb {position: absolute;height: 100%;width: 100%;left: 0;top: 0;}
.industries-section .cs_case_study_thumb{background-image: url(Image/Core-value1.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.industries-section .cs_case_study_thumb2 {background-image: url(Image/Core-value2.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.industries-section .cs_case_study_thumb3 {background-image: url(Image/Core-value3.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.industries-section .cs_case_study_thumb4 {background-image: url(Image/Core-value4.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.industries-section .cs_case_study_thumb5 {background-image: url(Image/Core-value5.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.industries-section .cs_case_study_thumb6 {background-image: url(Image/Core-value6.jpg);background-position: center;background-size: cover;background-repeat: no-repeat;}
.case-header-area{margin-bottom:25px;}
.industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover{ flex: 2.3;}
.industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover .content-area{opacity:1;left:0;bottom: 0;}
.industries-section .content-area1 {position: absolute;width: 100%;height: auto;left: 0;bottom: 0;transition: all 0.4s;font-weight: 600;opacity: 1;padding: 25px 25px 35px 25px;z-index: 3;background-image: linear-gradient(
1deg, black, transparent);}
.industries-section .content-area1 a {color: #fff;display: inline-block;text-transform: capitalize;transition: all 0.4s;width: 100%;font-size: 27px;font-weight: 700;letter-spacing: .2px;line-height: 1.3;margin: 0;}
.industries-section .content-area {position: absolute;z-index: 1;width: 100%;transition: all 0.5s;padding: 0px 25px;bottom: -100%;/* left: -100%; */opacity: 0;}
.industries-section .content-area a {font-family: "Poppins", sans-serif;color:#fff;display: inline-block;text-transform: capitalize;transition: all 0.4s;width: 100%;margin-bottom: 8px;font-weight: 600;font-size: 18px;letter-spacing: .8px;}
.industries-section .content-area p {color: #fff;transition: all 0.4s;font-size: 15px;}

.team-section { padding: 5% 0; background-image: url('image/team-bg.png'); background-size: cover; background-position: center;}
.team-section .heading1.mission {font-size: 100px;font-weight: 900;line-height: 96px;}
.team-section .team-card { margin: 20px 0 0 0;}
.team-section .team-card .pic { margin: 0 0 20px 0;}
.team-section .team-card .pic img { filter: grayscale(.2); height: 380px; object-fit: cover; background-position: top;}
.team-section .team-card .name { padding: 6px 10px 6px 20px; position: relative;}
.team-section .team-card .name::after { content: ''; position: absolute; height: 100%; width: 2px; background: #ff0000; left: 1px; top: 0; opacity: .9;}
.team-section .team-card .name h5 {color: #fff;font-size: 25px;margin: 0 0 4px 0;font-weight: 700;}
.team-section .team-card .name p { color: #c9c4c4; margin: 0; font-size: 17px; font-weight: 600;}

.about-section1 { padding: 5% 0 7% 0;}
.about-section1 .about-img { position: relative;}
.about-section1 .about-img::after {position: absolute;content: '';width: 200px;height: 200px;background: #ff0000;opacity: .2;border-radius: 50%;right: 16%;top: 21%;}
.about-section1 .about-img .about1 img{width: 65%;border-radius: 5px;position: relative;z-index: 1;}
.about-section1 .about-img .about2 img {position: absolute;width: 45%;border-radius: 5px;right: 20px;bottom: -15%;border: 8px solid #fff;z-index: 2;}
.about-section1 .about-img .about2 img:hover, .about-section1 .about-img .about1 img:hover { filter: grayscale(0);}
.about-section1 .about-img .text .fz-30 {border-radius: 50%;font-size: 34px !important;}
.about-section1 .about-img .text .circle-button .rotate-circle textpath {fill: rgb(255, 255, 255);}
.about-section1 .about-img .text .circle-button .icon {position: absolute;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);}
.about-section1 .about-img .text .circle-button {position: absolute;width: 170px;bottom: 28%;right: 28%;background: #181f25;z-index: 2;border-radius: 50%;cursor: pointer;}
.about-section1 .about-img .text .rotate-circle {animation-name: rotateCircle;animation-duration: 20s;animation-iteration-count: infinite;animation-timing-function: linear;}

@keyframes rotateCircle {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
.about-section1 .text h2 { font-size: 40px; font-weight: 700; line-height: 1.35; color: #181f25;}
.about-section1 .text p { font-size: 18px; margin: 0 0 40px 0;}

.contact-page-banner { background-image: url('image/contact-banner.jpg'); background-size: cover; padding: 14% 0 8% 0; position: relative; overflow: hidden;}
.contact-page-banner::after {content: '';position: absolute;width: 100%;height: 100%;background-image: linear-gradient(90deg, #181f25 40%, #00000000);left: 0;top: 0;}
.contact-page-banner h1 { color: #fff; font-size: 54px; position: relative; z-index: 2; font-weight: 700;}
.contact-page-banner p { position: relative; z-index: 2; color: #c9c4c4; margin: 0; font-size: 21px;}

.contact-form { background: #e3e4e5; padding: 5% 0;}
.contact-form .section-heading { color: #181f25; font-size: 38px; font-weight: 600; line-height: 1.4; margin: 0 0 50px 0; position: relative;}
.contact-form .section-heading::after { content: ''; position: absolute; width: 120px; height: 5px; background: #ff0000; border-radius: 5px; left: 0; bottom: -18px;}
.contact-form .form-control { padding: 15px; margin: 0 0 12px 0; font-size: 17px;}
.contact-form input[type="button"] { background: #181f25; color: #fff; font-size: 18px; font-weight: 600; letter-spacing: .6px; border: 0; padding: 12px 34px; border-radius: 3px;}

.our-office { padding: 4% 0;}
.office-bx {background: #141f2b;background-size: cover;padding: 5% 0;min-height: 730px;background-attachment: fixed}
.office-bx.bangalore-office { background-image: url('image/bangalore-office.jpg')}
.office-bx.delhi-office { background-image: url('image/delhi-office.jpg')}
.office-bx .office-address {background: rgb(255 255 255 / 20%);border: 1px solid #ffffff38;padding: 30px;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.37);border-radius: 20px;backdrop-filter: blur(5px);}
.office-bx .office-address h3 {color: #fff;font-size: 38px;font-weight: 700;text-transform: uppercase;margin: 0 0 50px 0;position: relative;letter-spacing: .5px;text-shadow: 3px 3px 3px #00000042;}
.office-bx .office-address h3::after {content: '';position: absolute;background: #ff0000;width: 60px;height: 3px;left: 0;bottom: -20px;}
.office-bx .office-address hr { background-color: #fff; margin: 30px 0; opacity: .4}
.office-bx .office-address h4 { text-transform: uppercase; color: #fff; font-size: 20px; font-weight: 700; letter-spacing: .5px; }
.office-bx .office-address p, .office-bx .office-address p a {color: #ffffff;line-height: 1.6;margin: 0 0 5px 0;font-size: 15px;}

.service-page-banner { background-image: url('image/EPCG-License-banner.jpg'); background-size: cover; padding: 12% 0 6% 0; position: relative; overflow: hidden;}
.industy-page-banner {background-image: url('image/industy-page-banner.jpg');padding: 15% 0 8% 0;}
.service-page-banner::after {content: '';position: absolute;width: 100%;height: 100%;background-image: linear-gradient(90deg, #181f25 30%, #00000000);left: 0;top: 0;}
.service-page-banner h1 {color: #fff;font-size: 48px;position: relative;z-index: 2;font-weight: 700;letter-spacing: .8px;margin: 0 0 40px 0;position: relative;line-height: 1.3;}
.service-page-banner h1::after { content: ''; position: absolute; width: 80px; height: 2px; background: #ff0000; left: 0; bottom: -15px;}
.service-page-banner p { position: relative; z-index: 2; color: #ffffffea; margin: 0; font-size: 17px;}

.service1 { padding: 5% 0;}
.service1 .text {background: #e3e4e5;padding: 50px;margin: 10% 0 0 -20%;}

.card1 { margin: 20px 0 0 0; background: linear-gradient(170deg,hsl(0deg 0% 0% / 30%),hsl(0deg 0% 0% / 20%),hsl(0deg 0% 0% / 10%),transparent 20%); padding: 35px 40px; position: relative; border-radius: 70px;}
.card1::after {background: linear-gradient(130deg, #131e2bbd 5%, hsl(0deg 0% 0% / 20%), #00000000 30%);border-top-left-radius: 70px;content: "";height: 100%;left: 0;mask-composite: exclude; -webkit-mask: linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite: xor;padding: 2px;position: absolute;top: 0;width: 100%}
.card1 h3 {color: #181f25;font-size: 17px;font-weight: 600;letter-spacing: .7px;margin: 0 0 16px 0;line-height: 1.4;}
.card1 p {font-size: 15px; line-height: 1.6}

.service2 { padding: 8% 0 0 0; background-image: url(image/bg1.jpg); background-size: cover; background-attachment: fixed;}
.service2 .text { background: #181f25e7; padding: 60px; backdrop-filter: blur(4px);}

.card2 {padding: 50px;border-radius: 50px 5px 50px 5px;background: #f1f2f3; border-top: 5px solid #ff0000; border-bottom: 5px solid #ff0000; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
.card2 h3 {font-size: 24px;color: #181f25;font-weight: 700;margin: 0 0 40px 0;line-height: 1.3; position: relative;}
.card2 h3::after { content: ''; position: absolute; width: 70px; height: 3px; background: #ff0000; border-radius: 3px; left: 0; bottom: -12px}

/* =========================================================
   RESPONSIVE CSS
   Keep your existing CSS unchanged.
   Add this code at the END of your stylesheet.
   ========================================================= */


/* ---------------------------------------------------------
   LARGE DESKTOP - 1600px to 1919px
   --------------------------------------------------------- */
@media (min-width: 1600px) and (max-width: 1919px) {

    .hero-banner {
        height: 800px;
        min-height: 800px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 7%;
    }

    .hero-top-title {
        font-size: 52px;
        max-width: 650px;
    }

    .hero-red-box {
        width: 52vw;
        min-height: 260px;
        padding: 30px 60px 30px 5%;
    }

    .hero-red-box h2 {
        font-size: 68px;
    }

    .why-choose-us .text-bg {
        font-size: 82px;
    }

    .why-choose-us p {
        font-size: 20px;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 28px;
    }

    .count-bx h4 {
        font-size: 52px;
    }

    .count-bx h3 {
        font-size: 18px;
    }

    .count-bx p {
        font-size: 17px;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 600px;
    }

    .industries-section .content-area1 a {
        font-size: 20px;
    }
}


/* ---------------------------------------------------------
   LAPTOP - 1200px to 1599px
   --------------------------------------------------------- */
@media (min-width: 1200px) and (max-width: 1599px) {

    #HeaderControl,
    #MenuControl,
    #MenuControl_C {
        /* height: 75px !important; */
    }

    #MenuControl .nav-item .nav-link {
        font-size: 14px;
    }

    .hero-banner {
        height: 700px;
        min-height: 700px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 7%;
    }

    .hero-top-title {
        font-size: 44px;
        max-width: 570px;
    }

    .hero-red-box {
        width: 54vw;
        min-height: 220px;
        padding: 25px 50px 25px 5%;
    }

    .hero-red-box h2 {
        font-size: 58px;
    }

    .heading h2 {
        font-size: 52px;
    }

    .heading p {
        /* font-size: 17px; */
    }

    .sub-heading {
        font-size: 30px;
    }

    .sub-heading1 {
        font-size: 24px;
    }

    .heading1 {
        font-size: 64px;
    }

    .heading2 {
        font-size: 30px;
    }

    .why-choose-us {
        padding: 4% 0;
    }

    .why-choose-us .text-bg {
        font-size: 88px;
        margin-bottom: 18px;
        line-height: 88px;
    }

    .why-choose-us p {
        font-size: 20px;
    }

    .service-section {
        padding-top: 4%;
    }

    .service-section .ser-card .ser-content {
        padding: 20px;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 23px;
    }

    .service-section .ser-card .ser-details {
        padding: 25px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 27px;
        margin-bottom: 20px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 15px;
    }

    .count-bx {
        padding: 25px 30px;
    }

    .count-bx h4 {
        font-size: 44px;
    }

    .count-bx h3 {
        font-size: 17px;
    }

    .count-bx p {
        font-size: 16px;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 520px;
    }

    .industries-section .content-area1 {
        padding: 20px 20px 30px;
    }

    .industries-section .content-area1 a {
        font-size: 18px;
    }

    .contact-section .contact-info {
        padding: 35px;
        padding-left: 10%;
    }

    .contact-section .contact-info p {
        font-size: 16px;
    }

    footer {
        padding-top: 4%;
    }

    footer h4 {
        font-size: 16px;
        margin-bottom: 30px;
    }

    footer p,
    footer p a {
        font-size: 12px;
    }
}


/* ---------------------------------------------------------
   SMALL LAPTOP / LARGE TABLET - 992px to 1199px
   --------------------------------------------------------- */
@media (min-width: 992px) and (max-width: 1199px) {


    .navbar-nav.nav-fill > li:last-child {
        font-size: 12px;
    }

    .hero-banner {
        height: 620px;
        min-height: 620px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 8%;
    }

    .hero-top-title {
        font-size: 36px;
        max-width: 500px;
        margin-bottom: 15px;
    }

    .hero-red-box {
        width: 58vw;
        min-height: 190px;
        padding: 25px 40px 25px 5%;
    }

    .hero-red-box h2 {
        font-size: 48px;
    }

    .heading h2 {
        font-size: 36px;
    }

    .heading p {
        font-size: 16px;
    }

    .sub-heading {
        font-size: 27px;
    }

    .sub-heading1 {
        font-size: 22px;
    }

    .sub-heading3 {
        font-size: 18px;
    }

    .heading1 {
        font-size: 45px;
    }

    .heading2 {
        font-size: 27px;
    }

    .font1 {
        font-size: 17px;
    }

    .why-choose-us {
        padding: 4% 0;
    }

    .why-choose-us .text-bg {
        font-size: 58px;
        margin-bottom: 15px;
    }

    .why-choose-us p {
        font-size: 16px;
    }

    .service-section {
        padding-top: 4%;
    }

    .service-section .ser-card .ser-content {
        padding: 15px;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 19px;
    }

    .service-section .ser-card .ser-details {
        padding: 20px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 22px;
        margin-bottom: 15px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 14px;
    }

    .count-bx {
        padding: 20px 25px;
        border-radius: 50px;
    }

    .count-bx h4 {
        font-size: 36px;
    }

    .count-bx h3 {
        font-size: 15px;
    }

    .count-bx p {
        font-size: 14px;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 450px;
    }

    .industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover {
        flex: 2;
    }

    .industries-section .content-area1 {
        padding: 15px 15px 25px;
    }

    .industries-section .content-area1 a {
        font-size: 16px;
    }

    .contact-section .contact-info {
        width: 45%;
        padding: 30px;
        padding-left: 7%;
    }

    .contact-section .contact-info p {
        font-size: 14px;
    }

    footer h4 {
        font-size: 15px;
        margin-bottom: 25px;
    }

    footer p,
    footer p a {
        font-size: 11px;
    }

    .about-banner-section .text h1 {
        font-size: 45px;
    }

    .about-section .about-title {
        font-size: 30px;
    }

    .about-section1 .text h2 {
        font-size: 34px;
    }

    .service-page-banner h1 {
        font-size: 38px;
    }

    .card1 {
        padding: 25px 30px;
    }

    .card2 {
        padding: 35px;
    }
}


/* ---------------------------------------------------------
   TABLET - 768px to 991px
   --------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 991px) {

    #HeaderControl,
    #HeaderControl_C {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 70px !important;
        background: #1a2b4a;
        z-index: 10;
    }

    #MenuControl,
    #MenuControl_C {
        height: 0 !important;
    }

    .navbar-toggler {
        position: absolute;
        right: 20px;
        top: 15px;
        background: #fff;
        z-index: 20;
    }

    .navbar-collapse {
        background: #002346;
        margin-top: 0;
        padding: 10px 20px;
    }

    #MenuControl .nav-item .nav-link {
        font-size: 14px;
        padding: 10px 5px;
    }

    .navbar-nav.nav-fill > li:last-child {
        display: block;
        margin: 5px 0;
    }

    .hero-banner {
        height: 600px;
        min-height: 600px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 10%;
    }

    .hero-top-title {
        font-size: 32px;
        max-width: 450px;
    }

    .hero-red-box {
        width: 70vw;
        min-height: 170px;
        padding: 25px 35px 25px 5%;
    }

    .hero-red-box h2 {
        font-size: 42px;
    }

    .heading h2 {
        font-size: 32px;
    }

    .heading p {
        font-size: 15px;
    }

    .sub-heading {
        font-size: 25px;
    }

    .sub-heading1 {
        font-size: 21px;
    }

    .sub-heading3 {
        font-size: 18px;
    }

    .heading1 {
        font-size: 40px;
    }

    .heading2 {
        font-size: 25px;
    }

    .font1 {
        font-size: 16px;
    }

    .why-choose-us {
        padding: 5% 15px;
    }

    .why-choose-us .text-bg {
        font-size: 48px;
        margin-bottom: 12px;
    }

    .why-choose-us p {
        font-size: 15px;
    }

    .service-section {
        padding-top: 5%;
    }

    .service-section .ser-card .ser-content {
        padding: 12px;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 16px;
    }

    .service-section .ser-card .ser-details {
        padding: 15px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 19px;
        margin-bottom: 12px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 13px;
    }

    .count-bx {
        padding: 18px 20px;
        border-radius: 40px;
    }

    .count-bx h4 {
        font-size: 30px;
    }

    .count-bx h3 {
        font-size: 14px;
    }

    .count-bx p {
        font-size: 13px;
    }

    .industries-section .cs_case_study_1_list {
        display: flex;
        flex-wrap: wrap;
    }

    .industries-section .cs_case_study_1_list > .cs_case_study.cs_style_1 {
        flex: 0 0 33.333%;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 350px;
    }

    .industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover {
        flex: 0 0 33.333%;
    }

    .industries-section .content-area1 {
        padding: 15px;
    }

    .industries-section .content-area1 a {
        font-size: 14px;
    }

    .contact-section .contact-info {
        width: 50%;
        padding: 25px;
        padding-left: 5%;
    }

    .contact-section .contact-info p {
        font-size: 13px;
    }

    footer {
        padding-top: 5%;
    }

    footer h4 {
        font-size: 14px;
        margin-bottom: 25px;
    }

    footer p,
    footer p a {
        font-size: 11px;
    }

    .about-banner-section .text {
        padding: 30px 5%;
    }

    .about-banner-section .text h1 {
        font-size: 40px;
    }

    .about-section .about-title {
        font-size: 27px;
    }

    .about-section1 .text h2 {
        font-size: 30px;
    }

    .about-section1 .text p {
        font-size: 16px;
    }

    .service-page-banner {
        padding: 18% 0 8%;
    }

    .service-page-banner h1 {
        font-size: 34px;
    }

    .service-page-banner p {
        font-size: 15px;
    }

    .service1 .text {
        padding: 35px;
        margin: 5% 0 0 -10%;
    }

    .card1 {
        padding: 25px 30px;
    }

    .card2 {
        padding: 30px;
    }

    .card2 h3 {
        font-size: 21px;
        margin-bottom: 30px;
    }
}


/* ---------------------------------------------------------
   MOBILE - 576px to 767px
   --------------------------------------------------------- */
@media (min-width: 576px) and (max-width: 767px) {

    body {
        overflow-x: hidden;
    }

    #HeaderControl,
    #HeaderControl_C {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 62px !important;
        background: #1a2b4a;
    }

    #MenuControl,
    #MenuControl_C {
        height: 0 !important;
    }
    header img { width: 230px}
    .navbar-toggler {
        position: absolute;
        right: 15px;
        top: 12px;
        background: #fff;
    }

    .navbar-collapse {
        background: #002346;
        margin-top: 0;
        padding: 10px 15px;
    }

    #MenuControl .nav-item .nav-link {
        font-size: 13px;
        padding: 8px 5px;
    }

    .hero-banner {
        height: 560px;
        min-height: 560px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 100px;
    }

    .hero-top-title {
        font-size: 27px;
        max-width: 380px;
        margin-bottom: 15px;
    }

    .hero-red-box {
        width: 88vw;
        min-height: 145px;
        margin-left: -5%;
        padding: 20px 25px 20px 5%;
    }

    .hero-red-box h2 {
        font-size: 34px;
    }

    .heading h2 {
        font-size: 29px;
    }

    .heading p {
        font-size: 14px;
    }

    .sub-heading {
        font-size: 23px;
    }

    .sub-heading1 {
        font-size: 20px;
    }

    .sub-heading3 {
        font-size: 17px;
    }

    .heading1 {
        font-size: 34px;
    }

    .heading2 {
        font-size: 23px;
    }

    .font1 {
        font-size: 15px;
    }

    .custom-btn {
        padding: 10px 22px;
        font-size: 14px;
    }

    .custom-btn1 {
        padding: 11px 25px;
        font-size: 14px;
    }

    .why-choose-us {
        padding: 7% 15px;
    }

    .why-choose-us .text-bg {
        font-size: 40px;
        margin-bottom: 10px;
    }

    .why-choose-us p {
        font-size: 14px;
    }

    .service-section {
        padding-top: 8%;
    }

    .service-section .ser-card .ser-content {
        padding: 10px;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 15px;
    }

    .service-section .ser-card .ser-details {
        padding: 15px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 12px;
    }

    .count-bx {
        padding: 15px 20px;
        border-radius: 35px;
        margin-top: 15px;
    }

    .count-bx h4 {
        font-size: 28px;
    }

    .count-bx h3 {
        font-size: 13px;
        margin-bottom: 10px;
    }

    .count-bx p {
        font-size: 12px;
    }

    .industries-section .cs_case_study_1_list {
        display: flex;
        flex-wrap: wrap;
    }

    .industries-section .cs_case_study_1_list > .cs_case_study.cs_style_1 {
        flex: 0 0 50%;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 300px;
    }

    .industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover {
        flex: 0 0 50%;
    }

    .industries-section .content-area1 {
        padding: 12px;
    }

    .industries-section .content-area1 a {
        font-size: 13px;
    }

    .contact-section .contact-info {
        position: relative;
        width: 100%;
        height: auto;
        padding: 30px 25px;
    }

    .contact-section .contact-info p {
        font-size: 14px;
    }

    footer {
        padding: 8% 0 0;
    }

    footer h4 {
        font-size: 14px;
        margin-bottom: 25px;
    }

    footer p,
    footer p a {
        font-size: 11px;
    }

    .about-banner-section .text {
        padding: 25px 5%;
    }

    .about-banner-section .text h1 {
        font-size: 34px;
    }

    .about-banner-section .text p {
        font-size: 14px;
    }

    .about-section {
        padding: 8% 0;
    }

    .about-section .about-title {
        font-size: 25px;
        margin-bottom: 40px;
    }

    .about-section p {
        font-size: 14px;
    }

    .about-section1 {
        padding: 8% 0 12%;
    }

    .about-section1 .text h2 {
        font-size: 28px;
    }

    .about-section1 .text p {
        font-size: 15px;
    }

    .about-section1 .about-img .about2 img {
        bottom: -10%;
    }

    .contact-page-banner {
        padding: 25% 0 12%;
    }

    .contact-page-banner h1 {
        font-size: 38px;
    }

    .contact-page-banner p {
        font-size: 16px;
    }

    .contact-form {
        padding: 8% 0;
    }

    .contact-form .section-heading {
        font-size: 30px;
    }

    .contact-form .form-control {
        padding: 12px;
        font-size: 15px;
    }

    .service-page-banner {
        padding: 25% 0 12%;
    }

    .service-page-banner h1 {
        font-size: 32px;
    }

    .service-page-banner p {
        font-size: 15px;
    }

    .service1 {
        padding: 8% 0;
    }

    .service1 .text {
        padding: 30px;
        margin: 5% 0 0;
    }

    .card1 {
        padding: 25px;
    }

    .card1 h3 {
        font-size: 16px;
    }

    .card1 p {
        font-size: 14px;
    }

    .service2 {
        padding-top: 10%;
    }

    .service2 .text {
        padding: 35px 25px;
    }

    .card2 {
        padding: 30px 25px;
    }

    .card2 h3 {
        font-size: 20px;
        margin-bottom: 25px;
    }
}


/* ---------------------------------------------------------
   MOBILE - 375px to 575px
   --------------------------------------------------------- */
@media (min-width: 375px) and (max-width: 575px) {

    #HeaderControl,
    #HeaderControl_C {
        height: 60px !important;
    }
        header img { width: 230px}
    .hero-banner {
        height: 500px;
        min-height: 500px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 75px;
    }

    .hero-top-title {
        font-size: 23px;
        max-width: 320px;
        margin-bottom: 12px;
    }

    .hero-red-box {
        width: 95vw;
        min-height: 125px;
        margin-left: -5%;
        padding: 15px 20px 15px 5%;
    }

    .hero-red-box h2 {
        font-size: 29px;
    }

    .heading h2 {
        font-size: 25px;
    }

    .heading p {
        font-size: 14px;
    }

    .sub-heading {
        font-size: 21px;
    }

    .sub-heading1 {
        font-size: 18px;
    }

    .sub-heading3 {
        font-size: 16px;
    }

    .heading1 {
        font-size: 29px;
    }

    .heading2 {
        font-size: 21px;
    }

    .font1 {
        font-size: 14px;
    }

    .custom-btn {
        padding: 9px 18px;
        font-size: 13px;
    }

    .custom-btn1 {
        padding: 10px 20px;
        font-size: 13px;
    }

    .why-choose-us {
        padding: 8% 12px;
    }

    .why-choose-us .text-bg {
        font-size: 32px;
        margin-bottom: 8px;
    }

    .why-choose-us p {
        font-size: 13px;
    }

    .service-section {
        padding-top: 10%;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 18px;
    }

    .service-section .ser-card .ser-details {
        padding: 12px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 11px;
    }

    .count-bx {
        padding: 13px 15px;
        border-radius: 30px;
    }
    .count-bx::after { border-radius: 30px}
    .count-bx h4 {
        font-size: 34px;
    }

    .count-bx h3 {
        font-size: 12px;
    }

    .count-bx p {
        font-size: 14px;
    }

    .industries-section .cs_case_study_1_list > .cs_case_study.cs_style_1 {
        flex: 0 0 50%;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 250px;
    }

    .industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover {
        flex: 0 0 50%;
    }
    .industries-section .cs_case_study_1_list { display: block}
    .industries-section .content-area1 {
        padding: 10px;
    }

    .industries-section .content-area1 a {
        font-size: 12px;
    }

    .contact-section .contact-info {
        width: 100%;
        padding: 25px 18px;
    }

    .contact-section .contact-info p {
        font-size: 13px;
    }

    footer {
        padding-top: 10%;
    }

    footer h4 {
        font-size: 13px;
        margin-bottom: 22px;
    }

    footer p,
    footer p a {
        font-size: 10px;
    }

    .about-banner-section .text {
        padding: 20px 5%;
    }
    .about-banner-section img { height: 300px; object-fit: cover; }
    .about-banner-section .text img { height: 14px}
    .about-banner-section .text h1 {
        font-size: 22px;
    }

    .about-banner-section .text p {
        font-size: 13px;
    }

    .about-section .about-title {
        font-size: 22px;
    }

    .about-section p {
        font-size: 13px;
    }

    .about-section1 .text h2 {
        font-size: 25px;
    }

    .about-section1 .text p {
        font-size: 14px;
    }

    .contact-page-banner {
        padding: 30% 0 15%;
    }

    .contact-page-banner h1 {
        font-size: 32px;
    }

    .contact-page-banner p {
        font-size: 14px;
    }

    .contact-form .section-heading {
        font-size: 26px;
    }

    .contact-form .form-control {
        padding: 11px;
        font-size: 14px;
    }

    .service-page-banner {
        padding: 30% 0 15%;
    }

    .service-page-banner h1 {
        font-size: 28px;
    }

    .service-page-banner p {
        font-size: 14px;
    }

    .service1 .text {
        padding: 25px 20px;
        margin: 5% 0 0;
    }

    .card1 {
        padding: 22px 20px;
    }

    .card1 h3 {
        font-size: 15px;
    }

    .card1 p {
        font-size: 13px;
    }

    .service2 .text {
        padding: 30px 20px;
    }

    .card2 {
        padding: 25px 20px;
    }

    .card2 h3 {
        font-size: 18px;
        margin-bottom: 22px;
    }
}


/* ---------------------------------------------------------
   SMALL MOBILE - 320px to 374px
   --------------------------------------------------------- */
@media (max-width: 374px) {

    #HeaderControl,
    #HeaderControl_C {
        height: 65px !important;
    }

    header img { width: 250px; padding: 5px 0}
    .hero-banner {
        height: 420px;
        min-height: 420px;
    }

    .hero-content {
        padding-left: 5%;
        padding-top: 90px;
    }

    .hero-top-title {
        font-size: 20px;
        max-width: 280px;
        margin-bottom: 10px;
    }

    .hero-red-box {
        width: 90vw;
        min-height: 110px;
        margin-left: -6%;
        padding: 12px 15px 12px 5%;
    }

    .hero-red-box h2 {
        font-size: 21px;
        line-height: 1.3;
    }

    .heading h2 {
        font-size: 22px;
        margin: 0 0 14px 0;
    }

    .heading p {
        font-size: 14px;
        line-height: 1.4;
    }

    .sub-heading {
        font-size: 19px;
    }

    .sub-heading1 {
        font-size: 17px;
    }

    .sub-heading3 {
        font-size: 15px;
    }

    .heading1 {
        font-size: 24px;
    }

    .heading2 {
        font-size: 19px;
    }

    .font1 {
        font-size: 13px;
    }

    .custom-btn {
        padding: 8px 16px;
        font-size: 12px;
    }

    .custom-btn1 {
        padding: 9px 17px;
        font-size: 12px;
    }

    .why-choose-us {
        padding: 9% 10px;
    }

    .why-choose-us .text-bg {
        font-size: 27px;
        margin-bottom: 7px;
    }

    .why-choose-us p {
        font-size: 12px;
    }

    .service-section {
        padding-top: 10%;
    }

    .service-section .ser-card .ser-content .ser-heading h3 {
        font-size: 18px;
    }

    .service-section .ser-card .ser-details {
        padding: 10px;
    }

    .service-section .ser-card .ser-details h3 {
        font-size: 14px;
        margin-bottom: 6px;
    }

    .service-section .ser-card .ser-details p {
        font-size: 10px;
    }

    .count-bx {
        padding: 20px;
        border-radius: 25px;
    }
    .count-bx::after { border-radius: 25px}

    .count-bx h4 {
        font-size: 28px;
    }

    .count-bx h3 {
        font-size: 11px;
    }

    .count-bx p {
        font-size: 12px;
    }

    .industries-section .cs_case_study_1_list > .cs_case_study.cs_style_1 {
        flex: 0 0 50%;
    }

    .industries-section .cs_case_study.cs_style_1 {
        height: 220px;
    }

    .industries-section .cs_case_study_1_list .cs_case_study.cs_style_1:hover {
        flex: 0 0 50%;
    }

    .industries-section .cs_case_study_1_list { display: block}
    .industries-section .content-area1 {
        padding: 25px 15px;
    }

    .industries-section .content-area1 a {
        font-size: 20px;
    }

    .contact-section .contact-info {
        position: relative;
        width: 100%;
        height: auto;
        padding: 20px 15px;
        backdrop-filter: blur(0px);
    }

    .contact-section .contact-info p {
        font-size: 12px;
    }

    footer {
        padding-top: 12%;
    }

    footer h4 {
        font-size: 12px;
        margin-top: 15px;
        margin-bottom: 20px;
    }

    footer p,
    footer p a {
        font-size: 12px;
    }

    .about-banner-section .text {
        padding: 18px 5%;
    }

    .about-banner-section img { height: 300px; object-fit: cover}
    .about-banner-section .text h1 {
        font-size: 21px;
    }
    .about-banner-section .text img { height: 12px}
    .about-banner-section .text p {
        font-size: 12px;
    }

    .about-section .about-title {
        font-size: 18px;
    }

    .about-section p {
        font-size: 12px;
    }

    .about-section1 .text h2 {
        font-size: 23px;
    }

    .about-section1 .text p {
        font-size: 13px;
    }

    .contact-page-banner {
        padding: 32% 0 16%;
    }

    .contact-page-banner h1 {
        font-size: 28px;
    }

    .contact-page-banner p {
        font-size: 13px;
    }

    .contact-form .section-heading {
        font-size: 23px;
    }

    .contact-form .form-control {
        padding: 10px;
        font-size: 13px;
    }

    .service-page-banner {
        padding: 32% 0 16%;
    }

    .service-page-banner h1 {
        font-size: 25px;
    }

    .service-page-banner p {
        font-size: 13px;
    }

    .service1 .text {
        padding: 20px 15px;
        margin: 5% 0 0;
    }

    .card1 {
        padding: 20px 15px;
    }

    .card1 h3 {
        font-size: 14px;
    }

    .card1 p {
        font-size: 12px;
    }

    .service2 .text {
        padding: 25px 15px;
    }

    .card2 {
        padding: 20px 15px;
    }

    .card2 h3 {
        font-size: 17px;
    }
}


/* ---------------------------------------------------------
   GENERAL MOBILE FIXES
   --------------------------------------------------------- */

@media (max-width: 767px) {

    /* Prevent oversized content from creating horizontal scroll */
    .container,
    .container-fluid {
        max-width: 100%;
    }

    img,
    video {
        max-width: 100%;
    }

    /* About image section */
    .about-section1 .about-img {
        margin-bottom: 60px;
    }

    .about-section1 .about-img .circle-button {
        transform: scale(.75);
    }

    /* Ethos */
    .our-ethos .num {
        width: 20%;
    }

    .our-ethos .text {
        width: 80%;
    }

    .our-ethos .num p {
        width: 50px;
        height: 50px;
        font-size: 18px;
        line-height: 2.7;
    }

    .our-ethos .text p {
        font-size: 14px;
    }

    .our-ethos .text h4 {
        font-size: 14px;
    }

    /* Office */
    .office-bx {
        min-height: auto;
        background-attachment: scroll;
        padding: 10% 0;
    }

    .office-bx .office-address {
        padding: 25px 20px;
        border-radius: 15px;
    }

    .office-bx .office-address h3 {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .office-bx .office-address h4 {
        font-size: 17px;
    }

    .office-bx .office-address p,
    .office-bx .office-address p a {
        font-size: 14px;
    }

    /* Service background */
    .service2 {
        background-attachment: scroll;
    }

    /* Footer social icons */
    footer .social-icon a {
        width: 30px;
        height: 30px;
        font-size: 11px;
        line-height: 2.7;
    }

    /* Don't allow fixed desktop widths */
    .service-section .ser-card .ser-content,
    .service-section .ser-card .ser-details {
        width: 100%;
        min-width: 100%;
    }
}


/* ---------------------------------------------------------
   MOBILE LANDSCAPE
   --------------------------------------------------------- */

@media (max-width: 767px) and (orientation: landscape) {

    .hero-banner {
        height: 500px;
        min-height: 500px;
    }

    .hero-content {
        padding-top: 80px;
    }

    .hero-top-title {
        font-size: 23px;
    }

    .hero-red-box {
        min-height: 120px;
    }

    .hero-red-box h2 {
        font-size: 28px;
    }
}

.navbar-nav .menu-icon {display: block;margin: 0 auto 5px auto;width: 26px;}
#submenu1 > li:nth-child(3)::before, #submenu1 > li:nth-child(4)::before, #submenu1 > li:nth-child(5)::before{
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-image: url("image/DGFT-Services.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin: 0 auto 3px auto;
}
#submenu1 > li:nth-child(4)::before{
    background-image: url("image/Customs-Service.png");
}
#submenu1 > li:nth-child(5)::before{
    background-image: url("image/Export-Incentive.png");
}

.industry-card { overflow: hidden; border-radius: 10px; position: relative; margin: 12px 0;}
.industry-card .pic img { filter: brightness(90%); transition: all .5s ease-in-out;}
.industry-card .pic img:hover { transform: scale(1.1);}
.industry-card .industy-name { position: absolute; bottom: 0; left: 0; width: 100%; padding: 20px; background-image: linear-gradient(1deg, black, transparent);}
.industry-card .industy-name h2 { color: #fff; margin: 0; font-size: 29px; font-weight: 600; letter-spacing: .6px;} 

.service-tabs .nav-pills { border: 1px solid #c4c4c4; }
.service-tabs .nav-pills .nav-item { margin: 0;}
.service-tabs .nav-pills .nav-item  .nav-link {border-right: 1px solid #c4c4c4;border-radius: 0;min-width: 190px;max-width: 220px;height: 100%;text-align: start;padding: 12px 24px;color: #14181c;font-size: 19px;font-weight: 600;line-height: 1.4;}
.service-tabs .nav-pills .nav-link.active, .nav-pills .show>.nav-link { background: #ff0000; color: #fff}

        .export-section {
            padding: 2% 0;
        }

        .export-row {
            display: flex;
            gap: 20px;
        }

        .export-card {
            flex: 1;
            background: #ffffff;
            border-radius: 7px;
            text-align: center;
            padding: 24px 24px 25px;

            box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.13);

            min-height: 252px;

            transition: all 0.3s ease;
        }

        .export-card:hover {
            transform: translateY(-4px);
            box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.17);
        }

        /* Stars */
        .rating {
            height: 32px;
            margin-bottom: 10px;
            white-space: nowrap;
        }

        .rating .fa {
            font-size: 17px;
            margin: 0 1px;
        }

        .rating .active {
            color: #fbbf24;
        }

        .rating .inactive {
            color: #d5dce5;
        }

        /* Title */
        .export-title {
            font-size: 18px;
            font-weight: 600;
            color: #111111;
            margin: 0 0 17px;
            line-height: 1.3;
        }

        /* Amount */
        .export-amount {
            font-size: 24px;
            font-weight: 700;
            color: #ff0000;
            margin-bottom: 10px;
            line-height: 1.2;
        }
        .export-amount i { font-size: 20px; margin: 0 5px 0 0}

        /* Description */
        .export-description {
            font-size: 15px;
            color: #304f75;
            margin-bottom: 16px;
        }

        /* Divider */
        .export-divider {
            border: 0;
            border-top: 1px solid #dce1e7;
            margin: 0 0 19px;
        }

        /* Bottom text */
        .export-obligation {
            font-size: 15px;
            color: #173b5f;
            margin: 0;
        }


        /* ========================================
           RESPONSIVE
        ======================================== */

        @media (max-width: 1199px) {

            .export-row {
                flex-wrap: wrap;
            }

            .export-card {
                flex: 0 0 calc(50% - 12px);
            }
        }


        @media (max-width: 767px) {

            .export-section {
                padding: 20px 15px;
            }

            .export-row {
                display: block;
            }

            .export-card {
                width: 100%;
                margin-bottom: 22px;
                min-height: auto;
            }

            .export-title {
                font-size: 19px;
            }

            .export-amount {
                font-size: 25px;
            }
        }


                /* Main Box */
        .weightage-box {
            max-width: 1505px;
            margin: 1% 0 0 0;
            padding: 30px 32px 28px;
            background: #ffffff;
            border-radius: 9px;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.13);
        }


        /* Intro Text */



        /* Category Box */
        .category-box {
            background: #ebeced;
            border-radius: 8px;
            min-height: 124px;
            padding: 28px 24px;
            display: flex;
            align-items: flex-start;
        }


        /* Check Circle */
        .category-icon {
            width: 35px;
            height: 35px;
            min-width: 35px;
            border-radius: 50%;
            background: #ff0000;
            color: #ffffff;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 16px;
        }

        .category-icon .fa {
            font-size: 15px;
        }


        /* Category Content */
        .category-content {
            padding-top: 0;
        }


        /* Category Heading */
        .category-title {
            margin: 0 0 8px;

            font-size: 18px;
            line-height: 1.35;

            font-weight: 600;

            color: #111111;
        }


        /* Category Description */
        .category-description {
            margin: 0;

            font-size: 15px;
            line-height: 1.5;

            color: #294c76;
        }


       


        /* =========================
           TABLET
        ========================= */

        @media (max-width: 991px) {

            .weightage-box {
                margin: 30px 20px;
                padding: 25px;
            }

            .category-box {
                min-height: 120px;
            }

        }


        /* =========================
           MOBILE
        ========================= */

        @media (max-width: 767px) {

            .weightage-box {
                margin: 20px 15px;
                padding: 20px 18px;
            }

            .weightage-intro {
                font-size: 15px;
                margin-bottom: 20px;
            }

            .category-box {
                min-height: auto;
                padding: 22px 18px;
                margin-bottom: 15px;
            }

            .category-title {
                font-size: 17px;
            }

            .category-description {
                font-size: 14px;
            }

            .weightage-notes {
                margin-top: 20px;
            }

            .weightage-note {
                font-size: 14px;
            }

        }

                /* =========================
           CARD
        ========================= */

        .rule-card {
            min-height: 285px;
            background: #ffffff;
            border-radius: 7px;
            padding: 24px 27px 25px;
            text-align: center;
            box-shadow: 0 7px 17px rgba(0, 0, 0, 0.12);
            transition: all 0.3s ease;
        }

        .rule-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 11px 22px rgba(0, 0, 0, 0.16);
        }


        /* =========================
           ICON CIRCLE
        ========================= */

        .rule-icon {
            width: 64px;
            height: 64px;

            margin: 0 auto 27px;

            border-radius: 50%;

            /* Original light blue replaced */
            background: #ffe5e5;

            display: flex;
            align-items: center;
            justify-content: center;
        }

        .rule-icon .fa {
            font-size: 27px;

            /* Blue replaced with red */
            color: #ff0000;
        }


        /* =========================
           TITLE
        ========================= */

        .rule-title {
            margin: 0 0 17px;

            font-size: 20px;
            line-height: 1.3;

            font-weight: 600;

            color: #111111;
        }



        /* =========================
           RESPONSIVE
        ========================= */

        @media (max-width: 1199px) {

            .rules-container {
                padding-left: 25px;
                padding-right: 25px;
            }

            .rule-card {
                height: auto;
                min-height: 276px;
            }
        }


        @media (max-width: 767px) {

            .rules-section {
                padding: 25px 15px 35px;
            }

            .rules-container {
                padding: 0;
            }

            .rule-card {
                min-height: auto;
                padding: 25px 20px 30px;
                margin-bottom: 20px;
            }

            .rule-icon {
                margin-bottom: 22px;
            }

            .rule-title {
                font-size: 19px;
            }
        }

           /* =========================================
           SECTION
        ========================================= */

        .application-process {
            padding: 37px 0;
        }


        /* =========================================
           MAIN CONTAINER
        ========================================= */

        .process-container {
            max-width: 1530px;
            margin: 0 auto;
        }


        /* =========================================
           CARD
        ========================================= */

        .process-card {
            background: #ffffff;
            border-radius: 7px;
            /* height: 300px; */
            padding: 23px 28px 25px;
            box-shadow:
                0 7px 15px rgba(0, 0, 0, 0.12);
            transition: all 0.3s ease;
        }

        .process-card:hover {
            transform: translateY(-3px);

            box-shadow:
                0 10px 20px rgba(0, 0, 0, 0.16);
        }


        /* =========================================
           NUMBER CIRCLE
        ========================================= */

        .step-number {
            width: 49px;
            height: 49px;

            margin: 0 auto 18px;

            border-radius: 50%;

            background: #ff0000;

            color: #ffffff;

            display: flex;
            align-items: center;
            justify-content: center;

            font-size: 18px;
            font-weight: 700;
        }


        /* =========================================
           CARD TITLE
        ========================================= */

        .process-title {
            margin: 0 0 20px;
            text-align: center;
            color: #111111;
            font-size: 18px;
            font-weight: 600;
            line-height: 1.3;
        }


        /* =========================================
           LIST
        ========================================= */

        .process-list {
            list-style: none;

            margin: 0;
            padding: 0;
        }


        .process-list li {
            position: relative;

            padding-left: 22px;

            margin-bottom: 14px

            font-size: 15.5px;

            line-height: 1.55;
        }


        .process-list li:last-child {
            margin-bottom: 0;
        }


        /* =========================================
           FONT AWESOME ARROW
        ========================================= */

        .process-list li .arrow {
            position: absolute;
            left: 0;
            top: 4px;
            color: #ff0000;
            font-size: 18px;
        }

        /* =========================================
           TABLET
        ========================================= */

        @media (max-width: 1199px) {

            .process-container {
                padding-left: 20px;
                padding-right: 20px;
            }

            .process-card {
                height: auto;
                min-height: 300px;
            }

        }


        /* =========================================
           MOBILE
        ========================================= */

        @media (max-width: 767px) {

            .application-process {
                padding: 25px 15px;
            }

            .process-container {
                padding: 0;
            }

            .process-card {
                min-height: auto;

                height: auto;

                margin-bottom: 20px;

                padding: 23px 22px 25px;
            }

            .process-title {
                font-size: 19px;
            }

            .process-list li {
                font-size: 15px;
            }

        }


.faq-section .accordion-item {border: 0;margin: 0 0 14px 0;}
.faq-section .accordion-header {background: #e3e4e5;}
.faq-section .accordion-button {background: #e3e4e5 !important;padding: 22px;letter-spacing: .5px;font-size: 18px;font-weight: 500 !important;font-family: "Inter", sans-serif;line-height: 1.4em;color: #14181c !important;margin: 10px 0 0 0}
.faq-section .accordion-button:not(.collapsed) {background: #141e2a !important; color: #fff !important}
.faq-section .accordion-button:focus { border-color: transparent !important; box-shadow: none !important;}
.faq-section .accordion-body { padding: 0; background-color: #ebebeb;}
.faq-section .accordion-body .right-content { padding: 30px 50px;}
.faq-section .accordion-body .right-content p, .faq-section .accordion-body .right-content li { color: #2c2b2b; font-size: 15px; letter-spacing: .3px; line-height: 1.5;}

.Duty-Credit-Script-title {text-align: center;color: #ff0000;text-transform: uppercase;font-weight: 600;letter-spacing: .8px;font-size: 18px; margin: 0 0 7px 0}
.Duty-Credit-Script .main-heading { color: #141e2a;font-weight: 700;font-size: 54px;line-height: 1.2;margin: 0 0 20px 0; text-align: center; margin: 0 0 40px 0}
.Duty-Credit-Script .main-heading span { position: relative}
.Duty-Credit-Script .main-heading span::after { content: ''; position: absolute; width: 102%; height: 15px; background: #ff0000; bottom: 10px; left: -1%; border-radius: 10px; opacity: .25}
.Duty-Credit-Script p { font-size: 18px;}

.import-export-form .form-control {padding: 14px;margin: 0 0 14px 0;border-radius: 10px;}
.import-export-form label {color: #141e2a;font-weight: 600;font-size: 16px;margin: 3px;}
.import-export-form input[type='button'] { background: #ff0000; border: 0; padding: 14px 38px; color: #fff; font-weight: 400; font-size: 18px; border-radius: 10px} 


.rodtep-cta-section {
        background: #f1f3f8;
    }

    .rodtep-cta-banner {
        position: relative;
        min-height: 410px;
        border-radius: 15px;
        overflow: hidden;

        /* Replace this image with your actual background image */
        background: linear-gradient(90deg, rgb(255 0 0 / 16%) 0%, rgb(255 0 0 / 20%) 32%, rgb(255 0 0 / 20%) 65%, rgba(8, 22, 45, 0.80) 100%), url(image/about-banner.jpg);
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .rodtep-cta-overlay {
        position: absolute;
        inset: 0;

        background:
            linear-gradient(
                90deg,
                rgba(90, 101, 184, 0.20),
                rgba(34, 62, 120, 0.10)
            );
    }

    .rodtep-cta-content {
        position: relative;
        z-index: 2;
        width: 100%;
        text-align: center;
        color: #ffffff;
    }

    .rodtep-cta-title {
        margin: 0 0 10px;
        font-size: 40px;
        line-height: 1.35;
        font-weight: 700;
        color: #ffffff;
        margin: 0 0 20px 0;
    }



    .rodtep-cta-text strong {
        font-weight: 700;
    }

    .rodtep-btn-call{
        min-width: 205px;
        height: 43px;
        padding: 8px 20px;
        border-radius: 25px;
        font-size: 16px;
        line-height: 25px;
        transition: all 0.3s ease;
    }

    .rodtep-btn-call {
        color: #ffffff;
        background: transparent;
        border: 2px solid #ffffff;
    }

    .rodtep-btn-call:hover {
        color: #ffffff;
        background: rgba(255, 255, 255, 0.15);
        border-color: #ffffff;
    }


    .rodtep-arrow {
        display: inline-block;
        margin-left: 8px;
        font-size: 25px;
        line-height: 15px;
        vertical-align: -2px;
    }


    /* Tablet */
    @media (max-width: 991.98px) {

        .rodtep-cta-banner {
            min-height: 380px;
        }

        .rodtep-cta-title {
            font-size: 32px;
        }

        .rodtep-cta-text {
            font-size: 16px;
        }
    }


    /* Mobile */
    @media (max-width: 575.98px) {

        .rodtep-cta-section {
            padding-top: 25px !important;
            padding-bottom: 25px !important;
        }

        .rodtep-cta-banner {
            min-height: 440px;
            border-radius: 12px;
        }

        .rodtep-cta-content {
            padding: 30px 18px;
        }

        .rodtep-cta-title {
            font-size: 27px;
            line-height: 1.3;
        }

        .rodtep-cta-text {
            font-size: 15px;
            line-height: 1.5;
        }

       
    }

/* ================================
   SERVICE TABS - RESPONSIVE
================================ */

.service-tabs .nav-pills {
    border: 1px solid #c4c4c4;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

.service-tabs .nav-pills .nav-item {
    margin: 0;
    flex: 1 1 auto;
}

.service-tabs .nav-pills .nav-item .nav-link {
    border-right: 1px solid #c4c4c4;
    border-radius: 0;
    width: 100%;
    min-width: 190px;
    max-width: 220px;
    height: 100%;
    text-align: start;
    padding: 12px 24px;
    color: #14181c;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.4;
    background: #fff;
}

.service-tabs .nav-pills .nav-item:last-child .nav-link {
    border-right: 0;
}

.service-tabs .nav-pills .nav-link.active,
.service-tabs .nav-pills .show > .nav-link {
    background: #ff0000;
    color: #fff;
}


/* =================================
   LARGE DESKTOP
   1200px and above
================================= */

@media (min-width: 1200px) {

    .service-tabs .nav-pills {
        flex-wrap: nowrap;
    }

    .service-tabs .nav-pills .nav-item {
        flex: 1 1 0;
    }

    .service-tabs .nav-pills .nav-item .nav-link {
        min-width: 0;
        max-width: none;
        width: 100%;
    }

}


/* =================================
   LAPTOP / DESKTOP
   992px - 1199px
================================= */

@media (min-width: 992px) and (max-width: 1199.98px) {

    .service-tabs .nav-pills .nav-item {
        flex: 1 1 20%;
    }

    .service-tabs .nav-pills .nav-item .nav-link {
        min-width: 0;
        max-width: none;
        width: 100%;
        padding: 11px 16px;
        font-size: 17px;
    }

}


/* =================================
   TABLET
   768px - 991px
================================= */

@media (min-width: 768px) and (max-width: 991.98px) {

    .service-tabs .nav-pills {
        flex-wrap: wrap;
    }

    .service-tabs .nav-pills .nav-item {
        flex: 1 1 33.333%;
    }

    .service-tabs .nav-pills .nav-item .nav-link {
        min-width: 0;
        max-width: none;
        width: 100%;
        padding: 11px 15px;
        font-size: 16px;
    }

}


/* =================================
   MOBILE
   Below 768px
================================= */

@media (max-width: 767.98px) {

    .service-tabs .nav-pills {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        width: 100%;
    }

    .service-tabs .nav-pills .nav-item {
        width: 100%;
        flex: 0 0 auto;
    }

    .service-tabs .nav-pills .nav-item .nav-link {
        width: 100%;
        min-width: 0;
        max-width: none;
        border-right: 0;
        border-bottom: 1px solid #c4c4c4;
        padding: 11px 16px;
        font-size: 16px;
        line-height: 1.35;
        text-align: left;
    }

    .service-tabs .nav-pills .nav-item:last-child .nav-link {
        border-bottom: 0;
    }

}


/* =================================
   SMALL MOBILE
   Below 576px
================================= */

@media (max-width: 575.98px) {

    .service-tabs .nav-pills .nav-item .nav-link {
        padding: 10px 14px;
        font-size: 15px;
        line-height: 1.3;
    }

}


/* =================================
   EXTRA SMALL MOBILE
   Below 400px
================================= */

@media (max-width: 399.98px) {

    .service-tabs .nav-pills .nav-item .nav-link {
        padding: 9px 12px;
        font-size: 14px;
    }

}