/* BASICS */
html {
  scroll-behavior: smooth;
}

body {
  font-family: "Barlow", sans-serif;
}

h1 {
  font-weight: 800;
  font-size: 5rem;
  color: #ffff;
  text-shadow: 1px 1px 5px #000;
}

.h1-legal {
  font-weight: 0;
  font-size: 0;
  color: #ffff;
  text-shadow: 0;
  margin: 0;
  padding: 0;
  width: 0;
  height: 0;
}

h2 {
  font-weight: bold;
}

.bg-orange {
  background-color: #ea5b13;
}

.orange {
  border-color: #ea5b13 !important;
}

cite {
  font-size: 2rem;
  color: #ffff;
  text-shadow: 1px 1px 5px #000;
}

p {
  font-size: 1.2rem;
}

li {
  font-size: 1.2rem;
}

li::marker {
  color: #ea5b13;
}

/* NAVBAR */
.navbar {
  border-bottom: 1px solid #ea5b13;
  font-size: 1.2rem;
}

.navbar-brand img {
  height: 70px;
  background-color: #ea5b13;
  padding: 1rem;
}

.active {
  color: #ea5b13 !important;
  font-weight: bold !important;
}

.nav-link {
  color: #546d70;
}

.nav-link:hover {
  color: #ea5b13 !important;
}

.video {
  height: 93vh;
  margin-top: 3rem;
}

/* LANGUAGE */
.de {
  color: #546d70;
  font-size: 1rem;
}

.es {
  color: #cacccc;
  font-size: 1rem;
}

.check {
  position: relative;
  width: 50px;
}

.check:before {
  content: "";
  position: absolute;
  width: 50px;
  height: 25px;
  background: #cacccc;
  border-radius: 25px;
  margin-top: -4px;
}

.check:after {
  content: "";
  position: absolute;
  width: 25px;
  height: 25px;
  background: white;
  border-radius: 25px;
  transition: 0.25s;
  border: 2px solid #cacccc;
  box-sizing: border-box;
  margin-top: -4px;
}

.check:checked:after {
  left: 25px;
  border: 2px solid #ea5b13;
}

.check:checked:before {
  background: #ea5b13;
}

/* ABOUT US */
.bg-icon {
  width: 3rem;
}

.tl-bg1 {
  background-image: url(img/tl-1.jpg);
  height: 40vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  filter: grayscale(100%);
}

.tl-bg1:hover {
  background-image: url(img/tl-1v2.png);
  filter: grayscale(0);
  transition: 0.5s ease;
}

.tl-bg2 {
  background-image: url(img/tl-2.jpg);
  height: 40vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  filter: grayscale(100%);
}

.tl-bg2:hover {
  background-image: url(img/tl-2v2.png);
  filter: grayscale(0);
  transition: 0.5s ease;
}

.tl-bg3 {
  background-image: url(img/tl-3.jpg);
  height: 40vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  filter: grayscale(100%);
}

.tl-bg3:hover {
  background-image: url(img/tl-3v2.png);
  filter: grayscale(0);
  transition: 0.5s ease;
}

.tl-bg4 {
  background-image: url(img/tl-4.jpg);
  height: 40vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  filter: grayscale(100%);
}

.tl-bg4:hover {
  background-image: url(img/tl-4v2.png);
  filter: grayscale(0);
  transition: 0.5s ease;
}

.tl-year {
  color: white;
}

.tl-year h2 {
  font-weight: 700;
  font-size: 3rem;
  border-top: 3px solid white;
  border-bottom: 3px solid white;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  margin-top: 25%;
}

.tl-text {
  color: white;
  font-size: 2rem;
}

.tl-text p {
  text-align: center;
}

/* PRODUCTS */
.icon-2 {
  width: 12rem;
}

/* CONTACT */
#contact {
  background-image: linear-gradient(#cacccc, white);
}

.btn-success {
  background-color: #546d70 !important;
  border: none;
}

.btn-success:hover {
  background-color: #ea5b13 !important;
  border: none;
}

/* BG ANIMATION */
.bg-img-chicken {
  background-image: url("img/pollito_caminando.gif");
  background-color: #fff;
  height: 100px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* FOOTER */
footer {
  border-top: 1px solid #ea5b13;
  color: #546d70;
}

footer img {
  width: 10rem;
}

footer a {
  text-decoration: none;
  color: #546d70;
}

footer a:hover {
  color: #ea5b13;
}

/* MEDIAQUERY */
/* Small devices */
@media (min-width: 576px) {
  .bg-img-chicken {
    background-image: url("img/pollito_caminando_sm.gif");
  }
}

/* Medium devices */
@media (max-width: 768px) {
  /* BASICS */
  h1 {
    font-size: 3rem;
  }

  .bg-img-chicken {
    background-image: url("img/pollito_caminando_md.gif");
  }
}

/*  */
/* Large devices*/
@media (min-width: 992px) {
  .bg-img-chicken {
    background-image: url("img/pollito_caminando.gif");
  }
}
