@font-face {
  font-family: "GothamBook";
  src: url(../fonts/GothamBook.ttf);
  font-weight: 400;
}

body {
  font-family: "GothamBook", sans-serif !important;
  background-color: #101010 !important;
  color: #ffffff !important;
  overflow-x: hidden !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
button {
  font-family: "GothamBook", sans-serif !important;
}

td,
th {
  vertical-align: middle !important;
}

p,
span,
a {
  font-size: 14px;
}

.h1,
.h2,
.h4 {
  font-weight: 700;
}

.h2 {
  text-transform: uppercase;
}

.bg-degradee {
  background: #989898;
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    from(#989898),
    to(#4a4a4a)
  );
  background: linear-gradient(90deg, #989898 0%, #4a4a4a 100%);
}

.position-nav {
  top: 0;
  position: absolute;
}

@media (max-width: 1000px) {
  .bg-mobile {
    background-color: #101010 !important;
  }
}

span.text-absolute {
  position: absolute;
  top: 0;
  left: 0%;
  right: 0;
  white-space: nowrap;
  font-size: 250px;
  font-weight: 700;
  text-shadow: 1px 0 0 #404040, -1px 0 0 #404040, 0 1px 0 #404040,
    0 -1px 0 #404040, 1px 1px #404040, -1px -1px 0 #404040, 1px -1px 0 #404040,
    -1px 1px 0 #404040;
  color: #101010;
  z-index: -1;
  opacity: 0.5;
  max-width: 1024px;
}

div#day_value,
div#hour_value,
div#min_value,
div#sec_value {
  font-family: "GothamBook", sans-serif !important;
  font-size: 40px;
}

form#registerExperience input {
  background: #101010;
  color: #ffffff;
  border: 1px solid black;
}

form#registerExperience input::-webkit-input-placeholder {
  color: #ffffff;
}

form#registerExperience input:-ms-input-placeholder {
  color: #ffffff;
}

form#registerExperience input::-ms-input-placeholder {
  color: #ffffff;
}

form#registerExperience input::placeholder {
  color: #ffffff;
}

#header-site {
  width: 100%;
  background-image: url("https://mundoarjona.com/images/experience/background.jpg");
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  margin: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

#header-site::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(16, 16, 16, 0.7);
}

#header-site-domo {
  width: 100%;
  background-image: url("../images/domo/encabezado.jpg");
  background-position: bottom;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  margin: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

#header-site-domo::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(16, 16, 16, 0.7);
}

#calendar {
  position: relative;
  padding: 5rem 0 2rem 0;
  overflow: hidden;
}

#calendar .table td,
#calendar .table th {
  border: 0;
  border-bottom: 1px solid #fff;
}

#calendar td[tabindex="0"]::before {
  line-height: 16px;
  background-color: #4a4a4a;
}

#tour {
  position: relative;
  padding: 5rem 0 2rem 0;
  overflow: hidden;
}

#tour #img-party {
  position: relative;
  max-width: 600px;
  margin: 0 auto;
}

#tour #img-party img {
  position: relative;
  z-index: 2;
  border-radius: 10px;
  height: 300px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

#tour #img-party::before {
  content: "";
  display: block;
  background-image: url("/assets/img/background1.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 250px;
  height: 200px;
  border-radius: 10px;
  position: absolute;
  left: -150px;
  bottom: -100px;
  z-index: 1;
}

#tour #img-party::after {
  content: "";
  display: block;
  background-image: url("/assets/img/background2.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 250px;
  height: 200px;
  border-radius: 10px;
  position: absolute;
  right: -50px;
  bottom: -70px;
  z-index: 4;
}

#tour #img-experience {
  position: relative;
  max-width: 600px;
  margin: 0 auto;
}

#tour #img-experience img {
  position: relative;
  z-index: 2;
  border-radius: 10px;
  height: 300px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

#register {
  position: relative;
  padding: 5rem 0 2rem 0;
  overflow: hidden;
}

#experienceModal .modal-content {
  background-color: #101010;
}

#experienceModal .modal-body > p {
  color: #ffffff !important;
}
/*# sourceMappingURL=experienceStyles.css.map */
#tour #img-party-domo {
  position: relative;
  max-width: 600px;
  margin: 0 auto;
}

#tour #img-party-domo img {
  position: relative;
  z-index: 2;
  border-radius: 10px;
  height: 300px;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

#tour #img-party-domo::after {
  content: "";
  display: block;
  background-image: url("../images/domo/img_03.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 250px;
  height: 200px;
  border-radius: 10px;
  position: absolute;
  right: -50px;
  bottom: -70px;
  z-index: 4;
}

@media (max-width: 768px) {
  #tour #img-party-domo::after {
    display: none;
  }
  #tour #img-party::after {
    display: none;
  }
  #tour #img-party::before {
    display: none;
  }
}

.botonTableLink {
  background: #fff;
  color: black;
  font-weight: bold;
  padding: 10px;
  text-decoration: none !important;
  transition: 0.5s;
  width: 100%;
}

.botonTableLink:hover {
  background: transparent;
  color: #fff;
  border: solid 1px #fff;
  font-weight: bold;
  padding: 10px;
  text-decoration: none !important;
  transition: 0.5s;
}

.botonTableDisabled {
  background: #888888;
  color: black !important;
  font-weight: bold;
  padding: 10px;
  text-decoration: none !important;
  transition: 0.5s;
  cursor:no-drop !important;
}

.botonTableDisabled:hover {
  animation: shake 0.1s;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }
  
  30%, 50%, 70% {
    transform: translate3d(-2px, 0, 0);
  }
  40%, 60% {
    transform: translate3d(2px, 0, 0);
}
