MediaWiki:Wikia.css

/***** CSS placed here will be applied to all skins on the entire site. *****/

/* === Imports == */ @import '/load.php?articles=MediaWiki:Themes.css&only=styles&mode=articles'; @import url('//dev.wikia.com/load.php?mode=articles&articles=MediaWiki:Global_Lua_Modules/NavboxBuilder.css&only=styles'); @import url("https://fonts.googleapis.com/css?family=Lato|Bangers|Volkhorn:600");

@font-face { font-family: 'KingdomHearts'; src: url('https://vignette.wikia.nocookie.net/kingdomhearts/images/1/16/Kingdom_Hearts.woff') format('woff'); font-weight: normal; }

/* --- Global variables --- */
 * root {

/* theme colors */ --theme-color: #352e50; /*--secondary-color: #b3c5e2;*/

/* common colors */ --hue-white: rgba(255, 255, 255, 0.7); --hue-black: rgba(20, 20, 20, 0.7); --medium-gray: #d6d6d6; --soft-black: #404040; --soft-white: #f2f2f2; /* management colors */ --type-important: rgba(200, 0, 0, 0.8); --type-moderate: rgba(233, 124, 47, 0.8); --type-minor: rgba(241, 197, 37, 0.8); --type-policy: #2ea85e; --type-guideline: #317ac5; /* this should be used for text over a --theme-color background */ --text-color: rgba(255, 255, 255, 0.9); /* KingdomHearts font */ --theme-font: 'KingdomHearts'; }

/* --- Oasis skin --- */

body.skin-oasis { background-size: 100%; background-size: cover; }

/* --- Kingdom Hearts Admins --- */ /* == Admins == */ a[href="/wiki/User:MechQueste"] { color:#1959a05 !important; font-weight:bold !important; } a[href="/wiki/User:AoifeRising"] { color:#d07fb4 !important; font-weight:bold !important; } /* */ a[href="/wiki/User:RoachTheIntelCollector "] { color:Orange !important; font-weight:bold !important; }

/* --- Style consistency --- */ .container-style, .portal, .documentation, .docparam, .portable-infobox, .navbox, .mbox, .welcome-message, .forumheader, .WikiaArticle pre, .pre-fake, code, .article-thumb { background-color: var(--hue-white); border: 1px solid var(--medium-gray); border-radius: 3px; }

/* --- Portal templates --- */

.portal { width: 100%; padding: 30px; box-sizing: border-box; background-position: center center; background-repeat: no-repeat; background-size: 100%; /* fallback */ background-size: cover; border-radius: 30px; border: none; font-family: roboto, 'helvetica neue', helvetica, sans-serif; font-weight: 400; color: #fff; position: relative; margin-bottom: 15px; text-shadow: 1px 2px 5px #000; }

.portal.welcome { background-size: 100%; background-position: center; font-weight: normal; }

.portal.welcome a { color: rgba(255, 255, 255, 0.8); }

.portal__overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

.portal__overlay { background-color: rgb(113, 105, 146, 0.7); border-radius: 30px; }

.portal.welcome.bg--1 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/1/10/Welcome_background.png/revision/latest/scale-to-width-down/600'); }

.portal a { color: #fff; font-weight: bold; }

.portal.navigation a { font-weight: 400; }

.portal.Kingdom_Hearts, .portal__content .preloader--1 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/4/43/KH1_background.png/revision/latest/scale-to-width-down/400'); background-position: center top; }

.portal.Kingdom_Hearts_II, .portal__content .preloader--2 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/e/e3/KH2_background.png/revision/latest/scale-to-width-down/400'); background-position: center top; }

.portal.Kingdom_Hearts_III, .portal__content .preloader--3 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/d/d8/KH3_background.png/revision/latest/scale-to-width-down/400'); background-position: center top; }

.portal.Spinoffs .portal__content__slide.active { height: 750px; }

.portal__content .preloader { background-repeat: no-repeat; background-position: 1px 1px; }

.portal__wrapper { position: relative; z-index: 1; }

.portal__wrapper span { display: block; text-align: center; }

display: flex; flex-wrap: wrap; justify-content: center; }
 * 1) hub span {

.portal__header { font-size: 25px; font-weight: 700; }

.portal.welcome .portal__header { position: absolute; bottom: 0; right: 0; font-size: 13px; }

.portal.welcome .portal__header:before { content: '(';   display: inline; }

.portal.welcome .portal__header:after { content: ')';   display: inline; }

.portal__content__aux { display: inline-block; position: relative; width: calc(100% / 3); height: auto; margin: 70px 0 70px 0; }

.portal__content__aux:hover img { filter: drop-shadow(1px 1px 5px #fff); }

.portal__content__aux a { cursor: pointer; }

.portal__content__slide { opacity: 0; height: 0; overflow: hidden; transition: opacity .3s ease-in; }

.portal__content__slide.active { opacity: 1; height: 500px; }

span.portal__content__slide__content__header { text-align: left; }

.portal__content__navigator { position: absolute; right: -20px; bottom: 0px; user-select: none; line-height: 0; }

.portal__content__navigator span { display: inline-block; cursor: pointer; color: rgba(255, 255, 255, 0.8); transition: all .15s ease-in; }

.portal__content__navigator .previous, .portal__content__navigator .next { font-size: 85px; font-family: monospace; transform: scale(1, .7); }

.portal__content__navigator .index { position: relative; top: -16px; font-weight: bold; text-transform: uppercase; }

.portal__content__navigator span:hover { color: #fff; text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.4) }

.portal__content__textlink { font-size: 140%; }

.portal__content__slide__image { display: table; float: left; height: 100%; margin-right: 50px; filter: drop-shadow(1px 1px 5px #fff); }

.portal__content__slide__image a { display: table-cell; height: 100%; vertical-align: middle; }

.portal__content__slide__content { column-count: 3; column-fill: auto; height: 90%; margin: 10px 0; }

.portal__content__slide__content__header { font-weight: bold; }

.portal__content__slide__content ul { list-style: none; margin: 0; margin-bottom: 65px; }

.portal__content__category__icon { width: 100px; height: 100px; background-position: center; background-repeat: no-repeat; background-size: 90%; transition: all .15s ease-in; margin: auto; position: relative; filter: brightness(200%); }

.portal__content__category__icon:hover { filter: drop-shadow(1px 1px 5px #fff); }

.portal__content__category__overlay { background-color: rgba(0, 128, 0, 0.4); position: absolute; top: 0; right: 0; bottom: 0; left: 0; }

.portal.help { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/a/a0/Helping_out_background.jpg/revision/latest/scale-to-width-down/400'); }

.portal.fa { min-height: 330px; background-size: 100%; background-position: center; }

.portal.fa.option--1 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/d/d0/Rapunzel_with_Sora_KHIII.jpg/revision/latest/scale-to-width-down/800'); background-position: center top; }

.portal.fa.option--2 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/5/58/Heartless_featured_article_image.jpg/revision/latest/scale-to-width-down/800'); }

.portal.fa.option--3 { background-image: url('//vignette.wikia.nocookie.net/kingdomhearts/images/0/09/Organization_XIII_featured_article_image.png/revision/latest/scale-to-width-down/800'); }

.portal.fa .option { display: none; }

.portal.fa.option--1 .option.option--1, .portal.fa.option--2 .option.option--2, .portal.fa.option--3 .option.option--3 { display: block; }

.portal.fa:before, .portal.fa:after { height: 130px; }

.portal.fa .portal__content { position: relative; height: 245px; }

.portal.fa span { text-align: right; }

.portal__content__excerpt { text-align: right; position: absolute; bottom: 0; right: 0; }

.portal__content__excerpt__header { font-size: 27px; margin-bottom: 12px; }

.portal__content__excerpt__content { width: 90%; float: right; }

.portal__content__affiliates { /* overflow-y: scroll; overflow-x: hidden; height: 190px; */ margin-top: 10px; }

.portal__content__affiliates img { width: 100%; height: auto; }

/* Mark redirects in Special:Allpages and Special:Watchlist */ .allpagesredirect { font-style: italic; } .watchlistredir { font-style: italic; }

/* --- Portable Infoboxes --- */

.portable-infobox { width: 340px; border-radius: 10px; margin: 10px; background: transparent; color: black; }

.portable-infobox .pi-title, .portable-infobox .pi-header { padding: 4px; margin-bottom: 2px; font-weight: bold; text-align: center; }

.portable-infobox .pi-header a { color: black !important; }

.portable-infobox .pi-title { text-align: center; font-size: 150%; border-top-left-radius: 7px; border-top-right-radius: 7px; }

.portable-infobox .pi-title small { font-size: 70%; }

.portable-infobox .pi-item-spacing { padding: 1px 2px; }

.portable-infobox .pi-navigation { text-align: center; }

.portable-infobox .pi-data { border-bottom: none; }

.portable-infobox .pi-data-label { padding: 2px 5px; width: 35%; font-weight: bold; }

.portable-infobox .pi-data-value { padding:2px 5px; }

.pi-data .pi-data-value:only-child { width: 100%; text-align: center; background: transparent !important; }

.pi-data .pi-data-value:not(:first-child) { flex-basis: 220px; padding-left: 10px; }

.pi-smart-data-value { flex-basis: auto !important; } .portable-infobox .pi-section-navigation { display: flex; border-top: 1px solid #AAA; padding: 7px 0; text-align: center; justify-content: space-evenly; flex-flow: row wrap; }

.portable-infobox .pi-section-tab { cursor: pointer; margin: 0 !important; }

.portable-infobox .pi-section-tab.pi-section-active { box-shadow: 0 !important; }

.portable-infobox .pi-section-tab.pi-section-active:hover { box-shadow: 0 !important; }

.portable-infobox .pi-section-label { color: #777; font-weight: normal; height: 1.5em; text-transform: unset !important; }

.portable-infobox .pi-section-active .pi-section-label { color: #000; font-weight: bold; }

.portable-infobox .pi-group[data-item-name="objectives"] .pi-data-label { flex-basis: 220px; }

.portable-infobox .pi-group[data-item-name="objectives proud"] .pi-data-label { flex-basis: 220px; } ul.pi-image-collection-tabs { display: flex; flex-wrap: wrap; line-height: 2; width: calc(100% + 3px); margin-left: -1px; border-bottom: 1px solid #AAA; }

.pi-image-collection-tab-content { background: transparent; } ul.pi-image-collection-tabs li { flex-grow: 1; border: 1px solid #AAA; border-top: none; min-width: calc((100% / 4) + 1px); } .max-2 ul.pi-image-collection-tabs li { min-width: calc((100% / 2) + 1px); } .max-3 ul.pi-image-collection-tabs li { min-width: calc((100% / 3) + 1px); } .max-4 ul.pi-image-collection-tabs li { min-width: calc((100% / 4) + 1px); } .max-5 ul.pi-image-collection-tabs li { min-width: calc((100% / 5) + 1px); } .max-6 ul.pi-image-collection-tabs li { min-width: calc((100% / 6) + 1px); } .max-all ul.pi-image-collection-tabs li { flex-grow: 1; }

/* Portable Infobox multi types */ .portable-infobox.type-multi { background: transparent; width: 100%; float: none; clear: none; margin: auto; display: flex; flex-flow: row wrap; justify-content: space-around; align-items: flex-start; align-content: space-around; } .type-multi .pi-panel { /*max-width: 350px; min-width: 250px;*/ width: 325px; background-color: #FFF; padding: 5px; }

/* --- Navboxes --- */

.navbox { font-size: .83em; line-height: 23px; overflow: hidden; background-color: #FFF; border-radius: 10px; } .navbox .navbox-title { align-items: center; display: flex; justify-content: center; padding: 4px; margin: 2px; border-radius: 10px; } .navbox .navbox-title-text { line-height: 26px; font-weight: 700; } .navbox-title-text a { color: inherit !important; }

.navbox-template-links a { color: black !important; } .navbox:not(.left):not(.right) .navbox-title-text { font-size: 24px; } .navbox .navbox-template-links { top: 4px; } .navbox .navbox-group { text-align: center; vertical-align: middle; border: 1px solid #AAA; border-bottom-color: #FFF; white-space: normal; } .navbox-table-layout .navbox-group { width: 15%; } .navbox .navbox-subgroup { width: 15%; white-space: normal; vertical-align: middle; text-align: center; } .navbox-table { border-collapse: collapse; } .navbox-table .navbox-padding { padding: 10px; } .navbox-table .navbox-list { border: 1px solid #AAA; vertical-align: middle; } .navbox.left { clear: left; float: left; margin: 0 1.5em 0.5em 0; } .navbox.right { clear: right; float: right; margin: 0 0 0.5em 1.5em; } .navbox-image { border: 1px solid transparent; } .navbox-content { padding: 0 2px 3px 2px !important; } .navbox-above, .navbox-base { border-bottom: 1px solid #AAA; padding: 4px !important; } .navbox-above { position: relative; /* double-border bug-fix */ } .navbox > .navbox-table-wrapper:first-child, .navbox-section > .navbox-table-wrapper:first-child { margin-top: -6px; } .navbox-content ul { list-style: none !important; margin: 0; padding: 0; } .navbox-list.\32-columns ul, .navbox-list.\33-columns ul, .navbox-list.\34-columns ul, .navbox-list.\35-columns ul { column-rule: 4px double #aaa; list-style-type: none; margin: 0; } .navbox-list.\32-columns ul { column-count: 2; } .navbox-list.\33-columns ul { column-count: 3; } .navbox-list.\34-columns ul { column-count: 4; } .navbox-list.\35-columns ul { column-count: 5; } .navbox-list.\32-columns ul li, .navbox-list.\33-columns ul li, .navbox-list.\34-columns ul li, .navbox-list.\35-columns ul li { margin: 0; }

/* --- Tables and layouts --- */

.center-images img { text-align: center; }

table.article-table { border: 1px solid var(--medium-gray); font-size: 12px; border-collapse: separate; border-spacing: 2px; border-radius: 10px; } table.article-table tr td, table.article-table tr th { padding: 2px 6px; border: 1px solid var(--medium-gray); } table.article-table tr th { text-align: center; background: none; } table.article-table ul, table.article-table ol { margin: 0 0 0 1.5em; }

/* Scrollable tables */ table.scrollable-active thead { display: block; overflow: auto; } table.scrollable-active tbody { display: block; height: 400px; overflow: auto; }

/* Table styling, thins border */ .wikitable {border-collapse:collapse;} /* Recent changes byte indicators */ .mw-plusminus-pos { color: #006500; } .mw-plusminus-neg { color: #8B0000; } /* rounded corners */ .rtop, .rbottom { display: block; padding: 0px; margin: 0px } .rtop *, .rbottom * { display: block; height: 1px; overflow: hidden; padding: 0px } .r1 {margin: 0 5px} .r2 {margin: 0 3px} .r3 {margin: 0 2px} .r4 {margin: 0 1px; height: 2px} /* end rounded corners */

/* To remove external link arrows */

a.external:after { display: none !important; } /* Prevent scrollbox behavior when there are mulitple editintro templates. */ .editpage-intro > .editpage-intro-wrapper { max-height: 100%; }

/* To remove external link arrows */ a.external:after { display: none !important; }

/* --- Galleries --- */

.wikia-gallery .wikia-photogallery-add { display: none !important; }

/* --- Documentation template --- */ .documentation { overflow: hidden; } .documentation__header, .documentation__footer { padding: 0 10px; box-sizing: border-box; line-height: 40px; background-color: var(--soft-white); } .documentation__header { border-bottom: 1px solid var(--medium-gray); } .documentation__footer { border-top: 1px solid var(--medium-gray); font-size: 85%; text-align: right; clear: both; } .documentation__header__headline { font-weight: bold; } .documentation__header__action-links { float: right; font-size: 85%; } .documentation__content { padding: 10px 20px; box-sizing: border-box; } .documentation__content #toc { margin-top: 0 !important; margin-bottom: 6px !important; } /* Documentation parameters (Template:Docparam) */ .docparam { overflow: hidden; margin-bottom: 10px; } .docparam__header { border-bottom: 1px solid var(--medium-gray); background-color: var(--soft-white); padding: 0 5px; box-sizing: border-box; } .docparam__header__icon { display: inline-block; } .docparam__header__name { display: inline-block; position: relative; top: 2px; } .docparam__header__default { float: right; line-height: 34px; font-size: 12px; color: var(--soft-black); } .docparam__description { padding: 10px; box-sizing: border-box; } /* --- Message boxes (Template:Mbox) --- */ .mbox { display: flex; position: relative; background-color: rgba(255, 255, 255, 0.7); border: 1px solid #d6d6d6; border-left-width: 8px; border-left-color: #d6d6d6; border-radius: 3px; margin-bottom: 5px; } .mbox__content { display: table; box-sizing: border-box; width: 100%; padding: 8px 15px; } .mbox__content__image { display: table-cell; width: 40px; height: 100%; text-align: center; vertical-align: middle; padding-right: 15px; } .mbox__content__wrapper { display: table-cell; vertical-align: middle; } .filepage-table .mbox__content__wrapper { padding: 8px 15px; } .mbox__content__header { display: block; font-weight: bold; } .mbox__content__text { display: block; } .mbox__content__text__comment { font-size: small; } .mbox__content__aside { display: table-cell; width: 100px; vertical-align: middle; text-align: center; padding-left: 15px; border-left: 1px solid #d6d6d6; } .mbox__close { position: absolute; right: 0; top: 0; padding: 2px 7px; font-weight: bold; font-size: 16px; color: #bbb; cursor: pointer; transition: all .15s ease-in; } .mbox__close:hover { color: #777; } .mbox__close:after { content: '×'; } .mw-collapsed + .mbox__close { transform: rotate(45deg); padding: 4px 7px 5px 2px; } /****Ambox*****/ /* */ /* === Template:Ambox designs === */ /* Ambox design */ .ambox { font-size: 95%; width: 80%; margin: 0 auto; border: 1px #AAA solid; border-left: 10px solid #228b22; border-collapse: collapse; background-color: #EEE; } /* Ambox colours */ .ambox-blue { border-left: 10px solid #1e90ff;   /* Blue (notice) */ } .ambox-red { border-left: 10px solid #b22222;   /* Red (delete/serious) */ } .ambox-orange { border-left: 10px solid #f28500;   /* Orange (content) */ } .ambox-yellow { border-left: 10px solid #f4c430;   /* Yellow (style) */ } .ambox-purple { border-left: 10px solid #9932cc;   /* Purple (merge) */ } .ambox-gray { border-left: 10px solid #bba;       /* Gray (protection) */ } .ambox-green { border-left: 10px solid #228b22;   /* Green */ } /* Ambox small text */ .ambox-smalltext { font-size: smaller; margin-top:0.5em; margin-left:0.8em; } /* Ambox image */ .ambox-image {                   /* The left image cell */ width: 60px; padding: 2px 0px 2px 0.5em;       /* 0.5em left, 0px right */ text-align: center; } @media print { .ambox { display: none; } }   /* no ambox when printing */ /* /* --- Module:Context-link --- */ .context-link { padding-left: 25px; font-style: italic; color: #777; } /* --- Pull quotes (Template:Quote) --- */


 * root {

--pull-quote-max-width: 80%; --pull-quote-text-color: rgba(0, 0, 0, .8); --pull-quote-mark-color: rgba(0, 0, 0, .15); --pull-quote-mark-font: "Times New Roman", serif; --pull-quote-hyphens: auto; --pull-quote-frame-color: #bbb; }

.WikiaPage .pull-quote { display: flex; flex-direction: column; align-items: center; max-width: var(--pull-quote-max-width); margin: 1em auto; font-size: 1em; line-height: 1.8; } .WikiaPage .pull-quote__text { position: relative; padding: 0 2em; hyphens: var(--pull-quote-hyphens); color: var(--pull-quote-text-color); margin-bottom: 1em; } .WikiaPage .pull-quote__text::before, .WikiaPage .pull-quote__text::after { position: absolute; font-size: 3em; font-family: var(--pull-quote-mark-font); font-weight: 700; color: var(--pull-quote-mark-color); } .WikiaPage .pull-quote__text::before { content: "“"; top: 0; left: 0; line-height: 1; } .WikiaPage .pull-quote__text::after { content: "”"; bottom: 0; right: 0; line-height: 0.2; } .WikiaPage .pull-quote__source { text-align: right; } .WikiaPage .pull-quote--right, .WikiaPage .pull-quote--left { border: 1px solid var(--pull-quote-frame-color); border-left: 0; border-right: 0; padding: 1em 0; text-align: justify; } .WikiaPage .pull-quote--right { float: right; margin: 1em 0 1em 2em; } .WikiaPage .pull-quote--left { float: left; margin: 1em 2em 1em 0; } /* Small references */ .references-small { font-size: 0.85em; } /* acronym class for hidden text/dragon traslations*/ acronym.hidden { border-bottom:1px dotted #ffffff; cursor:help;} /* hidden text variant*/ span.caption {	display:inline; font-weight: normal; border-bottom:1px dotted #ffffff; text-decoration:none; text-align:left; color: #FFFFFF; padding: 0px; margin: 0px 0px 0px 0px; background: none; } span.caption span {	display:none; } span.caption:hover {	color: #ffffff; border-bottom: 1px solid #ffffff; text-decoration:none; background: #c19a6b; cursor: help; } span.caption:hover span { 		margin: 30px 0px 0px -20px; display:inline; position:absolute; font-weight: normal; font-style: normal; text-align:left; padding: 2px 4px 2px 4px; border:1px solid #000000; background: #FAEBD7; color:#222222; text-decoration:none; font-size: 11px; font-family: Tahoma; line-height: 13px; } /* Adjust size of references in infoboxes and succession boxes - deprecates Template:Ref */ div.info-box .reference, div.infobox .reference,         /* infoboxes */ .refadjust .reference {         /* succession boxes, anything else which has class="refadjust" */ font-size: 7.5px; line-height: 1.5; font-weight: normal; }

/* Recent changes byte indicators */ .mw-plusminus-pos { color: #006500; } .mw-plusminus-neg { color: #8B0000; } /* */

/* Forum formatting -Algorithm & -Splaka */ .forumheader { border: 1px solid #aaa; background-color: #f9f9f9; margin-top: 1em; padding: 12px; } .forumlist td.forum_edited a { color: black; text-decoration: none } .forumlist td.forum_title a { padding-left: 20px; } .forumlist td.forum_title a.forum_new { font-weight: bold; background: url(/images/4/4e/Wiki.png) center left no-repeat; padding-left: 20px; } .forumlist td.forum_title a.forum_new:visited { font-weight: normal; background: none; padding-left: 20px; } .forumlist th.forum_title { padding-left: 20px; }

/* Force no floating */ .no_float * { float:none !important; }

/* Default table stuff */

table { background:inherit; color:inherit; } table.force_width img { max-width:100%; height:auto; }

display:none!important; visibility:hidden !important; } display:block !important; text-align:right; margin-left:1em; min-width:250px; right:-310px !important; top:-140px !important; }
 * 1) title-gameicons {
 * 1) title-linktabs {

/* --- Headers --- */ .kh-header { font-family: KingdomHearts; color: #CCA95F; font-size: 200%; line-height: 38px; }

/* --- Scrollbox --- */ .scrollbox { overflow: auto; border: 1px solid #AAA; }