html {
  height: 100%;
  overflow: hidden;
}

body {
  height:100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

html{
  height:100%;
}

.designbites body{
  background: rgb(234,228,225);
  height: 90vh;

}

header {
  max-width: 700px;
  height: 10vh;
  margin: 0 auto;
  text-align: center;
}

#logo {
  width: 400px;
  padding: 5%;
  margin-top:10px;
}

hr {
  border-color: gray;
}

#content, footer {
  margin: 0 auto;
  text-align: center;
  padding-left: 5%;
  padding-right: 5%;
  position: absolute;
	top: 50%;
	left: 50%;
	width: 90%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform:    translate(-50%, -50%);
	-ms-transform:     translate(-50%, -50%);
	transform:         translate(-50%, -50%);
}




#wrapper {
  max-width: 1180px;
  text-align: left;
  border-left: 10px solid #000;
  padding-left: 40px;
  margin: 0 auto;
}

.designbites body, .designbites body p {
  font-family: 'Avenir Next W01 Thin', sans-serif;
  font-weight: 400;
  font-size: 2.5em;
  line-height: 1.6667em;
  color:#000;
}

@media screen and (max-width: 768px) {
  .designbites body, .designbites body p {
    font-size: 1.5em;
  }

}

#description {
  font-family:'Avenir Next LT W01 Bold';
  letter-spacing: .05em;
  font-size: 1.25em;
}

#headline {
  font-family:'AdobeCaslonW01-Regular';
  font-weight: 400;
  font-style: ;
  font-size: 5em;
  color:#000;
  line-height: 1.0667em;
  letter-spacing: .05em;
}


.designbites a, .designbites a:visited, .designbites a:hover, .designbites a:active{
  color: rgb(255,102,1);
}


footer {
  font-size: 1em;
  top: 150%;

}