.quitar_icono_error {
  padding-right: 3px !important;
  background-image: none !important;
}

body {
  background-color: #fff;
  color: #555;
}

/*################################ menu navegacion ########################*/
.navbar {
  background-color: #6e8ae7;

}

nav>div>a,
.spanTitulo {
  color: white !important;

  text-decoration: none;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: #6e8ae7 !important;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

.line {
  border-bottom: 2px solid grey;
  margin: 10px 0px;
}

/*################### botones ###########*/
.btn {
  box-shadow: 5px 5px 0px 0px #ffffff00;
  background-color: #fff;
  color: #555;
  border: 3px solid #555;
}

.btn:focus {
  color: #555;
  background-color: #fff;
  border: 3px solid #555;
  outline: 0;
  box-shadow: 5px 5px 0px 0px #6e8ae7;
}

.btn:hover,
.btn:active {
  background-color: #fff !important;
  box-shadow: 5px 5px 0px 0px #6e8ae7;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-primary:hover,
.btn-primary:active {
  background-color: #fff !important;
  box-shadow: 5px 5px 0px 0px #6e70e7;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-success:hover,
.btn-success:active {
  background-color: #fff !important;
  box-shadow: 5px 5px 0px 0px #54b378;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-warning:hover,
.btn-warning:active {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #e7cb6e;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-danger:hover,
.btn-danger:active {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #e76e6e;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-none:hover,
.btn-danger:active {
  background-color: #fff;

  box-shadow: 5px 5px 0px 0px #555;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-info:hover,
.btn-info:active {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #9c6ee7;
  color: #555 !important;
  border: 3px solid #555 !important;
}

.btn-border {
  border-color: #ddd;
}

.btn-add {
  z-index: 99999;
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: inline-block;
  background-color: #54b378;
  color: white;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.alerta-btn {
  box-shadow: 5px 5px 0px 0px #7e7e7e00;
  background-color: none;
  text-decoration: none;
  border: 3px solid #555 !important;
  padding: 10px;
  cursor: pointer;
  color: #555;
  border-radius: 5px;
  display: block;
}

.alerta-btn:hover {
  box-shadow: 5px 5px 0px 0px #979797;
  background-color: #3f3f3f8f;
  color: balck;
}

.form-select {
  box-shadow: 5px 5px 0px 0px #ffffff00;
  border: 3px solid #ddd;
}

.form-select:focus {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #6e70e7;
  color: #555;
  border: 3px solid #555;
  outline: 0;
}

.form-control {
  box-shadow: 5px 5px 0px 0px #ffffff00;
  border: 3px solid #ddd;
}

.form-control:focus {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #6e70e7;
  color: #555;
  border: 3px solid #555;
  outline: 0;
}

footer {
  position: relative;
  bottom: 0;
}

#virtual:checked~.virtual,
#presencial:checked~.presencial,
#ambos:checked~.ambos,
#masculino:checked~.masculino,
#femenino:checked~.femenino {
  border-color: #555;
  background-color: #ffffff17;
  box-shadow: 5px 5px 0px 0px #6e8ae7;
}

.radio {
  display: none;
}

.label {
  box-shadow: 5px 5px 0px 0px #ffffff00;
  text-align: center;
  padding: 10px 15px;
  border: 3px solid #ddd;
  border-radius: 5px;
  background-color: #fff;
  color: #555;
  cursor: pointer;
  margin-left: 5px;
}

.label:hover {
  transition: 1s;
  background-color: #ffffff17;
  border-color: #555;
  box-shadow: 5px 5px 0px 0px #6e8ae7;
}


.custom-border-shadow {
  box-shadow: 5px 5px 0px 0px #6e8ae7;
}


.custom-form-check-input:checked[type="checkbox"] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23555' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
  box-shadow: 4px 4px 0px 0px #252f52;
  background-color: #fff;
  border-color: #555;

}

.custom-form-check-input:focus {
  border-color: #555;
  outline: 0;
  box-shadow: 4px 4px 0px 0px #ffffff00;
}

#html5-qrcode-anchor-scan-type-change {
  color: #555 !important;
}

/*########################## onda animacion ##################################*/
.wave {
  z-index: -1;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 129'%3E%3Cpath d='M-13.8,44.4C443,-74.6 649,98.3 978,88.6 1307,79 1402,-17.2 1402,-17.2L1256,213 126,199 -62.7,155.8c0,0-38,-61.5 48.9,-111.4z' fill='%236e70e7' fill-opacity='0.5'/%3E%3C/svg%3E");
  background-size: 1000px 100px;
}

.wave {
  animation: animateWave 10s linear infinite;
}

@keyframes animateWave {
  0% {
    background-position-x: 0;
  }

  100% {
    background-position-x: 1000px;
  }
}

/*############################ animacion logo #####################*/
.contenedorimagenes {
  position: relative;
}

.imagen-login {
  position: absolute;
  width: 320px;
  left: 80px;
  opacity: 0;
}

.puff-in-center {
  -webkit-animation: puff-in-center 8s ease-in-out infinite;
  animation: puff-in-center 8s ease-in-out infinite;
}

.puff-in-center2 {
  -webkit-animation: puff-in-center2 8s ease-in-out infinite;
  animation: puff-in-center2 8s ease-in-out infinite;
}

.puff-in-center3 {
  -webkit-animation: puff-in-center3 8s ease-in-out infinite;
  animation: puff-in-center3 8s ease-in-out infinite;
}

/* ----------------------------------------------
 * Generated by Animista on 2024-5-10 15:13:54
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation puff-in-center
 * ----------------------------------------
 */
@-webkit-keyframes puff-in-center {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  31% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  36% {
    opacity: 0;
  }
}

@keyframes puff-in-center {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  31% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  36% {
    opacity: 0;
  }
}

@-webkit-keyframes puff-in-center2 {
  31% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  62% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  67% {
    opacity: 0;
  }
}

@keyframes puff-in-center2 {
  31% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  62% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  67% {
    opacity: 0;
  }
}

@-webkit-keyframes puff-in-center3 {
  62% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  93% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes puff-in-center3 {
  62% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }

  93% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.loading-page {
  z-index: 99999;
  position: fixed;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, rgba(94, 130, 227, 1) 0%, rgba(31, 54, 117, 1) 100%);

  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: center;
  justify-content: center;
  color: #191654;
}

path {
  stroke: #fff !important;
  fill-opacity: 0 !important;
  stroke-width: 0.3px !important;
  stroke-dasharray: 4500;
  animation: draw 30s ease;
}

@keyframes draw {
  0% {
    stroke-dashoffset: 4500;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

.telefono {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left-width: 0;
}

.cod-area {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right-width: 0;
}

.telefono.is-invalid {
  border-left-width: 1px;
}

.cod-area.is-invalid {
  border-right-width: 1px;
}

.border-telefono {
  border-left-width: 0 !important;
}

.border-cod-area {
  border-right-width: 0 !important;
}

#alerta>.alert {
  width: auto;
  position: fixed;
  top: 200px;
  left: 50%;
  z-index: 50;
  transform:
    translate(-50%);
}

@keyframes iconoCopy {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(0);
  }

  50% {
    transform: scale(1.5);
  }

  70% {
    transform: scale(1);
  }
}

.animate {
  animation: iconoCopy 3s linear;
}
/* ######select  */

.form-floating.active .menuSelect {
  display: block;
}

.form-floating.active .form-select {
  background-color: #fff;
  box-shadow: 5px 5px 0px 0px #6e70e7;
  color: #555;
  border: 3px solid #555;
  outline: 0;
}

.menuSelect {
  display: none;
  position: absolute;
  z-index: 4;
  width: 100%;
  background-color: rgb(255, 255, 255);
  border: 1.5px solid #ddd;
  border-radius: 5px;
  margin-top: 5px;
  padding: 5px;
}

.options {
  max-height: 200px;
  overflow-y: auto;
  list-style: none;
  padding: 0;
}

.select-text {
  white-space: nowrap;
  text-transform: none;
}

.option {
  width: 100%;
  padding: 5px 10px;
  text-decoration: none;
}

.option:hover {
  background-color: #ddd;
}

.search {
  position: relative;
}

.search i {
  left: 15px;
  line-height: 53px;
  position: absolute;
}

.form-select.select-btn {
  overflow: hidden;
  text-overflow: ellipsis;
  align-items: center;
  vertical-align: middle;
  
}
.optionSelected{
  background-color: #b9baff;
}
.optionSelected:hover {
  background-color: #9091e0;
  color: white;
}
.buscadorSelect {
  height: 53px;
  outline: none;
  font-size: 17;
  padding: 0 15px 0 43px;
  width: 100%;
}

.lineaSelect {
  width: 100px;
  border: 1px solid #555;
}

.option-value {
  cursor: default;
}

.disabled {
  color: gray !important;
}