#flex{
     display: flex;
    align-items: center;
     flex-wrap: wrap;
    align-content: center;
    height: auto;
    
    
} 

#centrar{
    margin: 30px;
}


.contenedor{
            
            width: 300px;
            height: auto;
            margin: auto;
    margin-bottom: 10px;
            
        }
        
        .carta{
            width: 100%;
            height: 100%;
            position: relative;
           
           
        }
        
       
                                                  
        
       .lado{
           width: 100%;
           height: 100%;
           backface-visibility: hidden;
           position: absolute;
        
                    
        }
                    
        
        .frente{
            border-radius: 24px 24px 24px 24px;
            -moz-border-radius: 24px 24px 24px 24px;
            -webkit-border-radius: 24px 24px 24px 24px;
            border: 1px solid rgb(162,34,62,1);
              background-color: white;
              
        }
        .atras {
            background-color: white;
            transform: rotateY(180deg);
            border-radius: 24px 24px 24px 24px;
            -moz-border-radius: 24px 24px 24px 24px;
            -webkit-border-radius: 24px 24px 24px 24px;
            border: 0px solid blue;
        }

.slither{
    background: #151515;
}

.slither2{
    background: white;
}



.slider{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.slider ul{
    display: flex;
    padding: 0;
    width: 400%;
    animation: cambio 20s infinite alternate linear; 
}

.slider li{
    width: 100%;
    list-style: none;
}

.slider img{
    width: 100%;
}


.slider2{
    width: 50%;
    height: 100%;
    overflow: hidden;
}

.slider2 ul{
    display: flex;
    padding: 0;
    width: 800%;
    animation: cambio 20s infinite alternate linear; 
}

.slider2 li{
    width: 100%;
    list-style: none;
}

.slider2 img{
    width: 100%;
    height: 100%;
}

@keyframes cambio{
    0% {margin-left: 0;}
    20% {margin-left: 0;}
    25% {margin-left: -100%}
    45% {margin-left: -100%}
    50% {margin-left: -200%}
    70% {margin-left: -200%}
    75% {margin-left: -300%}
    100% {margin-left: -300%}
    
    
}