body {background-image: url(/medias/bg.png);background-attachment: fixed;background-size: cover;}
.mainbox {
    width: 83%;
    max-width: 1300px;
    margin: auto;
    display: grid;
    gap: 1rem 8px;
    grid-template-columns: 14.9% 68% 16%;
    grid-template-areas: "header header header" "left body right" "footer footer footer";
    margin-block: 40px;
    border: 8px solid transparent;
    border-image: url(/medias/border1.png) 8 fill round;
    background-color: white;
    border-radius: 10px;
    padding: 5px
}

.box {
    border: 4px ridge gold;
    border-radius: 6px;
    padding: 2px;
    background-image: url(/medias/bg2.gif);
}

@keyframes scroll {
  from {
    background-position: 0% 0%;
  }
  to {
    background-position: 100% 100%;
  }
}

.content {
    margin: 5px;
    background-color: white;
    border: 2px ridge rgb(53, 51, 45);
    overflow-y: auto;
}


/* CONTAINERS ---------------------------->*/
#header {
    grid-area: header;
    height: 300px;
    background-image: url(/medias/mkvheader.gif);
}

#sidebar1 {
    grid-area: left;
    height: auto;
    animation: scroll 25s linear infinite;
    li {margin: auto; margin-left: -38px;margin-block:10px;font-size: 20px; border: 1px solid black;}
}

#body {
    grid-area: body;
    height: 69rem;
    overflow-y: auto;
    animation: scroll 36s linear infinite;
    gap: 2px
}

#sidebar2 {
    grid-area: right;
    height: auto;
    animation: scroll 25s linear infinite;
    li {margin: auto; margin-left: -38px;margin-block:10px;font-size: 20px; border: 1px solid black;display: flex; flex-direction: row; align-items: center;}
}

#footer {
    grid-area: footer;
    height: 3rem;
}

/* CONTENTS ---------------------------->*/
.blog-box {
    border: 3px double black;
    border-radius: 5px;
    margin-block: 16px;
    padding-inline: 14px;
    background-color: white;
    #thumbnail {float:right; width: 200px; height:220px; margin-left: 30px; margin-top: -69px; border-radius: 5px; border: 2px solid black}
}



#pic1, #pic2 {height: 200px;} #pic1{background-image: url(/medias//cropped/2.png);} #pic2{background-image: url(/medias//cropped/1.png);}

#ad1 {height: auto; overflow:hidden; text-align: center; img {border: 2px black solid; text-align: center;}}

#stats p {margin: 5px}

#more {display: none;} #morebtn {font-style: italic; font-size: small;} #morebtn:hover {color:gold; text-decoration: underline;font-weight: bolder;}