@font-face {
  font-family: "gotham";
  src: url(../fonts/Gotham-Book.otf);
}

@font-face {
  font-family: "gotham-bold";
  src: url(../fonts/Gotham-Bold.otf);
}

.font-gotham {
  font-family: "gotham";
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "gotham-bold";
}

.navbar {
  font-family: "gotham" !important;
}

.navbar .navigation .navbar-nav .active .nav-link {
  color: rgb(133 253 94 / var(--tw-text-opacity));
}

.navbar .navigation .navbar-nav .nav-link {
  display: block;
  padding: 0.75rem;
  font-size: 16px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.navbar .navigation .navbar-nav .nav-link:hover {
  --tw-text-opacity: 1;
  color: rgb(218 218 218 / var(--tw-text-opacity));
}

section#home {
  background: url("../../assets/images/hero-banner.webp");
  background-size: cover;
  background-position: center center;
}

.border-white-800 {
  --tw-border-opacity: 1 !important;
  border-color: rgb(255 255 255) !important;
}

.hover\:bg-pandora-500:hover {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(133 253 94) !important;
}

.menu-social svg {
  color: white;
}

.divider {
  height: 300px;
}

h3.pandora-title {
  color: rgb(94 23 187);
  font-size: 2.5rem !important;
}

.bg-morado {
  background-color: rgb(94, 23, 187); /* Morado */
  color: white;
}

.bg-verde {
  background-color: rgb(133, 253, 94);
  color: #5e17bb;
}

.section-padding {
  padding: 4rem;
}

@media (min-width: 768px) {
  .section-padding {
    padding: 6rem;
  }
}

.icon {
  height: 130px;
}

p.justify {
  text-align: justify;
}

.input-field {
  width: 100%;
  padding: 1rem;
  border: 2px solid #5e17bb;
  border-radius: 0;
  background-color: white;
  font-size: 1rem;
  color: #5e17bb;
  outline: none;
  transition: border-color 0.3s;
}

.input-field::placeholder {
  color: #5e17bb;
  opacity: 1;
  font-weight: bold;
}

.input-field:focus {
  border-color: #4c0fae;
}

footer a i {
  color: white;
  transition: color 0.3s, background-color 0.3s;
}

footer a:hover {
  color: #5e17bb;
  background-color: white;
}

footer p {
  margin: 0.5rem 0;
}

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

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

.mr-20 {
  margin-right: 20%;
}

.bg-teal-500 {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(218, 218, 218) !important;
}

@keyframes blink {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}

/* Aplicación de la animación */
.animate-blink {
  animation: blink 1.5s ease-in-out infinite;
}

@media (max-width: 991px) {
  .navbar {
    background-color: rgb(94, 23, 187) !important;
  }
}

.mdi-menu {
  color: white !important;
}

:disabled {
  cursor: not-allowed;
  opacity: 0.75;
  filter: grayscale(45%);
}

[id] {
  scroll-margin-top: 100px;
}