MediaWiki:Wikia.css

/* Font body */ .WikiaPage { font-family: 'Montserrat'; border: 1px solid #000; border:1; }

/* Background (Credits to UtauSteam) */ @media screen and (min-width: 1025px) { body.skin-oasis { background-image: linear-gradient(#0C0D12,#2E2D3D) }

.WikiaSiteWrapper .WikiaPage { padding-top: 0; }	.WikiaPage .WikiaPageContentWrapper { position: relative; }	.WikiaPage .WikiaPageContentWrapper::before { opacity: 2; background: #fff url("https://static.wikia.nocookie.net/kda-lol/images/8/8b/BackgroundKDA.jpg/revision/latest?cb=20200828102743") center fixed; background-size: 1280px; content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; } }

/*Avatar Style -Credit to ITZY Wiki*/ .increase img { opacity: 1; filter: alpha(opacity=100); transition: all 0.6s ease; }

.increase img:hover { opacity: 0.8; filter: alpha(opacity=80); transform:scaleX(1.05) scaleY(1.05); }

.hoverimage img { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; opacity: 1; filter: alpha(opacity=100); }

.hoverimage img:hover { opacity: 0.5; filter: alpha(opacity=50); }

.grayscalehover { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; transition: all 1s ease; }

.grayscalehover:hover { -webkit-filter: invert(100%); }

.hoverspin img { opacity: 1; filter: alpha(opacity=100); transition: all 0.6s ease; }

.hoverspin img:hover { opacity: 0.5; filter: alpha(opacity=50); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } /** Rotate **/ .rotate img { opacity: 1; filter: alpha(opacity=100); transition: all 1.5s ease; }

.rotate img:hover { opacity: 0.5; filter: alpha(opacity=50); -webkit-transform: rotateY(360deg); -moz-transform: rotateY(360deg); -o-transform: rotateY(360deg); -ms-transform: rotateY(360deg); transform: rotateY(360deg); } /*End*/ /* Spanse */ .spanse, .spancr, .spanmm, .spanen, .spanqunew, .spansk{ float:left; display: block; position: relative; z-index: 99; }

.spanse2, .spancr2, .spanmm2, .spanen2, .spanqunew2, .spansk2{ transition-duration: 1s; transition-timing-function: ease-out; display: block; position: absolute; z-index: 100; }

.spanse2, .spancr2, .spanmm2, .spanen2, .spanqunew2, .spansk2 { opacity: 0; }

.spanse2:hover, .spanmm2:hover, .spanen2:hover, .spancr2:hover, .spanqunew2:hover, .spansk2:hover{ opacity: 100; } /*End*/

/* Albums -Credit to BLACKPINK Wiki*/

.book-container, .book-container-comic { -moz-perspective: 1200px; -webkit-perspective: 1200px; -moz-user-select: none; -webkit-user-select: none; user-select: none; -khtml-user-drag: none; -moz-user-drag: none; -ms-user-drag: none; -webkit-user-drag: none; user-drag: none; display: block; margin: 0 auto; perspective: 1200px; width: 250px; } .book-container { width: 250px; } .book-container-comic { width: 150px; } .book, .book-comic { -moz-transform-origin: 125px 0; -moz-transform-style: preserve-3d; -moz-transition: 0.75s; -webkit-transform-origin: 125px 0; -webkit-transform-style: preserve-3d; -webkit-transition: 0.75s; box-shadow: 0 2px 4px rgba(227, 109, 118, 0.25); transform-origin: 125px 0; transform-style: preserve-3d; transition: 0.75s; z-index: 5; } .book:after, .book-comic:after { bottom: 0; content: ""; left: 3px; position: absolute; top: 0; width: 7px; z-index: 20; } .book:hover { -moz-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); -webkit-transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); transform: translateX(-10px) translateZ(35px) translateX(35px) rotateY(45deg); } .book-comic:hover { -moz-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); -webkit-transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); transform: translateX(-10px) translateZ(5px) translateX(5px) rotateY(45deg); } .book-cover { position: relative; z-index: 10; } .book-cover img { height: auto; max-width: 100%; vertical-align: bottom; } .book-spine { background: url(https://i.imgur.com/Mshm8sZ.png); } .book-spine-comic1 { background: #cdd2dd; } .book-spine-comic2 { background: #75B7EB; } .book-spine-comic3 { background: black; }

.book-spine-comic1, .book-spine-comic2, .book-spine-comic3, .book-spine { -moz-transform-origin: 0; -moz-transform: rotateY(-90deg) translateX(-49px); -webkit-transform-origin: 0; -webkit-transform: rotateY(-90deg) translateX(-49px); background-size: auto 100%; bottom: 0; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25); color: #fff; smargin-left: 5px; overflow: hidden; position: absolute; top: 0; transform-origin: 0; z-index: 5; } .book-spine { transform: rotateY(-90deg) translateX(-30px); width: 30px; } .book-spine-comic1, .book-spine-comic2, .book-spine-comic3 { transform: rotateY(-90deg) translateX(-20px); width: 20px; } .book-spine-comic1 h1, .book-spine-comic2 h1, .book-spine-comic3 h1, .book-spine h1 { -moz-transform-origin: 0; -moz-transform: rotateZ(90deg); -webkit-font-smoothing: antialiased; -webkit-transform-origin: 0; -webkit-transform: rotateZ(90deg); color: #fff; display: block; font-size: 2em; font-weight: normal; left: 39px; opacity: 0.75; position: absolute; text-align: left; text-indent: 43px; text-transform: uppercase; top: 0; transform-origin: 0; transform: rotateZ(90deg); width: 250px; } .book-spine-comic1:before, .book-spine-comic2:before, .book-spine-comic3:before, .book-spine:before { content: ""; display: block; height: 100%; width: 100%; } /*End*/

/* Portable Infobox */ .portable-infobox { border-radius: 10px; border: 3px ridge gray; color: white; } .portable-infobox .pi-header, .portable-infobox .pi-title, .portable-infobox .pi-navigation { margin: 2px; padding: 0; } .portable-infobox .pi-item-spacing { padding: 2px; text-align: center; } .pi-background { background: transparent; } .pi-image img { height: auto; width: 100%; } .pi-border-color { border-color: gray; } .pi-title, .pi-data-label, .pi-secondary-background { background-color: gray; } .pi-title { border-radius: 6px 6px 0 0; font-weight: bold; } .pi-header, .pi-data-label { border-radius: 0 0 0 0; } .pi-data-label { flex-direction: column; justify-content: center; } .pi-data-value { color: #FFFFFF; margin: 0.4em 0; } .pi-navigation:nth-child(2) { margin-bottom: 0; } .pi-navigation:nth-child(3) { border-top: 1px dotted black; font-style: italic; font-weight: normal; margin-top: 0; } .pi-navigation:last-child { border-radius: 0 0 6px 6px; } .pi-navigation:last-child a { color: black; } .pi-horizontal-group { padding: 2px }

/* Lyrics */ .pi-theme-lyrics { width: 100%; float: center; clear: none !important; font-weight: bold; }

.pi-theme-lyrics .pi-header { display: none; }

/* Tabber customized */ ul.tabbernav {font-family: Rubik; font-weight:bold !important; padding:5px 0px !important; border: none !important; } ul.tabbernav li a {padding:5px 5px !important; margin-left:0px !important; border:0 !important; background: transparent !important; transition-duration: 1s !important; transition-timing-function: ease-out !important;} ul.tabbernav li a:link {color:#ffffff  !important; border-bottom: 2px solid gray !important; margin-right: 2px !important;} ul.tabbernav li a:visited {color: #ffffff !important; border-bottom: 2px solid gray !important; margin-right: 2px !important;} ul.tabbernav li a:hover {color:#ffffff !important; border-bottom: 2px solid gray !important; background-color: transparent !important; margin-right: 2px !important; transition-duration: 1s !important; transition-timing-function: ease-out !important;} ul.tabbernav li.tabberactive a {color:#ffffff !important; border-bottom: 2px solid gray !important; background-color: transparent !important; margin-right: 2px !important;} ul.tabbernav li.tabberactive a:hover {border-bottom: 2px solid gray !important; margin-right: 2px !important;} .tabberlive .tabbertab {border:0px solid #DCDCDC33 !important; border-top:0 !important;} /*End*/

/* Wordmark (Credits to Jiaer) */ .wds-community-header__wordmark img { opacity: 0.9; filter: alpha(opacity=100); transition: all 1.5s ease; } .wds-community-header__wordmark img:hover { opacity: 0; filter: alpha(opacity=50); } /*End*/

/* Links */ .WikiaPage a { font-weight: bold; transition: opacity 0.3s ease; } .WikiaPage a:hover { color: #fff; text-shadow: 0 0 2px currentColor; }

/*Category */ border: none; border-left: 5px #fff; background-color: transparent; padding: 0.5em; } .special-categories a { font-size: 14px; text-transform: uppercase; font-weight: bold; display: inline-block; margin-top: 5px; } .CategorySelect.articlePage .category a { color: white; } .CategorySelect.articlePage .category { border: none; background-color: gray; padding: 0.5em; margin-bottom: 8px; } .CategorySelect.articlePage .add { background-color: transparent; font-size: 10px; text-transform: uppercase; font-weight: bold; border-radius: 0; border-color: currentColor; color: currentColor; padding: 5px 12px; height: 18px; margin-top: 3px; } .CategorySelect.articlePage.editMode .input { background-color: transparent; margin: 10px; } .CategorySelect.articlePage .category.new { border: none; background-color: gray; margin: 3px; padding: 0.5em; } .tool.editCategory.sprite-small.edit { -webkit-mask-image: url(/extensions/wikia/DesignSystem/bower_components/design-system/dist/svg/wds-icons-pencil-small.svg); -mask-image: url(/extensions/wikia/DesignSystem/bower_components/design-system/dist/svg/wds-icons-pencil-small.svg); background-image: none; background-color: currentColor; height: 18px; width: 18px; transform: scale(0.75); margin-top: -3px; } .tool.removeCategory.sprite-small.delete { border: none; -webkit-mask-image: url(/extensions/wikia/DesignSystem/bower_components/design-system/dist/svg/wds-icons-trash-small.svg); -mask-image: url(/extensions/wikia/DesignSystem/bower_components/design-system/dist/svg/wds-icons-trash-small.svg); background-image: none; background-color: currentColor; height: 18px; width: 18px; transform: scale(0.75); margin-top: -3px; margin-left: -5px; margin-right: -5px; -webkit-mask-repeat: no-repeat; }   padding: 7px 12px; background-image: none; background-color: transparent; border-radius: 0; border-color: currentColor; color: currentColor; font-size: 10px; text-transform: uppercase; font-weight: bold; height: 35px; }   background-image: none; border-radius: 0; font-size: 10px; text-transform: uppercase; font-weight: bold; padding: 7px 12px; height: 35px; } .CategorySelect.articlePage.editMode > .toolbar { border: none; background-color: transparent; }
 * 1) articleCategories {
 * 1) CategorySelectCancel {
 * 1) CategorySelectSave {

.WikiaSearch .side-articles.RailModule, .WikiaRail .custom-cql#mwModule, .WikiaSearch .exact-wiki-match, .WikiaRail .rail-module, .WikiaRail #cql-module, padding: 0; border: none; background: transparent; border-radius:8px 0px 0px 0px!important; border:0.5px solid #eee; padding: 20px 10px 10px; margin: 0 0 30px 0; }
 * 1) WikiaRail > .module {

/* Navigation Bar Hover */ @keyframes topnav-Dropdown { 0%{opacity: 0; top: 30px;} 100%{opacity: 1; top: 40px;} } @-webkit-keyframes topnav-Dropdown { 0%{opacity: 0; top: 30px;} 100%{opacity: 1; top: 40px;} } @keyframes Dropdown { 0%{opacity: 0; transform: translateX(-10px);} 100%{opacity: 1; transform: translateX(0);} } @-webkit-keyframes Dropdown { 0%{opacity: 0; transform: translateX(-10px);} 100%{opacity: 1; transform: translateX(0);} } @keyframes global-Dropdown { 0%{opacity: 0; top: 45px;} 100%{opacity: 1;} } @-webkit-keyframes global-Dropdown { 0%{opacity: 0; top: 45px;} 100% {opacity: 1;} } @keyframes contribution-Dropdown { 0%{opacity: 0; top: 25px;} 100%{opacity: 1; top: 35px;} } @-webkit-keyframes contribution-Dropdown { 0%{opacity: 0; top: 25px;} 100%{opacity: 1; top: 35px;} } @-webkit-keyframes searchsuggestions-Dropdown { 0%{top: 80%; opacity: 0;} 100%{top: calc(1px+100%); opacity: 1;} } @keyframes searchsuggestions-Dropdown { 0%{top: 80%; opacity: 0;} 100%{top: calc(1px+100%); opacity: 1;} }

.wds-icon-tiny { transition: transform 0.2s; } .wds-community-header .wds-community-header__local-navigation .wds-tabs .wds-tabs__tab .wds-dropdown .wds-dropdown__content { animation: topnav-Dropdown 0.2s; -webkit-animation: topnav-Dropdown 0.2s; -moz-animation: topnav-Dropdown 0.2s; } .wds-community-header .wds-community-header__local-navigation .wds-tabs .wds-tabs__tab .wds-dropdown .wds-dropdown__content .wds-dropdown-level-2__content { animation: Dropdown 0.2s; -webkit-animation: Dropdown 0.2s; -moz-animation: Dropdown 0.2s; } .page-header .page-header__contribution .page-header__contribution-buttons .wds-button-group .wds-dropdown .wds-dropdown__content, #PageHeader #EditMessageWallGreeting .wds-button-group .wds-dropdown .wds-dropdown__content, .wds-community-header__wiki-buttons .wds-dropdown .wds-dropdown__content { -webkit-animation: contribution-Dropdown 0.2s; -moz-animation: contribution-Dropdown 0.2s; animation: contribution-Dropdown 0.2s; } .wds-dropdown__content.wds-global-navigation__search-suggestions { -webkit-animation: searchsuggestions-Dropdown 0.25s; -moz-animation: searchsuggestions-Dropdown 0.25s; animation: searchsuggestions-Dropdown 0.25s; } .wds-dropdown::after, .wds-dropdown::before { display: none !important; }   transition: transform cubic-bezier(0.66, 0.52, 0.25, 1.25) 0.25s; }   transform: rotate(180deg); }
 * 1) wds-icons-dropdown-tiny {
 * 1) wds-icons-dropdown-tiny:hover {