MediaWiki:Fandomdesktop.css


 * root {

--color-alleria: #A53134; --color-alleria--rgb: 165, 49, 52; --color-alleria--hsl: 358, 54%, 42%;

--color-urteania: #F7854E; --color-urteania--rgb: 247, 133, 78; --color-urteania--hsl: 20, 91%, 64%;

--color-deaplenta: #FEE97E; --color-deaplenta--rgb: 254, 233, 126; --color-deaplenta--hsl: 50, 98%, 75%;

--color-easceria: #379E47; --color-easceria--rgb: 55, 158, 71; --color-easceria--hsl: 129, 48%, 42%;

--color-steanera: #48C4DE; --color-steanera--rgb: 72, 196, 222; --color-steanera--hsl: 190, 69%, 58%;

--color-olengten: #5160FF; --color-olengten--rgb: 81, 96, 255; --color-olengten--hsl: 235, 100%, 66%;

--color-farlest: #A43097; --color-farlest--rgb: 164, 48, 151; --color-farlest--hsl: 307, 55%, 42%;

--color-voidalley: #808080; --color-voidalley--rgb: 128, 128, 128; --color-voidalley--hsl: 0, 0%, 50%;

--color-longisle: #DE6197; --color-longisle--rgb: 222, 97, 151; --color-longisle--hsl: 334, 65%, 63%; }

.alst-mainpage-list-header { align-items: center; background-image: linear-gradient(rgba(var(--theme-link-color--rgb), .3), transparent); display: flex; flex-direction: column; font-weight: bold; height: 100px; justify-content: center; margin-bottom: 30px; margin-inline: -36px; width: calc(100% + 36px * 2); }

.alst-mainpage-list-header__title { font-size: 25px; letter-spacing: 1px; }

.alst-mainpage-list-header__subtitle { font-size: 16px; letter-spacing: 1px; opacity: .7 }

.alst-mainpage-list { display: flex; flex-direction: column; gap: 20px; margin-inline: -36px; width: calc(100% + 36px * 2); }

.alst-mainpage-list__item { color: var(--theme-page-text-color); height: 300px; position: relative; width: 100%; }

.alst-mainpage-list__background { height: 100%; width: 100%; z-index: 0; }

.theme-fandomdesktop-light .alst-mainpage-list__background { background-color: white; }

.theme-fandomdesktop-dark .alst-mainpage-list__background { background-color: black; }

.alst-mainpage-list__item--alleria .alst-mainpage-list__foreground { background-color: rgba(var(--color-alleria--rgb), 0.3); }

.alst-mainpage-list__item--urteania .alst-mainpage-list__foreground { background-color: rgba(var(--color-urteania--rgb), 0.3); }

.alst-mainpage-list__item--deaplenta .alst-mainpage-list__foreground { background-color: rgba(var(--color-deaplenta--rgb), 0.3); }

.alst-mainpage-list__item--easceria .alst-mainpage-list__foreground { background-color: rgba(var(--color-easceria--rgb), 0.3); }

.alst-mainpage-list__item--steanera .alst-mainpage-list__foreground { background-color: rgba(var(--color-steanera--rgb), 0.3); }

.alst-mainpage-list__item--olengten .alst-mainpage-list__foreground { background-color: rgba(var(--color-olengten--rgb), 0.3); }

.alst-mainpage-list__item--farlest .alst-mainpage-list__foreground { background-color: rgba(var(--color-farlest--rgb), 0.3); }

.alst-mainpage-list__item--voidalley .alst-mainpage-list__foreground { background-color: rgba(var(--color-voidalley--rgb), 0.3); }

.alst-mainpage-list__item--longisle .alst-mainpage-list__foreground { background-color: rgba(var(--color-longisle--rgb), 0.3); }

.alst-mainpage-list__foreground { height: 100%; overflow: hidden; position: absolute; top: 0; width: 100%; z-index: 1; }

.alst-mainpage-list__background-title { color: var(--theme-page-text-color); font-size: 500px; height: 300px; line-height: 300px; margin-left: -80px; opacity: .03; position: absolute; user-select: none; width: 100%; z-index: -1; }

.alst-mainpage-list__title { line-height: 50px; font-size: 50px; font-weight: bold; letter-spacing: 4px; margin-bottom: 20px; margin-inline: 40px; margin-top: 50px; text-transform: uppercase; }

.alst-mainpage-list__item--alleria .alst-mainpage-list__title, .alst-mainpage-list__item--alleria .alst-mainpage-list__details-label { color: var(--color-alleria); }

.alst-mainpage-list__item--urteania .alst-mainpage-list__title, .alst-mainpage-list__item--urteania .alst-mainpage-list__details-label { color: var(--color-urteania); }

.alst-mainpage-list__item--deaplenta .alst-mainpage-list__title, .alst-mainpage-list__item--deaplenta .alst-mainpage-list__details-label { color: var(--color-deaplenta); }

.alst-mainpage-list__item--easceria .alst-mainpage-list__title, .alst-mainpage-list__item--easceria .alst-mainpage-list__details-label { color: var(--color-easceria); }

.alst-mainpage-list__item--steanera .alst-mainpage-list__title, .alst-mainpage-list__item--steanera .alst-mainpage-list__details-label { color: var(--color-steanera); }

.alst-mainpage-list__item--olengten .alst-mainpage-list__title, .alst-mainpage-list__item--olengten .alst-mainpage-list__details-label { color: var(--color-olengten); }

.alst-mainpage-list__item--farlest .alst-mainpage-list__title, .alst-mainpage-list__item--farlest .alst-mainpage-list__details-label { color: var(--color-farlest); }

.alst-mainpage-list__item--voidalley .alst-mainpage-list__title, .alst-mainpage-list__item--voidalley .alst-mainpage-list__details-label { color: var(--color-voidalley); }

.alst-mainpage-list__item--longisle .alst-mainpage-list__title, .alst-mainpage-list__item--longisle .alst-mainpage-list__details-label { color: var(--color-longisle); }

.alst-mainpage-list__data { display: flex; flex-direction: column; justify-content: space-between; height: calc(100% - 140px); margin-bottom: 20px; margin-inline: 40px; }

.alst-mainpage-list__description { max-width: 50%; }

.alst-mainpage-list__details { display: flex; justify-content: flex-end; font-size: 18px; gap: 8px; }

.alst-mainpage-list__details-label { font-style: italic; font-weight: bold; }

.alst-mainpage-list__details-value { font-style: italic; }

.alst-mainpage-list__details-separator { color: var(--theme-link-color) }

.alst-mainpage-last-words { align-items: center; display: flex; flex-direction: column; height: 80px; justify-content: center; letter-spacing: 1px; }

.page, box-shadow: 0 0 20px 0 rgb(0 0 0 / 5%); }
 * 1) mixed-content-footer {

.rail-module { background: none; }

.page__right-rail { background-color: var(--theme-page-background-color); }

html:not(.ve-activated) .page.has-right-rail .page__right-rail.is-rail-hidden { width: 0; }

html:not(.ve-activated) .page.has-right-rail .page__right-rail:not(.is-rail-hidden):before { content: ""; display: inline-block; width: 1px; background: var(--theme-border-color); height: calc(100% - 60px); position: absolute; top: 30px; }

.page-content h2 { align-items: center; border: none; display: flex; font-size: 19px; gap: 5px; justify-content: flex-start; letter-spacing: 3px; position: relative; text-transform: uppercase; }

.page-content h2 .mw-headline { align-items: center; display: flex; flex-direction: row; gap: 20px; width: 100% }

.page-content h2 .mw-headline:before, .page-content h2 .mw-headline:after { border-radius: 2px; content: ""; display: inline-block; flex: 1; height: 2px; }

.page-content h2 .mw-headline:before { background-image: linear-gradient(90deg, transparent, var(--theme-accent-color)); }

.page-content h2 .mw-headline:after { background-image: linear-gradient(-90deg, transparent, var(--theme-accent-color)); }

.mw-editsection { margin: 0 !important; }

.page-content { overflow-x: visible; }

.alst-mainpage-hero { align-items: center; background-color: black; color: white; display: flex; flex-direction: column; gap: 8px; height: 300px; justify-content: center; letter-spacing: 1px; margin-inline: -36px; width: calc(100% + 36px * 2); }

.alst-mainpage-hero__greeting { font-family: var(--theme-page-headings-font), rubik, helvetica, arial, sans-serif; font-size: 30px; font-weight: bold; }

.alst-mainpage-hero__separator { align-items: center; display: flex; gap: 5px; justify-content: center; width: 100%; }

.alst-mainpage-hero__separator-icon { height: 15px; width: 35px; background: var(--theme-accent-color); clip-path: polygon(30% 0%, 50% 0%, 50% 30%, 35% 30%, 22% 50%, 35% 70%, 65% 70%, 78% 50%, 65% 30%, 50% 30%, 50% 0%, 70% 0%, 100% 50%, 70% 100%, 30% 100%, 0% 50%); }

.alst-mainpage-hero__separator-line { border-radius: 2px; display: block; width: 200px; height: 2px; }

.alst-mainpage-hero__separator-line--left { background-image: linear-gradient(90deg, transparent, var(--theme-accent-color)); }

.alst-mainpage-hero__separator-line--right { background-image: linear-gradient(-90deg, transparent, var(--theme-accent-color)); }

.alst-mainpage-basic { display: flex; justify-content: space-between; margin-top: 10px; }

.alst-mainpage-menu { background-color: var(--theme-page-background-color--secondary); border-radius: 3px; height: 620px; }

.main-page-tag-lcs { flex: 1; }

.main-page-tag-rcs, .rcs-container { width: auto !important; }

.main-page-tag-rcs #top_boxad { padding-left: 36px; }

.alst-mainpage-basic { margin-block: 36px; }

.alst-mainpage-menu { padding: 30px; }

.alst-mainpage-menu__title { border-bottom: 1px solid var(--theme-border-color); color: rgba(var(--theme-page-text-color--rgb), .6); font-size: 35px; font-weight: bold; letter-spacing: 1px; margin-bottom: 20px; text-transform: uppercase; }

.alst-mainpage-menu__list { display: flex; flex-direction: column; gap: 20px; }

.alst-mainpage-menu__list a { text-decoration: none !important; }

.alst-mainpage-menu__item { background-color: var(--theme-link-color); background-image: url("/Special:FilePath/FancyButtonBackground.png"); background-repeat: no-repeat; background-position: center right -30px; border-radius: 3px; color: white; display: flex; flex-direction: column; gap: 5px; height: 90px; padding: 20px; transition: .3s; }

.alst-mainpage-menu__item:hover { background-color: var(--theme-link-color--hover); background-position: center right 0; }

.alst-mainpage-menu__item-title { font-size: 28px; font-weight: bold; letter-spacing: 2px; line-height: 28px; text-transform: uppercase; }

.alst-mainpage-menu__item-desc { line-height: 16px; opacity: .7 }

.territory { background: var(--theme-page-background-color--secondary); border-radius: 10px; margin-top: 20px; min-height: 200px; position: relative; width: 100%; }

.territory .territory__background { height: 200px; width: 100%; }

.territory .territory__background-src { background-position: 50%; background-repeat: no-repeat; background-size: auto 100%; min-height: 220px; overflow: visible; position: relative; transform: translateY(-20px); }

.territory .territory__background-src:after { background-image: linear-gradient(transparent 40%, #00000050); content: ""; display: block; height: 220px; width: 100%; }

.territory .territory__title { border: none; color: white; display: flex; font-weight: bold; justify-content: center; margin: -80px 0 0 0; padding: 0; position: absolute; width: 100%; }

.territory .territory__subtitle { border: none; color: white; display: flex; font-size: 16px; justify-content: center; margin: -40px 0 0 0; padding: 0; position: absolute; width: 100%; }

.territory .territory__title, .territory .territory__subtitle { filter: drop-shadow(0 0 10px var(--theme-link-color)); }

.territory .territory__places-of-interest { margin: 0 20px; border-top: 2px solid var(--theme-border-color); }

.territory .territory__places-of-interest__header { justify-content: center; }

.territory .territory__main-info__list, .territory .territory__places-of-interest__list { display: flex; flex-direction: row; height: 100px; list-style: none; margin: 0; justify-content: center; }

.territory .territory__main-info__list-item, .territory .territory__places-of-interest__list-item { align-items: center; display: flex; flex-direction: column; justify-content: center; width: 100%; }

.territory .territory__main-info__list-item__image img { border-radius: 5px; }

.alst-character-info__territory { display: inline-flex; background-color: #1a1a25; border-radius: 3px; gap: 8px; padding: 5px 10px; }

.alst-character-info__flag img { animation-duration: .4s; animation-timing-function: ease; border-radius: 3px; filter: brightness(.4); }

.alst-character-info__flag.is-selected img { filter: brightness(1); }

.alst-character-info__flag--alleria img { animation-name: anim-character-info__flag--alleria; }

.alst-character-info__flag--urteania img { animation-name: anim-character-info__flag--urteania; }

.alst-character-info__flag--deaplenta img { animation-name: anim-character-info__flag--deaplenta; }

.alst-character-info__flag--easceria img { animation-name: anim-character-info__flag--easceria; }

.alst-character-info__flag--steanera img { animation-name: anim-character-info__flag--steanera; }

.alst-character-info__flag--olengten img { animation-name: anim-character-info__flag--olengten; }

.alst-character-info__flag--farlest img { animation-name: anim-character-info__flag--farlest; }

.alst-character-info__flag--voidalley img { animation-name: anim-character-info__flag--voidalley; }

.alst-character-info__flag--longisle img { animation-name: anim-character-info__flag--longisle; }

@keyframes anim-character-info__flag--alleria { 0% {		filter: brightness(.4); }	5% {		filter: brightness(.4); }

10% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--urteania { 0% {		filter: brightness(.4); }	15% {		filter: brightness(.4); }

20% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--deaplenta { 0% {		filter: brightness(.4); }	25% {		filter: brightness(.4); }

30% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--easceria { 0% {		filter: brightness(.4); }	35% {		filter: brightness(.4); }

40% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--steanera { 0% {		filter: brightness(.4); }	45% {		filter: brightness(.4); }

50% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--olengten { 0% {		filter: brightness(.4); }	55% {		filter: brightness(.4); }

60% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--farlest { 0% {		filter: brightness(.4); }	65% {		filter: brightness(.4); }

70% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--voidalley { 0% {		filter: brightness(.4); }	75% {		filter: brightness(.4); }

80% {		filter: brightness(1); } }

@keyframes anim-character-info__flag--longisle { 0% {		filter: brightness(.4); }	85% {		filter: brightness(.4); }

90% {		filter: brightness(1); } }