#encabezado {
    background: -webkit-linear-gradient(top,rgb(235,235,235),rgb(255,255,255));
    background: -moz-linear-gradient(top,rgb(235,235,235),rgb(255,255,255));
    background: -ms-linear-gradient(top,rgb(235,235,235),rgb(255,255,255));
    background: linear-gradient(top,rgb(235,235,235),rgb(255,255,255));
    position: fixed;
    top: 0px;
    z-index: 1019;
    width: 100%;
    height: 115px;
    user-select: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    box-shadow: 0px 0px 11px gray;
}
#encabezado > div{
    flex-basis:100%;
}

#encabezado h1{
    color: var(--MAIN-COLOR);
    font-family:"Montserrat-Bold";
    font-size:28pt;
    text-align:center;
    width:100%;
}
.enc-info {
    display: flex;
    position: relative;
}
.enc-info img {
    width: 215px;
}

.enc-info > div:nth-child(1) {
    display: flex;
    align-items: center;
    flex-basis:95%;
}

.enc-info > div:nth-child(1) * {
    margin: 0px 7.5px;
}


.enc-info > div > .logotipo {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
}


#menu {
    color: var(--MAIN-COLOR)!important;
}
    #menu:hover {
        color: var(--SECONDARY-COLOR)!important;
    }

#menu-container {
    background: rgba(92,102,112,0.93);
    color: white;
    width: 300px;
    height: 100%;
    position: fixed;
    z-index: 9001;
    top: 0%;
    left: -300px;
    opacity: 0;
    transition: all 0.125s ease-in-out;
}

    #menu-container ul li a * {
        margin: 0px 7.5px;
    }

    #menu-container ul {
        list-style-type: none;
        list-style-position: inside;
        padding: 15px 7.5px !important;
    }
    #menu-desktop > ul{
    display:flex;
    flex-wrap:wrap;
}

        #menu-container ul li a {
            display: block;
            text-decoration: none;
            color: white;
            font: 14pt 'Montserrat-Light';
            display: flex;
            align-items: center;
            margin: 7.5px 0px !important;
            text-transform: capitalize;
        }

            #menu-container ul li a:active, #menu:active, #menu-container ul li a:hover {
                color: var(--MAIN-COLOR);
                font-weight:900;
            }

#menu-container > ul > li > ul{
    border-top:1px solid white;
}
#menu-container > ul > li > ul {
    padding-left:3em!important;
    display:none!important;
    animation: all 1.5s ease-in-out;
    height:0px!important;
    opacity:0;
}

    #menu-container > ul > li > ul a{
        font-size: 12pt!important;
        text-transform: capitalize;
    }

    #menu-container ul li:active ul {
        display: block;
    }

#menu-container .btn-primary{
    display:flex;
    align-items:center;
    justify-content:center;
}

.btn-login2 {
    color: var(--MAIN-COLOR)!important;
}
    .btn-login2:hover,.userActive {
        color: var(--SECONDARY-COLOR)!important;
    }

.btn-login {
    background: var(--MAIN-BACKGROUND);
    border:none!important;
}
    .btn-login:hover {
        background: var(--SECONDARY-BACKGROUND) !important;
    }
.icon-nav {
    color: rgb(11,60,80) !important;
}
.icon-nav {
    text-decoration: none !important;
}
    .icon-nav:hover{
        color: rgb(43,163,165) !important;
    }

    .menu-activo {
        left: 0px !important;
        opacity: 1 !important;
    }

.menu-desactivado {
    left: -300px !important;
    opacity: 0 !important;
}

.btn-login {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 3.75px 12.25px !important;
    height:45px;
}
#navegacionM {
    display:flex;
    align-items:center;
    justify-content:flex-end;
}

#navegacionM > *{
    margin:5px 7.75px;
}
    .btn-login span {
        margin: 0px 3.75px;
    }
    .btn-login span:nth-child(1){
        font-size:24px;
    }
    .btn-login span:nth-child(2) {
        font-size: 14pt;
        font-family: 'Montserrat-Light';
        font-weight: 700;
        text-transform: capitalize;
    }


#infoUsuario{
    width:calc(175px + 15%);
    background:white;
    position:absolute;
    top:90px;
    z-index:1019;
    right:10px;
    text-align:center;
    padding:5px;
    box-shadow:0px 0px 15px gray;
}
#infoUsuario > div{
    display:flex;
    align-items:center;
    justify-content:center;
}

    #infoUsuario > div > * {
        flex-basis: 100%;
        white-space:nowrap;
        text-overflow:ellipsis;
        overflow:hidden;
    }



    #infoUsuario > div *{
        margin:5px 7.5px;
    }

@media screen and (min-width:240px) and (max-width: 1023px) and (orientation:portrait) {

    .enc-info img {
        width: 175px !important;
    }
    .enc-info h1{
        font-size:12pt!important;
    }

    #navegacionM {
        flex-wrap: wrap-reverse !important;
    }
    #navegacionM {
        flex-wrap: wrap-reverse !important;
    }
    .enc-info div:nth-child(1){
        flex-wrap:wrap!important;
    }
    .area-title{
        margin-top:15px!important;
    }
    #infoUsuario{
        width:95%!important;
    }
}

@media screen and (min-width:240px) and (max-width: 1023px) and (orientation:landscape) {
    .enc-info img {
        width: 175px !important;
    }

    #navegacionM {
        flex-wrap: wrap-reverse!important;
    }
    #infoUsuario {
        width: 95% !important;
    }

}