@media all and (min-width: 0px) {
    span#ambiente, div#ambiente {
        flex: 1;
        display: flex;
        flex-direction: row;
        display: -ms-flexbox;
        display: -webkit-flex;
        justify-content: flex-end;
        font-family: 'OpenSans Bold', sans-serif;
    }
}

@media screen and (max-width: 1000px) {
    #pageWrapper {
        background-size: cover;
    }
    .menu {
        flex-wrap: wrap;
    }
    .menu button.button {
        height: 12em;
    }
}
@media screen and (min-width: 720px) {
    #containerPrincipal {
        padding: 3em;
    }
}
@media screen and (min-width: 720px) and (max-width: 900px) {
    .bar.bar-logo img.logo-sistec {
        width: 60% !important;
    }
    .bar.bar-logo img.logo-gov {
        width: 15% !important;
    }
    #mainPanel_pad,
    #containerAvisos {
        height: auto !important;
    }
}
@media screen and (max-width: 720px) {
    .bar.bar-logo img.logo-sistec {
        width: 15em !important;
    }
    #containerPrincipal {
        justify-content: start !important;
    }
    .formulario {
        width: 100% !important;
        height: 18% !important;
        margin: 0 0 1em 0 !important;
    }
    .menu button.button {
        margin: 10px !important;
        flex: 1 1 15em !important;
    }
    html {
        overflow: auto;
    }
}
@media screen and (max-width: 520px) {
    .bar.bar-logo {
        margin: 0 1em !important;
    }
    .bar.bar-logo img.logo-gov {
        width: 5em !important;
    }
    span#ambiente {
        display: none;
    }
    .navbar {
        padding: 0.4em 0 !important;
    }
}
@media screen and (max-device-width: 480px) {
    #pageWrapper {
        background-size: cover;
    }
}
@media screen and (max-device-width: 320px) {
    html {
        width: fit-content;
    }
}
@media screen and (min-device-width: 521px) and (max-device-width: 621px) {
    html {
        width: fit-content;
    }
}