User:HM100/WQ2020A.css

/* A Wiki Digital Fonts - From Goolge Fonts */
@import url('https://fonts.googleapis.com/css?family=Actor|Aladin|Alice|Audiowide|Dancing+Script:400,700|David+Libre:400,500,700|Days+One|Didact+Gothic|Fira+Sans:100,200,300,400,500,600,700,800,900|Fjord+One|Fondamento|Forum|Lobster|Lobster+Two:400,700|Londrina+Solid:100,300,400,900|Lora:400,700|M+PLUS+1p:100,300,400,500,700,800,900|Magra|Mako|Roboto:100,300,400,500,700,900&subset=cyrillic,cyrillic-ext,greek,greek-ext,hebrew,japanese,latin-ext,vietnamese');
/* Rest or the CSS */
:root {
--local-nav-color:#da70d6;
--local-nav-rgb-dark:192,98,189;
--links-color-rgb:51,120,0;
--buttons-color-rgb:255,165,0;
--body-color:#f14700;
--designer-color:#f14700;
--main-font:"Arelousa", Audiowide, Orbitron;
--page-color-rgba:223,189,221;
--text-color:32,32,32; /* 223,223,223 or 32,32,32 */
}
 
 
body:not(.background-ad), body:not(.editor):not(.background-ad) .WikiaPage fieldset input:not([type="submit"]), body:not(.editor):not(.background-ad) .WikiaPage fieldset select {
    text-rendering:optimizeSpeed!important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family:"Arial Nova", Samsung Sans, Arial, sans-serif;
}
 
body:not(.editor):not(.background-ad) .WikiaPage input, body:not(.editor):not(.background-ad) .WikiaPage select {
    text-rendering: optimizeSpeed!important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family:"Arial Nova Cond", Arial Nova, Samsung Sans, Arial Narrow, Arial, sans-serif;
}
 
.WikiaPage fieldset {
border-radius:5px;
}
 
.editor {
margin-top:8px;
}
 
* {
outline:0;
box-sizing:content-box;
}
 
/* Control links to allow theming on them */
a, a:focus {
color:rgb(var(--links-color-rgb));
}
 
a:-moz-focusring { /* Firefox */
color:rgb(var(--links-color-rgb))!important;
}
 
a:-webkit-focusring {
color:rgb(var(--links-color-rgb))!important;
}
 
a:-focus-ring { /* Qorta V5-V7 */
color:rgb(var(--links-color-rgb))!important;
}
 
/* Ad skin improvements */
.background-ad *, .background-ad *:before, .background-ad *:after, .background-ad button, .background-ad input {
box-shadow:none!important;
text-shadow:none!important;
border-radius:0!important;
transition-property:color,background-color,opacity!important;
}
 
 
.background-ad {
margin-top:0!important;      
}
 
.background-ad .WikiaTopAds {
border-radius:initial!important;
}
 
/** Sequel changes **/
svg {
transition:none!important;
box-shadow:none!important;
font-family:initial!important;
text-shadow:none!important;
background-color:transparent!important;
}
 
svg:focus {
fill:var(--light-button-shadow)!important;
}
 
img {
fill:currentColor!important;
}
 
.WikiaMainContent {
font-family:"Segoe UI", Arial;
font-weight:200;
}
.WikiaMainContent b, .WikiaMainContent strong {
font-weight:600;
}
 
.editor .WikiaMainContent, .editor .WikiaMainContent b, .editor .WikiaMainContent strong {
font-weight:inherit;
}
 
/** Actual CSS **/
 
/* Section 1 -- Content Wrapper */

.WikiaPage {
    padding:10px;
    margin:0 -20px;
    background-color:var(--body-color);
    box-shadow:0 0 20px 3px currentColor;
}

.WikiaPage .WikiaPageContentWrapper, .WikiaPage #userProfileApp {
background-color:rgba(var(--page-color-rgba),0.8);
opacity:1;
margin-top:4.5px;
border-left:5px groove rgb(var(--buttons-color-rgb));
border-right:5px ridge rgb(var(--buttons-color-rgb));
border-radius:9px;
margin-left:13.5px;
margin-right:13.5px;
}
 
.WikiaPage .WikiaPageContentWrapper {
border-bottom:5px ridge rgb(var(--buttons-color-rgb));
}
 
.WikiaPage .WikiaPageContentWrapper, .WikiaPage #userProfileApp {
border-top:5px groove rgb(var(--buttons-color-rgb));
}
 
.WikiaPage #userProfileApp {
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
}
 
.WikiaPage #userProfileApp + .WikiaPageContentWrapper {
    border-top:0;
    border-top-left-radius:0;
    border-top-right-radius:0;
    margin-top:0;
}

.wds-global-footer {
    margin-top:0!important;
}

/* Section 2 -- Buttons */

.WikiaPage .wds-button, 

.oo-ui-buttonElement > .oo-ui-buttonElement-button {
    transition-duration:0.2s;
    transition-property:color,background-color,border-color,transform;
    border-radius:5px!important;
    margin:0 2px;
}

.WikiaPage .wds-button:not(.wds-is-secondary):not(.wds-is-text):not(:hover):not(:active):not(:focus),

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
    background-color:transparent!important;
    border-color:transparent!important;
}

.WikiaPage .wds-button:not(.wds-is-secondary):not(.wds-is-text), 

.oo-ui-buttonElement:not(.oo-ui-buttonElement-framed):not(.oo-ui-buttonElement-frameless) > .oo-ui-buttonElement-button,

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
    color:inherit!important;
}

.WikiaPage .wds-button:hover, .WikiaPage .wds-button:focus,

.oo-ui-buttonElement-framed:not(.oo-ui-flaggedElement-primary):not(.oo-ui-buttonElement-active).oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover, .oo-ui-buttonElement-framed:not(.oo-ui-flaggedElement-primary):not(.oo-ui-buttonElement-active).oo-ui-widget-enabled > .oo-ui-buttonElement-button:active, .oo-ui-buttonElement-framed:not(.oo-ui-flaggedElement-primary):not(.oo-ui-buttonElement-active).oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus ,

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:hover > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:hover > .oo-ui-buttonElement-button,

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:active > .oo-ui-buttonElement-button {
    transform:scale(0.9);
}

.WikiaPage .wds-button:not(.wds-is-secondary):not(.wds-is-text):hover,

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:hover > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:hover > .oo-ui-buttonElement-button,

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
    background-color: rgba(var(--buttons-color-rgb), 0.4)!important;
    border-color:rgba(var(--buttons-color-rgb), 0.4)!important;
}

.WikiaPage .wds-button:not(.wds-is-secondary):not(.wds-is-text):active, .WikiaPage .wds-button:not(.wds-is-secondary):not(.wds-is-text):focus,

.oo-ui-buttonElement-framed.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:active > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive:active > .oo-ui-buttonElement-button {
    background-color: rgba(var(--buttons-color-rgb), 0.6)!important;
    border-color:rgba(var(--buttons-color-rgb), 0.6)!important;
}

/* Section 3 -- Masthead */

#userProfileApp .user-identity-avatar__image {
border-radius:50% 100%;
transition:transform 600ms;
}

#userProfileApp .user-identity-avatar__image:hover {
border-radius:100% 50%;
transform:scale(0.8);
}

#userProfileApp .user-identity-header__tag {
border-radius:500px;
border:1px solid;
box-shadow:0 0 0.1px 0.1px;
text-transform:uppercase;
font-weight:500;
background-color:rgb(var(--links-color-rgb));

}

#userProfileApp .user-identity-box__info {
box-shadow:0 2px 10px 0 rgba(32,32,32,0.25),0 2px 10px 0 rgba(223,223,223,0.25);
border-radius:10px 10px 5px 5px;
padding:0 16px 8px 0;
background-color:rgb(var(--page-color-rgba));
}

#userProfileApp .user-identity-header {
padding:8px;
margin-top:0!important;
border-radius:10px 10px 0 0;
border-bottom:3px solid;
font-variant:small-caps;
background-color:rgba(var(--buttons-color-rgb),0.4);
}

#userProfileApp .user-identity-header__actions button {
margin:0;
}

#userProfileApp .modal-wrapper {
color:inherit;
background-color:transparent;
}

#userProfileApp ul.user-identity-stats, #userProfileApp .user-identity-bio, #userProfileApp .user-identity-social {
padding-left:8px;
}

#userProfileApp .user-identity-header__attributes {
    margin-top:0!important;
}

@media only screen and (max-width: 1023px) {
    #userProfileApp .user-identity-box {
        flex-direction:column;
        align-items:center;
    }
    
    #userProfileApp .user-identity-avatar {
        margin-right:0;
        margin-bottom:18px;
    }
    
    #userProfileApp .user-identity-header__actions button {
        padding-left:12px;
        padding-right:12px;
        font-size:10px;
    }
}

/* Section 4 - Page Header */

.WikiaPage .page-header__title:not(#lastEdited) {
font-size:28px;
font-family:var(--main-font), Arial Nova Cond, Arial Nova, Samsung Sans, Arial Narrow, Arial;
margin:4px 0;
}

.WikiaPage .page-header__title:not(#lastEdited):hover {
color:rgb(var(--links-color-rgb));
text-shadow:1px -1px 4px var(--body-color),
            -1px 1px 3px rgb(var(--links-color-rgb)),
            -1px 1px 3px var(--body-color),
            1px -1px 4px rgb(var(--links-color-rgb));
}

.WikiaPage .page-header__title:not(#lastEdited):active {
color:var(--body-color);
text-shadow:-1px 1px 2px rgb(var(--links-color-rgb)),
            1px -1px 1.5px var(--body-color),
            1px -1px 1.5px rgb(var(--links-color-rgb)),
            -1px 1px 2px var(--body-color);
}

.WikiaPage .page-header__title:not(#lastEdited) {
transition-duration:.25s;
transition-property:color, text-shadow;
}

@media only screen and (max-width: 1023px) {
    .WikiaPage .page-header__title:not(#lastEdited) {
        font-size:24px;
        margin:6px 0;
    }
}

/* Section 5 - WDS Community Header */

.WikiaPage .wds-community-header {
box-shadow: 0 0 20px 0 rgba(32,32,32,0.15) inset, 0 0 20px 0 rgba(223,223,223,0.15) inset;
border-radius:0 0 24px 24px;
border-top:1px solid rgba(var(--local-nav-rgb-dark),0.5);
border-right:1px solid rgba(var(--local-nav-rgb-dark),0.5);
border-bottom:15px ridge var(--local-nav-color);
border-left:1px solid rgba(var(--local-nav-rgb-dark),0.5);
box-sizing:content-box!important;
}

.WikiaPage .wds-community-header .wds-button.wds-is-secondary,  .WikiaPage .wds-community-header .wds-button-group > .wds-dropdown .wds-button.wds-is-secondary {
border:1px solid transparent!important;
background-color:transparent!important;
border-radius:5px!important;
transition-property:color, background-color, transform!important;
padding:7px 12px!important;
}

.WikiaPage .wds-community-header .wds-button.wds-is-secondary:hover, .WikiaPage .wds-community-header .wds-button-group > .wds-dropdown .wds-button.wds-is-secondary:hover {
background-color:rgba(var(--local-nav-rgb-dark),0.4)!important;
border:1px solid rgba(var(--local-nav-rgb-dark),0.4)!important;
}

.WikiaPage .wds-community-header .wds-button.wds-is-secondary:active, .WikiaPage .wds-community-header .wds-button-group > .wds-dropdown .wds-button.wds-is-secondary:active, .WikiaPage .wds-community-header .wds-button.wds-is-secondary:focus, .WikiaPage .wds-community-header .wds-button-group > .wds-dropdown .wds-button.wds-is-secondary:focus {
background-color:rgba(var(--local-nav-rgb-dark),0.6)!important;
border:1px solid rgba(var(--local-nav-rgb-dark),0.6)!important;
 }


/* Section 6 - Dropdown */

.page-header .wds-dropdown__content {
z-index:2!important;
}

.WikiaPage .WikiaPageContentWrapper .wds-button-group .wds-dropdown {position: static;}

.WikiaPage .WikiaPageContentWrapper .wds-button-group {
position:relative;
}

.WikiaPage .wds-list li a,.WikiaPage .wds-dropdown__content .wds-list.wds-is-linked>li>a  {
    background-color:var(--local-nav-color)!important;
    color:rgb(var(--text-color))!important;
    border:1px solid transparent;
    border-radius:9px!important;
    transition-property:background-color, color, transform!important;
    padding:10px;
}

.WikiaPage .wds-dropdown__content .wds-list.wds-is-linked>li:hover>a, .WikiaPage .wds-list li a:hover, #WikiaPage .wds-list li a.seclected {
    transform:scale(0.9);
    background-color:rgba(var(--text-color),0.120)!important;
    color:rgb(var(--links-color-rgb))!important;
    border:1px solid rgba(var(--text-color),0.3)!important;
    outline-offset:-1px;
}


.WikiaPage .wds-dropdown__content, .WikiaPage .wds-dropdown-level-2__content, .WikiaPage .wds-dropdown-level-3__content {
    background-color:var(--local-nav-color)!important;
    border-top-style:solid;
    border-top-width:1px;
    border-color:rgb(var(--local-nav-rgb-dark))!important;
    border-radius:9px!important;
    font-size:13px;
    color:rgb(var(--text-color))!important;
    box-shadow:0 2px 10px 0 rgba(32,32,32,0.25),0 2px 10px 0 rgba(223,223,223,0.25);
}


.WikiaPage .wds-dropdown::after {
border-bottom-color:var(--local-nav-color)!important;
}

.WikiaPage .wds-dropdown::before{
border-bottom-color:rgb(var(--local-nav-rgb-dark))!important;
}

.WikiaPage .wds-list::before,
.WikiaPage .wds-list::after {
    background-color: transparent !important;
}

.WikiaPage .wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-2 > a, .WikiaPage .wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-3 > a {
 padding-right:17px!important; /* Fixing small gap between the border and the chevron */
 }

.WikiaPage  .wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-2 > a:not(:hover), .WikiaPage .wds-dropdown__content .wds-list.wds-is-linked .wds-dropdown-level-3 > a:not(:hover) {
 border-right-color:transparent!important;
 border-top-right-radius:0!Important;
 border-bottom-right-radius:0!Important;
}