@font-face {
    font-family: 'blackoutmidnight';
    src: url('fonts/blackout-midnight-webfont.woff2') format('woff2'),
         url('fonts/blackout-midnight-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

  @font-face {
    font-family: 'bellotaregular';
    src: url('fonts/Bellota-Regular-webfont.eot');
    src: url('fonts/Bellota-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Bellota-Regular-webfont.woff2') format('woff2'),
         url('fonts/Bellota-Regular-webfont.woff') format('woff'),
         url('fonts/Bellota-Regular-webfont.ttf') format('truetype'),
         url('fonts/Bellota-Regular-webfont.svg#bellotaregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bellotabold';
    src: url('fonts/Bellota-Bold-webfont.eot');
    src: url('fonts/Bellota-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Bellota-Bold-webfont.woff2') format('woff2'),
         url('fonts/Bellota-Bold-webfont.woff') format('woff'),
         url('fonts/Bellota-Bold-webfont.ttf') format('truetype'),
         url('fonts/Bellota-Bold-webfont.svg#bellotabold') format('svg');
    font-weight: normal;
    font-style: normal;
}


  body {
        overflow-x: hidden;
  }

  a:link {
    color: black;
    font-style: normal;
      text-decoration: none;
  }

  a:visited {
    color: black;
    font-style: normal;
    text-decoration: none;
  }

  a:hover {
    color: #999999;
    font-style: normal;
    text-decoration: none;
  }

  a:active {
    color: black;
    font-style: normal;
    text-decoration: none;
  }

  h1{
    float:left;
    font-family: 'blackoutmidnight';
    font-size: 2vw;
  }

  #main{
    width:90%;
    height:auto;
    margin:auto;
  }

  #menu{
    width:100%;
    height:100px;
      text-align: center;
      margin:auto;
      text-decoration: none;
      padding-left: 10%;
  }

  .menu{
    font-family: sans-serif;
    font-size:1vw;
    float: left;
    margin-left:10%;
  }

#biopic{
  background-image:url('images/biopic.png');
  width:32%;
  height:60vh;
  background-size: cover;
    float: left;
    margin-top: -5%;
    margin-right: 3%;
    margin-left:1%;
}

#bio{
  background-color: #ECA3C1;
  width:90%;
  height:30vh;
    margin-top:5%;
    font-size:1.5vw;
    padding:5%;
    font-family: sans-serif;
  }

.questions{
  width:60%;
  height:auto;
    margin:auto;
    margin-top:5%;
    font-size:1.5vw;
    font-family: sans-serif;
}

#question1{
  width:70%;
  height:10%;
  margin:auto;
background:#FDDDD4;
color:#F26C50;
font-family: 'bellotabold';
font-size:2vw;
margin-top:5%;
padding:1%;
}

#question2{
  width:70%;
  height:10%;
  margin:auto;
background:#9DD9DB;
color:#234F56;
font-family: 'bellotabold';
font-size:2vw;
margin-top:5%;
padding:1%;
}

#question3{
  width:70%;
  height:10%;
  margin:auto;
background:#DCC72D;
color:white;
font-family: 'bellotabold';
font-size:2vw;
margin-top:5%;
padding:1%;
}