22-03 Nelly

<style type="text/css">
    #wrapper {
        background: url(https://i.postimg.cc/PXBKYh6g/22-03-Nelly-full.png) no-repeat top center;
        width: auto;
        }

body {background: #000 url(https://i.postimg.cc/nZhnPxh4/22-03-Nelly-background.png) no-repeat;
background-size: 100% auto;}
.dottedSeperator { background: url(https://i.postimg.cc/RCFpQX9t/22-03-Nelly-dotted-Seperator.png);}
h1.dark-blue {margin-bottom: 40px !important;}

#interactiveBanner {display: none;}
#logo, #membersOnline, #socialIcons {display: none;}

            #credit {position: absolute; top: 313px; font-size:10px;}

/** TABLET CODES **/
    @media (max-width: 1023px) {
        #wrapper {
            background: url(https://i.postimg.cc/9XD5FWDs/22-03-Nelly-tablet.png) no-repeat top center;
            background-size: cover;
            width: auto;}
        h1.dark-blue {margin-top: 150px}
#credit {text-align:center; top: 294px; width:100%;}
.mainTable {margin-top:220px; margin-bottom: -150px;}
h1 {font-size: 40px;}
        }

/** MOBILE CODES **/
    @media (max-width: 500px) {
        #wrapper {
            background: url(https://i.postimg.cc/fytK4qTg/22-03-Nelly-mobile.png) no-repeat top center;
            background-size: cover;
            width: auto;
            }
        }

/** LINK & HEADING COLOR CHANGES **/
    a.menuToggle, a.menuToggle:hover, h4, h5, h6, #sideNavMenu b, .m-t-md, .m-b-md, .green, #footerMagic, #footerContent h3, #footerSubsidiaries, label, #dateTime{
        color: var(--c1) !important;
    }
    a.sideNavMenuLink:link, a.sideNavMenuLink:visited, #footerMenu a:link, #footerMenu a:visited, #mainContentNav a, .forumReplyLinksLinks a, .forumLinksLinks li {
        color: var(--c2) !important;
    }
    a.sideNavMenuLink:Hover, .forumMembersInAreaTitle, .darkblue, .dark-blue, #footerCopyright, #footerDescription, p.a, #mainContentNav > ul a, .dark-blue a:link, .dark-blue a:visited, #credit {
        color: var(--c3) !important;
    }
    a:hover, #footerMenu a:hover, #mainContentNav a:hover, .dark-blue a:hover {
        color: var(--c4) !important;
    }

.forumSearchBox button {background-color: var(--c1) !important;}
.forumPageSelect, .forumModerateSelect {background-color: var(--c2) !important; background: url(https://i.postimg.cc/50qHXwKN/22-03-Nelly-select-Icon.png) no-repeat right;}
.forumLinks li.forumNewThread {background: url(https://i.postimg.cc/sXRQfncN/22-03-Nelly-new-Thread.png) no-repeat top left;}
.forumLinksLinks li.forumWatchList, .forumLinksLinks li.forumWatchThread {background: url(https://i.postimg.cc/tCVzgctX/22-03-Nelly-watch-List.png
) no-repeat top left;}
.forumLinksLinks li.forumParticipationList {background: url(https://i.postimg.cc/x8fXMcBG/22-03-Nelly-participation-List.png) no-repeat top left;}
.forumLinksLinks li.forumModerate {background: url(https://i.postimg.cc/cJ3tSqQ3/22-03-Nelly-moderate.png) no-repeat top left;}
.forumLinksLinks li.forumLastPost {background: url(https://i.postimg.cc/fyqRd5cZ/22-03-Nelly-last.png) no-repeat top left;}
.forumLinksLinks li.forumTop {background: url(https://i.postimg.cc/jdC5T0Tj/22-03-Nelly-top.png) no-repeat top left;}
.forumLinksLinks li.forumLockThread {background: url(https://i.postimg.cc/2SZSqQVR/22-03-Nelly-lock.png) no-repeat top left;}
.forumLinksLinks li.forumUnlockThread {background: url(https://i.postimg.cc/fTFbT2Wf/22-03-Nelly-unlock.png) no-repeat top left;}
.forumLinksLinks li.forumSearchThread {background: url(https://i.postimg.cc/v80BC8pj/22-03-Nelly-search.png) no-repeat top left;}
.forumPostLink {background: url(https://i.postimg.cc/s2ffTtTy/22-03-Nelly-link.png) no-repeat;}

.forumPageNext, .forumPagePrevious, #addReply [type=submit] {background-color: var(--c2); color: #ffffff;}
.forumPageNext:hover, .forumPagePrevious:hover, .forumPageLink:hover, #addReply input:hover {background-color: var(--c1);}
.forumPageButtonDisabled, .forumPageButtonDisabled:active, .forumPageButtonDisabled:hover {background-color: #000;}

.forumThreadFlagged { background-color: var(--c1); }

.mainTable {opacity: 50%;}
.quidditch-show-off-desktop {margin-top: 40px;}

/*** FONT PLAY ***/
    h1, h2, h3, h4, h5, h6, h7, #footerMagic, #footerSub, #footerSubsidiaries, .footerNav a, .forumLinksLinks li {font-family: 'Amatic SC'; text-transform: none; font-weight: bold;}
    a.menuToggle, #sideNavMenu b, .forumMembersInAreaTitle, #dateTime, #mainContentNav a, #addReply [type=submit] {font-family: 'Amatic SC'; font-weight:bold;}
    a.menuToggle, #sideNavMenu b {font-size: 21px; border-left: 1px solid var(--c1); border-bottom: 1px solid var(--c1); padding-left: 4px; letter-spacing: 2px; margin-top: 2px;}
    #various_text b {font-size: 1em; border: none; padding-left: 0; letter-spacing: normal; margin-top: 0;}
    .footerNav a, .forumLinksLinks li, .forumMembersInAreaTitle, #dateTime, #mainContentNav a, #addReply [type=submit]  {font-size: 2em !important;}
    #footerMagic, #footerSub, #footerSubsidiaries {font-size: 3.25em;}

    /** COLOR VARIABLES **/
* {
    --c1: #705d8e;
    --c2: #5a4d6e;
    --c3: #8e5788;
    --c4: #866b7f;
    }
</style>

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&display=swap" rel="stylesheet">
<!--- LAYOUT DESIGN AND CODE BY SARA, DO NOT REMOVE CREDIT PLEASE --->
<div id="credit"><i>layout by: <a href="/userinfo/Sara">Sara</a></i></div>