.oculto
{
	visibility: hidden;
	display:none;
}

.center
{	
	text-align:center;
}

.right
{
	text-align:right;
	
}

.headermodal, .close 
{
    background-color: #03a9f3;
    color:white !important;
    text-align: center;
    font-size: 30px;
}
        
.footermodal 
{
	background-color: #f9f9f9;
}

.fecha{
    /*font-family: 'Oswald', sans-serif;*/
    font-size: 2em;
    text-align: center;
    /*margin-bottom: 0.3rem;*/
    /*padding: 1em;*/
    width: 100%;
    /*background-color: rgba(0,0,0,0.5);*/
    
}
.reloj{
    /*font-family: 'Oswald', sans-serif;*/
    font-size: 2em;
    text-align: center;
    margin-bottom: 0.3rem;
    /*padding: 1em;*/
    width: 100%;
    /*background-color: rgba(0,0,0,0.5);*/
    
}

/*////////// Center the loader //////////*/
#loader {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 120px;
  height: 120px;
  margin: -76px 0 0 -76px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

 .switch-button {
                display: inline-block;
            }
            .switch-button .switch-button_checkbox {
                display: none;
            }
            .switch-button .switch-button_label {
                background-color: #fe5e41;
                width: 2rem;
                height: 1.25rem;
                border-radius: 1rem;
                display: inline-block;
                position: relative;
            }
            .switch-button .switch-button_label:before {
                transition: .2s;
                display: block;
                position: absolute;
                width: 1.25rem;
                height: 1.25rem;
                background-color: #fdffff;
                content: '';
                border-radius: 50%;
                box-shadow: inset 0px 0px 0px 1px #000;
            }
            .switch-button .switch-button_checkbox:checked + .switch-button_label {
                background-color: #00a878; 
            }
            .switch-button .switch-button_checkbox:checked + .switch-button_label:before {
                transform: translateX(0.75rem);
            }


 .centrar-tabla {
            display: flex;
            justify-content: center;
            align-items: center; 
        }

 .espaciar-icono{
    margin-right: 10px; /* Ajusta el valor según la separación que desees */
}

 .rectanguloGris {
  background-color: lightgrey;
  padding: 10px;
  border-radius: 5px; /* opcional, para esquinas redondeadas */
}

 .mi_card-body {
    flex: 1 1 auto;
    padding: 1.25rem;
    background: linear-gradient(to top, #63c8f3, #f9f9f9);
    border-radius: 16px; 
    border: 1px solid #0052a0;
    padding: 15px 10px;
}

.mi_card-body {
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.mi_card-body:hover {
    transform: scale(1.05);
}
 
/*---------------------------------------------------------------------
                        Back to Top
-----------------------------------------------------------------------*/
#back-to-top .top { z-index: 999; position: fixed; margin: 0px; color: #fff; background: #fb9678; position: fixed; bottom: 85px; right: 25px; z-index: 999; font-size: 26px; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 90px; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
#back-to-top .top:hover { background: #fa7953; color: #fff; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); }
/*---------------------------------------------------------------------
                        Back to Bottom
-----------------------------------------------------------------------*/
#back-to-bottom .bottom { z-index: 999; position: fixed; margin: 0px; color: #fff; background: #fb9678; position: fixed; bottom: 25px; right: 25px; z-index: 999; font-size: 26px; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 90px; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
#back-to-bottom .bottom:hover { background: #fa7953; color: #fff; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.1); }
 
.bg-verde-suave {
    background-color: #d4edda !important; /* tono verde claro */
 }