/* CSS BLOGNESS */

html {
background-image: url(dogbrethart.png);
}

@font-face {
font-family: inconsolata;
src: url(../fontz/Inconsolata-Regular.ttf);
}

* {
color: rgb(51, 23, 79);
box-sizing: border-box;
font-family: inconsolata;
}

h1 {
margin: 1.239%;
font-size: 2rem;
}

h2 {
margin: 1.239% 0.8%;
}

h3 {
margin: 0.6%;
}

h4 {
margin: 0.8% 0 6%;
}

.bod {
width: 1170px;
margin: 25px auto;
}

.containor {
background-color: #a1a95f;
border-radius: 0.625rem;
padding: 1% 1.73%;
margin: 0.428%;
border: 0.125rem solid;
}

article {
width: 72.55%;
max-height: 100%;
float: right;
}

.back {
max-width: 100%;
height: 40px;
display: flex;
align-items: center;
justify-content: space-around;
}

.back img {
width: 65%;
}

hr {
border: 1px solid #6e2358;
}

.navvy {
max-width: 100%;
max-height: 100%;
}

nav li {
list-style-type: none;
padding: 5px;
text-align: center;
background-color: #8f974a;
margin: 2px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

nav ul {
margin: 0;
padding: 0;
}

nav a {
text-decoration: none;
}

nav li:hover {
background-color: #8a6f30;
}

.stick {
width: 25.64%;
position: sticky;
top: 3.15%;
}

.signature {
text-align: right;
margin: 0.625rem 0.3125rem 2rem;
}

img {
max-width: 100%;
}

.clearfix {
clear: both;
}

.clearfix:after {
clear: both;
content: "";
display: table;
}

/* media queeries (same joke twice) */

@media only screen and (max-device-width: 1250px) and (min-device-width: 900px) {

.bod {
width: 95%;
}

}