/* IMPORTS */
/*
    MOBILE VERSION
*/
section#header_login {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #2e4062;
  padding-top: calc(50vh - 200px); }
  section#header_login div.login_container {
    width: calc(80% - 100px);
    margin: 0 auto;
    max-width: 400px;
    background-color: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    padding: 20px 50px;
    overflow: auto;
    display: block; }
    section#header_login div.login_container img {
      width: 80%;
      max-width: 350px;
      margin: 0 auto 40px;
      display: block; }
    section#header_login div.login_container form h6 {
      color: #ffffff;
      font-size: 1.8rem;
      width: 100%;
      text-align: center;
      padding: 0 0 20px 0; }
    section#header_login div.login_container form div.input_group input {
      display: block;
      width: 100%;
      box-sizing: border-box;
      margin: 10px auto 20px;
      height: auto;
      border: none;
      color: #303030;
      background-color: white;
      font-size: 1.6rem;
      padding: 10px 12px;
      vertical-align: top;
      transition: background-color 0.56s cubic-bezier(0.4, 0, 0.2, 1) 0s; }
      section#header_login div.login_container form div.input_group input:focus {
        background-color: rgba(255, 255, 255, 0.6); }
      section#header_login div.login_container form div.input_group input:wrong {
        background-color: rgba(255, 255, 255, 0.6); }
    section#header_login div.login_container form a.link {
      float: left;
      margin-top: -14px;
      font-size: 1.2rem;
      color: #ffffff; }
    section#header_login div.login_container form a.button, section#header_login div.login_container form button.button {
      width: calc(100% - 24px);
      padding: 20px 12px;
      margin: 40px auto 10px;
      border: none;
      font-size: 1.6rem;
      font-weight: 400;
      border-radius: 3px;
      cursor: pointer;
      transition: all 200ms;
      display: block;
      text-align: center; }
      section#header_login div.login_container form a.button.blue, section#header_login div.login_container form button.button.blue {
        background-color: #297abe;
        color: white; }
      section#header_login div.login_container form a.button:hover, section#header_login div.login_container form button.button:hover {
        background-color: #92d2f4; }
  section#header_login div.success {
    display: none;
    width: calc(80% - 100px);
    margin: 0 auto;
    max-width: 400px;
    background-color: rgba(255, 255, 255, 0.05);
    border-radius: 4px;
    padding: 20px 50px;
    overflow: auto;
    min-height: 400px; }
    section#header_login div.success h3 {
      color: #ffffff;
      font-size: 2rem;
      width: 100%;
      text-align: center;
      padding-top: 140px; }
  section#header_login.success div.login_container {
    display: none; }
  section#header_login.success div.success {
    display: block; }

/*
    TABLET VERSION
*/
/*
    SMALL SCREEN COMPUTER VERSION
*/
/*
    LARGE SCREEN COMPUTER VERSION
*/
/*
    SUPER LARGE SCREEN COMPUTER VERSION
*/