
/* *{
  box-sizing: border-box;
} */
.meta-bnr-title{
  font-size: 35px;
  font-family: roboto;
  color: blue;
  animation: animate-meta-title 1s linear forwards;
}
@keyframes animate-meta-title{
  0%{
    transform: translateY(-20px);
    opacity: .1;
  }
  100%{
    transform: translateY(0);
    opacity: 1;
  }
}
.meta-bnr-title span{
  font-size: 25px;
  color: rgba(0, 0, 0, 0.859);
}
.meta-banner .meta-banner-img .an2{
  animation: animate2 1s ease-in forwards;

 }
 @keyframes animate2{
  0%{
    transform: translateY(50px);
    scale: .9;
  }
  100%{
    transform: translateY(0);
    scale: 1;
  }
 }
 section.meta-content{
  position: relative;
  height: auto;
  width: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  background: #e8eceb;
  padding: 20px;
  font-family: roboto;
 }
 section.meta-content .meta-explanation{
  height: auto;
  width: 80%;
  background: #e8eceb;
  font-size: 18px;
  padding-bottom: 20px;
 }
 section.meta-content .meta-explanation p{
 text-align: justify;
 color: #2a1b16;
 }

 section.meta-content .meta-with-gb{
  background: #e8eceb;
  max-height: 300px;
  width: auto;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
 }
 section.meta-content .meta-with-gb h2{
  color: #072a22;
  font-size: 25px;
  text-align: center;
 }
 section.meta-content .meta-with-gb h2 span{
  font-size: 30px;
 }
 section.meta-content .meta-with-gb p{
  width: 80%;
  color: #2a1b16;
  font-size: 18px;
  padding-bottom: 10pxpx;
  text-align: justify;
 }
 section.meta-content .meta-with-gb p span{
 color: #1d473d;
 font-size: 20px;
 font-weight: 550;
 }

 section.meta-content .about-meta-service{
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
 }
 .about-meta-service h2{
  color: #2a1b16;
  font-size: 25px;
  font-weight: 550;
  margin-bottom: 15px;
  text-align: center;
 }

 .about-meta-service .meta-service-container{
  width: 100vw;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto;
  gap: 10px;
  box-sizing: border-box;
  padding: 0 5%;
  
  
 }
 .about-meta-service .meta-services{
 
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  
 }
 .meta-services .meta-service-content{
  display: flex;
  flex-direction: column;
  align-items: center;
 
 }
 .meta-service-content p{
  text-align: justify;
  color: #2a1b16;
  padding-top: 10px;
  max-height: 0px;
  transition: max-height .3s linear;
  overflow: hidden;
 }
 .meta-services:hover p{
  max-height: 150px;
 }
 
.about-meta-service img{
  height: auto;
  width: 250px;
 }
 .about-meta-service h3{
  color: #1d473d;
  font-weight: 400;
 }


 section.meta-content .meta-imps .meta-imps-para{
  color: #2a1b16;
  font-size: 18px;
  width: 80%;
  text-align: justify;
 }
 .meta-imps-para span{
  color: #1d473d;
  font-size: 22px;
  font-weight: 550;
 }
section.meta-content .imp-msg{
  color: #2a1b16;
  width: 80%;
  font-size: 18px;
  text-align: justify;
}
section.meta-content .imp-msg span{
  color: #1d473d;
  font-size: 22px;
  font-weight: 550;
}
section.meta-content .cta-btn{
  margin-top: 15px;
  height: 50px;
  width: 25%;
  padding: 5px 30px;
  display: grid;
  place-items: center;
  background: linear-gradient(to right, #1d473d, #2a1b16);
  border-radius: 40px;
  animation: animate-cta-btn 1s alternate ease-in infinite;
}
@keyframes animate-cta-btn{
  0%{
    transform: scale(.8);
  }
  100%{
    transform: scale(1);
  }
}
section.meta-content .cta-btn a{
  color: #fff;
  font-size: 20px;
  text-decoration: none;
}

 /* =====Mobile View====== */

 @media (max-width:1024px) {
  
  
  .about-meta-service .meta-service-container{
   grid-template-columns: repeat(3, 1fr);
  }
  
}
 @media (max-width:968px) {
  
  
   .about-meta-service .meta-service-container{
    grid-template-columns: repeat(2, 1fr);
   }
   section.meta-content .cta-btn{
    width: 30%;
    padding: 0px 15px;
   
   }
   section.meta-content .cta-btn a{
    font-size: 15px;
   }
}
 @media (max-width:768px) {
  section.meta-content{
    background: #fff;
   }section.meta-content .meta-with-gb{
    background: #fff;
   }
   section.meta-content .meta-explanation{
    background: #fff;
   }
  section.meta-content .about-meta-service h2{
    font-size: 30px;
   }
   section.meta-content .cta-btn a{
    font-size: 12px;
   }

}
 @media (max-width:568px) {
  
  section.meta-content .meta-with-gb h2{
    font-size: 18px;
   }
   section.meta-content .meta-with-gb h2 span{
    font-size: 25px;
   }
   section.meta-content .about-meta-service h2{
    font-size: 20px;
   }
   .about-meta-service .meta-service-container{
    grid-template-columns: 1fr;
   }
   .meta-service-container .meta-services{
    flex: 1 1 100%;
   }
 
   section.meta-content .cta-btn{
    width: 50%;
   }

}