* {
  margin: 0px;
  padding: 0px;

}

body {
  min-width: 360px;
}

.menu {
  position: fixed;
  width: 280px;
  height: 100%;
  font-size: 14px !important;
  background-color: #235B4E;
  overflow: hidden;
  -webkit-transition: width 0.5s cubic-bezier(.61, .01, .37, 1);
  overflow-y: auto;
}

ul.menu > li:nth-of-type(even) { /*odd  even*/
  background: #276657;
  color: #e9e9e9;
}

.contenedor-menu a {
  text-decoration: none;
  color: #fff;
}

.fa.fa-bars {
  color: #898d8d;
}

.contenedor-menu .fa {
  font-size: 15px;
  text-align: center;
  color: white;
}

.contenedor-logos {
  width: 280px;
}

.logo {
  line-height: 45px;
  margin-right: 40px;
}


.menu li ul li a span.logo {
  line-height: 40px;
  margin-right: 5px;
}

.logo-der {
  padding-right: 30px !important;
}


.title-menu {
  /*margin-left: 30px;*/
  line-height: 30px;
}

.derecha {
  float: right;
  margin-top: 15px;
}

/*///////////////////////////////////////////*/

.contenedor-menu .menu li a {
  /*color: #494949;*/
  display: block;
  padding: 0px 20px;
}


.contenedor-menu .menu ul {
  display: none;
}

.contenedor-menu .menu ul li{
  background: #4a4a4a;
  color: #e9e9e9;
  font-size: 13px;
  line-height: 10px;
}

ul.Nivel1 >li:nth-of-type(odd) {
  background: #424242;
  color: #e9e9e9;
}

.contenedor-logos.apps.activado {
  background: #BC955C;
}

li.contenedor-logos.admin.activado {
  background: #BC955C;
}

/*Rotacion felchas Nivel 1*/

.activado > a.title-menu span.derecha {
  transform: rotate(-90deg);
  transition: all 0.5s ease;
}

/*Rotacion felchas Nivel 2*/

span.derecha.fa.fa-chevron-down {
  transition: all 0.5s ease;
}

.sn1.activadoN1 > a.title-menu span.derecha {
  transform: rotate(-90deg);
  transition: all 0.5s ease;
}

/*--------------*/

.contenedor-menu .menu ul li ul li{
  /*background: #8E97A4;*/
  background: #235B4E;
  font-size: 13px;
}

ul.Nivel2 > li:nth-of-type(odd) {
  /*background: #808999 !important;*/
  background: rgb(37, 95, 83)  !important;
  /*color: #e9e9e9;*/

}

ul.Nivel1 .sn1:hover {
  /*background: #808999 !important;*/
  background: #691C32 ;
  /*color: #e9e9e9;*/
}

ul.Nivel2 .sn2:hover {
  /*background: #808999 !important;*/
  background: #10312B  !important;
  /*color: #e9e9e9;*/
  color: #fff !important;
}

.contenedor-logos:hover {
  background: #BC955C  !important ;
}

ul.Nivel1 .an1:hover {
  /*background: #808999 !important;*/
  background: #691C32 ;
  /*color: #e9e9e9;*/
}

.contenedor-menu .menu .activado ul .activadoN1 > a {
  /* background: #ef8d5f;*/
  background: #691C32;
  color: #fff;
 }


li.contenedor-logos.admin {
  color: #fff;
}

.N2 {
  padding: 15px 10px !important;
  /*color: initial !important;*/
}



@media only screen and (min-width: 1025px) {
  .content {
    padding: 1.25em;
    margin-top: 0px;
  }

  .btn-menu {
    display: none !important;
  }
}

@media only screen and (max-width: 1024px) and (min-width: 1009px) {
  .content {
    padding: 1.25em;
    margin-top: 0px;
  }

  .btn-menu {
    display: none !important;
  }

  .fa {
    font-size: 20px;
    text-align: center;
    color: white;
  }
}

@media only screen and (max-width: 1009px) and (min-width: 769px) {
  .fa {
    font-size: 20px;
    text-align: center;
    color: white;
  }

  .content {
    padding: 1.25em;
    margin-top: 0px;
  }

  .menu {
    position: fixed;
    width: 83px;
    height: 100%;
    background-color: #235B4E;
    overflow: hidden;
    -webkit-transition: width 0.5s cubic-bezier(.61, .01, .37, 1);
  }

  /*.menu:hover {
    width: 280px;
  }*/
  .btn-menu {
    display: none !important;
  }
}

@media screen and (max-width: 768px) and (min-width: 450px) {
  .right-panel .navbar-header>.menutoggle {
    display: none;
  }


  .btn-menu {
    position: relative;
    float: right;
    top: 25px;
    padding: 5px;
  }

  .menu {

    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: width 0.5s cubic-bezier(.61, .01, .37, 1);
  }

  .contenedor-logos {
    width: 100%;
  }

}


@media screen and (max-width: 450px) {
  .right-panel .navbar-header>.menutoggle {
    display: none;
  }

  .btn-menu {
    position: relative;
    float: right;
    top: 25px;
  }

  .menu {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: width 0.5s cubic-bezier(.61, .01, .37, 1);
    display: block !important;
  }

  .contenedor-logos {
    width: 100%;
  }

  .user-area {
    
    font-size: 13px;
    }

    .user-area .user-avatar {

      width: 30px;
    }

}

