
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

html, body{
    overflow-x: hidden;
}
*{
     box-sizing: border-box;
}
:root {
/*--primary-dark: #454456;*/
--primary-dark: #164f80;
--primary-bright:#deb18a;
--primary-light: #f5f0ed;
--text: #C7C7C7;
--gray: #e9e9e9;
--black: black;
--light-gray: #DEF400;
--white: white;
--dark-gray-50: #afafaf80;
--dark-gray: #afafaf;
--white-50: #ffffff80;
--blue: #07618d;
--red:#ed1c24;
h2:#f9ed00S;
}
.text-dark { color:var(--text); }
.text-white { color:var(--white); }
.pt-80{padding-top:80px;}
.pb-80{padding-bottom:80px;}
.mb-3 {margin-bottom: 3rem;}

.pt-130{padding-top:130px;}
.pb-130{padding-bottom:130px;}

.flex{display:flex; }
.justify-space{justify-content: space-between;}
.justify-center{justify-content:center;}
.flex-wrap{flex-wrap:wrap;}
body {
    font-family: "Open Sans", Arial, sans-serif !important;
    margin: 0;
    font-weight:400;
/*background-color:#111A21;*/

}
small{color:var(--red);}

/****BANNER***/

.Partner-sec{
 background-color: #454456;  
}

.Partner-sec:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 100%;
    width: 100%;
    bottom: 0px;
    content: "" !important;
    background-color: #454456d9;
    z-index: -1;
}

.about-hero{
  position: relative;
/*  background:linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('../images/page-banner.jpg');*/
background: linear-gradient(rgb(185 185 185 / 60%), rgba(0,0,0,0.8)), url('../images/page-banner.jpg');
  background-repeat: no-repeat;
background-position: center;
background-size: cover;
  padding: 150px 5%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50vh;  
  padding-bottom: 80px;  
}
.partner-hero{
   position: relative;
  background:linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('../images/partner.jpeg');
  background-repeat: no-repeat;
background-position: center;
background-size: cover;
  padding: 150px 5%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50vh;  
  padding-bottom: 80px;   
}
.Contact-hero{
    position: relative;
  background:linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('../images/contact-banner.jpg');
  background-repeat: no-repeat;
background-position: center;
background-size: cover;
  padding: 150px 5%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50vh;  
  padding-bottom: 80px;    
}

.hero {
        margin-top: -110px;
  position: relative;
  background:url('../images/backgroundhero.jpg');
  background-repeat: no-repeat;
background-position: center;
background-size: cover;
  padding: 150px 5% 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}
.hero-text h1, .hero-text p{
    color: #fff;
}

.hero-image img {
  width: 420px;
  max-width: 100%;
  border-radius: 10px;
}
.nav-right .red-btn {}

.nav-right.col-30 div a{
    display: flex;
    align-items: center;
    background-color: #fe3f40;
    border-radius: 23px;
    color: #fff;
    padding: 10px 20px;
    font-weight: 400;
    letter-spacing: 3px;
    text-decoration: none;
}
.highlight {
  background: #f9ed00;
  color: #000;
  font-weight: 700;
  font-size: 14px;
  padding: 6px 14px;
  display: inline-block;
  margin-bottom: 25px;
}

h1 {
  font-size: 60px;
  font-weight: 700;
  margin-top: 0px;
  margin-bottom:0px ;
  animation: slideRight 1.2s ease-out forwards;
}




.main-head{
font-size: 60px;
  font-weight: 400;
  color: #fff;
  width: 100%!important;
 }

.hero-text span.next-test{
color:#fff;
}
.hero-text {
     display: flex;
    align-items: center;   
}
.main-image-new{
    border: 10px double #fff;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    opacity: 0;

}
.main-image-new img{
object-fit:cover;
width: 100%;
}

/***END**/




/*** about-sec***/
.about-section {
  padding: 100px 5%;
  }
.main-about{
 background-color:#fff;   
}
.about-container {
  display: flex; gap:70px;justify-content: center;}
.main-image{
    display: flex;
}

.two-img-box1{
    margin-top:20px;
        padding-right: 20px;
}

.two-img-box2 {
     padding-bottom: 10px;
    border-bottom: 6px solid #deb18a;   
}
.main-image img {
  width: 100%;
  display: block;
}

.experience-box {
  position: absolute;
  bottom: -30px;
  left: 30px;
  background: #f9ed00;
  color: #000;
  padding: 25px 35px;
  text-align: center;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.experience-box h2 {
  font-size: 42px;
  font-weight: 700;
  line-height: 1;
}

.experience-box p {
  font-weight: 600;
  font-size: 14px;
}

/*.hero-right.col-50, .hero-left.col-50{
 width:50%;   
}
*/
 .about-right.col-50{
  width:50%;
    }

.about-left.col-50{
 width:50%;
}


.about-right h2, {
      color: #232323;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 15px;
  margin-top: 0px;
}
.about-left.col-100 h2 {
 color: #232323;
  font-size: 30px; 
  text-align: center;   
}


.partner-col h2{
   color: #fff;
  font-size: 40px;
  font-weight: 400;
  margin-bottom: 15px;
  margin-top: 0px;   
}


.divide-space{
     border-top: 6px solid #555;
    width: 130px;   
}
.divide-space-partner{
  border-top: 6px solid #deb18a;  
      width: 130px;
      margin-bottom: 20px;    
}

 p {
    color: #555;
    margin-bottom: 20px;
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 1.5em;
    margin-top: 10px;
}

.main-image, .main-image img{
    height: 100%;
    object-fit: cover;
}


/*end*/

.next-sec{
 background-color: #e9e9e9;
}


.Excellence-sec{
background-color:#deb18a;    
}

.next-sec h3{
    font-size: 30px;
    margin-bottom: 15px;
}


.next-sec p{
    font-size:16px;
}
.about-right.col-100 h3{
    margin-top: 40px;
}
.next-sec .core-sec li{
    color: #555;
    font-weight: 500;
    font-size: 16px;
    padding-bottom: 30px;
        padding-left:30px;
}

.about-container-new .core-sec li{
color: #fff;
    font-weight: 500;
    font-size: 16px;
    padding-bottom: 30px;
        padding-left:30px;
}

.partner-col .core-sec li, .partner-col .core-sec li b{
  color: #fff;
    font-weight: 500;
    font-size: 16px;
    padding-bottom: 15px;
        padding-left: 18px;  
}



.core-sec li{
    position: relative;
}
.core-sec li:before{
 position: absolute;
    top: -2px;
    left: 0;
    color:#deb18a;
    font-size: 24px;
 content: "\f105";
 font-family: FontAwesome;
}
.about-container-new{
    display: flex;
}
.about-container-new h2{
    color:#fff ;
}
.Partner-sec{
     padding: 0px 0% 0px;
     display: flex;   
}
.Partner-sec p{
    font-size:16px;
    max-width: none;
    color: #fff!important;
}
.Partner-sec b{
    font-size:20px;
     color: #fff!important;    
}


.about-container-new .about-right.col-50 {
    padding: 100px 80px;
}

.Infrastructure .about-left.col-100 p{
    font-size:16px;
    max-width: none;
    color: #232323!important;  
}
.Infrastructure .col-33{
    width: 33%;
    padding-left:15px; 
    padding-right: 15px; 
}

.Partner-sec .about-left h2, .Excellence-sec .about-middle h2 {
      color: #454456;
  font-size: 40px;
  font-weight: 700;
  margin-bottom: 25px;
}
 .Excellence-sec .about-middle h3{
     font-size: 30px;
          color:#454456;
  font-weight: 400;
  margin-bottom: 25px;
 }

.Partner-sec .core-sec{
    padding-top: 20px;
}

.full-section{
    display: flex;
/*    flex-wrap: wrap;*/
    padding-top: 30px;
    justify-content: center;

    .col-25{
        width: 22%;
        margin-left: 10px;
        margin-right: 10px;
        text-align:center;
        border: 1px solid #999999;
        padding: 10px;
        border-radius: 10px;
    }
}
/***** Certificates Section *******/

.liquid-morph-element {
/*  width: 250px;
  height: 100px;
  background: #0a2342;
  border-radius: 50px;
  display: flex;
  justify-content: center;*/
  align-items: center;
  position: relative;  
  overflow: hidden;
  transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.liquid-morph-element span {
  color: #fff;
  font-size: 1.5rem;
  position: relative;
  z-index: 2;
}

.liquid-morph-element::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: conic-gradient(
    #0ff 0deg, 
    #0a2342 120deg, 
    #0ff 240deg
  );
  transition: all 0.6s ease;
  opacity: 0;
  transform: scale(0);
}

.liquid-morph-element:hover {
  border-radius: 10px; 
}

.liquid-morph-element:hover::before {
  opacity: 0.5;
  transform: scale(2);
}
 /***** Certificates Section *******/

/*.Excellence-sec .about-middle h2, .Excellence-sec .about-middle h3 {
    text-align: center;
}
.Excellence-sec .about-middle p{
    text-align: center;
        font-size: 16px;
        color: #555;
}

.Excellence-sec .full-section{
        display: flex;
    flex-wrap: wrap;
            padding-top: 30px;
              justify-content: center;
          }

.Excellence-sec .full-section .col-25{
    width: 22%;
        margin-left: 10px;
    margin-right: 10px;

}


.Excellence-sec .full-section .col-25, .Excellence-sec .full-section .col-50{
    text-align:center;
        border: 1px solid #454456;
    padding: 20px 16px;
    border-radius: 10px;
}
.Excellence-sec .full-section .col-25{
      display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    overflow: hidden; 
}

.hover-change{
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.Excellence-sec .col-25:hover .hover-change span, .Excellence-sec .col-25:hover .hover-change p{
color: #fff;
}
.Excellence-sec .col-25 .hover-change img{
  filter: brightness(0) invert(1);
 
}


.Excellence-sec .col-25:after {
    content: '';
    background:#454456;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 0%;
    opacity: 1;
    transition: 0.6s;
    transform: rotate(0deg) scale(1);
    border-radius: 10px;
}
.Excellence-sec .col-25:hover:after {
    height: 100%;
    transform: rotate(0deg) scale(1);
}

.Excellence-sec .full-section .col-50{
    width:46.33%;
    margin-left: 10px;
    margin-right: 10px;
}


.Excellence-sec .col-25 span, .Excellence-sec .col-50 span{
    color:#454456;
    font-size: 24px;
    font-weight: 400;
    padding-top: 15px;
}


.Excellence-sec .Step-sec, .Excellence-sec .Global-sec{
    padding-top:30px;
}*/

.about-section p b, .hero-text b, .core-sec li b{
        color:#555;
}
.button-about{
      display: inline-block;
    margin-top: 20px;  
}
.button-about a{
    position: relative;
    display: inline-block;
    line-height: 24px;
    padding: 14px 50px;
    overflow: hidden;
    text-transform: uppercase;
    vertical-align: middle;
    border-radius: 0;
    background-color: transparent;
    font-size: 14px;
    letter-spacing: 1px;
    color: #555;
    font-weight: 700;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    z-index: 0;
    border: 1px solid #454456;
  
}
.button-about a:before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    content: "";
    background-color: var(--blue);
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    opacity: 0;
    border-top-right-radius: 33px;
    border-bottom-right-radius: 33px;
    z-index: -1;
    border-top-left-radius: 33px;
}

.button-about a:hover:before {
    width: 100%;
    border-radius: 0;
    opacity: 1;
}

.button-about a:hover{
color:#fff;
}





/*last-use*/

.detail a{
    color: #555!important;
}
.infrastructure{
    background-image: url(../images/export.jpg);
    background-color: #464646;
    background-blend-mode: overlay;
    background-size: cover;
    background-repeat: no-repeat;
    img.border-round{ border-radius:20%; }
}

.container-infrastructure {
  /*max-width: 1200px;
  margin: 0 auto;*/
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap:20px;

}

.about-box {
width: 31.33%;
  text-align: left;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.boxes{
       margin-top: -60px;
    background-color:#fff;
    position: relative;
    margin-left: 30px;
    margin-right: 30px;
    text-align: center;
    padding: 10px;
    transition: 0.5s;
        
} 



.about-box img {
  width: 100%;
 height: 100%;
  object-fit: cover;
      border-top-right-radius: 6px;
    border-top-left-radius: 6px;
}

.about-box h2 {
  font-size: 24px;
  line-height: 24px;
  font-weight: 400;
  padding-left: 10px;
    padding-right: 10px;
    text-align: center;
}

.about-box p {
  font-size: 16px;
  color: #444;
  line-height: 1.6;
   padding-left: 10px;
    padding-right: 10px;
     text-align: center;
}



/*end*/
/*contact us*/
.contact-info-bar {
  background-color:#fbfbfb;
/*    padding: 80px 5% 80px;*/
padding: 80px 5% 2px;
  
}
.contact-sec-new{
 display: flex;
 flex-wrap: wrap; 
 gap:15px; 
 justify-content: space-between; 
 padding: 0px 25px;
}

.contact-sec-wrapper h2{
    padding: 80px 5% 0px;
    margin-top: 0px;
    color: #f9ed00;
        font-size: 40px;
 font-weight: 700;

}
.contact-sec-wrapper{
  background-color: #232c33; 
}
.info-box {
    display: flex;
    align-items: center;
    width: 24%;
    flex-direction: column;
    background-color: #fff;
/*    padding: 10px 0;*/
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 30%);
}
.info-text{
    text-align: center;
}
.icon {
  width: 40px;
  height: 40px;
  border: 1px solid #454456;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #164f80;
  transition: all 0.3s ease;
  flex-shrink: 0;
  background-color: #D9DDF2;
      margin-top: -5%
}
.icon i{
    font-size: 20px;
}
.info-box:hover .icon{
  background-color: #164f80;
  color: #ffffff;
  border-color: #454456;
  cursor: pointer;
}

.info-text .title {
    font-size: 20px;
    color:#454456;
    margin-bottom: 4px;
    font-weight: 400;
}

.info-text .detail {
  font-size: 14px;
  font-weight: 400;
  color: #555;
}

    .about-left.col-100 .col-50{
width:100%;

    }


.about-left.col-100{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;

}
.Mission-sec{
    display: flex;
    margin-bottom: 30px;
  padding: 60px 15px;
   border: 1px solid #A5AFB8;
      align-items: center;

}
.Mission-sec p, .Vision-sec p {
color: #454456;
text-align: left;
font-size: 20px;
}

.Vision-sec{
    display: flex;
  padding: 60px 15px;
    border: 1px solid #A5AFB8;
       align-items: center;
 

}

.content-mission{
    padding-left: 20px;
}


.next-sec h3{
      color: #454456;
      text-align: left;
}
.core-sec li b {
    font-size: 20px;
}


/*end*/

/*contact-page css*/
.contact-section {
  width: 100%;
/*  background-color:#454456;
  color: #fff;*/
  padding: 80px 0;

}

.contact-container {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
}

.contact-form {
  flex: 1 1 50%;
  padding-right:20px;
}
.contact-form .input-type{
    margin-bottom: 15px;
}

.form-row {
  display: flex;
  gap: 15px;
  margin-bottom: 15px;
}

.form-row input {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #454456;
  outline: none;
  background: #fff;
  color: #000;
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #c9c9c9;
  outline: none;
      border-radius: 0px;
    background: #fff;
    color: #000;
    font-size: 15px;
    box-sizing: border-box;
/*    height: 60px;*/
}

.contact-form .input-type::placeholder{
    font-size: 18px;
       font-weight: 500;
    color: #232323;
        font-family: "Lato", sans-serif;
}

.contact-form textarea{
    height: auto;
}

.contact-form .btn-submit{
position: relative;
    display: inline-block;
    line-height: 24px;
    padding: 14px 50px;
    overflow: hidden;
    text-transform: uppercase;
    vertical-align: middle;
    border-radius: 0;
    background-color: #fe3f40;
    font-size: 14px;
    letter-spacing: 1px;
    color: #fff;
    font-weight: 700;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    z-index: 0;
    border: 1px solid #deb18a;
}

.contact-form .btn-submit:before{
position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    content: "";
    background-color:#deb18a;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    opacity: 0;
    border-top-right-radius: 33px;
    border-bottom-right-radius: 33px;
    z-index: -1;
    border-top-left-radius: 33px;
}

.contact-form .btn-submit:hover:before {
    width: 100%;
    border-radius: 0;
    opacity: 1;
}
.contact-form .btn-submit:hover {
    color: #fff;
}

.contact-image {
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.formMessage{
    margin-top: 10px;
    font-weight: bold;
    background: green;
    color: #fff;
    padding: 15px;
}

/*end*/

.nav-right.col-30{
     justify-content: right;
    display: flex;
   }



.container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;}


a {

    align-items: center;
    line-height: 1.2em;
    text-decoration: none;
    transition: color .3s;
    color: #86b8f0;
}
h2 {
    color: var(--primary-dark) !important;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 40px !important;
    line-height: 40px;
    font-weight: 400;
}

/*.mb-35 h2{
    margin-bottom: 30px!important;
}*/
h3 {
    color: var(--primary-dark);
    margin-top: 10px;
    margin-bottom: 10px;
/*  font-family: "Crimson Text";*/
    font-size: 36px;
    font-weight: 500;
    line-height: 1.2em;}

h4 {
    color: var(--primary-dark);
    margin-top: 10px;
    margin-bottom: 10px;
/*      font-family: "Crimson Text";*/
    font-size: 28px;
    font-weight: 500;
    line-height: 1.2em;
}

h5 {
    color: #fff;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2em;
}
/*p {
    color:#fff;
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 1.5em;
     font-size: 16px;
    font-size: 0.9em;
    letter-spacing: 1px;
}*/
.col-30{
    width: 40%;
    z-index: 1;
}
.col-40{
   width: 40%;
       z-index: 1;
  
}

.nav-left.col-30 a{
     color: #454456;
    font-size: 15px;
    font-weight: 400;
   
}
.nav-right.col-30 i{
font-size: 30px;
    padding-right: 10px;
}

ul{padding:0px; list-style:none; margin:0px;}

/**header css**/
.line-wrap{display:flex; justify-content:space-between;}
.nav-line {
  width: 40%;
  height: 1px;
  background-color:var(--white-50); /* line color */
  opacity: 0;
  transition: all 0.6s ease-out;
  will-change: transform, opacity;
}
.navbar-fixed .brand-main img{height:52px;}

/* Left line animation start state */
.nav-line-left {
  transform: translate3d(-30px, 0, 0) scale3d(0.8, 1, 1);
}

/* Right line animation start state */
.nav-line-right {
  transform: translate3d(30px, 0, 0) scale3d(0.8, 1, 1);
}

/* Active (animated) state */
.nav-line.active {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale3d(1, 1, 1);}


.scrolled{background-color:#fff!important;}
/*.scrolled .brand-main img{    filter: invert(100%);}
.scrolled .card-wrap img{    filter: invert(100%);}*/
.scrolled .nav-menu-main span{color:var(--primary-dark);}
.scrolled .nav-menu-main span:hover{color:#08080861}
/*.scrolled .nav-menu-main a:hover{
color:#deb18a!important;
}*/
.scrolled .arrow1{
    border-color: var(--primary-dark);}
.scrolled .nav-menu-main a{color:#164f80;}
.navbar-fixed{transition: background-color 0.3s ease;}
.nav-menu-main span{
color:#454456;
margin-top: 0;
text-transform:capitalize;
margin-bottom: 0;
font-size: 16px;
line-height: 1.2em;
transition: color .3s;
text-transform: uppercase;
}

/*.nav-menu-main .active{
    color:var(--primary-bright)!important;
}
*/

.nav-menu-main {
    a.nav-link-main {
        color: #164f80;
        margin-top: 0;
        margin-bottom: 0;
        font-size: 16px;
/*        margin-right: 10px;*/
        line-height: 1.2em;
        transition: color .3s;
        text-transform: capitalize;
        font-weight: 600;
        letter-spacing: 1px;
          position: relative;
         transition: .5s;
          &:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-top: 2px solid #262626;
        border-bottom: 2px solid #262626;
        transform: scaleY(2);
        opacity: 0;
        transition: .3s;
      }
      &:after {
        content: '';
        position: absolute;
        top: 2px;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #262626;
        transform: scale(0);
        opacity: 0;
        transition: .3s;
        z-index: -1;
      }
      &:hover {
        color: #fff;
        &:before {
          transform: scaleY(1);
          opacity: 1;
        }
        &:after {
          transform: scaleY(1);
          opacity: 1;
        }
      }
        }
 
  
}
.scrolled{
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}


.navbar-fixed {
position: fixed;
width: 100%;
top: 0;
z-index: 9999999;
background: rgb(185 185 185 / 60%);
/*background-color: #ebf8ff;
-webkit-box-shadow: 0 0 15px rgb(0 0 0 / 50%);
    -ms-box-shadow: 0 0 15px rgb(0 0 0 / 50%);
    -o-box-shadow: 0 0 15px rgb(0 0 0 / 50%);
    box-shadow: 0 0 15px rgb(0 0 0 / 50%);*/
    -webkit-transition: top 300ms ease;
    -o-transition: top 300ms ease;
    transition: top 300ms ease;
}

.navbar-fixed .scrolled {
    opacity: 1;
    z-index: 99901;
    visibility: visible;
    background: #fff;
}
.animated {
    animation-duration: 1.25s;
}
.bg-color{background: #e7e7e7;}

.products{
    img { 
        box-shadow: 0px 0px 5px 2px rgb(74 74 74 / 30%);
        padding: 10px;
        border: 1px solid #bfbfbf;
        width: 100%;
     }
    .slick-dots {
        text-align: center;
    }
    .slick-dots li {
        display: inline-block;
        padding: 2px;
        
    }
    .slick-dots li button {  
        font-size: 0px;
        background: #c9c9c9;
        width: 10px;
        height: 12px;
        border-radius: 50%;
        border-width: 0px; 

    }
    .slick-dots li.slick-active button{
        background: #06BBCC;
    }
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

@-webkit-keyframes slideInDown {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
 
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
 
@keyframes slideInDown {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
 
  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
 
.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

.nav-container-main {
max-width: 1400px;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
margin-top: 15px;
/*padding: 20px 10px;*/
}

.new-menu{
display: flex;
justify-content: space-between;
align-items: center;
       padding: 15px 15px;
    z-index: 1;
    width: 100%;
    border-radius: 12px;
   
}

.mega-menu{width:550px; margin-left:-440px;}

.brand-main{position:absolute; display:inline-block;}

.nav-middle{width:100%;     position: relative;
display: flex;
justify-content:center;
    /*gap: 30px;*/
    font-weight: 500;
    text-transform: uppercase;}

.nav-menu-main {
display: flex;
width:100%;
align-items: center;
justify-content: space-between;
gap: 20px;
}
.left-block{    display: flex;
align-items: center;
gap: 20px;}

.right-block{ display: flex;
align-items: center;
gap: 20px;}

.nav-link-main {
text-decoration: none;
padding:0.5rem 1rem;
}

.nav-menu-wrapper-main{    display: flex;
gap:40px;
width: 100%;
justify-content: space-between;}

.card-wrap{display:flex;align-items:center;gap:15px;}

/* Dropdowns */
.nav-dropdown {
position: relative;
}

.nav-dropdown-toggle {
cursor: pointer;
display: flex;
align-items: center;
gap: 5px;
}


.mega-col ul{padding:0px; list-style:none; margin:0px;}
.mega-menu-wrap{display: flex;}
.mega-menu-wrap .mega-col{width: calc(100% / 3); padding:0px 10px;}


.nav-menu-main span:hover{color:#ffffff80}
/*.nav-menu-main a:hover{color:#0d1b2a}*/

.nav-dropdown-list {
display: none;
position: absolute;
    border: 1px solid #0000002e;
top: 100%;
left: 0;
background: #fff;
box-shadow: 0 0 10px #0000000a;
padding: 10px;
min-width: 200px;
flex-direction:column;
z-index: 100;
border-radius: 12px;
padding-top: 20px;
padding-bottom: 20px;
}

.nav-dropdown-list a {
display: block;
color: #333;
text-transform:capitalize;
text-decoration: none;
transition: all .3s;
width: 100%;
margin-left: -20px;
padding: 8px 8px 8px 0;
font-size: 16px;
transition: all .3s;
position:relative;
}

.nav-dropdown-list a:hover {
color: #333;}

.nav-dropdown-list a:before{    background-color: var(--primary-bright);
    content:"";
    width: 16px;
    opacity:0;
    height: 1px;
    transition: all .3s;
    margin-right: 15px;
    display: inline-block;}

.nav-dropdown-list a:hover {
    background-color:transparent;
  margin-left:0px;
}
.nav-dropdown-list a:hover:before{
    opacity:1;
}
.hero-content{
      flex-wrap: wrap;
    display: flex;  
}






/* Mega Menu */
.mega-menu .nav-dropdown-list {
  display: none;
  width: 600px; /* full mega menu width */
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.15);
  display: flex;
  gap: 20px;
  left: 50%; /* center */
  transform: translateX(-50%);
}

.mega-column {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Arrow icon */
.arrow1{
  border: solid #fff;
  border-width: 0 1px 1px 0;
  padding: 3px;
  transform: rotate(45deg);
  display: inline-block;
}

/* Hover effect for desktop */
@media(min-width: 768px){
  .nav-dropdown:hover > .nav-dropdown-list {
    display: flex; /* flex for mega menu */
  }
}

/* Mobile toggle */
@media(max-width: 767px){
  .nav-menu-main {
    flex-direction: column;

  }
  .nav-menu-main.active {
    display: flex;
  }
  .nav-dropdown-list {
    position: relative;
    box-shadow: none;
    min-width: 100%;
  }
  .mega-menu .nav-dropdown-list {
    flex-direction: column;
    width: 100%;
    transform: none;
  }
}

/**end of header css**/



/*.slider {
position: relative;
overflow: hidden;
width: 100%;
height: 100vh;
}

.slide {
position: absolute;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 1s ease-in-out;
z-index: 0;
background-color: rgb(185 185 185 / 60%);
}

.slide.active {
opacity: 1;
z-index: 1;
}

.slide img {
width: 100%;
height: 100%;
object-fit: cover;
    object-position: top;
}*/

/* ✅ Overlay on each slide */
/*.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color:rgb(69 68 86 / 50%);  
z-index: 1;
}

.slide-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)!important;
text-align: center;
color: #fff;
z-index: 2;
margin-top:30px;
}

.slide-content h1{    color: #fff;
    text-align: center;
    margin-top: 0;
    margin-bottom: 20px;
    font-weight: 500;
    line-height: 1.2em;}

.slide-content p {
font-size: 1.2rem;
margin-bottom: 1.5rem;
line-height: 1.6;
color:#fff;
font-weight:300;
}*/


.scroll-effect {
  will-change: transform;
  transform-style: preserve-3d;
  transition: transform 0.1s ease-out;
}

/* Arrows */
/*.arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 5;
cursor: pointer;
}

.arrow img {
width: 80px;
height: auto;
transition: opacity 0.3s;
}

.arrow img:hover {
opacity: 0.7;
}

.arrow.left {
left: 20px;
}

.arrow.right {
right: 20px;
}
*/
/*.bottom-round-bg {
z-index: 999;
background-image: url(../images/Bottom-bg.svg);
background-position: 50% 100%;
background-repeat: no-repeat;
background-size: 100%;
width: 100vw;
height: 100px;
    width: 100%;
margin-bottom: -2px;
position: absolute;
inset: auto 0% 0%;
}*/


/*.primary-button:hover {
border-color: var(--white);
background-color: var(--white);
opacity: 1;
}*/
a:active, a:hover {
outline: 0;
}
.primary-button:hover:before {
    width: 100%;
    border-radius: 0;
    opacity: 1;
}


.primary-button {
    position: relative;
    display: inline-block;
    line-height: 24px;
    padding: 14px 50px;
    overflow: hidden;
    text-transform: uppercase;
    vertical-align: middle;
    border-radius: 0;
    background-color: transparent;
    font-size: 14px;
    letter-spacing: 1px;
    color: #fff;
    font-weight: 700;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    z-index: 0;
    border: 1px solid #deb18a;
}

.primary-button:before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    content: "";
    background-color: #deb18a;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
    opacity: 0;
    border-top-right-radius: 33px;
    border-bottom-right-radius: 33px;
    z-index: -1;
    border-top-left-radius: 33px;
}



.italic-text-span{    font-style: italic;
    font-weight: 300;}



/**about us css***/

.section-title-wrapper {
    text-align: center;
    flex-direction: column;
    align-items: center;
    max-width: 740px;
    margin-bottom: 60px;
    margin-left: auto;
    margin-right: auto;
    display: flex;}
.knot-icon-wrapper {
    background-image: url(../images/wavy-circle.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 100%;
    margin-bottom: 20px;
    padding: 12px;
    display: flex;
    align-items: center;
    width: 31px;
    height: 31px;
    justify-content: center;}
.image-knot{width:26px; height:26px;}
.rotate-effect {
  display: inline-block;
  transform-style: preserve-3d;
  will-change: transform;
  animation: fullRotate 1.5s linear infinite; /* ⚡ fast continuous rotation */
}

/* Keyframes for full rotation */
@keyframes fullRotate {
  from {
    transform: translate3d(0, 0, 0)
               scale3d(0.98493, 0.98493, 1)
               rotateZ(0deg)
               skew(0deg, 0deg);
  }
  to {
    transform: translate3d(0, 0, 0)
               scale3d(0.98493, 0.98493, 1)
               rotateZ(360deg)
               skew(0deg, 0deg);
  }
}

.title-wrap-set h2{
    margin-top: 0;
    margin-bottom: 20px;}

.video-block-wrapper img{
z-index: 2;
object-fit: cover;
border-radius: 300px;
width: 90%;
height: 662px;
position: relative;
}

.video-block-wrapper{    justify-content: flex-end;
height: 100%;
display: flex;
position: relative;}

.assymetric{    z-index: 999;
    grid-column-gap: 60px;
    grid-row-gap: 40px;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;}
.col-62{width:62%;}
.col-38{width:38%;}

.in-section-title-video-block{
    z-index: 2;
    width: 70%;
    margin-top: 40px;
    margin-bottom: 20px;
    position: absolute;
    inset: 0% auto auto 0%;
}

.play-button{    z-index: 5;
    background-color: var(--primary);
    color: var(--primary-dark);
    background-image: url(../images/wavy-circle2.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: auto 86%;
    border-radius: 50%;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 160px;
    transition: all .3s;
    display: flex;
    position: absolute;}

.video-button-big{    z-index: 2;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 160px;
    height: 160px;
    margin-bottom: 40px;
    background-color:transparent;
     border:0px;
    display: flex;
    position: absolute;
    inset: auto auto 0% 0%;}
.play-button-icon {
    z-index: 7;
    margin-left: 4px;
    font-family: "Fa solid 900", sans-serif;
    font-size: 28px;
    position: relative;
}

.play-button:hover {
    background-color: var(--primary-bright);
    color: var(--white);
    background-image: url(../images/wavy-circle2w.svg);
    transform: scale(.96);
}

  /* Overlay background */
  .popup-overlay {
display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 84%);
    z-index: 9999999;
  }

  /* Popup box */
  .popup-content {
position: fixed;
    top: 0px;
    left: 0px;
    background: transparent;
    padding: 0px;
    border-radius: 8px;
    width: auto;
    text-align: center;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Close button */
  .close-btn {
margin-top: 0px;
    padding: 8px 16px;
    background: transparent;
    color: #fff;
    border: none;
    border-radius: 0px;
    cursor: pointer;
    position: absolute;
    right: 0px;
    top: 0px;
    font-size: 35px;
  }

.about-block-image-small {
    z-index: 2;
    object-fit: cover;
    border-radius: 300px;
    width: 82%;
    height: 240px;
    position: relative;}

.small-image-wrapper {
    justify-content: flex-end;
    width: 100%;
    margin-bottom: 40px;
    display: flex;
}

.primary-button.bright {
    border-color: var(--primary-bright);
    background-color: var(--primary-bright);
    color: var(--white);
}
.primary-button.bright:hover {
    color: var(--black);
    background-color: #0000;
}
.small-wrap-38{
    text-align:right;
}
.button-wrapper-main {
    margin-top: 50px;

}
/**end of about us css***/


/**services css***/

.services-side-image{    object-fit: cover;
border-top-left-radius: 300px;
border-bottom-left-radius: 300px;
width: 440px;
height: 100%;
position: absolute;
inset: 0% 0% 0% auto;}
.services-wrap{position:relative;}
.col-52{width:52%;}
.section-subtitle {
    background-color: var(--primary);
    color: var(--primary-dark);
    margin-top: 0;
    margin-bottom: 20px;
    padding: 4px 8px;
    font-size: 18px;
    font-weight: 400;
}

.services-title-wrapper{    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 50px;
    display: flex;}

.icon-features-wrapper {
    background-color: var(--primary);
    border-radius: 100%;
    margin-bottom: 15px;
    padding: 18px;
    position: relative;
}

.icon-features {
    width: 48px;
    height: 48px;
}
.features {
    text-align: center;
    flex-direction: column;
    align-items: center;
    padding-left: 10px;
    padding-right: 10px;
    display: flex;
}

.main-features-wrapper {
    z-index: 1;
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    width: 100%;
    display: grid;
    position: relative;
}


/**end of services css***/



/***Elevate css**/

.light-background-no-bottom{
    background-color: var(--primary-light);
}

.membership-image {
    z-index: 2;
    object-fit: cover;
    border-radius: 300px;
    width: 62%;
    height: 440px;
    position: relative;
}

.membership-image.two {
    z-index: 3;
    width: 45%;
    height: 240px;
    margin-top: 100px;
    margin-right: -40px;
}

.images-composition {
    width: 100%;
    display: flex;
}

.two-column-wrapper {
    z-index: 999;
    grid-column-gap: 60px;
    grid-row-gap: 40px;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
}


.center-layout{
    align-items: center;
}

.one-col{width:50%; height:100%;}
.two-col{width:50%; height:100%;}
.membership-right{
text-align: right;
    flex-direction: column;
    align-items: flex-end;
    display: flex;
}
.in-section-title {
    margin-top: 0;
    margin-bottom: 20px;
}
.title-width{width:95%;}
.bg-image-left-line {
    z-index: 0;
    object-fit: contain;
    object-position: 0% 0%;
    width: 30%;
    height: 120%;
    position: absolute;
    inset: -14% auto 0% 0%;
}
.relative{position:relative;}
.home-features{justify-content:space-between; grid-gap: 50px; position:relative;z-index:2;}
.home-features-grid-item{padding-left: 20px;
    padding-right: 20px; text-align: center;}

.home-numbers{    color: var(--primary-dark);
    margin-bottom: 40px;
    font-family: Boska, sans-serif;
    font-size: 72px;
    font-weight: 500;
    line-height: 1;}
.numbers-subtitle {
    z-index: 1;
    text-align: center;
    line-height: 1.2em;
    position: relative;
}


.twomebemer-set .membership-right {
    text-align: left;
    flex-direction: column;
    align-items: flex-start;
    display: flex;}

 .about-block-image{z-index: 2;
    object-fit: cover;
    border-radius: 300px;
    width: 100%;
    height: 460px;
    position: relative;}   
.bg-image-right-line{
        z-index: 0;
    object-fit: contain;
    object-position: 0% 50%;
    width: 30%;
    height: 120%;
    position: absolute;
    inset: 0% 0 0% auto;
}
/***end of elevate css**/



/**appointment css***/
.cta-loop{ z-index: 999;
  background-color: var(--primary-bright);
  margin-bottom: -2px;
  padding-top: 14px;
  padding-bottom: 14px;
  position: relative;
  overflow: hidden;}

.w-inline-block {
    max-width: 100%;
    display: inline-block;}




.cta-loop-wrapper {
    grid-column-gap: 80px;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    display: flex;
}


.cta-loop-text {
    color: #fff;
    letter-spacing: 1px;
    font-family: Boska, sans-serif;
    font-style: italic;
    line-height: 1em;
}

.cta-icon {
    filter: invert();
    object-fit: contain;
    transform-style: preserve-3d;
    width: 20px;
    height: 20px;
    transform: rotateX(0) rotateY(180deg) rotateZ(0);
}


.cta-loop-item-wrapper {
    grid-column-gap: 80px;
    flex-direction: row;
    flex: none;
    justify-content: flex-start;
    align-items: center;
    display: flex;}

.marquee-container {
    overflow: hidden;
    width: 100%;
  }

  .marquee-move {
     display: flex;
    width: max-content;
    animation: scroll 25s linear infinite;
    will-change: transform;
    transform-style: preserve-3d;
  }

@keyframes scroll {
    0% {
      transform: translate3d(0, 0, 0) scale3d(1,1,1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg,0deg);
    }
    100% {
      transform: translate3d(-50%, 0, 0) scale3d(1,1,1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg,0deg);
    }
  }
/**end of appointment css***/



/**team css**/

.home-1-team-wrapper {
    grid-column-gap: 30px;
    width: 100%;
    display: flex;}

.home-1-team-image {
    object-fit: cover;
    object-position: 50% 0%;
    border-radius: 300px;
    width: 100%;
    height: 360px;}

.home-1-team-item{width:25%; text-align:center;}

.home-1-team-item.lower{margin-top:80px;}

.home-1-team-name {
    margin-top: 20px;
    margin-bottom: 10px;
}

.no-margin {
    margin-top: 0;
    margin-bottom: 0;
}

/**end of team css**/




/***testimonials css**/

.title-testimonials{border-right: 1px solid #332d2833;
    flex-direction: column;
    justify-content: center;
    display: flex; width:40%;}
.testimonials-wrap{display:flex;}
.review-slider{width:60%!important;}
.w-slider{  margin: auto;
  overflow: hidden; margin-left:100px;}
/* Slider Wrapper */
#w-testimonial-slider{
  position: relative;
  width:100%;
  margin: auto;
  overflow: hidden;
}

/* Slide Mask */
.w-slider-mask {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

/* Individual Slide */
.slide-testimonial {
  min-width: 100%;
  box-sizing: border-box;
  padding: 20px;
}

.quote-img {
  width: 40px;
  margin-bottom: 15px;
}

.about-testimonial {
  display: flex;
  align-items: center;
  margin-top: 15px;
}

.photo-testimonial {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin-right: 10px;
}

.name-testimonial {
  font-weight: bold;
}


/***end of testimonials css**/


/***contact css***/


.image-contact-bg{    
    background-image: url(../images/rdne-stock-project.webp);
    background-position: 50% 100%;
    background-repeat: no-repeat;
    background-size: cover;}

.border-wrapper {
    z-index: 999;
    border: 1px solid var(--primary);
    width: 100%;
    padding: 10px;
    position: relative;
}

.contact-block {
    z-index: 1;
    background-color: var(--white);
    align-items: stretch;
    padding: 60px 20px;
    display: flex;
    position: relative;
    overflow: hidden;
}

.service-content-wrap {
    z-index: 6;
    grid-column-gap: 50px;
    text-align: center;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-bottom: auto;
    display: flex;
    position: relative;
}
/***end of contact css***/


/***blog post css***/
.blog-list {
    grid-column-gap: 30px;
    grid-row-gap: 40px;
    flex-wrap: wrap;
    align-items: stretch;
    display: flex;
}

.blog-item {
    width: 22.66%;
}

.blog-image-link {
    border-top-left-radius: 300px;
    border-top-right-radius: 300px;
    width: 100%;
    position: relative;
    overflow: hidden;
    display:flex;
}


.home-blog-image {
    object-fit: cover;
    width: 100%;
    height: 340px;
}

.blog-corner-arrow {
    z-index: 2;
    border-top: 1px solid var(--white);
    border-left: 1px solid var(--white);
    color: var(--white);
    border-top-left-radius: 36px;
    padding: 17px 16px 10px 22px;
    font-family: "Fa solid 900", sans-serif;
    font-size: 10px;
    transition: border .3s;
    position: absolute;
    inset: auto 0% 0% auto;
}

.blog-date {
    z-index: 2;
    background-color: var(--primary);
    padding: 8px 12px;
    position: absolute;
    inset: auto auto 0% 0%;
}

.blog-item-overlay {
    z-index: 0;
    background-image: linear-gradient(to top, #0003, #fff0 30%);
    transition: all .3s;
    position: absolute;
    inset: 0%;
}

.blog-item-overlay:hover {
    background-color: #08080833;
}

.items-title {
    transition: color .3s;
}
.items-title:hover {
    color: #00000080;
}
.button-wrapper-main.small {
    margin-top: 20px;
}
.link-underline {
    border-bottom: 1px solid var(--primary-dark);
    padding-bottom: 4px;
    transition: border .3s, color .3s;
    display: inline-block;
}
.link-underline:hover {
    border-bottom-color: var(--primary-bright);
}

.blog-content-wrapper {
    padding-top: 20px;
}

.center{text-align:center;}

/***end of blog post css***/


/**footer***/

.footer {
/*    text-align: center;*/
    align-items: flex-start;
    padding-top: 60px;
    padding-bottom: 15px;
    position: relative;
    position: relative;
     background:url(../images/about-banner.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    z-index: 10;
    }
.footer:before {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 100%;
    width: 100%;
    bottom: 0px;
    content: "" !important;
    background-color:rgb(0 0 0 / 80%);
    z-index: -1;
}

.footer-logo img {
height: 60px;
}

.footer-sec div{
 font-size: 30px;
    color: #FFF;
    FONT-WEIGHT: 600;   
}
/*.top-round-bg {
z-index: 1;
transform-style: preserve-3d;
background-image: url(../images//Round-Bottom-BG.svg);
background-position: 50% 100%;
background-repeat: no-repeat;
background-size: 100%;
width: 100%;
height: 100px;
margin-top: -2px;
position: absolute;
inset: 0% 0% auto;
transform: rotateX(180deg) rotateY(0) rotateZ(0);
}*/

.footer-logo{ border-bottom: 1px dashed var(--white-50);
justify-content: center;
align-items: center;
width: 100%;
margin-bottom: 30px;
padding-bottom: 30px;
display: flex;}


/*.footer-wrapper{
justify-content: space-between;
width: 100%;
margin-bottom: 60px;
display: flex;
}*/


/*.footer-info{ flex-direction: column;
align-items: flex-start;
display: flex; text-align:left;}
*/
.footer-info h5{    color: var(--white);
text-align: center;}
.footer p{
color: var(--white);
/*text-align: center;*/
margin-top: 10px;
margin-bottom: 10px;
line-height: 1.5em;
}

.footer-info ul{display:flex; align-items:center; gap:30px;     margin: 20px 0px  30px; justify-content: center;}
.footer-info  ul li a{ color: var(--white);font-size: 18px;
text-decoration: none;
transition: all .3s;}
.footer-info  ul li a:hover{
color: #f9ed00;
}


.footer-link-wrap h5{    color: var(--white);
text-align: left;}

.footer-link-wrap ul li a{color: var(--white);
padding-top: 10px;
padding-bottom: 10px;
transition: all .3s;     display: inline-block;}

.footer-link-wrap ul li a:hover{
color: var(--white-50);
}
.footer-link-wrap{
text-align:left;
}

.footer-bottom-wrapper{
grid-row-gap: 5px;
border-top: 1px dashed var(--white-50);
flex-flow: wrap;
justify-content: space-between;
align-items: center;
width: 100%;
padding-top: 15px;
display: flex;
}

.copy-right-wrap p{margin-bottom:0px;     color: #ffffffb3;
font-size: 14px;
display: inline;}

.powered-wrap {
    text-align: right;
    margin-bottom:0px; color: #ffffffb3;
font-size: 14px;
}

/**end of footer***/



/**popup css cart**/

/* Overlay background */
.cart-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999999;
}

/* Popup box */
.cart-box {
  background: #fff;
  width: 90%;
  max-width: 480px;
  text-align: center;
  position: relative;
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
  animation: popupFade 0.3s ease;
}

/* Close button */
.close-popup {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  cursor: pointer;
}
.card-wrap .search{
 cursor:pointer;
 position:relative;
} 

.header-wrap h4{margin:0px;}

.card-wrap .cart-quantity{    position: absolute;
    background-color: var(--primary-light);
    color: var(--primary-dark);
    font-weight: 400;
    border-radius: 9px;
    min-width: 18px;
    height: 18px;
    font-size: 11px;
    line-height: 18px;
    top: -7px;
    right: -14px;
    display: flex;
    align-items: center;
    justify-content: center;}

/* Animation */
@keyframes popupFade {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

.cart-box .header-wrap{    border-bottom: 1px solid #e6e6e6;
    flex: none;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    display: flex;
    position: relative;}


.close-popup1{font-size:30px;  color: var(--primary-dark); cursor:pointer;}
.cart-box .body-popup{
justify-content: center;
    align-items: center;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
}


.form-overlay-set .cart-box{max-width:95%!important; background-color: transparent;
box-shadow: unset;     animation: unset!important;     height: 100%;
    align-items: center;
    display: flex;
    width: 100%;}
.form-overlay-set{
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
background-color: #ffffffdb;
z-index: 9999999;
padding-right:20px;
padding-left:20px;
}

.form-overlay-set .body-popup-form{width:100%;}

.close-popup2{    position: absolute;
top: 0px;
right: 0px;
font-size: 40px; cursor:pointer;}


.form-overlay-set .input-set input{
border: 1px solid var(--dark-gray-50);
background-color: var(--white);
color: var(--primary-dark);
height: auto;
margin-bottom: 0;
padding: 18px 24px;
font-family: "Lato", sans-serif!important;
font-size: 16px;
line-height: 1em;
transition: all .3s;
width:100%;
}


.form-overlay-set .input-set input:focus{outline:none; box-shadow: unset; border-color:var(--primary-bright)!important;}

.form-overlay-set .input-wrap{    display: flex;
    align-items: center;
    justify-content: space-between; gap:20px;}

.form-overlay-set .submit-btn{cursor:pointer;     border-color: var(--primary-bright)!important;
background-color: var(--primary-bright);
color: var(--white);
margin-left: auto;
margin-right: auto;  font-family: "Lato", sans-serif!important;     transition: all .3s;}

.form-overlay-set .input-set{width:100%; display:flex;}
.form-overlay-set .submit-btn:hover{    background-color: var(--white)!important;
color: var(--primary-dark)!important;}
/**end of popup css cart**/



/***scroll Animation css***/


/*.reveal {
  opacity: 0;
  transform: translateY(50px);
  transition: all 0.9s ease;
}
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}


.zoom-in {
  opacity: 0;
  transform: scale(0.7);
  animation: zoomIn 1s ease forwards;
}

.delay {
  animation-delay: 0.3s;
}
.delay2 {
  animation-delay: 0.6s;
}*/

@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale(0.7);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}


.scroll-anim {
  transition: transform 0.2s ease-out; /* smooth movement */
  will-change: transform;
}

/***end of scroll Animation css***/

.mobile-navber{display:none;}


/***responsive css***/



@media screen and (min-width: 1280px) {
/*.slide-content h1 {
font-size: 80px;
}*/

.section-title-wrapper {
margin-bottom: 80px;
}

.two-column-wrapper {
grid-column-gap: 100px;
}
.services-side-image{width:500px;}
.bg-image-left-line {
top: -9%;
}
.home-1-team-image {
height: 380px;
}

.testimonial-title{width:85%;}

.title-testimonials {
padding-right: 60px;
}

.contact-block {
padding-left: 40px;
padding-right: 40px;
}

.blog-item {
width: 23.07%;
}

.home-blog-image {
height: 340px;
}


}

@media only screen and (min-width:1200px) and (max-width:1299px) {
  .nav-container-main {
    max-width: 1140px !important;
  }

  h3{font-size:28px;}
}




@media only screen and (min-width:1100px) and (max-width:1199px) {
  .nav-container-main {
    max-width: 1080px !important;
  }

  h3{font-size:28px;}
}


@media only screen and (min-width:1025px) and (max-width:1099px) {
  .nav-container-main {
    max-width: 1010px !important;
  }

  h3{font-size:28px;}
}




@media only screen and (min-width:992px) and (max-width:1024px) {
  .nav-container-main {
    max-width: 980px !important;
  }
   h3{font-size:28px;}
}


@media only screen and (min-width:901px) and (max-width:991px) {
  .nav-container-main {
    max-width: 890px !important;
  }
   h3{font-size:28px;}
}

/*new-website*/
@media (max-width: 1024px){
 .nav-menu-main a{
    font-size: 14px;
 }
.nav-link-main{
    padding: 5px;
}
h1{
    font-size: 40px;
}

.hero-text p{
  font-size: 16px;   
}
 .contact-info-bar {
    padding: 50px 3%;
    
}
.Excellence-sec, .infrastructure,  .next-sec, .main-about{
 padding: 50px 3%;   
}

.Excellence-sec .full-section span {
    font-size: 20px;
    
}
.icon{
    width: 40px;
    height: 40px;    
}
.icon i {
    font-size: 20px;
}
.footer{
     padding-top: 40px;
    padding-bottom: 30px;   
}
.footer-logo{
      margin-bottom: 30px;
    padding-bottom: 30px;  
}
.footer-info ul{
      margin: 20px 0px 30px;  
}
.nav-left.col-30 {
    font-size: 18px;
   
}
.Partner-sec .about-left h2, .Excellence-sec .about-middle h2,
.about-right h2 {
    font-size: 30px;
 
}
.slider {
    height: 80vh;
}
.main-head{
    font-size: 40px;
}
.primary-button, .button-about a{
    padding: 12px 30px;
}
.nav-container-main{
    padding: 15px 0px;
}
.nav-left.col-30 a {
    font-size: 12px;
}
.about-container {
    gap: 50px;
}
.Mission-sec, .Vision-sec{
    padding: 30px 15px;
}
.Mission-sec p, .Vision-sec p {
    font-size: 16px;
}
.core-sec li b {
    font-size: 18px;
}
.about-container-new .about-right.col-50 {
    padding: 60px 40px;
}
.info-box{
    width: 23.33%;
}
.info-text .title{
    font-size: 22px;
}

.info-text .detail {
  font-size: 16px;  
}
.boxes {
    margin-left: 15px;
    margin-right: 15px;
    padding: 5px;
  
}
}



/*end*/


/* Sidebar for mobile */
@media (max-width: 900px) {

.mobile-navber{display:block;}

.mobile-hide{display:none;}


.brand-main{position:unset;         margin-right: auto;}
.scrolled .mobile-toggle span{
    background-color:var(--primary-dark);
}

    .nav-container-main {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 20px;
        padding-right: 20px;
    }
.brand-main img {
  width: 120px;
}
    .nav-left.col-30 {
        font-size: 15px;
        color:#454456;
    }
.nav-menu-wrapper-main {
  display: flex;
  gap: 25px;
  transition: transform 0.4s ease;
  justify-content:unset!important;
}
.nav-link-main {
  color:var(--primary-dark)!important;
  text-decoration: none;
  padding:0px;
}
.nav-menu-main{align-items:unset;         flex-direction: column;}

/* Dropdown */
.nav-dropdown {
  position: relative;
}
.nav-dropdown-toggle {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  color:var(--primary-dark);
}
#mobile-menu .mobile-branding{display:inline-block;}
#mobile-menu .mobile-branding img{    filter: invert(100%);}
.nav-dropdown-list {
  display: none;
  position: unset;
  border:0px;
  background-color:transparent;
  padding: 10px 0;
  border-radius:0px;
}


#mobile-menu .nav-left{
    color: #fff;
}

#mobile-menu .nav-menu-main a{
    color: #fff!important;
}
.nav-dropdown-list a {
  display: block;
  color:var(--primary-dark);
  padding: 8px 0px;
  text-decoration: none;
}
.nav-dropdown:hover .nav-dropdown-list {
  display: block;
}

/* --- MOBILE MENU ANIMATION --- */
.nav-menu-wrapper-main {
  position: fixed;
  top: 0;
  left: -100%; /* hidden by default */
  width: 100%;
  max-width:100%;
  height: 100vh;
  background:#454456; /* dark bg */
  color: #fff;
  z-index: 9999999;
  transition: left 0.4s ease;
  display: flex;
  flex-direction: column;
  padding: 2rem;
  overflow-y: auto;
}

/* menu open */
.nav-menu-wrapper-main.open {
  left: 0;
}

/* --- HAMBURGER ICON --- */
.mobile-toggle {
  width: 30px;
  height: 22px;
  cursor: pointer;
  position: relative;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.3s ease;
}

.mobile-toggle span {
  display: block;
  height: 3px;
  background: #454456;
  border-radius: 3px;
  transition: all 0.3s ease;
}

.close-menu{color:#fff; font-size:35px; text-align:right;         position: absolute;
        right: 20px;}
.arrow1 {
        border: 1px solid var(--primary-dark);
        border-top: 0px;
        border-left: 0px;}

.mega-menu-wrap {
    display: flex;
    flex-wrap: wrap;
            overflow-x: scroll;
        height: 35vh;
}
.card-wrap{margin-top:10px; margin-right:30px;}
.mega-menu-wrap .mega-col {
    width: 100%;
    padding: 0px 10px;
}
.mega-menu {
    width: 100%;
    margin-left: 0px;
}

.arrow {
    z-index: 999999;}

.footer-link-wrap{text-align:center;}
.footer-link-wrap h5{text-align:center;}
.blog-list {
    grid-column-gap: 10px;}

}

@media only screen and (min-width:768px) and (max-width:880px){
        .Excellence-sec .full-section span {
        font-size: 18px;
    }
    .Excellence-sec .full-section .col-25, .Excellence-sec .full-section .col-50 {
    padding: 15px 10px;
  
}
.Excellence-sec .Step-sec, .Excellence-sec .Global-sec {
    padding-top: 20px;
}
.footer-sec div {
    font-size: 24px;
    
}
.footer-info i {
    font-size: 25px;

}
.info-box {
    width: 48%;
}
.hero {
    padding: 50px 5%;
    min-height: 50vh;
}
.boxes {
    margin-left: 15px;
    margin-right: 15px;
    padding: 5px;
  
}
}


@media (max-width: 768px){  
.about-left.col-50, .about-right.col-50 {
    width: 100%;
}
.about-container{
    gap:30px;
}
}



@media screen and (max-width: 767px) {
.flex{display: block;}
.navbar-fixed{position: static; background: rgb(255 255 255);}
.main-features-wrapper {grid-template-columns: 1fr;}
.home-features{flex-wrap:wrap; gap:0px;}
.footer-wrapper{flex-wrap:wrap;}
.footer-wrapper .logo-col{width:100%!important;}
.footer-wrapper .footer-col{width: calc(100% / 2);}
.footer-wrapper .footer-info ul{justify-content:center!important;}
.footer-wrapper .footer-info h5{text-align:center!important;}
.footer-wrapper .footer-info p{text-align:center;}
.footer-wrapper .footer-info{width:100%!important; align-items:unset;}
.footer-bottom-wrapper{justify-content:center;}
.blog-item { width: 100%;}
.home-1-team-wrapper{ flex-wrap:wrap;}
.home-1-team-item{        width: 100%;
        margin-bottom: 30px !important;
        margin-top: 0px !important;}
.two-column-wrapper{flex-wrap:wrap;}
.one-col {width: 100%;}
.two-col {width: 100%;}
.membership-right {text-align: center;align-items: center;}
h2{font-size:36px;}

.pb-130 {
    padding-bottom:60px;
}
.pt-130 {
    padding-top: 60px;
}
.home-features-grid-item{width:50%;     padding-left: 5px;
    padding-right: 5px;         margin-bottom: 30px;}
.home-numbers{font-size:50px;margin-bottom: 20px;}
.col-38 {width: 100%;}
.twomebemer-set .membership-right {text-align: center;align-items: center;}
.col-62{width:100%;}
.container{max-width:100%; width:100%;}
.testimonials-wrap{flex-wrap:wrap;}
.title-testimonials{text-align:center; align-items:center; width:100%;}
.testimonial-title{text-align:center;}
.title-testimonials {
border-bottom: 1px solid #332d2833; border-right:0px; padding-bottom: 30px;
margin-bottom: 50px;}
.button-wrapper-main {
margin-top: 25px;
}

.review-slider {
width: 100%!important;
}
.w-slider{margin-left:0px;}
.testimonials-review-wrap{text-align:center;}
.about-testimonial{justify-content:center;}
.slide-testimonial{padding:0px;}
.blog-content-wrapper{text-align: center;}
.services-side-image{        width: 100%;
height: 400px;
margin-top: -60px;
position: relative;}
.full-section{ display: inline-block;
}
.col-25, .col-52 {
width: 100% !important;
}

.services-title-wrapper {
align-items: center;
text-align: center; margin-top:50px; margin-bottom:0px;}
.services-wrap{padding-bottom:0px!important;}
.assymetric{flex-wrap:wrap;}
.small-wrap-38 {
    text-align: center;
}
.about-block-image-small{display:none;}
.video-block-wrapper img {
width: 100%;
height: 440px;
margin-top: 40px;
margin-bottom: 40px;}
.play-button {
width: 140px;
height: 140px; }

.video-button-big {
width: 140px;
height: 140px;
margin-bottom: 0;
}

.small-image-wrapper{margin:0px;}
.in-section-title-video-block{margin-top:0px;}
.slide-content{padding:0px 10px; width:100%;   padding-bottom:30px;}
h1{font-size:40px;}
.slide-content h1{font-size:40px;}
.slide-content p{font-size:16px;}
.arrow {
   top:unset;
    bottom: 18px;}

.Excellence-sec .full-section{
    display: block;
}
.main-head{
font-size: 30px;
}
.about-container{
display: block;
}
.button-about {
    display: block;
   text-align: center;
}
.Mission-sec, .Vision-sec{
    display: block;
}
.content-mission{
padding-left: 0px;
}
    .Mission-sec, .Vision-sec {
        padding: 20px 10px;
    }
.about-container-new{
    display: block;
}

.Excellence-sec .full-section .col-25{
    width:100%;
        margin-bottom: 20px;
        margin-left: 0px;
        margin-right: 0px;
}
.Excellence-sec .full-section .col-50 {
    width: 100%;
            margin-bottom: 20px;
  margin-left: 0px; 
     margin-right: 0px; 
}

.info-box, .about-box {
    width: 100%;
}


.about-container-new .about-right.col-50 {
        padding: 30px 20px;
    }
    .Partner-sec .about-left h2, .Excellence-sec .about-middle h2, .about-right h2 {
        font-size: 24px;
        text-align: center;
        margin-bottom: 0px;
    }
    .top-icon{
        text-align: center;
    }
.mb-35 h2 {
    margin-bottom: 10px !important;
}
    .Excellence-sec .about-middle h3{
       font-size: 22px;  
    }
.Partner-sec p, .Mission-sec, .Vision-sec, .about-right p, .next-sec h3{
  text-align: center;  
}
.main-image{
 padding-bottom: 20px;   
}

.Excellence-sec .full-section {
padding-top: 0px;
}
.Excellence-sec .Step-sec, .Excellence-sec .Global-sec {
    padding-top: 10px;
}
   
  .footer-sec div {
    font-size: 20px;
  
}
.footer-info.reveal.active p, .footer-info.reveal.active h5{
font-size: 16px;
}
.footer-info i {
    font-size: 24px;
}
.hero{
    padding-bottom: 40px!important;
}
    .nav-container-main {
        padding: 10px 10px;
        padding-right: 10px;
    }
    .Mission-sec p, .Vision-sec p{
        text-align: center;
    }
    .boxes {
    margin-left: 15px;
    margin-right: 15px;
    padding: 5px;
  
}
}
@media screen and (max-width:479px) {

.membership-image{height:340px; width:70%;}
.membership-image.two {
height: 180px;
}
.about-block-image {
height: 360px;}
.home-1-team-image {
height: 360px;
}
.bg-image-left-line {width: 50%; height: auto;inset: -2% auto 0% 0%;}
.bg-image-right-line {width: 50%; height:auto;inset: 39% 0 0% auto;}

.form-overlay-set .input-wrap {

    flex-wrap: wrap;
    justify-content: center;
}

}

.values{
    background-image: url(../images/service.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-color: rgb(0 0 0 / 10%);
}
.project-card{
    transition: all 0.5s ease;
    position: relative;
  overflow: hidden;
}
.project-card::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    0deg, 
    transparent, 
    transparent 30%, 
    rgba(0,255,255,0.3)
  );
  transform: rotate(-45deg);
  transition: all 0.5s ease;
  opacity: 0;
}

.project-card:hover {
  transform: scale(1.05);
  box-shadow: 0 0 20px rgba(0,255,255,0.5);
}

.project-card:hover::before {
  opacity: 1;
  transform: rotate(-45deg) translateY(100%);
}

.project-card .image {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.project-card .main-content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px;
        height: 100%;
    padding: 50px;
}
.project-card .main-content .main-content-wrapper {
    width: 100%;
    text-align: center;
    padding: 0px;
    visibility: visible;
    overflow: hidden;
    opacity: 1;
    transition: all 0.5s ease-out;
}
.project-card .main-content .main-content-wrapper .title {
    font-size: 24px;
    font-weight: 700;
    line-height: 30px;   
    margin-bottom: 0;
    transition: all 0.5s ease-out;
}
.project-card .main-content .main-content-wrapper{
    position: relative;
    padding: 40px;
    height: 100%;
    display: inherit;
    top: 40%;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.content-inner{
    background: rgb(6 55 96 / 60%);
    padding: 17px;
    color: #fff;
    text-align: center;
}
.content-inner a{color: #fff;}
.project-card:hover .main-content .main-content-wrapper .content-inner {
    transform: translateY(0%);
    transition: all 0.5s ease-out;
}
.project-card .main-content .main-content-wrapper .content-inner {
    transform: translateY(100%);
    transition: all 0.5s ease-out;
}

/********* Our Certificates CSS Start *************/
.container .card .icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #2c73df;
}

.container .card .icon .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 80px;
    color: #fff;
}

.container .card .slide {
    width: 300px;
    height: 200px;
    transition: 0.5s;
}

.container .card .slide.slide1 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    transition: .7s;
    transform: translateY(100px);
}

.container .card:hover .slide.slide1{
    transform: translateY(0px);
}

.container .card .slide.slide2 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
    transition: .8s;
    transform: translateY(-100px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}

.container .card:hover .slide.slide2{
    transform: translateY(0);
}

.container .card .slide.slide2::after{
    content: "";
    position: absolute;
    width: 30px;
    height: 4px;
    bottom: 15px;
    left: 50%;
    left: 50%;
    transform: translateX(-50%);
    background: #2c73df;
}

.container .card .slide.slide2 .content p {
    margin: 0;
    padding: 0;
    text-align: center;
    color: #414141;
}

.container .card .slide.slide2 .content h3 {
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 24px;
    text-align: center;
    color: #414141;
} 
/********* Our Certificates CSS Start *************/

/***end of responsive css***/




/******* Social Icons  Start ************/
.fa {
  padding: 20px;
  font-size: 30px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-twitter {
  background: #55ACEE;
  color: white;
}
.fa-youtube {
  background: #bb0000;
  color: white;
}

.fa-instagram {
  background: #125688;
  color: white;
}

.fa-phone {
  background: #2c4762;
  color: white;
}
.fa-map-marker{
    background: #04a12d;
    color: white;
}
.fa-envelope-o {
  background: #00b489;
  color: white;
}
/******* Social Icons  End ************/


.departments{
    .card{
        margin:10px;
        border: none;
    }
 .card .icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #2c73df;
    }

.card .icon .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 80px;
    color: #fff;
    }

.card .slide {
    width: 350px;
    height: 250px;
    transition: 0.5s;
    }

.card .slide.slide1 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    transition: .7s;
    transform: translateY(100px);
    }

 .card:hover .slide.slide1{
    transform: translateY(0px);
    cursor: pointer;
    }
.card .slide.slide2 {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
    transition: .8s;
    transform: translateY(-100px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
    }

.card:hover .slide.slide2{
    transform: translateY(0);
    }

 .card .slide.slide2::after{
    content: "";
    position: absolute;
    width: 30px;
    height: 4px;
    bottom: 15px;
    left: 50%;
    left: 50%;
    transform: translateX(-50%);
    background: #2c73df;
    }

.card .slide.slide2 .content p {
    margin: 0;
    padding: 0;
    text-align: center;
    color: #414141;
    }

 .card .slide.slide2 .content h3 {
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 24px;
    text-align: center;
    color: #414141;
    } 
}