* {
    box-sizing: inherit;
}

html {
    height: 100%;
    box-sizing: border-box;
    font-size: 62.5%;
}

@media only screen and (min-width: 993px) {
    body {
        /*background: url("../../../Web/common/img/login/wtc-start.jpg") no-repeat;*/
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
        font-size: 1.4rem;
        /*overflow-x: hidden;*/
        /*height: 100vh;*/
        /*width: 100%;*/
        /*float: left;*/
        box-sizing: border-box;
        background-size: cover;
        background-position: center center;
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        background-color: rgba(33, 37, 41, .85) !important;
        height: 101%;
        max-height: 100%;
        min-width: 50rem;
        min-height: 100%;
        margin: 0;
    }

    .main-container {
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        /*background-color: rgba(189, 189, 189,.9);*/
        height: 101%;
        max-height: 100%;
        min-width: 50rem;
        min-height: 100%;
        width: 100%;
    }

    .main-container2fa {
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        /*background-color: rgba(189, 189, 189,.9);*/
        height: 101%;
        max-height: 100%;
        min-width: 50rem;
        min-height: 100%;
        width: 100%;
        margin: 0;
        padding: 2% !important;
        display: table !important;
        text-align: center !important;
    }
}

@media only screen and (max-width: 992px) {
    .main-container {
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        padding: 0px 20px 0px 20px;
        max-width: 400px;
    }

    body {
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
        font-size: 1.4rem;
        box-sizing: border-box;
        background-size: cover;
        background-position: center center;
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        background-color: rgba(33, 37, 41, .85) !important;
        margin-top: 10%;
    }

    .main-container2fa {
        -webkit-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
    }
}

@media only screen and (min-width: 993px) {
    #containerLogin {
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        background-color: #fff;
        /*background-color: rgba(33, 37, 41, .95) !important;*/
        border: 1px solid #e3e3e3;
        box-shadow: 0 5px 30px 0 #000;
        display: block;
        float: none;
        margin: auto;
        max-width: 45rem;
        min-height: 30rem;
        min-width: 0;
        padding: 40px 80px 50px;
        position: relative;
        width: 100%;
        z-index: 1;
        box-sizing: border-box;
        vertical-align: top;
    }

    .containerLogin2FACode {
        display: inline-flex !important;
        text-align: -webkit-auto !important;
        height: 100% !important;
        margin-right: 20px !important;
    }

    .containerLogin2FAInstruction {
        display: inline-flex !important;
        text-align: -webkit-auto !important;
        height: 100% !important;
        margin-left: 20px !important;
    }
}

@media only screen and (max-width: 992px) {
	body {height: calc(100vh - 75px);margin-top: 0;align-items: center;justify-content: center;}
	
	#containerLogin {
        -webkit-flex-grow: 0;
        flex-grow: 0;
        -webkit-flex-shrink: 0;
        flex-shrink: 0;
        background-color: #fff;
        border: 1px solid #e3e3e3;
        box-shadow: 0 5px 30px 0 #000;
        display: block;
        float: none;
        margin: auto;
        /*max-width: 30rem;*/
        min-height: 30rem;
        min-width: 0;
        padding: 15px 20px 15px;
        position: relative;
        width: 100%;
        z-index: 1;
        box-sizing: border-box;
        vertical-align: top;
        border-radius: 8px;
    }

    #inputdiv {
        font-size: 16px;
    }

    .containerLogin2FACode {
        display: inline-flex !important;
        text-align: -webkit-auto !important;
        height: 100% !important;
    }

    .containerLogin2FAInstruction {
        display: inline-flex !important;
        text-align: -webkit-auto !important;
        height: 100% !important;
        margin-top: 20px !important;
    }

    .container-inside-auth {
        padding: 0px 40px 0px 40px;
    }
	#login-header img {width: 70px !important;}
	#login-header .login-header-title {font-size: 22px !important;font-weight: 500 !important;padding: 16px 0 !important;}
	
	form#login input[type=text], form#login input[type=email], form#login input[type=password] {border-radius: 8px;text-transform: lowercase;letter-spacing: 0px !important;height: 45px;text-align: left;margin: 10px 0;}

	#submitdiv input[type="submit"] {border-radius:8px !important;font-size:14px !important;font-weight:500 !important;}
}


#login-header {
    line-height: 1.36;
    font-size: 1.4rem;
    text-align: center;
}

    #login-header img {
        padding: 3px;
        width: 100px;
        max-width: 100%;
        border: 0px;
        height: auto;
        /*background-color: rgb(33, 37, 41);*/
    }

    #login-header .login-header-title {
        color: rgb(47,50,58);
        /*color: #fff;*/
        font-size: 2.6rem;
        font-weight: 300;
        line-height: 1.2;
        /*margin: -1rem 0 2.5rem;*/
        padding: 30px 0px;
        display: block;
    }

#submitdiv {
    padding: 20px 0px;
    text-align: center;
}

form#login input {
    border-radius: 0px;
}



#inputdiv input {
    width: 100% !important;
    background: repeat-x scroll 0 0 rgba(233, 233, 233, 0.5) !important;
    color: rgb(47,50,58) !important;
    margin: 15px 0px 15px 0px;
    padding: 8px;
    border: 0px;
}

::-webkit-input-placeholder {
    letter-spacing: 1px;
	text-align:left;
}

:-moz-placeholder { /* Firefox 18- */
    letter-spacing: 1px;
	text-align:left;
}

::-moz-placeholder { /* Firefox 19+ */
    letter-spacing: 1px;
	text-align:left;
}

:-ms-input-placeholder { /* IE 10+ */
    letter-spacing: 1px;
	text-align:left;
}

::-ms-input-placeholder { /* Edge */
    letter-spacing: 1px;
	text-align:left;
}

:placeholder-shown { /* Standard one last! */
    letter-spacing: 1px;
	text-align:left;
}


form#login input[type=submit] {
    letter-spacing: 1px;
}

form#login input[type=text],
form#login input[type=email],
form#login input[type=password] {
    background: repeat-x scroll 0 0 #eaebec !important;
    border: 1px solid rgb(189,189,189) !important;
	text-align:left;
}

    form#login input[type=text]:focus,
    form#login input[type=password]:focus {
        background: repeat-x scroll 0 0 #fff !important;
        border: 1px solid rgb(189,189,189) !important;
    }

#submitdiv input {
    width: 100% !important;
    color: #fff !important;
    border: 1px solid #fff;
    background-color: rgb(47,50,58) !important;
    /*background: url("../../../Web/common/img/login/submit.png") no-repeat scroll 0 0 transparent;*/
    box-shadow: none;
    margin: 0px;
    line-height: 43px;
    font-size: 1.6rem !important;
    cursor: pointer;
}

    #submitdiv input:hover {
        background-color: rgb(57,60,68);
        border: 1px solid rgb(189,189,189) !important background: url("../../../Web/common/img/login/submit-rollover.png") no-repeat scroll 0 0 transparent;
    }

#submitdiv .okbutton {
    /*background: url("../../../Web/common/img/login/confirmlogin.png") no-repeat scroll 0 0 transparent;*/
    /*border-radius:10px;*/
    background-color: rgb(97, 189, 109) !important;
}

#login-message {
    padding: 10px 0px;
}

    #login-message span {
        background: rgba(244, 44, 44, .95);
        font-size: 1.6rem !important;
        text-align: center;
        color: #fff;
        letter-spacing: 1px;
        line-height: 25px;
        width: 100%;
        display: inline-block;
    }
	#login-message span {font-size:14px !important;padding:10px;border-radius:8px;line-height:1.6;}

#loader {
    position: absolute;
    margin: auto;
    margin-top: 0.5em;
    width: auto;
    z-index: 100;
    text-align: center;
    padding: 0px 29%;
}

/*
    #endregion
*/
/*
.browsers 
{
    font-family: Tahoma;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 1px;
    text-align: center;
    width: 100%;
    color: #A3ADB3;
    font-weight:bold;
}
*/

.login-footer {
    color: #989287;
    font-size: 1rem;
    font-weight: 400;
    left: 0;
    margin: 5rem 0 2rem;
    position: absolute;
    text-align: center;
    top: 100%;
    width: 100%;
}

.login-footer2fa {
    color: #989287;
    font-size: 1rem;
    font-weight: 400;
    left: 0;
    margin: 5rem 0 2rem;
    position: absolute;
    text-align: center;
    top: 100%;
    width: 100%;
    top: unset;
}

    .login-footer img, .login-footer2fa img {
        padding: 3px;
        width: 200px;
        max-width: 100%;
        border: 0px;
        height: auto;
    }

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: rgb(47,50,58);
    text-align: center;
}

::-moz-placeholder { /* Firefox 19+ */
    color: rgb(47,50,58);
    text-align: center;
}

:-ms-input-placeholder { /* IE 10+ */
    color: rgb(47,50,58);
    text-align: center;
}

:-moz-placeholder { /* Firefox 18- */
    color: rgb(47,50,58);
    text-align: center;
}

.centertext {
    text-align: center;
}

.alert-message {
    font-size: 1.6rem !important;
    text-align: center;
    color: #fff;
    letter-spacing: 1px;
    padding: .5rem;
    line-height: 2.5rem;
    margin: .8rem 0rem;
}

    .alert-message a {
        color: #fff;
        font-weight: 600;
    }

.error-message {
    background: rgba(244, 44, 44, .95);
}

.success-message {
    background: rgba(44, 104, 44, .95);
}
