body {font-family: 'open sans', helvetica, arial, sans;box-sizing:border-box;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background: #352920;padding: 0px;margin: 0px;}
body.secured{background: #FFF;}
/*h2 {font-family: 'open sans condensed';font-size: 1.35em;display: block;background:#fff;text-transform: uppercase;padding: .75em 1em .75em 1.5em;margin: 10px;font-weight: 200;border-bottom: 1px solid #fff;background: #2a2a2a;color: #FFF;border-radius: .4em .4em .4em .4em;text-align: center;}*/

button{padding: 10px;}
button:hover{cursor: pointer;}

.log-form {width: 800px;background: #000 url(/images/zelda-login.jpg) no-repeat top center;position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%);box-shadow: 0px 5px 20px 1px;border-radius: .4em;height: 500px;}
.log-form form{width: 250px;margin:315px auto 0px;display: block;padding-left: 15px;}
.log-form form input {display: block;margin: auto auto;margin-bottom: 10px;padding: .5em;border: none;border-bottom: 1px solid #2a2a2a;color: #2a2a2a;border-radius: .4em;}
.log-form form .btn {display: block;background: #693711;padding: .5em 2em;color: white;margin: 0px auto;border-radius: .4em;width: 95px;}
.log-form form .btn:hover, .log-form form .btn:active, .log-form form .btn:focus {background: #4a260b;box-shadow: inset 0px 1px 1px fadeout(black, 90%);cursor: pointer;}

header.main-hdr{background: #FFF;padding: 0px;margin: 0px;box-shadow: 0 0px 15px 0px rgb(0 0 0 / 35%);position: fixed;top:0px;left:0px;width: 100%;}
header .left-col{text-align: left;padding: 15px 0px 0px;}
header .center-col{text-align: center;padding: 15px 0px;}
header .center-col a{font-size: 20px;font-weight: bold;color: #667596;}
header .center-col a, header .center-col a:hover{text-decoration: none;}
header .right-col{text-align: right;padding: 0px;}
header .right-col .hdr-usr{padding-top: 45px;padding-right: 15px;}

.main-ftr{background: #FFF;position: fixed;bottom: 0px;width: 100%;text-align: center;box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 35%);padding: 20px 0px;}

.menu-btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    cursor: pointer;
    transition: all .5s ease-in-out;
    /* border: 3px solid #fff; */
  }
  .menu-btn__burger {
    width: 50px;
    height: 6px;
    background: #667596;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,.25);
    transition: all .5s ease-in-out;
  }
  .menu-btn__burger::before,
  .menu-btn__burger::after {
    content: '';
    position: absolute;
    width: 50px;
    height: 6px;
    background: #667596;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,.25);
    transition: all .5s ease-in-out;
  }
  .menu-btn__burger::before {
    transform: translateY(-16px);
  }
  .menu-btn__burger::after {
    transform: translateY(16px);
  }
  /* ANIMATION */
  .menu-btn.open .menu-btn__burger {
    transform: translateX(-50px);
    background: transparent;
    box-shadow: none;
  }
  .menu-btn.open .menu-btn__burger::before {
    transform: rotate(45deg) translate(35px, -35px);
  }
  .menu-btn.open .menu-btn__burger::after {
    transform: rotate(-45deg) translate(35px, 35px);
  }

.main-nav{-webkit-transition: .5s ease-out;-moz-transition: .5s ease-out;-o-transition: .5s ease-out;-ms-transition: .5s ease-out;transition: .5s ease-out;position: fixed;top:90px;left:-800px;background: #FFF;box-shadow: 0 0px 15px 0px rgb(0 0 0 / 35%);}
.main-nav ul{margin: 0px;padding: 10px;list-style-type: none;}
.main-nav ul li a{font:bold 14px 'open sans', helvetica, arial, sans;color: #667596;text-decoration: none;}
.main-nav ul li{margin: 0px;padding: 5px 0px;list-style-type: none;}
.main-nav ul li ul{margin:0px;padding: 5px 0px 5px 10px;}
.main-nav ul li ul li{padding: 0px;}
.main-nav ul li ul li a{font-weight: normal;font-size: 13px;}

.main-nav ul li a:hover{text-decoration: underline;}
@media(max-width: 40em){
   
}

.toolbox{padding: 30px;}
.jahjoe-loading-container img{margin: 20px auto;text-align: center;}
