#menu_container{
  position: fixed;
  left:0px;
  top:0px;
  z-index:1000;
  width:70px;
}



#menubar{
  position:absolute;
  width:100%;
  background-color:#eee;
  z-index: 100;
  text-align: center;
  padding:20px 0px;
  overflow:auto;
}

#menu_page_overlay{
  display:none;
  position:fixed;
  top:0px;
  bottom:0px;
  left:0px;
  right:0px;
  z-index:100;
  background-color: rgba(0,0,0,0.80);
}

#menu_page_overlay.active{
  display:block;
}





#pagecontainer .container{
  padding-left: 70px;
  position:relative;
  height:100%;
}
#pagecontainer .container-fullwidth{
  padding-left: 70px;
}













.toggle-icon{
  display:inline-block;

}

#menubar .logo{
  display: none;
  padding:50px;
}
#menu_container #menubar .logo{
  display: block;
  padding:10px;
}

#menu_container .homenavbox{
  margin-bottom:20px;
  display: none;
}






#menubar nav li.active a{
  color:#f3d40f;
}


.sidebar-menupanel .nav li.active a:link, .sidebar-menupanel .nav li.active a:visited {
    color:#f3d40f;
}



.sidebar-menupanel .nav{
  text-align: center;
  font-weight:600 !important;
  font-style: normal;
}

.sidebar-menupanel .nav li a:link,
.sidebar-menupanel .nav li a:visited{
  color:#fff;
  background-color: transparent;
}
.sidebar-menupanel .nav li a:hover,
.sidebar-menupanel .nav li a:active{
  color: #f3d40f;
  background-color: transparent;
}


.sidebar-content{
  z-index: 100;
  padding:30px;
  position:relative;
  color:#fff;
  overflow: visible;
}

.privacy{
  font-size: 1.5rem;
  text-align: center;
  color: #fff;
  position: absolute;
  width: 100%;
  bottom: 50px;
}
.privacy a{
  color: #fff;
}





#pagecontainer .container-normal{
  padding-left: 15px !important;
}





@media (max-width: 768px) {


  .privacy{
    position: static;
    padding-bottom: 50px;
  }


  #menu_container{
    position: fixed;
    left:0px;
    top:0px;
    z-index:1000;
    width:100%;
    overflow: visible;
    height:73px;
  }
  #menu_container.is-active{
    height:100%;
  }

  #menubar{
    position:relative;
    width:100%;
    background-color:#eee;
    z-index: 100;
    text-align: center;
    padding:20px 0px 5px 0px;
  }

  #pagecontainer{
    margin-left: 0px;
    position:relative;
    height:100%;
    margin-top:70px;
  }

  #pagecontainer .container{
    padding-left: 15px;
  }

  #pagecontainer .container-fullwidth{
    padding-left: 0px;
  }

  #menu_container #menubar .logo{
    z-index: 100;
    display: inline-block;
    position:absolute;
    left:0px;
    top:5px;
    width:65px;
  }



  .sidebar-menupanel{
    padding-top: 70px;
    overflow:auto;

    top:-100%;
    right: 0;
    bottom: 0;
    left: 0;
    width:100%;
    height:100%;

    background-image: none;
    opacity:0;
    filter: alpha(opacity=0);

    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -ms-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);

    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
    position: absolute;
    z-index: 0;
    background-color: #0154a1;
    background-color: rgba(1,84,161,0.8);
  }

  .sidebar-menupanel.is-active{
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 1;
  }




}



@media (min-width: 768px) {
  #menu_container{
    height:100%;
  }
  #menubar{
    height:100%;
    width:100%;
  }


  .sidebar-menupanel{
    left:-250px;
    -webkit-transform: translate3d(0);
    transform: translate3d(0);
    width:320px;
    height:100%;

    background-image: none;
    opacity:0;
    filter: alpha(opacity=0);
    transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -moz-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -ms-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    -o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
    top: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    z-index: 0;
    background-color: #0154a1;
    background-color: rgba(1,84,161,0.8);

    overflow:auto;
  }

  .sidebar-menupanel.is-active{
      -webkit-transform: translate3d(320px, 0, 0);
      transform: translate3d(320px, 0, 0);
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 1;
  }

}


@media (min-width: 1200px) {
  #menu_container.homepage{
    position: fixed;
    left:0px;
    top:0px;
    z-index:1000;
    height:100%;
    width:250px;
  }

  #pagecontainer.homepage .container{
    padding-left: 250px;
    position:relative;
    height:100%;
  }
  #menu_container.homepage #menubar .logo{
    display: block;
    padding:50px;
  }

  #menu_container.homepage .sidebar-menupanel{
    left:-70px;
    -webkit-transform: translate3d(0);
    transform: translate3d(0);
    width:320px;
  }
  #menu_container.homepage .sidebar-menupanel.is-active{
    -webkit-transform: translate3d(320px, 0, 0);
    transform: translate3d(320px, 0, 0);
  }

  #menu_container.homepage .homenavbox{
    display: block;
  }

  #menu_container.homepage #nav-icon{
    display: none;
  }

  #pagecontainer.homepage .container-fullwidth{
    padding-left: 250px;
  }
}