/* Add styles for loading screen */
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f15523;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    opacity: 1;
}

#loading-text {
    width: 163px;
    aspect-ratio: 1;
    display: grid;
    position: relative;
}

    #loading-text:before,
    #loading-text:after {
        content: '';
        grid-area: 1/1;
        --c: #0000 calc(100% / 3), #fff 0 calc(2 * 100% / 3), #0000 0;
        --c1: linear-gradient(90deg, var(--c));
        --c2: linear-gradient(0deg, var(--c));
        background: var(--c1), var(--c2), var(--c1), var(--c2);
        background-size: 300% 6px, 6px 300%;
        background-repeat: no-repeat;
        animation: l11 1s infinite linear;
    }

    #loading-text:after {
        margin: 20px;
        transform: scaleX(-1);
        animation-delay: -0.25s;
    }

    #loading-text img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 90px;
        height: 92px;
    }

@keyframes l11 {
    0% {
        background-position: 50% 0, 100% 100%, 0 100%, 0 0;
    }

    25% {
        background-position: 0 0, 100% 50%, 0 100%, 0 0;
    }

    50% {
        background-position: 0 0, 100% 0, 50% 100%, 0 0;
    }

    75% {
        background-position: 0 0, 100% 0, 100% 100%, 0 50%;
    }

    75.01% {
        background-position: 100% 0, 100% 0, 100% 100%, 0 50%;
    }

    100% {
        background-position: 50% 0, 100% 0, 100% 100%, 0 100%;
    }
}



* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: "DM Sans", sans-serif !important;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

/* For modern browsers */
html,
body {
    /* overflow: auto; */
    /* Allows scrolling */
    scrollbar-width: none;
    touch-action: manipulation;
    /* For Firefox */
}

    /* For Chrome, Safari, and Edge */
    html::-webkit-scrollbar,
    body::-webkit-scrollbar {
        display: none;
    }

html {
    scroll-behavior: smooth;
}

.container_body {
    position: relative;
    width: 100%;
    height: 100%;
    /* display: none; */
}

.container_body_scroll {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 100%;
    will-change: transform;
    /* background: #000000; */
}

.mainContainer {
    width: 100%;
    max-width: 100%;
    /* Ensure it doesn't exceed the viewport width */
    margin: 0 auto;
    /* Center the container */
    padding: 0 5px;
    /* Optional padding to add some space on the sides */
    box-sizing: border-box;
    overflow-x: hidden;
}
/* #loader {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #f15523;
    display: flex;
    justify-content: center;
    align-items: center;
  } */


.techflow_new_topSection_services {
    align-items: center;
    /* height: 300px; */
    display: flex;
    margin-top: 4%;
    background: linear-gradient( to bottom right, #d3d3d3 40%, #ffffff 90%, transparent 50% );
    position: relative;
}

.techflow_new_topSection_services_ani {
    position: absolute;
    left: 0;
    bottom: 0;
}

.techflow_new_topSection_services_anix {
    width: 200px;
}

.techflow_new_topSection_servicesTopborder_right {
    border-right: 1px solid #b7bac1;
}

.topSectionContent1Text {
    width: 80%;
    font-size: 2.1rem;
    font-weight: 600;
    /* padding-top: 10%; */
    color: #5c5c5c;
    /* line-height: 3.1vw; */
}

#topSectionContent1TextSpan {
    color: #f15523 !important;
}

.techflow_new_topSection_servicesTopborder_left {
    padding-left: 30px !important;
}

.techflow_new_topSection_services_topSectionContent3Text {
    margin-top: 1rem;
    /* width: 80%; */
    /* font-size: 3.9vw; */
    color: #5c5c5c;
    text-align: left;
}

.topSectionContent3TextSpan {
    font-weight: 700;
}

@media (max-width: 575.98px) {
    .topSectionContent1Text {
        font-size: 1.2rem;
        font-weight: 600;
        padding-top: 15%;
        color: #f15523;
        text-align: center;
        /* line-height: 7.1vw; */
        width: 100%;
    }
}

@media (max-width: 668px) {

    .techflow_new_topSection_servicesTopborder_right {
        border-right: none;
    }

    .techflow_new_topSection_servicesTopborder_left {
        padding-left: 10px !important;
    }
}

.topSection {
    display: flex;
    margin-top: 4%;
    background: linear-gradient( to bottom right, #d3d3d3 40%, #ffffff 90%, transparent 50% );
    position: relative;
}

.topSectionSideImgStyle {
    width: 67%;
    margin-top: 24%;
}

.topSectionContent {
    display: flex;
    justify-content: space-between;
}

/* .topSectionContent1 {
  width: 41%;
} */

/* .topSectionContent1Text {
  font-size: 2.6vw;
  font-weight: 600;
  padding-top: 15%;
  color: #f15523;
  line-height: 3.1vw;
} */

#topSectionContent1TextSpan {
    color: #535353;
}

.topSectionContent3TextSpan {
    font-weight: 700;
}

.topSectionContent2 {
    width: 10%;
}

.topSectionContent3 {
    width: 53%;
    padding-top: 8%;
}

.topSectionContent3Text {
    width: 68%;
    font-size: 0.9vw;
    color: #5c5c5c;
}

.topSectionSideImg {
    width: 27%;
}

#content {
    display: none;
}

.award {
    perspective: 1000px; /* 3D perspective */
    display: flex;
    justify-content: center;
    align-items: center;
}

.socialSec {
    position: fixed;
    z-index: 1000;
}

.social-sidebar {
    position: fixed;
    /* z-index: 1000; */
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background-color: #f4f4f4;
    padding: 7px;
    border-radius: 11px 0px 0px 11px;
    border: 4px solid #d3d3d3;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

    .social-sidebar ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .social-sidebar ul li {
            margin: 0px -25px 10px 0px;
            width: 50px;
        }
            /* .social-sidebar ul li a {
    text-decoration: none;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: #555;
    border-radius: 50%;
  } */
            .social-sidebar ul li a i {
                font-size: 20px;
                color: white;
            }

.follow-text {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: 16px;
    color: #333;
    /* margin-bottom: 20px; */
    text-align: center;
    margin-left: 22%;
    font-weight: 600;
}

/* Popup box styles */
.popup-box {
    display: none;
    position: fixed;
    top: 54%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #e8e8e8;
    /* padding: 20px; */
    border-radius: 26px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    /* width: 300px; */
    text-align: center;
}

.popup-box1 {
    display: none;
    position: absolute;
    top: 50%;
    left: 78%;
    transform: translate(-50%, -50%);
    background-color: #e8e8e8;
    /* padding: 20px; */
    border-radius: 26px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    /* width: 300px; */
    text-align: center;
}

.popup-box2 {
    display: none;
    position: absolute;
    top: 60%;
    left: 124%;
    transform: translate(-50%, -50%);
    background-color: #e8e8e8;
    /* padding: 20px; */
    border-radius: 26px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    /* width: 300px; */
    text-align: center;
}

.pop-up-container {
    width: 37rem;
    /* height: 30rem; */
    gap: 1rem;
    padding: 12px;
}

.pop-up-container1 {
    width: 37rem;
    /* height: 30rem; */
    gap: 1rem;
    padding: 12px;
}
/* Overlay styles */
.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.6); */
    z-index: 999;
}

.overlay1 {
    position: relative;
}

.flag {
    width: 90%;
    margin: 12rem auto 0 auto;
}

.left-div h3 {
    color: #f15523;
    margin-bottom: 0 !important;
    font-weight: 600;
}

.div-2nd-line {
    width: 90%;
    margin: 0 auto;
    margin-top: 1rem;
}

.left-div p {
    color: white;
}

.right-div {
    align-content: center;
    cursor: pointer;
}

    .right-div a:hover {
        cursor: pointer;
        background-color: #717171;
        border-radius: 50%;
        /* filter: blur(1px); */
    }

.left-div a:hover {
    cursor: pointer;
    background-color: #545454;
    border-radius: 50%;
    /* filter: blur(1px); */
}

/* Close button styles */
.close-btn {
    border: none;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: -7%;
    right: -4%;
}

.close-btn1 {
    border: none;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: -7%;
    right: -4%;
}

.dubai-back {
    background-image: url(/assets/Rectangle\ 66-modified-modified.png);
    background-size: cover;
    height: 330px;
    border-radius: 20px;
}

.india-back {
    background-image: url(/assets/back-india-modified.png);
    background-size: cover;
    height: 330px;
    border-radius: 20px;
}

.awardInner {
    width: 100%;
    height: 61%;
    border-radius: 50%; /* Make it circular */
    position: relative;
    transform-style: preserve-3d; /* Enable 3D transforms */
    overflow: hidden;
}

#loader {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #f15523;
    display: flex;
    justify-content: center;
    align-items: center;
}

.loader {
    width: 163px; /* Increased loader size */
    aspect-ratio: 1;
    display: grid;
    position: relative;
}

    .loader:before,
    .loader:after {
        content: "";
        grid-area: 1/1;
        --c: #0000 calc(100% / 3), #fff 0 calc(2 * 100% / 3), #0000 0;
        --c1: linear-gradient(90deg, var(--c));
        --c2: linear-gradient(0deg, var(--c));
        background: var(--c1), var(--c2), var(--c1), var(--c2);
        background-size: 300% 6px, 6px 300%; /* Adjusted background size to match the larger loader */
        background-repeat: no-repeat;
        animation: l11 1s infinite linear;
    }

    .loader:after {
        margin: 20px; /* Adjusted margin for larger size */
        transform: scaleX(-1);
        animation-delay: -0.25s;
    }

    .loader img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 90px; /* Increased image size */
        height: 92px;
        /* border-radius: 50%; Optional, to keep the image circular */
    }

@keyframes l11 {
    0% {
        background-position: 50% 0, 100% 100%, 0 100%, 0 0;
    }

    25% {
        background-position: 0 0, 100% 50%, 0 100%, 0 0;
    }

    50% {
        background-position: 0 0, 100% 0, 50% 100%, 0 0;
    }

    75% {
        background-position: 0 0, 100% 0, 100% 100%, 0 50%;
    }

    75.01% {
        background-position: 100% 0, 100% 0, 100% 100%, 0 50%;
    }

    100% {
        background-position: 50% 0, 100% 0, 100% 100%, 0 100%;
    }
}

/* navbar style------------------------------- */

.navbarr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #ffffff;
    position: fixed;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 2px 2px -2px #fff;
    top: 0;
}

.logoSection {
    display: flex;
    justify-content: space-between;
}

.hamburger {
    width: 2rem;
}

.hamburger {
    width: 25px;
    height: 2px;
    background-color: black;
    /* Set the hamburger color to black */
    transition: all 0.3s ease;
}

/* .logo img {
    width: 268px;
  } */
.logoSec {
    width: 44%;
}

.logo {
    width: 41%;
    position: relative;
    display: flex;
    justify-content: flex-end;
}

#logoImg {
    width: 100%;
}

/*.logoImgInner {
    position: absolute;
    right: 15%;
    top: 11%;
    width: 22%;
}*/

.logo .group60 {
    cursor: pointer;
    /* position: absolute; */
    width: 100%;
    /* left: 174px; */
    /* top: 7px; */
}

.nav-links {
    list-style: none;
    display: flex;
    /* margin: 0px auto; */
}

    .nav-links li {
        margin-top: 1rem;
        padding: 0rem 1.8rem;
    }

    .nav-links a {
        color: #565656;
        text-decoration: none;
        font-size: 0.9vw;
        font-weight: 500;
        border-bottom: 3px solid transparent;
        transition: border-color 0.5s, color 0.5s;
        cursor: pointer;
        padding-bottom: 12px;
    }

        .nav-links a:hover {
            color: #f15523;
            border-bottom: 3px solid #f15523;
        }

.topSection1 {
    width: 11%;
}

.topSection1Img {
    width: 80%;
    margin-top: 2.9rem;
}

#sideImg {
    width: 100%;
}

.topSection2 {
    width: 89%;
}

.bannerSec {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.bannerImgSec {
    width: 89.5%;
    position: relative;
    display: flex;
    justify-content: flex-end;
}

#bannerImg {
    width: 100%;
}

.bannerInner {
    position: absolute;
    display: flex;
    width: 75%;
    justify-content: space-between;
}

.bannerText {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 80px;
    font-weight: 600;
    color: #fff;
}

#bannerInnerImg {
    width: 26%;
    margin-top: 9px;
}

.bannerImgSec {
}

.topSection2Heading {
    text-align: center;
    margin-top: 6%;
}

.topSection2Content {
    display: flex;
    margin-top: 5%;
    justify-content: center;
}

.topSection2ContentImg {
    width: 30%;
}

.topSection2ContentImgStyle {
    width: 85%;
}

.topSection2ContentTextSection {
    width: 49%;
    padding: 1%;
}

.topSection2ContentTextStyle {
}

.topSection2ContentText {
    font-size: 0.9vw;
}

.topSection2ContentImgStyleBottom {
    display: flex;
    margin-top: 4%;
    width: 22%;
    justify-content: space-between;
}

.topSection2ContentImgStyleBottomImg {
    width: 44%;
}

.topSection2ContentImgStyleBottomText {
    font-size: 16px;
    font-weight: 600;
    color: #565656;
}

.topSection2Heading1 {
    font-size: 47px;
    line-height: 4px;
    font-weight: 600;
    color: #565656;
}

.topSection2Heading2 {
    font-size: 45px;
    color: #f15523;
    font-weight: 600;
}

.trainingStyle {
    display: flex;
    justify-content: center;
    background: linear-gradient(to bottom left, #ffffff, #ffffff 50%, #d3d3d3);
}

.trainingStyleImg {
    width: 80%;
    position: relative;
    display: flex;
    margin-bottom: 6%;
    margin-top: 4%;
}

.trainingStyleImgContent {
    position: absolute;
    top: 26%;
    left: 5%;
}

.trainingStyleImgContent1 {
    font-size: 2.6vw;
    color: #fff;
    font-weight: 600;
}

.trainingStyleImgContent2 {
    font-size: 0.9vw;
    width: 58%;
    color: #fff;
}

.teamTopImgSec {
    width: 35%;
}

#teamtopImg {
    width: 100%;
}

.teamImgSec {
    display: flex;
    width: 80%;
    justify-content: space-around;
    align-items: center;
}

.teamImgmainsec {
    display: flex;
    justify-content: center;
    margin-top: 4rem;
    padding-bottom: 78px;
}

#teamBacground {
    width: 100%;
}

.teamImg {
    width: 18%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.teamText {
    font-size: 3vw;
    font-weight: 700;
    text-align: center;
    color: #565656;
}

.teamImgText {
    position: absolute;
    top: 75%;
}

.teamImgText1 {
    font-size: 18px;
    font-weight: 600;
    color: #f15523;
}

.teamImgText2 {
    font-size: 12px;
}

.teamImgText p {
    margin-bottom: 0rem;
}

.navButton {
    width: 85px;
}

.buttonStyle {
    display: flex;
    margin: 0 auto;
    justify-content: space-evenly;
    margin-top: 30%;
    width: 14rem;
}

.coursesCrousalSec {
    width: 100%;
    position: relative;
}

.serviceCrousel {
    display: flex;
    position: relative;
    justify-content: flex-end;
}

.carouselInner {
    position: absolute;
    width: 100%;
    top: 2%;
}

.coursesCrousalSecInner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 4%;
}

.coursesCrousalSecInner1 {
    height: 29%;
}

.coursesCrousalSecInner2 {
    height: 30%;
    font-size: 4.4vw;
    font-weight: 600;
    color: #f16529;
}

.coursesCrousalSecInnerText1 {
    font-size: 1.4vw;
    font-weight: 500;
    color: #fff;
}

.coursesCrousalSecInnerText2 {
    font-size: 2.5vw;
    line-height: 7px;
    font-weight: 600;
    color: #fff;
}

#coursesCrousalSecInnerButton1 {
    width: 80%;
    height: 41px;
    background-color: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 6px;
    font-size: 0.9vw;
    color: #6c7176;
}

#coursesCrousalSecInnerButton12 {
    width: 80%;
    height: 41px;
    background-color: #f15523;
    border: 1px solid #f15523;
    border-radius: 6px;
    margin-top: 4%;
    font-size: 0.9vw;
    color: #fff;
}

.service-item {
    /* width: 100%; */
    position: relative;
}

.thirdSecImag {
    width: 100%;
}

.courcesPrice {
    width: 100%;
}

.navButton {
    width: 85px;
}

.buttonStyle {
    display: flex;
    margin: 0 auto;
    justify-content: space-evenly;
    margin-top: 30%;
    width: 14rem;
}

.trainingCenterSection1 {
    display: flex;
}

.trainingCenterSec1AllContents {
    display: flex;
    justify-content: center;
    margin-top: 6%;
}

.trainingCenterSec1AllContentsImg {
    width: 35%;
}

.trainingCenterSec1Texts {
    display: flex;
    width: 40%;
    margin-left: 4%;
}

.trainingCenterSec1locationImg {
    margin-top: 12%;
    width: 11%;
}

.trainingCenterSec1locationText {
    margin-top: 12%;
    margin-left: 4%;
}

.trainingCenterSec1SideImg {
    width: 15%;
}

.trainingCenterSec1SideImgContainer {
    position: absolute;
}

.trainingCenterHeading {
    text-align: center;
    margin-top: 6%;
}

.trainingCenterHeadingText {
    font-size: 43px;
    color: #565656;
    font-weight: 600;
}

.trainingCenterSection1Content {
    width: 85%;
    display: flex;
    justify-content: end;
}

.trainingCenterSection2 {
    display: flex;
    margin-top: 6%;
}

.trainingCenterSection2Container {
    position: absolute;
}

.trainingCenterSection2Img {
    width: 41%;
}

.trainingCenterSection2ImgStyle {
    display: flex;
    justify-content: center;
}

.trainingCenterSection2ImgSide {
    width: 38%;
}

.trainingCenterSection2Img {
    width: 79%;
    position: relative;
    display: flex;
    margin-bottom: 3%;
}

.trainingCenterSection2ImgText {
    position: absolute;
    top: 25%;
    left: 4%;
    width: 57%;
}

.trainingCenterSection1ContentSize {
    width: 81%;
}

.trainingCenterSection2ImgText1 {
    font-size: 1.6vw;
    line-height: 1vw;
    color: #565656;
    font-weight: 400;
}

.trainingCenterSection2ImgText2 {
    font-size: 3vw;
    line-height: 2vw;
    font-weight: 600;
    color: #f16529;
}

.trainingCenterSection2ImgText3 {
    font-size: 2vw;
    line-height: 2vw;
    font-weight: 600;
    color: #565656;
}

.priceSideImg {
    width: 16%;
}

#servicesCarousel {
    margin-top: 3%;
}

#backSlideStyle {
    border: 1px solid #535353;
    background-color: #d3d3d3;
    border-radius: 19px;
}

#forwarSlideStyle {
    border: 1px solid #f15523;
    background-color: #d3d3d3;
    border-radius: 19px;
}

.footer {
    background-color: #414345;
    color: #fff;
    padding: 10px;
    position: relative;
    /* top: 80px; */
}

    .footer .background {
        position: absolute;
        bottom: 0px;
        left: 0px;
        opacity: 0.25;
        width: 27%;
    }

.footer-container {
    display: flex;
    justify-content: center;
}

.quickLinksData {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    width: 132%;
}

hr.vertical {
    width: 1px;
    height: 8rem;
    background-color: #565656;
    border: none;
    margin: 60px 0px;
    padding: 0px;
}

/* .footer-section {
    flex: 1;
    margin: 0 10px;
  } */
.support {
    margin-top: 3rem;
    width: 10%;
}

.newsletter {
    margin-top: 3rem;
    width: 31%;
}

.footer-section h3 {
    margin-bottom: 40px;
    font-size: 23px;
    color: #fff;
}

.footer-section ul {
    list-style-type: none;
    padding: 0;
}

    .footer-section ul li {
        margin-bottom: 10px;
    }

        .footer-section ul li a {
            color: #93959b;
            text-decoration: none;
            transition: color 0.3s;
            cursor: pointer;
        }

            .footer-section ul li a:hover {
                color: #fff;
            }

.logo-section {
    margin-top: 3rem;
    width: 5%;
}

.linksStyle {
    font-size: 0.8vw;
}

.quick-links {
    margin-top: 3rem;
    width: 20%;
}

.logo-section .logo {
    max-width: 100px;
}

.newsletter-form {
    display: flex;
    margin-top: 20px;
}

    .newsletter-form input[type="email"] {
        padding: 14px;
        border: none;
        border-radius: 26px 0 0 26px;
        outline: none;
        width: 73%;
        font-size: 0.8vw;
    }

    .newsletter-form button {
        padding: 14px;
        border: none;
        border-radius: 0 26px 26px 0;
        background-color: #f04e23;
        color: white;
        cursor: pointer !important;
        transition: background-color 0.3s;
        font-size: 0.9vw;
        width: 27%;
    }

.contact-info {
    margin-top: 4rem;
}

.newsletter-form button:hover {
    background-color: #d43d1b;
}

.contact-info h3 {
    margin-bottom: 10px;
    font-size: 1.5vw;
    color: #fff;
}

.contact-info p {
    margin: 0;
    color: #bbb;
}

.footer-containerInner {
    display: flex;
    justify-content: space-between;
    width: 80%;
}

.footer-bottom {
    text-align: center;
    margin-top: 6rem;
    margin-bottom: 2rem;
}

    .footer-bottom p {
        margin: 0;
        color: #bbb;
    }

.phoneIcon {
    display: flex;
}

.menu-toggle {
    display: none;
}

    .menu-toggle:checked ~ .nav-links {
        height: 429px;
        justify-content: center;
        align-items: center;
        /* Adjust height based on the number of menu items */
    }

.menu-icon {
    cursor: pointer;
    display: none;
    flex-direction: column;
    justify-content: space-between;
    height: 18px;
    margin-left: auto;
    position: absolute;
    right: 20px;
}

.navbarr .dropdown {
    position: relative;
}

.navbarr .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 0;
    width: 200px;
    z-index: 1000;
    text-align: center;
}

.navbarr .dropdown a:hover {
    color: #d43d1b; /* Change the color on hover */
}

.navbarr .dropdown-menu li {
    padding: 0;
}

    .navbarr .dropdown-menu li a {
        color: #333;
        padding: 10px 15px;
        display: block;
        text-decoration: none;
    }

        .navbarr .dropdown-menu li a:hover {
            background-color: #f8f9fa;
        }

/* Hover to show dropdown */
.navbarr .dropdown:hover .dropdown-menu {
    display: block;
}

#lastSectionJoinButton {
    border: 1px solid #f16529;
    border-radius: 26px;
    padding: 9px 39px 9px 38px;
    background-color: #f16529;
    margin-top: 1%;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    font-size: 0.9vw;
}

.borderLine {
    width: 1px;
    height: 9rem;
    background-color: #c0c0c0;
    margin-top: 5%;
}

.phoneText {
    font-size: 0.8vw;
    margin-left: 2%;
}

/* ----------------------------------abhi new css-------------------------------------------------- */
/* slideModal  */
.slideModal_modal {
    display: none;
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.slideModal_modal_content {
    position: relative !important;
    top: 50%;
    left: 50%;
    height: 450px;
    width: 800px !important;
    max-width: 90% !important;
    transform: translate(-50%, -50%);
    background: white;
    /* padding: 20px; */
    border-radius: 20px !important;
}

#slideModalClose svg {
    cursor: pointer !important;
}

.close {
    /* padding: 10px; */
    position: absolute;
    width: 60px;
    padding: 0.5rem;
    height: 60px;
    background-color: #f15523;
    top: -10px;
    z-index: 1111;
    border-radius: 100%;
    justify-content: center;
    display: flex;
    align-items: center;
    right: -15px;
    cursor: pointer;
}

.swiper {
    width: 100%;
    height: 100%;
}

.card-wrappers_slideModal {
    max-width: 100%;
    margin: 0 20px 35px;
    padding: 30px 10px;
    overflow: hidden;
    height: 100%;
}

.card-list .card-item {
    list-style: none;
}

.card-list {
    padding-left: 0px !important;
}

.card-item {
    width: 800px;
    height: 100%;
}

.card-links {
    cursor: pointer !important;
    position: relative;
    user-select: none;
    display: block;
    /* width: 300px; */
    background: #fff;
    /* padding: 18px; */
    /* border-radius: 50px; */
    text-decoration: none;
    /* border: 2px solid transparent; */
    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.05);
    transition: 0.2s ease;
    height: 100%;
}

.card-list .card-item .card-link:active {
    cursor: grabbing;
}

.card-list .card-item .card-link:hover {
    border-color: #4f4f51;
}

.card-image {
    -webkit-filter: grayscale(100%); /* For older Safari and Chrome */
    filter: grayscale(100%); /* Standard */
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 20px;
}

.card_link_details {
    align-items: center;
    display: flex;
    position: absolute;
    justify-content: space-between;
    width: 100%;
    z-index: 1;
    padding: 0 20px;
    bottom: 20px;
    /* left: 20px; */
}

    .card_link_details .card_logo {
        width: 40px;
    }

    .card_link_details .card_title {
        color: #f15523;
        font-size: 1.2rem;
        font-weight: bold;
    }
.card_titlex {
    color: #f15523;
    font-size: 1.2rem;
    font-weight: bold;
}
.card_link_details .card_dis {
    color: #ffff;
    font-size: 1rem;
}

.card_link_details_btn {
    background-color: #ffffff17;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    justify-content: center;
    /* margin: auto; */
    display: flex;
    align-items: center;
}

    .card_link_details_btn .card_link_details_btn_warper {
        background-color: #f15523;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        justify-content: center;
        /* margin: auto; */
        display: flex;
        align-items: center;
    }

.card-list .card-link:hover .card-button {
    color: #fff;
    background: #565759;
}

.card-wrapper .swiper-pagination-bullet {
    height: 13px;
    width: 13px;
    opacity: 0.5;
    background: #3b3b3d;
}

.card-wrapper .swiper-pagination-bullet-active {
    opacity: 1;
}

.card-wrapper .swiper-slide-button {
    color: #585a61;
    margin-top: -35px;
}

@media screen and (max-width: 768px) {
    .card-wrapper {
        margin: 0 10px 25px;
    }

        .card-wrapper .swiper-slide-button {
            display: none;
        }
}

/* ---------------------techflow-INDIA css starts--------------------------------------------------------- */
.techflowCountryStarts {
    width: 100%;
}

.techflowCountry_mainCon {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.techflowCountry_subCon {
    /* padding: 2rem; */
}

.techflowCountry_contents {
}

.techflowCountry_ImgDiv_img {
    position: relative;
    border-radius: 20px;
    aspect-ratio: 13 / 9;
    width: 100%;
    height: auto;
    mask-image: url('../uploads/pics/rectangle 53.svg');
    -webkit-mask-image: url('../uploads/pics/rectangle 53.svg');
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    overflow: hidden;
}

.techflowCountry_ImgDiv img {
    width: 100%;
    height: 100%;
}

.techflowCountry_ImgDivSub {
    display: flex;
    gap: 12px;
    margin-top: 12px !important;
    padding-left: 20px;
}

    .techflowCountry_ImgDivSub img {
        width: 37px;
        height: 30px;
    }

    .techflowCountry_ImgDivSub p {
        font-size: 15px;
        font-weight: 500;
    }

.techflowCountry_text {
    padding: 1rem;
}

    .techflowCountry_text p {
        font-size: 15px;
        font-weight: 400;
    }

/* ---------------------------------------training center css--------------------------------------------- */
.training_centerStarts {
    width: 100%;
    margin: 3rem 0 6rem 0;
}

.training_centerMainCon {
}

.training_centersubCon {
    width: 95%;
    background-image: url('../uploads/pics/trainingcenterback.png');
    background-size: cover; /* Makes the image cover the entire element */
    background-repeat: no-repeat; /* Prevents the image from repeating */
    background-position: center;
    border-radius: 30px;
    filter: grayscale(100%);
    height: 19rem;
    padding: 1rem;
}

.training_center_contents {
    text-align: start;
    text-align: start;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

    .training_center_contents h4 {
        font-size: 38px;
        font-weight: 600;
        color: #ffffff;
        margin-bottom: 1.3rem;
    }

.training_center_paraDiv {
    width: 44%;
}

    .training_center_paraDiv p {
        font-size: 15px;
        font-weight: 500;
        color: #ffffff;
    }

/* ----------------------------------------------------------location-TrainingCenter---------------------------------------------------- */
.locationTrainingCenter_Starts {
    width: 100%;
    position: relative;
    margin: 6rem 0 7rem 0;
}

.locationTraining_absDiv {
    position: absolute;
    right: 0;
}

    .locationTraining_absDiv img {
        width: 219px;
    }

.locationTrainingCenter_heading {
    text-align: center;
}

    .locationTrainingCenter_heading h3 {
        color: #565656;
        font-size: 45px;
        font-weight: 600;
    }

    .locationTrainingCenter_heading span {
        color: #f16529;
        font-size: 45px;
        font-weight: 600;
    }

.locationTrainingCenter_mainCon {
}

.locationTrainingCenter_subCon {
    width: 70%;
    margin: 0 auto;
}

.locationTrainingCenter_ImgDiv {
    display: flex;
    justify-content: center;
}

    .locationTrainingCenter_ImgDiv img {
        width: 390px;
    }

.locationTrainingCenter_Text {
    padding: 3rem 1rem;
}

.locationTrainingCenter_subDiv {
    display: flex;
    gap: 15px;
}

    .locationTrainingCenter_subDiv img {
        width: 22px;
        height: 27px;
    }

    .locationTrainingCenter_subDiv p {
        font-size: 15px;
        color: #5c5c5c;
        font-weight: 500;
    }

/* <!---------------------------------Our Courses section ends--------------------------> */
.br_c {
    border: 1px solid;
}

.our_courses {
    background: linear-gradient(to bottom left, #f4f4f4, #dddcdc);
    position: relative;
}

.ourCourses_absBackDiv {
    position: absolute;
    right: 0;
    top: 18%;
}

    .ourCourses_absBackDiv img {
        width: 200px;
    }

.ourcourses_topabsBackDiv {
    position: absolute;
    left: 0;
    top: 0;
}

    .ourcourses_topabsBackDiv img {
        width: 450px;
    }

.our_courses_title p {
    font-size: 2.5rem;
    font-weight: bold;
    color: #5c5c5c;
    text-align: center;
    margin-bottom: 3rem !important;
}

.our_courses_title span {
    color: #f15523;
}
/* --------------------------------------------------join us section starts--------------------------------------------------------- */

.techflow_new_services_joinus {
    position: relative;
    margin: 6rem 0 6rem 0;
}

.trainingBottom_absBackDiv {
    position: absolute;
    left: 0;
    top: 4%;
}

    .trainingBottom_absBackDiv img {
        width: 124px;
    }

.techflow_new_services_joinUs_div {
    position: relative;
    border-radius: 45px;
    height: 220px;
    background: linear-gradient( to bottom right, #dddddd 40%, #e5e5e5 100%, transparent 50% );
    /* overflow: hidden; */
    align-items: center;
    display: flex;
    z-index: 1;
}

.all_btn {
    padding: 6px 25px;
    border-radius: 22px;
    background: #f04e23;
    color: white;
    border: 1px solid #f04e23;
    cursor: pointer;
}


.techflow_new_services_joinUs_div_bottom_ab {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}

    .techflow_new_services_joinUs_div_bottom_ab img {
        width: 200px;
        border-bottom-left-radius: 45px;
    }

.techflow_new_services_joinUs_right_top_ab {
    position: absolute;
    top: 0;
    right: 280px;
    z-index: -1;
}

    .techflow_new_services_joinUs_right_top_ab img {
        width: 300px;
    }

.techflow_new_services_joinUs_right_big {
    width: 380px;
    position: absolute;
    right: 0px;
    height: 100%;
    top: -10%;
}

.techflow_new_services_joinUs_right {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    border-radius: 20px;
    aspect-ratio: 13 / 9;
    width: 100%;
    height: auto;
    mask-image: url('../uploads/pics/mask.svg');
    -webkit-mask-image: url('../uploads/pics/mask.svg');
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    overflow: hidden;
    transform: scaleX(-1);
}

    .techflow_new_services_joinUs_right img {
        width: 100%;
        height: 100%;
        transform: scaleX(-1);
    }

.techflow_new_services_joinUs_details {
    width: 95%;
    margin: auto;
}

.techflow_new_services_joinUs_div_title {
    font-size: 1.2rem;
    color: #565656;
    font-weight: 300;
    margin: 0 !important;
}

.techflow_new_services_joinUs_div_title_p {
    line-height: 1;
    font-size: 1.6rem;
    font-weight: bold;
    color: #565656;
    margin: 0 !important;
}

    .techflow_new_services_joinUs_div_title_p span {
        color: #f16529;
        font-size: 2rem;
        font-weight: bold;
        display: block;
    }

@media (max-width: 668px) {
    .techflow_new_services_joinUs_right_big {
        display: none;
    }

    .techflow_new_services_joinUs_right_top_ab {
        right: 0;
        opacity: 0.6;
    }

    .techflow_new_services_joinUs_div_bottom_ab {
        opacity: 0.6;
    }

    .techflow_new_servicesBox .techflow_new_servicesBox_Card {
        margin-top: 2rem !important;
    }

    .techflow_new_servicesBox_side {
        top: 200px;
    }

    .techflow_new_topSection_servicesTopborder_right {
        border-right: none;
    }

    .techflow_new_topSection_servicesTopborder_left {
        padding-left: 10px !important;
    }

    .techflow_new_services_joinUs_div_title {
        font-size: 1rem;
    }

    .techflow_new_services_joinUs_div_title_p {
        /* line-height: 1; */
        font-size: 1.2rem;
    }

        .techflow_new_services_joinUs_div_title_p span {
            font-size: 1.6rem;
        }

    .training_center_paraDiv {
        width: 100%;
    }
}


/* <!----------------------------------------------------------------------- slider css  ---------------------------------------------- --> */

.swiper {
    width: 100%;
    /* height: 350px; */
}

.card-wrapper {
    max-width: 100%;
    margin: 0 60px 35px;
    padding: 0px 10px 40px 10px;
    overflow: hidden;
    height: 100%;
}

.card-list .card-item {
    list-style: none;
}

.card-list {
    padding-left: 0px !important;
}

.card-item {
    position: relative;
    height: 100%;
    /* width: 300px !important; */
    /* height: 360px !important; */
}

.card-link {
    background-color: #fff;
    /* width: 250px; */
    height: 350px;
    cursor: pointer !important;
    position: relative;
    user-select: none;
    display: block;
    text-decoration: none;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
    transition: 0.2s ease;
    overflow: hidden;
}

.card_title {
    background-color: #414345;
    text-align: center;
    padding: 0.6rem 0 0.2rem 0;
}

    .card_title span {
        font-size: 1rem;
        color: #fff;
        text-transform: capitalize;
    }

    .card_title p {
        line-height: 1;
        color: #fff;
        font-size: 1.6rem;
        text-transform: capitalize;
    }

.card_price {
    justify-content: center;
    /* height: 150px; */
    padding: 1.5rem 0;
    display: flex;
    align-items: center;
}

.card_price {
    font-size: 4rem;
    font-size: bold;
    color: #f16529;
}

.card_btn {
    margin-top: 2rem;
    width: 90%;
    display: flex;
    justify-content: center;
    margin: auto;
    flex-direction: column;
}

.card_btn_s {
    cursor: pointer;
    border: 1px solid #b7bac1;
    padding: 0.3rem 0;
    text-align: center;
    border-radius: 6px;
    width: 100%;
    margin-bottom: 0.6rem;
}

    .card_btn_s span {
        color: #6c7176;
        text-align: center;
    }

.card_btn .main {
    border: none;
    background: linear-gradient(to right, #e44d26, #f16529);
}

    .card_btn .main span {
        color: #fff;
    }

.card-list .card-item .card-link:active {
    cursor: grabbing;
}

.card-wrapper .swiper-pagination-bullet {
    height: 13px;
    width: 13px;
    opacity: 0.5;
    background: #434445;
}

.card-wrapper .swiper-pagination-bullet-active {
    opacity: 1;
}

.card-wrapper .swiper-slide-button {
    color: #f47c3b;
    margin-top: -35px;
}

@media screen and (max-width: 768px) {
    .swiper {
        width: 80% !important;
        border: 1px solid rd;
    }

    .card-wrapper {
        margin: 0 10px 25px;
    }

        .card-wrapper .swiper-slide-button {
            display: none;
        }

    .swiper {
        width: 100%;
        height: 100%;
    }

    .our_office {
        height: 30vh;
        position: relative;
    }
}

/*.swiper-pagination-bullet {
    background: #3b3c40 !important;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 1.5rem !important;
    color: #f16529 !important;
    font-weight: bold;
}*/


.swiper-pagination-bullet {
    background: #3b3c40 !important;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 1.5rem !important;
    color: #faac8b !important;
    font-weight: bold;
}

.swiper-button-next:hover:after,
.swiper-button-prev:hover:after {
    color: #f16529 !important;
}

/* <!---------------------------------Our Courses section ends--------------------------> */

@media (min-width: 350px) and (max-width: 575.98px) {


    .crousalContainer {
        flex-direction: column;
        margin-top: 2rem;
    }

    .textContainer {
        margin-top: 19%;
        text-align: center;
        width: unset;
    }

    #group {
        display: none;
    }

    .firstLine {
        font-size: 18px;
        line-height: 1px;
    }

    .overlay-text {
        position: absolute;
        top: 10%;
        color: white;
    }

    .innerImg1 {
        position: absolute;
        top: 107px;
        width: 212px;
        height: 242px;
    }

    .mobile_devcies {
        /* width: 300px; */
    }

        .mobile_devcies img {
            /* width: 100%; */
        }

    .column_1 {
        justify-content: center;
        align-items: center;
        display: flex;
        width: unset;
    }

    .column_2 {
        width: unset;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .overlay-text3 {
        position: absolute;
        top: 67%;
        /* left: 328px; */
        /* transform: translate(-50%, -50%); */
        color: gray;
        width: 70%;
        font-size: 14px;
    }

    .hpStyle {
        width: 1rem;
        height: 0.7rem;
    }

    .overlay-text2 {
        position: absolute;
        top: 9%;
        /* right: 228px; */
        /* transform: translate(-50%, -50%); */
        color: white;
    }

    .overlay-text4 {
        position: absolute;
        top: 68%;
        /* right: 148px; */
        /* transform: translate(-50%, -50%); */
        color: gray;
        width: 76%;
        text-align: center;
    }

    .secondLine {
        font-size: 35px;
        line-height: 26px;
    }

    .thirdLine {
        font-size: 35px;
        line-height: 60px;
    }

    .forthLine {
        /* width: 295px; */
        width: unset;
    }

    .readMore {
        margin: 25px 104px;
    }

    .serviceCroselImgText {
        /* margin-left: 0px; */
    }

    .readMoreAboutUs {
        margin: 25px auto;
    }

    .CrousalImageSection {
        margin-top: 22px;
        width: unset;
    }

    .appMissionImages {
        display: block;
    }

    .column {
        width: auto;
    }

    .innerImg2 {
        position: absolute;
        top: 96px;
        width: 214px;
        height: 251px;
    }

    #backImage {
        width: 369px;
        height: 288px;
    }

    .upperImage img {
        width: 20rem;
        height: 19rem;
    }

    .Group45 {
        padding: 62px;
        margin-right: 39px;
        width: 326px;
        height: 326px;
    }

    .rightImageCrowsel {
        max-width: 98px;
        max-height: 174px;
        margin-top: 33px;
    }

    .counter-container {
        width: 12rem;
        height: 3rem;
        top: 130px !important;
        left: 1rem;
    }

    .count {
        font-size: 18px;
    }

    .counterSecondLine {
        font-size: 8px;
        line-height: 0;
        margin-top: 0px;
    }

    /* .clients-container {
      max-width: 24rem;
      margin: 217px auto;
      margin-bottom: 50px;
    } */

    .clients-container .title {
        padding: 9px 17px;
        font-size: 10px;
    }

    .clients-container img {
        height: 8px;
    }

    .secondContainer {
        flex-direction: column;
        margin-top: 0;
    }

    .manTechFlowImgContainer {
        width: unset;
        display: flex;
        justify-content: flex-end;
        margin-top: 0%;
    }

    .manTechFlowImg {
        width: unset;
    }

    .techFlowText {
        margin-top: 0px;
        width: unset;
        display: flex;
    }

    .techFlowTextSecondForth {
        width: unset;
    }

    .broupBoyImg {
        bottom: -13px;
        width: unset;
        right: 0%;
        z-index: 1;
        display: flex;
        top: -8%;
    }

    .group66 {
        width: 398px;
        height: 280px;
        margin-top: 38px;
    }

    .missionContainer {
        margin-top: 0;
    }

    .servicesSideImg {
        display: none;
    }

    .techFlowText {
        text-align: center;
    }

    .aboutUsImg {
        display: none;
        /* width: 180px;
      height: 295px;
      margin-bottom: 10rem; */
    }

    .leftMobImg {
        /* width: 19rem; */
    }

    .laptopSection {
        margin-top: 34px;
        width: unset;
    }

    .rightMobImg {
        /* width: 19rem;
      margin-left: 57px; */
    }

    .missionTitle {
        font-size: 19px;
    }

    .laptop {
        width: 23rem;
    }

    .bottomImage {
        max-width: 21rem;
        height: 5rem;
    }

    .trainingBgpic {
        width: 25rem;
        height: 17rem;
    }

    .readMoreRepairing {
        margin: 31px 107px;
        background-color: #f04e23;
        border-radius: 50px;
        padding: 12px;
        text-align: center;
        color: #ffffff;
        /* margin-top: 80px; */
        transition: transform 0.3s ease-in-out;
    }

    .trainingBg {
        margin-top: 32rem;
    }

    .trainingContent {
        flex-direction: column;
        margin-top: 13rem;
        left: 12px;
    }

    .learnSecImag {
        width: 358px;
    }

    .trainingTextSec {
        text-align: center;
    }

    .trainingTextFirst {
        font-size: 22px;
    }

    .trainingTextSecond {
        font-size: 22px;
    }

    .trainingTextThird {
        font-size: 22px;
    }

    .trainingTextForth {
        font-size: 22px;
    }

    .trainingSection {
        margin-top: 0%;
    }

    .locationTextFirst {
        font-size: 18px;
    }

    .locationtextSec {
        font-size: 18px;
    }

    .locationSpan {
        font-size: 18px;
    }

    .locationSecRight {
        display: none;
    }

    .locationSecRight_Location {
        display: none;
    }

    .globeImg {
        width: 25rem;
    }

    .locationDotsPic {
        width: 238px;
        height: 4rem;
    }

    .locationDots {
        bottom: 28px;
        left: 71px;
    }

    .fifthSection {
        flex-direction: column;
        margin: 0 auto;
    }

    .emailStyle {
        font-size: 13px;
    }

    .submitStyle {
        font-size: 13px;
    }

    .repairThirdText {
        font-size: 44px;
        font-weight: 700;
        color: #f15523;
        line-height: 50px;
    }

    .thirdSecImag {
        margin: 10px 3px;
        width: 320px;
    }

    .courcesPrice {
        margin: 10px 3px;
        width: 320px;
    }

    .award {
        width: 28rem;
        height: 20rem;
    }

    .awardInner {
        width: 12rem;
        position: absolute;
        left: 104px;
        margin-top: 65px;
    }

    .awardTextSec {
        margin-top: 71px;
    }

    #lastSectionImg {
        display: none;
    }

    #lastSectionImgMobile {
        width: 100%;
        display: inline;
    }

    .lastSectionInner {
        width: 90%;
        position: relative;
        display: flex;
        justify-content: center;
    }

    .lastSectionImgText {
        position: absolute;
        top: 14%;
        left: 21%;
    }

    .lastSectionImgText1 {
        font-size: 13px;
        line-height: 10px;
        color: #565656;
    }

    .lastSectionImgText2 {
        font-size: 13px;
        font-weight: 600;
        line-height: 1px;
        color: #f16529;
    }

    .lastSectionImgText3 {
        line-height: 7px;
        font-size: 10px;
        color: #565656;
        font-weight: 600;
    }

    #lastSectionJoinButton {
        border: 1px solid #f16529;
        border-radius: 26px;
        padding: 3px 14px 3px 16px;
        background-color: #f16529;
        margin-top: 0%;
        color: #fff;
        font-size: 10px;
        margin-left: 34%;
    }

    /* .awardImageSec {
      margin-left: 36px;
    } */
    .socialSec {
        /* display: none; */
    }

    .socialSec {
        position: fixed;
        z-index: 1000;
    }

    .awardSideImg {
        height: 30rem;
    }

    .logo-section {
        margin-right: 1.4rem;
        width: unset;
    }

    .footer-containerInner {
        width: unset;
    }

    .quick-links {
        margin-right: 1rem;
        width: 20%;
    }

    .linksStyle {
        font-size: 2.8vw;
    }

    .support {
        margin-right: 1rem;
    }

    .quickLinksData {
        justify-content: space-between;
        margin-top: 20px;
        width: 132%;
        display: contents;
    }

    .footer-section h3 {
        font-size: 13px;
    }

    .awardTextSec {
        border-radius: 15px;
        background-color: #f15523;
    }

    .awardtext {
        left: 2rem;
        top: 2rem;
    }

    .vertical {
        display: none;
    }

    .Rectangle44 {
        max-width: 554px;
        height: 324px;
    }

    .mainContainer {
        /* padding: 0px; */
    }

    .awardTextFifth {
        max-width: 362px;
    }

    .nav-links {
        position: absolute;
        top: 77px;
        right: 0;
        width: 100%;
        height: 0;
        overflow: hidden;
        flex-direction: column;
        background-color: #333;
        transition: height 0.3s ease;
    }

    .newsletter-form button {
        padding: 2px 19px 2px 17px;
        font-size: 3vw;
        width: 42%;
    }

    .newsletter-form {
        position: absolute;
        top: 45%;
        right: 4%;
    }

    .footer .background {
        width: 21rem;
    }

    .nav-links li {
        margin: 0;
        padding: 15px 0;
        text-align: center;
    }

    .newsletter-form input[type="email"] {
        width: 6rem;
        font-size: 2.6vw;
        /* padding: 6px 1px 7px 18px; */
    }

    .newsletter {
        width: 102px;
    }

    .contact-info {
        width: 108px;
        margin-top: 2rem;
    }

    .phoneIcon {
        display: flex;
        width: 28vw;
    }

    .menu-icon {
        display: flex;
        margin-top: 29px;
    }

    .clients-container {
        margin: 75px 6px 43px 3px;
    }

    .topSection1 {
        display: none;
    }

    .topSection2 {
        width: unset;
    }

    .bannerText {
        font-size: 24px;
    }

    .topSection2Heading1 {
        font-size: 16px;
    }

    .topSection2Heading2 {
        font-size: 21px;
    }

    .topSection2Content {
        flex-direction: column;
    }

    .topSection2ContentImg {
        width: unset;
        padding: 5%;
    }

    .topSection2ContentTextSection {
        width: unset;
        padding: 5%;
    }

    .trainingCenterSection1 {
        margin-top: 102rem;
    }

    .trainingStyleImg {
        width: 93%;
        position: relative;
        display: flex;
        margin-bottom: 6%;
        height: 6rem;
    }

    .trainingStyleImgContent {
        top: 21%;
    }

    .trainingStyleImgContent1 {
        font-size: 15px;
        color: #fff;
        font-weight: 600;
        line-height: 0px;
    }

    .trainingStyleImgContent2 {
        font-size: 11px;
        width: 87%;
        color: #fff;
    }

    .trainingCenterHeadingText {
        font-size: 22px;
    }

    .trainingCenterSec1AllContents {
        flex-direction: column;
    }

    .trainingCenterSec1SideImg {
        display: none;
    }

    .trainingCenterSec1AllContentsImg {
        width: 100%;
    }

    .trainingCenterSec1Texts {
        display: flex;
        width: 90%;
        margin-left: 4%;
    }

    .trainingCenterSec1locationImg {
        margin-top: 12%;
        width: 28%;
    }

    .trainingCenterSec1locationText {
        margin-top: 12%;
        margin-left: 4%;
    }

    .trainingCenterSection1Content {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .trainingCenterSection2ImgText {
        top: 25%;
        left: 4%;
    }

    .trainingCenterSection2ImgText1 {
        font-size: 10px;
        line-height: 5px;
        color: #505050;
    }

    .trainingCenterSection2ImgText2 {
        font-size: 3vw;
        line-height: 0px;
        font-weight: 600;
        color: #f15523;
    }

    .trainingCenterSection2ImgText3 {
        font-size: 8px;
        line-height: 4px;
        font-weight: 600;
    }

    .trainingCenterSection2ImgStyle {
        margin-top: 4%;
    }

    .topSectionSideImg {
        width: unset;
    }

    .topSectionSideImgStyle {
        display: none;
    }

    .topSectionContent {
        display: unset;
        justify-content: unset;
    }

    /* .topSectionContent1 {
    width: unset;
  } */
    .topSectionContent1Text {
        font-size: 5.5vw;
        font-weight: 600;
        padding-top: 15%;
        color: #f15523;
        text-align: center;
        line-height: 9.1vw;
    }

    .phoneText {
        font-size: 2.4vw;
        margin-left: 2%;
    }

    .borderLine {
        display: none;
    }

    .topSectionContent3 {
        width: unset;
        padding-top: 8%;
        display: flex;
        justify-content: center;
    }

    .topSectionContent3Text {
        width: 78%;
        font-size: 3.9vw;
        color: #5c5c5c;
        text-align: center;
    }

    .topSection2ContentText {
        font-size: 4.8vw;
    }

    .coursesCrousalSecInnerText1 {
        font-size: 7.4vw;
    }

    .coursesCrousalSecInnerText2 {
        font-size: 11.5vw;
    }

    .coursesCrousalSecInner2 {
        font-size: 20.4vw;
    }

    #coursesCrousalSecInnerButton1 {
        font-size: 4vw;
    }

    #coursesCrousalSecInnerButton12 {
        font-size: 4vw;
    }

    .trainingCenterSection2Img {
        margin-top: 0%;
        margin-bottom: 8rem;
        width: 95%;
        height: 71%;
    }

    #lastSectionJoinButton {
        border: 1px solid #f16529;
        border-radius: 26px;
        padding: 3px 14px 3px 16px;
        background-color: #f16529;
        margin-top: 0%;
        color: #fff;
        font-size: 10px;
        margin-left: 34%;
    }

    .teamText {
        font-size: 8vw;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    body {
        font-size: 16px;
    }

    .menu-icon {
        display: flex;
        margin-top: 0px;
    }

    .nav-links {
        position: absolute;
        top: 77px;
        right: 0;
        width: 100%;
        height: 0;
        overflow: hidden;
        flex-direction: column;
        background-color: #333;
        transition: height 0.3s ease;
    }

    .counter-container {
        left: 0rem;
        top: 120;
    }

    .count {
        font-size: 35px;
    }

    .nav-links {
        /* display: flex; */
        padding: 0;
        /* margin: 0; */
        /* margin-left: 75px; */
    }

        .nav-links a {
            font-size: 15px;
            color: #fff;
        }

    .logo {
        width: 80%;
    }

    .nav-links li {
        padding: 13px 0.6rem;
    }

    .crousalContainer {
        /* flex-direction: column; */
        height: 100%;
    }

    #group {
        width: 100%;
    }

    .textContainer {
        margin-left: 3%;
        margin-top: 5%;
    }

    .firstLine {
        font-size: 25px;
    }

    .secondLine {
        font-size: 50px;
        line-height: 49px;
    }

    .thirdLine {
        font-size: 45px;
        line-height: 63px;
    }

    .clients-container {
        margin: 65px 7px 37px 1px;
    }

        .clients-container img {
            height: 17px;
        }

    .secondContainer {
        /* flex-direction: column; */
    }

    .appMissionImages {
        display: block;
    }

    .column_1 {
        width: unset;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .column_2 {
        width: unset;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .thirdSecImag {
        width: 225px;
    }

    .courcesPrice {
    }

    .crouselImgsmalltext {
        font-size: 24px;
    }

    .crouselImgbigtext {
        font-size: 23px;
    }

    .serviceCroselImgText {
        margin-left: 0px;
    }

    .trainingSection {
        margin-top: 26%;
    }

    .trainingBgpic {
        width: 79rem;
        height: 29rem;
    }

    .trainingContent {
        position: absolute;
        display: flex;
        bottom: 44px;
        /* left: 101px; */
        justify-content: space-between;
        left: 10px;
    }

    .manImg {
        width: 45%;
        margin-top: 134px;
    }

    .learnSecImag {
        width: 419px;
        height: 358px;
    }

    .trainingTextSec {
        width: 45%;
    }

    .trainingTextThird {
        font-size: 31px;
    }

    .locationSecRight_Location {
        display: none;
    }

    .locationTextFirst {
        font-size: 28px;
    }

    .locationtextSec {
        font-size: 32px;
    }

    .locationSpan {
        font-size: 33px;
    }

    .locationDots {
        position: absolute;
        bottom: 71px;
        left: 0px;
        right: 0px;
    }

    .locationDotsPic {
        width: 572px;
        height: 10rem;
    }

    .lastSectionImgText {
        position: absolute;
        top: 15%;
        left: 5%;
    }

    .lastSectionImgText1 {
        font-size: 16px;
        line-height: 16px;
        color: #565656;
    }

    .lastSectionImgText2 {
        font-size: 16px;
        font-weight: 600;
        line-height: 16px;
        color: #f16529;
    }

    .fifthSection {
        flex-direction: column;
    }

    .awardtext {
        bottom: 2rem;
        left: 14rem;
    }

    .awardTextSec {
        margin-top: 40px;
    }

    .techFlowTextSecond {
        font-size: 28px;
    }

    .techFlowTextSecondSpan {
        font-size: 32px;
    }

    .techFlowTextSecondThird {
        font-size: 33px;
    }

    .aboutUsImg {
        width: 228px;
        height: 249px;
    }

    .laptopSection {
        width: unset;
    }

    .lastSectionImgText3 {
        line-height: 11px;
        font-size: 14px;
        color: #565656;
        font-weight: 600;
    }

    #lastSectionJoinButton {
        border: 1px solid #f16529;
        border-radius: 26px;
        padding: 5px 25px 4px 27px;
        background-color: #f16529;
        margin-top: 1%;
        color: #fff;
        font-size: 10px;
    }

    .topSection2Heading1 {
        font-size: 35px;
    }

    .topSection2Heading2 {
        font-size: 34px;
    }

    .trainingStyleImgContent1 {
        font-size: 31px;
        line-height: 38px;
    }

    .trainingStyleImgContent {
        top: 23%;
        left: 5%;
    }

    .topSection2ContentImgStyleBottomText {
        margin-left: 5%;
    }

    .topSection {
        margin-top: 9%;
    }

    .coursesCrousalSecInnerText1 {
        font-size: 12px;
        font-weight: 500;
        color: #fff;
        line-height: 13px;
    }

    .coursesCrousalSecInnerText2 {
        font-size: 17px;
        line-height: 0px;
    }

    .coursesCrousalSecInner2 {
        font-size: 40px;
    }

    #coursesCrousalSecInnerButton1 {
        height: 29px;
    }

    #coursesCrousalSecInnerButton12 {
        width: 80%;
        height: 29px;
        background-color: #f15523;
        border: 1px solid #f15523;
        border-radius: 4px;
        margin-top: 4%;
    }

    .trainingCenterSection2ImgText {
        top: 18%;
    }

    .trainingCenterSection2ImgText1 {
        font-size: 2vw;
        line-height: 1vw;
    }

    .trainingCenterSection2ImgText2 {
        font-size: 2vw;
        line-height: 1vw;
    }

    .trainingCenterSection2ImgText3 {
        font-size: 2vw;
        line-height: 1vw;
    }

    .bannerText {
        font-size: 56px;
    }

    #lastSectionJoinButton {
        border: 1px solid #f16529;
        border-radius: 26px;
        /* padding: 5px 25px 4px 27px; */
        background-color: #f16529;
        margin-top: 1%;
        color: #fff;
        font-size: 1.6vw;
        width: 35%;
    }

    .quick-links {
        width: 24%;
    }

    .linksStyle {
        font-size: 1.4vw;
    }

    .phoneText {
        font-size: 1.4vw;
    }

    .newsletter-form input[type="email"] {
        font-size: 1.4vw;
    }

    .newsletter-form button {
        font-size: 1.4vw;
        width: 36%;
    }

    .topSectionContent3Text {
        font-size: 1.6vw;
    }

    .topSection2ContentText {
        font-size: 1.6vw;
    }

    .trainingStyleImgContent2 {
        font-size: 1.4vw;
    }
}

/* <!-- ********************************** ********************************** view Details modal  ******************************************************************** --> */

.view_details_modal {
    display: none;
    position: fixed;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    overflow: hidden;
    overflow: scroll;
}

.view_details_modal_content {
    position: relative !important;
    top: 50%;
    left: 50%;
    height: 450px;
    padding: 1.3rem;
    width: 650px !important;
    max-width: 90% !important;
    transform: translate(-50%, -40%);
    background: white;
    border-radius: 20px !important;
}


/*  */
.view_details_modal_details_img {
    height: 100%;
    height: 300px;
}

    .view_details_modal_details_img img {
        width: 100%;
        height: 100%;
        border-radius: 20px !important;
    }

.view_details_modal_view {
  overflow: hidden;
  overflow-y: scroll;
  height: 100%;
}


.view_details_modal_details_title {
    font-size: 1.8rem;
    color: #565656;
    font-weight: 500;
}

    .view_details_modal_details_title h3 {
    }

    .view_details_modal_details_title span {
        color: #f15523;
    }

.view_details_modal_subTitle {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1;
    color: #565656;
}

    .view_details_modal_subTitle span {
        font-weight: bold;
    }

.view_details_modal_subTitle_details {
    color: #565656;
    font-size: 0.8rem;
    margin: 0;
}

.course_duration h4 {
    color: #565656;
    font-size: 1.8rem;
    font-weight: 500;
}

.course_duration p {
    color: #565656;
    font-size: 0.8rem;
    margin: 0;
}

.course_details {
    color: #565656;
    font-size: 1.8rem;
    font-weight: 500;
}

    .course_details p {
        color: #565656;
        font-size: 0.8rem;
        margin: 0;
    }

.knowledge {
    align-items: center;
}

    .knowledge ul {
        margin: 0;
        padding: 0;
    }

        .knowledge ul li {
            display: flex;
            align-self: center;
            margin: 0 0 0.6rem 0;
            padding: 0;
        }

            .knowledge ul li div {
                width: 20px;
                height: 20px;
                border-radius: 50%;
                margin-right: 0.6rem;
                background-color: #f15523;
            }

            .knowledge ul li p {
                font-size: 0.9rem;
            }

    .knowledge img {
        /* width: 200px; */
        width: 80%;
        height: 70%;
    }

.highlights_title {
    color: #565656;
    font-size: 1.8rem;
    font-weight: 500;
}

.highlights ul {
    margin: 0;
    padding: 0;
}

    .highlights ul li {
        display: flex;
        align-self: center;
        margin: 0 0 0.6rem 0;
        padding: 0;
    }

        .highlights ul li div {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            margin-right: 0.6rem;
            background-color: #f15523;
        }


@media (max-width:600px) {
    .social_section {
        width: 35px;
    }

    .social_images img {
        width: 20px;
        height: 20px;
    }

    .social_images {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 8px;
    }
}