@import url("modale.css");

html > body {
    position: relative
}
/****** AGGIUNGERE STYLE INLINE per fare scendere la pagina ******/

div#contenuto {
    width: 100px;
    background: grey
}
/*************** **************/


.barraRow {
    display: inline
}

/* GENERALI */
div#autbContenitoreBarra {
    position: absolute;
    top: -50px;
    z-index: 2000;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    height: 50px;
}
div#autbContenitoreBarra * {
    margin: 0;
    padding: 0
}
div#autbContenitoreBarra a {
    outline: none;
}
#autbLinksList a {
    padding: 15px
}



/* barra */
div#autbContenitoreBarra div#autbBar {
    width: 100%;
    height: 50px;
    display: block;
    position: relative;
    -webkit-box-shadow: 0px -2px 4px 0px rgba(50, 50, 50, 0.2);
    -moz-box-shadow:    0px -2px 4px 0px rgba(50, 50, 50, 0.2);
    box-shadow:         0px -2px 4px 0px rgba(50, 50, 50, 0.2);
}
/* pulsante accedi */
div#autbContenitoreBarra a#autbLoginButton {
    text-align: left;
    width: 110px;
    position: relative;
    float: right;
    line-height: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-top: transparent 5px solid;
    padding: 10px 15px 15px 25px !important;
}

div#autbContenitoreBarra a#autbLoginButton[title=Chiudi] {
    border-top: #0099ff 5px solid;
}


/* link */
div#autbContenitoreBarra ul#autbLinksList {
    height: 50px;
    overflow: hidden;
    float: right;
}
#autbLinksListMOB {
    display: none;
    width: 0;
    overflow: hidden;
    height: 0;
}
div#autbContenitoreBarra ul#autbLinksList li {
    display: inline-block;
    list-style-type: none;
}
/* pulsante info */
div#autbContenitoreBarra a#autbInfoButton {
    float: right;
    line-height: 20px;
    text-align: center;
    position: relative;
    padding: 15px !important;
}
/* pannello login */
div#autbContenitoreBarra div#autbLoginPanel {
    overflow: hidden;
    height: auto;
}
/* form login */
div#autbContenitoreBarra div#autbLoginPanel div#autbForm {
    padding: 10px 30px;
    line-height: 30px;
    display: block;
    float: right;
}
div#autbContenitoreBarra div#autbLoginPanel div#autbForm form {
    display: inline;
}
div#autbContenitoreBarra div#autbLoginPanel div#autbForm:before,
div#autbContenitoreBarra div#autbLoginPanel div#autbForm:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}
div#autbContenitoreBarra div#autbLoginPanel div#autbForm:after {
    clear: both;
}


div#autbContenitoreBarra div#autbLoginPanel div#autbForm label {
    display: none
}
div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=text], div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=password] {
    width: 140px;
    height: 26px;
    line-height: 26px;
    padding: 0 5px;
    margin-left: 14px;
}
div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=submit] {
    cursor: pointer;
}
*:first-child+html div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=submit] {
    padding: 0 10px;
    float: left;
}
/* logout */
div#autbContenitoreBarra div#autbLogoutBox {
    position: absolute;
    top: 0;
    left: 34px;
    height: 50px;
    line-height: 50px;
}
div#autbContenitoreBarra a#autbLogoutFlyoutButton {
    position: absolute;
    top: 0;
    right: 0;
    width: 36px;
    text-align: center;
    height: 50px;
    display: block;
    float:left;
}
div#autbContenitoreBarra div#autbLogoutFlyout {
    width: auto;
    height: auto;
    padding: 10px;
    text-align: right;
    position: absolute;
    top: 50px;
    right: 0;
    z-index: 1999;
    display: block;
}
div#autbContenitoreBarra div#autbNomeLogout {
    padding-right: 42px;
    text-align: right
}
/* feedback */
div#autbContenitoreBarra div#autbUnicefOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 50px;
    display: block;
    line-height: 50px;
}
div#autbContenitoreBarra div#autbUnicefOverlay div#loaderImage {
    background: url(https://barraautenticazionetest.unicef.it/images/loader.gif) no-repeat center;
    width: 100%;
    height: 100%;
    display: block;
}
div#autbContenitoreBarra div#autbLoaderLogout {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    display: block;
    line-height: 30px;
    height: 50px
}
div#autbContenitoreBarra div#autbLoaderLogout img {
    margin-left: 48%;
    margin-top: 4px;
    vertical-align: top
}
/* errori */
/*div#autbContenitoreBarra a#autbRicordaPassword,
div#autbContenitoreBarra div.autbErrori {margin-left: 14px; float: left; margin-top: 4px; display: block; padding: 3px 6px; font-weight: normal; line-height: 15px}*/

div#autbContenitoreBarra a#autbRicordaPassword, div#autbContenitoreBarra div.autbErrori {
    display: inline-block;
    font-weight: normal;
    line-height: 17px;
    padding: 1px 5px;
    position: relative;
    margin: 0 10px 10px 0;
}
/* info */
div#autbContenitoreBarra div#autbInfoPopup {
    position: absolute;
    top: 82px;
    right: 34px;
    display: block;
    padding: 20px;
    z-index: 2000;
    width: 440px;
}
div#autbContenitoreBarra div#autbInfoPopup a#autbChiudiButton {
    height: 14px;
    text-align: right;
    padding: 2px 4px 2px 4px;
    display: block;
    position: absolute;
    top: -20px;
    right: 2px;
    text-transform: uppercase;
    height: 18px;
}




@media (max-width: 920px) {
    #autbBar {
        height: 49px;
        border-bottom-width: 1px;
        border-bottom-style: solid;
    }
    
    
    .barraRow {
        display: block !important;
        text-align: right !important;
    }

    .barraRow > * {
        margin: 0 0 10px 0 !important;
    }
    
    #autbRicordaPassword {
        padding: 0 0 0 5px !important;
    }
    
    .barraRow .autbErrori {
        padding: 0 5px !important;
    }
    
    div#autbContenitoreBarra div#autbLoginPanel {
        position: relative;
    }
    div#autbContenitoreBarra div#autbUnicefOverlay {
        height: 100%;
    }
    div#autbContenitoreBarra ul#autbLinksList {
        display: none;
    }
    div#autbContenitoreBarra ul#autbLinksListMOB {
        display: none;
        padding: 0;
        margin: 0;
        height: auto;
        width: 100%;
        position: absolute;
        top: 50px;
    }
    div#autbContenitoreBarra #autbButtonLink {
        display: block;
        float: right;
        width: 42px;
        height: 33px;
        padding: 17px 0 0 0;
        margin: 0 2px 0 0;
    }
    div#autbContenitoreBarra .autbIcon-bar {
        display: block;
        width: 18px;
        height: 2px;
        margin: 2px auto;
        -webkit-border-radius: 1px;
        -moz-border-radius: 1px;
        border-radius: 1px;
    }
    div#autbContenitoreBarra ul#autbLinksListMOB li {
        float: none;
        clear: both;
        display: block;
        margin: 2px 10px;
        padding: 0;
        text-align: right;
        padding: 0 34px 0 0;
        line-height: 24px;
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;    /* Firefox, other Gecko */
        box-sizing: border-box;         /* Opera/IE 8+ */
    }
    div#autbContenitoreBarra a#autbInfoButton {
        margin-top: 0;
    }
    div#autbContenitoreBarra ul#autbLinksListMOB a {
        display: block;
        text-align: right;
    }
    div#autbContenitoreBarra div#autbLogoutBox {
        right: 88px;
    }
}
@media (max-width: 767px) {
    div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=submit] {
    }
    div#autbContenitoreBarra div#autbLoginPanel {
    }
    div#autbContenitoreBarra a#autbRicordaPassword, div#autbContenitoreBarra div.autbErrori {

    }
}
@media (max-width: 560px) {
    
    div#autbContenitoreBarra div#autbInfoPopup {
        position: absolute;
        right: 3%;
        display: block;
        padding: 10px;
        z-index: 2000;
        width: 94% !important;
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;    /* Firefox, other Gecko */
        box-sizing: border-box;         /* Opera/IE 8+ */
    }
}
@media (max-width: 500px) {
    .barraRow > * {
        display: block !important;
        text-align: left !important;
    }
    div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=submit] {
        margin: 0 !important;
    }
    
    div#autbContenitoreBarra div#autbLoginPanel div#autbForm {
        float: none;
    }
    
    div#autbContenitoreBarra div#autbLoginPanel {
        height: auto;
    }
    div#autbContenitoreBarra div#autbLoginPanel div#autbForm {
        padding: 5px 10px;
    }
    div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=text], div#autbContenitoreBarra div#autbLoginPanel div#autbForm input[type=password] {
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;    /* Firefox, other Gecko */
        box-sizing: border-box;         /* Opera/IE 8+ */
        width: 100%;
        margin: 0 0 10px 0;
        float: none;
        display: block;
    }

    div#autbContenitoreBarra a#autbRicordaPassword, div#autbContenitoreBarra div.autbErrori {
        position: initial;
        margin-top: 0;
        margin-bottom: 5px;
    }
}