:root {
     --background-gradient-1-1: #84dfeb8a;
     --background-gradient-1-2: #ffe0cb3a;
     --background-grid-color: #e7b191d7;
     --background-grid-size: 40px;
     --background-grid-line-width: 2px;
}
html {
     background-image: repeating-linear-gradient(90deg, var(--background-grid-color) 0, #ffffff00 var(--background-grid-line-width), #ffffff00 var(--background-grid-size)), repeating-linear-gradient( 0deg, var(--background-grid-color) 0, #ffffff00 var(--background-grid-line-width), #ffffff00 var(--background-grid-size));
     background-size: var(--background-grid-size);
     background-repeat: repeat;
     height: 100%;
}
* {
     box-sizing: border-box;
}
body {
     background-image: linear-gradient(to top, #8c599b -20%, #5fcfca31 100%);
     background-color: transparent;
     min-height: 100%;
     margin: 0;
     min-height: 100% !important;
}
body:after {
     display: block;
     position: absolute;
     background-image: linear-gradient(90deg, var(--background-gradient-1-1) 0%, var(--background-gradient-1-2) 40%, var(--background-gradient-1-2) 60%, var(--background-gradient-1-1) 100%);
     content: "";
     inset: 0;
     z-index: -1;
     height: 100%;
}
body:before {
     position: fixed;
     top: 50%;
     left: 50%;
     margin: -150px 0 0 -150px;
     background-image: url('https://8chan.moe/.media/454eb9ebd9c9494591df3c7bd9b31bd3da427f2f91919171d5739c3f40b1f80e.gif');
     content: "";
     height: 300px;
     width: 300px;
     z-index: -1;
     opacity: 0.5;
}
.innerPost {
     border-radius: 6px;
     margin-top: 0.7em;
     margin-left: 4em;
     position: relative;
     transition: all 0.5s;
     background-color: rgb(180, 210, 250);
     overflow: visible;
     border-bottom: 1px solid #666;
     border-left: 6px solid orange;
}
@media only screen and (max-width: 812px) {
     .innerPost {
         margin-left: 0;
         border-left: 0;
    }
     .innerPost:after, .innerPost:before {
         display: none;
    }
     .postCell {
         padding: 0 0.5em;
    }
}
.postCell > .innerPost:hover {
     box-shadow: -8px 8px teal, -7px 7px teal, -6px 6px teal, -5px 5px teal,-4px 4px teal, -3px 3px teal, -2px 2px teal, -1px 1px teal;
}
.postCell > .innerPost:after {
     content: "";
     position: absolute;
     inset: -20px 0 0px -30px;
     width: 2px;
     background-color: orange;
}
.postCell > .innerPost:before {
     content: "";
     position: absolute;
     top: 50%;
     left: -30px;
     width: 24px;
     height: 3px;
     background-color: orange;
}
.postCell:first-child .innerPost:last-child:after {
     inset: 0px 0 0 -30px;
}
.postCell:last-child .innerPost:last-child:after {
     inset: -20px 0 50% -30px;
}
.imgLink img {
     border-radius: 8px;
}
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:ital,wght@0,400;
0,600;
0,700;
1,400&display=swap');
html, body {
     font-family: 'IBM Plex Sans Condensed', sans-serif;
     font-size: 16px;
}
#labelName {
     font-size: 2.2em;
     font-weight: 700;
     text-shadow: 2px 2px red;
     text-decoration: underline;
}
#labelName, #favoriteButtonLabel, #labelDescription {
     color: orange;
}
#labelDescription {
     margin: 0.4em 0;
}
#labelDescription::after {
     content: "(TM)";
     vertical-align: super;
     font-size: 0.6em;
}
#bannerImage {
     border-radius: 10px;
}
.boardLinks {
     margin-top: 1em;
     display: flex;
     flex-direction: column;
}
.boardLinks a {
     text-decoration: none;
}
.boardLinks a::after {
     content: " →"
}
#newPostFieldset legend {
     border: none;
}
/*.innerPost::after {
     content: "";
     position: absolute;
     inset: 0;
     width: 5px;
     background-color: orange;
}
.imgLink img {
     border-radius: 6px;
}
.title {
     margin:0;
     text-decoration: underline;
}
*/