:root{
  --main-bg-color: coral;
  --cabecera-bg-color: #2d3436;
  font-family: Convergence; 
  
}


*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}


    
.boton-cod{
  margin: 2px;
  width: 50px;
  height: 50px;
  font-size: 30px;
}
.boton-cod:hover{
  background-color: #34499b;
  border-radius: 0 !important;
}

.w200{
  width: 200px;
}
    
    
    .bgprincipal{
      background-color:   #eff1fc;/*rgba(149, 165, 166,.5);/* rgba(223, 230, 233,.7);*/
     /* background: rgb(53,53,55);
background: linear-gradient(270deg, rgba(53,53,55,1) 0%, rgba(83,83,88,1) 50%, rgba(32,35,36,1) 100%);*/
    }
    .bg-oscuro-1{
      background-color: #1e3799 !important;/*#2d3436;*/
      color: #f1f1f1;
      text-decoration: none;
    }
    .bg-oscuro-1 a{
      text-decoration: none;
      color: #f1f1f1;
    }
    .bg-oscuro-1 a:hover{
      text-decoration: none;
      color: #d1cbcb;
    }
    .border-oscuro-1{
      border: 1px solid #1e3799 !important;
      
    }
    .btn-oscuro-1:hover{
      color: #1e3799 !important;
    }
    .text-oscuro-1{
      color: #1e3799 !important;
    }
    .bg-l5{
      background-color: #eff5fc !important;
    }
    .margentoplogo{
      margin-top: -45px;
    }
    .bg-secondary{
      color: rgb(241, 238, 238) !important;
    }
    
    .custom-file-input:lang(es)~.custom-file-label2::after {
      content: "Explorador" !important;
  }

  .d-none{
    display: none !important;
  }

    /************************************ centrar *************/
    .centrado{
    margin-left: auto;
    margin-right: auto;
    }
    
    /******************************* fondo blanco transparente ******************/
    .bg-white-50{
    background: rgba(255,255,255,.5);
    }
    .bg-white-30{
    background: rgba(255,255,255,.3);
    }
    .bg-white-20{
    background: rgba(255,255,255,.2);
    }
    /******************************* fondo verde transparente ******************/
    .bg-verde-50{
    background: rgba(0,204,0,.5);
    }
    .bg-verde-30{
    background: rgba(0,204,0,.3);
    }
    .bg-verde-20{
    background: rgba(0,204,0,.2);
    }
    .bg-l4{
      background-color: rgba(96, 163, 188,.3) !important;
    }
    /******************************* border redondeados ******************/
    .rounded-3{
    border-radius: 3px;
    }
    .rounded-4{
    border-radius: 4px;
    }
    .rounded-5{
    border-radius: 5px;
    }
    .rounded-7{
    border-radius: 7px;
    }
    .rounded-10{
    border-radius: 10px;
    }
    .rounded-50{
    border-radius: 50%;
    }
    /******************************* opacitys ******************/
    .opaci-10{
    opacity : 0.1;
    }
    .opaci-25{
    opacity : 0.25;
    }
    .opaci-50{
    opacity : 0.5;
    }
    .opaci-75{
    opacity : 0.75;
    }
    /****************************** varios colores fondo ********/
    .bg-bio1{
    background-color:rgb(230, 230, 230);
    }
    .bg-azul1{
    background-color: rgb(0, 38, 153);
    }

    .bg1{
      background-color: #2c3e50;
    }
    .bg2{
        background-color: #bdc3c7;
    }
    .bg3{
        background-color: #ecf0f1;
    }

    /*********************************************************************      tr hover    ***/
    .my-tr:hover
      {
        background-color: rgba(137, 147, 150,.5) !important;
      }
    
    .tr-seleccionado
      {
        background-color: #1abc9c !important;
        color: black;
      }
    

    /*******************************************************************************************************/
    a:hover{
        text-decoration: none;
      }
    
      a{
        text-decoration: none;
      }
    
      .sidenav{
        text-decoration: none;
      }
    
      .sidenav:hover{
        text-decoration: none;
      }
    
      .sidenav a:hover{
        text-decoration: none;
        text-transform: uppercase;
      }
    
      select{
        border: 0;
      }
    
      .sinborde{
        border:0;
      }

      .pointer:hover {
        cursor: pointer;
      }

      .box{
        min-height: 200px;
        max-height: 300px;
        overflow-y: scroll;
      }

      /* The sidebar menu */
.sidenav {
    height: 100%; /* Full-height: remove this if you want "auto" height */
    width: 160px; /* Set the width of the sidebar */
    position: fixed; /* Fixed Sidebar (stay in place on scroll) */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: #111; /* Black */
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 20px;
  }
  
  /* The navigation menu links */
  .sidenav a {
    padding: 6px 8px 6px 16px;
    text-decoration: none;
    font-size: 18px;
    color: #818181;
    display: block;
  }
  
  /* When you mouse over the navigation links, change their color */
  .sidenav a:hover {
    color: #f1f1f1;
  }
  
  /* Style page content */
  .main {
    margin-left: 160px; /* Same as the width of the sidebar */
    padding: 0px 10px;
  }
  
  /* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
  @media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
  }
/****************************************************************************************************************/
.results tr[visible='false'],
.no-result{
  display:none;
}

.results tr[visible='true']{
  display:table-row;
}

.counter{
  padding:8px; 
  color:#ccc;
}
a.rojo{
  color: #c0392b;
}
a.rojo:hover{
  color: #c0392b;
}


/*************************************************************  style para checkbox switch  */
input[type=checkbox]{
  height : 0;
  width: 0;
  visibility: hidden;
  }
  
  .labelc {
  cursor: pointer;
  text-indent: -9999px;
  width: 50px;
  height: 31px;
  background: gray;
  display: block;
  border-radius: 3px;
  position: relative;
  }
  
  .labelc:after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 27px;
  background: #fff;
  border-radius: 3px;
  transition: 0.3s;
  }
  
  input:checked + .labelc{
  background : #27ae60;
  }
  
  input:checked + .labelc:after{
  left: calc(100% - 2px);
  transform: translateX(-100%);
  
  }
  
  .labelc:active:after{
  width: 65px;
  }
/*******************  MI TABLE  *************/

.thead-gris-1{
  background-color: rgb(214, 208, 208);
  color: #2c3e50;
}

.tdDestino:hover{
  background-color: #34499b;
  color: #bdc3c7;
}



/*********************************************************************************************************************************************/
/*                          CSS PARA LA TABLAS DESPLEGABLES*/



  #container-main{
    margin:40px auto;
    width:95%;
    min-width:320px;
    max-width:960px;
  }



  .accordion-container {
    width: 100%;
    clear:both;
  }

  .accordion-titulo {
    position: relative;
    display: block;
    /*background: #2c3e50;
    color: #fff;*/
    text-decoration: none;
    border: solid 1px rgb(168, 167, 167);
  }
  /*.accordion-titulo.open {
    /*background: #16a085;
    color: #fff;*
  }*/
  .accordion-titulo:hover {
    /*background: #d3d4d4;*/
    text-decoration: none;
  }

  .accordion-titulo span.toggle-icon:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content:"\f0d7";
  }

  .accordion-titulo.open span.toggle-icon:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content:"\f0d8";
  }


  .accordion-titulo span.toggle-icon {
    position: absolute;
    right: 20px;
    font-weight:bold;
  }

  .accordion-content {
    display: none;
    padding: 20px;
    overflow: auto;
  }

  .accordion-content p{
    margin:0;
  }

  .accordion-content img {
    display: block;
    float: left;
    margin: 0 15px 10px 0;
    width: 50%;
    height: auto;
  }




/*********************************************************************************************************************************************/
@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
    .d-print-inline-block
    {
      display: inline-block !important;
    }
}


.mytr a{
  display: none !important;
}
.mytr:hover a{
  display: inline !important;
}
.mytr:last-child{
  width: 200px !important;
}



/***********************  para links **************************/
  
.a-primary
{
  color: #007bff !important;
} 
.a-primary:hover
{
  color: #0069d9 !important;
  cursor: pointer !important;
} 
.a-success
{
  color: #28a745 !important;
}
.a-success:hover
{
  color: #218838 !important;
  cursor: pointer !important;
}

.a-danger
{
  color: #dc3545;
}
.a-danger:hover
{
  color: #c82333 !important;
  cursor: pointer !important;
}

/* ------------------------------------------------------------------
   Traidas del my.css compartido de app6 al dejar de usar
   URLWEBRESOURCES. Son las dos unicas reglas que la aplicacion usa y
   que no estaban en la copia local: el fondo del body de toda pagina
   autenticada (views/header.php) y el ojo de ver contrasena del login
   (views/main/login.php).
   ------------------------------------------------------------------ */
.bg-info-20
{
  background-color: rgba(23, 162, 184,.2) !important;
}

.btn-eye:hover
{
  background-color: #55595c;
  color: rgb(244, 242, 248) !important;
  cursor: pointer;
}