@import url('https://fonts.googleapis.com/css?family=Meddon&display=swap');
@import url('https://fonts.googleapis.com/css?family=Cormorant+Garamond&display=swap');

.page-wrapper{
  display: grid;
  grid-template-columns: 1fr 1fr;
  /*position: relative;*/
  grid-template-rows: 0 1fr;
}


h1{
  font-family: 'Meddon', cursive;
  margin-right: 309px;

}

h2{
  font-family: 'Meddon', cursive;
  font-size: 100px;
  position: absolute;
  right: 50px;
  width: 1050px;


  /*margin-top: 30px;*/
}

h3 {
  font-family: 'Meddon', cursive;
  font-size: 50px;
}

.participation h3 {
  margin-right: 300px;

}


.intro{
  display: grid;
  /*padding-bottom: 500px;*/
  /*grid-row: span 2;
  grid-column: 2;*/
}

.summary {
  font-size: 30px;
  width: 450px;
  margin-left: 50px;
  margin-bottom: 30px;
  position: relative;

  }

  .summary::before{
    content: "";
    display: block;
    background: #d7edfa;
    width: 500px;
    height: 600px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
  }

.preamble{
  position: relative;
  margin-bottom: 200px;
  font-size: 20px;
  width: 500px;
  top: 30px;

}

.preamble::before{
  content: "";
  display: block;
  background: #d4edff;
  width: 600px;
  height: 700px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}

.explanation{
  position: relative;
  bottom: 90px;
  font-size: 20px;
  margin-top: 1000px;
  width: 500px;

}

.explanation::before{
  content: "";
  display: block;
  background: #8dbcd9;
  width: 600px;
  height: 900px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}

.participation{
  margin-bottom: 50px;
  position: relative;
  font-size: 20px;
  width: 500px;
  left: 80px;

}

.participation::before{
  content: "";
  display: block;
  background: #d7edfa;
  width: 500px;
  height: 600px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}



.benefits{
position: relative;
margin-top: 200px;
right: 90px;
font-size: 20px;
width: 500px;

}

.benfits h3 {
  margin-right: 40px;
}

.benefits::before{
  content: "";
  display: block;
  background: #8dbcd9;
  width: 500px;
  height: 400px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}

.requirements{
  position: relative;
  font-size:20px;
  width: 450px;
}

.requirements::before {
  content: "";
  display: block;
  background: #d7edfa;
  width: 600px;
  height: 1000px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}

.design-selection{
  position: relative;

}

.design-selection::before {
  content: "";
  display: block;
  background: #8dbcd9;
  width: 300px;
  height: 400px;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: -1;
}

aside {
  grid-row: 1/2;
  grid-column: span 2;
  font-size: 10px;
  display: flex;
  flex-direction: row;
  position: relative;
  top:300px;
}

.design-name{
  text-decoration: none;

}

.designer-name{
  text-decoration: none;
}

li{
  list-style-type: none;
}

p{
  font-family: 'Cormorant Garamond', serif;
}

aside h3{
  font-size: 20px;
}


@media only screen and (max-width: 600px) {
  .pagewappwer {
    display: block;
    position: static;
  }

  h2{
    font-size: 30px;
    position: static;
  }

}

body{
background-color: #fefff5

}