
.cajaPadreImagen{
  position: absolute;
  padding: 3em;
  background-color: #BD9A84;
  top: 0%;
  left: 50%;
  transform: translate(-50%, 0%);
  display: flex;
  justify-content: center;
  z-index: 50;
}

.cerrar{
  position: absolute;
  width: 18px;
  right: 3%;
  top: 50%;
  z-index: 1;
}

.imagen{
  width: 20cm;
  display: block;
}

.btnButton{
  width: 100%;
  position: absolute;
  left: 0em;
  bottom: 0.3em;
  display: flex;
  justify-content: center;
}

.tamanio{
  width: 140px;
}

.tamanio:hover{
  cursor: pointer;
}

@media (max-width:800px) {
    .cerrar{
        top:50%;
    }
}

@media screen and (max-width:500px) {

  .cajaPadreImagen{
    width: 100%;
    top: 0%;
    left: 50%;
    transform: translate(-50%, 0%);
  }
  .imagen{
    width: 8cm;
  }

}

@media screen and (min-width:501px) and (max-width:600px) {

  .cajaPadreImagen{
    width: 100%;
    top: 0%;
    left: 50%;
    transform: translate(-50%, 0%);
  }
  .imagen{
    width: 12cm;
  }

}

@media screen and (min-width:601px) and (max-width:700px) {

  .cajaPadreImagen{
    width: 100%;
    top: 0%;
    left: 50%;
    transform: translate(-50%, 0%);
  }
  .imagen{
    width: 15cm;
  }

}

@media screen and (min-width:701px) and (max-width:870px) {

  .cajaPadreImagen{
    width: 100%;
    top: 0%;
    left: 50%;
    transform: translate(-50%, 0%);
  }
  .imagen{
    width: 17cm;
  }

}

@media screen and (min-width:871px) and (max-width:1020px) {

  .cajaPadreImagen{
    width: 100%;
    top: 0%;
    left: 0%;
    transform: translate(0%, 0%);
  }
  .imagen{
    width: 20cm;
  }

}

@media screen and (min-width:1021px) and (max-width:1100px) {

  
  .cajaPadreImagen{
    width: 100%;
  }
  .imagen{
    width: 25cm;
  }

}

@media screen and (min-width:1100px) and (max-width:1200px) {

  .cajaPadreImagen{
    width: 100%;
  }
  .imagen{
    width: 23cm;
  }
  
}

@media screen and (min-width:1201px) and (max-width:1400px) {

  .imagen{
    width: 20cm;
  }

}

@media screen and (min-width:1400px) {

  
  .imagen{
    width: 33cm;
  }

  .cerrar{
    top: 50%;
  }


}