body {
  background-color:#e8e7e1;
  color: #3a4451;
  font-family: 'Gabarito', sans-serif;
  font-size: 18px;
  line-height: 24px;
  padding: 0px;
  margin: 0px;
}
a, a:visited {
  color: #3a4451;
}
h1 {
  font-size:80px;
  padding:0px;
  margin:0px;
}
h2 {
  font-size:28px;
  margin-bottom:10px;
}
p {
  margin: 0px 0px 10px 0px;
  padding: 0px;
}
#wrapper {
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
  padding-left:30px;
  padding-right:30px;
}
#header {
  width: 1000px;
  background-color:#3a4451;
  color:#e8e7e1;
  text-align:center;
  padding:10px;
  margin-top:30px;
  margin-bottom:20px;
  height:100px;
}
#header h1 {
  margin-top:38px;
}
#intro {
  width: 1000px;
  height: auto;
}
#content {
  width: 580px;
  float:left;
  padding-top:20px;
}
#youtube {
  margin-bottom:50px;
}
#youtube img {
  width:350px;
}
#ask_box {
  margin-bottom:30px;
}
#ask_box h2.answered {
  color:#ff0000;
}
#facebook {
  float:left;
}
input[type=text] {
  width:400px;
  border:1px solid #3a4451;
  border-radius:4px;
  outline:none;
  font-family: 'Gabarito', sans-serif;
  padding:10px;
  font-size:20px;
}
input[type=submit] {
  background-color:#3a4451;
  color:#e8e7e1;
  padding:10px;
  font-size:20px;
  border:none;
  border-radius:4px;
}
#headshot {
  float:right;
  margin-bottom:0px;
  height:438px;
}
#headshot img {
  width:400px;
}
#footer {
  clear:both;
  background-color:#3a4451;
  color:#e8e7e1;
  padding:5px 5px 5px 15px;
  font-size:14px;
  margin-bottom:20px;
}

/* TABLET SIZE */
@media all and (max-width: 1000px) {

  #wrapper {
    width: 700px;
    padding-left:0px;
    padding-right:0px;
    margin-right:0px;
    margin-left:0px;
  }
  #header {
    width:680px;
    margin-top:10px;
    margin-bottom:10px;
    height:auto;
  }
  #header h1 {
    font-size:46px;
    line-height:40px;
    margin-top:0px;
  }
  #content {
    float:none;
    width:660px;
    padding-left:20px;
    padding-right:20px;
  }
  #intro {
    width:640px;
    padding-left:20px;
    padding-right:20px;
  }
  #intro h2 {
    font-size:20px;
    padding-top:10px;
    padding-bottom:10px;
  }
  h2 {
    font-size:20px;
    margin-bottom:10px;
  }
  input[type=text] {
    width:250px;
    margin-bottom:10px;
    font-size:16px;
  }
  input[type=submit] {
    font-size:16px;
  }
  #facebook {
    width:640px;
    margin-bottom:30px;
  }
  #headshot {
    position:relative;
    top:-470px;
    margin-bottom:-470px;
    height:470px;
  }
  #headshot img {
    width:250px;
  }
}

/* PHONE SIZE */
@media all and (max-width: 700px) {

  #wrapper {
    width:375px;
    padding-left:0px;
    padding-right:0px;
    margin-right:0px;
    margin-left:0px;
  }
  #header {
    width:355px;
    margin-top:10px;
    margin-bottom:10px;
    height:auto;
  }
  #header h1 {
    font-size:50px;
    line-height:50px;
    margin-top:0px;
  }
  #content {
    width:335px;
    padding-left:20px;
    padding-right:20px;
  }
  #intro {
    width:335px;
    padding-left:20px;
    padding-right:20px;
  }
  #intro h2 {
    padding-top:20px;
    padding-bottom:20px;
  }
  h2 {
    font-size:18px;
    margin-bottom:10px;
  }
  input[type=text] {
    width:315px;
    margin-bottom:10px;
  }
  input[type=submit] {
    font-size:18px;
  }
  #youtube img {
    width:335px;
  }
  #facebook {
    width: auto;
  }
  #headshot {
    top:0px;
    margin-bottom:0px;
    height:436px;
  }
  #headshot img {
    width:400px;
  }
}
