.card-title {
  font-weight: bold;
  font-size: x-large;
}

.autor-articulo {
  font-style: italic;
}

.texto-articulo {
  font-size: larger;
}

.div-notas {
  border-top: gray;
  border-top-style: double;
}

.nota {
  color: white;
  text-decoration: none;
}

.list-group-item {
  border: none
}

.dropdown-menu {
  animation: 1s slideup;
}

.animacion-slide-right {
  animation-duration: 3s;
  animation-name: slide-in-right;
}

.animacion-slide-left {
  animation-duration: 3s;
  animation-name: slide-in-left;
}

.animacion-fadein {
    animation: fadeIn 0.5s ease-in forwards;
}

.animacion-uno {
    animation-delay: 1s;
}

.animacion-dos {
    animation-delay: 1.5s;
}

.animacion-tres {
    animation-delay: 2s;
}

.animacion-cuatro {
    animation-delay: 2.5s;
}

.animacion-cinco {
    animation-delay: 3s;
}

.animacion-seis {
    animation-delay: 3.5s;
}

.animacion-siete {
    animation-delay: 4s;
}

.custom-tooltip {
  --bs-tooltip-bg: white;
  --bs-tooltip-color: black;  
    border-radius: 7px !important;
  box-shadow: 2px 2px 4px 0px rgba(161, 161, 161, 1);  
}


@keyframes slideup {
  from {
    transform: translateY(-10%);
  }

  to {
    transform: translateY(0);
  }
}

.btn-arriba {
  opacity: 0;
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99;
  border: 2px solid #6c757d;
  background-color: #6c757d;
  background: #6c757d;
  color: white;
  outline: none;
  padding: 15px;
  border-radius: 50%;
  transition: 0.5s;
}

.btn-arriba:hover {
  border: 2px solid #6c757d;
  background-color: white;
  background: white;
  color: rgb(142, 130, 130);
}


.navbar-animacion {
  animation-duration: 1s;
  animation-name: navbar-slide-in;
}

.tarjeta-animacion {
  animation-duration: 1.5s;
  animation-name: slide-in;
}

.tarjeta {
  transition: 1s;
}

.tarjeta:hover {
  background-color: var(--bs-secondary-bg-subtle) !important;
}

.hover-underline {
  font-size: 100px;
  color: black;
  position: relative;
  display: inline-block;
}

.hover-underline::after,
.hover-underline::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background: linear-gradient(to right, #a9a8a8, #202020);
  bottom: -5px;
  left: 0;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.4s ease-out;
}

.hover-underline::before {
  top: -5px;
  transform-origin: left;
}

.hover-underline:hover::after,
.hover-underline:hover::before {
  transform: scaleX(1);
}


@keyframes slide-in {
  from {
    transform: translateY(-5%);
  }

  to {
    transform: translateY(0%);
  }
}

@keyframes navbar-slide-in {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(0%);
  }
}

@keyframes slide-in-right {
  from {
    translate: 150vw 0;
  }

  to {
    translate: 0 0;
  }
}

@keyframes slide-in-left {
  from {
    translate: -150vw 0;
  }

  to {
    translate: 0 0;
  }
}

@keyframes fadeIn {
  from { 
    opacity: 0;
  }

  to { 
    opacity: 1;
  }
}
