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: 72rem;
    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;}
}

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


/* CONTENTS ---------------------------->*/
.art {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 1px;
    img {
        width: 190px;
        height: 190px;
        object-fit: cover;
        margin: 7px;
        border: 3px double black;
        border-radius: 10px;
    }
    
}

#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;}}

#rule li {border: none; font-size: medium;margin-left: -30px;}