MediaWiki:Common.css

@import url("/load.php?mode=articles&only=styles&articles=u:dev:MediaWiki:ThemeColorClasses.css|u:dev:MediaWiki:FontAwesome.css");

/* VSTF/Wikia Staff Custom Link */ a[href$='Avatar'] {color:pink; font-weight:bold;} a[href$='BertH'] {color:pink; font-weight:bold;} a[href$='Icier'] {color:pink; font-weight:bold;} a[href$='Jr_Mime'] {color:pink; font-weight:bold;} a[href$='Kirkburn'] {color:pink; font-weight:bold;} a[href$='Merrystar'] {color:pink; font-weight:bold;} a[href$='Noreplyz'] {color:pink; font-weight:bold;} a[href$='Rappy_4187'] {color:pink; font-weight:bold;} a[href$='Sannse'] {color:pink; font-weight:bold;} a[href$='Semanticdrifter'] {color:pink; font-weight:bold;} a[href$='TheGoldenPatrik1'] {color:pink; font-weight:bold;} a[href$='TyA'] {color:pink; font-weight:bold;} a[href$='VegaDark'] {color:pink; font-weight:bold;}

/*Custom fonts*/ @font-face { font-family: 'Cookie Run Regular'; src: url('/wiki/Special:FilePath/CookieRun_Regular.woff2') format('woff2'); font-style: normal; font-weight: normal; }

@font-face { font-family: 'Cookie Run Bold'; src: url('/wiki/Special:FilePath/CookieRun_Bold.woff2') format('woff2'); font-style: normal; font-weight: bold; }

@font-face { font-family: 'Cookie Run Black'; src: url('/wiki/Special:FilePath/CookieRun_Black.woff2') format('woff2'); font-style: normal; font-weight: bold; }

.fandom-community-header__community-name, h1, .page-content h1, h2, .page-content h2, .page-content .portable-infobox .pi-data-label, .page-content h3, .page-content h4, .page-content h5, header, .header, .portable-infobox h2.pi-title, .portable-infobox h2.pi-header, .portable-infobox .wds-tabs__tab, .recent-wiki-activity__page-title, .fandom-sticky-header__sitename, .fandom-community-header__local-navigation, th { font-family: Cookie Run Regular, rubik, helvetica, arial, sans-serif; }

/* Message box styling */ .mbox a:link { color:#7B5536; } .mbox a:visited { color:#7B5536; } .mbox a:hover { color:#B87957; text-decoration:underline; } .mbox a:active { color:#B87957; text-decoration:underline; }

.mbox__content__text { font-size:14px; line-height:1.90; }

/* For header images */ .fluidimg100 img { max-width:100%; height:auto; overflow:hidden; margin:auto; }

.iconcontainerimg img { position: absolute; top: 54%; left: 50%; transform: translate(-50%, -50%); height: 155px; width: auto; image-rendering: optimizequality; }

/* User masthead */ .UserProfileMasthead .masthead-info { background: #ffffff url ('https://vignette.wikia.nocookie.net/cookierun/images/7/7d/Brave_Cookie_CSS.png') no-repeat bottom right; overflow:hidden; }

/* === 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 */

/* Navbox styling */ table.navbox { border: 4px solid #412F27; border-radius: 7px; clear: both; color: white; font-size: 90%; margin: 5px auto auto; text-align: left; width: 100%; } table.navbox + table.navbox { margin-top: -1px; } .navbox, .navbox-subgroup { background: #dcccbc; } .navbox-title { background:#73664c; border: 1px solid #290B18; font-size: 125%; padding-top:1em; padding-bottom:1em; padding-left: 1em; padding-right: 1em; text-align: center; color: #290B18; }

.navbox-title a { color: white; }

.navbox-list a { color: #553E9F; } .navbox-group { background: #947B62; border: 1px solid #290B18; border-top: 0px solid #290B18; font-weight: bold; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; color: #ffffff; } .navbox .navbox-group a { white-space: normal; } .navbox-list { border-bottom: 1px solid #290B18; border-right: 1px solid #290B18; padding-bottom: 5px; padding-left: 7px; padding-right: 7px; background: #dfd1c3; color: #290B18; } .navbox-subgroup .navbox-title { background: #b19984; } .navbox-subgroup .navbox-group { background: #b19984; border-bottom: 1px solid #290B18; border-right: 1px solid #290B18; border-left-width: 0px; padding-bottom: 5px; } .navbox-subgroup .navbox-group a { white-space: normal; } .navbox-subgroup .navbox-list { background: #dfd1c3; border-bottom: 1px solid #290B18; border-right: 1px solid #290B18; } @media print { .navbox { display: none; } }

/* Rounded Userpage avatar */ .UserProfileMasthead .masthead-avatar { border: none; background: none; padding: 0; } .UserProfileMasthead .masthead-avatar .avatar { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; border: none; }

/*removes name highlights on account nav and userpage tabs*/ .WikiaActivityModule.module, .HotSpotsModule.module, .FollowedPagesModule.module { background: url(https://vignette.wikia.nocookie.net/cookierun/images/7/7d/Brave_Cookie_CSS.png/revision/latest?cb=20150813191422) no-repeat right bottom; }

/*Infobox color set for A-grade, Special, Currency (Yellow)*/ .pi-theme-A .pi-item { background-color: #ffed9a; }

.pi-theme-A .pi-secondary-background { background-color: #ffcb62; } .pi-theme-A .pi-border-color { border-color: #ffe047; }

.pi-theme-APW .pi-item { background-color: #ffed9a; }

.pi-theme-APW .pi-secondary-background { background-color: #ffcb62; } .pi-theme-APW .pi-border-color { border-color: #ffe047; }

.pi-theme-Special .pi-item { background-color: #ffed9a; }

.pi-theme-Special .pi-title { background-color: #ffcb62; }

.pi-theme-Special .pi-secondary-background { background-color: #ffcb62; }

.pi-theme-Special .pi-image-collection-tabs { background-color: #ffed9a; }

.pi-theme-Special .pi-tab-link.pi-item-spacing.current { background-color: #ffd47e; }

.pi-theme-Special .pi-tab-link.pi-item-spacing { background-color: #ffd47e99; } .pi-theme-Special .pi-border-color { border-color: #ffe047; }

.pi-theme-LegendaryC .pi-item { background-color: #ffed9a; }

.pi-theme-LegendaryC .pi-secondary-background { background-color: #ffcb62; } .pi-theme-LegendaryC .pi-border-color { border-color: #ffe047; }

/*Infobox color set for B-grade, Rare, World/Episodes (Blue)*/ .pi-theme-B .pi-item { background-color: #c6e3ed; }

.pi-theme-B .pi-secondary-background { background-color: #92c5e7; }

.pi-theme-B .pi-border-color { border-color: #68afde; }

.pi-theme-BPW .pi-item { background-color: #c6e3ed; }

.pi-theme-BPW .pi-secondary-background { background-color: #92c5e7; }

.pi-theme-BPW .pi-border-color { border-color: #68afde; }

.pi-theme-Rare .pi-item { background-color: #c6e3ed; }

.pi-theme-Rare .pi-title { background-color: #92c5e7; }

.pi-theme-Rare .pi-secondary-background { background-color: #92c5e7; }

.pi-theme-Rare .pi-image-collection-tabs { background-color: #c6e3ed; }

.pi-theme-Rare .pi-tab-link.pi-item-spacing.current { background-color: #9fcae6; }

.pi-theme-Rare .pi-tab-link.pi-item-spacing { background-color: #9fcae699; }

.pi-theme-Rare .pi-border-color { border-color: #68afde; }

/*Infobox color set for C-grade, Common, Game (Grey/Silver)*/ .pi-theme-C .pi-item { background-color: #dedede; }

.pi-theme-C .pi-secondary-background { background-color: #a8a7a8; }

.pi-theme-C .pi-border-color { border-color: #a8a7a8; }

.pi-theme-CPW .pi-item { background-color: #dedede; }

.pi-theme-CPW .pi-secondary-background { background-color: #a8a7a8; }

.pi-theme-CPW .pi-border-color { border-color: #a8a7a8; }

.pi-theme-Common .pi-item { background-color: #dedede; }

.pi-theme-Common .pi-title { background-color: #a8a7a8; }

.pi-theme-Common .pi-secondary-background { background-color: #a8a7a8; }

.pi-theme-Common .pi-image-collection-tabs { background-color: #dedede; }

.pi-theme-Common .pi-tab-link.pi-item-spacing.current { background-color: #bfbebf; }

.pi-theme-Common .pi-tab-link.pi-item-spacing { background-color: #bfbebf99; }

.pi-theme-Common .pi-border-color { border-color: #a8a7a8; }

.pi-theme-OBC .pi-item { background-color: #d5b89a; }

.pi-theme-OBC .pi-secondary-background { background-color: #7e561d; color:white; }

.pi-theme-OBC .pi-border-color { border-color: #8a5f20; }

.pi-theme-PWC .pi-item { background-color: #e5c89d; }

.pi-theme-PWC .pi-secondary-background { background-color: #a45428; color:white; }

.pi-theme-PWC .pi-border-color { border-color: #c66f3f; }

.pi-theme-Normal .pi-item { background-color: #dedede; }

.pi-theme-Normal .pi-title { background-color: #a8a7a8; }

.pi-theme-Normal .pi-secondary-background { background-color: #a8a7a8; }

.pi-theme-Normal .pi-image-collection-tabs { background-color: #dedede; }

.pi-theme-Normal .pi-tab-link.pi-item-spacing.current { background-color: #bfbebf; }

.pi-theme-Normal .pi-tab-link.pi-item-spacing { background-color: #bfbebf99; }

.pi-theme-Normal .pi-border-color { border-color: #a8a7a8; }

/*Infobox color set for E-grade, Player Stats, Events (Green)*/ .pi-theme-E .pi-item { background-color: #cafeb9; }

.pi-theme-E .pi-secondary-background { background-color: #98c488; }

.pi-theme-E .pi-border-color { border-color: #6dab55; }

/*Infobox color set for S-grade, Mythic, (Aqua/Pink)*/ .pi-theme-S .pi-item { background-color: #f4bfff; }

.pi-theme-S .pi-secondary-background { background-color: #e0f689; }

.pi-theme-S .pi-border-color { border-color: #0fe9fc; }

.pi-theme-Mythic .pi-item { background-color: #f4bfff; }

.pi-theme-Mythic .pi-secondary-background { background-color: #e0f689; }

.pi-theme-Mythic .pi-border-color { border-color: #0fe9fc; }

/*Infobox color set for Epic (Purple)*/

.pi-theme-Epic .pi-item { background-color: #d1a8e4; }

.pi-theme-Epic .pi-title { background-color: #a773dc; }

.pi-theme-Epic .pi-secondary-background { background-color: #a773dc; }

.pi-theme-Epic .pi-image-collection-tabs { background-color: #d1a8e4; }

.pi-theme-Epic .pi-tab-link.pi-item-spacing.current { background-color: #b286de; }

.pi-theme-Epic .pi-tab-link.pi-item-spacing { background-color: #b286de99; }

.pi-theme-Epic .pi-border-color { border-color: #500787; }

.pi-theme-Epic a { color: #500787; }

.pi-theme-Epic a:hover { color: #500787; }

.pi-theme-Hard .pi-item { background-color: #d1a8e4; }

.pi-theme-Hard .pi-title { background-color: #a773dc; }

.pi-theme-Hard .pi-secondary-background { background-color: #a773dc; }

.pi-theme-Hard .pi-image-collection-tabs { background-color: #d1a8e4; }

.pi-theme-Hard .pi-tab-link.pi-item-spacing.current { background-color: #b286de; }

.pi-theme-Hard .pi-tab-link.pi-item-spacing { background-color: #b286de99; }

.pi-theme-Hard .pi-border-color { border-color: #500787; }

.pi-theme-Hard a { color: #500787; }

.pi-theme-Hard a:hover { color: #500787; }

/*Infobox color set for L and SS grade, Mythic (Red)*/ .pi-theme-L .pi-item { background-color: #f8adc2; }

.pi-theme-L .pi-secondary-background { background-color: #b72929; color:white; }

.pi-theme-L .pi-border-color { border-color: #c40404; }

.pi-theme-LPW .pi-item { background-color: #f8adc2; }

.pi-theme-LPW .pi-secondary-background { background-color: #b72929; color:white; }

.pi-theme-LPW .pi-border-color { border-color: #c40404; }

.pi-theme-EpicK .pi-item { background-color: #f8adc2; }

.pi-theme-EpicK .pi-secondary-background { background-color: #b72929; color:white; }

.pi-theme-EpicK .pi-border-color { border-color: #c40404; }

.pi-theme-SS .pi-item { background-color: #f8adc2; }

.pi-theme-SS .pi-secondary-background { background-color: #b72929; color:white; }

.pi-theme-SS .pi-border-color { border-color: #c40404; }

.pi-theme-Legendary .pi-item { background-color: #c4e6d6; }

.pi-theme-Legendary .pi-secondary-background { background-color: #099c7b; color:white; }

.pi-theme-Legendary .pi-border-color { border-color: #00463e; }

.pi-theme-SS .pi-item { background-color: #f8adc2; }

.pi-theme-SuperEpic .pi-item { background-color: #f8adc2; }

.pi-theme-SuperEpic .pi-title { background-color: #b72929; color:white; }

.pi-theme-SuperEpic .pi-secondary-background { background-color: #b72929; color:white; }

.pi-theme-SuperEpic .pi-image-collection-tabs { background-color: #f8adc2; }

.pi-theme-SuperEpic .pi-tab-link.pi-item-spacing.current { background-color: #d15454; }

.pi-theme-SuperEpic .pi-tab-link.pi-item-spacing { background-color: #d1545499; }

.pi-theme-SuperEpic .pi-border-color { border-color: #c40404; }

.pi-theme-PWL .pi-item { background-color: #afdccc; }

.pi-theme-PWL .pi-secondary-background { background-color: #1b946c; color:white; }

.pi-theme-PWL .pi-border-color { border-color: #18ad7c; }

/*Infobox color set for Company (White)*/ .pi-theme-white .pi-item { background-color: #ffffff; }

.pi-theme-white .pi-secondary-background { background-color: #cccccc; }

.pi-theme-white .pi-border-color { border-color: #959595; }

/*Infobox color set for NPCs*/ .pi-theme-NPC .pi-item { background-color: #838eb4; }

.pi-theme-NPC .pi-secondary-background { background-color: #233269; color:white; }

.pi-theme-NPC .pi-border-color { border-color: #0f1d47; }

/* Adds an outline to infobox titles and headers */ .pi-title { text-shadow:1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,0px 1px 0 #290B18,0px -1px 0 #290B18,-1px 0px 0 #290B18,1px 0px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,0px 1px 0 #290B18,0px -1px 0 #290B18,-1px 0px 0 #290B18,1px 0px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18; }

.pi-header { text-shadow:1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,0px 1px 0 #290B18,0px -1px 0 #290B18,-1px 0px 0 #290B18,1px 0px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,0px 1px 0 #290B18,0px -1px 0 #290B18,-1px 0px 0 #290B18,1px 0px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18,1px 1px 0 #290B18,-1px 1px 0 #290B18,1px -1px 0 #290B18,-1px -1px 0 #290B18; }

/* For header images */ .fluidimg100 img { max-width:100%; height:auto; overflow:hidden; margin:auto; }

/* For relay icon */ .relayicon img { max-width:100%; height:auto; overflow:hidden; } .relayicon div { max-width:100%; height:auto; overflow:hidden; }

/*Slider "read more" link color correction */ .fandom-slider__nav__caption a:link { color:#dcac79; } .fandom-slider__nav__caption a:visited { color:#dcac79; } .fandom-slider__nav__caption a:hover { color:#f1dec9; text-decoration:underline; } .fandom-slider__nav__caption a:active { color:#f1dec9; text-decoration:underline; }

/* Class that forces links to be light mode-styled */

.lightlink a:link { color:#805236; }

.lightlink a:visited { color:#805236; }

.lightlink a:hover { color:#382417; text-decoration:underline; }

.lightlink a:active { color:#382417; text-decoration:underline; }

/* Tabber settings */ .tabbertab { border: none !important; border-top: none !important; }

ul.tabbernav { border-bottom: none !important; }

ul.tabbernav li a { background: #f9ecc3; }

ul.tabbernav li a:hover { background: #ccb47e; }

ul.tabbernav li a:link { color: #9e7b39; }

ul.pi-image-collection-tabs li { border: none; max-width: 100%; }

/* Multiple columns for a bulleted lists */ .twoColumns { -moz-column-count:2; -webkit-column-count:2; column-count:2; }

.threeColumns { -moz-column-count:3; -webkit-column-count:3; column-count:3; }

/* Trying to align the featured icon to the page title */ .page-header__contribution #header-icons { display: inline-block; vertical-align: top; }

/* Testing out collapsing comments in pages */ .page-Roguefort_Cookie #WikiaArticleComments { display: none; } /* Mark redirects in Special:Allpages and Special:Watchlist */ .allpagesredirect { font-style: italic; } .allpagesredirect:after { color: #808080; content: " (redirect)" } .watchlistredir { font-style: italic; }

/* For [show]/[hide] link of javascript collapsible tables */ .collapseButton {        /* 'show'/'hide' buttons created dynamically by the        */ float: right;        /* CollapsibleTables javascript in MediaWiki:Common.js */ font-weight: normal; /* are styled here so they can be customised. */   text-align: right; width: auto; } /* Standard Navigationsleisten, aka box hiding thingy from .de. Documentation at NavFrame. */ div.NavFrame { margin: 0; padding: 4px; border: 1px solid #aaa; text-align: center; border-collapse: collapse; font-size: 95%; } div.NavFrame + div.NavFrame { border-top-style: none; border-top-style: hidden; } div.NavPic { background-color: #fff; margin: 0; padding: 2px; /* @noflip */ float: left; } div.NavFrame div.NavHead { line-height: 1.6em; font-weight: bold; background-color: #ccf; position: relative; } div.NavFrame p, div.NavFrame div.NavContent, div.NavFrame div.NavContent p { font-size: 100%; } div.NavEnd { margin: 0; padding: 0; line-height: 1px; clear: both; } a.NavToggle { position: absolute; top: 0; /* @noflip */ right: 3px; font-weight: normal; font-size: 90%; }

div#header-icons > div { float:right; margin-left:12px; } /* i like ginseng cookie a lot - ranran 2022 */

background: transparent; height: auto; overflow: hidden; position: relative; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; width: 100%; }	position: relative; -webkit-transition: 1s; -moz-transition: 1s; -o-transition: 1s; transition: 1s; -webkit-transition-timing-function: cubic-bezier(.67,.01,.23,1); -moz-transition-timing-function: cubic-bezier(.67,.01,.23,1); -o-transition-timing-function: cubic-bezier(.67,.01,.23,1); transition-timing-function: cubic-bezier(.67,.01,.23,1); }	margin: 0; padding: 0; }	margin: 0; }
 * 1) SliderView {
 * 1) SliderWrapper {
 * 1) SliderWrapper, #SliderWrapper ul, #SliderWrapper li, #NavBtns, #NavBtns ul {
 * 1) NavBtns li {

.Sld { float: left; height: auto; list-style: none; }

.SlideIMG { width: 100%; }

.SlideIMG img { display: block; height: auto; max-width: 100%; min-height: 100%; min-width: 100%; position: relative; }

display: block; position: absolute; } .NavBtn { background: transparent; display: block; height: auto; list-style: none; position: relative; margin: 0; top: 0; width: auto; }
 * 1) NavBtns {

.nmLeft { background: linear-gradient(to right, rgba(61,61,61,0.8), rgba(61,61,61,0.8), transparent); height: 100%; left: 0; } .nmLeft li { list-style: none; padding: 10px 100px 10px 10px; } .nmLeft li:hover { background: linear-gradient(to right, rgba(81,81,81,0.8), rgba(81,81,81,0.8), transparent); cursor: pointer; }

.nmRight { background: linear-gradient(to left, rgba(61,61,61,0.8), rgba(61,61,61,0.8), transparent); height: 100%; right: 0; text-align: left; } .nmRight li { list-style: none; padding: 10px 10px 10px 100px; } .nmRight li:hover { background: linear-gradient(to left, rgba(81,81,81,0.8), rgba(81,81,81,0.8), transparent); cursor: pointer; }

.nmTop { background: linear-gradient(to bottom, rgba(61,61,61,0.8), rgba(61,61,61,0.8), transparent); text-align: left; top: 0; width: 100%; }

.nmTop li { display: inline-block; list-style: none; padding: 10px 10px 20px 10px; }

.nmTop li:hover { background: linear-gradient(to bottom, rgba(81,81,81,0.8), rgba(81,81,81,0.8), transparent); cursor: pointer; }

.nmBottom { background: linear-gradient(to top, rgba(61,61,61,0.8), rgba(61,61,61,0.8), transparent); bottom: 0; text-align: left; width: 100%; } .nmBottom li { display: inline-block; list-style: none; padding: 20px 10px 10px 10px; } .nmBottom li:hover { background: linear-gradient(to top, rgba(81,81,81,0.8), rgba(81,81,81,0.8), transparent); cursor: pointer; }

.nbActiveLeft { background: linear-gradient(to right, rgba(111,111,111,0.8), rgba(111,111,111,0.8), transparent); } .nbActiveRight { background: linear-gradient(to left, rgba(111,111,111,0.8), rgba(111,111,111,0.8), transparent); } .nbActiveTop { background: linear-gradient(to bottom, rgba(111,111,111,0.8), rgba(111,111,111,0.8), transparent); } .nbActiveBottom { background: linear-gradient(to top, rgba(111,111,111,0.8), rgba(111,111,111,0.8), transparent); }