@charset "UTF-8";
/*=============================================

Estilos del menu lateral

=============================================*/
/* check personalizado, addons de bootstrap y border vertical de las tables */
/* background hover y focus primary button */
/* color hover y focus secondary button */
/* border color buttons */
/* fondo del primary label */
/* fondo fila del datatable seleccionada */
/* color del titulo de las secciones */
/* disabled menu */
/* roll overs radios y checks buttons */
/* roll overs sobre azul oscuro */
/* color anchors */
/*
Menú lateral
*/
/*
Ordenes
*/
/*-----------------------------------------------

	Contenedor 

-----------------------------------------------*/
#lateralMenu {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/*-----------------------------------------------

	Enlaces

-----------------------------------------------*/
#lateralMenu A,
#lateralMenu A:focus {
  color: #FFF;
  display: block;
  box-sizing: border-box;
  padding: 10px 10px 10px 0px;
  opacity: 0;
}

#lateralMenu A:hover,
#lateralMenu A.active {
  color: #e5635c;
}

#lateralMenu A:before {
  font-size: 20px;
  margin: 0px 10px;
  vertical-align: middle;
}

#lateralMenu A.menu-disabled,
#lateralMenu A.menu-disabled:hover,
#lateralMenu A.menu-disabled:focus,
#lateralMenu A.menu-disabled:active {
  color: #8883a3;
  cursor: default;
}

/*-----------------------------------------------

	Abrir y cerrar el menu

-----------------------------------------------*/
.menu-hidden {
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-name: menuHidden;
  animation-name: menuHidden;
  -webkit-animation-duration: 300ms;
  animation-duration: 300ms;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

.menu-show {
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-name: menuShow;
  animation-name: menuShow;
  -webkit-animation-duration: 300ms;
  animation-duration: 300ms;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes menuHidden {
  from {
    width: 243px;
  }
  to {
    width: 42px;
  }
}

@keyframes menuHidden {
  from {
    width: 243px;
  }
  to {
    width: 42px;
  }
}

@-webkit-keyframes menuShow {
  to {
    width: 243px;
  }
  from {
    width: 42px;
  }
}

@keyframes menuShow {
  to {
    width: 243px;
  }
  from {
    width: 42px;
  }
}

/*-----------------------------------------------

	Colores de background para los niveles

-----------------------------------------------*/
A[vmdd-level="0"].vmdd-open,
.vmdd-divContainerChilds-level0 {
  background-color: #4c4766;
}

A[vmdd-level="1"].vmdd-open,
.vmdd-divContainerChilds-level1 {
  background-color: #736b99;
}

/*-----------------------------------------------

	Dropdown elementos

-----------------------------------------------*/
/* Cuando un elemento se despliega le cambiamos el color para que se sepa que escabecera */
.vmdd-open {
  color: #222 !important;
  background-color: #Fff !important;
  border-radius: 10px 10px 0px 0px;
}

/* Para los contenedores */
.vmdd-divContainerChilds {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  height: 300px;
  /* arbitrario, pero necesario */
}

/* collapsar / expandir los contenedores */
.vmdd-closeContainer {
  flex: 0;
}

.vmdd-openContainer {
  flex: 1;
}

.vmdd-openTransition {
  transition: flex 0.3s ease-out;
  height: auto;
}
