﻿.preHeader {
    background:#fff; padding:20px 0; height:64px;
}
.cannot_login { margin:32px auto; }
.cannot_loginPaper { padding:64px; border-radius:8px; background:#fff; }
.cannot_Loginpagehead { font-size:22px; margin-bottom:32px; }
.cannot_loginrecover{ font-size:16px; font-family:'Interstate-Light';margin-bottom:8px; }

/*Input field*/
.LoginForm {
    display:-webkit-flex; display:flex; width:100%;
    -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
    .LoginForm > .form-group {
        display:flex; width:100%; margin-bottom:0;
        -webkit-flex-wrap:wrap; flex-wrap:wrap;
    }

.LoginTextFields {
    width:100%; position:relative; display:flex; flex-wrap:wrap;
}

/*Text Field css Start here*/
.darkbordered .mdl-textfield__input {
    background: rgba(0,0,0,.09); padding: 16px 10px 0 16px; border-radius: 4px 4px 0 0;
    height:56px; width:100%; border:none; border-bottom:solid 1px #666366;
}

.darkbordered .mdl-textfield__label {
    margin:0; bottom:0px; left:0; right:0; padding:0 16px; color:#666666; font-size:16px; pointer-events:none; position:absolute;
    font-family:'Interstate-Light';
}

.mdl-textfield--floating-label .mdl-textfield__label {
    transition-duration:.2s; transition-timing-function:cubic-bezier(.4,0,.2,1);
}

.mdl-textfield__label:after {
    background-color:#007A53; bottom:20px; content:''; height:2px; left:45%; position:absolute; transition-duration:.2s; 
    transition-timing-function:cubic-bezier(.4,0,.2,1); visibility:hidden; width:10px;
}

.darkbordered .mdl-textfield__label:after {
    bottom:10px;
}

.mdl-textfield.is-focused .mdl-textfield__label:after {
    left:0; visibility:visible; width:100%;
}

.darkbordered .mdl-textfield--floating-label.is-dirty .mdl-textfield__label, .darkbordered .mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
    color:#696969; font-size:12px; top:15px; visibility:visible;
}
/*.darkbordered .mdl-textfield__input:valid ~ label.mdl-textfield__label{
    color: #696969; font-size: 12px; top: 20px; visibility: visible;
}
.darkbordered .mdl-textfield__input:-webkit-autofill ~ .mdl-textfield__label {
    color: #696969; font-size: 12px; top: 20px; visibility: visible;
}*/
/*Text Field css END Here*/
.mdl-textfield__error {
    color:#d50000; position:absolute; font-size:12px; margin-top:3px; visibility:hidden; display:block;
}

.mdl-textfield.is-invalid .mdl-textfield__error {
    visibility:visible;
}

.darkbordered .mdl-textfield .mdl-button {
    position:absolute; bottom:22px; right:15px; display:inline-flex; justify-content:center; align-items:center; color:#666666;
}
.mdl-button { width:32px; height:32px; overflow:hidden; }
    .mdl-button:hover { background-color:rgba(158, 158, 158, .2); }
.loginbutton > .mdl-button.mdl-js-button {
    font-size:16px; display:flex; width:100%; height:auto; justify-content:center; padding:2px 10px; margin:24px 0 16px;
    font-family:'Interstate-Regular'; border-radius:8px; border:0px; box-shadow:none;
}
/*input text field style END here*/
.cannot_back.bckbtn, .cannot_back.rtrnbtn, .cannot_cancel { padding:32px 0 0; text-align:center; }
.cannot_back.bckbtn a, .cannot_back.rtrnbtn a, .cannot_cancel a { color:#007A53; font-size:16px; text-decoration:underline; font-family:'Interstate-Light'; }

.cannot_loginPaper .mdRadio label{ margin-right:24px; font-size:16px; font-weight:normal; }

.regis_radioboxtop.mdRadio { margin-bottom:20px; }
.regis_radioboxtop.mdRadio .mdl-radio__outer-circle { /*width:20px; height:20px; top:2px;*/ transform: scale(1.25); }
    .regis_radioboxtop.mdRadio .mdl-radio__inner-circle { /*margin-left: .5px; left: 5.2px; top: 6.4px;width:10px; height:10px;*/ }
.mdl-radio.is-checked .mdl-radio__inner-circle {
    transform: scale(1.25);
}

.regis_radioboxtop span.mdl-radio__label {
    font-size: 16px;
    line-height: 20px;
    font-family: 'Interstate-Regular';
    padding-right: 32px;
    padding-left: 6px;
}

#successHeader { font-size:22px; font-family:'Interstate-Bold'; text-align:center; margin-bottom:32px;}
.recovery_email > p { font-size:16px; font-family:'Interstate-Light'; text-align:center; }

/*forgot Password*/
.step_third .cannot_username label { font-size:16px; font-family:'Interstate-Bold'; margin:8px 0 6px; }
.step_third .cannot_reset_des { font-size: 16px; font-family: 'Interstate-Light'; padding-right: 12%; margin:14px 0 8px; }
.re_recovery .list-group.extralinks li{ text-align:center; padding-top:16px; }
.re_recovery .list-group.extralinks li a{ text-decoration:underline; font-size:16px; font-family:'Interstate-Light'; color:#007A53; }

.step_third .regis_radioboxtop.mdRadio > label { width:100%; margin-bottom:8px; }
/*forgot password success*/
.successHead {
    text-align: center;
}
.successHead .successtext { margin-bottom:16px; }
.successHead i {background: #007a53;color: #fff;border-radius: 50%;padding: 8px;font-size: 36px;display: inline-block;margin-bottom: 15px;}
#divsuccessonreset .form-group{ text-align:center; margin-top:50px; margin-bottom:0px; }
#divsuccessonreset #gotomyaccountID {width:auto !important;padding: 12px !important;height: auto;line-height: normal;}

/* For MEC Logo margins  */
.logoContainer.preHeader > .container {
    width: 100%;
    max-width: 1230px;
}

@media(min-width:1080px) {
    .Registrstepbox {
        max-width: 592px;
    }
}
@media(max-width:767px) {
    .cannot_loginPaper { padding: 30px 20px; }
    .regis_radioboxtop.mdRadio .mdl-radio__inner-circle { margin-left: .0px; }
    
}

