:root { --site-margin: 40px; --primary-color: #000000e6; --secondary-color: #2e2e2ee6; --font-color: gba(0,0,0,.9); --font-highlight-color: #757575; --bg-color: #fff; --heading-color: #292922; --link-color: #007bff; --link-highlight-color: #0056b3; --font-special-color: #104E8B; --dropdown-menu-bg: #ffffff; --dropdown-menu-hover-bg: #cecece; --dropdown-border-color: rgba(0,0,0,.15); --theme-main-color: #000000; --font-family: Manrope; --secondary-font-family: Manrope; --navbar-collapsed-border-color: rgba(0, 0, 0, 0.5); }

[data-theme="dark"] { --primary-color: #e2e2e2; --secondary-color: #e2e2e2af; --font-color: #ffd600; --font-highlight-color: yellow; --link-color: var(--font-color); --link-highlight-color: var(--font-highlight-color); --font-special-color: #ffd600; --bg-color: #161616; --heading-color: hsla(0,0%,88.6%,.6862745098039216); --dropdown-menu-bg: #1a1a1a; --dropdown-menu-hover-bg: #424242; --dropdown-border-color: #272727; --theme-main-color: #ffd600; --font-family: Manrope !important; --secondary-font-family: Manrope !important; --navbar-collapsed-border-color: rgba(255, 255, 255, 0.5); }

@font-face { font-family: 'Manrope'; font-style: normal; src: local("Manrope"), url(/assets/fonts/Manrope-Latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
body { background-color: var(--bg-color); padding: 0; color: var(--primary-color); margin: 0 4%; }
@media (min-width: 1024px) { body { margin: 0 6% !important; } }
@media (min-width: 85.375em) { body { margin: 0 12% !important; } }
@media (min-width: 120em) { body { margin: 0 14% !important; } }

.mainContent { max-width: 160em; padding: 2em 1.0875rem 1.45rem; }
@media (min-width: 1024px) { .mainContent { margin: 0 1%; } }
@media (min-width: 85.375em) { .mainContent { margin: 0 4%; } }
@media (min-width: 120em) { .mainContent { margin: 0 8%; } }
.mainContent a { color: var(--link-color); }
.mainContent a:visited { color: var(--link-highlight-color) !important; }
.mainContent a:hover { color: var(--link-highlight-color) !important; }
.mainContent a:active { color: var(--link-highlight-color) !important; }

.home-intro { background-color: #F0F0F0; padding-top: 64px; padding-bottom: 64px; }

.ss-link { margin-top: 50px; }

.nice-button { float: right; padding: 0.2em 1em; border: 1px solid black; margin: -10px 0.1em 0.1em 0; box-sizing: border-box; text-decoration: none; font-family: 'Roboto',sans-serif; font-weight: 300; font-size: 15px; color: black; text-align: center; transition: all 0.15s; }

.nice-button:hover { color: #ffffff; border-color: #DDDDDD; }

.nice-button:active { color: #BBBBBB; border-color: #BBBBBB; }

.welcome-banner { margin: 20px 0 20px 0; }

.navbar-collapse { text-align: center; }

@media (min-width: 768px) { .home-intro { padding-left: 12%; padding-right: 12%; }
  .real-content { padding-left: 12%; padding-right: 12%; margin-top: 64px; margin-bottom: 100px; } }
@media (max-width: 768px) { .home-intro { padding-left: 3%; padding-right: 3%; }
  .real-content { padding-left: 3%; padding-right: 3%; margin-top: 64px; margin-bottom: 100px; } }
.navContentBorder { top: -12px; position: relative; border-top: 1px solid; border-top-color: #272727; }

.navHeader { margin-top: 0; margin-bottom: 0; }

.nvcustom { background-color: transparent; display: flex; width: 100%; align-items: center; justify-content: space-between; padding-left: var(--site-margin); padding-right: var(--site-margin); margin: auto; padding-top: 30px; padding-bottom: 30px; box-sizing: border-box; }

#logo { vertical-align: middle; }

.navbar-brand { font-family: var(--font-family); color: var(--font-color); padding: 0; margin: 0; opacity: 1; }
.navbar-brand img { width: 50px; height: 50px; margin-right: 10px; }
.navbar-brand p { line-height: 1.2; }
.navbar-brand .brandTitle { display: inline-block; margin: 0; padding: 0; font-weight: 400; font-size: 1em; color: var(--primary-color); }
.navbar-brand .brandDescription { margin: 0; padding: 0; font-weight: 400; font-size: 0.7em; width: auto; padding-right: 60px; color: var(--secondary-color); }

.navbar-brand:hover { opacity: 0.6; }

.navbar-nav { margin-left: auto; font-family: var(--font-family); font-weight: 300; font-size: 1.1em; }

.fanfic-block ul { margin-top: 8px; list-style-type: square; }

.spin { height: 360px; transition-duration: 0.8s; transition-property: transform; }

.spin:hover { animation-name: rotate; animation-duration: 0.8s; animation-iteration-count: infinite; animation-timing-function: linear; }

@keyframes rotate { from { transform: rotate(0deg); }
  to { transform: rotate(360deg); } }
.normal { margin-top: 3px; margin-bottom: 18px; font-size: 1em; font-weight: normal; }

ul.square { list-style-type: square; }

.pad-bottom { padding-bottom: 50px; }

.title { font-size: 2em; }

.linkBorder { border-bottom: 1px solid; width: 0; transition: width 0.5s ease 0.1s, background-color 0.5s ease 0.1s; }

.navbarLinkText { color: var(--font-color); display: inline-block; }

.navLinkContainer { display: inline-block; padding-top: 0 !important; padding-left: 0 !important; padding-right: 0 !important; padding-bottom: 2px !important; margin: 0.5rem; }

.navLinkContainer:hover .navbarLinkText { color: var(--font-highlight-color); }
.navLinkContainer:hover .linkBorder { border-bottom: 1px solid; width: 100%; transition: width 0.5s ease 0.1s, background-color 0.5s ease 0.1s; }

.dropdown-toggle { color: var(--font-color); padding-bottom: 3px; padding-right: 0 !important; padding-left: 0 !important; padding-top: 0 !important; margin-top: 0.5rem; margin-right: .5rem; margin-left: .5rem; }

.dropdown-toggle::after { color: var(--font-color); }

.dropdown-menu { background-color: var(--dropdown-menu-bg); border: 1px solid var(--dropdown-border-color); }

.dropdown-item { color: var(--font-color); }

.dropdown-item:focus { color: var(--font-color); background-color: var(--dropdown-menu-hover-bg); }

.dropdown-item:hover { color: var(--font-color); background-color: var(--dropdown-menu-hover-bg); }

.selected-dropdown { background-color: var(--dropdown-menu-hover-bg); }

.rehosted { padding-left: 0; padding-right: 0; }

.title-description { display: grid; place-items: center; margin-bottom: 32px; }
.title-description h1 { text-align: center; }
.title-description h4 { text-align: center; }
.title-description h6 { text-align: center; }

.nsfwImg { -webkit-filter: blur(8px); filter: blur(8px); }

.inlineStoryImg { display: block; margin-left: auto; margin-right: auto; max-width: 90vw; max-height: 75vh; }

.navbar-toggler.collapsed { border-color: var(--navbar-collapsed-border-color); }

/* Join styles */
.discord { height: 100px; margin-bottom: 10px; }

.join-page p { font-size: 10px; }

#slideshow { position: relative; width: 100%; height: 100%; }

#slideshow > div { position: absolute; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; }

#slideshow > div img { height: 360px; }