/*  //////////////// mobile side menu (sidenav) /////////   */
.sidenav {
  display: inline-block! important;
  height: 100%;
  width: 300px; /* width: 90%; max-width: 400px; left: -400px; */
  position: fixed;
    /*float: right;*/
  font-size: 15pt;
  z-index: 1000;
  top: 60px;
  left: -300px;
  color: #e4e3e4;
  background: radial-gradient(circle, #1a2049 0%, #13162f 100%);
  /*background-color: #333333;*/
  /*background-image: linear-gradient(45deg, darkblue,  #222252);*/
  overflow-x: hidden; /*scroller */
  transition: 0.5s;
  
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}






.sidenav::-webkit-scrollbar {
    background-color:#F5F5F5;
    width:6px
}


.sidenav::-webkit-scrollbar-track {
    background-color:#1a2049;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
.sidenav::-webkit-scrollbar-track:hover {
}

/* scrolling bar itself */
.sidenav::-webkit-scrollbar-thumb {
    background-color:#121633;
    border-radius:16px;
    border:0px solid #000
}
.sidenav::-webkit-scrollbar-thumb:hover {
}

/* set button(top and bottom of the scrollbar) */
.sidenav::-webkit-scrollbar-button {display:none}






@media only screen and (min-width: 1200px) {
  .sidenav {
    position: fixed;
    top: 60px; left:0;
    color: #e4e3e4;
    background: radial-gradient(circle, #1a2049 0%, #13162f 100%);
    overflow-x: hidden; /*scroller */
    transition: 0.5s;
    
      -webkit-user-select: none; /* Safari */
      -ms-user-select: none; /* IE 10 and IE 11 */
      user-select: none; /* Standard syntax */
  }

}




.contents-container{
  width:100%; 
  display: block;
  margin-left: 0;
  transition: 0.5s;
}

@media only screen and (min-width: 1200px) {
  .contents-container{
      width: calc(100% - 300px);
      margin-left: 300px;
      display: inline-block;
    }

}



.sidenav a.fullwidthlink{
  background:blcak;
  color: #e4e3e4;
  padding: 8px 30px 8px 10px;
  text-decoration: none;
  transition: 0.3s;
  display: block;
}

.sidenav .sidemenu-list-items a{
  background:blcak;
  color: #e4e3e4;
  padding: 8px 8px 8px 10px;
  text-decoration: none;
  transition: 0.3s;
}


.sidenav a.fullwidthlink:hover, .sidenav a.fullwidthlink:active {
  color:black;
  padding: 8px 40px 8px 0px;
  background:#e4e3e4;
}

.sidenav a.closebtn {
  float:left;
  font-size: 50pt;
  position: -webkit-sticky;
  position: sticky;
  top: 0; left: 0;
  background-color:black;
}