

.navbar.mobile-nav {
    widows: 100%;
    display: block;
    z-index:9999999;
    min-height: 0px;
    padding: 0px;
  }

  
  .hamburger-toggle {
      left: -9999px;
      position: absolute;
      top: -9999px;
  }
  .hamburger-label {
          display:block;
          font-weight:700;
          border-radius: 50%;
          width:42px;
          height:42px;
          line-height:42px;
          color: var(--vdx-dark);
          text-align:center;
          font-size:2em;
          line-height:1.1em;
          position:fixed;
          top:10px;
          right:10px;
          -moz-transition:all 200ms ease-in;
          -webkit-transition:all 200ms ease-in;
          -o-transition:all 200ms ease-in;
          transition:all 200ms ease-in;
          z-index:500;
  }
  .hamburger-icon, .hamburger-icon:before,.hamburger-icon:after {
      position: absolute;
          top: 50%;
          left: 50%;
          height: 3px;
          width: 25px;
          cursor: pointer;
          background: var(--vdx-dark);
          display: block;
          content: '';
          -webkit-transition: all 500ms ease-in-out;
          transition: all 500ms ease-in-out;
  }
   .hamburger-icon{
      transform: translate3d(-50%, -4px, 0);
      -webkit-transform: translate3d(-50%, -2px, 0);
  }
  .hamburger-icon:before {
      transform: translate3d(-50%, -14px, 0);
      -webkit-transform: translate3d(-50%, -10px, 0);
  }
  .hamburger-icon:after {
      transform: translate3d(-50%, 10px, 0);
      -webkit-transform: translate3d(-50%, 6px, 0);
  }
  section .content {
      -moz-transition:all 200ms ease-in;
      -webkit-transition:all 200ms ease-in;
      -o-transition:all 200ms ease-in;
      transition:all 200ms ease-in;
  
  }
  .side-nav{
      position:fixed;
      top:0;
      right:0;
      width:250px;
      height:100%;
      margin:0 -350px 0 0 ;
      -moz-transition:all 200ms ease-in;
      -webkit-transition:all 200ms ease-in;
      -o-transition:all 200ms ease-in;
      transition:all 300ms ease-in;
      background: var(--vdx-light);
    box-shadow: rgb(50 50 93 / 25%) 0px 30px 60px -12px, rgb(0 0 0 / 30%) 0px 18px 36px -18px;

  }
  .side-nav > ul{
      width:250px;
      height:100%;
      padding: 40px;
  }
  .side-nav ul{
    height:100%;
    margin:0;
    list-style:none;
    background: var(--vdx-light);
    overflow:hidden;
}
  .side-nav li{
      margin:0;
  }
  .side-nav a{
      color: var(--vdx-dark);
      font-size:1em;
      text-decoration:none;
      display:block;
      padding:12px 15px;
      font-weight:300;
      letter-spacing:2px;
  }
  .side-nav a:hover{
      background:#ffffff;
      text-decoration: none;
  }
  
  input[type="checkbox"].hamburger-toggle{
      display:none;
  }
  input[type="checkbox"].hamburger-toggle:checked ~ .side-nav{
      margin:0;
  }
  input[type="checkbox"].hamburger-toggle:checked ~ label{
      right:10px;
  }
  input[type="checkbox"].hamburger-toggle:checked ~ label .hamburger-icon{
      background-color: transparent;
     }
  input[type="checkbox"].hamburger-toggle:checked ~ label .hamburger-icon:before{
      -ms-transform: translateX(-50%) translateY(-2px)  rotate(45deg);
         -webkit-transform: translateX(-50%) translateY(-2px)  rotate(45deg);
         transform: translateX(-50%) translateY(-2px)  rotate(45deg);
  }
  input[type="checkbox"].hamburger-toggle:checked ~ label .hamburger-icon:after{
      -ms-transform: translateX(-50%) translateY(-12px) rotate(-45deg);
      -webkit-transform: translateX(-50%) translateY(-12px) rotate(-45deg);
      transform: translateX(-50%) translateY(-12px) rotate(-45deg);
      top: 12px;
  }
  input[type="checkbox"].hamburger-toggle:checked ~ section{
      -webkit-transform:translate3d(-260px, 0, 0);
      -moz-transform:translate3d(-260px, 0, 0);
      -o-transform:translate3d(-260px, 0, 0);
      transform:translate3d(-260px, 0, 0);
  }
  .mobile-nav .panel-group {
    margin-top: 50px;
  }

  .mobile-nav .panel.panel-default,
  .mobile-nav .panel-heading {
    padding:0px;
  }
  
.mobile-nav .panel-heading a{
    font-size: 15px;
    font-family: var(--vdx-font-header);
    padding: 20px;
    font-weight: 500;
  }

  .mobile-nav .panel.panel-default {
    border-bottom:var(--vdx-line-300);
  }
  .mobile-nav .panel-collapse {
    font-size: 13px;
  }

  .mobile-nav a.research-btn {
    background-color: var(--vdx-primary);
    position: absolute;
    line-height: 70px;
    right: 0;
    bottom: 0;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    padding: 0px 35px;
    width: 100%;
    cursor: pointer;
    transition: all ease-in-out .3s;
}
  
  @media screen and (min-width: 992px) {
    .navbar.mobile-nav {
    display: none;
    }
}
@media screen and (max-width: 992px) {
    .nav-drop  {
    display: none!important;
    }
}
