body {
    animation: barberpole 120s linear infinite;
}

main {
  grid-area:main;
  margin-left: auto;
margin-right: auto;
padding:15px;
display:flex;
 flex-flow: row wrap;
  justify-content: center;
}

article {
    margin-bottom:10px;
    flex: 100%;
    max-width:70%;
}

#post {
    border: thick double var(--dynamo);
    box-shadow: 3px 3px var(--main-color);
    border-radius: 10px 10px 10px 10px;
    padding:15px;
    height:fit-content;
    line-height: 30px;
    background-color:rgba(255, 255, 255, 0.747);
}

#post h1, #post h2, #post h3, #post h4, #post h5, #post h6 {
    font-family:var(--mainfont);
    color:var(--dynamo);
} 
.username {
    color: var(--friendtext);
    vertical-align: middle;
    padding-bottom:5px;
    border-bottom: double 2px var(--main-color);
}

.username span::before {
    font-style:bold;
    font-size:xx-large;
    font-family:var(--headerfont);
    content:"YOUR HONOR ";
    color:var(--main-color);
}

.date {
    float:right;
    font-size:x-small;
}

.username::before {
display:inline-block;
content: " ";
vertical-align: middle;
width:5rem;
left:0;
height:5rem;
border-radius:100%;
background: transparent url(/media/images/tomodachilife/diaryicon.png) no-repeat;
background-size:cover;
background-position:50%;
margin-right:10px;
}

.tags {
    border-top: double 2px var(--main-color);
    color: var(--dynamo);
    font-style: italic;
}

.gallerycap {
    font-family:'Ms UI gothic';
    text-align:center;
    padding:5px;
}

.galleria {
    display: flex;
    flex-wrap: wrap;
    align-items:center;
    justify-content:center;
}

.gallery {
    flex: 100%;
    max-width: 50%;
    padding: 5px;
}

.galleryimg {
    width: 100%;  
    border:5px double var(--main-color);     
}

.hoverimg {
    transition:transform .5s;
    
}

.hoverimg:hover {
transform:scale(1.2);
}

@media only screen and (max-width: 900px) {
    .gallery {
        flex: 100%;
        max-width: 100%;
    }

    article {
    width:100%;
    max-width:initial;
    display:block;
    flex:none;
    height:fit-content;
}
body {
    animation:none;
}

.navlink {
    font-size:1em;
    display:block;
}
}