*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* font-family: sans-serif; */
}
.body{
    display: flex;
    flex-direction: column;
    max-height: 100%;
}

a, h1{
    text-decoration: none;
    color: red;
    font-weight: bold;
}
h3, .menus{
    transition: all 0.5s ease;
    transform: translateX(-1000px);
}
.slideleft{
    transform: translateX(0px);
}
p{
    line-height: 18px;
    opacity: 0;
    transition: all 0.5s ease;
}
.fade{
    opacity: 1;
}
h1{
    opacity: 0;
    transition: all 5s ease;
}
main{
    display: flex;
    flex-direction: row;
    flex: auto;
    background-color: #f4f4f4;
    padding: 20px;

}
article{
    flex: 2;
    overflow-y: auto;
    max-height: 80vh;
}
aside{
    overflow-y: auto;
    flex: 1;
}
footer{
    text-align: center;
    font-size: larger;
    font-weight: 500;
    padding: 20px 0;
    border-top: solid 2px black;
    transition: all 1s ease ;
    transform: translateY(1200px);
}
.slideup{
    transform: translateY(0px);
}
.small{
    margin: 0px auto 15px;
    cursor: crosshair;
}
img{
    cursor: nw-resize;
    margin: 15px auto;
    
}
img, .right{
    transition: all 0.5s ease;
    transform: translateX(1000px);
}
.slideright{
    transform: translateX(0px);
}
.postlinks{
    list-style: unset;
    text-decoration: unset;
    margin: 10px auto;
}
.postlinks a{
    text-decoration: underline;
}
.vid{
    margin: 40px auto 20px;
}
a img{
    cursor: pointer;
}
.menu a:hover{
    color: red;
    text-decoration: none;
}
.menu{
    transition: all 0.5s ease-in-out;
}
.active a{
    text-decoration: line-through ;
    text-decoration-color: red;
    text-decoration-style: solid;
    color: red;
}
.banner{
    cursor: unset;
}