@import url(../css/footer.css);

:root {
    --primary-font1:'Outfit', sans-serif;
    --primary-font2:'Cinzel', serif;
    --primary-font3:'Cinzel Decorative', serif;
    --primary-font4:'Lato', sans-serif;
    --primary-color1: #666666;
    --primary-color2: #000000;
    --primary-color3: #426478;
    --primary-color4: #D06060;
	--primary-color5: #BFCFD9;
    --primary-color6: #0A78B7;
    --primary-color7: #F2CB04;
    --font12:12px;
    --font13:13px;
    --font16:16px;
    --font18:18px;
    --font20:20px;
    --font22:22px;
    --font24:24px;
    --font26:26px;
    --font28:28px;
    --font30:30px;
    --font36:36px;
    --font38:38px;
    --font40:40px;
    --font42:42px;
    --font45:45px;
    --font48:48px;
}





html {
  scroll-behavior: smooth;
}
body[data-aos-duration='225'] [data-aos],
[data-aos][data-aos][data-aos-duration='225']{
  transition-duration: 225ms;
}
body{padding:0px;margin:0px;font-family:var(--primary-font1);font-size:var(--font13);color: var(--primary-color1);background:#fbfaf8;line-height: 21px;}
ul{padding:0px; list-style: none;}
.title_head{font-size:var(--font18);color:var(--primary-color3); }
blockquote{font-size:var(--font30);color:var(--primary-color2);font-family:var(--primary-font2); line-height: 36px;  }
.streched_link{display: inline-block; text-indent:-99999px; position: absolute; left:0; right:0; top:0; bottom:0;}
figure{margin:0px;}
figure img{width:100%;}
a.navbar-brand{color:#fff;padding: 0;}
a.navbar-brand svg {fill: currentColor;transition: .2s ease; height:96px;}
header.inner-header a.navbar-brand {
  color: #0066A8;
}
a{text-decoration:none;}
@media (min-width: 992px){
.navbar-expand-lg {padding: 25px 0 0;transition: .2s ease;}
.mobile-video{display: none;}
.desktop-video{display: block;}
}

@media (max-width:990px) {
a.navbar-brand svg {fill: currentColor; width: 70px;}
a.navbar-brand{margin:auto;color:#004770;padding: 0;}
.mobile-video{display: block;}
.desktop-video{display: none;}

}


@media (min-width:1920px) {

  a.navbar-brand svg {fill: currentColor;transition: .2s ease; height:120px;}
 body header.sticky a.navbar-brand svg {
    width: 80px;}
  
}


.reveal-image,
.reveal-image:after {
  position: absolute;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-duration: 1600ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}


.reveal-image2,
.reveal-image2:after {
  position: absolute;
  animation-delay:.1s;
  animation-iteration-count: 1;
  animation-duration:1800ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}


.certificate-1 .reveal-image2,
.certificate-1 .reveal-image2:after {

  animation-delay:.1s;
  animation-iteration-count: 1;
  animation-duration:2800ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.about-2 .col-md-3:nth-child(2) .reveal-image2,
.about-2 .col-md-3:nth-child(2) .reveal-image2:after {
  animation-delay:.2s;
  animation-iteration-count: 1;
  animation-duration:1800ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.product_panel .image2, .our-capable-box .image, .we_text_box1 .image, .we-care-box2 .image {
  opacity: 0;
}

.product_panel img.image2.img-fluid.reveal-image2, .our-capable-box img.image.img-fluid.reveal-image,
.we_text_box1 img.image.reveal-image, .we-care-box2 img.image.reveal-image {opacity:1;}

 .home_our_product .col-md-4:nth-child(1) .reveal-image2,
.home_our_product2 .col-md-4:nth-child(1) .reveal-image2:after {
  animation-delay:.22s;
  animation-iteration-count: 1;
  animation-duration:2500ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}
 .home_our_product .col-md-4:nth-child(2) .reveal-image2,
.home_our_product2 .col-md-4:nth-child(2) .reveal-image2:after {
  animation-delay:.23s;
  animation-iteration-count: 1;
  animation-duration:2800ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

 .home_our_product .col-md-4:nth-child(2) .reveal-image2,
.home_our_product2 .col-md-4:nth-child(2) .reveal-image2:after {
  animation-delay:.24s;
  animation-iteration-count: 1;
  animation-duration:3200ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}





 .home_our_product2 .col-md-4:nth-child(2) .reveal-image2,
.home_our_product2 .col-md-4:nth-child(2) .reveal-image2:after {
  animation-delay:.22s;
  animation-iteration-count: 1;
  animation-duration:2500ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}


.home_our_product2 .col-md-4:nth-child(3) .reveal-image2,
.home_our_product2 .col-md-4:nth-child(3) .reveal-image2:after {

  animation-delay:.25s;
  animation-iteration-count: 1;
  animation-duration:3000ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
} 

.our-capablitites .col-md-6:nth-child(2)  .reveal-image,
.our-capablitites .col-md-6:nth-child(2) .reveal-image:after {

  animation-delay:.21s;
  animation-iteration-count: 1;
  animation-duration:2000ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}
.our-capablitites .col-md-6:nth-child(3)  .reveal-image,
.our-capablitites .col-md-6:nth-child(3) .reveal-image:after {

  animation-delay:.22s;
  animation-iteration-count: 1;
  animation-duration:2500ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.our-capablitites .col-md-6:nth-child(4)  .reveal-image,
.our-capablitites .col-md-6:nth-child(4) .reveal-image:after {

  animation-delay:.23s;
  animation-iteration-count: 1;
  animation-duration:2800ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
} 



.Products-2 .col-md-4:nth-child(2)  .reveal-image2,
.Products-2 .col-md-4:nth-child(2) .reveal-image2:after {

  animation-delay:.2s;
  animation-iteration-count: 1;
  animation-duration:2000ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}


.Products-2 .col-md-4:nth-child(3)  .reveal-image2,
.Products-2 .col-md-4:nth-child(3) .reveal-image2:after {

  animation-delay:.22s;
  animation-iteration-count: 1;
  animation-duration:2500ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}
.MECTECH-OWN-LABEL .col-md-3 .reveal-image2,
.MECTECH-OWN-LABEL .col-md-3 .reveal-image2:after {

  animation-delay:.25s;
  animation-iteration-count: 1;
  animation-duration:2200ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

.MECTECH-OWN-LABEL .col-md-6:nth-child(2) .reveal-image2,
.MECTECH-OWN-LABEL .col-md-6:nth-child(2) .reveal-image2:after {

  animation-delay:.25s;
  animation-iteration-count: 1;
  animation-duration:2200ms;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}


.reveal-image {
  opacity: 1;
  position: relative;
  animation-name: reveal-image;
}




.reveal-image2 {
    opacity: 1;
    position: relative;
    animation-name: reveal-image2;
  }

@keyframes reveal-image {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}


@keyframes reveal-image2 {
    from {
      clip-path: inset(100% 0% 0 0);
    }
    to {
      clip-path: inset(0 0 0 0);
    }
  }


  .image-container {
    position: relative;
    overflow: hidden;
     padding-bottom: calc(50% / (var(--ratio))); 
  }

  
  .cell + .cell {
    margin-top: 20vh;
  }
  
  .image-one {
    --ratio: 100/100;
  }
  
  .image-two {
    height:100%;
  }
  
  .image-three {
    --ratio: 1080/1920;
  }
  
  .image-container img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }



 .full_image_class .grid-x.align-center,  .full_image_class .grid-container,  .full_image_class .cell.large-2 {
    height: 100%;
}



a.navbar-brand:hover {
  color: #fff;
}

.hover_img  figure img {
  width: 100%;
  transform: inherit;
  transition: .8s;
  height: 100%;
}
.hover_img:hover figure img{width: 100%;
  transform: scale(1.1);
  transition: .8s;}
.hover_img  figure{overflow: hidden;
  transform: inherit;
  width: 100%;
}
a.nav-item.nav-link:hover {
  color: #fff;
}
header.inner-header:before {
  display: none;
}

.anachor-tag {
  position: relative;
  top: -100px;
  height: 0;
  width: 1px;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transition: -webkit-transform .9s ease-in-out;
  transition: transform .9s ease-in-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.inner-container .inner-title-head blockquote{font-family:var(--primary-font1);}


.news-panel.sitemap-box ul li a {
  display: block;
  color: #000;
  margin-bottom: 5px;
}

.news-panel.sitemap-box ul li h3 {
  font-size: 21px;
  margin-bottom: 15px;
}

.news-panel.sitemap-box ul {
  margin-bottom: 29px;
}
ul.single_link li {
  margin-bottom: 24px;
  display: block;
}

.news-panel.sitemap-box .container {
  max-width: 800px;
}

.news-box-detail-content ul li {
  border-left: 2px solid #0066a8;
  padding-left: 24px;
}

.news-panel.sitemap-box ul li h3 a {
  color: #0066a8;     text-transform: uppercase;
}

.news-panel.privacy-policy{padding-bottom:70px;}
.news-panel.privacy-policy p a{color:#000;}
.news-panel.privacy-policy h2 {
  font-size: 24px;
  color: #000;
  margin: 25px 0;
}

ul.list_bullet {
  margin: 0 0 45px;
}

ul.list_bullet li {
  position: relative;
  padding: 0 21px;
  margin-bottom: 16px;
}

ul.list_bullet li:before {
  content: "";
  width: 6px;
  height: 6px;
  background: #000;
  display: inline-block;
  position: absolute;
  left: 0;
  border-radius: 50%;
  top: 7px;
}

.inner-title-head.thanku blockquote {
  font-size: 22px;
  padding: 0 150px;
  line-height: 35px;
}
.inner-title-head.thanku p {
  margin: 0 0 15px;
  font-size: 16px;
  color: #333;
}
@media (max-width:992px) {

  .news-panel.sitemap-box ul li h3 a {
    font-size: 18px;
}
.inner-title-head.thanku blockquote{padding:0 20px;}
  
}