User:Sid the Kpop fan/common.css

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');

.hlist .toc:not(.sticky-toc) ul { max-width: none; } .hlist .toc:not(.sticky-toc) ul li:not(:first-child) { margin-left: 0; } .hlist .toc:not(.sticky-toc) ul li a { display: inline; } .hlist .toc:not(.sticky-toc) li li:first-child:before { content: "("; } .hlist .toc:not(.sticky-toc) li li:last-child:after {	content: ")"; }

/* Pokemon theming */ /** Normal **/ .portable-infobox.pi-theme-Normal { border-color: var(--custom-infobox-border-color--Normal); } .portable-infobox.pi-background.pi-theme-Normal { background-color: var(--custom-infobox-bg-color--Normal); } .portable-infobox.pi-theme-Normal .pi-title, .portable-infobox.pi-theme-Normal .pi-header, .portable-infobox.pi-theme-Normal .pi-horizontal-group .pi-header { background-color: var(--color-Normal); color: black; }

/** Electric **/ .portable-infobox.pi-theme-Electric { border-color: var(--custom-infobox-border-color--Electric); } .portable-infobox.pi-background.pi-theme-Electric { background-color: var(--custom-infobox-bg-color--Electric); } .portable-infobox.pi-theme-Electric .pi-title, .portable-infobox.pi-theme-Electric .pi-header, .portable-infobox.pi-theme-Electric .pi-horizontal-group .pi-header { background-color: var(--color-Electric); color: black; }

/* Custom for dual type */ /* Bulbasaur, Ivysaur, and Venusaur .portable-infobox:is(.pi-theme-Bulbasaur, .pi-theme-Ivysaur, .pi-theme-Venusaur) { border-color: var(--custom-infobox-border-color--Poison); } .portable-infobox.pi-background:is(.pi-theme-Bulbasaur, .pi-theme-Ivysaur, .pi-theme-Venusaur) { background-color: var(--custom-infobox-bg-color--Grass); }
 * is(.pi-theme-Bulbasaur, .pi-theme-Ivysaur, .pi-theme-Venusaur) .pi-title, .pi-header, .pi-horizontal-group .pi-header {

background-color: var(--color-Grass); color: black; }

/* Charizard .portable-infobox.pi-theme-Charizard { border-color: var(--custom-infobox-border-color--Flying); } .portable-infobox.pi-background.pi-theme-Charizard { background-color: var(--custom-infobox-bg-color--Fire); } .portable-infobox.pi-theme-Charizard .pi-title, .portable-infobox.pi-theme-Charizard .pi-header, .portable-infobox.pi-theme-Charizard .pi-horizontal-group .pi-header { background-color: var(--color-Fire); color: black; }

/* Main Page Layout .mp-header { background-color: #3366cc; color: #ffffff; margin: 0 0 10px 0; font-size: 20px; font-family: 'Circular Std', sans-serif; text-align: center; border-radius: 10px; color: white; font-weight: bold; } .mp-box a { color: #66ccff; } .mp-box { margin-bottom: 12px; border: 2px solid #66ccff; border-radius: 10px; padding: 6px; text-align: center; background-color: #3366cc; color: white; } .mp-box > .mp-header { background-color: #66ccff; color: black; } .mp-welcome-header { font-family: 'Circular Std', sans-serif; font-size: 32px; color: white !important; font-weight: bold; }

/* Table fix */ .theme-fandomdesktop-dark .table-yes { background-color: #006600 !important; }

.theme-fandomdesktop-dark .table-no { background-color: #660000 !important; }

/* Custom Dropdown Menu */ .page-content { overflow: visible; } .custom-dropdown { background: transparent !important; color: currentColor !important; font-weight:bold; padding: 1px 8px; } .custom-dropdown:hover { padding-bottom: 1px !important; } .custom-dropdown > :first-child:after { border-color: currentColor transparent transparent; } .custom-dropdown ul { list-style: none; min-width: 90px; } .custom-dropdown:hover ul { display: block; } .custom-dropdown li a, .custom-dropdown li strong.selflink { height: 14px; line-height: 14px; } .custom-dropdown .wikia-menu-button:hover { background-color: rgba(10, 10, 10, 0.3) !important; } .wikia-menu-button ul strong.selflink { display: block; padding: 9px 9px 7px; } .wikia-menu-button ul strong.selflink:hover { background: rgba(10, 10, 10, 0.3); }

/* Image Overlay (Taylor Swift Wiki) */ .image-overlay { position: relative; overflow: hidden; } .image-overlay > .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: 0.5s; background: #00000080; color: #fff; } .image-overlay:hover > .overlay { opacity: 1; } .image-overlay > .overlay > .overlay-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 180%; font-family: Playfair Display; padding-left: 3px; padding-right: 3px; text-align: center; width: 100%; } .image-overlay p { margin: .0em 0 .0em !important; } .image-overlay a:hover { opacity: 0.6; -webkit-transition: all .4s linear 0s; -moz-transition: all .4s linear 0s; -ms-transition: all .4s linear 0s; -o-transition: all .4s linear 0s; transition: all .4s linear 0s; text-decoration: none; } .image-overlay a { color: #eaeaea; -webkit-transition: all .3s linear 0s; -moz-transition: all .3s linear 0s; -ms-transition: all .3s linear 0s; -o-transition: all .3s linear 0s; transition: all .3s linear 0s; } .image-overlay.overlay-zoom:hover img { -moz-transform:scale(1.05); -webkit-transform:scale(1.05); -o-transform:scale(1.05); -ms-transform:scale(1.05); transform:scale(1.05); -webkit-backface-visibility:hidden; backface-visibility:hidden; filter:alpha(opacity=100); opacity:1; -webkit-transition:all 3s ease-in-out; -moz-transition:all 3s ease-in-out; -ms-transition:all 3s ease-in-out; -o-transition:all 3s ease-in-out; transition:all 3s ease-in-out; } .image-overlay.overlay-zoom img { -webkit-transition:all 3s ease-in-out; -moz-transition:all 3s ease-in-out; -ms-transition:all 3s ease-in-out; -o-transition:all 3s ease-in-out; transition:all 3s ease-in-out; }

/* Buttons ver2 by Shuhua */ .button2 { display: inline-block; border: none; color: #FFFFFF; text-align: center; font-size: 18px; letter-spacing: 2px; transition: all 0.5s; cursor: pointer; width:390px; background: #3366cc; border-radius:30px; padding-top:12px; padding-bottom:10px; margin-bottom: 2px; box-shadow: 2px 2px 25px #3366cc; font-weight: bold; font-family: 'Circular Std', sans-serif; text-transform: lowercase; }

.button2 span { cursor: pointer; display: inline-block; position: relative; transition: 0.5s; }

.button2 span:after { content: '➜'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s; }

.button2:hover span { padding-right: 25px; }

.button2:hover span:after { opacity: 1; right: 0; }

/* Members Main Page by Shuhua */

.membername { font-family: 'Monument Extended'; font-size: 28.7px; color: #fff; text-transform: uppercase; text-align: center; padding-top: 200px; text-shadow: 2px 2px 25px #6b6b6b; } .position { font-family: Montserrat; font-weight: 500; font-size: 10px; color: #fff; text-transform: uppercase; text-align: center; margin-top: -5px; } .button4 { font-weight: 500; font-size: 10px; color: #000; margin-top: 35px; margin-left: 35px; margin-right: 35px; display: inline-block; border: none; text-align: center; transition: all 0.5s; cursor: pointer; background: white; border-radius: 20px; padding-top: 8px; padding-bottom: 8px; box-shadow: 2px 2px 25px #6b6b6b; } .button4 span { cursor: pointer; display: inline-block; position: relative; transition: 0.5s; }

.button4 span:after { content: '➜'; position: absolute; opacity: 0; top: 0; right: -20px; transition: 0.5s; }

.button4:hover span { padding-right: 25px; }

.button4:hover span:after { opacity: 1; right: 0; } /* .resizable-container, .page-content, .fandom-sticky-header, .search-modal, .oo-ui-defaultOverlay, .oo-ui-windowManager, .wds-dialog__curtain, .suggestions, .ui-dialog, .ui-widget, .wikiEditor-toolbar-dialog.ui-dialog, .postedit-container, .referencetooltip, .page .mw-parser-output .curseprofile textarea, .mw-rcfilters-ui-overlay, .notifications-placeholder { font-family: 'Montserrat', sans-serif; } /* a { font-weight: 500; }

/* a { font-weight: 500; text-decoration: none !important; }

.page-content a:hover { text-shadow: 0px 0px 2px #3399ff, 0px 0px 2px #3399ff; color: #66ccff; transition: linear 0.4s; }*/ /* .ve-fd-header, .fandom-community-header__community-name, .page-counter, .fandom-sticky-header__sitename, .fandom-community-header__local-navigation .wds-tabs__tab-label, .page-header__title, .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .page-content .mw-headline, .toc .toctitle h2 { font-family: 'Circular Std', sans-serif; font-weight: bold; } .ve-fd-header a { font-weight: bold; }

.postedit { font-family: 'Circular Std', sans-serif; } /*=============================================================================================*/

.portable-infobox .wds-tabs__wrapper .wds-tabs { flex-wrap: wrap; justify-content: center; } .portable-infobox .wds-tabs__tab-label { height: 18px; font-size: 14px; margin: 2px 4px !important; color: var(--theme-page-text-color); } .portable-infobox .wds-tabs__tab:not(.wds-is-current):hover { color: inherit; } .portable-infobox .wds-tabs__tab.wds-is-current { box-shadow: none; background-color: #3333ff; color: white; } .portable-infobox .wds-tabs__tab.wds-is-current .wds-tabs__tab-label { color: white; } .portable-infobox .wds-tabs__wrapper .wds-tabs__tab-label { transition: none; font-family: 'Circular Std', sans-serif; font-weight: bold; }

/* Interface design */ .resizable-container, .page-content, .mw-parser-output, .fandom-sticky-header, .search-modal, .oo-ui-defaultOverlay, .oo-ui-windowManager, .wds-dialog__curtain, .suggestions, .ui-dialog, .ui-widget, .wikiEditor-toolbar-dialog.ui-dialog, .postedit-container, .mw-rcfilters-ui-overlay, .notifications-placeholder { font-family: 'Montserrat', sans-serif; }
 * 1) WikiaBar .wds-dropdown__content,

.page-content .mw-headline, .page-header__title, .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .toc .toctitle h2, .fandom-community-header .fandom-community-header__community-name, .fandom-community-header .page-counter, .fandom-community-header__local-navigation .wds-tabs__tab-label, .fandom-sticky-header .fandom-sticky-header__sitename, .page-header__action-button.has-label, .wds-button, .oo-ui-buttonElement, .ve-fd-header { font-family: 'Circular Std', sans-serif; font-weight: bold; }
 * 1) WikiaBar:not( .wds-dropdown__content),

.wds-tooltip, .popover { font-family: 'Circular Std', sans-serif; }

/* TOC */ .toc:not(.sticky-toc) { background-color: #f9f9f9; border-color: #aaa; border-radius: 0 !important; } .toc .toctitle { border-color: #aaa; } .theme-fandomdesktop-dark .toc:not(.sticky-toc) { /* Fix dark mode visibility */ background-color: var(--theme-page-background-color--secondary); }

/* Rectangular buttons (DEV Wiki) */ .oo-ui-buttonElement-button { border-radius: 10px !important; }

/* Rectangular side tools */ .page-side-tool { border-radius: 10px; } .right-rail-toggle { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }

.postedit-container .postedit { font-family: 'Circular Std', sans-serif; font-weight: bold; border-radius: 10px; background-color: #3333ff; color: white; border: none; text-align: center; } .postedit-container .postedit::after { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='18px' viewBox='0 0 24 24' width='18px' fill='%23fff'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E"); background-image: none; } .postedit-icon-checkmark { background: none; } .postedit-icon { padding: 0; line-height: 1; }