User:Sanhard/universal.css

/*
 * Styles in this stylesheet will be loaded on desktop and mobile
 * For desktop-only styles use Common.css
 * For mobile-only styles use Mobile.css

/* .ability-background { }
 * === Ability template ===

/*
 * === FONTS ===

@font-face { font-family: 'Open Sans Semibold'; src: local('Open Sans Semibold'), url('/media/hydra/fonts/OpenSans-Semibold.ttf') format('truetype'); }

/*
 * === GENERAL STYLES ===

/*
 * Definition styles

dfn { font-weight: bold; font-style: normal; }

/*
 * Reference styles

ol.references { font-size: 90%; }

.references-small { font-size: 80%; }

/* Temporary visual fix for the second square bracket not being part of the link. */ sup.reference { color: #3f56ad; }

/*
 * Userlink styles

/* User agnostic styling */

.mw-userlink { font-weight: bold; }

.burbg, .admbg, .modbg, .locbg { padding: 0 2px; background-color: #70b04a; color: white; font-size: .7em; }

.mw-userlink[title='User:'] { text-transform: lowercase; }
 * 1) pt-userpage a[href='/wiki/User:'],

/* Admin Lime Color */

.mw-userlink[title='User:Bu3ny'], .mw-userlink[title='User:ChocolateWaffle'], .mw-userlink[title='User:Hefaistus'], .mw-userlink[title='User:Hybridshiek'], .mw-userlink[title='User:JanMayen'], .mw-userlink[title='User:Kroocsiogsi'], .mw-userlink[title='User:Lagg5302'], .mw-userlink[title='User:Lancey34'], .mw-userlink[title='User:Lemoncream'], .mw-userlink[title='User:LingoSalad'], .mw-userlink[title='User:Litzsch'], .mw-userlink[title='User:Medok'], .mw-userlink[title='User:Molldust'], .mw-userlink[title='User:Mpcovcd'], .mw-userlink[title='User:Muriloricci'], .mw-userlink[title='User:Nickoladze'], .mw-userlink[title='User:Psion1C'], .mw-userlink[title='User:Redefining history'], .mw-userlink[title='User:SevenFiveSeven'], .mw-userlink[title='User:Sanhard'], .mw-userlink[title='User:Vi3trice'], .mw-userlink[title='User:WindPowa'] { color: #52d017 !important; }

/* Bot Purple Color */

a[class='mw-userlink'][title='User:GuideBot'], a[class='mw-userlink'][title='User:FreemBOT'], a[class='mw-userlink'][title='User:HefBOT'], a[class='mw-userlink'][title='User:KrooBot'], a[class='mw-userlink'][title='User:Litzschbot'], a[class='mw-userlink'][title='User:MedokBOT'], a[class='mw-userlink'][title='User:Mollborg'], a[class='mw-userlink'][title='User:RBotson'], a[class='mw-userlink'][title='User:Sanhardbot'], a[class='mw-userlink'][title='User:Staywikibot'], a[class='mw-userlink'][title='User:WindBOT'], a[class='mw-userlink'][title=''], .robot, .bot { color: #fe48aa; }

/*
 * Horizontal list (.hlist) styles

.hlist ul { margin: 0; }

.hlist li { display: inline; margin: 0; white-space: nowrap; }

/* Display nested lists inline */ .hlist ul ul { display: inline; }

/* Generate interpuncts */ .hlist li:after { content: ' ·'; font-weight: bold; }

.hlist li:last-child:after { content: none; }

/* Add parens around nested lists */ .hlist ul ul:before { content: '('; }

.hlist ul ul:after { content: ')'; }

/*
 * Unbulleted (.plainlist) styles

.plainlist ul { margin: 0; list-style: none none; line-height: inherit; }

.plainlist ul li { margin-bottom: 0; }

/*
 * Webm autoloop spacing fix

.autoloop, .loop { display: block; }

td .autoloop, td .loop { width: 100% !important; height: 100% !important; object-fit: unset; max-width: 800px !important; }

/*
 * Pixel-art images

img.pixelart { image-rendering:-moz-crisp-edges; image-rendering:-o-crisp-edges; image-rendering:-webkit-optimize-contrast; -ms-interpolation-mode:nearest-neighbor; image-rendering:crisp-edges; image-rendering:pixelated; }

/*
 * === TEMPLATE STYLES ===

/*
 * Image links (Template:Ability ID, Template:Hero ID, …)

.image-link { white-space: nowrap; }

/*
 * Ambox styles (Template:Ambox)

.ambox { width: 80%; display: flex; align-items: center; margin: 0 auto 2px auto; padding: 0.5em; background-color: #eeeeee; border-left: 10px solid #eeeeee; font-size: 95%; }

.ambox-image { padding-right: 0.5em; width: 56px; text-align: center; }

.ambox-quote { font-style: italic; }

.ambox-subject { font-weight: bold; }

.ambox-quote, .ambox-footnote { font-size: 85%; }

/*
 * Animatrion styles (Template:Animate)

.animated > *:not(.animated-active), .animated-paused > *:not(.animated-active), .animated > .animated-subframe > *:not(.animated-active), .animated-paused > .animated-subframe > *:not(.animated-active) { display: none; }

/*
 * Hero infobox styles (Template:Hero infobox)

/* Highlight the primary attribute icon */ border: 2px solid white; border-radius: 50%; }
 * 1) primaryAttribute img {

/*
 * Cosmetic Item infobox styles (Template:Cosmetic item infobox)

.buynow_wrapper { height: 24px; }

.buynow_wrapper>a { width: 100%; color: #FFF; text-decoration: none; }

.buynow_button { display: block; padding-left: 30px; height: 24px; background: linear-gradient(0deg, #000 0%, #666 100%); color: #FFF; text-align: left; text-decoration: none; font-size: 90%; line-height: 24px; }

.buynow_button:hover { background: linear-gradient(0deg, #000 0%, #999 100%); }

.buynow_store:before { position: absolute; margin-left: -31px; width: 24px; height: 24px; background: url('/media/7/73/Button_buynow_store.png') no-repeat; content: ''; pointer-events: none; }

.buynow_market:before { position: absolute; margin-left: -31px; width: 24px; height: 24px; background: url('/media/a/aa/Button_buynow_market.png') no-repeat; content: ''; pointer-events: none; }

/*
 * Navbox styling (Template:Navbox)

table.notanavbox { clear: both; margin: auto; padding: 1px; width: 100%; /* notanavbox container style */ border: 1px solid #b44335; background: #fefeff; text-align: center; font-size: 88%; }

table.notanavbox + table.notanavbox { /* Single pixel border between adjacent notanavboxes */ margin-top: -1px; /* (doesn't work for IE6, but that's okay)	  */ }

.notanavbox-title, .notanavbox-abovebelow, table.notanavbox th { padding-right: 1em; /* Title and above/below styles */ padding-left: 1em; text-align: center; }

table.notanavbox th a { color: #e4c62e; /* Should make the header links look better */ }

.notanavbox-group { padding-right: 1em; padding-left: 1em; text-align: right; /* Group style */ white-space: nowrap; font-weight: bold; }

.notanavbox, .notanavbox-subgroup { background: #fefeff; /* Background color */ }

.notanavbox-list { border-color: #fefeff; /* Must match background color */ }

.notanavbox-title, table.notanavbox th { background: #cd5f51; /* Level 1 color */ color: #fff; /* text colour */ }

.notanavbox-abovebelow, .notanavbox-group, .notanavbox-subgroup .notanavbox-title { background: #fde6e3; /* Level 2 color */ color: #2d2723; }

.notanavbox-subgroup .notanavbox-group, .notanavbox-subgroup .notanavbox-abovebelow { background: #ffe8e5; /* Level 3 color */ }

.notanavbox tr { background-color: #fefeff; /* Standard cell background */ }

.notanavbox-even { background: #f2f2f2; /* Even row striping */ }

.notanavbox-odd { background: transparent; /* Odd row striping */ }

/*
 * Tabber styles (Template:Tabber)

.page-tabber { display: -webkit-box; display: -ms-flexbox; display: flex; overflow-x: auto; margin-bottom: 20px; }

.page-tabber-tab { padding: .5em; border: solid #93b7d8; white-space: nowrap; line-height: .95em; }

.page-tabber-tab.active-tab { border-width: 2px 2px 0; font-weight: bold; }

.page-tabber-tab.inactive-tab { border-width: 1px 1px 2px; background-color: #dae8f5; }

.page-tabber-separator { border-bottom: 2px solid #93b7d8; }

.page-tabber-separator.tail { width: 100%; }

/*
 * Teambox styles (Template:Teambox, Template:TeamEntry)

.teambox { width: 200px; text-align: center; }

.teambox-image { display: flex; flex-direction: column; justify-content: center; height: 125px; border: 1px solid #ccc; background: #fcfcfc; }

.teambox-name { font-weight: bold; }

/*
 * Patch styles (Template:Patch layout)

.patch-layout { width: 100%; border: 1px solid #aaa; text-align: center; }

.patch-layout-last { background: #B2D7E9; }

.patch-layout-all { width: 27%; background: #DEE8ED; }

.patch-layout-background { background-color: #FDFAF8; border: 1px solid #aaa; margin: 0.75em 0; padding: 0.75em 1em; padding-bottom: 1em; }

/*
 * Event Currency Colors

.bp2019 { color: #8C1BCD; }

.bp2018 { color: #3EC415; }

.bp2017 { color: #08D8D8; }

.bp2016 { color: #E60000; }

.dotaplus { color: #D37708; }

/*
 * AudioButton extension styles
 * These FontAwesome icons are licensed under the Creative Commons Attribution 4.0 International license: https://fontawesome.com/license

a.ext-audiobutton:before { display: inline-block; width: 1em; vertical-align: middle; }

a.ext-audiobutton[ data-state='play' ]:before { content: url('data:image/svg+xml; utf8,  '); }

a.ext-audiobutton[ data-state='pause' ]:before { content: url('data:image/svg+xml; utf8,  '); }

a.ext-audiobutton[ data-state='play' ]:hover:before { content: url('data:image/svg+xml; utf8,  '); }

a.ext-audiobutton[ data-state='pause' ]:hover:before { content: url('data:image/svg+xml; utf8,  '); }

a.ext-audiobutton[ data-state='error' ]:before { content: url('data:image/svg+xml; utf8,  '); }