:root {
  --primary-color: #6B1E26;
  --panna: #eae2e2;
  --fake-black: #313131;
  --grey:#cccccc;
}

html {
  scroll-behavior: smooth; /* fornisco un effetto morbido allo corrimento della pagina */
}

body {
  color: white;
  font-family: "Lexend", sans-serif;
  margin: 0 auto;
  scroll-behavior: smooth;
  color: var(--fake-black);
}

.titolo {
  font-family: "Antic Didone", serif;
  color: var(--primary-color);
  font-size: 80px;
  margin: auto;
  text-transform: uppercase;
  font-weight: 400;
  margin: 80px auto 80px auto;
}

.button1 {
  color: var(--primary-color);
  text-decoration: none;
  text-transform: uppercase;
  background-color: rgba(255, 255, 255, 0.3);
  padding: 14px 20px;
  border-radius: 9999px;
  font-weight: 200;
  font-size: 18px;
  box-shadow: 0px 0px 5px var(--primary-color);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
}

.button1:hover {
  background-color: var(--primary-color);
  color: white;
  font-weight: 400;
}

.button2 {
  color: white;
  text-decoration: none;
  text-transform: uppercase;
  background-color: var(--primary-color);
  padding: 14px 20px;
  border-radius: 9999px;
  font-weight: 200;
  font-size: 18px;
  box-shadow: 0px 0px 5px var(--primary-color);
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
  margin: 80px auto 120px auto;
}
.button2:hover {
  background-color: white;
  color: var(--primary-color);
  font-weight: 400;
}

.small-title {
  color: var(--primary-color);
  text-transform: uppercase;
  font-weight: 600;
  font-size: 24px;
}
.small-title p {
  margin: 10px 0;
}

.very-small-title {
  color: var(--fake-black);
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  margin-top: 0;
  padding: 0;
}
.very-small-title p {
  margin: 0;
}

#hero {
  color: white;
  background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.6)), url("../img/bg_visual.jpg");
  height: 100vh;
  width: 100oh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
#hero img {
  scale: 100%;
  margin-bottom: 20px;
  margin-top: 30px;
}
#hero .logo-UEDFN {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 40%;
}
#hero .informazioni {
  margin: auto auto auto auto;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0px;
  right: 0px;
  bottom: 60px;
}
#hero .informazioni .riga {
  padding-top: 30px;
  display: flex;
  flex-direction: row;
  text-align: center;
}
#hero .informazioni .riga .lato-sx {
  width: 50%;
}
#hero .informazioni .riga .lato-dx {
  width: 50%;
}
#hero .informazioni h3 {
  font-size: 30px;
  font-weight: 300;
  margin-bottom: -25px;
}
#hero .informazioni .giorno {
  text-transform: uppercase;
  margin: auto;
  font-size: 90px;
  margin: auto 10px auto 10px;
  padding: 0;
  text-align: right;
}
#hero .informazioni .ora {
  font-size: 90px;
  font-weight: 300;
  margin: auto;
  margin-right: 10px;
  margin-left: 20px;
}
#hero .informazioni .luogo {
  text-align: justify;
  margin: auto;
  text-transform: uppercase;
  font-weight: 300;
  margin-left: 10px;
}

#sponsor-col {
  height: 100px;
  align-items: center;
}
#sponsor-col img {
  width: 12.5%;
  margin: 0;
  height: 100px;
  scale: 90%;
}
#sponsor-col .sponsors {
  margin: 0;
}
#sponsor-col .slide-sponsor {
  margin: 0;
}

#video {
  /* height: 900px; */
  margin-bottom: 120px;
}
#video .video-yt .yt-iframe {
  aspect-ratio: 16/9;
  width: 100%;
}

#programma {
  padding: 60px;
  background-color: var(--panna);
  /* background-image:url("../img/bg_visual_blur.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; */
}
#programma .cards-programma {
  gap: 20px;
  padding-bottom: 40px;
}
#programma .card-programma {
  background-color: white;
  border-radius: 10px;
  height: -moz-min-content;
  height: min-content;
  /* border: 1px solid var(--primary-color); */
}
#programma .card-programma .foto-programma {
  height: -moz-min-content;
  height: min-content;
}
#programma .card-programma .foto-programma img {
  width: 100%;
  border-radius: 10px 0 0px 10px;
  margin: 0;
  padding: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
#programma .card-programma .foto-programma-dx {
  height: -moz-min-content;
  height: min-content;
}
#programma .card-programma .foto-programma-dx img {
  width: 100%;
  border-radius: 0px 10px 10px 0px;
  margin: 0;
  padding: 0;
  -o-object-fit: cover;
     object-fit: cover;
}
#programma .card-programma .testo {
  padding: 20px 40px;
}

#location {
  height: 100%;
  background-color: var(--panna);
  padding: 60px;
}
#location img {
  width: 100%;
  aspect-ratio: 3/4;
  -o-object-fit: cover;
     object-fit: cover;
}
#location p {
  margin: 8px;
}
#location .map {
  width: 100%;
  height: 100%;
}
#location .map iframe {
  width: 100%;
  height: 88%;
}

#sfilate {
  background-color: var(--panna);
  padding: 20px;
}
#sfilate .card-sfilata {
  background-color: white;
  border-radius: 12px;
  margin: 20px 0;
  width: 100%;
}
#sfilate .card-sfilata .foto-modella-sfilata {
  width: 25%;
  aspect-ratio: 3/4;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 12px 0 0 12px;
}
#sfilate .card-sfilata .round-dx {
  border-radius: 0 12px 12px 0;
}
#sfilate .card-sfilata .testo {
  margin: 10px 30px 0 30px;
}
#sfilate .reverse {
  flex-direction: row-reverse;
  text-align: left;
}

#footer {
  background-color: var(--primary-color);
  color: white;
  margin: 0 auto;
}
#footer .container {
  align-items: center;
}
#footer .container p {
  margin: 0;
  padding: 8px;
  text-align: center;
  font-size: small;
  font-weight: 300;
  text-transform: uppercase;
}

/* TABLET */
@media screen and (min-width: 577px) and (max-width: 992px) {
  .titolo {
    font-size: 70px;
    margin: 60px auto 40px auto;
  }
  #hero .informazioni .button1 {
    margin: auto;
    padding: auto;
  }
  #hero .informazioni .riga {
    flex-direction: column;
  }
  #hero .informazioni .riga .lato-sx {
    width: 100%;
  }
  #hero .informazioni .riga .lato-dx {
    width: 100%;
  }
  #hero .informazioni h3 {
    font-size: 22px;
    font-weight: 300;
    margin-bottom: -25px;
  }
  #hero .informazioni .giorno {
    text-transform: uppercase;
    margin: auto;
    font-size: 70px;
    margin: auto 10px auto 10px;
    padding: 0;
    text-align: center;
  }
  #hero .informazioni .ora {
    font-size: 70px;
    font-weight: 300;
    margin: auto 4px auto auto;
    text-align: right;
  }
  #hero .informazioni .luogo {
    text-align: justify;
    margin: auto;
    text-transform: uppercase;
    font-weight: 300;
    margin-left: 10px;
  }
  #sfilate .card-sfilata {
    flex-direction: column;
  }
  #sfilate .card-sfilata .foto-modella-sfilata {
    width: 100%;
    aspect-ratio: 4/3;
    border-radius: 12px 12px 0 0;
  }
  #sfilate .card-sfilata .testo p .black {
    font-size: 14px;
  }
  #location img {
    width: 100%;
    aspect-ratio: 4/3;
    -o-object-fit: cover;
       object-fit: cover;
  }
  #location .map {
    width: 100%;
    height: 100%;
  }
  #location .map iframe {
    width: 100%;
    height: 88%;
    aspect-ratio: 4/3;
  }
}
/* MOBILE */
@media screen and (min-width: 320px) and (max-width: 576px) {
  .titolo {
    font-size: 50px;
    margin: 60px auto 40px auto;
  }
  #hero .informazioni .button1 {
    margin: auto;
    padding: auto;
  }
  #hero .informazioni .riga {
    flex-direction: column;
  }
  #hero .informazioni .riga .lato-sx {
    width: 100%;
  }
  #hero .informazioni .riga .lato-dx {
    width: 100%;
  }
  #hero .informazioni h3 {
    font-size: 22px;
    font-weight: 300;
    margin-bottom: -25px;
  }
  #hero .informazioni .giorno {
    text-transform: uppercase;
    margin: auto;
    font-size: 40px;
    margin: auto 10px auto 10px;
    padding: 0;
    text-align: center;
  }
  #hero .informazioni .ora {
    font-size: 40px;
    font-weight: 300;
    margin: auto 4px auto auto;
    text-align: right;
  }
  #hero .informazioni .luogo {
    text-align: justify;
    margin: auto;
    text-transform: uppercase;
    font-weight: 300;
    margin-left: 10px;
  }
  #sponsor-col {
    height: auto;
    align-items: center;
  }
  #sponsor-col img {
    width: 25%;
    margin: 0;
    scale: 90%;
  }
  #sponsor-col .sponsors {
    margin: 0;
    flex-wrap: wrap;
  }
  #sponsor-col .slide-sponsor {
    margin: 0;
  }
  #sfilate .card-sfilata {
    flex-direction: column;
  }
  #sfilate .card-sfilata .foto-modella-sfilata {
    width: 100%;
    aspect-ratio: 4/3;
    border-radius: 12px 12px 0 0;
  }
  #sfilate .card-sfilata .testo p .black {
    font-size: 14px;
  }
  #video {
    margin-bottom: 100px;
  }
  #location {
    height: 100%;
    background-color: var(--panna);
    padding: auto auto;
    padding-bottom: 120px;
  }
  #location img {
    width: 100%;
    aspect-ratio: 4/3;
    -o-object-fit: cover;
       object-fit: cover;
  }
  #location p {
    margin: 8px;
  }
  #location .map {
    width: 100%;
    height: 100%;
  }
  #location .map iframe {
    width: 100%;
    height: 88%;
    aspect-ratio: 4/2;
  }
}/*# sourceMappingURL=style.css.map */