iframe.skiptranslate { visibility: hidden ! important; }

body{
    font-family: Open Sans, sans-serif;

    background-image: url("../images/login/login-background_light.png");
    background-position: center center;
	background-repeat:  no-repeat;
	background-attachment: fixed;
	background-size:  cover;
	background-color: #005e75 !important;
    top: 0px !important;
}
body:before{
   content: url("../images/login/login-background-cornerGraph.png");
   position: fixed;
   bottom: -5px;
   right: -2px;
}

::-moz-selection{
    color: #fff;
    background: rgba(0, 158, 182, 0.6);
}
::selection{
    color: #fff;
    background: rgba(0, 158, 182, 0.6);
}

.wp-hide-pw {
	display:none !important;
}

.login .password-input-wrapper {
	display: inherit;
}

input{
    box-shadow: 0 0px 0px rgb(255, 255, 255) !important;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
}

.login form .input, .login input[type="text"] {
    font-size: 16px;
    margin: 2px 6px 16px 0;
    padding: 3px;
    width: 100%;
    background-color: transparent !important;
    background: transparent !important;
    border: none;
    border-bottom: 1px solid #CCC;
}

.login form .input:focus, .login input[type="text"]:focus {
  border-bottom: 1px solid #009eb6 !important;
}

.login select{
    line-height: 28px;
    font-size: 16px;
    margin: 2px 6px 16px 0;
    padding: 3px;
    width: 100%;
    height: 34px;
    background: #fbfbfb none repeat scroll 0 0;
    background-color: transparent !important;
    background: transparent !important;
    border: none;
    border-bottom: 1px solid #CCC;
}
.login select:focus{
    border: none;
    box-shadow: none;
    border-bottom: 1px solid #009eb6 !important;
    background-color: rgba(200, 200, 200, 0.1) !important;
}
.login select:hover{
    background-color: rgba(200,200,200,.1) !important;
}

button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
}

input,
input[type="checkbox"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="radio"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
    border-radius: 0;
    background-color: #fff;
    box-shadow: none;
    color: black;
    outline: 0 none;
    transition: border-color 0.1s ease-in-out 0s;
    font-size: 12px;
}

input[type="number"].qty {
    background-color: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07) inset;
    color: #32373c;
    outline: 0 none;
    transition: border-color 0.1s ease-in-out 0s;
    padding-left: 0px;
    font-size: 14px;
}

input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 30px rgb(255, 255, 255) inset !important;
}

input:-webkit-autofill:active {
    background-color: #009eb6 !important
}

#login > .message, #login > #login_error{
    width: 310px;
    padding: 20px 60px;
    margin: auto !important;
    background-color: #fdfdfd !important;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: none;
}


#nav{
    display: block;
    position: relative;
    top: 4px;
    width: 460px;
    height: 51px;
    padding: 0 !important;
    margin: 0 !important;
    color: transparent;
}

#nav > a:nth-child(1) {
    display: inline-block;
    position: absolute;
    left: 0;
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff !important;
    width: 228px !important;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
    font-weight: 600;
    text-transform:uppercase;
    font-family: 'Work Sans', sans-serif;
}

#nav > a:nth-child(2) {
    display: inline-block;
    position: absolute;
    right: 0px;
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff !important;
    width: 228px !important;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 16px;
    font-weight: 600;
    text-transform:uppercase;
    font-family: 'Work Sans', sans-serif;
}

#nav > a:hover{
    background-color: rgba(68, 230, 255, 0.72);
}
#nav > a:nth-child(1):focus{
     box-shadow: none;
}
#nav > a:active {
    top: 1px;
}
#nav > a:focus,
#backtoblog > a:focus{
    box-shadow: none;
    color: #fff;
}


#backtoblog{
    margin-bottom: 50px;
}
@media (min-width:768px){
    #backtoblog{
        padding: 0 !important;
        margin-bottom: 50px;
    }
}

#backtoblog > a{
    box-shadow: none;
    color: rgba(203, 247, 255, 0.8) !important;
    font-size:16px;
}
#backtoblog > a:hover{
    box-shadow: none;
    color: #00ddff !important;
}
#backtoblog > a:active{
    box-shadow: none;
    color: #00ddff !important;
    position: relative;
    top: 1px;
}


.login {
    background-color: #fff;
}

.login form {
    border: none;
}

#login {
    position: relative;
    top: 50px;

}

#login form p.submit {
    margin: auto;
}

#login > h1 > a {
    background-image: url("../images/login-logo-trisotech.png");
    background-size: 240px auto;
    width: 250px;
    max-width: 250px;
    margin: auto !important;
    margin-top: 30px !important;
}

#login > h1 {
    padding-bottom: 20px !important;
    margin: auto !important;
    width: 100%;
    max-width: 100%;
    background-color: #fdfdfd !important;
    border-top: 15px solid #2ea4bc;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-top: 15px solid rgba(255, 255, 255, 0.10);
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

#login > h1 > .brand-name {
    display: inline-block;
    margin-top: 10px;
    color: #678387;
    font-size: 14px;
}

#login > h1 > .brand-image {
    display: inline-block;
    max-width: 350px;
    margin-top: 30px;
}

#login {
    padding-top: 20px;
    max-width: 430px !important;
    width: 100% !important;
}

/*-------------Login Form------------*/

#loginform {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #fdfdfd;
    margin: 0;
    padding: 0;
    padding-bottom: 50px;
    border-bottom: 15px solid #2ea4bc;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-bottom: 15px solid rgba(255, 255, 255, 0.10);
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: none;
}
#loginform {
    width: 430px;
}
#loginform > *:nth-child(1) {
    padding-top: 30px;
}
#loginform > *{
    float: none !important;
    margin: auto !important;
    width: 300px;
}
#loginform > .forgetmenot {
    position: relative;
    top: -15px;
}

#loginform > .forgetmenot label input[type=checkbox]{
    height: 12px  !important;
    width: 12px  !important;
    min-width: 12px  !important;
}
#loginform > .forgetmenot label{
    font-size: 10px !important;
    color: #a5a5a5;
}
#rememberme:focus{
    border-color: #cecece;
}
#rememberme::before{
    position: relative;
    top: -1px;
    left: -1px;
    font: 400 18px/1 dashicons;
    color: #009eb6;
}
#loginform > *:last-child {
    display: block;
    padding-top: 20px !important;
}

.aadsso-login-form-text > a:focus{
    box-shadow: none;
}


/*-------------Register------------*/

#registerform {
   background-color: #fdfdfd;
    width: 430px;
    height: 100%;
    margin: 0;
    padding: 0;
    padding-bottom: 50px;
    border-bottom: 15px solid #2ea4bc;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-bottom: 15px solid rgba(255, 255, 255, 0.10);
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: none;
}

#registerform > p:nth-child(2) {
    padding-top: 20px;
}

#registerform > *{
    margin: auto !important;
    width: 300px;
}


#registerform > *:last-child {
    display: block;
    padding-top: 20px !important;
}

#registerform > #reg_passmail {
	font-weight:bold;
}

/*-------------Lost Password------------*/

#lostpasswordform {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #fdfdfd;
    margin: 0;
    padding: 0;
    padding-bottom: 50px;
    border-bottom: 15px solid #2ea4bc;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-bottom: 15px solid rgba(255, 255, 255, 0.10);
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: none;
}

#lostpasswordform{
    width: 430px;
}

#lostpasswordform > *:nth-child(1){
    padding-top: 20px;
}

#lostpasswordform > *{
    margin: auto !important;
    width: 300px;
}

#lostpasswordform > *:last-child{
    display: block;
    position: relative;
    margin: auto;
    padding-top: 20px !important;
}



/*-------------Reset Password------------*/

#resetpassform {
    display: block;
    width: 430px;
    height: 100%;
    background-color: #fdfdfd;
    margin: 0;
    padding: 0;
    position: relative;
    padding-bottom: 50px;
    border-bottom: 15px solid #2ea4bc;
    border-left: 15px solid #2ea4bc;
    border-right: 15px solid #2ea4bc;
    border-bottom: 15px solid rgba(255, 255, 255, 0.10);
    border-left: 15px solid rgba(255, 255, 255, 0.10);
    border-right: 15px solid rgba(255, 255, 255, 0.10);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    box-shadow: none;
}

#resetpassform > *{
    margin: auto;
    width: 300px;
}
.user-pass1-wrap{
    padding-top: 40px;
}
#resetpassform > *:last-child{
    display: block;
    position: relative;
    margin: auto !important;
    padding-top: 20px !important;
}


.wp-core-ui .button-primary {
    box-shadow: none;
}
.login .button-primary{
    float: none;
}

#wp-submit{
    background-color: #009eb6;
    width: 100%;
    text-shadow: none;
    font-size: 16px;
    font-weight:600;
    text-align: center;
    font-family: 'Work Sans', sans-serif;
    text-transform:uppercase;
}

#wp-submit:hover{
    background-color: #1ccfea;
}

.wp-submit-disable{
    background-color: #e5e5e5;
}

.wp-core-ui .button, .wp-core-ui .button-secondary {
    box-shadow: none;
}

.wp-core-ui .button, .wp-core-ui .button-primary, .wp-core-ui .button-secondary {
    border-radius: 0;
    border: none;
}

.wp-core-ui .button-primary.focus,
.wp-core-ui .button-primary.hover,
.wp-core-ui .button-primary:focus,
.wp-core-ui .button-primary:hover {
    box-shadow: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #009eb6;
  -webkit-box-shadow: 0 0 0px 1000px rgb(240, 240, 240) inset;
  transition: background-color 5000s ease-in-out 0s;
}

@media screen and (max-width: 782px) {
    #wp-submit {
        padding: 0 12px 2px !important;
        line-height: 28px !important;
        height: 30px !important;
        margin-bottom: 0px !important;
    }
}

@media screen and (max-width: 600px) {
    #login > .message, #login > #login_error{
        width: 270px;
        padding: 0 40px;
    }
    #login > h1 {
        width: 350px;
    }
    #login > h1 > .brand-image {
        max-width: 260px;
    }


    #nav{
        flex-flow:column nowrap;
        width: 380px !important;
        height: 106px;
        margin: auto !important;
    }
    #nav > a:nth-child(1){
        display: block;
        width: 380px !important;
        background-color: rgba(50, 168, 190, 0.7);
    }
    #nav > a:nth-child(2){
        display: block;
        top: 54px;
        width: 380px !important;
        background-color: rgba(50, 168, 190, 0.7);
    }


    #loginform {
        width: 350px;
        margin: auto;
    }
    #loginform > *{
        width: 250px;
        margin: auto;
    }
    #loginform > *:last-child {
        margin: auto;
    }


    #registerform {
        width: 350px;
        margin: auto;
    }
    #registerform > *{
        width: 250px;
    }


    #lostpasswordform {
        width: 350px;
        margin: auto;
    }
    #lostpasswordform > *{
        width: 250px;
    }


    #resetpassform {
        width: 350px;
        margin: auto;
    }
    #resetpassform > *{
        width: 250px;
    }

    .user-pass1-wrap{
        padding-top: 10px;
    }
}

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

    body{
	    background-attachment: local;
    }


    #login > .message, #login > #login_error{
        width: 210px;
        padding: 0 20px;
    }
    #login > h1 {
        width: 250px;
    }
    #login > h1 > .brand-image {
        width: 200px;
    }


    #nav{
        width: 280px !important;
        height: 110px;
        margin: auto !important;
    }
    #nav > a:nth-child(1){
        width: 280px !important;
    }
    #nav > a:nth-child(2){
        width: 280px !important;
    }


    #loginform {
        width: 250px;
        margin: auto;
    }
    #loginform > *{
        width: 200px;
    }


    #registerform {
        width: 250px;
        margin: auto;
    }
    #registerform > *{
        width: 200px;
    }


    #lostpasswordform {
        width: 250px;
        margin: auto;
    }
    #lostpasswordform > *{
        width: 200px;
    }


    #resetpassform {
        width: 250px;
        margin: auto;
    }
    #resetpassform > *{
        width: 200px;
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 600px) and (orientation: portrait) {
    body{
        background-attachment: local;
    }
}
