:root{
    --bordeSlider: #ffffff;
    --bordeLogo: #ffffff;
    --fondoLogo: #1434a0;
    --fondo_O1: #2368A7;
    --fondo_menu: #2368A7;
    --fondo_submenu: #2368A7;;
    --fondo_submenuHover: #011c35;
    --separacion_menu: #ffffff;
    --contenido: #ffffff;
}

*{
    box-sizing: border-box;
}
body{
    margin: 0;
    background: var(--contenido);
}
.nav-bar{
    background: #2368A7;
    padding: 15px;
    display: block;
    color: #ffffff;
    cursor: pointer;
    font-size: 2.0rem;
    width: 100%;
}
.menu, .submenu{
    list-style: none;
    padding: 0;
    margin: 0;
}
.menu{
    background: var(--fondo_menu);
    width: 100%;
    
    /*
    width: 100%;
    margin-left: -100%;
    transition: all 0.5s;
    */
}
.menu__link{
    display: block;
    padding: 10px 25px 10px 25px;
    color: white;
    font-size: 1.5rem;
    text-decoration: none;
}
.menu__link:hover{
    background: var(--fondo_submenuHover);
}
.submenu .menu__link:hover{
    background: #011c35;
}
.submenu{
    height: 0;
    overflow: hidden;
    transition: all 0.3s;
}
.submenu .menu__link{
    background: var(--fondo_submenu);
    padding-left: 50px;
}
.mostrar{
    display: block;
    margin-left: 0;
    transition: all 0.5s;
}
.Nomostrar{
    margin-left: -100%;
    transition: all 0.5s;
    display: none;
}
.milogo{
    display: none;
    width: 0px;
    height: 0px;
    z-index: 0;
}

.pTitulo{
    width: 100%;
    height: 30px;
    color: white;
    line-height: 30px;
    text-align: center;
    margin: auto;
    background: #2368A7;
}
.contenido{
    width: 100%;
    margin: auto;
    margin-top: 5px;
    background: white;
}

.imagen-slider1{    
   
    background-image:url(../img/slider/1.jpg);
    background-position:50%;
    background-size:cover;
    padding:9rem 0;
    display:flex;
    flex-direction:column; 
    align-items:center;   
}
.imagen-slider1 h2{ 
    margin: 0;     
    display: absolute;
    padding: 0;
    position: relative;
    font-size:3rem;
    font-weight:700;
    color:#fff

}
 
.imagen-slider1 p a{
    padding: 1rem;
    font-size:1.8rem;    
    color:#fff;
    background-color: #011c35;
    text-decoration: none;
}

@media (min-width:768px){
    .imagen-slider1 h2{
        font-size:4rem;
        font-weight:900;
        color:#fff}   
             
    }
    
.imagen-slider2{
    background-image:url(../img/slider/2.jpg);
    background-position:50%;
    background-size:cover;
    padding:0;
    display:flex;
    flex-direction:column; 
    align-items:center;
}
.imagen-slider2 h2{
    margin: 0;
    font-size:2.5rem;
    font-weight:700;
    color:#fff}
 
.imagen-slider2 p{
    font-size:1.4rem;
    color:#fff;
    text-align: center;
}
.imagen-slider2 a{
    padding: 1rem;
    background-color: #011c35;
    font-size:1.8rem;
    color:#fff}

 @media (min-width:768px){
    .imagen-slider2 h2{
        font-size:4rem;
        font-weight:900;
        color:#fff}        
    }
    .imagen-slider2{
        background-image:url(../img/slider/2.jpg);
        background-position:50%;
        background-size:cover;
        padding:8rem 0;
        display:flex;
        flex-direction:column; 
        align-items:center;
    }

@media(min-width:728px){
    header{
        width: 100%;
        height: 100%;
        background: var(--fondo_O1);
    }
    .milogo{
        display: block;
        width: 80px;
        height: 100px;
        background: var(--bordeLogo);
        object-fit: cover;
        padding: 0px;
        padding-bottom: 2px;
        border: 2px solid var(--bordeLogo);
        position: absolute;
        top: 5px;
        left: 15%;
        z-index: 1500;
    }
    .nav-bar{
        display: none;
    }
    .menu{
        margin-left: 0;
        padding-left: 20%;
        display: flex;
    }
    .container-submenu{
        position: relative;
    }
    .submenu{
        position: absolute;
        top: 47px;
        width: 200px;
        overflow: visible;
        z-index: 1000;
        opacity: 0;
        visibility: hidden;
        border-top: 2px solid var(--separacion_menu);
    }
    .submenu .menu__link{
        border-top: 1px solid var(--separacion_menu);
    }
    .container-submenu:hover .submenu{
        opacity: 1;
        visibility: visible;
    }
    .container-slider{
        display: block; 
    }
    .encabezado{
        width: 100%;
        background: var(--fondo_menu);
    }
    .arriba{
        width: 90%;
        margin: auto;
    }
    .pTitulo{
        width: 100%;
        height: 30px;
        color: white;
        line-height: 30px;
        border-radius: 20px 20px 0px 0px;
        text-align: center;
       margin-top: 25px;
        background: #2368A7;
    }
    .contenido{
        width: 80%;
        margin: auto;
        margin-top: 10px;
        background: white;
        border-radius: 20px 20px 0px 0px;
    }
   
}