body, header, section, main, aside, footer, p{
    display: block;
}

body{
    width: 75%;
    margin: auto;  
}

/*Typography*/
body{
    font-family: 'Karla', sans-serif;
    font-size: 100%;
    color: rgb(40, 91, 212);
}

/*Navigation*/
nav {
    overflow: hidden;
    margin: 5% 0%;
}

#name {
    margin: 2.5% 36.75%;
    display: inline-block;
}

#right {
    display: inline-block;
    position: fixed;
    padding-left: 5%;
    width: 50px;
}

#name a, #right a {
    text-align: center;
    color: rgb(40, 91, 212);
    text-decoration: none;
}

#name a:hover, #right a:hover{
    color: #85EDEE;
    text-decoration: underline;
}

#right a {
    float: left;
    padding-right: 0.5%;
}

/*Images*/
.row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.row img {
    width: 80%;
    padding: 2% 10% 2% 10%;
}

/*Text*/
.content, footer{
    margin: 0% 30% 0% 10%;
}

/*Responsive Layout*/
@media screen and (max-width: 800px) {
  #right {
    position: relative;
  }
}

@media screen and (max-width: 600px) {
  #right {
    position: relative;
  }
 #name {
    margin: 10%;
  }
}

