.wrap{
    margin: 30px auto ;
    display:flex;
    justify-content: center;
    flex-direction: column;
}
.tarjeta-wrap{
    width: 100%;
    margin: 10px;
    -webkit-perspective: 800;
    perspective: 800;
}
.tarjeta{
    width: 100%;
    height: 550px;
    background: #000;
    position: relative;
    transform-style: preserve-3d;
    transition: 1.9s ease;
    border-radius: 8px;

    -webkit-box-shadow:0px 10px 15px -5px rgba(0,0,0,0.65);
    -moz-box-shadow:0px 10px 15px -5px rgba(0,0,0,0.65);
    box-shadow:0px 10px 15px -5px rgba(0,0,0,0.65);
}
.adelante, .atras{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.adelante{
    width: 100%;
}

.image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.atras{
    transform: rotateY(180deg);

    padding: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;

    text-align: justify;
    color: #fff;
    font-size: 20px;

    overflow-y: auto; 

    max-height: 530px;
    
}
.atras > p{
    height: 100%;
}

.tarjeta-wrap:hover .tarjeta{
    transform: rotateY(180deg);
}

.card1{
    background-image:url('../img/logos/Versiones_Logo_Greenligth_0001_Objeto-inteligente-vectorial_0000_Objeto-inteligente-vectorial.png');
    background-size: 30%;
    background-repeat: no-repeat;
    align-items: center;
}