/**************************************************************************
* Document Structure
**************************************************************************/

html, body {height: 100%; margin: 0; padding: 0;}
html {font-size: 62.5%; height: 100%;}
body {color: #666; font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 300; height: 100%; overflow: hidden;}

a, a:link, a:visited {color: #666; text-decoration: underline;}
a:focus, a:hover, a:active {color: #939598; text-decoration: none;}

/* Quick fix, sort out with theme editor later */
a, a:link, a:visited {text-decoration: none;}

h1 {font-size: 2.4rem; margin: 0;}
h2 {font-size: 2.2rem; margin: 0;}
h3 {font-size: 2.0rem; margin: 0;}


/**************************************************************************
* General Classes
**************************************************************************/

.clear-fix:after {clear: both; content: "."; display: block; height: 0; overflow: hidden; visibility: hidden;}
.hidden {display: none !important;}


/**************************************************************************
* Password strength meter
**************************************************************************/

.passStrengthify {display: block !important;}

/**************************************************************************
* App Structure
**************************************************************************/

#ui-app-wrap {height: 100%; overflow: hidden; width: 100%;}

#ui-page-header {background-color: #2b2b2b; box-shadow: 0 0 3px 0 #acacac; height: 60px; left: 0; position: fixed; text-align: center; top: 0; width: 100%; z-index: 10;}
#ui-page-header .logo {display: inline-block; font-size: 0; padding: 0 5px;}
#ui-page-header .logo img {height: 40px; padding: 10px 0; align-self: center;}

#ui-page-content {box-sizing: border-box; height: calc(100% - 60px); overflow-y: scroll; margin-top: 60px; position: fixed; right: 0; top: 0; width: 100%; z-index: 1; -webkit-overflow-scrolling: touch;}




#ui-page-content {padding: 20px;}


/**************************************************************************
* Layout Styles
**************************************************************************/

/*.l_login {background-color: #367FA0;}*/


/**************************************************************************
* Page: Login
**************************************************************************/

.login-wrap {color: #333; margin: 100px auto 40px; max-width: 400px; background-color: #ffffff;border-radius: 5px;padding: 20px;text-align: center;box-shadow: 0 7px 14px 0 rgba(59,65,94,.1), 0 3px 6px 0 rgba(0,0,0,.07);}
.login-wrap .logo {display: block; margin: 0 auto 30px; max-width: 200px;}
.login-wrap .title {font-size: 1.8rem;
    margin-bottom: 20px;
    text-align: center;
    text-transform: uppercase;
    color: #aaa;
    font-weight: 200;}

.login-wrap .input-wrap {margin-bottom: 15px; position: relative; width:70%;left:15%;right:15%;}
.login-wrap .input-wrap input {background-color: #f0f0f0; border: 0; color: #555; display: block; font-size: 14px; height: 46px; padding: 10px 0 10px 46px; width: 100%;}
.login-wrap .input-wrap input:focus {outline: 0;}
.login-wrap .input-wrap .mdi {display: block; height: 46px; left: 0; line-height: 46px; position: absolute; text-align: center; top: 0; width: 46px;}
.login-wrap input.submit {background-color: #2b2b2b; border: 0; color: #fff; cursor: pointer; display: block; font-size: 18px; padding: 10px 0; text-transform: uppercase; width: 100%; -webkit-appearance: none;}
.login-wrap button {background-color: #2b2b2b; border: 0; color: #fff; cursor: pointer; display: block; font-size: 18px; padding: 10px 0; text-transform: uppercase; width: 100%; -webkit-appearance: none;}
.login-wrap input.submit:focus,
.login-wrap input.submit:hover,
.login-wrap input.submit:active {background-color: #B8C8D1;}

.login-wrap .input-wrap input,
.login-wrap input.submit {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.login-wrap .forgot {margin-top: 20px; text-align: center;}
.login-wrap .forgot a,
.login-wrap .forgot a:link,
.login-wrap .forgot a:visited {color: #333; font-size: 14px;}
.login-wrap .forgot a:focus,
.login-wrap .forgot a:hover,
.login-wrap .forgot a:active {text-decoration: underline;}


.l_login .job-sites {margin: 100px 0 20px; text-align: center;}
.l_login .job-sites a:hover img {opacity: 0.7;}

@media all and (min-height: 600px) {
  .l_login .job-sites {position: absolute; bottom: 0; left: 0; right: 0;}
}




/**************************************************************************
* Register
**************************************************************************/

/* general */
.p_register #ui-page-content .ui-details-list { padding: 20px;}
.p_register #ui-page-content .ui-details-list dt {display: block; float: none; text-align: left; text-transform: uppercase; width: 100%;}
.p_register #ui-page-content .ui-details-list dd {margin: 0;}
.p_register #ui-page-content .ui-details-list dd input[type="file"] {width: 100%;}
.p_register #ui-page-content .ui-details-list dl.r_submit input {width: 100%;}

/* register page specifics */
.p_register #ui-page-content .ui-page-header {margin: 20px 0 0; padding: 0 20px;}
.p_register #ui-page-content .ui-details-list {padding-top: 0;}
.p_register #ui-page-content .ui-details-list dt {color: #2B2B2B; text-transform: uppercase;}

.p_register .id-upload-toggle {color: #2B2B2B; cursor: pointer;}
.p_register .id-upload-toggle:focus,
.p_register .id-upload-toggle:hover,
.p_register .id-upload-toggle:active {text-decoration: underline;}




/**************************************************************************
* Media Queries
**************************************************************************/

@media all and (min-width: 1000px){
  
  /**************************************************************************
  * App Structure
  **************************************************************************/
  #ui-page-header {text-align: center; padding-left: 8px; z-index: 100;}
  
  
  /**************************************************************************
  * Register
  **************************************************************************/
  
  .p_register #ui-page-content .wrap {margin: 0 auto; width: 960px;}
  
  /* general */
  .p_register #ui-page-content .ui-details-list dl {display: block;}
  .p_register #ui-page-content .ui-details-list dl:after {clear: both; content: "."; display: block; height: 0; overflow: hidden; visibility: hidden;} /* clear fix */
  .p_register #ui-page-content .ui-details-list dt {float: left; width: 220px;}
  .p_register #ui-page-content .ui-details-list dd {float: right; width: calc(100% - 220px);}
  .p_register #ui-page-content .ui-details-list dl.r_submit input {display: inline-block; width: auto;}
  
}

@media all and (min-width: 1250px){
  
  #ui-page-content .wrap {margin: 0 auto; width: 960px;}
}



/**************************************************************************
* Accept Terms
**************************************************************************/

body.l_public.p_accept-terms