MediaWiki:Timeless.css

/* All CSS here will be loaded for users of the Timeless skin */

/* New Rodin Pro*/ @font-face { font-family: 'NewRodinPro-B'; src: url("https://static.miraheze.org/argobdpwiki/9/9f/NewRodinPro-B.ttf") format("truetype"); } /* * FreeSans, designed by GNU FreeFont, alternative to Helvetica Neue */ @font-face { font-family: "Free Sans"; src: url("https://static.miraheze.org/argobdpwiki/5/5d/FreeSans-LrmZ.ttf") format("truetype"); }

/* General */

body { background: #fff; }	font-family: 'NewRodinPro-B', sans-serif; font-weight: bold; text-transform: uppercase; color:white; display: grid }
 * 1) p-logo-text a {

/* Username text */ font-family: 'Arial'; font-weight: bold; text-transform: uppercase; color: white; } /* Navigation */ font-family: 'NewRodinPro-B', sans-serif; font-weight: lighter; font-size: 12px; padding: 8px; background-color:#0280d9; color: white; text-transform:uppercase; clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%); }
 * 1) personal > h2 > span {
 * 1) mw-site-navigation .mw-portlet h3 {

content: '🟄 '; color: #0280d9; }
 * 1) mw-site-navigation .mw-portlet li::before {

/* Heading Fonts */

font-family: 'NewRodinPro-B', sans-serif; }
 * 1) mw-content h1, #mw-content h2, #mw-content h3, #mw-content h4, #mw-content h5, #mw-content h6, #mw-content dt {

/* Sidebar Logo Spacing Fix */

margin: 1em auto; }
 * 1) p-logo {

border-bottom: solid 4px #0280d9; }
 * 1) mw-content h1.firstHeading {

/*    border-bottom: dotted 2px #0280d9; }
 * 1) mw-content h2 {

font-size:1.4em; }
 * 1) mw-content h3 {

font-size:1.2em; }
 * 1) mw-content h4 {



/* Changing color of table */

background:#10263D; color:white; }
 * 1) mw-content th {

.clicktoview th { background:white; color:black; }

.guide { border-spacing: 15px; margin-left: auto; margin-right: auto; border: none }

/* Fixed positioned top bar */ background: #434545; } /* Theme*/ body { margin: 0; background: #081A2E!important; color: #fff; font-family: 'Free Sans', serif; } a { color: #0280D9; } a:hover, a:visited { color: #0280D9; } h1 { color: white; font-family: 'NewRodinPro-B', serif; } h2, h3, h4 { color: #0280d9; font-family: 'NewRodinPro-B', serif; }	text-align: center; font-size: 14px; } div.editOptions { border: #222; background: #555; }	border-top: solid 2px #10263D; background: #0280d9; }	background: #10263D; border: 0; }	border: Solid #10263D; background: #10263D; border-radius: 1px; } .mw-parser-output a.external { color: #FFF; }	padding: 0.2em 4.5em 0.0em 2em !important; margin: 0; }	background: #10263D; height: 35px; }	border: inset 0px #000; border-radius: 3px; background: #333; height: 35px; width: 48vw; position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; top: 7px; }	position: fixed; right: 86px; } .mw-notification { background: #0280d9; border: #111; background: #111; border-radius: 5px; color: #999; width: 200px; } .postedit-container { position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; padding: 0; padding: 15px 0 15px 15px; text-align: right; } .postedit-icon { margin: auto; padding: 0; } .mw-wiki-logo { background-size: contain; }	background: #0280d9; }	width: 100%; max-width: 100%; padding: 0; position: static; }   background-image: url(https://static.miraheze.org/argobdpwiki/a/a5/Bg2.jpg) !important; background-position: center center !important; background-attachment: fixed !important; background-repeat: repeat !important; background-size: cover !important; border-bottom: solid 4px #0088d4 !important; }	background: #10263D; border: solid #10263D; }	color: #0280d9; }	background: #10263D; border: Solid #10263D;; border-radius: 1px; } .color-middle-container, .ts-inner { padding: 0; }	left: 60px; }	padding-top: 1px; padding-left: 6px; font-size: 16px; line-height: 0.99; }	width: 70em; padding-right: 33px; }	background: #10263D !important; border: solid #4D5B6F; } .codeEditor-status { color: #000; }	height: 700px; }	background: #10263D; padding-top: 2em; } fieldset { background: #222!important; border: solid #111; } input { background: #333; border: solid 1px #111!important; border-radius: 2px; padding-left: 5px; color: #c3c3c3; } .mw-ui-button.mw-ui-progressive, .mw-ui-button.mw-ui-progressive:active, .mw-ui-button.mw-ui-progressive.mw-ui-checked, input[type='submit'], input[type='button'], button { border: solid 1px #333!important; border-bottom: 0!important; border-bottom: solid 1px #333!important; } .oo-ui-flaggedElement-destructive { background: #111; border: 1px solid #444; color: #FF3333 !important; padding-left: 15px !important; padding-right: 15px !important; } .oo-ui-flaggedElement-destructive:hover { background: #222; color: #CC0000 !important; }	border: 0!important; } .oo-ui-textInputWidget input, .oo-ui-textInputWidget textarea { background-color: #333; color: #fff; } .oo-ui-textInputWidget > .oo-ui-labelElement-label { line-height: 0.5em; }	background-color: #555; } .warningbox { background: #1d1d16; } a.new:hover, .new a:hover, a.new:visited, .new a:visited { color: #0280d9; } .mw-plusminus-neg { color: #FF0000; }	border: 0 !important; left: 38vw; right: 0; margin-left: auto; margin-right: auto; }	color: #ffff33; }	color: #ffff66; }	float: right; display: block; }	margin: 0 auto; }	float: left; left: 25px; } .diff-addedline .diffchange { background: #1d1d16; padding-left: 7px; } .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label { text-shadow: 0 0 0 #000 !important; } .oo-ui-panelLayout-expanded { background: #222; } .oo-ui-messageDialog-message { color: #999; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button { color: #999; } .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget { border-right: 1px solid #111 } .oo-ui-dialog-content > .oo-ui-window-body { outline: 1px solid #111; } .oo-ui-messageDialog-content > .oo-ui-window-foot { outline: 1px solid #111; } .wikiEditor-ui .wikiEditor-ui-view { border: 1px solid #000; } .wikiEditor-ui .wikiEditor-ui-top { border-bottom: 1px solid #000; } textarea[style] { background: #111 !important; color: #fff; } pre, .mw-code { background: #222; color: #B0B0B0; border: 1px solid #444; } .oo-ui-iconWidget.oo-ui-iconElement.oo-ui-iconElement-icon { background-color: #B0B0B0; border: 1px solid #333; }   border: none; background: none; } .toc { background: #14304d!important; } .tocnumber { color: #0280D9!important; } .toctext { color: #0280D9!important; }
 * 1) mw-header-container {
 * 1) f-list {
 * 1) mw-header-nav-hack {
 * 1) mw-site-navigation .sidebar-inner {
 * 1) mw-site-navigation .sidebar-chunk {
 * 1) searchInput {
 * 1) searchInput-container {
 * 1) simpleSearch {
 * 1) user-tools {
 * 1) mw-header-container {
 * 1) mw-header {
 * 1) mw-content-container {
 * 1) mw-content {
 * 1) mw-page-header-links li.selected a {
 * 1) mw-related-navigation .sidebar-chunk {
 * 1) p-logo-text {
 * 1) p-logo-text a.long {
 * 1) p-search {
 * 1) personal .dropdown {
 * 1) iframeframe {
 * 1) mw-footer-container {
 * 1) searchInput {
 * 1) pagehistory li.selected {
 * 1) searchButton, #mw-searchButton {
 * 1) mw-footer-container a:hover {
 * 1) mw-footer-container a:visited {
 * 1) mw-footer .footer-places li {
 * 1) mw-footer ul, #mw-footer li {
 * 1) mw-footer #lastmod {
 * 1) toc {

/* Navbar Colours */

.color-left { background: #0280d9 } .color-middle { background: #0280d9 } .color-right { background: #0280d9 }

.mw-collapsed{ width:85%; } /* Category Listing customization */ .CategorySelect.articlePage { background-image:linear-gradient(135deg, rgba(9,26,45,0.9) 0, rgba(0,129,204,0.4) 100%); border-radius: 5px; } /* Customizing Tabber */ /* Modern Tabs - Credits to JustLeafy and Speedit on Dev Fandom */ border: none; justify-content: center; }	display: flex; flex-flow: row nowrap; padding: 0; overflow: auto; } /*== Add space between Tabs ==*/ .tabberlive > ul.tabbernav > li { margin-right: 5px; margin-top: 5px;; }	/*== Not Applied to the last Tab ==*/ .tabberlive > ul.tabbernav > li:last-child { margin-right: 0; }
 * 1) mw-content-text .tabber div.tabbertab,
 * 2) mw-content-text .tabber ul.tabbernav {
 * 1) mw-content-text .tabber ul.tabbernav {

.tabbernav { background: transparent; border-bottom: 0 !important; padding: 3px 0 !important; border: 0; margin: 10px 0; display: inline-block; }

/*== Inactive Tab CSS ==*/ ul.tabbernav li a { border-radius: 0px !important; border-bottom: none !important; border: 2px solid #FFF100 !important; background:#10263D !important; color: #FFF100 !important; font-size: 14px !important; letter-spacing: 2px !important; font-weight: 500 !important; padding: 3px 0.5em !important; position: relative; margin-left: 0 !important; margin: 3px; display: inline-block; }

/*== Active Tab CSS ==*/ ul.tabbernav li.tabberactive a { border-radius: 0px !important; border-bottom: none !important; border: 2px solid #FFF100 !important; background: #FFF100 !important; color: #10263D !important; font-size: 14px !important; letter-spacing: 2px !important; font-weight: 500 !important; padding: 3px 0.5em !important; position: relative; margin-left: 0 !important; margin: 3px; display: inline-block; }

ul.tabbernav li.tabberactive { line-height: flex !important; }

ul.tabbernav li.tabberactive:first-child a { margin-left: 0 !important; }

.tabbertab .ajax-poll { border: none !important; }

.tabberlive .tabbertab, .tabberlive .tabbertab { display: block !important; z-index: -1!important; }

.big .tabber__header { font-size: 1.9vw!important; font-family: sans-serif!important; }

.tabber__header { font-size: 15px!important; font-family: sans-serif!important; }

.tabber__header, .tabber__section { margin: auto!important; }

.tabber__header--prev-visible .tabber__header__prev, .tabber__header--next-visible .tabber__header__next { display: none!important; }

.tabber__header tabber__header--next-visible { display: none!important; }

.tabber_section { z-index: -1!important; }

/* End of Customizing Tabber */

/** Infobox **/ .portable-infobox { background-color: transparent; border: 1px solid #333441; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; width: 300px; background: url("https://vignette.wikia.nocookie.net/argo-bdp/images/9/91/Pi_bg.png"); background-repeat: repeat; background-size: contain; }

.portable-infobox .pi-item-spacing { padding: 4px 5px; }

.portable-infobox .pi-image-collection-tab-content { background: none; }

.portable-infobox .pi-title, .portable-infobox .pi-header { background-color: #0280d9; color: #ffffff; text-align: center; text-shadow: 3px 3px 3px #000000; background-image: url("https://static.wikia.nocookie.net/argo-bdp/images/c/c9/Bg_pattern.png"); background-position: center; }

.portable-infobox .pi-title { font-size: 20px; font-weight: bold; line-height: 25px; -moz-border-radius: 8px 8px 0 0; -webkit-border-radius: 8px 8px 0 0; border-radius: 8px 8px 0 0; }

.portable-infobox .pi-header { font-size: 15px; line-height: 20px; }

.portable-infobox .pi-image-collection-tabs { display: flex; flex-flow: row wrap; justify-content: center; margin: 5px 0 0; }

.portable-infobox .pi-image-collection-tabs li { background: #f8f8f8; border: none; box-sizing: border-box; color: #999; font-size: 12px; line-height: 18px; flex: 1 0 auto; margin: 0; }

.portable-infobox .pi-image-collection-tabs li.current, .portable-infobox .pi-image-collection-tabs li:hover { background: #0280d9; color: white; font-weight: normal; transition: all 0.15s; }

.portable-infobox .pi-data-label { color: inherit; }

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

.portable-infobox .pi-section-label { font-size: 10px; font-weight: 600; height: 25px; }

/* PI Theme Colors */ .pi-theme-Argonavis .pi-title, .pi-theme-Argonavis .pi-header, .pi-theme-Argonavis .pi-secondary-background, .pi-theme-Argonavis .pi-image-collection-tabs li.current, .pi-theme-Argonavis .pi-image-collection-tabs li:hover { background-color: #00a0ff; } /* Argonavis */

.pi-theme-Gyroaxia .pi-title, .pi-theme-Gyroaxia .pi-header, .pi-theme-Gyroaxia .pi-secondary-background, .pi-theme-Gyroaxia .pi-image-collection-tabs li.current, .pi-theme-Gyroaxia .pi-image-collection-tabs li:hover, .pi-theme-GYROAXIA .pi-title, .pi-theme-GYROAXIA .pi-header, .pi-theme-GYROAXIA .pi-secondary-background, .pi-theme-GYROAXIA .pi-image-collection-tabs li.current, .pi-theme-GYROAXIA .pi-image-collection-tabs li:hover { background-color: #d70a30; } /* GYROAXIA */

.pi-theme-Fantome-Iris .pi-title, .pi-theme-Fantome-Iris .pi-header, .pi-theme-Fantome-Iris .pi-secondary-background, .pi-theme-Fantome-Iris .pi-image-collection-tabs li.current, .pi-theme-Fantome-Iris .pi-image-collection-tabs li:hover { background-color: #8e274c; } /* Fontome Iris */

.pi-theme-Fujin-Rizing .pi-title, .pi-theme-Fujin-RIZING .pi-title, .pi-theme-Fujin-Rizing .pi-header, .pi-theme-Fujin-RIZING .pi-header, .pi-theme-Fujin-Rizing .pi-secondary-background, .pi-theme-Fujin-RIZING .pi-secondary-background, .pi-theme-Fujin-Rizing .pi-image-collection-tabs li.current, .pi-theme-Fujin-RIZING .pi-image-collection-tabs li.current, .pi-theme-Fujin-Rizing .pi-image-collection-tabs li:hover, .pi-theme-Fujin-RIZING .pi-image-collection-tabs li:hover { background-color: #ffbf0d; } /* Fujin RIZING! */

.pi-theme-Epsilon-Phi .pi-title, .pi-theme-Epsilon-Phi .pi-header, .pi-theme-Epsilon-Phi .pi-secondary-background, .pi-theme-Epsilon-Phi .pi-image-collection-tabs li.current, .pi-theme-Epsilon-Phi .pi-image-collection-tabs li:hover { background-color: #b73e91; } /* εpsilonΦ */

/* PI BG */ .pi-theme-Argonavis { background: linear-gradient(rgba(16, 38, 61,0.5),rgba(16, 38, 61.5)), url("https://vignette.wikia.nocookie.net/argo-bdp/images/2/29/Argonavis_BG.png"); background-repeat: repeat; background-size: contain; } .pi-theme-Gyroaxia, .pi-theme-GYROAXIA { background: linear-gradient(rgba(16, 38, 61,0.5),rgba(16, 38, 61.5)), url("https://vignette.wikia.nocookie.net/argo-bdp/images/4/48/GYROAXIA_BG.png"); background-repeat: repeat; background-size: contain; } .pi-theme-Fantome-Iris { background: linear-gradient(rgba(16, 38, 61,0.5),rgba(16, 38, 61.5)), url("https://vignette.wikia.nocookie.net/argo-bdp/images/1/1d/Fantome_Iris_BG.png"); background-repeat: repeat; background-size: contain; } .pi-theme-Fujin-Rizing, .pi-theme-Fujin-RIZING { background: linear-gradient(rgba(16, 38, 61,0.5),rgba(16, 38, 61.5)), url("https://vignette.wikia.nocookie.net/argo-bdp/images/d/d3/Fujin_RIZING_BG.png"); background-repeat: repeat; background-size: contain; } .pi-theme-Epsilon-Phi { background: linear-gradient(rgba(16, 38, 61,0.5),rgba(16, 38, 61.5)), url("https://vignette.wikia.nocookie.net/argo-bdp/images/b/b6/%CE%95psilon%CE%A6_BG.png"); background-repeat: repeat; background-size: contain; }

/** Lyrics **/ .pi-theme-lyrics.portable-infobox { width: auto; float: none; transition-duration: 0.3s; border-style: solid; border-width: .1875vw; border-color: #dbfff0; border-radius: 1.5625vw; background: transparent; } .pi-theme-lyrics .pi-data { width: 90%; margin: 0 auto; } .pi-theme-lyrics .pi-navigation { background:transparent; font-size: 13px; font-weight: bold; }

.pi-theme-lyrics.portable-infobox .pi-header { display: none; } .pi-theme-lyrics .pi-data-value { font-size: 14px; width: 100%; text-align: center; } /* [begin] For Styled Tables */

.table { border-collapse: collapse; width: 100%; max-width: 100%; margin-bottom: 1rem; background-color: transparent; text-align: left; }

.table th { color: #495057; background-color: #dee2e6; border-bottom: 2px solid #dee2e6; }

.table td, .table th { padding: .70rem; border-top: 1px solid #dee2e6; }

.table th { text-align: inherit; }

.table tbody tr:hover { background-color: #fcfcfc; }

.table-bordered { border: 1px solid #dee2e6; }

.table caption { font-weight: bold; font-size: 1.2em; }

.table-story td { padding: 17px; margin-left:auto !important; margin-right:auto !important; }

.ARGOtable th { padding: 1em 1.5em 1em 1.5em; background: #0280d9!important; } .table-theme-Argonavis th { padding: 1em 1.5em 1em 1.5em; background: #01b1d5!important; }

.table-theme-GYROAXIA th { padding: 1em 1.5em 1em 1.5em; background: #d70a30!important; }

.table-theme-Fantome-Iris th { padding: 1em 1.5em 1em 1.5em; background: #8e274c!important; }

.table-theme-Fujin-Rizing th { padding: 1em 1.5em 1em 1.5em; background: #ffbf0d!important; }

.table-theme-Epsilon-Phi th { padding: 1em 1.5em 1em 1.5em; background: #B13C8C!important; }

/* [end] For Styled Tables */ /* [begin] For Styled Tabber */

/* [end] For Styled Tabber */ /* [begin] For Styled Tabs */

.tabs-tabbox { background: none!important; border: none!important;

}

.tabs-container { width: 100%!important; height:auto; background: none!important; border: none!important;

}

.tabs-card-1 .tabs-label { width: 20%; min-width: 10em; padding: 0; padding-right: 2em!important; padding-left: 2em!important; margin: 0.5rem; font-size: var(font-large); font-weight: bold; border: 0!important; border-radius: 0!important; color: #14304D; text-align: center; }

.tabs-card-2 .tabs-label { width: 20%; min-width: 10em; padding: 0; padding-right: 2em!important; padding-left: 2em!important; margin: 0.5rem; font-size: var(font-large); font-weight: bold; border: 0!important; border-radius: 0!important; color: #14304D; text-align: center; }

.tabs-card-3 .tabs-label { width: 20%; min-width: 10em; padding: 0; padding-right: 2em!important; padding-left: 2em!important; margin: 0.5rem; font-size: var(font-large); font-weight: bold; border: 0!important; border-radius: 0!important; color: #14304D; text-align: center; }

.tabs-card-4 .tabs-label { width: 20%; min-width: 10em; padding: 0; padding-right: 2em!important; padding-left: 2em!important; margin: 0.5rem; font-size: var(font-large); font-weight: bold; border: 0!important; border-radius: 0!important; color: #14304D; text-align: center; }

.tabs-card-2 .tabs-content { border: 1.5vmin solid!important; border-image: linear-gradient(120deg,#c16d58,#fdb592,#c05d3e,#bc7057,#c16d58,#fdb592,#c05d3e) 1!important; padding: 0!important; border-collapse: collapse; position: relative!important; right: 0.62%!important; }

.tabs-card-3 .tabs-content { border: 1.5vmin solid!important; border-image: linear-gradient(120deg,#bbbdbd,#f3f1f3,#a798c3,#aa9eb2,#bbbdbd,#f3f1f3,#a798c3,#aa9eb2) 1!important; padding: 0!important; border-collapse: collapse; position: relative!important; right: 0.62%!important; }

.tabs-card-4 .tabs-content { border: 1.5vmin solid!important; border-image: linear-gradient(120deg,#b18307,#ecb503,#fdd729,#b08207,#ffae00,#fff4a7,#fdd732) 1!important; padding: 0!important; border-collapse: collapse; position: relative!important; right: 0.62%!important; }

/* [end] For Styled Tabs */

table.center { margin-left:auto; margin-right:auto; } /* [start] Story Page Optimization */ .preview .image { width:60%; height:300px; } .preview .image img { width:100%; height:100%; object-fit:cover; }

.description { width:100%; height:100%; object-fit:cover; }

div.fixed { position: fixed; }

.resize .image { width:60%; height:300px; } .resize .image img { width:100%; height:100%; object-fit:cover; }

/* [end] Story Page Optimization */

/* [start] Columns for Event Pages */

.columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(370px, 1fr)); font-family: Helvetica; font-size: 1.3em; color: white; text-align: center; } .columns div:nth-child(1), div:nth-child(6) { background-color: none; }

.columns div:nth-child(2), div:nth-child(7) { background-color: none; }

.columns div:nth-child(3), div:nth-child(8) { background-color: none; }

.columns div:nth-child(4) { background-color: none; }

.columns div:nth-child(5) { background-color: none; }

/* [end] Columns for Event Pages */

.strokewhite { text-shadow: -1px -1px 0 #E0EBF3, 1px -1px 0 #E0EBF3 , -1px 1px 0 #E0EBF3 , 1px 1px 0 #E0EBF3 ; }

/* [start] No Link Images (compatible with .resize) */ .nolink .image { pointer-events:none!important; } .nolink .image img { pointer-events: none!important; } /* [end] No Link Images (compatible with .resize) */

/* [start] Character Bar Formatting */ .columns-chara-bar { display: grid; grid-template-columns: repeat(auto-fit, minmax(50px, 1fr)); font-family: Helvetica; font-size: 1.3em; color: white; text-align: center; } .columns-chara-bar div:nth-child(1), div:nth-child(6) { background-color: none; }

.columns-chara-bar div:nth-child(2), div:nth-child(7) { background-color: none; }

.columns-chara-bar div:nth-child(3), div:nth-child(8) { background-color: none; }

.columns-chara-bar div:nth-child(4) { background-color: none; }

.columns-chara-bar div:nth-child(5) { background-color: none; }

.columns-chara-bar img { opacity: 0.35; filter: alpha(opacity=35); transition: opacity .1s ease-out; -moz-transition: opacity .1s ease-out; -webkit-transition: opacity .1s ease-out; -o-transition: opacity .1s ease-out; }

.columns-chara-bar img:hover { opacity: 1.0; filter: alpha(opacity=100); }

.highlight img { opacity: 1.0!important; filter: alpha(opacity=100)!important; } /* [end] Character Bar Formatting */