/* end */
.animate-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

 .animate {
  opacity: 0;
  transition: opacity 0.8s ease;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
	height:650px;
}
.animate section{
    height:650px;
}

.animate.active {
  opacity: 1;
  position: relative;
  
}
#animateBtn {
  margin-bottom: 20px;
}

.image-wrapper {
  position: relative;
  height: 400px;
}

.img {
  position: absolute;
  width: 150px;
  height: 150px;
  object-fit: cover;
 transition: all 1s ease-in-out;
  transform: scale(1);
}


/* New zoom states */
.zoom-in {
  transform: scale(1.5);
}

.zoom-out {
  transform: scale(1);
}

/* Triangle layout */
#img1 {
  top: -54px;
  left: 301px;
}

#img2 {
  top: 212px;
  left: 334px;
  opacity:0.4 !important;
}

#img3 {
  top:151px;
  left: 50px;
	opacity:0.4 !important;
}

.zoom {
  transform: scale(1.5);
}
.sec .widget-image-caption{padding-top:28px !important;}


#next-btn {
    display: block;
    margin: 20px auto;
    padding: 10px 20px;
    font-size: 16px;
    position: absolute;
    z-index: 99;
    right: 42px;
    top: 413px;
    background: transparent;
    border: 0px solid;
}


.slide-container {
  background-color: lightblue;
  position: relative;
  transition: transform 0.5s ease, background-color 0.5s ease;
}

/* Slide effect class */
.slide-active {
  transform: translateX(200px);
  background-color: lightcoral;
}

.mob1, .mob2, .mob3{
    display:none;
}



/*------------------*/


.container {
      text-align: center;
      position: relative;
    }

    #animateBtn {
      /*margin-bottom: 20px;*/
    }

    .image-wrapper {
      position: relative;
      height: 600px;
    }

    .img {
      position: absolute;
      width: 150px;
      height: 150px;
      object-fit: cover;
      transform: scale(1);
      opacity: 0.5;
      z-index: 1;
    }

  #next-btn {
      display: block;
    margin: 20px auto;
    padding: 10px 20px;
    font-size: 16px;
    position: absolute;
    z-index: 99;
   right: 42px;
    top: 413px;
    background: transparent;
    border: 0px solid;
    }
    .img {
      position: absolute;
      width: 150px;
      height: 150px;
      object-fit: cover;
      transition: all 1s ease;
    }

    .left-img-in {
      width: 400px !important;
      z-index: 2;
      opacity:1 !important;
    }

    .zoom-out-fast {
      width: 150px !important;
      z-index: 1;
    }

    /* Jump animation */
    .jump {
      animation: jumpMove 0.5s ease-out;
    }

    @keyframes jumpMove {
      0% {
        transform: translateY(0);
      }
      30% {
        transform: translateY(-20px);
      }
      100% {
        transform: translateY(0);
      }
    }
    
    .health-hero-moves{
    padding:0px;
}

.spotlight-next-btn-cls{
    height:0px;
}
    @media(min-width:1100px) and (max-width:1300px){
        #img2{
            top: 61px ;
            left: 463px ;
        }
        #img1{
            top: 0px ;
            left: 0px ;
        }
          #img3{
           top: 358px ;
         left: 455px;
        }
       .move-this-section{
           /*overflow:hidden;*/
           right:70px;
           top:20px;
       }
    }
    
   
    
   
    
    @media(max-width:1024px){
        .three-img-html{
            margin-top:-740px;
        }
         .insert-after-content{
        padding-bottom:450px;
    }
        .animate{
            height:1000px;
            background-position:center;
            
        }
        .animate:not(.animate.active){
            display:none;
        }
        
        .animate section{
          height:1000px;
            background-position:center;
        }
        
        .left-img-in {
    width: 340px !important;
   
}

#next-btn {
    display: block;
    margin: 20px auto;
    padding: 10px 20px;
    font-size: 16px;
    position: absolute;
    z-index: 99;
    right: unset;
    left: 100px;
        top: 568px;
    background: transparent;
    border: 0px solid;
}



    }
    
      @media(max-width:991px){
          
          .img.zoom-out-fast{
              display:none;
          }
           .move-this-section .image-wrapper #img1{
            
             top:60px !important;
         } 
         .insert-after-content{
        padding-bottom:415px;
    }

      }
       @media(max-width:768px){
            .animate{
            height:1040px;
            background-position:center;
            
        }
            .animate section{
          height:1040px;
            background-position:center;
        }
          
         .three-img-html{
            margin-top:-700px;
        }
         .insert-after-content{
        padding-bottom:450px;
    }
        
           .move-this-section .image-wrapper #img1 {
        top: 10px !important;
    }
        
        
    .left-img-in {
        width: 340px !important;
        left: 131px !important;
    }
   
          

      }
      
       @media(max-width:680px){
          
         .three-img-html{
            margin-top:-680px;
        }
         .insert-after-content{
        padding-bottom:400px;
    }
        
      
    .left-img-in {
        width: 340px !important;
        left: 131px !important;
    }
         
         
         .move-this-section .image-wrapper #img3{
             height:400px;
             object-fit:contain;
         } 
         .move-this-section .image-wrapper #img2{
             height:400px;
             object-fit:contain; 
         } 
         
           .animate{
            height:1000px;
            background-position:center;
            
        }
            .animate section{
          height:1000px;
            background-position:center;
        }

      }
      
      
       @media(max-width:572px){
          
         .three-img-html{
            margin-top:-650px;
        }
         .insert-after-content{
        padding-bottom:380px;
    }
        
      
    .left-img-in {
        width: 340px !important;
        left: 131px !important;
    }
    
      .animate{
            height:1050px;
            background-position:center;
            
        }
            .animate section{
          height:1050px;
            background-position:center;
        }
   
          
      }
      
      
       @media(max-width:480px){
          
         .three-img-html{
            margin-top:-920px;
        }
         .insert-after-content{
       padding-bottom: 410px;
    }
        
         .animate{
            height:1330px;
            
            background-position:center;
        }
         .animate section{
         height:1330px;
        background-position:center;
        }
      
    .left-img-in {
        width: 340px !important;
        left: 72px !important;
    }
    
    #next-btn{
        left:50px;
        top:670px;
    }  
    
    
    
    .health-hero-moves{
      display: grid;
    grid-template-columns: repeat(2, 2fr)!important;
    }

 .health-hero-moves .sec, .health-hero-moves .secc2{
       display:block !important;
    }
    
    .move-this-section .image-wrapper #img1 {
        top: 50px !important;
    }
    
      }
      
        @media(max-width:420px){
          
         
         .insert-after-content{
        padding-bottom:380px;
    }
        
         
      
    .left-img-in {
       width: 290px !important;
        left: 60px !important;
    }
    
       

 #next-btn img{
        width:70%;
    } 
    
    
    .move-this-section .image-wrapper #img3{
             height:400px;
             object-fit:contain;
         } 
         .move-this-section .image-wrapper  .left-img-in {
            
             top:50px !important;
         } 
         
             .move-this-section .image-wrapper #img1 {
        top: 90px !important;
    }
         
      }
      
        @media(max-width:380px){
             
              .three-img-html{
            margin-top:-850px;
        }
             .insert-after-content{
        padding-bottom:350px;
    }
           .left-img-in {
       width: 290px !important;
        left: 20px !important;
    } 
   
     #next-btn{
        left:50px;
        top: 760px;
    } 
    
        .animate section {
        height: 1300px;
        background-position: center;
    }
    
    .move-this-section .image-wrapper #img2.left-img-in {
        top: 90px !important;
    }
    
    .move-this-section .image-wrapper #img3.left-img-in {
        top: 10px !important;
    }
        }
        
          @media(max-width:320px){
                .left-img-in {
       
        left: 10px !important;
    } 
             
              .three-img-html{
            margin-top:-800px;
        }
             .insert-after-content{
        padding-bottom:340px;
    }
         
         .insert-after-content .elementor-widget-container p{
             font-size: 14px;
         }
    
        .move-this-section .image-wrapper #img1 {
        top: 10px !important;
    }
        }