/*Variables*/
:root{
  --loader-bg:#977d63;
  --cancion-bg:rgba(255, 255, 255, 0.6);
  --icono-color:#231f20;
  --icono-bg:#24180c;
  --bg:#f9f9f9;
  --text: #ffffff;
  --countdown-bg: #1e1e1e;
  --countdown-text:#f4ecdf;
  --btn-bg:#584430;
  --btn-text:#ffffff;
  --box-shadow:;
  --timer-fontsize:40px;
  --accordion-bg:rgba(25, 25, 25, 0.4);
  --accordion-text:#ffffff;
  --accordion-btn-bg:#1e1b1c;
  --accordion-btn-text:#ffffff;
  --scrollbar-color:#f8d793;
  --footer-bg:#231f20;
}

@font-face {
  font-family: 'Fraunces';
  src: url('../../fonts/Fraunces-Variable.ttf') format('truetype');
}

body {
  font-family: "Fraunces";
  font-size: 18px;
  font-weight: 400;
  background-image: linear-gradient(rgba(25, 25, 25, 0.4), rgba(25, 25, 25, 0.4)), 
   url('bg/b13b.webp');
   background-size: 100%;
   background-attachment: fixed;
}

main{
   background-image: url('bg/b13a.webp');
   background-size: cover;
   box-shadow: rgba(0, 0, 0, 0.55) 0px 5px 15px;
}

.portada img{
  width: 85%;
  margin: auto;
}

.date{
  border: 10px double var(--text);
}

#frase{
  background-color: rgba(89, 68, 52, 0.6);
}

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

.boton{
  border-radius: 15px;
  box-shadow: var(--box-shadow);
  height: 40px;
}

div.scroll-container img{
   border-radius: 15px;
   border: 2px solid var(--text);
}

.asistencia{
 border-image-repeat: stretch;
  border-image-slice: 40 40 40 40 fill;
  border-image-source: url('marcos/b13a.webp');
  border-image-width: 10px;
  color: var(--footer-bg);
  height: 300px;
  max-width: 400px;
  margin: auto;
  padding: 70px 35px 50px 35px;
}