/* NYX */

@charset "UTF-8";
#login-external::-webkit-input-placeholder {
    color: #eff3f4;
}
.login-content .ui-panelgrid {
    border:0px;
}
#login-external:-moz-placeholder {
    color: #eff3f4;
}
#login-external::-moz-placeholder {
    color: #eff3f4;
}
#login-external:-ms-input-placeholder {
    color: #eff3f4;
}
#login-external body {
    color: #403e3e;
    font-size: 12px;
}
#login-external a {
    text-decoration: none;
}

#login-external {
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;
    display: table;
    height: 100%;
    position: absolute;
    width: 100%;
}
#login-external .login-container {
    display: table-cell;
    vertical-align: middle;
}
#login-external .firstcontainer-login {
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
    width: 80%;
}
#login-external .login-internal {
    background-color: #fff;
    background-image: url("/VpeBackEnd/faces/javax.faces.resource/images/login/background_login.png?v=1.0");
    background-position: left;
    background-position: top center;
    background-repeat: repeat-y;
    border-radius: 0px 8px 8px 8px;
    font-family: "Arial", serif;
    margin-left: 40px;
}
#login-external .ico_login-sx {
    background-image: url("/VpeBackEnd/faces/javax.faces.resource/images/login/background_continer.png?v=1.0");
    background-position: left top;
    background-repeat: no-repeat;
    display: block;
    float: left;
    height: 120px;
    width: 40px;
}
#login-external .background-login {
    background-image: url("/VpeBackEnd/faces/javax.faces.resource/images/login/background_continer.png?v=1.0");
    background-position: right bottom;
    background-repeat: no-repeat;
    display: block;
    height: 44px;
    width: 100%;
}
#login-external .login-header {
    color: #9aa4a6;
    font-family: 'lightbox-title';
    font-size: 100%;
    margin-bottom: 5%;
    padding-left: 20px;
    padding-top: 20px;
}
#login-external .login-content {
    padding-left: 20px;
    padding-right: 20px;
}
#login-external .login-form input {
    
    background-position: left center;
    background-repeat: no-repeat;
    border-radius: 4px 4px 4px 4px;
    font-size: 14px;
    height: 30px;
    margin-bottom: 13px;
    /*padding-left: 46px;*/
    border-radius: 0px;
    width: 96%;
}

.login-form {
    margin-bottom:24px;
}
#login-external .login-form .inputSubmit {
    background-color: #9aa4a6;
    border: solid 1px #b0b7b8;
    border-radius: 4px 4px 4px 4px;
    color: #eff3f4;
    cursor: pointer;
    float: right;
    font-size: 18px;
    height: 30px;
    margin: 13px 0px 13px 0px;
    padding: 0px;
    width: 120px;
}
#login-external .login-form button:hover {
    background-color: #737b7c;
}
#login-external .login-form {
    float: left;
    width: 52%;
}
.login-logo img {
    margin-top: -18px;
    width: 90%;
    /*float:left;*/
}
#login-external .login-logo {
    float: left;
    text-align: center;
    display: block;
    height: 170px;
    width: 46%;
    position:relative;
}
.app-version {
    position: absolute;
    bottom:16px;
    right:0px;
}
#login-external .login-footer {
    color: #afb1b7;
    font-size: 11px;
    margin-top: 10px;
    padding: 0px 10px 20px 10px;
    text-align: center;
}
#login-external .login-user::-webkit-input-placeholder,
#login-external .login-psw::-webkit-input-placeholder,
#login-external .login-user:-moz-placeholder,
#login-external .login-psw:-moz-placeholder,
#login-external .login-user::-moz-placeholder,
#login-external .login-psw::-moz-placeholder,
#login-external .login-user:-ms-input-placeholder,
#login-external .login-psw:-ms-input-placeholder {
    color: #eff3f4;
}
#login-external .login-user {
    width: 100%;
}
#login-external .login-psw {
    width: 100%;
}
#login-external button {
    border-radius: 0px!important
}
#login-external .ui-button .ui-button-text {
    height: 18px;
}
#login-external .ui-button {
    margin-right: 0px;
}
#login-external .login-content .ui-panelgrid .ui-panelgrid-cell {
    border: 0px;
}
/*GESTIONE ERRORI */

#login-external .ui-messages-error {
    background-color: #f1ba12;
    border-color: #eed3d7;
    border-radius: 0px;
    border: 0px!important;
    padding: 8px;
    margin: 0px 0px 13px;
    width: 95%;
    color: #fff;
}
#login-external .ui-message-error-detail {
    padding-left: 33px;
}
#login-external .ui-message-error-summary {
    display: block;
}
/*||| MEDIA QUERY SMARTPHONE PORTRAIT ||| */

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
    #login-external .login-form {
        width: 100%;
    }
    #login-external .login-form .inputSubmit {
        font-size: 70px;
        height: 100px;
        padding: 0px;
        width: 100%;
    }
    #login-external .login-logo {
        /*width: 100%;*/
    }
    #login-external .login-logo img {
        margin-left: auto;
        margin-right: auto;
        margin-top: 2px;
        width: 100%;
    }
    .background-login {
        background-image: url("/VpeBackEnd/faces/javax.faces.resource/images/login/background_login.png?v=1.0");
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 90%;
        display: block;
        height: 57px;
        width: 100%;
    }
    .ico_login-sx {
        display: none;
    }
    #login-external .login-header {
        color: #9aa4a6;
        font-family: 'lightbox-title';
        font-size: 5.3rem;
        text-align: center;
        padding-top: 60px;
    }
    .remember a {
        font-size: 3.3rem;
        text-align: center;
    }
    #login-external .login-internal {
        border-radius: 40px 40px 40px 40px;
        margin-left: 0px;
    }
    .firstcontainer-login {
        max-width: 900px;
        width: 90%;
    }
    #login-external .login-footer {
        font-size: 31px;
    }
}
/*||| MEDIA QUERY SMARTPHONE LANDASCAPE ||| */

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
    #login-external .login-form {
        width: 100%;
    }
    #login-external .login-form .inputSubmit {
        font-size: 30px;
        height: 40px;
        padding: 0px;
        width: 100%;
    }
    #login-external .login-logo {
        float: none;
        width: 100%;
    }
    #login-external .login-logo img {
        margin-left: auto;
        margin-right: auto;
        margin-top: 2px;
        width: 100%;
    }
    .background-login {
        display: none;
    }
    .ico_login-sx {
        display: none;
    }
    #login-external .login-header {
        color: #9aa4a6;
        font-family: 'lightbox-title';
        font-size: 3.3rem;
        text-align: center;
        padding-top: 10px;
        margin-bottom: 4px;
    }
    .remember a {
        font-size: 1.3rem;
    }
    #login-external .login-internal {
        border-radius: 40px 40px 40px 40px;
        margin-left: 0px;
    }
    .firstcontainer-login {
        max-width: 900px;
        width: 90%;
    }
    #login-external .login-footer {
        font-size: 11px;
    }
}
/*||| MEDIA QUERY DESKTOP RESIZE ||| */

@media screen and (min-width: 320px) and (max-width: 660px) {
    #login-external .login-form {
        width: 100%;
        float:none;
    }
    #login-external .login-form .inputSubmit {
        width: 100%;
        padding: 0px;
    }
    #login-external .login-logo {
        
        width: 100%;
    }
    #login-external .login-logo img {
        margin-left: auto;
        margin-right: auto;
        width: 50%;
        margin-top: 2px;
    }
    .background-login {
        background-image: url("/VpeBackEnd/faces/javax.faces.resource/images/login/background_continer.png?v=1.0");
        background-position: right bottom;
        background-size: 90%;
        background-repeat: no-repeat;
        display: block;
        height: 15px!important;
        width: 100%;
    }
}