/*** Media queries style sheet for the login page ***/
@media screen and (min-width:1200px) {
    .col-md-5custom {
        width: 20%;
        padding-left: 0;
        padding-right: 10px;
    }
}

@media screen and (max-width:1200px) {
    .login-container {
        width: 50%;
    }
    .col-md-5custom {
        width: 20%;
        padding-left: 0;
        padding-right: 10px;
    }
}

@media screen and (max-width:991px) {
    .login-container {
        top:5%;
        width: 60%;
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
    }
    #IdentityProvidersList {
        padding-bottom: 15px;
    }
    .col-md-5custom {
        width: 100%;
        padding: 0px 15px 15px 15px;
    }
    div[data-existing="true"] {
        padding: 15px 15px 0 0;
    }
    .login-title {
        font-size: 170%;
        padding: 10px 0 10px 0;
    }
    .login-btn {
        padding: 10px 5px;
    }
    .alert {
        margin-top: 0;
    }
    #BasicLogin>div>div +div{
        margin-top: 15px;
    }
    .login-pw-options {
        text-align: center;
    }
    .login-btn{
        max-width: none;
    }
    #err-msg-prov .alert {
        margin-top: 15px;
    }
    .ra-icon-size {
        font-size: 2rem;
        vertical-align: text-bottom;
    }
}

@media screen and (max-width:768px) {
    .login-container {
        width: 67%;
    }
}

@media screen and (max-width:568px) {

    .login-container {
        top:0;
        width: 100%;
        box-shadow: none;
        background-color:none;
        padding: 35px;
    }
    .login-title {
        font-size: 130%;
    }
    .imgLoginLogo {
        width: 95%;
    }
}
@media screen and (max-width:480px) and (orientation:portrait) {
    .login-container {
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    .well {
        margin-bottom: 15px;
    }
    .panel {
        margin-bottom: 15px;
    }
    .login-container {
        padding: 25px;
    }
    .login-btn {
        padding: 7px 5px;
    }
    .input-group .form-control {
        height: 31px;
    }
    .login-title {
        padding: 0;
    }
    .panel-body {
        padding: 10px;
    }
    .logo-wrapper{
        display: none;
    }
}
@media screen and (max-width:320px) and (orientation:portrait) {
    .login-container {
        top: 0;
        -webkit-transform: translate(-50%, 0);
                transform: translate(-50%, 0);
    }
}

@media screen and (max-width:767px) and (orientation:landscape) {
    .logo-wrapper{
        display: none;
    }
}