/* Simple colchón styling*/

.specController{
  display: none;
}
.colchones {
  margin-top:10;
}

#colchon{
  -webkit-transition: up 1s ease;
  transition: up 1s ease;
}
.pulso{display:none; opacity:0;}
#controlador {display:none;}

/* layer styling */
#colchon {
  padding-top:150px;
  position: relative;
  width: 380;
 /* margin-right: 10%;
  margin-top: 2%; */
  /* background-color: rgb(10, 10, 10); */
 /* transform: rotate(-30deg) skew(30deg) scale(0.8);  */
  /* border-radius: 30px; */
}
#colchon img {
  width: 680px;
  transition: all ease 1000ms;
  position: absolute;
  opacity:1;
}
/*.mouseScroll{
  position: absolute;
  width:100%;
  padding-top:220px;
  padding-bottom:220px;
  height:200px;
  z-index:1000;
  overflow: scroll;
  top: -105px;
  opacity: 0.001;

}  */

label:hover{
color:black;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
#controlador:checked ~ #colchon .pulso{
  display:block;
	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 3s;


}
.topClose {
    transform: translate(0px, 0px)!important;
    -webkit-transform: translate(0px, 0px)!important;
    -moz-transform: translate(0px, 0px)!important;
    -ms-transform: translate(0px, 0px)!important;
    -o-transform: translate(0px, 0px)!important;
}
.bottomClose {
  transform: translate(0px, 250px)!important;
  -webkit-transform: translate(0px, 250px)!important;
  -moz-transform: translate(0px, 250px)!important;
  -ms-transform: translate(0px, 250px)!important;
  -o-transform: translate(0px, 250px)!important;
}

#uno{top:5px; z-index:15;}
#dos{top:-1px; z-index:14;}
#tres{top:45px; z-index:13;}
#cuatro{top:35px; z-index:12;}
#cinco{top:35px; z-index:11;}
#seis{top:20px; z-index:10;}
#siete{top:20px; z-index:9;}
#ocho{top:30px; z-index:1;}
#nueve{top:20px; z-index:7;}
#diez{top:20px; z-index:6;}
#once{top:20px; z-index:5;}
#doce{top:5px; z-index:4;}


#controlador7:checked ~ #uno {
  transform: translate(0px, 270px);
  -webkit-transform: translate(0px, 270px);
  -moz-transform: translate(0px, 270px);
  -ms-transform: translate(0px, 270px);
  -o-transform: translate(0px, 270px);
  transition: opacity: 1;
}
#controlador1:checked ~ #dos { 
  transform: translate(0px, -40px);
  -webkit-transform: translate(0px, -40px);
  -moz-transform: translate(0px, -40px);
  -ms-transform: translate(0px, -40px);
  -o-transform: translate(0px, -40px);
  transition: opacity: 1;
}
 #controlador2:checked ~ #tres {
  transform: translate(0px, -40px);
  -webkit-transform: translate(0px, -40px);
  -moz-transform: translate(0px, -40px);
  -ms-transform: translate(0px, -40px);
  -o-transform: translate(0px, -40px);
  transition: opacity: 1;
}
 #controlador3:checked ~ #cuatro {
  transform: translate(0px, 0px);
  -webkit-transform: translate(0px, 0px);
  -moz-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  transition: opacity: 1;
}
 #controlador4:checked ~ #cinco {
  transform: translate(0px, 50px);
  -webkit-transform: translate(0px, 50px);
  -moz-transform: translate(0px, 50px);
  -ms-transform: translate(0px, 50px);
  -o-transform: translate(0px, 50px);
  transition: opacity: 1;
}
 #controlador5:checked ~ #seis {
  transform: translate(0px, 110px);
  -webkit-transform: translate(0px, 110px);
  -moz-transform: translate(0px, 110px);
  -ms-transform: translate(0px, 110px);
  -o-transform: translate(0px, 110px);
  transition: opacity: 1;
}
 #controlador6:checked ~ #siete {
  transform: translate(0px, 190px);
  -webkit-transform: translate(0px, 190px);
  -moz-transform: translate(0px, 190px);
  -ms-transform: translate(0px, 190px);
  -o-transform: translate(0px, 190px);
  transition: opacity: 1;
}
#controlador8:checked ~ #ocho {
  transform: translate(0px, 245px);
  -webkit-transform: translate(0px, 245px);
  -moz-transform: translate(0px, 245px);
  -ms-transform: translate(0px, 245px);
  -o-transform: translate(0px, 245px);
  transition: opacity: 1;
}
#controlador9:checked ~ #nueve {
  transform: translate(0px, 370px);
  -webkit-transform: translate(0px, 370px);
  -moz-transform: translate(0px, 370px);
  -ms-transform: translate(0px, 370px);
  -o-transform: translate(0px, 370px);
  transition: opacity: 1;
}
#controlador10:checked ~ #diez {
  transform: translate(0px, 400px);
  -webkit-transform: translate(0px, 400px);
  -moz-transform: translate(0px, 400px);
  -ms-transform: translate(0px, 400px);
  -o-transform: translate(0px, 400px);
  transition: opacity: 1;
}
 #controlador11:checked ~ #once {
  transform: translate(0px, 460px);
  -webkit-transform: translate(0px, 460px);
  -moz-transform: translate(0px, 460px);
  -ms-transform: translate(0px, 460px);
  -o-transform: translate(0px, 460px);
  transition: opacity: 1; 
}
 #controlador12:checked ~ #doce {
  transform: translate(0px, 480px);
  -webkit-transform: translate(0px, 480px);
  -moz-transform: translate(0px, 480px);
  -ms-transform: translate(0px, 480px);
  -o-transform: translate(0px, 480px);
  transition: opacity: 1;
}


#descripition{
  position: absolute;
  left:30px;
  top:200px;
}
// Tooltips
/*.tooltip {
  position: relative;
  display: none;
   
}
.tooltip:hover:after {
    background: #000;
    background: rgba(0,0,0,.8);
    top: -5px;
    color: #fff;
    content: attr(title);
    left: 0px;
    padding-left: 25px;
    padding-top: 5px;
    padding-bottom:5px;
    position: absolute;
    border-radius:15px;
    z-index: 99;
    width: 190px;
    font-size:16px;
    font-family:Poppins;
  }*/

// Pulsing button
.boton {
  background: white;
  border-radius: 100%;
  height: 30px;
  width: 30px;
  display: inline-block;
  position: absolute;
  text-align: center;
  vertical-align: middle;
  line-height: 30px;
  color: black;
}

#btn-1 {
  left: 255px;
  top: 110px;
  position: absolute;
  z-index: 99;
}

#btn-2 {
    left: 255px;
    top: 150px;
    position: absolute;
    z-index: 99;
}

#btn-3 {
    left: 255px;
    top: 200px;
    position: absolute;
    z-index: 99;
}

#btn-4 {
    left: 255px;
    top: 242px;
    position: absolute;
    z-index: 99;
}
#btn-5 {
    left: 255px;
    top: 300px;
    position: absolute;
    z-index: 99;
}
#btn-6 {
    left: 255px;
    top: 380px;
    position: absolute;
    z-index: 99;
}
#btn-7 {
    left: 255px;
    top: 470px;
    position: absolute;
    z-index: 99;
}
#btn-8 {
    left: 255px;
    top: 545px;
    position: absolute;
    z-index: 99;
}
#btn-9 {
    left: 255px;
    top: 590px;
    position: absolute;
    z-index: 99;
}
#btn-10 {
    left: 255px;
    top: 620px;
    position: absolute;
    z-index: 99;
}
#btn-11 {
    left: 255px;
    top: 650px;
    position: absolute;
    z-index: 99;
}

  
.pulso {
  background: black;
  box-shadow: inset 0 0 10px 0 black;
  position: absolute;
  text-align: center;
  vertical-align: middle;
  line-height: 20px;
  border-radius:100%;
  width:20px;
  color:white;
  font-size:14px;
  position:absolute;
  z-index:12;
}  
.pulso:before,
.pulso:after {
      content: "";
      border-radius: 100%;
      display: block;
      height: 140%;
      position: absolute;
      top: -20%;
      left: -20%;
      //right: 0;
      //bottom: 0;
      width: 140%;
      box-shadow: inset 0 0 0 1px #f49600;
      transition: all ease-in-out 300ms;
      opacity: 0
    }
  
    .pulso:nth-child(2n+1) {
      
      .pulso:before {
        animation-delay: 200ms
      }
    }
    
    .pulso:before {
      animation: pulso-long;
      animation-iteration-count: infinite;
      animation-duration: 1200ms;
      opacity: 1
    }
  
   /* .pulso:hover {
      box-shadow: inset 0 0 10px 0 grey;

        .pulso:before,
        .pulso:after {
          opacity: 1;
        }
    
        .pulso:before {
          animation: pulso-short;
          animation-iteration-count: infinite;
          animation-duration: 1000ms;
          opacity: 1;
        }
    }*/
}

@keyframes pulso-short {
    0% {
      transform: scale(1);
    }
    60% {
      transform: scale(2)
    }
    100% {
      opacity: 0;
    }
}

@keyframes pulso-long {
    0% {
      transform: scale(1)
    }
    60% {
      transform: scale(1.4)
    }
    100% {
      opacity: 0;
    }
}

 
/* card styling */
/*.card {
  background-color: #282828;
  padding: 30px;
  border-radius: 20px;
  display:none;
} */
.elementor-element.elementor-element-rw3mc6v .elementor-accordion .elementor-accordion-icon-left {
    padding-right:150px;
}
.elementor-element.elementor-element-rw3mc6v .elementor-accordion .elementor-accordion-icon-left {
    padding-right:150px;
}
/* Media Query */
@media only screen and (max-width: 767px) {
 
 .elementor-element.elementor-element-rw3mc6v .elementor-accordion .elementor-accordion-icon-left {
    padding-right:0px;
}
.elementor-element.elementor-element-rw3mc6v .elementor-widget-container {
    margin: 30px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

 .elementor-element.elementor-element-rw3mc6v .elementor-accordion .elementor-accordion-icon-left {
    padding-right:0px;
}
.elementor-element.elementor-element-rw3mc6v .elementor-widget-container {
    margin: 30px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}
  .colchones {
   /* width: 150px; */
    margin-left: -3%; 
    margin-top:-350;
  }
  
  #colchon {
    padding-top: 250px;
    }
 /* .card {
    display: none;
  } */

#uno{top:-16px; z-index:15;}
#dos{top:-20px; z-index:14;}
#tres{top:0px; z-index:13;}
#cuatro{top:0px; z-index:12;}
#cinco{top:0px; z-index:11;}
#seis{top:-10px; z-index:10;}
#siete{top:-10px; z-index:9;}
#ocho{top:10px; z-index:1;}
#nueve{top:10px; z-index:7;}
#diez{top:10px; z-index:6;}
#once{top:10px; z-index:5;}
#doce{top:0px; z-index:4;}


  
  #controlador8:checked ~ #uno {
  transform: translate(0px, 161px);
  -webkit-transform: translate(0px, 161px);
  -moz-transform: translate(0px, 161px);
  -ms-transform: translate(0px, 161px);
  -o-transform: translate(0px, 161px);
  transition: opacity: 1;
}  

 #controlador1:checked ~ #dos {
  transform: translate(0px, -40px);
  -webkit-transform: translate(0px, -40px);
  -moz-transform: translate(0px, -40px);
  -ms-transform: translate(0px, -40px);
  -o-transform: translate(0px, -40px);
  transition: opacity: 1; 
}

#controlador2:checked ~ #tres {
    transform: translate(0px, -30px);
    -webkit-transform: translate(0px, -30px);
    -moz-transform: translate(0px,-30px);
    -ms-transform: translate(0px, -30px);
    -o-transform: translate(0px, -30px);
    transition: opacity: 1;
}

#controlador3:checked ~ #cuatro {
    transform: translate(0px, -10px);
    -webkit-transform: translate(0px, -10px);
    -moz-transform: translate(0px, -10px);
    -ms-transform: translate(0px, -10px);
    -o-transform: translate(0px, -10px);
    transition: opacity: 1;
}

#controlador4:checked ~ #cinco {
    transform: translate(0px, 25px);
    -webkit-transform: translate(0px, 25px);
    -moz-transform: translate(0px, 25px);
    -ms-transform: translate(0px, 25px);
    -o-transform: translate(0px, 25px);
    transition: opacity: 1;
}

#controlador5:checked ~ #seis {
    transform: translate(0px, 65px);
    -webkit-transform: translate(0px, 65px);
    -moz-transform: translate(0px, 65px);
    -ms-transform: translate(0px,65px);
    -o-transform: translate(0px, 65px);
    transition: opacity: 1;
}

#controlador6:checked ~ #siete {
    transform: translate(0px, 110px);
    -webkit-transform: translate(0px, 110px);
    -moz-transform: translate(0px, 110px);
    -ms-transform: translate(0px, 110px);
    -o-transform: translate(0px, 110px);
    transition: opacity: 1;
}

#controlador7:checked ~ #ocho {
    transform: translate(0px, 135px);
    -webkit-transform: translate(0px, 135px);
    -moz-transform: translate(0px, 135px);
    -ms-transform: translate(0px, 135px);
    -o-transform: translate(0px, 135px);
    transition: opacity: 1;
}

#controlador8:checked ~ #nueve {
    transform: translate(0px, 210px);
    -webkit-transform: translate(0px, 210px);
    -moz-transform: translate(0px, 210px);
    -ms-transform: translate(0px, 210px);
    -o-transform: translate(0px, 210px);
    transition: opacity: 1;
}

 #controlador9:checked ~ #diez {
  transform: translate(0px, 235px);
  -webkit-transform: translate(0px, 235px);
  -moz-transform: translate(0px, 235px);
  -ms-transform: translate(0px, 235px);
  -o-transform: translate(0px, 235px);
  transition: opacity: 1; 
}

#controlador10:checked ~ #once {
    transform: translate(0px, 275px);
    -webkit-transform: translate(0px, 275px);
    -moz-transform: translate(0px, 275px);
    -ms-transform: translate(0px, 275px);
    -o-transform: translate(0px, 275px);
    transition: opacity: 1;
}
#controlador11:checked ~ #doce {
    transform: translate(0px, 300px);
    -webkit-transform: translate(0px, 300px);
    -moz-transform: translate(0px, 300px);
    -ms-transform: translate(0px, 300px);
    -o-transform: translate(0px, 300px);
    transition: opacity: 1;
}








  #btn-1 {
  left: 150px;
  top: 25px;
  position: absolute;
  z-index: 99;

}

#btn-2 {
    left: 150px;
    top: 50px;
    position: absolute;
    z-index: 99;

}

#btn-3 {
    left: 150px;
    top: 80px;
    position: absolute;
    z-index: 99;

}

#btn-4 {
    left: 150px;
    top: 110px;
    position: absolute;
    z-index: 99;

}
#btn-5 {
    left: 150px;
    top: 140px;
    position: absolute;
}
#btn-6 {
    left: 150px;
    top: 180px;
    position: absolute;
}
#btn-7 {
    left: 150px;
    top: 250px;
    position: absolute;
}
#btn-8 {
    left: 150px;
    top: 300px;
    position: absolute;
}
#btn-9 {
    left: 150px;
    top: 335px;
    position: absolute;
}
#btn-10 {
    left: 150px;
    top: 360px;
    position: absolute;
}
#btn-11 {
    left: 150px;
    top: 390px;
    position: absolute;

}