/* COLORES Y ETC */
.color-texto-blanco{
  color:white !important;
}

.btn-success{
    background-color: #004236 !important;
    border:none;
}

body{
    font-family: "Noto Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 12px;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

h2{
  font-style: italic
}

.btn-primary{
    background-color: #004236 !important;
    color: white;
}

.nav-pills .nav-link {
  color: white; /* Color del texto */
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out; /* Efecto de transición */
  border-radius: 0;
}

.nav-pills .nav-link:hover {
  background-color: #BC955C;
  color: white; /* Color del texto al pasar el mouse */
}

.image-nav{
  width: 110px;
  height: auto;
  vertical-align: sub;
  margin-right: 3%;
}

.text-align-center{
    text-align: center;
}

.button {
    position: relative;
    width: 156px;
    height: 40px;
    cursor: pointer;
    display: flex;
    align-items: center;
    border: 1px solid #34974d;
    background-color: #3aa856;
  }
  
.button, .button__icon, .button__text {
  transition: all 0.3s;
}
  
.button .button__text {
  transform: translateX(3px);
  color: #fff;
  font-weight: 500;
  font-size: 12px;
}
  
.button .button__icon {
  position: absolute;
  transform: translateX(109px);
  height: 100%;
  width: 39px;
  background-color: #34974d;
  display: flex;
  align-items: center;
  justify-content: center;
}
  
.button .svg {
  width: 30px;
  stroke: #fff;
}
  
.button:hover {
  background: #34974d;
}
  
.button:hover .button__text {
  color: transparent;
}
  
.button:hover .button__icon {
  width: 148px;
  transform: translateX(0);
}
  
.button:active .button__icon {
  background-color: #2e8644;
}
  
.button:active {
  border: 1px solid #2e8644;
}

.userIcon{
  width: 70px;
  height: auto;
}

.vertical-align-middle{
  vertical-align: middle;
}

hr{
  color: white;
}

.navbar{
  position:fixed;
  top:0;
  left: 0;
  padding:1;
  width: 100%;
  z-index:2;
  color: white !important;
  background-color: #004236 !important;
}


/* Pantalla movil */
@media(max-width: 767px){
    .img{
      display:none;
    }
    
    .hide{
        display: none;
    }
    
    #mySidebar{
        display: none;
        background-color: #004236 !important;
    }
    
    .tabla-usuarios-registrados{
        overflow: auto;
    }
    
    .titulo-principal{
        display:none !important;
    }
    
    .content{
        padding-top: 13%;
    }
}

/*Pantalla grande*/
@media(min-width: 768px){
    .btn-hide{
        display: none;
    }
    
    #mySidebar{
        display: block !important;
        width: 250px; 
        height: -webkit-fill-available;
        background-color: #004236 !important;
    }
    
    .titulo-principal-2{
        display: none !important;
    }
    
    .tabla-usuarios-registrados{
        overflow: auto;
    }
    
    body{
      margin-top: 5%;
    }
    
    main{
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
    }
    
    .img{
      width: 70px;
      height: auto;
    }
    
    .content{
      margin-left: 21%;
      margin-top: 2%;
      margin-right: 2%;
    }
}