* {
  font-family: sans-serif;
}

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

.flex-column {
  flex-flow: column;
}

.text-azul {
  color: #07094d;
}

.text-azul-menu:hover {
  color: #32333b;
}

.bg-azul {
  background-color: #07094d;
}

.bg-gris-claro {
  background-color: #e2e3e5;
}

.text-gris-claro {
  color: #e2e3e5;
}

.bg-amarillito {
  background-color: #ffd967;
}

.text-amarillito {
  color: #ffd967;
}

.text-verde {
  color: #26c40a;
}

.bg-verde {
  background-color: #26c40a;
}

.btn-verde {
  color: #f8f9fa;
  background-color: #26c40a;
  border-color: #26c40a;
}

.btn-azul {
  color: #f8f9fa;
  background-color: #07094d;
  border-color: #07094d;
}

.btn-azul:hover {
  color: #f8f9fa;
  background-color: #060731;
  border-color: #060731;
}

.btn-gris-claro {
  color: #6c757d;
  background-color: #e2e3e5;
  border-color: #e2e3e5;
}

.btn-gris-claro:hover {
  color: #6c757d;
  background-color: #b3b3b3;
  border-color: #b3b3b3;
}

.btn-nav {
  color: #f8f9fa;
  font-weight: bold;
}

.btn-nav:hover {
  color: #07094d !important;
  background-color: #f8f9fa !important;
}

.btn-nav:active {
  color: #07094d !important;
  background-color: #f8f9fa !important;
}

.text-bold {
  font-weight: bold;
}

.loading {
  display: none;
  position: fixed;
  top: 45%;
  left: 45%;
}

body {
  background-color: #f8f9fa;
}
.btn-filtro {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  background-color: #07094d;
  border-top-right-radius: 0.25rem !important;
  border-bottom-right-radius: 0.25rem !important;
}

.btn-trio {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  box-shadow: none !important;
}

.form-control-filtro {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  border-top-left-radius: 0.25rem !important;
  border-bottom-left-radius: 0.25rem !important;
}

.btn-outline-azul {
  color: #07094d;
  border-color: #07094d;
  box-shadow: none !important;
}

.btn-outline-azul:hover {
  color: #fff;
  background-color: #07094d;
  border-color: #07094d;
}

.btn-check:checked + .btn-outline-azul,
.btn-check:active + .btn-outline-azul,
.btn-outline-azul:active,
.btn-outline-azul.active,
.btn-outline-azul.dropdown-toggle.show {
  color: #fff;
  background-color: #07094d;
  border-color: #07094d;
}

.btn-outline-azul:disabled,
.btn-outline-azul.disabled {
  color: #07094d;
  background-color: transparent;
}

.info-cancha {
  display: none;
  /* Ocultar inicialmente el div de información */
  margin-top: 20px;
  border: 1px solid #07094d;
  padding: 10px;
}

.grid-tarjetas {
  display: grid !important;
  gap: 1rem !important;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
}

.floating {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 10px !important;
  z-index: 9999 !important;
}

.navbar-panel {
  width: 16.66%;
}

@media (width <= 1260px) {
  .mostrar-pc {
    display: none !important;
  }
}

@media (width > 1260px) {
  .mostrar-mobile {
    display: none !important;
  }
}

@media (width <= 1645px) {
  .img-mostrar-pc {
    display: none !important;
  }
}

@media (width > 1645px) {
  .img-mostrar-mobile {
    display: none !important;
  }
}

@media (width <= 768px) {
  .nav-mostrar-pc {
    display: none !important;
  }
  .container {
    margin: 0;
    min-width: 100%;
  }
}

@media (width < 768px) {
  .btn-espacio {
    margin-top: 1rem;
  }
}

@media (width > 768px) {
  .nav-mostrar-mobile {
    display: none !important;
  }
}

.mapa {
  height: 20vh;
}