body, html {
    margin: 0;
    padding: 0;
    height: 100%;
	font-family: 'Overpass', sans-serif;
	font-weight: normal;
    font-size: 100%;
	background-color: #F2F1F0;
}


.body_login{
    color: #1b262c;
    margin: 0;
	background: #2277CC;
	/*padding-top: 50px;
	padding-left: 50px;
	padding-right: 50px;*/
}

ul {
    position: relative;
    margin:0;
    list-style-type: none;
    padding: 0;
    overflow: hidden;
    background-color: transparent;
	width: 85%;
	margin-left: 20px;
	margin-top: 50px;
  }
  ul.menu_secundario{
    margin-top: 0px !important;
  }
  li  {
    /*float: left;*/
    border: 1px solid #62B2E8;
	border-radius: 8px 18px 8px 18px;
	margin-top: 2px;	
  }
  li.menu_secundario{
    height: 25px;
  }
  li a {
    display: block;
    color: #62B2E8;
    text-align: center;
    padding: 8px;
    text-decoration: none;
  }
  li.menu_secundario a{
    padding: 1px !important;
  }
  li a:hover {
    background-color: #62B2E8;
    text-decoration:none;
    color: white;
	border-radius: 8px 15px 8px 15px;	
  }
  
  .row{
	padding-top:12px;  
  }
  
  .notoy{
      display: none;
  }
  
  .labelcheck{
      color: #bbe1fa;
  }
  #chekpass{
      width: 12px !important;
      height: 12px !important;
      display: inline !important;
  }
  
  #actualizar_estado{
      position:relative;
      width:20px;
  }
  
  .formulario_estados{
      width: 90% !important;
      padding: 0 !important;
      margin-top:0px;
      margin-left: 5%;
      height: 10px;
      padding-right: 25px;
  }
  
  .ancho_inputs{
	  width: 100%;
  }
  
  .boton_abacus {
      color: #FFFFFF;
      text-transform: uppercase;
      padding: 6px 10px;
      background: #00DDFF;
      border: initial;
      cursor: pointer;
      border: 1px solid #00CCCC;
      text-align: center;
      margin-top: 30px;
  }
  .masconcep{
      margin-bottom: 25px;
  }
  .boton_abacus:hover{
      border: 1px solid #00EEEE;
      background: transparent;
      color: #00FFFF;
  }
  .filaformulario{
      padding-left: 50px;
      padding-right: 50px;
      margin-top: 0;
      padding-top: 35px;
      padding-bottom: 10px;
      background: #62B2E8;
  }
  .row{
      margin-top: 5px;
  }
  .separaciones{
      margin-top: 10px;
      margin-bottom: 10px;
  }
  
  
  #btnconlistado{
      position: relative;
      float: right;
      margin-right: 100px;
      margin-top: 10px;
  }
  .zona_listado{
      background: #FFFFFF;
      padding-left: 6%;
      padding-bottom: 200px;
      padding-top: 20px;
  }
  .listado_bo{
      background: #FFFFFF;
  }
  .error { color: red; }
  
  .amiroyo{
    background: linear-gradient(rgb(19, 207, 240), black);
    color: #ffffff;
    border-radius: 300px;
    height: 38px;
  }
  
  .columnas{
    text-align: center;
  }

  td{
    padding-left: 5px;
    border: 1px solid #CCDDEE
  }
  /* formulario login  */
  
  
  
  
  #contenedor {
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
      padding: 0;
      min-width: 100vw;
      min-height: 100vh;
      width: 100%;
      height: 100%;
  }
  
  #central {
      max-width: 320px;
      width: 100%;
  }
  
  .titulo {
      font-size: 250%;
      color:#bbe1fa;
      text-align: center;
      margin-bottom: 20px;
  }
  
  #login {
      width: 100%;
      padding: 50px 30px;
      background-color: #3282b8;
      
      -webkit-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.15);
      -moz-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.15);
      box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.15);
      
      border-radius: 3px 3px 3px 3px;
      -moz-border-radius: 3px 3px 3px 3px;
      -webkit-border-radius: 3px 3px 3px 3px;
      
      box-sizing: border-box;
  }
  
  #login input {
      font-family: 'Overpass', sans-serif;
      color: #1b262c;
      display: block;
      width: 100%;
      height: 40px;
      margin-bottom: 10px;
      padding: 5px 5px 5px 10px;
      box-sizing: border-box;
      border: none;
      border-radius: 3px 3px 3px 3px;
      -moz-border-radius: 3px 3px 3px 3px;
      -webkit-border-radius: 3px 3px 3px 3px;
  }
  
  #login input::placeholder {
      font-family: 'Overpass', sans-serif;
      color: #E4E4E4;
  }
  
  #login button {
      font-family: 'Overpass', sans-serif;
      font-size: 110%;
      color:#1b262c;
      width: 100%;
      height: 40px;
      border: none;
      
      border-radius: 3px 3px 3px 3px;
      -moz-border-radius: 3px 3px 3px 3px;
      -webkit-border-radius: 3px 3px 3px 3px;
      
      background-color: #bbe1fa;
      
      margin-top: 10px;
  }
  
  #login button:hover {
      background-color: #0f4c75;
      color:#bbe1fa;
  }
  
  .pie-form {
      font-size: 90%;
      text-align: center;    
      margin-top: 15px;
  }
  
  .pie-form a {
      display: block;
      text-decoration: none;
      color: #bbe1fa;
      margin-bottom: 3px;
  }
  
  .pie-form a:hover {
      color: #0f4c75;
  }
  
  .inferior {
      margin-top: 10px;
      font-size: 90%;
      text-align: center;
  }
  
  .inferior a {
      display: block;
      text-decoration: none;
      color: #bbe1fa;
      margin-bottom: 3px;
  }
  
  .inferior a:hover {
      color: #3282b8;
  }
  
  /* pagina inicial  */
   

  .contenidoindex {
      display: flex;
      height: calc(100% - 70px);
  }
  .sidebar {
      width: 18%;
      background-color: #f2f2f2; /* Color de fondo de la columna lateral */
	  border-left: 5px solid #62B2E8;
  }
  @media screen and (max-width: 600px) {
    .sidebar{
        width: 100%;
    }
  }
  .content {
      flex: 1;
      background-color: #F2F1F0; /* Color de fondo del contenido */
      padding: 5px;
	  margin-left: 4px;
	  /*max-height: 100%;*/
	  border-left: 5px solid #62B2E8;
	  border-bottom: 2px solid #62B2E8;
	  overflow-y: scroll;
  }
  ::-webkit-scrollbar {
    display: none;
  }
  
  #cabecera{
	  padding-top: 5px;
	  text-align: center;
	  height: 70px;
	  background-color: #62B2E8;
  }
  
    
  /* Cosas de clientes  */
  
  .ficha_cliente{
	  border-radius: 15px 15px 15px 15px;
	  border: 1px solid #5555FF;
	  width: 80%;
	  margin-left: 10%;
	  height:250px;
	  background-color: #99FF99;
  }
  .trozopalafoto{
	  width: 200px;
	  height:100%;
	  float:left; 
  }
  #foto_cliente{
	  border-radius: 92px 92px 92px 92px;
	  background-color: #EEAA88;
	  height:190px;
	  width: 190px;
	  margin-top: 30px;
	  margin-left: 5px;
  }
  .todolodemas{
	  padding-top:10px;
	  padding-left:20px;
	  width: calc(100% - 200px);
	  height:100%;
	  float:left;
	  background-color: #EEEEEE;
  }
  .fila_cliente{
	  padding-top: 0px !important;
	  margin-top: 0px !important;
  }
  
  
  /* Dropdown Button */
.dropbtn {
  background-color: #AADDFF;
  color: white;
  padding: 12px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #62B2E8;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #62B2E8; border: 1px solid #62B2E8;}

.boton_menu{
    color: white;
    border: 1px solid #62B2E8;
    background-color:#62B2E8;
}