.space {
  width: 100vw;
  height: 100px;
}

@font-face {
  font-family: 'Gotham Bold';
  src: url('../media/gotham/Gotham-Bold.otf');
}

@font-face {
  font-family: 'Gotham Light';
  src: url('../media/gotham/Gotham-Light.otf');
}

@font-face {
  font-family: 'Gotham Thin';
  src: url('../media/gotham/Gotham-Thin.otf');
}

@font-face {
  font-family: 'Gotham Book Italic';
  src: url('../media/gotham/Gotham-BookItalic.otf');
}

@font-face {
  font-family: 'Chronicle';
  src: url('../media/gotham/Chronicle.otf');
}

.p1cont {
  margin: 150px 0px;
  width: 100vw;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}

.p1_1 {
  width: 28vw;
  height: 28vw;
  opacity: 1;
  margin-right: 20px;
}

.p1_2 {
  width: 60vw;
  font-family: 'Gotham Bold';
  font-size: 2.4vw;
  line-height: 3vw;
  display: inline-block;
  overflow: hidden;
  color: #444;
  z-index: 1;
}

.text-wrapper {
  position: relative;
  display: inline-block;
  padding-top: 0.2em;
  padding-right: 0.05em;
  padding-bottom: 0.1em;
  overflow: hidden;
}

.p1_2line {
  display: inline-block;
  line-height: 1em;
}

.sponsorsconttext {
  margin-bottom: 0px;
}

.sponsorscont .sc {
  width: 100%;
}

.sponsorscont .craig {
  width: 80%;
  margin-bottom: 0px;
}

.sponsorscont .knight {
  width: 70%;
}

.sponsorscont .tasc {
  width: 90%;
  margin-top: 10px;
}

.sponsorsconttext {
  font-size: 1.5vw;
  letter-spacing: 1px;
  color: #444;
}

.sponsorscont {
  width: 100vw;
  margin: 100px 0px;
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  flex-direction: row;
}

.sponsorscont div {
  width: 30vw;
  font-family: 'Gotham Bold';
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.sponsorscont div img {
  padding: 40px;
}

.talkcont {
  /* width: 100vw; */
  height: 400px;
  margin: 100px 0px 100px 0px;
  display: flex;
  justify-content: space-around;
}

.talk {
  width: 100vw;
  height: 100%;
  font-family: 'Gotham Bold';
  font-size: 60pt;
  text-transform: uppercase;

  color: #444;
}

.talkitem {
  height: 25%;
  width: 200vw;
  left: 0vw;
  position: relative;
  z-index: -1;
}

.talkhide {
  font-family: 'Gotham Bold';
  color: #444;
}

.mapcont {
  margin-top: 200px;
  position: relative;
  width: 100vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: -1;
}

#map {
  position: relative;
  width: 70vw;
  height: 30vw;
}

.mapabout a {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.mapabout .googlemaps {
  width: 300px;
}

.mapabout .arrow {
  width: 60px;
}

.mapboxgl-control-container {
  display: none;
}

.span {
  width: 100vw;
  display: flex;
  justify-content: center;
}

.span span {
  display: block;
  width: 80vw;
  border-top: 1px solid #999;
}

.p2cont {
  margin: 20px 0px;
  width: 100vw;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.p2cont > img {
  width: 50%;
  padding: 100px 0px;
}

.p1_2line {
  user-select: text;
}

.p2_2 {
  font-family: 'Open Sans';
  font-weight: 600;
  color: #333;
  font-size: 2vw;
  letter-spacing: 1.2px;
  width: 74vw;
  line-height: 1.8em;
  margin-bottom: 200px;
}

.p2_1 {
  margin: 50px 0px;
  width: 60vw;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  justify-content: center;
}

.homecohortcont {
  width: 100px;
  height: 100px;
  overflow: hidden;
  border-radius: 50px;
  transform-style: flat;
  position: relative;
  margin: 5px;
}

.homecohort {
  width: 100px;
  height: 100px;
  position: relative;
  z-index: -10 !important;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

@media only screen and (min-width: 1200px) {
  .p1_2 {
    font-size: 22pt;
    line-height: 1.2em;
  }

  .p2_2 {
    font-size: 18pt;
  }
}

@media only screen and (max-width: 770px) {
  .p2_2 {
    margin-bottom: 100px;
  }

  .p1_1 {
    width: 35vw;
    height: 35vw;
    margin: 0px;
  }

  .p1cont {
    margin: 20px 0px 80px 0px;
    width: 100vw;
    flex-direction: column;
  }

  .p1_2 {
    margin-top: 20px;
    font-size: 3.4vw;
    line-height: 1.2em;
    width: 70vw;
    overflow: hidden;
  }

  .p2_2 {
    font-size: 12pt;
  }

  .sponsorscont {
    margin: 60px 0px;
    display: flex;
  }

  .sponsorscont div img {
    padding: 20px;
  }

  .sponsorsconttext {
    margin-bottom: 20px;
  }

  .sponsorsconttext {
    font-size: 1.9vw;
  }

  .p2cont {
    width: 100vw;
  }

  .homecohortcont {
    width: 75px;
    height: 75px;
  }

  .homecohort {
    width: 75px;
    height: 75px;
  }

  .p2_1 {
    width: 80vw;
  }

  .p2_2 {
    font-size: 3vw;
    letter-spacing: 1.2px;
    width: 85vw;
    line-height: 1.7em;
  }

  .talkcont {
    margin: 50px 0px 50px 0px;
    height: 250px;
  }

  .talk {
    width: 100vw;
    font-size: 40pt;
  }

  .talkitem {
    width: 200vw;
  }
}

@media only screen and (max-width: 450px) {
  .p1_1 {
    width: 70vw;
    height: 70vw;
  }

  .p1cont {
    margin: 10px 0px 80px 0px;
    width: 100vw;
    flex-direction: column;

    justify-content: flex-end;
    align-items: center;
  }

  .p1_2 {
    font-size: 4.3vw;

    line-height: 1.2em;
    width: 90vw;
  }

  .sponsorscont {
    width: 100vw;
    margin: 40px 0px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-direction: column;
  }

  .sponsorscont div {
    width: 80vw;
    align-items: center;
  }

  .sponsorsconttext {
    font-size: 4vw;
    margin-bottom: 40px;
  }

  .sponsorscont div img {
    padding: 20px 5px;
    width: 80vw;
  }

  .sponsorscont .craig {
    width: 60vw;
    margin-bottom: 100px;
  }

  .sponsorscont .knight {
    width: 60vw;
  }

  .sponsorscont .tasc {
    width: 60vw;

    margin-top: 10px;
  }

  .homecohortcont {
    width: 50px;
    height: 50px;
  }

  .homecohort {
    width: 50px;
    height: 50px;
  }

  .p2_2 {
    font-size: 3.5vw;
  }
}