*{
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
}
@font-face {
    font-family: Industry test;
    src: url('../fonts/IndustryTest-Black.otf');
}
@font-face {
    font-family: "SF Pro Display";
    src: url('../fonts/sf-pro-display/SF-Pro-Display-Regular.ttf');
}
@font-face {
    font-family: "SF Pro Display -light";
    src: url('../fonts/sf-pro-display/SF-Pro-Display-Light.ttf');
}
@font-face {
    font-family: "SF Pro Display -medium";
    src: url('../fonts/sf-pro-display/SF-Pro-Display-Medium.ttf');
}
@font-face {
    font-family: "SF Pro Display-thin";
    src: url('../fonts/sf-pro-display/SF-Pro-Display-Thin.ttf');
}
@font-face {
    font-family: Lato;
    src: url('../fonts/Lato/Lato-Regular.ttf');
}


@font-face {
    font-family: Lato-bold;
    src: url('../fonts/Lato/Lato-Bold.ttf');
}
@font-face {
    font-family: Lato-light;
    src: url('../fonts/Lato/Lato-Light.ttf');
}

             /* Banner Section */
      .banner-subtext{
        /* background-color: #2b3d2d;
        color: #c39f75;
        border-left: 3px solid #c39f75; */
        /* padding: 0px 20px; */
        /* width: max-content; */
        position: absolute;
        top: auto;
        right: 0%;
        bottom: 20%;
        width: 40%;
       
        display: none;
       padding-right: 4%;
       z-index: 1;
        
      }
       .item.slick-active .banner-subtext{
        display: block;
        opacity: 1;
             /* right: 10%; */
             transition: right 2s ease;
       }
       .banner-subtext h1{
        color: #FFF;

        font-family: Opensans-medium;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 31px; /* 155% */
    letter-spacing: 0.4px;
    font-family: Opensans-bold;
       }
      .slider-track {
        transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
      }
      
      
      .item {
        height: 100%;
        position: relative;
        z-index: 1;
      }
        
       .item img {
          width: 100%;
          transition: all 1s cubic-bezier(0.7, 0, 0.3, 1);
          transform: scale(1.2);
        }
        
        .item.slick-active img {
          transform: scale(1);
        }
        .slider .slick-dots{
          list-style-type: none;
          position: absolute;
          z-index: 2;
        left: 7%;
          /* top: 36%; */
          bottom: 5%;
        
          display: flex;
          }
          .slider .slick-dots button{
            display: none;
          }
        .slider .slick-dots li{
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: #BBBBBB;
            color: transparent;
            outline: none;
            border: none;
            margin: 8px;
            cursor: pointer;
        }

        .slider .slick-dots li.slick-active {
          background-color: #fff;
          box-shadow: 0px 0px 9px 4px #ffffff9c;
        }
         @media (max-width:768px){
          .slider .slick-dots {
                 display: flex;
                 /* bottom: 20px;
                 top: auto;
                 left: 50%;
                 transform: translateX(-50%); */
                 margin: 0;
                 padding: 0;
                 width: max-content;
          }
         }
         @media (min-width:1400px){
            .slider .slick-dots{
                max-width: 1320px;
                width: 1320px;
                left: 50%;
                transform: translateX(-50%);
                bottom: 6%;
            }
         }

.banner-section img{
    max-height: 676px;
    width: 100%;
}
.banner-section{
    position: relative;
    background-color: #000;
}
.banner-content{
    color: #fff;
   position: absolute;
   bottom: 20%;
   left: 7%;
}
.banner-content h3{
    color: #FFF;

text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-webkit-text-stroke-width: 0.5;
-webkit-text-stroke-color: #FFF;
font-family: "Industry test";
font-size: 31px;
font-style: normal;
font-weight: 700;
line-height: 30px; /* 46.5px */
letter-spacing: 0.93px;
text-transform: uppercase;
}
.banner-section .swiper-pagination{
 left: 7% !important;
 text-align: start;
 margin-bottom: 3%; 
}
.banner-section .swiper-pagination-bullet{
    background-color: #fff !important;
    width: 12px !important;
    height: 12px !important;
   
}
.banner-section 
.banner-content p{
    color: #FFF;

text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-webkit-text-stroke-width: 0.5;
-webkit-text-stroke-color: #FFF;
font-family: "SF Pro Display -light";
font-size: 24px;
font-style: normal;
font-weight: 300;
line-height: 28px; /* 36px */
letter-spacing: 0.72px;
}
.banner-content .border-left{
   position: relative;
}
.banner-content .border-left::after{
    content: '';
    width: 1.5px;
    height: 82%;
    background-color: #fff;
    position: absolute;
    left: -9px;
    top: 6px;
}
.mission-section{
    background: linear-gradient(270deg, #001220 0%, #315190 100%);
}
.mission-box{
    background: linear-gradient(180deg, #315090 -9.36%, #16A5AE 116.21%);
}
.mission-box .count{
    color: #FFF;

    /* font-family: Arial, Helvetica, sans-serif; */
    font-family: Lato-bold;
    font-size: 27.742px;
    font-style: normal;
    font-weight: 400;
    line-height: 28px; /* 49.935px */
    letter-spacing: 0.832px;
    margin: 0px;
    -webkit-text-stroke-width: 0.9px;
    margin-bottom: 4px;
}
.mission-box .count-title{
    color: #FFF;

/* font-family: Arial, Helvetica, sans-serif; */
font-family: Lato;
font-size: 16.645px;
font-style: normal;
font-weight: 400;
line-height: 180%; /* 29.961px */
letter-spacing: 0.499px;
margin: 0px;
}
.mission-box h1.title{
    color: #FFF;

    font-family: Industry test;
font-size: 32.742px;
font-style: normal;
font-weight: 700;
line-height: 34px; /* 58.935px */
letter-spacing: 0.982px;
}
.mission-left h4{
    color: #FFF;

    font-family: Lato;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.72px;
    margin-bottom: 27px;
    /* font-family: Lato-bold; */
    -webkit-text-stroke-width: 0.1px;
}
.mission-left p{
    color: #FFF;
    color: #ffffffed;
    font-family: "SF Pro Display -light";
    font-size: 16px;
    font-style: normal;
    /* font-weight: 400; */
    line-height: 162%; /* 25.92px */
    letter-spacing: 0.48px;
}
.mission-left{
    padding-top: 41px;
}
.mission-box .amb{
    color: #FFF;

font-family: "Industry Inc";
font-size: 37.742px;
font-style: normal;
font-weight: 700;
line-height: 180%; /* 67.935px */
letter-spacing: 1.132px
}
.mission-box{
    /* padding: 18px 48px 44px ; */
    padding: 18px 48px 54px ;
    position: relative;
    top: -33px;
    z-index: 1;
    max-width: 483px;
    margin-left: auto;
    
}


.service-section{
    position: relative;
}
.service-section .service-dots{
    position: absolute;
    right: 0px;
    top: 20px;
    max-height: 40%;
    overflow: hidden;
}
.service-top .title-section h2{
    color: #102A60;
/* font-family: "SF Pro Display"; */
font-family: Lato;
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.84px;
text-transform: uppercase;
position: relative;
}
.service-top .title-section h2 p{
    color: #102A60;
    /* font-family: "SF Pro Display"; */
    font-family: Lato;
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.51px;
    text-transform: capitalize;
}
.service-top .title-section h2 span.line{
    position: absolute;
   width: 100%;
   height: 0.8px;
   background-color: #000;
   display: inline-block;
   bottom: 17px;
   left: 0px;
   z-index: -1;
}
.service-top .title-section h2 span.line::after{
    content: '';
    position: absolute; 
    width: 5px;
    height: 5px;
    background-color: #000;
    border-radius: 50%;
    right: 0px;
    top: -2.5px;

}
.title-section span.text{
    background-color: #fff;
}
.service-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-left: 8px;
}
.service-list li,.service-list-mobile p{
    color: #102A60;

    font-family: Lato;
    font-size: 19px;
    font-style: normal;
    font-weight: 700;
    line-height: 105%; /* 19.95px */
    letter-spacing: -0.19px;
    text-transform: uppercase;
        font-family: Lato;
}
.service-list-mobile p span{
    display: inline-block;
    min-width: 5px;
    min-height: 5px;
    border-radius: 50%;
    background-color:#102A60;
    margin-right: 7px;
}
.service-list-mobile{
    margin: 0 auto;
}
.service-list-mobile p{
   display: flex;
   align-items: center;
}
.service-list-btm-para p{
    color: #000;

font-family: Lato;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 153%; /* 21.42px */
letter-spacing: 0.14px;
}
.explore-more{
    color: #fff;
    display: inline-block;
    padding: 4px 12px;
    border-radius: 50px;
    text-decoration: none;
    border: 1px solid #fff;
    font-family: "SF Pro Display";
    letter-spacing: 0.80px;
}
.explore-more i{
    font-size: 12px;
}
.service-btm{
    background-color: #172F53;
    background-image: url('../image/home/bg-services.jpg');
    background-position: right;
    background-repeat: no-repeat;
    background-size: 80% 100%;
}
.service-box h2.title{
    color: #FFF;

    /* font-family: "SF Pro Display";
    font-family: "SF Pro Display -medium"; */
    font-family: Lato;
font-size: 25px;
font-style: normal;
/* font-weight: 600; */
line-height: normal;
letter-spacing: 0.75px;
}
.service-box p{
    color: #FFF;

font-family: Lato;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 180%; /* 28.8px */
letter-spacing: 0.48px;
font-family: Lato-light;
}
.service-box{
    max-width: 387px;
    min-width:303px;
    padding: 63px 39px 70px 45px;
    border-radius: 5px 5px 5px 5px;
    border: 4px solid #FFF;
    
    background: #193259;
    margin-top: -31px;
    margin-bottom: -15px;
}
.explore-btn1{
    color: #FFF;

    /* font-family: Arial; */
    font-size: 15.723px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: 1px solid #fff;
    padding: 11px 12px;
    text-decoration: none;
    display: inline-block;
    font-family: Lato;
    letter-spacing: 0.80px;
}
.service-box-list p{
    color: #FFF;

    font-family: Lato;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
letter-spacing: 0.48px;
text-transform: uppercase;
}
.service-box-list .icon-box{
    min-height: 64px;
    margin-bottom: 12px;
}



.process-section .title-section{
    color: #172F53;
font-family: Lato;
font-size: 27px;
font-style: normal;
font-weight: 900;
line-height: 130%;
letter-spacing: 0.81px;
}
.process-section .title-section p{
    color: #172F53;
font-family: Lato;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 26px */
letter-spacing: 0.6px;
}
.process-list h3{
    color: #000;

font-family: Lato;
font-size: 18.689px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 0.561px;
}
.process-list p{
    color: #333;
font-family: Lato;
font-size: 14.951px;
font-style: normal;
font-weight: 400;
line-height: 175%; /* 26.164px */
letter-spacing: 0.449px;
-webkit-text-stroke-width: 0.1px;
}
.process-list img{
    max-width: 45px;
}
.process-list > div{
    padding-bottom: 14px;
}
.process-list{
    margin-top: 22px;
}




.course-section{
    background: #172F53;
box-shadow: 0px 4px 11px 0px rgba(0, 0, 0, 0.25);
}
.course-section .title-section p{
    color: #FFF;
    font-family: 'Lato';
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    letter-spacing: 0.6px;
}
.course-section .title-section{
    color: #FFF;
font-family: Lato;
font-size: 30px;
font-style: normal;
font-weight: bold;
line-height: 130%;
letter-spacing: 0.9px;
margin-bottom: 19px;
letter-spacing: 1.8px;

}
.course-section .para p{
    color: #FFF;

font-family: Lato;
font-size: 14.951px;
font-style: normal;
font-weight: 400;
line-height: 175%; /* 26.164px */
letter-spacing: 0.449px;
font-family: Lato-light;
}
.course-left{
    padding-top: 40px;
   
}
.course-box-list{
    width: 603px;
    min-width: 603px;
    border-radius: 5px 0px 5px 5px;
    border: 6px solid #FFF;
}
.course-box{
    position: relative;
}
.course-box .content{
    position: absolute;
    top: 0px;
    left: 0px;
    padding-top: 48px;
    padding-left: 38px;
    z-index: 1;
}
.course-box img{
    width: 100%;
}
.course-box .title{
    color: #FFF6A4;

font-family: Lato;
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: 130%; /* 39px */
letter-spacing: 0.9px;
text-transform: uppercase;
}
.course-box{
    position: relative;
}
.course-box::after{
    content: '';
    width: 100%;
    height: 100%;
    background-color: #0000004f;
    position: absolute;
    top: 0px;
    left: 0px;
}
.course-right{
    margin-top: -28px;
    margin-bottom: -30px;
}
.course-section{
    position: relative;
}
.mySwiper5 .swiper-pagination {
    text-align: start;
    margin-left:38PX;
    margin-bottom: 12px;
}
.mySwiper5 .swiper-pagination .swiper-pagination-bullet{
    width: 13px;
    height: 13px;
    background-color: #E2E2E2;
    border-radius: 0px;
}

.dots-patten{
      /* width: 210px; */
      height: 192%;
      position: absolute;
      right: 0px;
      /* background-image: url(../image/home/dots-pattern.png); */
      top: -54%;
      overflow: hidden;
      z-index: -1;
} 
.dots-patten img{
    max-width: 100%;
    height: auto;
}

.process-circle img{
    max-width: 85%;
}
.process-circle{
    max-width: 585px;
max-height: 585px;
border-radius: 50%;
background: linear-gradient(180deg, #FDFEFF 0%, #91E5FF 100%);
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 585px;
height: 585px;
}
.process-circle .center-title{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    color: #FFF;

font-family: Lato;
font-size: 30px;
text-transform: uppercase;
font-family: Lato-bold;
}
.process-circle .text-circle{
    animation: loader-spin 15s linear infinite;
    transform: rotate(360deg);
}
.process-circle:hover .text-circle {
    animation-play-state: paused;
}
.process-section{
    overflow: hidden;
    position: relative;
}
.process-section .process-dots{
position: absolute;
}
.mission-box .title{
    position: relative;
    overflow: hidden;
}
.mission-box .title::after{
    content: '';
    position: absolute;
    top: 63%;
    width: 100%;
    /* right: -100%; */
    margin-left:8px;
    background-color: #fff;
    height: 0.8px;
}
.mission-box .title::before{
    content: '';
    position: absolute;
    top: 63%;
    width: 100%;
    left: -100%;
    margin-right: 8px;
    background-color: #fff;
    height: 0.8px;
}
.text-line{
    display: flex;
    align-items: center;
    gap: 8px;
}
.text-line .line{
    width: auto;
    height: 1px;
    background-color: #fff;

}
.footer-btm  .container{
    padding: 0px;
}
.phone .v-line{
    font-size: 18px;
    position: relative;
    top: -1px;
}
@keyframes loader-spin {
   to{
    transform: rotate(0deg);
   }
}

footer{
    margin-top: 30px;
}

@media(min-width:1024px){
   .service-right{
    margin-left: 6%;
   }
}
@media (max-width:1200px){
    .course-box-list {
        width: 515px;
        min-width: 480px;

    }
}
@media (max-width:1200px){
    .process-circle{
        width: 460px;
        height: 460px;
    }
}
@media (max-width:992px){
    .mission-box{
        padding-left: 12px;
        padding-right: 12px;
    }
    .mission-box .count-title {
        font-size: 14px;
    }
    .mission-box .count{
        font-size: 22px;
    }
}
@media (max-width:991px){
    .process-circle{
        /* width: 80%; */
        margin-left: auto;
        margin-right: auto;
    }
    .service-box {
        max-width: 100%;
    }
    .course-right{
        margin-left: auto;
        margin-right: auto;
    }
    .service-btm{
        background-position: bottom;
        background-size: auto 68%;
    }
}
@media (max-width:767.9px) {
    /* .mission-box{
        position: static;
    } */
    .mission-box h1.title{
        font-size: 26px;
    }
    .mission-box{
        padding-bottom: 20px;
        position: static;
        margin-bottom: -24px;
    }
    .course-box-list{
        width: 100%;
        min-width: 88%;
    }
    .course-box .title{
        font-size: 24px;
    }
    .service-list > li{
        min-width: 50%;
        
    }
    .service-list{
        justify-content: center;
    }
    .service-btm{
        background-position: bottom;
        background-size: auto 68%;
    }
    .course-box .content{
        padding-top: 28px;
    padding-left: 24px;
    }
    .course-right{
        width: 100%;
    }
    .process-section .process-dots {
        position: absolute;
        left: 0;
        height: 30%;
        top: 0px;
    }
    .process-section .process-dots img{
        height: 100%;
    }
    .mySwiper5 .swiper-pagination {
       margin-left: 24px;
    }
    .service-section .service-dots{
        height: 40%;
        top: 10%;
    }
    .service-section .service-dots img{
        height: 100%;
    }
    .service-list{
        list-style-type: none;
        text-align: center;
    }
    .process-circle{
      width: 80%;
      height: auto;
    }
    .process-circle img {
        /* max-width: 85%; */
        max-width: 100%;
    }
}
@media (max-width:576px){
    .mission-box .count{
        font-size: 18px;
        line-height: 20px;
    }
    .mission-box .count-title {
        font-size: 13px;
    }
    .banner-content h3{
        font-size: 18px;
        line-height: 20px;
    }
    .banner-content p{
        font-size: 17px;
        line-height: 18px;
    }
    .banner-content {
     bottom: 18%;
    }
    .mission-left h4 {
        font-size: 20px;
        line-height: 24px;
    }
    .mission-left p{
        font-size: 14px;
    }
    .service-box-list p{
        font-size: 14px;
        line-height: 18px;
    }
    .service-box {
        min-width: 100%;
        max-width: 100%;
        padding: 33px 12px 38px 12px;
        border-width: 2px;

    }
    .course-box .title{
        font-size: 18px;
    }
    .process-circle {
       width: 98%;
    }
    .banner-section img{
        min-height: 376px;
        object-fit: cover;

    }
        
    .process-circle img{
        max-width: 100%;
    }
    
}

@media (min-width:768px) and (max-width:1367px){
    header .container,.mission-section .container,.service-section .container,.course-section .container,footer .container{
        max-width: 90%;
    }
    .service-btm .container{
        margin-left: 2%;
    }
}
@media (min-width: 1400px){
    .banner-container{
        max-width: 1320px;
        /* margin: 0 auto; */
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        z-index: 9;
    }
    .banner-content{
        left: auto;
        bottom: 110px;
    }
    .banner-container .swiper-pagination{
        text-align: left;
        left: 0px !important;
    }
    .process-list p,.course-section .para p,.service-box p{
        font-size: 16px;
    }
    .mission-box .count-title{
        font-size: 17px;
    }


}
@media (min-width: 1860px){
.course-section-inner, .process-section,.service-section-inner{
    max-width: 1366px;
    margin: 0 auto;
    position: relative;
}
.service-section-inner .service-dots{
    max-height: 100%;
}
.service-btm .service-section-inner{
        background-image: url(../image/home/bg-services.jpg);
background-position: right;
background-repeat: no-repeat;
background-size: 80% 100%;
}
.service-btm{
    background-image: none;
}
}

@media (max-width:576px){
    .banner-section .banner-content p{
        font-size: 18px;
    }
}

@media (max-width:395px){
    .service-list-mobile p{
        font-size: 15px;
    }
}
@media (max-width:352px){
    .service-list-mobile p{
        font-size: 14px;
    }
}
@media (max-width:992px){
    .process-circle img {
        max-width: 100%;
    }
}