@charset "utf-8";
* {
    box-sizing: border-box;
	margin: 0px;
	padding: 0px;
}

body {
	padding: 0px;
    border: 0px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;	
}

.cuerpo {
    flex-grow: 1;
    display: flex;
	flex-direction: column;
    justify-content: space-around;    
    align-items: center;
    padding-left: 5em;
}

#contenedorPrincipal {    
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#albumFotos {   
    margin: 2%; 
    display: flex;
    position: relative;
    max-width: 80%;
    width: 100%;    
    height: auto;
}

#foto1 {
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 2em;
}

#albumFotos img:not(:first-of-type) {  
	margin: 0px;
	padding: 0px;    
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;    
    transform: scale(0,1);
}

#albumFotos img {
    transition: transform 1s linear 0s, opacity 1s linear 0s;
    opacity: 0;
    justify-items: center;
    width: 100%;
    height: auto;
}



#visorPantalla{
    margin-left: 2em;
    margin-right: 2em;
	
}


#pasarFoto {
    display: flex;      
    justify-content: left;
    
    width: 100%;
	margin: 2em;
	padding-left: 2m;
	
}
#pasarFoto > span {
    font-size: larger;
    font-weight: bold;
}
#pasarFoto >span:not(:nth-of-type(2)) {
    cursor: pointer;
}




#contenedorPrincipal #albumFotos .salirderecha {
    transform-origin: right center;
    transform: scale(0,1);
    opacity: 0;   
}
#contenedorPrincipal #albumFotos .salirizda {
    transform-origin: left center;
    transform: scale(0,1);
    opacity: 0;   
}
#contenedorPrincipal #albumFotos .entrarderecha {
    transform-origin: right center;
    transform: scale(1,1);
    opacity: 1;   
}
#contenedorPrincipal #albumFotos .entrarizda {
    transform-origin: left center;
    transform: scale(1,1);
    opacity: 1;   
}

@media screen and (max-width: 1150px){
	#pasarFoto {        			
        justify-content: left;			
        width: 100%;
		padding-left: 5%%;
        font-size: small;

}


/* adaptcion para tablets */
@media screen and (max-width: 850px){

    .cuerpo {  
        width: 100%;
        margin: 0px;      
        padding: 0px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
       
        
    }
    #contenedorPrincipal {        
        height: auto;        
        width: 100%;
        padding-bottom: 2em;
        padding-left: 2em;
               
    }
    
    #albumFotos img { 
        align-items: center; 
        justify-content: center;
        width: 100%;
        height: auto; 
        margin: 0.5%; 
        max-width: 100%;
    }

    #pasarFoto {        			
        justify-content: left;			
        width: 100%;
		padding-left: 0%;
        font-size: small;
    }
    #visorPantalla {
        padding-left: 1em;
        padding-right: 1em;
    }

    
}
	
	/* adaptcion para moviles */
	@media screen and (max-width: 500px){
		
		#foto1 {
			width: 100%;
			height: auto;			
		}
        #imagen1{
            width: 100%;
			height: auto;

        }

		#albumFotos{
			width: 100%;
            height: auto;
            justify-content: center;
		}

        
		#albumFotos img:not(:first-of-type) {			
			width: 100%;
			height: auto;    
			justify-content: center;
		}

        		
		#pasarFoto {        			
            justify-content: center;			
            width: 100%;
            font-size: small;
			padding-left: 0%;
			margin-left: 0em;
        }
        #visorPantalla {
            padding-left: 0.5em;
            padding-right: 0.5em;
        }
    
        
	}