body {
  font-family: "Open Sans", sans-serif;
  overflow-x: hidden;
}

/* HEADER & NAVIGATION */
header {
  background-color: #f5f1ee;
}

nav a {
  padding: 20px;
  color: #292929;

  text-decoration: none;
  text-wrap: nowrap;
}

nav a:hover,
.active {
  color: #05669c;
  font-weight: 700;
}

/* BIG SWIPER */

/* .big-swiper {
  max-width: 1440px;
} */

.swiper-pagination {
  --swiper-pagination-color: #8b8b8b !important; /* Color pagination */
  --swiper-pagination-bullet-inactive-color: #d9d9d9 !important;
  --swiper-pagination-bullet-inactive-opacity: 1 !important;
}

.big-swiper img {
  width: 100%;
  max-height: 100vh;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}

.big-swiper .swiper-button-prev,
.big-swiper .swiper-button-next {
  background-color: rgba(42, 42, 43, 0.43);
  border-radius: 50%;
  padding: 20px;
  width: 30px !important;
  height: 30px !important;
}

.big-swiper .swiper-button-prev::after,
.big-swiper .swiper-button-next::after {
  font-size: 18px !important;
  color: #d9d9d9;
}

/* SMALL SWIPER */

.small-swiper {
  color: #fbf7f4;
}

.small-swiper img {
  width: 100%;
  height: 350px;
  object-fit: cover;
}

.small-swiper-container {
  background-color: #fbf7f4;
}

.small-swiper-container .swiper-button-prev,
.small-swiper-container .swiper-button-next {
  position: absolute;
}

.small-swiper-container .swiper-button-prev {
  left: -50px;
}

.small-swiper-container .swiper-button-next {
  right: -50px;
}

.small-swiper-container .swiper-button-prev::after,
.small-swiper-container .swiper-button-next::after {
  font-size: 18px !important;
  color: #472035;
  font-weight: bold;
}

.bottom-info {
  background-color: #05669c;
  bottom: 0;
  width: 100%;
}

/* NUESTROS EVENTOS */

.our-events {
  background-color: #05669c;
}

.our-events h2 {
  color: #b6dee4;
}

.our-events-grid div {
  background-color: #fbf7f4;
}

.small-circle {
  width: 30px; /* Adjust the width and height as needed */
  height: 30px;
  background-color: #b6dee4; /* Change the background color if needed */
  border-radius: 50%; /* Makes it a circle */
}

.small-left-half-circle {
  width: 15px;
  height: 30px;
  background-color: #b6dee4;
  border-radius: 30px 0 0 30px;
}

.small-right-half-circle {
  width: 15px;
  height: 30px;
  background-color: #b6dee4;
  border-radius: 0 30px 30px 0;
}

.our-events-grid .logo-events {
  background-color: #05669c;
}

.our-events-grid h3 {
  color: #fbf7f4;
}

.our-events-grid .image-filter {
  filter: brightness(0.7) opacity(0.9);
}

/* INFO DIV */

.info-text h1,
.info-text h2,
.info-text h3 {
  color: #05669c;
}

.info-text p,
.info-text a,
.info-text button {
  color: #292929;
}

.info-text a {
  color: #000;
  text-decoration: none;
}

.info-text a:hover {
  text-decoration: underline;
}

.info-text button {
  background-color: #05669c;
  color: #fff;
}

/* FOOTER */
.stores-footer {
  font-family: "Poppins", sans-serif;
  background-color: #fbf7f4;
}

.stores-footer a,
.social-media a {
  color: #000;
  text-decoration: none;
}

footer a:hover {
  text-decoration: underline;
}

.copyright {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #333333;
  height: 70px;

  color: #fbf7f4;
}

/* HERO */

.hero {
  height: 800px;
}

.hero h1,
.hero h2 {
  color: #fbf7f4;
  z-index: 10;
}

/* SALÓN HÍPICO ARGENTINO */

#salon-hipico-argentino .hero {
    /* background-image: url("/img/carpa-hipico-entrada.jpg"); */
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), 
                url("/img/carpa-hipico-entrada.jpg");
    background-position: center;
    color: white; /* Make text visible over semi-transparent background */
    }

#salon-hipico-argentino .bottom-info p {
  color: #fbf7f4;
}

/* CONVITE CATERING */

#convite-catering .hero {
    /* background-image: url("/img/mini-hamburguesa.jpg"); */
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), 
                url("/img/mini-hamburguesa.jpg");
    background-position: center;
    color: white; /* Make text visible over semi-transparent background */
    }

/* CLIENTES */

#clientes .clientes-top,
#error-404 .error-404-top,
#contact-confirmation .contact-confirmation-top,
#contact-error .contact-error-top {
  background-color: #05669c;
  color: #fbf7f4;
}

.medium-circle {
  width: 100px; /* Adjust the width and height as needed */
  height: 100px;
  background-color: #b6dee4; /* Change the background color if needed */
  border-radius: 50%; /* Makes it a circle */
}

.medium-bottom-half-circle {
  width: 100px;
  height: 50px;
  background-color: #b6dee4;
  border-radius: 0 0 100px 100px;
}

.clientes-names {
  color: #05669c;
}

.clientes-names li {
  padding-bottom: 1.5rem;
}

/* DÓNDE ESTAMOS */


#donde-estamos .hero {
     /* background-image: url("/img/casita-mesa-restaurant.jpg"); */
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), 
                url("/img/casita-mesa-restaurant.jpg");
    background-position: center;
    color: white; /* Make text visible over semi-transparent background */
    }

#donde-estamos h2 {
  font-family: "Popins", sans-serif;
  font-weight: 400;
}

#donde-estamos .info-text {
  padding: 1.25rem;
}

#donde-estamos .info-text h3 {
  font-size: 1.5rem;
  padding: 7px 0;
}

#donde-estamos .info-text p {
  font-weight: 600;
}

/* CIRCLES */

.circle {
  width: 200px; /* Adjust the width and height as needed */
  height: 200px;
  background-color: #b6dee4; /* Change the background color if needed */
  border-radius: 50%; /* Makes it a circle */
}

.left-half-circle,
.right-half-circle,
.bottom-half-circle,
.small-bottom-half-circle {
  background-color: #b6dee4;
}

.left-half-circle {
  width: 100px;
  height: 200px;
  border-radius: 200px 0 0 200px;
}

.right-half-circle {
  width: 100px;
  height: 200px;
  border-radius: 0 200px 200px 0;
}

.bottom-half-circle {
  width: 200px;
  height: 100px;
  border-radius: 0 0 200px 200px;
}

.circles-header {
  right: -80px;
  top: 50px;
}

.circles-footer {
  right: -40px;
  bottom: 150px;
}

.circles-hero {
  left: -60px;
  bottom: -70px;
}

.circles-index {
  left: -120px;
  bottom: -120px;
}

.circles-clients {
  left: -30px;
  bottom: 5px;
}

/* CONTACTO */

input,
select,
textarea {
  border: 1.5px solid #472035;
  border-radius: 0;
  -webkit-appearance: none; /* Disable default arrow in Chrome/Safari */
  -moz-appearance: none; /* Disable default arrow in Firefox */
  appearance: none; /* Disable default arrow in other browsers */
  background-color: transparent;
}

.submit-button {
  background-color: #333333;
  color: #fbf7f4;
}

::placeholder {
  color: #8b8b8b !important;
  opacity: 1;
}

input::placeholder,
textarea::placeholder {
  color: #8b8b8b !important;
  opacity: 1;
}

input[type="date"],
input[type="time"],
input[type="select"] {
  -webkit-text-fill-color: #8b8b8b !important;
}

input::-webkit-date-and-time-value {
  text-align: left;
  /* width: 20% !important; */
  width: auto;
  display: inline;
}

input[type="time"]::-webkit-inner-spin-button,
input[type="time"]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

#start-time::after {
  content: "(Comienzo del evento)";
}

#end-time::after {
  content: "(Fin del evento)";
}

/* MEDIA QUERIES */
@media (max-width: 768px) {
  nav {
    flex-wrap: wrap;
  }

  nav a {
    padding: 20px 10px;
  }
}