/*uno */
.containeruno {
  position:absolute;
        margin: auto;
        margin-top: 5%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containeruno {
  position:absolute;
        margin: auto;
        margin-top: 3%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
}
.div-uno {
  display: block;
  margin-left: auto;
  margin-right: auto;
border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-uno.hidden {
  overflow: hidden;
}
.div-uno .uno {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-uno:hover .uno {
  margin-left: -100%;
}

.txtuno {
    position: absolute;
    margin: auto;
    margin-top: 85%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 58%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }

@media (max-width:475px){
   .txtuno {
    position: absolute;
    margin: auto;
    margin-top: 53%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 58%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    } 
}
/*dos*/

.containerdos {
  position:absolute;
        margin: auto;
        margin-top: 5%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: 30%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}

@media (max-width:475px) {
    .containerdos {
  position:absolute;
        margin: auto;
        margin-top: 65%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
}

.div-dos {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-dos.hidden {
  overflow: hidden;
}
.div-dos .dos {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-dos:hover .dos {
  margin-left: -100%;
}
.txtdos {
    position: absolute;
    margin: auto;
    margin-top: 85%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtdos {
    position: absolute;
    margin: auto;
    margin-top: 115%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*tres */
.containertres {
  position:absolute;
        margin: auto;
        margin-top: 35%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}

@media (max-width:475px) {
 .containertres {
  position:absolute;
        margin: auto;
        margin-top: 128%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}   
}
.div-tres {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-tres.hidden {
  overflow: hidden;
}
.div-tres .tres {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-tres:hover .tres {
  margin-left: -100%;
}

.txttres {
    position: absolute;
    margin: auto;
    margin-top: 115%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 58%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txttres {
    position: absolute;
    margin: auto;
    margin-top: 178%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*cuatro*/

.containercuatro {
  position:absolute;
        margin: auto;
        margin-top: 35%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: 30%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}

@media (max-width:475px) {
    .containercuatro {
  position:absolute;
        margin: auto;
        margin-top: 190%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-cuatro {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-cuatro.hidden {
  overflow: hidden;
}
.div-cuatro .cuatro {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-cuatro:hover .cuatro {
  margin-left: -100%;
}

.txtcuatro {
    position: absolute;
    margin: auto;
    margin-top: 115%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtcuatro {
    position: absolute;
    margin: auto;
    margin-top: 240%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*ocho*/

.containerocho {
  position:absolute;
        margin: auto;
        margin-top: 65%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containerocho {
  position:absolute;
        margin: auto;
        margin-top: 257%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-ocho {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-ocho.hidden {
  overflow: hidden;
}
.div-ocho .ocho {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-ocho:hover .ocho {
  margin-left: -100%;
}

.txtocho {
    position: absolute;
    margin: auto;
    margin-top: 145%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 72%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtocho {
    position: absolute;
    margin: auto;
    margin-top: 310%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*nueve*/

.containernueve {
  position:absolute;
        margin: auto;
        margin-top: 65%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: %;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}

@media (max-width:475px) {
    .containernueve {
  position:absolute;
        margin: auto;
        margin-top: 327%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-nueve {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-nueve.hidden {
  overflow: hidden;
}
.div-nueve .nueve {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-nueve:hover .nueve {
  margin-left: -100%;
}

.txtnueve {
    position: absolute;
    margin: auto;
    margin-top: 145%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left:70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtnueve {
    position: absolute;
    margin: auto;
    margin-top: 380%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*20 de enero*/

.containerveinte {
  position:absolute;
        margin: auto;
        margin-top: 95%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: %;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}

@media (max-width:475px) {
    .containerveinte {
  position:absolute;
        margin: auto;
        margin-top: 395%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-veinte {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-veinte.hidden {
  overflow: hidden;
}
.div-veinte .veinte {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-veinte:hover .veinte {
  margin-left: -100%;
}

.txtveinte {
    position: absolute;
    margin: auto;
    margin-top: 175%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left:70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtveinte {
    position: absolute;
    margin: auto;
    margin-top: 448%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*morelos*/

.containermorelos {
  position:absolute;
        margin: auto;
        margin-top: 95%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containermorelos {
  position:absolute;
        margin: auto;
        margin-top: 463%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-morelos {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-morelos.hidden {
  overflow: hidden;
}
.div-morelos .morelos {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-morelos:hover .morelos {
  margin-left: -100%;
}

.txtmorelos {
    position: absolute;
    margin: auto;
    margin-top: 175%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 72%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtmorelos {
    position: absolute;
    margin: auto;
    margin-top: 515%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*ermita*/

.containerermita {
  position:absolute;
        margin: auto;
        margin-top: 125%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: %;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containerermita {
  position:absolute;
        margin: auto;
        margin-top: 530%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-ermita {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-ermita.hidden {
  overflow: hidden;
}
.div-ermita .ermita {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-ermita:hover .ermita {
  margin-left: -100%;
}

.txtermita {
    position: absolute;
    margin: auto;
    margin-top: 205%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left:70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtermita {
    position: absolute;
    margin: auto;
    margin-top: 580%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*joya*/

.containerjoya {
  position:absolute;
        margin: auto;
        margin-top: 125%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containerjoya {
  position:absolute;
        margin: auto;
        margin-top: 595%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-joya {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-joya.hidden {
  overflow: hidden;
}
.div-joya .joya {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-joya:hover .joya {
  margin-left: -100%;
}

.txtjoya {
    position: absolute;
    margin: auto;
    margin-top: 205%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 72%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtjoya {
    position: absolute;
    margin: auto;
    margin-top: 645%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*express1*/

.containerexpress1 {
  position:absolute;
        margin: auto;
        margin-top: 155%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: %;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containerexpress1 {
  position:absolute;
        margin: auto;
        margin-top: 660%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-express1 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-express1.hidden {
  overflow: hidden;
}
.div-express1 .express1 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-express1:hover .express1 {
  margin-left: -100%;
}

.txtexpress1 {
    position: absolute;
    margin: auto;
    margin-top: 235%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left:70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtexpress1 {
    position: absolute;
    margin: auto;
    margin-top: 710%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*romita*/

.containerromita {
  position:absolute;
        margin: auto;
        margin-top: 155%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containerromita {
  position:absolute;
        margin: auto;
        margin-top: 730%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-romita {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-romita.hidden {
  overflow: hidden;
}
.div-romita .romita {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-romita:hover .romita {
  margin-left: -100%;
}

.txtromita {
    position: absolute;
    margin: auto;
    margin-top: 235%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 72%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtromita {
    position: absolute;
    margin: auto;
    margin-top: 780%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*marfil*/

.containermarfil {
  position:absolute;
        margin: auto;
        margin-top: 185%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 70%;
        right: %;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containermarfil {
  position:absolute;
        margin: auto;
        margin-top: 800%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-marfil {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-marfil.hidden {
  overflow: hidden;
}
.div-marfil .marfil {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-marfil:hover .marfil {
  margin-left: -100%;
}

.txtmarfil {
    position: absolute;
    margin: auto;
    margin-top: 265%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left:70%;
    right: 30%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtmarfil {
    position: absolute;
    margin: auto;
    margin-top: 850%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}
/*yerbabuena*/

.containeryerbabuena {
  position:absolute;
        margin: auto;
        margin-top: 185%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 50%;
        left: 28%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: ;
}
@media (max-width:475px) {
    .containeryerbabuena {
  position:absolute;
        margin: auto;
        margin-top: 865%;
        align-content: center;
        justify-content: center;
        box-sizing: content-box;
        width: 110%;
        left: 50%;
        right: 72%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, 5%);
        z-index: 10;
}
}
.div-yerbabuena {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 5%;
  width: 80%;
  height: 50%;
}
.div-yerbabuena.hidden {
  overflow: hidden;
}
.div-yerbabuena .yerbabuena {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 200%;
  height: 200%;
  margin-left: 0px;
  -webkit-transition: margin 1s ease;
  -moz-transition: margin 1s ease;
  -o-transition: margin 1s ease;
  -ms-transition: margin 1s ease;
  transition: margin 1s ease;
}
.div-yerbabuena:hover .yerbabuena {
  margin-left: -100%;
}

.txtyerbabuena {
    position: absolute;
    margin: auto;
    margin-top: 265%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 28%;
    right: 72%;
    width: 40%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
@media (max-width:475px){
    .txtyerbabuena {
    position: absolute;
    margin: auto;
    margin-top: 915%;
    align-content: center;
    justify-content: center;
    box-sizing: content-box;
    left: 50%;
    right: 30%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, 5%);
    }
}