*, *:before, *:after {
  box-sizing: inherit;
  }

body {
  background-color: #fcf9f9; 
  background: linear-gradient(to right, #e7e4e4, #fcf9f9, #faf8f8, #e7e4e4, #aaa);
  color: #000;
  font-family: Verdana, sans-serif;
  line-height: 150%;
  }

h1, h2, h3, h4 {
  font-family: Arial, sans-serif;
  text-align: left;
  color: #333;
  }
  
#content {
  max-width: 650px;
  margin-left: 200px;
  margin-right: 40px;
  }
  
.title {
  font-family: times, serif, Courier, monospace;
  font-weight: 200;
  text-align: left;
  }
  
@media (max-width: 799px) {
  body {
    background-color: #fcf9f9;
    background: linear-gradient(to left, #fcf9f9, #fcf9f9);
    }
  #content {
    max-width: 100%;
    margin: 0 40px 0 80px;
    background-color: #fcf9f9;
    }
}

@media (max-width: 650px) {
  body {
    background-color: #fcf9f9;
    background: linear-gradient(to left, #fcf9f9, #fcf9f9);
    }
  #content {
    max-width: 100%;
    margin: 0 20px;
    }
  
  article header img {
    width: 100%;
    height: auto;
    }
  }