.page-wrapper{
  background-color: lightgrey;
  background-size: cover;
  padding:8px;
  margin:8px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-gap:10px;
  /* max-width:1200px;
  margin:0 auto; */
}

.intro{
 background-image: url("../image/paper.jpg");
  /*background-color:black;*/
  grid-column:1/3;
  display:grid;
  grid-template-columns:2fr 1fr;
  padding:12px 36px;
  outline-style:solid;
  outline-color:white;
  outline-offset:-15px;

}
h1{
  font-family: 'Anton', sans-serif;
  font-size:50px;
  text-align: center;
  color:white;
}
h2{
  font-family: 'Anton', sans-serif;
  font-size:100px;
  text-align:center;
  color:white;

}
h3{
  font-family: 'Quicksand', sans-serif;
  font-weight: lighter;
  font-size: 25pt;
  color:white;
}
body{
  font-family: 'Open Sans', sans-serif;
  font-size: 12pt;
  color:white;

}


.summary{
  /* background-color:lightgrey; */
  grid-column:2/3;
  margin-top:90px;
  padding:140px 20px;
  color:white;
  font-size: 15pt;
  border-left: solid;
  /* outline-style:solid;
  outline-color:lightgrey; */
}
.circle{
  grid-column: 1/3;
  border-radius: 50%;
  color:white;
  width: 50px;
  high:50px;
}
.preamble{
  grid-column:1/3;
  margin-top: -5%;
  margin-left: 5%;

}
.supporting{
  grid-column:1/3;
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  grid-gap: 8px;
  color:white;
}
.explanation{
  background-color:black;
  grid-column:1/3;
  padding:12px 36px;
  outline-style:solid;
  outline-color:white;
  outline-offset:-15px;

}
.participation{
  background-color:black;
  grid-column:3/5;
  padding:12px 36px;
  outline-style:solid;
  outline-color:white;
  outline-offset:-15px;
}
.benefits{
  background-color:black;
  grid-column:1/2;
  padding:12px 36px;
  outline-style:solid;
  outline-color:white;
  outline-offset:-15px;

}
.requirements{
  background-color:black;
  grid-column:2/5;
  padding:12px 36px;
  outline-style:solid;
  outline-color:white;
  outline-offset:-15px;
}
footer{
  grid-column:1/5;
  background-color:white;
  padding:12px 36px;
  outline-style:solid;
  outline-color:black;
  outline-offset:-5px;
  text-align:center;

}
aside{
  background-color:white;

  padding:12px 36px;
  outline-style:solid;
  outline-color:black;
  outline-offset:-5px;
  grid-column:1/3;

}
a{
    color:red;
}

a:hover {
    color:red;
  }

.sidebar .wrapper{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
}

.design-selection{
  grid-column:1/2;
}
.design-archives{
  grid-column:2/3;

}
.zen-resources{
  grid-column:3/4;
}
.zen-resources a{
  color:red;
}
.design-archives a{
  color:red;
}
.design-archives a:hover {
    color:red;
  }
  .design-selection, .design-archives , .zen-resources {
  color:#000000;
}
#design-selection ul li a:hover {
    color:black;
  }
  #design-selection ul li a{
    color:red;
  }
.zen-resources a:hover {
    color:red;
}
.select{
      color:black;
      font-weight: bold;
    }
    .archives{
      color:black;
      font-weight: bold;
    }
    .resources{
      color:black;
      font-weight: bold;
    }



@media only screen and (max-device-width: 400px){
      #h1{font-size:30pt;

      }

    }