
@import url('https://fonts.googleapis.com/css2?family=Caesar+Dressing&family=Jersey+20&display=swap');


body {
  background-color: #000000 !important;
  background-image: linear-gradient(90deg, #393939 2px, transparent 1px), linear-gradient(#565656 2px, transparent 1px);
  background-position: 10px 10px;
  background-size: 22px 22px;
 transition: 2s;

}


.hidden {
  opacity:0;
  margin-top:70px;
}

.visible {
  opacity:1;
  margin-top:20px;
}







h1,h2 {
font-family: "Caesar Dressing", system-ui;
  font-weight: 400;
  font-style: normal;


  
}
.divider {
 border-style:dashed;
 border-width: 2px;
 opacity:100%;
}


li {
  margin-top:5px;
}

h3{
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}

#title, .seccion {
  background-color: black;

  color:white;
  text-align:center;

}
#titlebig {
text-shadow: 4px 4px 0px rgb(98, 13, 34);
  transform: rotate(-5deg);
  pointer-events: none;

}


h2,h3,h4 {
   font-family: "Jersey 20", sans-serif;
  font-weight: 400;
  font-style: normal;
}

a {
  color:white !important;
  transition:0.3s;
  text-decoration:none !important;
}

a:hover {
  color:#565656 !important;
}

.link {
  display: inline-block;
  position: relative;
  background-color: #000000 !important;

}


.link::after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #a7a7a7;
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;
}

.link:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}

.navbar .navbar-collapse {
  text-align: center;
}




.link {
  margin-bottom:-1px;
}

#contenedor {
   position: relative;
    display: inline;
}



#mini {
  height:240px;
  position:absolute;
right:200px;
 top:-70px;
 z-index: 1;
  
 


}


#mini:hover {
  
 animation: boing 1.2s ease-in-out;
}


#listing {
  margin-top:25px;
}
.carousel-inner img {
  margin: auto;
}

#info {
  overflow-wrap: break-word;
  text-align:start;
  margin-top:40px;
}

button {


  background-color:rgb(116, 15, 15);
  color:white;
  border:black;
  font-family:monospace;
}

#price {
  color:rgb(77, 160, 13);
}

@keyframes boing {
15%, 40%, 75%, 100% {
      transform-origin: center center;
  }
  15% {
      transform: scale(1.3, 1.1);
  }
  40% {
      transform: scale(0.95, 0.95);
  }
  75% {
      transform: scale(1.05, 1);
  }
  100% {
      transform: scale(1, 1);
  }
}


