body {
  margin: 0px;
  display: block;
  background-color: white;
  color: black;
  font-family: "Arial";
  font-size: 16px;
}

/* sections */
.header, .about, .memo, .docs, .footer {
  padding: 10px 40px;
}

.about{
  background-color: #F49AC0;
}

.memo{
  background-color: #8BE7FF;
}

.docs{
  background-color: #7cc576;
}

.footer {
  color: #808080;
  font-size:12px;
}

/* box divs*/
.box {
  margin: 5px;
  padding: 5px;
  border: 2px solid black;
  background-color: white;
}

.memo .box {
  padding: 5px 20px;
}

.flex {
 display: flex; 
}

.flex > div {
 padding:5px;
}

/* extras */
img {
  border: 2px solid black;
  height: 200px;
  width: 142px;
}

svg {
  width: 20%;
}

/*Custom link colours*/
a:link {
  color: #F49AC0; /* pink #F49AC0 */
  background-color: transparent;
  text-decoration: none;
}
a:visited {
  color: #8BE7FF; /* blue #8BE7FF */
  background-color: transparent;
  text-decoration: none;
}
a:hover, a:active { /* green #7cc576 */
  color: #8BE7FF;
  background-color: transparent;
  text-decoration: underline;
}

@media (max-width: 700px) {
  svg {
    width: 90%;
    margin: auto;
  }
}