/*Variables*/

:root{
  --loader-bg:#e6d9b6;
  --cancion-bg:rgba(230, 217, 182, 0.85);
  --icono-color:#550609;
  --icono-bg:#e6d9b6;
  --bg:#550609;
  --text: #f2e9d7;
  --countdown-bg: #f2e9d7;
  --countdown-text:#f2e9d7;
  --btn-bg:#e6d9b6;
  --btn-text:#550609;
  --box-shadow:rgba(0, 0, 0, 0.35) 0px 5px 15px;;
  --timer-fontsize:40px;
  --accordion-bg:#f2f0e3;
  --accordion-text:#550609;
  --accordion-btn-bg:#e6d9b6;
  --accordion-btn-text:#550609;
  --scrollbar-color:#700d14;
  --footer-bg:#700d14;
}

@font-face {
  font-family: 'Bohemian Soul Regular';
  src: url('../../fonts/BohemianSoul.otf') format('opentype');
}

body{
  font-family: 'Bohemian Soul Regular';
  font-size: 20px;
}

main{
  background-image: url('bg/c05a.webp');
  background-size: cover;
  box-shadow: var(--box-shadow);
}

.boton{
  border-radius: 15px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.portada h1{
  font-size: 60px;
}

#countdown, #date{
  background-image: url('bg/c05b.webp');
  background-size: cover;
}

.date{
  color: var(--bg);
  background-color: var(--countdown-bg);
}

/*Deco*/
.d1, .d2, .d3, .d4{
  position: absolute;
  width: 90px;
}

.d1{
  top: -50px;
  left: 0;
}

.d2{
  bottom: -40px;
  left: 0;
}

.d3{
  top: -60px;
  right: 0;
}

.d4{
  bottom: -40px;
  right: 0;
}

#galeria{
  background-color: var(--footer-bg);
}

#asistencia{
  height: 60dvh;
  background-image: linear-gradient(rgba(85, 6, 9, 0.55), rgba(85, 6, 9, 0.55)),
                  url("bg/c05c.webp");
  background-size: cover;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}