nav.sidebar, .main{
      margin:0px;
      background-color:#1C1C1C; 

  }

  .main{
    padding: 10px 10px 0 10px;
  }

 @media (min-width: 765px) {

    .main{
      position: absolute;
      width: calc(100% - 40px); 
      margin-left: 40px;
      float: right;

    }
    .main-container 
    {
        display:block !important;
    }

    nav.sidebar:hover + .main{
      margin-left: 200px;
    }

    nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand {
      margin-left: 0px;
    }

    nav.sidebar .navbar-brand, nav.sidebar .navbar-header{
      text-align: center;
      width: 100%;
      margin-left: 0px;
    }
    
    nav.sidebar a{
      padding-right: 13px;
      color:#999;
    }

    nav.sidebar .navbar-nav > li:first-child{
      border-top: 1px #e5e5e5 solid;
    }

    nav.sidebar .navbar-nav > li{
      border-bottom: 1px #e5e5e5 solid;
    }

    nav.sidebar .navbar-nav .open .dropdown-menu {
      position: static;
      float: none;
      width: auto;
      margin-top: 0;
      background-color: transparent;
      border: 0;
      -webkit-box-shadow: none;
      box-shadow: none;
    }

    nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{
      padding: 38px 0px 0 0px;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
      color: #DDD;
    }

    nav.sidebar{
      width: 220px;
      height: 100%;
      margin-left: -180px;
      float: left;
      margin-bottom: 0px;
      position:fixed;
      z-index: 999;
      transition:margin-left .2s ease .2s;
      -moz-transition:margin-left .2s ease .2s;
      -ms-transition:margin-left .2s ease .2s;
      -webkit-transition:margin-left .2s ease .2s;
      -o-transition:margin-left .2s ease .2s;
    }

    nav.sidebar li {
      width: 218px;
    }

    nav.sidebar:hover,  nav.sidebar:focus{
      margin-left: 0px;
    }

    .forAnimate{
      opacity: 0;
    } 
  }  
  
  nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
    color: #FFF;
    background-color: transparent;    
  }

  nav:hover .forAnimate{
    opacity: 1;
  }
  section{
    padding-left: 15px;
  }
  


.navbar-nav::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;	
}

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

.navbar-nav::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: #AAA;
	border-radius: 10px;	
}

.navbar-nav {
     overflow-y: auto;
     overflow-x: hidden;
     direction: rtl;  
     padding: 0;
     height:100%;
}

.navbar-nav li a{
    text-align:left; 
}