@font-face {
  font-family: "font1";
  src: url("https://dunstan.becht.network/unity/font/proportional.woff2") format("woff2"),
       url("https://dunstan.becht.network/unity/font/proportional.otf") format("opentype");
}
@font-face {
  font-family: "font2";
  src: url("/views/fonts/title.ttf") format("truetype");
}
@font-face {
  font-family: "font3";
  src: url("/views/fonts/text.ttf") format("truetype");
}
::selection {
  background: rgba(0, 0, 0, 0);
  color: ;
}
::-moz-selection {
  background: rgba(0, 0, 0, 0);
  color: ;
}
html {
  height: 100%;
  padding: 0;
  font-size: 0;
}
body {
  margin: 0;
  padding: 0;
  cursor: default;
  overflow-y: scroll;
  text-align: center;
  background: url("/views/pictures/background.jpg") no-repeat center fixed #000000;
  background-size: cover;
}
h1 {
  text-align: center;
  font-family: font1;
  text-decoration: none;
  color: #ffffff;
  margin-top: 0;
  font-size: 4vh;
  margin-bottom: 2vh;
}
h2 {
  text-align: left;
  font-family: font2;
  text-decoration: none;
  color: #ffffff;
  margin: 0;
  font-size: 2.5vh;
}
table {
  margin: 2vh auto 0 auto;
}
td {
  text-align: left;
  font-family: font3;
  text-decoration: none;
  color: #ffffff;
  margin: 0;
  margin-bottom: 1vh;
  font-size: 2.5vh;
}
p {
  text-align: justify;
  font-family: font3;
  text-decoration: none;
  color: #ffffff;
  margin: 0;
  margin-bottom: 1vh;
  font-size: 2.3vh;
}
a, input {
  font-family: font3;
  text-decoration: none;
  color: ;
  
-webkit-transition: all .2s ease-in;
-moz-transition: all .2s ease-in;
-o-transition: all .2s ease-in;
transition: all .2s ease-in;  font-size: 2.5vh;
  background: transparent;
  border: none;
}
a:hover, input:hover {
  color: #ffffff;
}
input[type=text], input[type=email] {
  color: white;
  width: 98%;
  text-align: center;
  margin: 2% 0 2% 0;
  border: 0.41666666666667vh solid white;
  border-radius: 0.83333333333333vh;
}
input[type=text]:hover, input[type=email]:hover {
  border-color: ;
}
input[type=text]:focus, input[type=email]:focus {
  border-color: ;
}
input[type=email]:invalid {
  border-color: ;
}
input[type=submit] {
  cursor: pointer;
}
section {
  vertical-align: top;
  display: inline-block;
  background-color: rgba(0, 0, 10, 0.7);
  -webkit-box-shadow: 0 0 2vmax 0 rgba(256, 256, 256, .1);
  -moz-box-shadow: 0 0 2vmax 0 rgba(256, 256, 256, .1);
  box-shadow: 0 0 2vmax 0 rgba(256, 256, 256, .1);
  width: 60vh;
  margin: 1vh;
  padding: 1.5vh;
  border-radius: 2vh;
}
footer {
  text-align: center;
  padding-top: 10vh;
  padding-bottom: 5vh;
}
video {
  margin-top: 10%;
  width: 100%;
  opacity: 1;
  border-radius: 1vh;
}
.logo-high-hopes {
  padding: 0;
  height: 36vh;
  margin-top: 3vh;
  margin-bottom: 20vh;
}
path {
  -webkit-transition: fill .2s ease;
  -moz-transition: fill .2s ease;
  -o-transition: fill .2s ease;
  transition: fill .2s ease;
}
.photo-member {
  float: right;
  display: inline-block;
  width: 16vh;
  border-radius: 1vh;
}
.logo-project-box {
  display: flex;
  height: 16vh;
  cursor: pointer;
}
.logo-project {
  height: 60%;
  max-width: 70%;
  margin: auto;
}
.picture-section {
  width: 100%;
  margin: auto;
  cursor: pointer;
  border-radius: 1vh;
}
.action {
  padding: 0;
  width: 12%;
  margin: 0 4% 2% 4%;
}
.red {
  color: ;
}
.green {
  color: ;
}
.blue {
  color: ;
}
.beige {
  color: rgba(128, 103, 47, 1);
}
.icons {
  vertical-align: middle;
  height: 4vh;
  padding: 0.3vh;
}
#player-overlay {
  position: relative;
}
@media (max-aspect-ratio: 3/4) {
  h1 {
    font-size: 5.3333333333333vw;
    margin-bottom: 2.6666666666667vw;
  }
  h2 {
    font-size: 3.3333333333333vw;
  }
  table {
    margin: 2.6666666666667vw auto 0 auto;
  }
  td {
    margin-bottom: 1.3333333333333vw;
    font-size: 3.3333333333333vw;
  }
  p {
    margin-bottom: 1.3333333333333vw;
    font-size: 3.0666666666667vw;
  }
  a, input {
    font-size: 3.3333333333333vw;
  }
  input[type=text] {
    border-width: 0.55555555555556vw;
    border-radius: 1.1111111111111vw;
  }
  section {
    width: 80vw;
    margin: 1.3333333333333vw;
    padding: 2vw;
    border-radius: 2.6666666666667vw;
  }
  footer {
    padding-top: 13.333333333333vw;
    padding-bottom: 6.6666666666667vw;
  }
  video {
    border-radius: 1.3333333333333vh;
  }
  .photo-member {
    width: 21.333333333333vw;
    border-radius: 1.3333333333333vw;
  }
  .logo-project-box {
    height: 21.333333333333vw;
  }
  .picture-section {
    border-radius: 1.3333333333333vw;
  }
  .icons {
    height: 5.3333333333333vw;
    padding: 0.4vw;
  }
}