body.drawer-navbar.drawer-fixed {
  padding-top: 0;
}

.drawer-main {
  position: fixed;
  z-index: 999999;
  top: 0;

  overflow: hidden;

  height: 100%;
}

.drawer-left .drawer-main {
  left: -280px;

  -webkit-transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:      -o-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1), -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
  -webkit-transform: translate3d(-280px, 0px, 0px);
          transform: translate3d(-280px, 0px, 0px);
}

.drawer-left.drawer-open .drawer-main {
  left: 0;

  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
}

.drawer-right .drawer-main {
  right: -280px;

  -webkit-transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:      -o-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1), -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
  -webkit-transform: translate3d(280px, 0px, 0px);
          transform: translate3d(280px, 0px, 0px);
}

.drawer-right.drawer-open .drawer-main {
  right: 0;

  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
}

.drawer-top .drawer-main {
  width: 100%;
  height: auto;
  max-height: 100%;

  -webkit-transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:      -o-transform .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition: -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1);
          transition:         transform .6s cubic-bezier(.19, 1, .22, 1), -webkit-transform .6s cubic-bezier(.19, 1, .22, 1);
  -webkit-transform: translate3d(0, -100%, 0px);
          transform: translate3d(0, -100%, 0px); 

  background: #fff;
}

.drawer-top.drawer-open .drawer-main {
  -webkit-transform: translate3d(0, 0, 0px);
          transform: translate3d(0, 0, 0px);
}

.drawer-overlay {
  position: relative;
}

.drawer-left .drawer-hamburger {
  left: 0;

  -webkit-transform: translateX(0px) translateY(0px);
      -ms-transform: translateX(0px) translateY(0px);
          transform: translateX(0px) translateY(0px);
}

.drawer-left.drawer-open .drawer-hamburger {
  -webkit-transform: translateX(280px) translateY(0px);
      -ms-transform: translateX(280px) translateY(0px);
          transform: translateX(280px) translateY(0px);
}

.drawer-right .drawer-hamburger {
  right: 0;

  -webkit-transform: translateX(0px) translateY(0px);
      -ms-transform: translateX(0px) translateY(0px);
          transform: translateX(0px) translateY(0px);
}

.drawer-right.drawer-open .drawer-hamburger {
  -webkit-transform: translateX(-280px) translateY(0px);
      -ms-transform: translateX(-280px) translateY(0px);
          transform: translateX(-280px) translateY(0px);
}

.drawer-overlay-upper {
  position: fixed;
  z-index: 5200;
  top: 0;
  left: 0;

  display: none;

  width: 100%;
  height: 100%;

  background-color: white;
}

.drawer-open .drawer-overlay-upper {
  display: block !important;
}

.drawer-hamburger {
  position: fixed;
  z-index: 99999999;
  top: -6px;
  right: 0;

  display: block;

  width: 60px;
  height: 50px;
  padding: 10px 16px;

  -webkit-transition: .3s; 
       -o-transition: .3s;
          transition: .3s;

  border: 0;
  border: none;
  outline: 0;
  background: #fff;
}

.drawer-open .drawer-hamburger {
  background: #fff;
}

.drawer-hamburger .txt {
  font-size: .7em;
  font-weight: 700;

  position: absolute;
  bottom: 4px;
  left: 0;

  width: 100%;

  text-align: center; 

  color: #565656;
}

.drawer-hamburger-icon {
  position: relative;

  display: block;

  margin-top: 2px;
}

.drawer-hamburger-icon,
.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
  width: 100%;
  height: 2px;

  -webkit-transition: all .6s cubic-bezier(.19, 1, .22, 1);
       -o-transition: all .6s cubic-bezier(.19, 1, .22, 1);
          transition: all .6s cubic-bezier(.19, 1, .22, 1); 

  background-color: #565656;
}

.drawer-open .drawer-hamburger-icon,
.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after {
  background-color: #565656;
}

.drawer-hamburger-icon:before,
.drawer-hamburger-icon:after {
  position: absolute;
  top: -7px;
  left: 0; 

  content: " ";
}

.drawer-hamburger-icon:after {
  top: 7px;
}

.drawer-open .drawer-hamburger-icon {
  background-color: transparent;
}

.drawer-open .drawer-hamburger-icon:before,
.drawer-open .drawer-hamburger-icon:after {
  top: 0;
}

.drawer-open .drawer-hamburger-icon:before {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.drawer-open .drawer-hamburger-icon:after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

@-webkit-keyframes menu_anime {
  50% {
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); 

    opacity: 1;
  }
}

@keyframes menu_anime {
  50% {
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0); 

    opacity: 1;
  }
}

.sr-only {
  position: absolute;

  overflow: hidden;
  clip: rect(0, 0, 0, 0);

  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;

  border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;

  overflow: visible;
  clip: auto; 

  width: auto;
  height: auto;
  margin: 0;
}