
body {
    background-color: slategray;
    color: #282846;
    font-family: 'Libre Baskerville', serif;
    height: 100vh;
}

nav ul {
    list-style-type: none;
    overflow: hidden;
}
nav li {
    float: left;
}

nav li a {
    display: block;
    padding: 1em;
    font-size: x-large;
}
.siteHeader {

    align-items: center;
}

.name {
    text-align: center;
    font-family: 'Monoton', cursive;

}

.headerRight
{
    text-align: center;
    font-size: 2em;

}

header {
    margin-top:1em;
}

footer {
    width: 100%;
    height:30px;
    text-align: center;
    
}

.photobox {
    
    position: relative;
    overflow: hidden;
}
.textPhotoBox {
    position: absolute;
    border-radius: 5px;
  top: 15%;
  background-color: slategray;
    padding: 5px 8px 5px 8px;
  left: 50%;
  transform: translate(-50%, -50%);
}
.zoomOnHover {
    transition: transform .2s;
}
.zoomOnHover:hover{
    transform: scale(1.2);

}

.postDate {
    margin-bottom: 1.5em;
}
article {
    margin-bottom: 1.5em;
}
code {
    background-color: black;
    color:white;
}
.textInCircle {
    display: inline-block; 
    border-radius: 100%; 
    width: 1.5em; 
    height:1.5em; 
    background-color: darkred; 
    color: white; 
    text-align: center;
}

@media screen and (max-width: 600px) {

    nav {
        display: block;
    }
    nav ul {
        list-style-type: none;
        overflow: hidden;
    }
    nav li {
        clear: left;
        margin: unset;
    }
    
    nav li a {
        display: block;
        flex-direction: column;
        padding: 0em; 
        font-size: x-large;
    }
    .siteHeader {
        align-items: unset;
    }
    .row {
        flex-direction: column;
    }
}