MediaWiki:Common.css

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

/* MinifiedLeftTabs adds a cleaner style to the left tabs that are found in Special:Search and Special:Insights.

@import "/load.php?mode=articles&articles=u:dev:MediaWiki:MinifiedLeftTabs/code.css&only=styles";

/** fandom desktop **/

/*===================*/ /* eras icons design */ /*===================*/

.eraicon { float:right; position:static; margin-bottom:0.35em; }

/*======================*/ /*		light Theme		*/ /*======================*/

/*=============================*/ /* notice warning for spoilers */ /*=============================*/

/* Alert Notice */ .theme-fandomdesktop-light .mw-parser-output .spoiler_alert { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #FF0000 solid; border-collapse: collapse; background-color: #FF9999; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em;

} /* Comic Notice */ .theme-fandomdesktop-light .mw-parser-output .spoiler_comic { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #CD7002 solid; border-collapse: collapse; background-color: #FFC782; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em;

} /* Novel Notice */ .theme-fandomdesktop-light .mw-parser-output .spoiler_novel { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #8A8A8A solid; border-collapse: collapse; background-color: #E5E5E5; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em;

} /* Game Notice */ .theme-fandomdesktop-light .mw-parser-output .spoiler_game { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding:2em; padding-bottom: 2.375em; border: 0.050em #4B5137 solid; border-collapse: collapse; background-color: #C3CFA1; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em;

}

/*====================================*/ /* notice warning for various message */ /*====================================*/

/* stub notice */

.theme-fandomdesktop-light .mw-parser-output #notice.box { padding:1em; display:flex; justify-content: center; }

.theme-fandomdesktop-light .mw-parser-output #notice.divTableStub{ position: relative; display: table; width: 2em; left:1em; }

.theme-fandomdesktop-light .mw-parser-output #notice.stubBar1 { content: ''; z-index: 0; position: relative; background: linear-gradient(to bottom,black,#EFEFEF); display: table-cell; width: 0.5em; border-top-left-radius: 0.5em; border-bottom-left-radius: 0.5em; }

.theme-fandomdesktop-light .mw-parser-output #notice.stubBar2 { content:''; z-index:1; position:relative; display:table-cell; width: 0.5em; left:-1em; background: linear-gradient(to bottom, black, #EFEFEF); border-top-left-radius:0.5em; border-bottom-left-radius:0.5em }

.theme-fandomdesktop-light .mw-parser-output #notice.stub { content:''; margin-left:1em; z-index:0; display: table-cell; left:-1em; position:relative; background-color: #EFEFEF; }

.theme-fandomdesktop-light .mw-parser-output #stub_text { position:relative; padding: 2em 0.5em; margin: auto; }

/*======================*/ /*	Species infobox		*/ /*======================*/

.theme-fandomdesktop-light .portable-infobox { border-width: 0; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-title { background-color: #A3998F; color: #090909; border: 0.050em solid black; border-bottom: 0; text-align: center; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-header { background-color: #8CA88A; /*color: #e5e5e5;*/ border-width: 0; border: 0; padding: 0.250em; padding-left: 0.500em; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-data:first-child{ /*border: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-left: 0.500em; width: auto; text-align: left; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-data:last-child { /*border-right: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-right:0.500em; width: auto; text-align: right; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-data:nth-child(even) { border-width: 0; background-color: #F2F2F2; width: auto; text-align: left; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-data:nth-child(odd) { border-width: 0; background-color: #E5E5E5; width: auto; text-align: left; }

.theme-fandomdesktop-light .portable-infobox.pi-theme-Species .pi-navigation { background: #A3998F; color: #090909; text-align: right; padding-right: 0.500em; border-spacing: 0; -moz-border-radius: 0 0 0.500em 0.500em; -webkit-border-radius: 0 0 0.500em 0.500em; border-radius: 0 0 0.500em 0.500em; border: 0.050em solid black; border-top: 0; }

/*======================*/ /*	character infobox	*/ /*======================*/

.theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-title { background-color: #87C5C5; color: #2D2D2D; border: 0.050em solid black; border-bottom: 0; text-align: center; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-header { background-color: #8F8AA8; /*	color: #e5e5e5;*/ border: 0; padding: 0.250em; padding-left: 0.500em; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-data:first-child{ /*	border: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-left: 0.500em; width: auto; text-align: left; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-data:last-child { /*	border-right: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-right:0.500em; width: auto; text-align: right; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-data:nth-child(even) { border-width: 0; background-color: #F2F2F2; width: auto; text-align: left; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-data:nth-child(odd) { border-width: 0; background-color: #E5E5E5; width: auto; text-align: left; } .theme-fandomdesktop-light .portable-infobox.pi-theme-Character .pi-navigation { background: #87C5C5; color: #2D2D2D; text-align: right; padding-right: 0.500em; border-spacing: 0; -moz-border-radius: 0 0 0.500em 0.500em; -webkit-border-radius: 0 0 0.500em 0.500em; border-radius: 0 0 0.500em 0.500em; border: 0.050em solid black; border-top: 0; }

/*===============================*/ /* Tabber design for light theme */ /*===============================*/

/*species theme of tabber*/

.Species { display: flex; }

.theme-fandomdesktop-light .Species ul.wds-tabs { color: black; overflow: hidden;

} /* .theme-fandomdesktop-light .Species .wds-tabs__tab-label { margin: 0; } .theme-fandomdesktop-light .Species ul.wds-tabs .wds-tabs__tab.wds-is-current { background-color: #a3998f !important; -moz-border-radius:0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius:0.35em 0.35em 0 0 !important; border-top: 0.1em solid black !important; border-left: 0.1em solid black !important; border-right: 0.1em solid !important; box-shadow: none; color: black !important; }

.theme-fandomdesktop-light .Species ul.wds-tabs li { background-color: #8CA88A !important; -moz-border-radius:0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius:0.35em 0.35em 0 0 !important; border:1px solid black !important; border-bottom: 0 solid !important; color: white !important; cursor: pointer; margin-left:0; margin-right:0; }

.theme-fandomdesktop-light .Species ul.wds-tabs li:hover { background-color: white !important; -moz-border-radius:0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius:0.35em 0.35em 0 0 !important; border:1px solid black !important; border-bottom: 0 solid !important; color: black !important; }

.theme-fandomdesktop-light .Species ul.wds-tabs li:active { background-color: #8CA88A !important; -moz-border-radius:0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius:0.35em 0.35em 0 0 !important; border-bottom: 0 solid !important; border:1px solid black !important; color: black !important; }

/*======================*/ /*		Dark Theme		*/ /*======================*/

/*=============================*/ /* notice warning for spoilers */ /*=============================*/

/* Alert Notice */ .theme-fandomdesktop-dark .mw-parser-output .spoiler_alert { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #dd5555 solid; border-collapse: collapse; background-color: #863a3a; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em; animation-name: glow-alert; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

@keyframes glow-alert { 0%  {    box-shadow: 0px 0px 20px 0px #863a3a } 100%  {    box-shadow: 0px 0px 30px 0px #aa4747 } }

/* Comic Notice */ .theme-fandomdesktop-dark .mw-parser-output .spoiler_comic { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #7e4601 solid; border-collapse: collapse; background-color: #423324; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em; animation-name: glow-comic; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

@keyframes glow-comic { 0%  {    box-shadow: 0px 0px 20px 0px #423324 } 100%  {    box-shadow: 0px 0px 30px 0px #644e37 } }

/* Novel Notice */ .theme-fandomdesktop-dark .mw-parser-output .spoiler_novel { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding: 2em; padding-bottom: 2.375em; border: 0.050em #b3b3b3 solid; border-collapse: collapse; background-color: #4d4d4d; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate;

} /* Game Notice */ .theme-fandomdesktop-dark .mw-parser-output .spoiler_game { font-size: 95%; text-align:center; width: 38em; margin: auto; margin-bottom: 1em; padding-top: 2.375em; padding:2em; padding-bottom: 2.375em; border: 0.050em #717a52 solid; border-collapse: collapse; background-color: #35382e; -moz-border-radius: 0.500em; -webkit-border-radius: 0.500em; border-radius: 0.500em; animation-name: glow-game; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

@keyframes glow-game { 0%  {    box-shadow: 0px 0px 20px 0px #35382e } 100%  {    box-shadow: 0px 0px 30px 0px #585e4b } }

/*====================================*/ /* notice warning for various message */ /*====================================*/

/* stub notice */

.theme-fandomdesktop-dark .mw-parser-output #notice.box { padding-bottom: 2em; display: flex; justify-content: center; } .theme-fandomdesktop-dark .mw-parser-output #notice.divTableStub{ position: relative; display: table; width: 2em; left:1em; }

.theme-fandomdesktop-dark .mw-parser-output #notice.stubBar1 { content: ''; z-index: 0; position: relative; background: linear-gradient(to bottom,black,#EFEFEF); display: table-cell; width: 0.5em; border-top-left-radius: 0.5em; border-bottom-left-radius: 0.5em; animation-name: glow-blur; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

.theme-fandomdesktop-dark .mw-parser-output #notice.stubBar2 { content:''; z-index:1; position:relative; display:table-cell; width: 0.5em; left: -1em; background: linear-gradient(to bottom, black, #EFEFEF); border-top-left-radius:0.5em; border-bottom-left-radius:0.5em } .theme-fandomdesktop-dark .mw-parser-output #notice.stub { content:''; display: table-cell; position: relative; margin-left:1em; left:-1em; background-color: #4d4d4d; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; } .theme-fandomdesktop-dark .mw-parser-output #stub_text { position:relative; padding: 2em 0.5em; margin: auto; }

/*======================*/ /*	Species infobox		*/ /*======================*/	overflow-x: visible; }   margin-bottom: 0px; position: inherit; z-index: 1; } .theme-fandomdesktop-dark .portable-infobox { position: relative; border-width: 0; border-radius: 0.5em; background-color: transparent; }
 * 1) content.page-content {
 * 1) content.page-content .portable-infobox section {

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-title { position: relative; z-index: 1; background-color: #6d645a; color: #f2f2f2; border: 0.050em solid #D8D8D8; border-bottom: 0; text-align: center; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

@keyframes glow-blur { 0%  {    filter:blur(6px); } 100%  {    filter:blur(12px); } }

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-header { position: relative; z-index: 1; background-color: #597557; color: #f2f2f2; border: 0;

}

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-data:first-child{ position: relative; z-index: 1; /*border: 0.125em solid black;*/ border-width: 0; width: auto; text-align: left;

}

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-data:last-child { position: relative; z-index: 1; /*border-right: 0.125em solid black;*/ border-width: 0; width: auto; text-align: right;

}

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-data:nth-child(even) { position: relative; z-index: 1; border-width: 0; background-color: #404040; width: auto; text-align: left;

} .theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-data:nth-child(odd) { position: relative; z-index: 1; border-width: 0; background-color: #333333; width: auto; text-align: left;

}

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Species .pi-navigation { position: relative; z-index: 0; background: #6d645a; color: #f2f2f2; text-align: right; border-spacing: 0; -moz-border-radius: 0 0 0.500em 0.500em; -webkit-border-radius: 0 0 0.500em 0.500em; border-radius: 0 0 0.500em 0.500em; border: 0.050em solid #f2f2f2; border-top: 0; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate;

}

/*======================*/ /*	character infobox	*/ /*======================*/

.theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-title { position: relative; z-index: 1; background-color: #295656; color: #d8d8d8; border: 0.050em solid #D8D8D8; border-bottom: 0; text-align: center; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-header { background-color: #454158; color: #d8d8d8; border: 0; padding: 0.250em; padding-left: 0.500em; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-data:first-child{ /*	border: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-left: 0.500em; width: auto; text-align: left; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-data:last-child { /*	border-right: 0.125em solid black;*/ border-width: 0; padding: 0.625em 1em; padding-right:0.500em; width: auto; text-align: right; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-data:nth-child(even) { border-width: 0; background-color: #404040; width: auto; text-align: left; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-data:nth-child(odd) { border-width: 0; background-color: #333333; width: auto; text-align: left; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-Character .pi-navigation { position: relative; z-index: 0; background-color: #295656; color: #d8d8d8; text-align: right; padding-right: 0.500em; border-spacing: 0; -moz-border-radius: 0 0 0.500em 0.500em; -webkit-border-radius: 0 0 0.500em 0.500em; border-radius: 0 0 0.500em 0.500em; border: 0.050em solid #D8D8D8; border-top: 0; animation-name: glow; animation-timing-function: ease; animation-duration: 1s; animation-iteration-count: infinite; animation-direction:alternate; }

@keyframes glow { 0%  {    box-shadow: 0px 0px 20px 0px #4d4d4d } 100%  {    box-shadow: 0px 0px 30px 0px #7f7f7f } }

/*===============================*/ /* Tabber design for dark theme */ /*===============================*/

/*species theme of tabber*/

.theme-fandomdesktop-dark .Species ul.wds-tabs { color: f2f2f2; overflow: hidden; }

/* .theme-fandomdesktop-light .Species .wds-tabs__tab-label { margin: 0; }

.theme-fandomdesktop-dark .Species ul.wds-tabs .wds-tabs__tab.wds-is-current { background-color: #6d645a !important; -moz-border-radius: 0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius: 0.35em 0.35em 0 0 !important; border-top: 0.1em solid #D8D8D8 !important; border-left: 0.1em solid #D8D8D8 !important; border-right: 0.1em solid #D8D8D8 !important; border-bottom: 0 solid !important; box-shadow: none; color: f2f2f2 !important; }

.theme-fandomdesktop-dark .Species ul.wds-tabs li { background-color: #597557 !important; -moz-border-radius: 0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius: 0.35em 0.35em 0 0 !important; border: 1px solid #D8D8D8 !important; border-bottom: 0 solid !important; color: #f2f2f2 !important; cursor: pointer; margin-left: 0; margin-right: 0; }

.theme-fandomdesktop-dark .Species ul.wds-tabs li:hover { background-color: transparent !important; -moz-border-radius: 0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius: 0.35em 0.35em 0 0 !important; border: 1px solid #D8D8D8 !important; border-bottom: 0 solid !important; color: f2f2f2 !important; }

.theme-fandomdesktop-dark .Species ul.wds-tabs li:active { background-color: #597557 !important; -moz-border-radius: 0.35em 0.35em 0 0 !important; -webkit-border-radius: 0.35em 0.35em 0 0 !important; border-radius: 0.35em 0.35em 0 0 !important; border: 1px solid #D8D8D8 !important; border-bottom: 0em solid !important; color: f2f2f2 !important; }