* {
    margin: 0;
    padding:0;
    box-sizing: border-box;
}

body {
    background-color: #512323;
    overflow: hidden;
    scroll-behavior: smooth;
}

header {
  width: 100%;
  min-height: 10vw;
  background-color: #351717;
  padding: 20px;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: flex-start; /* Aligns content to the left */
  margin-top: 1.5vw;
}

footer {
  width: 100%;
  min-height: 10vw;
  background-color: #351717;
  padding: 10px;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center; /* centers content horizontally */
  margin-top: 1.5vw;
}



html, body { overflow-y: auto; } 
/* FIXED SCROLLING */

p{
   font-family: "Sansita", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  font-size: 1.44rem;
  margin-top: 2vw;
  margin-bottom: 4vw;
  color: #B7B7B7;
  padding-bottom: 2vw;
}

h1{
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
   color: white;
margin: 2vw;
font-size: 10vw;
}

#tags {
  list-style: none; /* Removes default bullet points */
  margin: 0;
  padding: 0;
  text-align: right; 
  transform: translateX(30vw);
}

#tags li {
  margin-bottom: 5px; /* Adds spacing between list items */
}

#tags a {
  text-decoration: none; /* Removes underline from links */
  color: rgb(122, 122, 122); 
  font-family: "Bebas Neue", sans-serif;
  font-size: 5vw;
}

#footertext{

  color: #B7B7B7;
  font-size: 10vw;
  text-align: center;


}

#footertext a {
  color: #B7B7B7;   /* pick your color */
  text-decoration: none; /* optional: removes underline */
}

#footertext a:hover {
  color: #fcfcfc;   /* optional hover color */
}

#Weeklytitle {
  font-family: "Sansita", sans-serif;
  font-weight: 400;
  font-style: normal;
  text-align: center;
  font-size: 10vw;
  margin-top: 7vw;
  color: #B7B7B7;
}

#boxes {
    box-shadow: 3px 12px 20px black;
    background-color: #351717;
    transition: transform 0.5s;
    justify-self: center;
    gap: 1rem;
    margin: 10vw;
   margin-top: 10vw;
/* display: flex; */

}



iframe {
  margin: auto; /* adds space around each iframe */
  aspect-ratio: 16/9;
  width: 100%;
  height: auto;
  padding: 15px;
}



@media (min-width: 900px) {

  p{
    width: 20vw;
      font-size: 1.728rem;
    justify-content: center;
    justify-self: center;
  }
  
  h1 {
    font-size: 6vw;
  }

  #Weeklytitle {
    font-size: 7vw;
  }

  #footertext {
    font-size: 5vw;
  }

  #tags a {
    font-size: 1.5rem;
  }

  iframe {
    width: 100%;
  }

  #boxes {
    padding: 2rem;
    margin: 2vw;
    margin-bottom: 10vw;
    gap: 4rem;
    display: flex;
  }

#tags {
  list-style: none; /* Removes default bullet points */
  margin: 0;
  padding: 0;
  text-align: right; 
  transform: translateX(60vw);
  
}
#tags a {
  text-decoration: none; /* Removes underline from links */
  color: rgb(122, 122, 122); 
  font-family: "Bebas Neue", sans-serif;
  font-size: 2vw;
  text-align: right;
}
}
