/*-----------selector universal { headFoot.css }-----------*/
html{
    scroll-behavior: smooth;
}
body{
    background: rgb(255, 255, 255);
    font-family: Arial, Helvetica, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
}
    .contenedorPag{/*Caja padre de todo el contenido en la página*/
        width: 100%;
        max-width:1500px;
    }

    /*{ headFoot.css }*/

/******Boton ir arriba*****/
.ir-arriba {
	display:none;
	padding:10px;
	background:#46464691;
	font-size:20px;
	color:#fff;
	cursor:pointer;
	position: fixed;
	bottom:100px;
	right:20px;
    z-index: 10;
}
/*Principal*/
/*****Presentación*****/
.presentacion_prestamosPC{
    width: 100%;
    height: 70vh;
    max-height: 725px;
    min-height: 650px;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
}
    .presentacion_prestamosPC .presentacion{
        width: 30%;
        height: 65%;
        display: flex;
        flex-direction: column;
        align-content: center;
        align-items: center;
        justify-content: space-evenly;
    }
        .presentacion_prestamosPC .presentacion .texto{
            width: 100%;
            height: 50%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
        }   
            .presentacion_prestamosPC .presentacion .texto h2{
                width: 100%;
                font-size: 3.1rem;
                text-align: start;
            }
            .presentacion_prestamosPC .presentacion .texto p{
                width: 100%;
                font-size: 1rem;
                text-align: justify;
            }
        /*----------Botones de acción---------*/
        .presentacion_prestamosPC .presentacion .botones{
            width: 100%;
            height: 50%;
            display: flex;
            align-items: center;
            align-content: center;
            justify-content: space-around;
        }
            .presentacion_prestamosPC .presentacion .botones a{
                width: 150px;
                height: 35px;
                border: 1.5px solid rgba(0, 0, 0, 0.5);
                border-radius: 15px;
                text-decoration: none;
                text-align: center;
                color: rgba(0, 0, 0, 0.7);
                font-weight: bold;
                display: flex;
                justify-content: center;
                align-items: center;
                transition: all .3s linear;
            }
            .presentacion_prestamosPC .presentacion .botones a:hover{
                border: 3px solid rgba(128, 128, 128, 0.9);
                background: rgb(128, 128, 128);
                color: rgb(255, 255, 255);
            }    
    /*----------Imagen de presentación---------*/    
    .presentacion_prestamosPC figure{
        width: 50%;
        height: 100%;
        display: flex;
        align-items: center;
        align-content: center;
        justify-content: center;    
    } 
        .presentacion_prestamosPC figure img{
            width: 100%;
        }
    /*----------Modalidad de atención---------*/
    .secciones{
        width: 100%;
        height: 100vh;
        max-height: 1050px;
        min-height: 950px;
        display: flex;
        align-items: center;
        align-content: center;
        justify-items: center;
        justify-content: center;
    }
/*** Modalidad de Reservación ***/
        .secciones .sec_pasos{
            width: 100%;
            height: 65%;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
        }
            .secciones .sec_pasos figure{
                width: 750px;
                height: 50%;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: space-around;
                position: relative;
            }
                .secciones .sec_pasos figure span{
                    position: absolute;
                    width: 100%;
                    height: 100%;
                }
                    .secciones .sec_pasos figure .a{
                        background: rgba(85, 0, 0, 0.7);
                    }
                    .secciones .sec_pasos figure .b{
                        background: rgba(0, 71, 71, 0.4);
                    }
                    .secciones .sec_pasos figure .c{
                        background: rgba(0, 14, 78, 0.5);
                    }
                    .secciones .sec_pasos figure .d{
                        background: rgba(65, 0, 61, 0.5);
                    }
                .secciones .sec_pasos figure img{
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }   
                .secciones .sec_pasos figure div{
                    position: absolute;
                    top: -10px;
                    left: -10px;
                    width: 70px;
                    height: 70px;
                    border-radius: 50%;
                    background: rgba(0, 0, 0, 0.9);
                    color: rgb(255, 255, 255);
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    font-size: 20pt;
                }   
                .secciones .sec_pasos figure figcaption{
                    position: absolute;
                    bottom: 5px;
                    width: 95%;
                    height: 25%;
                    color: rgb(255, 255, 255);
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    font-size: 20pt;
                    text-shadow: rgba(0, 0, 0, 0.9) 1px 1px 2px, rgba(0, 0, 0, 0.9) 0px 0px 1px ;
                    text-align: start;
                }
/*** Normas de Uso ***/
    .normas_uso{
        width: 100%;
        height: 50vh;
        min-height: 450px;
        max-height: 625px;
        display: flex;
        align-items: center;
        align-content: center;
    }
        .normas_uso .seccion_pre, 
        .normas_uso .seccion_enl{
            height: 100%;
            display: flex;
            align-items: center;
            align-content: center;
            justify-content: center;
        }
        .normas_uso .seccion_pre{
            width: 30%;
            background: rgb(47, 89, 168);
        }   
            .normas_uso .seccion_pre .presentacion{
                width: 100%;
                height: 70%;
                color: rgb(255, 255, 255);
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: space-around;
            }    
                .normas_uso .seccion_pre .presentacion h2{
                    width: 90%;
                    height: 30%;
                    font-size: 2.5rem;
                    display: flex;
                    align-items: center;
                }
                .normas_uso .seccion_pre .presentacion p{
                    width: 90%;
                    height: 60%;
                    text-align: justify;
                    display: flex;
                    align-items: center;
                }
        .normas_uso .seccion_enl{
            width: 70%;
        }
            .normas_uso .seccion_enl .enlaces{
                width: 50%;
                height: 100%;
                display: flex;
                align-items: center;
                align-items: center;
                justify-content: space-around;
            }
                .normas_uso .seccion_enl .enlaces li{
                    width: 100%;
                    height: 70%;
                    color: rgb(26, 75, 167);
                    list-style: none;
                }
                    .normas_uso .seccion_enl .enlaces li ul{
                        width: 80%;
                        margin-bottom: 5px;
                        display: flex;
                        align-items: center;
                        align-content: center   ;
                    }
                        .normas_uso .seccion_enl .enlaces li ul img{
                            width: 25px;
                            margin-right: 10px;
                        }
                        .normas_uso .seccion_enl .enlaces li ul a{
                            text-decoration: none;
                            color: rgb(26, 75, 167);
                            display: flex;
                            align-content: center;
                            align-items: center;
                            justify-content: start;
                        }
/**** Diseño Responsive ****/
@media screen and (max-width: 1515px){
    .secciones .sec_pasos figure{
        height: 25%;
    }
}
/*--- 800px ---*/
@media screen and (max-width: 800px){
    .presentacion_prestamosPC{
        position: relative;
        flex-direction: column;
    }
        .presentacion_prestamosPC .presentacion{
            position: absolute;
            z-index: 2;
            width: 100%;
            height: 90%;
            background: rgba(255, 255, 255, 0.75);
        }
                .presentacion_prestamosPC .presentacion .texto h2{
                    width: 90%;
                    font-size: 2.1rem;
                }
                .presentacion_prestamosPC .presentacion .texto p{
                    width: 90%;
                    height: 40%;
                }
            /*----------Botones de acción---------*/
                .presentacion_prestamosPC .presentacion .botones a{
                    width: 150px;
                    height: 35px;
                    background: rgb(128, 128, 128);
                    color: rgb(255, 255, 255);
                } 
        /*----------Imagen de presentación---------*/
        .presentacion_prestamosPC figure{
            width: 100%;
        }    
            
        /*----------PASOS A SEGUIR---------*/
        .secciones .sec_pasos{
            height: 100%;
        }
        .secciones .sec_pasos figure{
            width: 100%;
            height: 25%;
        }
            .secciones .sec_pasos figure div{
                left: 25%;
                width: 50px;
                height: 50px;
                font-size: 16pt;
            }
            .secciones .sec_pasos figure figcaption{
                font-size: 15pt;
            }
    /*------NORMAS DE USO-----*/
    .normas_uso{
        flex-direction: column;
    }
        .normas_uso .seccion_pre,
        .normas_uso .seccion_enl{
            width: 100%;
            height: 50%;
        }
            
}