@charset "utf-8";
/* CSS Document */

* { margin:auto; padding:0; }
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,600,700,300);

html { height:100%; }
body { background-size:cover; background-repeat:no-repeat; font-family: 'Open Sans', sans-serif; }

#wrapper { width:370px; padding-top: 50px; position:absolute; top:0; bottom:0; left:0; right:0; }
#login_container { width:270px; /*height:270px;*/
    border: 1px solid #D3DAE6;border-radius: 3px; background-color:rgba(255,255,255,0.4);
    padding:50px;
    text-align: center;
    color: #fff;
    background-color: #ffffff;
}
#login_container .form_text_input#new_password, #login_container .form_text_input#confirm_password{
    margin-bottom: 0;
    width: 100%;
}
#login_container form#login_form {text-align: left;}

#login_container .form_text_input { text-align:left; margin-bottom:18px; margin-top:5px; text-indent:4px; box-sizing: border-box;}
#login_container label { color: rgba(27, 43, 65, 0.72); font-size:14px;}

.sz_logo { width:145px; height:61px; background-image:url(../img/_ui/schoolzine/sz-plus-logo-small-white.png); background-size:145px; background-repeat:no-repeat; padding:0 0 20px 0; }

.form_text_input { width:100%; height:28px; border:none; padding:1px;
    color: rgba(24, 39, 57, 0.94) !important;
    border-radius: 4px !important;
    box-shadow: inset 0 0 0 1px #1c345442 !important;
    background-color: rgb(255, 255, 255) !important;}
.btn_wrapper { width: 250px; margin-top:15px; cursor: pointer; border-radius: 5px; padding: 5px; border: 2px solid #E8ECF5; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.btn_wrapper i { width: 40px; font-size: 20px; padding-right: 5px; }
.login_button_left { color: rgba(24, 39, 57, 0.94); display: table-cell; height: 100%; width: 55px; text-align: center; }
.login_button_right { color: rgba(24, 39, 57, 0.94); height: 100%; width: 100%; font-size: 15px; line-height: 35px; text-align: center; overflow: hidden; max-height: 35px; }

#button_container {  }
#button_container:hover { background-color: rgba(24, 39, 57, 0.94); border: 1px solid rgba(24, 39, 57, 0.94);}
#button_container:hover .login_button_right{ color: #ffffff; }

#office365_login_button {border: none; background: #E4341C; display: flex;}
#office365_login_button .login_button_left { width: initial; height: 40px;background-image:url(../img/office_365.png); background-position: right 12px center; background-size: 60%; background-repeat: no-repeat; }
#office365_login_button .login_button_right { color: #ffffff;}
#office365_login_button i { width: 40px; display: inline-block; }
#office365_login_button:hover { border:none; background: #db341c; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2),0 2px 7px rgba(0,0,0,0.2); }

#google_login_button {border: none; background: #377AF3;  display: flex;}
#google_login_button .login_button_left { width: initial; height: 40px; background-image:url(../img/google_login_icon.png); background-position: right 9px center; background-size: 70%; background-repeat: no-repeat; }
#google_login_button .login_button_right { color: #ffffff;}
#google_login_button i { width: 40px; display: inline-block; }

#google_login_button:hover { background: #3871e5; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2),0 2px 7px rgba(0,0,0,0.2); }

#reset_password_div {  }
#reset_password_div:hover {background-color: rgba(24, 39, 57, 0.94);border: 2px solid rgba(24, 39, 57, 0.94); }
#reset_password_div:hover .login_button_right {color: #ffffff; }
#cancel_and_logout { background: #ed5466; border:none}
#cancel_and_logout:hover { background: #e24559; border:none}
.school_select_button {display: flex; background-color: #fff;margin: 15px 0px;
    padding: 5px;
    border: 1px solid #e3e8ee;
}
.school_select_button:hover {
    -webkit-box-shadow: 0 0 0 1px rgba(50,50,93,.05), 0 7px 14px 0 rgba(50,50,93,.1), 0 3px 6px 0 rgba(0,0,0,.07);
    box-shadow: 0 0 0 1px rgba(50,50,93,.05), 0 7px 14px 0 rgba(50,50,93,.1), 0 3px 6px 0 rgba(0,0,0,.07);
    border: 1px solid #fff;
    background-color: white;
}

.school_select_button .login_button_right { font-size: 14px; overflow: hidden; width: 195px; max-width: 130px; padding: 0 3px; max-height: 35px; line-height: 17px; vertical-align: middle; }
.school_select_button .login_button_left { vertical-align: middle; }

#button_container:hover {

}

.form_cancel_button { width:80px; height:27px; text-align:center; font-size:13px; font-weight:600; background:rgba(250,250,250,1); border:1px solid rgba(220,220,220,0.6); color:rgba(180,180,180,1); text-decoration:none; padding:6px 12px; transition:0.15s linear all; -webkit-transition:0.15s linear all; -moz-transition:0.15s linear all; -o-transition:0.15s linear all; }
.form_cancel_button:hover { background:rgba(235,235,235,1); color:rgba(160,160,160,1); transition:0.15s linear all; -webkit-transition:0.15s linear all; -moz-transition:0.15s linear all; -o-transition:0.15s linear all; }

.submit_form { border-radius: 2px; text-align:center; font-size:13px; font-weight:600; background:rgba(250,250,250,1); border:1px solid #eee; color:#ffffff; text-decoration:none; padding:6px 12px !important; font-family: 'Open Sans', sans-serif !important; cursor:pointer; background:#1e9fbf; transition:0.15s linear all; -webkit-transition:0.15s linear all; -moz-transition:0.15s linear all; -o-transition:0.15s linear all; }
.submit_form:hover { background: #0085a6; transition:0.15s linear all; -webkit-transition:0.15s linear all; -moz-transition:0.15s linear all; -o-transition:0.15s linear all; }

#login_issues { height:auto; text-align:center; color: hsla(213,41%,16%,.8); font-size:14px; font-weight:500; padding-top:25px; }



/* sb.riz */
/*body.admin.sz { background: no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }*/
/*body.admin.sz.szbg_1 { background-image:url(../img/_ui/schoolzine/bg1.jpg); }*/
/*body.admin.sz.szbg_3 { background-image:url(../img/_ui/schoolzine/bg3.jpg); }*/
/*body.admin.sz.szbg_4 { background-image:url(../img/_ui/schoolzine/bg4.jpg); }*/
/*body.admin.sz.szbg_5 { background-image:url(../img/_ui/schoolzine/bg5.jpg); }*/
/*body.admin.sz.szbg_6 { background-image:url(../img/_ui/schoolzine/bg6.jpg); }*/
/*body.admin.sz.szbg_7 { background-image:url(../img/_ui/schoolzine/bg7.jpg); }*/

body.admin.sz {background-image: linear-gradient(rgba(25, 59, 103, 0.05),rgba(25, 59, 103, 0.05)); font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";}

#login_issues { margin: 0 auto; }

#login_container .fwrp { background: none; border: none; }
#login_container .fwrp.fer { display: block; }



/* Non supported browser error message */
#browser-not-supported { padding: 0 15px; }
#browser-not-supported p { color:#fff; font-size: 1.2em; font-weight: bold; }
.browser-icons { margin-top: 10px; }
.browser-icon { margin: 10px 0px; display: inline-block; width: 23%; margin: auto; vertical-align: top; text-align: center; color:white; font-size: 90%; }
.browser-icon img { vertical-align: top; width:55px; image-rendering: -webkit-optimize-contrast; }
#browser-firefox img { position: relative; top: 4px; }
#browser-safari img { position: relative; top: 2px; }



/* Windows login  */
.windows_login_wrapper { width: 100%; margin:auto; font-size: 14px; font-weight: 600; color: white; }
.login_spacer_wrapper { font-size: 14px; font-weight: 600; color: white; margin:auto; width:100%; text-align: center; margin-top: 20px; margin-bottom: 0px; }
.login_spacer_left { display: inline-block; border-bottom: 1px solid rgba(190,190,190,0.5); width: 44%; position: relative; bottom: 4px; right: 5px; }
.login_spacer_right { display: inline-block; border-bottom: 1px solid rgba(190,190,190,0.5); width: 44%; position: relative; bottom: 4px; left: 5px; }

/*.windows_login{*//*display: inline-block;*//*background-color: transparent;*//*text-align: center;*//*!*margin-top: 20px;*!*//*vertical-align: middle;*//*cursor: pointer;*//*!*height:22px;*!*//*!*padding: 6px 12px;*!*//*!*border-radius: 2px;*!*//*}*/
.windows_login { height: 48px; width: 250px; background-image: url(../img/login_office_365.png); margin-top: 10px; }
.windows_login:hover { height: 48px; width: 250px; background-image: url(../img/login_office_365_ov.png); }

#button_container {border: 1px solid #E8ECF5; }

#login_error{text-align: center; font-size: 14px}











/* sb */
.btn.centeredbtn { float: none; margin: 0 auto; display: block; }












/* responsive (keep this last) */
@media only screen and (max-width: 414px) {

#wrapper { width: 94%; }
#login_container { padding: 20px; }
#login_container .reset-password-btn{padding-top: 10px; padding-bottom: 10px;}

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

#login_container .form_text_input { width: 98%; clear: both; }
#login_container { width: 240px; }

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

.btn_wrapper { width: 92%; }
.btn_wrapper i { font-size: 16px; }
.login_button_right { font-size: 14px; }
#office365_login_button .login_button_left { background-size: 40%; }

}

#login_issues .reset-button{
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
}
#login_issues a{
    cursor: pointer;color: #0069ff;
}
#login_issues a:hover{
    color: #0069ff;
    cursor: pointer;
    text-decoration: underline;
}