/* flip-y.css - Efecto flip sobre el eje Y (vertical) */

ul li.indu-row{ /*max-width: 30%; width: 30%;*/  float: left; list-style: none; display: inline-flex; /*margin-bottom: 30px;*/}
ul li.center{margin:0 25%;}

h3{ font-family: "Encode Sans", sans-serif; font-weight:500; }
#last {visibility: hidden;}

.flip-card-ind {
  perspective: 1200px;
  width: 397px;
  height: 365px;
  display: inline-block;
  position: relative;
  padding: 0 10px 20px 10px;
}

.flip-card-ind-inner {
  width: 100%;
  height: 100%;
  transition: transform 0.75s cubic-bezier(.4, .2, .2, 1);
  transform-style: preserve-3d;
  position: relative;
}

.flip-card-ind:hover .flip-card-ind-inner,
.flip-card-ind.flip-active .flip-cardind-inner {
  transform: rotateY(180deg);
}

.flip-card-ind-front,
.flip-card-ind-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 2px;
}

.flip-card-ind-front {
  background: #fff;
  color: #111;
}
.nombre{
  position: absolute;
  color:#ffffff; 
  font-weight:700; 
  letter-spacing:0.05em;
  text-align: center;
}
.nombre h3 {font-size: 18px;}

.flip-card-ind-back {
  background: #f3f3f3;
  color: #111;
  transform: rotateY(180deg);
}
.flip-card-ind-back .nombre h3, .flip-card-ind-back .nombre a {color: var(--azul);}
.flip-card-ind-back .nombre h3{margin-top: 45px;}
.flip-card-ind-back a:hover{color: #efefef; border-color: #efefef; /*background-color:#00000080;*/}

.flip-card-ind-front img,
.flip-card-ind-back img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media only all and (max-width: 30rem){
  ul li.indu-row{width: 340px; height: 360px;}
}