/***************************
**                        **
**        ALL TEXT        **
**                        **
**                        **
***************************/
.silkscreen-regular {
  font-family: "Silkscreen", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.silkscreen-bold {
  font-family: "Silkscreen", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.doto {
  font-family: "Doto", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "ROND" 0;
}
.google-sans-flex {
  font-family: "Google Sans Flex", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "slnt" 0,
    "wdth" 100,
    "GRAD" 0,
    "ROND" 0;
}


/***************************
**                        **
**        ALL CSS         **
**                        **
**                        **
***************************/
.no_space {
  margin: 0;
  padding: 0;
}
.white_text {
  color: #faf9eb;
}
.underline {
  text-decoration: underline;
}
.spacing_bottom {
  line-height: 2rem;
}
html, body, main {
  width: 100%;
  height: 100%;

  overflow: hidden;
}
body {
  background-image: url('images/bcg.png');
  background-position: center;
  background-size: cover;
  display: flex;
  flex-direction: column;

  user-select: none;
}
/** HEADERS **/
h1 {
  font-size: 7rem;
  text-align: center;

  font-weight: bolder;

  padding: 2rem;
  margin: 0;

  text-shadow:  0 2px 4px rgba(250, 249, 235, 0.9),
                0 4px 6px rgba(250, 249, 235, 0.7),
                0 6px 12px rgba(250, 249, 235, 0.4);

  letter-spacing: -8px;

  color: #f5d43e;
}
/** SUB TITLES **/
h3 {
  display: flex;
  flex-direction: column;
  font-size: 3.5rem;


  color: white;
  text-align: center;

  text-shadow:  0 1px 2px rgba(245, 212, 62, 0.8),
                0 3px 3px rgba(245, 212, 62, 0.8);
}
/** DATES AND TIMES **/
p {
  color: white;
  text-align: center;

  font-size: 2rem;

  width: 50%;

  margin: 5rem 0 0 0;
  padding: 1rem 0;

  background: #335549;

  box-shadow: 0 1px 5px 5px rgba(245, 212, 62, 0.8);
}

/** WRAPPERS **/
.wrapper_outside {
  display: flex;
  flex-wrap: wrap;
  flex: 1;

  justify-content: space-evenly;
  align-items: center;
  box-sizing: border-box;
}
.wrapper_inside {
  min-width: 480px;
  max-width: 960px;
  box-sizing: border-box;

  flex: 1;

  padding: 1rem;

  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}


/***************************
**                        **
**        TABLETS         **
**                        **
**                        **
***************************/
@media (max-width: 1280px) {

  h1 {
    font-size: clamp(4rem, 3rem, 2.5rem);
  }

  h3 {
    font-size: 2.5rem;
  }

  p {
    font-size: 1.5rem;
  }
  
}


/***************************
**                        **
**         PHONES         **
**                        **
**                        **
***************************/
@media (max-width: 768px) {

  h1 {
    font-size: clamp(3rem, 2.5rem, 2rem);
    padding: 1rem 0;
  }

  h3 {
    font-size: 2rem;
  }

  p {
    font-size: 1.5rem;

    margin: 1rem 0 0 0;
    padding: 1rem 0;
  }
  .wrapper_outside {
    justify-content: flex-start;
    align-items: flex-start;
  }
  .wrapper_inside {
    min-width: 100%;
  }

}