body{
    user-select: none !important;
  }
  body {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -user-drag: none;
    -webkit-touch-callout: none;
  }

   
  /* ESTILO PARA LOS BOTONES  */
  
  /* ESTILO PARA EL BOTON NUMERO 1 */
  .boton-estilo-numero-1{
      padding: 15px 20px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 4px 2px;
      color: #fff !important;
      background-size: 200% auto;
      box-shadow: 0 0 20px #eee ;
      box-shadow: none !important;
      border-radius: 10px;
      transition: background-position .5s, color .5s;
      outline: none !important;
    }
    .boton-estilo-numero-1:hover {
      background-position: right center;
      color: black;
    }
    
  /* ESTILO PARA EL BOTON NUMERO 2 */
  .boton-estilo-numero-2 {
    padding: 15px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    color: #fff !important;
    background-size: 200% auto;
    box-shadow: 0 0 20px #eee;
    border-radius: 10px;
    transition: background-position .5s, color .5s;
    outline: none !important;
  }
  .boton-estilo-numero-2:hover {
    background-position: right center;
    color: black;
  }
  
  
  /* ESTILO PARA EL BOTON NUMERO 3 */
  .boton-estilo-numero-3 {
    padding: 15px 20px;
    text-align: center;
    text-decoration: none;
  
    font-size: 16px;
    margin: 4px 2px;
    color: #fff !important;
    background-size: 200% auto;
    box-shadow: 0 0 20px #eee;
    border-radius: 10px;
    transition: background-position .5s, color .5s;
    outline: none !important;
    display: flex;
    max-width: 160px;
    justify-content: center;
    border: none;
  }
  .boton-estilo-numero-3:hover {
    background-position: right center;
    color: black;
  }
  .boton-estilo-numero-3 i{
    font-size: 20px;
    margin-right: 5px;
  }


  /* ESTILO PARA EL BOTON NUMERO 4 */
  .boton-estilo-numero-4{
    padding: 15px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    color: #fff !important;
    background-size: 200% auto;
    box-shadow: 0 0 20px #eee;
    border-radius: 10px;
    transition: background-position .5s, color .5s;
    outline: none !important;
  }
  .boton-estilo-numero-4:hover {
    background-position: right center;
    color: black;
  }


/* ESTILO PARA MENSAJE DE ERROR */
.mensajeDeError{
    color: #a00;
    font-size: 15px;
}


.container-titulo{
  margin: 80px 0 20px 0;
}
@media screen and (min-width:1105px){
  .container-titulo{
    margin: 0 0 20px 0;
  }
}


/* ESTILO PARA LOS INPUTS */
input{
    border: 1px solid #ccc !important;
    padding: 6px;
    width: 100% !important;
    border-radius: 8px !important;
}
input:focus{
    outline: none !important;
    border: 1px solid #D1D5DB !important;
    color: #2793C7 !important;
    font-weight: 700;
    box-shadow: none !important;
}


/* ESTILO PARA LOS BOTONES */
button{
    outline: none;
    border: none;
}

/* ESTILO PARA EL TEXTAREA */
textarea{
    border: 1px solid #ccc !important;
    padding: 6px;
    text-align: justify;
    resize: none !important;
    width: 100%;
    box-shadow: none !important;
    border-radius: 8px !important;
}
textarea:focus{
    outline: none !important;
    border: 1px solid #D1D5DB !important;
    color: #2793C7 !important;
    font-weight: 700;
    box-shadow: none;
}

/* ESTILO PARA LOS PARRAFOS */
p{
    line-height: 1.8;
    text-align: justify;
}





/* ESTILO PARA LO SELECT */
  select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-color: transparent;
    width: 100%;
    border: 1px solid #ccc !important;
    margin-top: 3px;
    box-shadow: none;
    border-radius: 8px !important;
  }

  select:focus {
    outline: none !important;
    box-shadow: none !important;
    border: 1px solid #D1D5DB !important;
  }

/* ESTILOS PARA TITULOS Y SUBTITULOS*/

h1{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 900 !important;
    text-align: center !important;
    width: 100% !important;
    font-size: 20px !important;
    color: #2793C7 !important;
  }
  h2{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 900 !important;
    text-align: center !important;
    width: 100% !important;
    font-size: 18px !important;
    color: #2793C7 !important;
  }

  .iconCorrectoValidacion{
    color: #0a0 !important;
}
.iconErrorValidacion{
    color: #a00 !important;
}
.container-layout{
  height: 100% !important;
}
/* @media screen and (min-width:1286px){
  .container-layout{
    height: 100%;
    border: 5px solid red;
  }
  .container-parrafo-lorem p{
    color: blue;
  }
} */


/* @media screen and (max-width: 1285px){
  .container-layout{
    height: 100% !important;
    border: 5px solid blue;
  }
  .container-parrafo-lorem p{
      color: red;
  }
} */

.swal2-container{
  z-index: 7000 !important;
}
.swal2-cancel{
  background-color: #a00 !important;
}










/* ESTILO PARA EL CSS */
.container-principal-notification{
  overflow: auto;
}
.container-notification{
  max-height: 100vh;
  overflow: auto;
}
.container-notification ul li{
  text-align: justify;
  background-color: #f2f9fd;
  /* border-radius: 25px; */
  font-size: 14px;
  transition: all ease-out 0.5s;
  border: 1px solid #c2e2f5;
}
.container-notification ul li a{
  display: inline-block;
  padding: 15px;
}
.container-notification ul li:hover{
  background-color: #e4f1fa;
}
.nombreUser, .fechaNotification, .horaInicioFinNotification{
  font-weight: bold;
  color: #000;
}
.hora-envio-notification{
  color: #1a7aaf;
  font-weight: bold;
}
.boton-notification{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 80px;
  position: relative;
}
.boton-notication-movil{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}

.boton-notification .icono-numero-notification{
  border-radius: 50% !important;
  display: inline-block;
  margin: 0;
  height: 25px;
  width: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 11px;
  left: -4px;
}
.boton-notication-movil .icono-numero-notification-movil{
  border-radius: 50% !important;
  display: inline-block;
  margin: 0;
  height: 25px;
  width: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -8px;
  left: -6px;
}
.boton-ver-mas-notifications{
  background-color: #2697CC;
  border: 1px solid #c2e2f5;
  color: #fff;

  text-align: center;
  border-radius: 0 0 15px 15px;
}
.boton-ver-mas-notifications button{
  border: none !important;
  outline: none !important;
  padding: 7px;
  width: 100%;
  height: 100%;
}
button{
  outline: none !important;
  order: none !important;
}
.container-boton-refreshNotifications{
  background-color: #FFF3CD;
  padding: 15px;
  font-size: 13px;
  text-align: center;
  border-radius: 25px;
  margin-bottom: 10px;
}
.container-boton-refreshNotifications span{
  color: #856404;
}
.container-boton-refreshNotifications span span{
  color: #856404;
  font-weight: bold;
}
