img {
  max-height: 100%;
}

/* Media query for phones */
@media (max-width: 767px) {
  /* Set max height for all images on phones */
  img {
    max-height: 100vh;
  }
}
.imagediv img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
@media only screen and (max-width: 767px) {
  .imagediv img {
    height: auto;
  }
}

.frontdiv h4{
   text-align: center;
   font-weight: bold;
   width: 100vw;
}

.soc{
    margin-left: 30px;
}
.testimonialscontainer{  
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;     
}
.contactuscontainer{
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;   
}
.aboutcontainer{  
    background-color: #99ffe6;
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
  
}
.newscontainer{  
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    /* min-height: 500px;   */
}
.mydiv{  
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    min-height: 500px;
   
}

  .carousel h3{
      color:blue;
      margin-bottom: 50px;
      bottom: 0;
      top: 0;
      left: 0;
      right: 0;
      z-index: 10;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
  } 
  .carouselimg {
    width:100%;
    height:370px;
    object-fit:cover;
    object-position: 50% 50%;
  }
  .aboutimage{
    border-radius: 25%;
    object-fit:cover;

}

/* this is the css for div of images and content of news on home page */
.contentss{
    border: 1px solid #50d8af;
    padding: 4px; 
    margin-bottom: 10px;
    margin-left: 5px;
    margin-right: 5px;
    width: auto;
}
.contentss h4{
    text-align: center;
}
.imageonblog:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
    /*animation: shake 2.1s;*/
    /* When the animation is finished, start again */
    /*animation-iteration-count: infinite;*/
       transform: scale(1.10);
}
.imageonblog{
    object-fit:cover;
    transition: transform 1s;
    border-radius: 5px;
    max-height: 400px;
    object-position: 50% 50%;
    margin-top: 10px;
}
.imageonblogone{
    margin-bottom: 2px;
    object-fit:cover;
    border-radius: 5px;
    max-height: 400px;
   width: 100px;
    margin-top: 20px;
    object-position: 50% 50%;
}

.galleryimage{
    object-fit: contain;
    border-radius: 5px;
    max-height: 400px;
    object-position: 50% 50%;
    margin-top: 10px;
    width:100%;
}
.galleryimages{
    margin-bottom: px;
    object-fit:cover;
    border-radius: 5px;
    max-height: 400px;
    max-width:250px;
    margin-top: 10px;
}

/*.gallery > img {*/
/*  grid-area: 1/1;*/
/*  width: 100%;*/
/*  aspect-ratio: 1;*/
/*  object-fit: cover;*/
/*  border: 10px solid #f2f2f2;*/
/*  box-shadow: 0 0 4px #0007;*/
/*  animation: slide 600s infinite;*/
/*}*/

/*.gallery > img:nth-child(2) { animation-delay: -2s; } */
/*.gallery > img:nth-child(3) { animation-delay: -4s; }*/
/*.gallery > img:nth-child(4) { animation-delay: -6s; }*/
/*.gallery > img:nth-child(5) { animation-delay: -8s; }*/
/*.gallery > img:nth-child(6) { animation-delay: -10s; }*/
/*.gallery > img:nth-child(7) { animation-delay: -12s; }*/
/*.gallery > img:nth-child(8) { animation-delay: -14s; }*/

/*@keyframes slide {*/
/*  0%     {transform: translateX(0%)  ;z-index: 2;}*/
/*  16.66% {transform: translateX(120%);z-index: 2;}*/
/*  16.67% {transform: translateX(120%);z-index: 1;} */
/*  33.34% {transform: translateX(0%)  ;z-index: 1;}*/
/*  66.33% {transform: translateX(0%)  ;z-index: 1;}*/
/*  66.34% {transform: translateX(0%)  ;z-index: 2;} */
/*  100%   {transform: translateX(0%)  ;z-index: 2;}  */
/*}*/


.imagesonblogleft{
    object-fit:cover;
    max-height: 250px;
    max-width: 300px;
    float: left;
    margin-top: 10px;
}

.imagesonblogright{
    object-fit:cover;
    max-height: 250px;
    max-width: 300px;
    float: right;
    margin-top: 10px;
}

.blogimageone{
    margin-bottom: 2px;
    height:100%; 
    width:100%;
    object-fit:cover;
    border-radius: 10px;
    max-height: 250px;
    object-position: 50% 50%;
}


@keyframes shake {
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 3px) rotate(0deg); }
    40% { transform: translate(2px, -1px) rotate(1deg); }
}
/*end---*/
.readmore{
    padding: 3px;
  
}

/* 
//this is the style for projects pages */
/* The hero image */
body, html {
    height: 100%;
}
.hero-imageone {
    /* The image used */
    /* Set a specific height */
    height: 400px;
    /* Position and center the image to scale nicely on all screens */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}

/* Place text in the middle of the image */
.hero-text h1 {
    text-align: center;
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 30px;
    text-transform: uppercase;
}
img{
    object-fit:cover;  
}
.blogimage{
    margin-bottom: 2px;
    height:100%; 
    width:100%;
    object-fit:cover;
    border-radius: 10px;
    max-height: 400px;
    object-position: 50% 50%;
}
.blogimage:hover {
    /* Start the shake animation and make the animation last for 0.5 seconds */
    animation: shake 2.3s;
    /* When the animation is finished, start again */
    animation-iteration-count: infinite;
}
  
#footer ul{
    list-style-type:none; 
   
}
#footer li{
    display:inline;
    
}

.section-header h3 {
    font-size: 15px;
    color: #18d26e;
    text-transform: uppercase;
    font-weight: 700;
    position: relative;
    padding-bottom: 5px;
  } 

  .mysection-header h2{
    font-size: 25px;
    color: black;
    font-weight: 900;
    position: relative;
    padding-bottom: 5px;
  } 
  
    .mysection-header h5{
    font-size: 20px;
    font-weight: 900;
    position: relative;
    padding-bottom: 2px;
  } 


  .mysectiontwo-header h2{
    font-size: 25px;
    color: #18d26e;
    font-weight: 900;
    position: relative;
    text-transform: uppercase;
    padding-bottom: -2px;
    padding-top: 5px;
  } 
 
/* each testimonial*/
.centertestimony{
    margin: auto;
    width: 90%;
    border: 1px solid #18d26e;
    padding: 10px;
    margin-top: 15px;
  } 

.testimonialimage{
    border-color: #18d26e;
    width: 200px;
    height: 300px;
    border: 1px solid #18d26e;
    margin: 3px;
    text-align: center;

}
.left-quote{
    margin-bottom: 1px;
}
.centertestimony p{
    margin-top: 0px;
}
.mycontainerone{
    background-repeat:no-repeat ;
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    min-height: 500px;
    /*color: white;*/

}
.blogimage{
    object-fit:cover;
    max-height: 350px;
    object-position: 50% 50%;
    margin-top: 3px;
}
.mypostimage{
    object-fit:cover;
    max-height: 350px;
    object-position: 50% 50%;
    margin-top: 3px;
}
.leftclass{
    object-fit:cover;
    float: left;
     margin-bottom: px;
    object-fit:cover;
    border-radius: 5px;
    max-height: 400px;
    object-position: 50% 50%;
    margin-top: 10px;
}
.rightclass{
    object-fit:cover;
    max-height: 350px;
    width: auto;
    float:right;
}