@import url('https://fonts.googleapis.com/css2?family=Forum&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow+Semi+Condensed&family=Forum&display=swap');

* {
  box-sizing:border-box;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

::-webkit-scrollbar {
    display: none;
}

a, a:active, a:visited {
  text-decoration:none;
  color:#FFF;
}

html, body {
  padding: 0;
  margin: 0;
  background-color:#000;
  font-size:2.5vmin;
  font-family: 'Barlow Semi Condensed', sans-serif;
}

#container {
  width:100vw;
  height:100vh;
  background: url('IMAGES/BG.jpg');
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  color:#fff;
  overflow:hidden;
}

#background {
  position:absolute;
  width:100vw;
  height:100vh;
  top:0;
  background-color:black;
  opacity:0.3;
  transition:opacity 0.5s ease;
}

#down-arrow-container {
  position:absolute;
  width:100vw;
  height:100vh;
  display:flex;
  flex-flow:column nowrap;
  justify-content:flex-end;
  align-items:center;
  text-align:center;
  bottom:0;
  margin-bottom:2vmin;
  opacity:50%;
}

#slides-container {
  position:absolute;
  top:0;
  width:100%;
  display:flex;
  flex-flow:column nowrap;
  justify-content:flex-start;
  align-items:center;
  align-items:center;
  overflow-y:scroll;
}

  .slide {
    width:100%;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-flow:column nowrap;
    overflow:hidden;
  }

  #dates-slide {
    height:100%;
  }

#title {
  text-align:center;
  width:70vmin;
  font-family:'Forum', sans-serif;
  font-size:5vmin;
  text-transform:uppercase;
  transition:margin 1s ease;
  z-index:1;
}

#laurel {
  width:20vmin;
  margin-top:2vmin;
}

#about {
  width:100%;
  display:flex;
  flex-flow:row nowrap;
  justify-content:space-between;
  align-items:stretch;
}

#names-container, #description-container {
  width:50%;
  display:flex;
  flex-flow:column nowrap;
  align-items:center;
}

  #names {
    width:75%;
    display:flex;
    flex-flow:column nowrap;
    font-family:'Forum', sans-serif;
  }

    #shapiro, #pollard {
      margin-top:5vmin;
      display:flex;
      flex-flow:row nowrap;
    }

    .headshot {
      width:13vmin;
    }

    .name {
      margin-left:5vmin;
      align-self:center;
    }

  #about-title,#dates-title {
    width:75%;
    margin-bottom:2vmin;
    font-size:5vmin;
    font-style:italic;
    text-align:left;
    font-family:'Forum', sans-serif;
  }

  #description {
    width:75%;
    text-align:justify;
    line-height:1.5em;
  }

#dates-title {
  text-align:center;
}

#dates-container {
  width:30%;
  display:flex;
  flex-flow:column nowrap;
  justify-content:flex-start;
  align-items:center;
}

  .date {
    width:100%;
    display:grid;
    grid-template-columns:50% 50%;
    margin-top:-2vmin;
  }

  .date p {
    align-self:center;
  }

  .date p:not(.right-align) {
    font-size:3vmin;
    font-family:'Forum', sans-serif;
  }

  .right-align {
    justify-self:end;
  }


@media screen and (max-width : 1200px) {
  #dates-container {
    width:50%;
  }
}