/*BIG PAGE*/
.loginBigPageContainer {
    min-height: auto;
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-between;
}

.loginBigPageContainer .loginPageSize {
    min-width: 768px;
    min-height: 170px;
    display: inline-flex;
    align-items: center;
    flex-direction: column;
}

.loginBigPageContainer .loginPageSize .loginForms {
    min-width: 450px;
    min-height: 170px;
    margin-left: -10px;
}
/*User Message Tooltip*/
.loginBigPageContainer .loginForms .userMessageTooltip{
    position: absolute;
    transform: translate(440px,20px);
    z-index: 100;
    max-width: 268px;
    color: #555555;
    border: #f1d031 solid 1px;
}

.loginBigPageContainer .loginForms .userMessageTooltip .userMessageTooltipArrow {
    content: "";
    position: absolute;
    top: 48px;
    left: -8px;
    border-width: 5px 8px 5px 0;
    border-style: solid;
    border-color: transparent #f1d031 transparent transparent;
    z-index: 101;
}
.loginBigPageContainer .loginForms .userMessageTooltip .title{
    background-color: #FFEF93;
    font-size: 10px;
    font-weight: bold;
    padding: 3px 8px;

}
.loginBigPageContainer .loginForms .userMessageTooltip .text{
    background-color: #ffffa3;
    text-align: left;
    font-size: 10px;
    padding: 5px 8px;
    line-height: 1;
}
.loginBigPageContainer .loginForms .userMessageTooltip .text a{
    text-decoration: underline;
    color: #065279;
}
.loginBigPageContainer .loginForms .userMessageTooltip .text a:hover{
    text-decoration: none;
}
/*End User Tooltip*/

.loginBigPageContainer .loginForms .loginForms-Title {
    font-size: 18px;
}


.loginBigPageContainer .loginForms .loginForms-LoginForm {
    height: 23px;
    margin-left: 37px;
}

.loginBigPageContainer .loginForms .loginForms-PasswordForm {
    height: 23px;
    margin-left: 38px;
}

.loginBigPageContainer .loginForms .loginForms-P-Button, .loginBigPageContainer .loginForms-ForgotPassword {
    margin-left: 93px;
}



.loginBigPageContainer .password-error,
.loginBigPageContainer .login-error {
    margin-left: 93px;
    margin-bottom: -2px;
    color: red;
}

.loginBigPageContainer .loginForms .content-alert {
    margin-left: 93px;
    margin-bottom: 10px;
    color: red;
    word-wrap: break-word;
    width: 280px;
}

.loginBigPageContainer .loginForms-ForgotPassword a {
    font-size: 11px;
    color: #065279;
    text-decoration: underline;
}

.loginBigPageContainer .captcha {
    margin-bottom: 10px;
    margin-left: 38px;
    display: flex;
    justify-content: center;
}

.loginBigPageContainer .afterLoginButtonLink {
    display: inline-block;
    text-decoration: underline;
    margin-left: 5px;
    transform: translatey(8px);
}
.loginBigPageContainer .afterLoginButtonLink a{
    font-size: 11px;
    color: #065279;
    text-decoration: underline;

}
.loginBigPageContainer .afterLoginButtonLink a:hover {
    color: #065279;
    text-decoration: none;
}

.loginBigPageContainer .loginForms-ForgotPassword a:hover {
    color: #065279;
    text-decoration: none;
}

.loginBigPageContainer .loginForms .loginForms-Button {
    width: 90px;
    height: 2.3em;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: #bfce28;
    border-bottom-color: #404040;
    color: #000000;
    text-shadow: 1px 1px 1px #ffffff;
    font-size: 1.3em;
    text-decoration: none;
    cursor: pointer;
    background: #CBDB2A;

}

.loginBigPageContainer .loginForms .loginForms-Button:hover:enabled {
    background-color: #d5e72d;
    border-color: #cfdf2b;
    border-bottom-color: #404040;
}

.loginBigPageContainer .iframePageSize {
    width: 100%;
    height: 930px;
    margin-top: 20px;
}
.loginBigPageContainer .iframePageSize iframe{
    height: 100%;
    width: 100%;
    display: block
}

/*Login Tooltip*/
.tooltipLoginInfoButton {
    display: inline-block;
    text-decoration: none;
    margin-left: 5px;
    background: url("../img/template/icons/help.png") no-repeat top;
    border: none;
    background-size: 15px;
    width: 15px;
    height: 15px;
}
.tooltipLoginInfoButton:focus {
    outline: none;
}

.tooltipLoginInfoButton .tooltipLoginInfoInside {
    visibility: collapse;
    width: 300px;
    transform: scale(1) translate(1%, -128%);
    padding: 0;
    color: black;
    background-color: white;
    font-weight: normal;
    font-size: 10.5px;
    line-height: normal;
    position: absolute;
    border-width: 1px;
    border-color: #f1f1f1;
    border-style: solid;
    z-index: 2;
    cursor: auto;
    user-select: text;
}

.tooltipLoginInfoButton .show {
    visibility: visible;
}

.tooltipLoginInfoInside .tooltipTitle {
    width: auto;
    color: black;
    font-weight: bold;
    text-align: left;
    background-color: #f1f1f1;
    padding: 3px 10px 3px 10px;
}

.tooltipLoginInfoInside .tooltipText {
    text-align: left;
    padding: 3px 10px 3px 10px;
}
.tooltipLoginInfoInside .tooltipText:after {
    content: "";
    position: absolute;
    top: 61px;
    left: 0px;
    border-width: 12px 10px 0px 0px;
    border-style: solid;
    border-color: white transparent transparent transparent;
}

/*tooltip Password*/
.tooltipPasswordInfoButton {
    display: inline-block;
    text-decoration: none;
    margin-left: 3px;
    background: url("../img/template/icons/help.png") no-repeat top;
    border: none;
    background-size: 15px;
    width: 15px;
    height: 15px;
}

.tooltipPasswordInfoButton:focus {
    outline: none;
}

.tooltipPasswordInfoButton .tooltipPasswordInfoInside {
    visibility: collapse;
    width: 245px;
    transform: scale(1) translate(1%, -113%);
    padding: 0;
    color: black;
    background-color: white;
    font-weight: normal;
    font-size: 10.5px;
    line-height: normal;
    position: absolute;
    border-width: 1px;
    border-color: #f1f1f1;
    border-style: solid;
    cursor: auto;
    user-select: text;
}

.tooltipPasswordInfoButton .show {
    visibility: visible;
}

.tooltipPasswordInfoInside .tooltipTitle {
    width: auto;
    color: black;
    font-weight: bold;
    text-align: left;
    background-color: #f1f1f1;
    padding: 3px 10px 3px 10px;
}

.tooltipPasswordInfoInside .tooltipText {
    text-align: left;
    padding: 3px 10px 3px 10px;
    z-index: 2;
}

.tooltipPasswordInfoButton .tooltipPasswordInfoInside a {
    color: #065279;
    text-decoration: underline;
}

.tooltipPasswordInfoButton .tooltipPasswordInfoInside a:hover {
    color: #065279;
    text-decoration: none;
}

.tooltipPasswordInfoButton .tooltipPasswordInfoInside:after {
    content: "";
    position: absolute;
    top: 130px;
    left: 0px;
    border-width: 10px 10px 0px 0px;
    border-style: solid;
    border-color: white transparent transparent transparent;
}

/*Small PAGE*/

.loginSmallPageContainer {
    min-width: 350px;
    max-width: 996px;
    height: auto;
    display: none;
    align-items: center;
    flex-direction: column;
    justify-content: space-around;
    background-color: #dddddd;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 20px;
}

.loginSmallPageContainer .loginPageSize {
    min-width: 350px;
    max-width: 996px;
    width: 97%;
    height: 100%;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 10px 10px 20px 10px;

}

.loginSmallPageContainer .loginForms-Title .title {
    font-size: 20px;
    font-weight: bold;
    word-wrap: break-word;
    text-transform: uppercase;
}

.loginSmallPageContainer .alert {
    display: block;
    color: red;
    font-size: 15px;
    padding: 0px;
    margin-bottom: 0px;
    min-width: 320px;
    max-width: 768px;
    width: auto;
}

.loginSmallPageContainer .loginForms-Login{
    margin-top: 20px;
}

.loginSmallPageContainer .loginForms-Login .description {
    font-size: 15px;
    font-weight: bold;
}

.loginSmallPageContainer .loginForms-Login .loginForms-LoginForm,
.loginSmallPageContainer .loginForms-Password .loginForms-PasswordForm {
    display: block;
    height: 48px;
    width: 100%;
    padding: 10px;
    font-size: 18px;
}

.loginSmallPageContainer .loginForms-Password .description {
    font-size: 15px;
    font-weight: bold;
}


.loginSmallPageContainer .login-error{
    display: none;
    color: red;
    font-size: 15px;
}

.loginSmallPageContainer .password-error {
    display: none;
    color: red;
    font-size: 15px;
    margin-bottom: 0px;
}


.loginSmallPageContainer .captcha {
    margin-bottom: 30px;
    margin-top: 30px;
    display: flex;
    justify-content: center;
}

.loginSmallPageContainer .loginForms .loginForms-Button {
    width: 87px;
    height: 2.3em;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;
    border-color: #bfce28;
    border-bottom-color: #404040;
    color: #000000;
    text-shadow: 1px 1px 1px #ffffff;
    font-size: 1.3em;
    text-decoration: none;
    cursor: pointer;
    background: #CBDB2A;

}

.loginSmallPageContainer .loginForms .loginForms-Button:hover:enabled {
    background-color: #d5e72d;
    border-color: #cfdf2b;
    border-bottom-color: #404040;
}

.loginSmallPageContainer .loginForms-ForgotPassword {
    text-align: right;
    margin-bottom: 10px;
    margin-top: 40px;
}

.loginSmallPageContainer .userTermsAndConditions {
    text-align: right;
    margin-top: -30px;
}

.loginSmallPageContainer .userTermsAndConditions a,
.loginSmallPageContainer .loginForms-ForgotPassword a {
    color: #fff;
    padding: 9px;
    text-decoration: none;
    background-color: #666;
    border: 1px solid #666;
    border-radius: 3px;
    font-size: 16px;
}

.loginSmallPageContainer .iframePageSize {
    min-width: 350px;
    max-width: 996px;
    width: 100%;
    height: 2100px;
    margin-top: 15px;
}

.loginSmallPageContainer .iframePageSize iframe {
    width: 100%;
    height: 100%;
}

.loginSmallPageContainer .footer {
    min-width: 350px;
    max-width: 768px;
    width: 100%;
    height: 100%;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
}

.loginSmallPageContainer .footer .footerDescription {
    width: 100%;
    height: 20px;
    font-size: 14px;
    color: #999999;
    margin-left: 10px;
    margin-top: 10px;
}

.loginSmallPageContainer .footer .footerLinks {
    width: 100%;
    height: auto;
    border-bottom: 1px solid #E5E5E5;
    font-size: 14px;
}

.loginSmallPageContainer .footerLinks ul {
    table-layout: fixed;
}

.loginSmallPageContainer .footerLinks li {
    float: left;
    display: table-cell;
    width: 140px;
    color: #ccc;
}

.loginSmallPageContainer .footerLinks li a {
    text-align: center;
    text-decoration: none;

}

.loginSmallPageContainer .footerLinks li a:hover {
    text-decoration: underline;

}

.loginSmallPageContainer .footer .copyrights {
    width: 330px;
    height: 27px;
    align-self: end;
    font-size: 14px;
    color: #999999;
    margin-top: 8px;
    margin-bottom: 10px;
    word-wrap: break-word;
}
/*Login Mobile Tooltip*/
.loginSmallPageContainer .loginMobileTooltipImage {
    display: inline-block;
    background: url("../img/template/icons/help.png") no-repeat top;
    background-size: 18px;
    height: 18px;
    width: 18px;
}
.loginSmallPageContainer .loginMobileTooltip {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    background-color: rgba(241,241,241, 1);
}
.loginSmallPageContainer .loginMobileTooltip .tooltipTitle{
    width:100%;
    background: white;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-left: 15px;
    padding-right: 15px;
}
.loginSmallPageContainer .loginMobileTooltip .tooltipTitle .titleInside{
    font-size: 20px;
    transform: translateY(10px);
}
.loginSmallPageContainer .loginMobileTooltip .tooltipTitle .closeInside{
    font-size: 32px;
    color: black;
}

.loginSmallPageContainer .loginMobileTooltip .tooltipText {
    padding: 15px;
    position: relative;
    width: 100%;
    font-size: 18px;
    text-align: left;
}

/*tooltip Password*/
.loginSmallPageContainer .passwordMobileTooltipImage{
    display: inline-block;
    background: url("../img/template/icons/help.png") no-repeat top;
    background-size: 18px;
    height: 18px;
    width: 18px;
}

.loginSmallPageContainer .passwordMobileTooltip {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    background-color: rgba(241,241,241, 1);
}
.loginSmallPageContainer .passwordMobileTooltip .tooltipTitle{
    width:100%;
    background: white;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-left: 15px;
    padding-right: 15px;
}
.loginSmallPageContainer .passwordMobileTooltip .tooltipTitle .titleInside{
    font-size: 20px;
    transform: translateY(10px);
}
.loginSmallPageContainer .passwordMobileTooltip .tooltipTitle .closeInside{
    font-size: 32px;
}

.loginSmallPageContainer .passwordMobileTooltip .tooltipText {
    padding: 15px;
    position: relative;
    width: 100%;
    font-size: 18px;
    text-align: left;
}
.loginSmallPageContainer .passwordMobileTooltip .tooltipText a{
    text-decoration: underline;
    color: #065279;
}
.loginSmallPageContainer .passwordMobileTooltip .tooltipText a:hover{
    text-decoration: none;
    color: #065279;
}


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

    .loginBigPageContainer {
        display: none;
    }

    .loginSmallPageContainer {
        display: flex;
    }
}

@media only screen and (min-width: 420px){
    .loginSmallPageContainer .iframePageSize {
        height: 460vw;

    }
}
@media only screen and (min-width: 470px){
    .loginSmallPageContainer .iframePageSize {
        height: 400vw;
    }
}
@media only screen and (min-width: 550px){
    .loginSmallPageContainer .iframePageSize {
        height: 320vw;
    }
}
@media only screen and (min-width: 680px){
    .loginSmallPageContainer .iframePageSize {
        height: 210vw;
    }
}
@media only screen and (min-width: 750px){
    .loginSmallPageContainer .iframePageSize {
        height: 180vw;
    }
}
@media only screen and (min-width: 850px){
    .loginSmallPageContainer .iframePageSize {
        height: 150vw;
    }
}
@media only screen and (min-width: 900px){
    .loginSmallPageContainer .iframePageSize {
        height: 115vw;
    }
}

@-moz-document url-prefix() {
    .helpTooltipButton {
        height: 28px;
        margin-bottom: -13px;
    }
    .tooltipLoginInfoButton{
        height: 28px;
        margin-bottom: -13px;
    }
    .tooltipPasswordInfoButton{
        height: 28px;
        margin-bottom: -13px;
    }
}