body {
  background-image: url('rose.png'); 
  background-repeat: repeat;
  font-family: romantic;
  background-size: 5%;
  color: #634956;
  font-size: 1.2rem;
  text-align: center;
  background-color: #edd8eb;
}


h1 {
  width: 100%;
  font-size: 3rem;
  height: 9rem;
  font-family: Porky;
  background: -webkit-linear-gradient(white, #d4909c, #8c5f74, #8c5f74, #d4909c, white);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
}

h2{
  font-size: 2rem;
  font-family: Porky;
  color: #ab7685;
  text-align: center;
  padding: -5px;
  text-shadow: 0px 0px 5px #d1aeb8;
}

.about {
 display:flex;
 flex-direction: row;
}


.wrapper {
  width: 40%;
  margin:5%;
  height: 1000px;
 background-color:#ab7685;
 border: ridge 5px white;
 padding: 5px;
 flex-wrap: wrap;
 display:flex;
}




.top {
 width:100%;
 height:20%;
 position:relative;
 z-index:2;

}

.block {
  width: 50%;
  height:80%;
}

.boxes {
  width: 85%;
  height:80%;
  position: relative;
  top: 10%;
  margin: 5%;
  padding: 5px;
  border: ridge 5px white;
  background: -webkit-linear-gradient(#f2d8e2, #f2d8e2, #c2a5b4);
  overflow: scroll;}
  
  @media only screen and (max-width: 1000px) {
  .wrapper {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
  }
  
  .about {
    flex-direction: column;
  }
}