.w-backgroundvideo-backgroundvideoplaypausebutton:focus-visible {
  outline-offset: 2px;
  border-radius: 50%;
  outline: 2px solid #3b79c3;
}

body {
  color: #333;
  background-color: #758e71;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 20px;
}

h1 {
  width: 50%;
  text-shadow: 5px 0 5px rgba(0, 0, 0, .5);
  margin-top: 20px;
  margin-bottom: 10px;
  margin-left: 20px;
  font-family: Bystander Serif, sans-serif;
  font-size: 5vw;
  font-weight: 700;
  line-height: 4.5vw;
}

.videobg {
  border: 1px #000;
}

.background-video {
  min-height: 100vh;
}

.play-pause-button {
  display: none;
}

.starthere {
  color: #fff;
  background-color: #14251c;
  border-top-right-radius: 999px;
  border-bottom-right-radius: 999px;
  justify-content: flex-end;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  font-family: Bystander Serif, sans-serif;
  font-size: 30px;
  text-decoration: none;
  transition: all .5s, opacity .2s;
  display: flex;
  position: fixed;
  top: auto;
  bottom: 30px;
  left: 0%;
  right: auto;
  box-shadow: 4px -2px 5px 5px rgba(0, 0, 0, .2);
}

.starthere:hover {
  padding-left: 60px;
}

.starthereimg {
  height: 125px;
  padding: 10px 20px;
}

.text-block {
  display: flex;
}

.body {
  background-color: #273f47;
}

.text-block-2 {
  font-size: 28px;
}

.contactmodal {
  height: 100vh;
  color: #fff;
  background-color: #af152c;
  background-image: url('../images/myrappahannockriver.svg');
  background-position: 35vw -10vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  display: none;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.html-embed {
  width: 640px;
  margin-bottom: 100px;
}

.closecontact {
  color: #273129;
  background-color: #fff;
  border-top-left-radius: 999px;
  border-bottom-left-radius: 999px;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 30px 10px 0;
  font-family: Bystander Serif, sans-serif;
  font-size: 30px;
  text-decoration: none;
  transition: all .5s, opacity .2s;
  display: flex;
  position: fixed;
  top: auto;
  bottom: 30px;
  left: auto;
  right: 0%;
  box-shadow: 4px -2px 5px 5px rgba(0, 0, 0, .2);
}

.closecontact:hover {
  padding-right: 60px;
}

.starttext {
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  padding-top: 10px;
  padding-bottom: 10px;
}

.closetext {
  border-top: 1px solid #14251c;
  border-bottom: 1px solid #14251c;
  padding-top: 10px;
  padding-bottom: 10px;
}

@media screen and (max-width: 991px) {
  h1 {
    width: 66%;
    font-size: 66px;
    line-height: 70px;
  }
}

@media screen and (max-width: 767px) {
  h1 {
    width: 100%;
    font-size: 50px;
    line-height: 50px;
  }

  .starthere {
    font-size: 24px;
  }

  .starthereimg {
    height: 75px;
  }

  .html-embed {
    width: 100%;
  }

  .closecontact {
    font-size: 35px;
    line-height: 60px;
  }

  .closetext {
    font-size: 24px;
    line-height: 20px;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    width: 90%;
    font-size: 34px;
    line-height: 40px;
  }

  .starthere {
    text-align: left;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    justify-content: center;
    padding-left: 30px;
    padding-right: 0;
    display: flex;
    top: auto;
    bottom: 30px;
    left: 0%;
    right: 0%;
  }

  .starthereimg {
    margin-right: 0;
  }

  .contactmodal {
    display: none;
  }

  .html-embed {
    margin-bottom: 60px;
  }

  .closecontact {
    text-align: left;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    flex-direction: row-reverse;
    justify-content: center;
    padding-left: 30px;
    padding-right: 0;
    top: auto;
    bottom: 30px;
    left: 0%;
    right: 0%;
  }
}


@font-face {
  font-family: 'Bystander Serif';
  src: url('../fonts/Bystander-Serif-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}