MediaWiki:Common.css
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
html { scroll-behavior: smooth; scroll-padding-top: 105px; } body { background-color: #1d1d1d; color: #ccc; font-family: 'Roboto', sans-serif; font-size: 15px; background-image: url(/aoc/images/2/2f/Aoc-bg-3.webp); background-repeat: no-repeat; background-size: contain; background-position: top; } footer { text-align: center; font-size: 80%; color: #ccc; } dd { margin-left: 1rem; } dt { color: #fff; } footer ul, .custom-footer ul { padding: 0; padding-bottom: 1rem; list-style-type: none; margin-bottom: 0; } /* :target:before { content: ""; display: block; height: 76px; margin: -76px 0 0; } */ .toc { float: right; background-color: #1d1d1d; padding: 0.75rem; margin-left: 1rem; margin-bottom: 1rem; border-radius: 0.25rem; } .toctogglespan { display: none; } .toc h2 { font-size: 1.75em; } .tocnumber { display: none; } .toc ul { list-style-type: none; margin-bottom: 0; padding-left: 1.5rem; } .toc > ul { padding-left: 0; } .toc li { margin-bottom: 0.25rem; } .toc li:last-child { margin-bottom: 0; } .toc li ul { margin-top: 0.25rem; } .footer-heading { font-size: 1rem; font-weight: 500; color: #fff; margin-bottom: 0.75rem; } h1, h2, h3, h4, h5, h6 { color: #fff; } .h3, h3 { font-size: 1.5rem; } a, .toctogglelabel { color: #f9a916; text-decoration: none; } a:hover, .toctogglelabel:hover { color: #fff; text-decoration: none; } .mw-mmv-post-image a { color: #0d6efd; } .mw-mmv-post-image a:hover { color: #0a58ca; } .mw-selflink.selflink { color: #fff; font-weight: bold; } .new { color: #e55757; } .front-title { font-size: 1.75em; color: #fff; margin-bottom: 1rem; font-weight: 500; } pre { background-color: #1d1d1d; padding: 1em; white-space: break-spaces; } .mw-editform #wpTextbox1 { width: 100%; display: unset; } .fixed-top { z-index: 999; } .navbar { box-shadow: 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%), 0 2px 4px -1px rgb(0 0 0 / 40%); } .bg-dark { background-color: #111111!important; } .navbar-dark .navbar-nav .nav-link { color: #cacaca; font-size: 13px; margin-left: 0.75rem; } .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { color: rgb(255 255 255); } .navbar-nav { width: 100%; } .navbar-nav .nav-item { white-space: nowrap; } .dropdown-toggle::after { color: #f9a916; vertical-align: middle; } .dropdown-icon { margin-right: 0.5rem; } #page-content { background-image: url(https://metabattle.com/wiki/images/1/1a/Main_bg_1.webp); background-repeat: no-repeat; background-position: bottom right; background-color: #111111; width: 100%; max-width: 1460px; margin: 0 auto; padding: 1rem; margin-top: 84px; } /*#content { margin-bottom: 2rem; }*/ #content .img-fluid { border-radius: 0.75rem; border: 5px solid #1d1d1d; } #sidebar { min-width: 300px; max-width: 300px; margin-left: 1rem; } #sidebar-float { position: sticky; top: 106px; } .printfooter { display: none; } .section-title { background: linear-gradient(135deg, rgb(255 255 255 / 5%) 30%, rgb(17 17 17) 100%); padding: 1rem; border-radius: 0.25rem; color: #fff; font-size: 1.1em; font-weight: 500; margin-bottom: 1rem; } .pvp-bg { background-image: url('/wiki/images/4/42/PvP_bg.webp'); background-repeat: no-repeat; } .wvw-bg { background-image: url('/wiki/images/f/f5/WvW_bg.webp'); background-repeat: no-repeat; } .fractal-bg { background-image: url('/wiki/images/e/e7/Fractal_bg.webp'); background-repeat: no-repeat; } .open-world-bg { background-image: url('/wiki/images/9/9b/Openworld_bg.webp'); background-repeat: no-repeat; } .raid-bg { background-image: url('/wiki/images/8/86/Raid_bg.webp'); background-repeat: no-repeat; } .f2p-bg { background-image: url('/wiki/images/b/be/F2P-bg.webp'); background-repeat: no-repeat; } .elementalist-bg { background-image: url('/wiki/images/9/94/Elementalist_bg.webp'); background-repeat: no-repeat; } .engineer-bg { background-image: url('/wiki/images/f/f8/Engineer_bg.webp'); background-repeat: no-repeat; } .guardian-bg { background-image: url('/wiki/images/9/9c/Guardian_bg.webp'); background-repeat: no-repeat; } .mesmer-bg { background-image: url('/wiki/images/c/cd/Mesmer_bg.webp'); background-repeat: no-repeat; } .necromancer-bg { background-image: url('/wiki/images/2/2a/Necromancer_bg.webp'); background-repeat: no-repeat; } .ranger-bg { background-image: url('/wiki/images/0/09/Ranger_bg.webp'); background-repeat: no-repeat; } .revenant-bg { background-image: url('/wiki/images/0/03/Revenant_bg.webp'); background-repeat: no-repeat; } .thief-bg { background-image: url('/wiki/images/4/46/Thief_bg.webp'); background-repeat: no-repeat; } .warrior-bg { background-image: url('/wiki/images/8/88/Warrior_bg.webp'); background-repeat: no-repeat; } .guide-row { border-radius: 0.25rem; background: rgba(255,255,255,0.025); } .guide-row:hover { border-radius: 0.25rem; background: rgba(255,255,255,0.1); } .build-row-bard { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/4/47/TUI_ArchetypeTreeBG_BardWide.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 38%; } .build-row-bard:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/4/47/TUI_ArchetypeTreeBG_BardWide.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 38%; } .build-row-cleric { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/7/7c/TUI_ArchetypeTreeBG_ClericWide.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 105% 33%; } .build-row-cleric:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/7/7c/TUI_ArchetypeTreeBG_ClericWide.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 105% 33%; } .build-row-fighter { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/6/66/TUI_ArchetypeTreeBG_Fighter.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 30%; } .build-row-fighter:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/6/66/TUI_ArchetypeTreeBG_Fighter.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 30%; } .build-row-mage { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/f/f1/TUI_ArchetypeTreeBG_MageWide.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 30%; } .build-row-mage:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/f/f1/TUI_ArchetypeTreeBG_MageWide.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 30%; } .build-row-ranger { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/e/e7/TUI_ArchetypeTreeBG_Ranger.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 30%; } .build-row-ranger:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/e/e7/TUI_ArchetypeTreeBG_Ranger.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 30%; } .build-row-rogue { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/7/78/TUI_ArchetypeTreeBG_RogueWide.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 20%; } .build-row-rogue:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/7/78/TUI_ArchetypeTreeBG_RogueWide.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 20%; } .build-row-tank { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(23 23 23 / 50%), #171717), url(/aoc/images/0/06/TUI_ArchetypeTreeBG_TankWide.webp); background-repeat: no-repeat; background-color: #171717; background-size: 60%; background-position: 100% 25%; } .build-row-tank:hover { margin-bottom: 1rem; border-radius: 0.25rem; background: linear-gradient(270deg, rgb(41 41 41 / 0%), #292929), url(/aoc/images/0/06/TUI_ArchetypeTreeBG_TankWide.webp); background-repeat: no-repeat; background-color: #292929; background-size: 60%; background-position: 100% 25%; } .build-row-header { background: #1d1d1d; color: #fff; padding: 0.5rem 2px 0.5rem 1rem; margin: 10px 0px; font-size: 16px; font-weight: 500 } .build-row-title { margin-left: 0.25rem; font-weight: 500; } .build-row-weapons { margin-right: 0.25rem; } .build-row-rating { height: 32px; display: flex; align-items: center; color: #fff; width: 38px; font-size: 14px; } .build-row-rating:hover { cursor: default; } .fivestars { background: rgb(51 153 102 / 10%); border: 1px solid rgb(51 153 102 / 50%); padding: 0 0.25rem; } .fourstars { background: rgb(51 102 255 / 10%); border: 1px solid rgb(51 102 255 / 50%); padding: 0 0.25rem; } .threestars { background: rgb(51 217 255 / 5%); border: 1px solid rgb(51 217 255 / 30%); padding: 0 0.25rem; } .onestar, .twostars { background: rgb(255 51 51 / 10%); border: 1px solid rgb(255 51 51 / 50%); padding: 0 0.25rem; } .zerostars { background: rgb(189 189 189 / 10%); border: 1px solid rgb(189 189 189 / 50%); padding: 0 0.25rem; } .build-header { background-color: #1d1d1d; padding: 0.75rem; } .build-header ul { padding-left: 0.75rem; margin-bottom: 0; } .orange-text { color: #f9a916; font-weight: 700; } .orange-header { background: linear-gradient(135deg,rgb(249 169 22 / 10%) 0%,rgb(29 29 29 / 0%) 100%); border-radius: 0.25rem; height: 100%; } .header-bard { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/f/f5/Bard_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-cleric { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/5/5b/Cleric_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-fighter { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/c/ce/Fighter_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-mage { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/5/54/Mage_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-ranger { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/d/d3/Ranger_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-rogue { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/b/b9/Rogue_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .header-tank { background: linear-gradient(rgb(17 17 17 / 25%), rgb(17 17 17 / 25%)), url(/aoc/images/5/56/Tank_eq.webp), linear-gradient(135deg, rgb(249 169 22 / 25%) 0%, rgb(29 29 29 / 0%) 100%); background-repeat: no-repeat; background-size: contain; background-position: right center; } .green-text { color: #30c179; font-weight: 700; } .green-header { background: linear-gradient(135deg,rgb(100 249 22 / 10%) 0%,rgb(29 29 29 / 0%) 100%); border-radius: 0.25rem; height: 100%; } .green-header li { color: #30c179; list-style-type: '\002B'; padding-inline-start: 0.75rem; } .red-header { background: linear-gradient(135deg,rgb(249 22 22 / 10%) 0%,rgb(29 29 29 / 0%) 100%); border-radius: 0.25rem; height: 100%; } .red-text { color: #ff3333; font-weight: 700; } .red-header li { color: #ff3333; list-style-type: '\2212'; padding-inline-start: 0.75rem; } .red-header li span, .green-header li span { color: #ccc; } .build-header p { margin-bottom: 0.5rem; } .build-header p:last-child { margin-bottom: 0; } .build-header-section { font-weight: 700; color: #fff; } .navbar .form-control { color: #cacaca; background-color: rgba(255,255,255,0.1); border: none; } .input-group-text { color: #cacaca; background-color: rgba(255,255,255,0.1); border: none; } .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) { margin-left: 0; } .dropdown-menu { background-color: #333333; border: none; border-radius: 0; font-size: 14px; z-index: 99999; } .dropdown-item { color: #fff; padding: .5rem 0.75rem; } .dropdown-item:focus, .dropdown-item:hover { color: #fff; background-color: #1d1d1d; } #pageActions { float: right; } #pageActions .dropdown-toggle::after { color: #111; } .alert { position: relative; padding: 1rem 1rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: 0; padding: 10px; } .alert-success { color: #fff; background-color: #1d1d1d; border-color: #458e46; line-height: 1.7; } .alert-danger { color: #fff; background-color: #1d1d1d; border-color: #b81818; line-height: 1.7; } .alert-primary { color: #fff; background-color: #1d1d1d; border-color: rgba(249,169,22,0.7); line-height: 1.7; } .alert-primary a { background: #f9a916; width: 100%; text-align: center; display: block; color: #111111; font-weight: 700; border-radius: 0.25rem; padding: 0.25rem; margin-top: 10px; } .alert-primary a:hover { color: #fff; } .alert-secondary { color: #fff; background-color: #1d1d1d; border-color: rgba(39,139,228,0.7); line-height: 1.7; } .mw-editsection-bracket { color: rgb(255 255 255 / 55%); } .mw-editsection { font-size: 12px; margin-left: 0.5rem; font-weight: 400; display: none; } .badge { padding: .5em .75em; margin-right: 0.5rem; } .bg-primary { background-color: #f9a916!important; } .bg-primary a { color: #111; font-weight: 500; } .bg-primary a:hover { color: #fff; } .border-hot { background: #b3e296; border: 2px solid #7dce4b!important; margin-left: 0.5rem; } .border-pof { background: #f0d3f1; border: 2px solid #ce4ba6!important; margin-left: 0.5rem; } .border-eod { background: #aaf4ff; border: 2px solid #31aec1!important; margin-left: 0.5rem; } .specialization-row { height: 140px; overflow: hidden; } .smwb-theme-light .smwb-title, .smwb-theme-light .smwb-center, .smwb-theme-light .smwb-actions, .smwb-theme-light .smwb-prophead { background-color: #1d1d1d; } .smwb-theme-light .smwb-factbox { border-left: 0.5em solid #1d1d1d; } .smwb-theme-light .smwb-propval { background-color: #1d1d1d; } .smwb-factbox .smwb-cell { border-top: 2px solid #111; } .smwb-theme-light .smwb-ifactbox { border-right: 0.5em solid #1d1d1d; } .smwb-ifactbox .smwb-cell { border-top: 2px solid #111; } .smwb-bottom { border-bottom: 2px solid #111;; } .wikitable { background: rgba(255,255,255,.025); } .wikitable>tr>th, .wikitable>*>tr>th { background: #1d1d1d; color: #fff; } .wikitable>tr>th, .wikitable>tr>td, .wikitable>*>tr>th, .wikitable>*>tr>td { border: 1px solid #111111; padding: 0.6em; } .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend { background-color: #1d1d1d; border: none; } .diff-context { background: #1d1d1d; color: #ccc; border-color: #000; } .diff-addedline, .diff-deletedline, .diff-context { border-radius: 0; } .diff-addedline { border-color: #5e9a6b; } .diff-addedline .diffchange { background: #5e9a6b; color: #111217; } .diff-deletedline { border-color: #9a5e5e; } .diff-deletedline .diffchange { background: #9a5e5e; color: #111217; } .mw-plusminus-pos { color: green; } .mw-plusminus-neg { color: red; } #pagehistory { margin-top: 1rem; } #pagehistory li.selected { background-color: #1d1d1d; color: #ccc; outline: 1px dashed #a2a9b1; } .dsq-widget-avatar { float: right!important; } .dsq-widget-list { padding-left: 0!important; } .dsq-widget-comment, .dsq-widget-meta, .dsq-widget-user { display: block!important; } .dsq-widget-item { padding: 1rem!important; background-color: #1d1d1d!important; margin: 0 0 1rem 0!important; } .default-box-inner { background: #111; padding: 0.5rem; margin-bottom: 1rem; } .collapsing { -webkit-transition: none; transition: none; } .brand-container, .ac-lre-playlist-horizontal { display: none !important; } .build-template-code { background: #1d1d1d; padding: 8px 15px; color: #fff; border-radius: 0.25rem; word-break: break-all; margin-bottom: 0.75rem; width: fit-content; font-size: 80%; } .build-template-button { padding: 8px 15px; background: #f9a916; color: #111; font-weight: bold; border-radius: 0.25rem; width: fit-content; font-size: 80%; } .build-template-button:hover { cursor: pointer; opacity: .5; } .patrollink{ display: none; } .build-rate a { color: #16f947 !important; } .buy-button { margin-top: 1rem; } .buy-button:hover, .buy-button:focus, .buy-button:active { opacity: .7; } li.gallerybox div.thumb { background: #1d1d1d; border: none; } .toggle-title { background-color: #333; padding: 10px; font-weight: 500; display: flex; width: fit-content; } .toggle-title:hover { opacity: 0.5; cursor: pointer; } .toggle-content { background-color: #1d1d1d; padding: 10px; display: block; width: fit-content; } blockquote { margin: 0; background: #1d1d1d; padding: 1rem; } .mw-search-profile-tabs { background: #1d1d1d; border: none; } #mw-searchoptions { background-color: #1d1d1d; border: none; border-top: 1px solid #111; padding: 1rem; } #mw-searchoptions .divider { border-bottom: 1px solid #111111; margin-left: -1rem; margin-right: -1rem; } .search-types .current a { color: #fff; font-weight: 500; } .tier-list { padding: 1rem 2rem!important; font-size: 24px; border-right: 2px solid #111!important; } .tier-s { color: rgb(255, 127, 127)!important; background: rgb(255 127 127 / 20%)!important; } .tier-a { color: rgb(255, 191, 127)!important; background: rgb(255 191 127 / 20%)!important; } .tier-b { color: rgb(255, 223, 127)!important; background: rgb(255 223 127 / 20%)!important; } .tier-c { color: rgb(255 255 127)!important; background: rgb(255 255 127 / 20%)!important; } .tier-d { color: rgb(191, 255, 127)!important; background: rgb(191 255 127 / 20%)!important; } .tier-e { color: rgb(127, 255, 127)!important; background: rgb(127 255 127 / 20%)!important; } .tier-f { color: rgb(127, 255, 255)!important; background: rgb(127 255 255 / 20%)!important; } .oo-ui-panelLayout-framed { border: none; background-color: #1d1d1d; } .oo-ui-tabSelectWidget-framed { background-color: #111111; } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected { background-color: #1d1d1d; color: #fff; } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget .oo-ui-labelElement-label { border-bottom: none; } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover { background-color: rgb(29 29 29); color: #ffffff; } .mw-prefs-buttons { background-color: #292929; border-top: 1px solid #111111; padding-left: 1rem; } .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button { background-color: #1d1d1d; color: #fff; border-color: transparent; } .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button:hover { cursor: pointer; background: hsl(0deg 0% 100% / 20%); } .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover { background-color: #1d1d1d; } .mw-filepage-resolutioninfo { font-size: initial; } .mw-category-group li { margin-bottom: 0.5rem; } .builds-menu { min-width: 400px; } .guides-menu { min-width: 600px; } .dropdown-header { color: rgb(255 255 255 / 50%); padding: 0.5rem 0.75rem; } .mw-collapsible dl { margin: 0; padding: 0.5rem; } #BFdQrXovnYka { display: none; position: relative; padding: 1rem 1rem; margin-bottom: 1rem; border: 2px solid transparent; border-radius: 0; padding: 10px; color: #fff; background-color: #1d1d1d; border-color: #8e4545; line-height: 1.7; } .collapseMB { padding: 0.5rem 1rem; background-color: #333; font-weight: 500; width: fit-content; margin-bottom: 0.25rem; } .collapseMB:hover { opacity: 0.5; cursor: pointer; } .collapseContent { display: none; padding: 0.5rem; background: #1d1d1d; width: fit-content; margin-bottom: 1rem; } .collapseContent > *:last-child { margin-bottom: 0!important; } .pvp-stats-header { background: #1d1d1d; color: #fff; padding: 0.5rem 1rem; border-left: 2px solid #5865f2; margin-bottom: 0.5rem; } .default-box-2 { background: rgba(255,255,255,0.025); padding: 1rem; } .mw-mmv-image-metadata { margin-top: 0; } .gw2a--LWWFA { vertical-align: middle; } /* ConfirmEdit QuestyCaptcha -- on Create Account */ .htmlform-tip + .mw-htmlform-field-HTMLInfoField { color:red; } /* ConfirmEdit QuestyCaptcha -- on Edit page + add a URL */ label[for=wpCaptchaWord] { color: green; font-weight: bold; font-size: 150%; font-style: italic; } .difficulty-pip { width: 5px; background: rgb(255 255 255 / 15%); margin-right: 4px; border-radius: 1rem; height: 60%; } .pip-1 { background: #458e46; } .pip-2 { background: rgba(249,169,22,0.7); } .pip-3 { background: #b81818; } .difficulty-pip:last-child { margin-right: 0; } .rarity-Common { color: rgb(183 183 183); } .rarity-Uncommon { color: rgb(83 198 117); } .rarity-Rare { color: rgb(101 176 252); } .rarity-Heroic { color: rgb(255 255 0); } .rarity-Epic { color: rgb(169 121 203); } .rarity-Legendary { color: rgb(255 165 0); } .tooltip { opacity: 1 !important; color: #fff !important; } .hover-tooltip { cursor: help; } .tooltip-inner { padding: 0; background-color: #000; text-align: left; max-width: 400px!important; } .tooltip-arrow { display: none!important; } .skill-container { height: auto; width: auto; position: relative; } .skill-bar-heading { font-weight: 500; color: #fff; } .rotation-container { margin-bottom: 1rem; } .rotation-title { color: #fff; font-weight: 500; margin-bottom: 0.75rem; } .rotation-arrow { margin: 0 2px; } .skill-number { position: absolute; right: 0; bottom: 0; background: rgb(255 255 255 / 20%); color: #fff; padding: 0px 4px; font-size: 10px; } #footer-privacy, #footer-about, #footer-disclaimer { display: none; } .tippy-box[data-theme~='metabattle'] .tippy-content { padding: 0; } .build-card { background-color: rgba(255,255,255,0.025); padding: 0.75rem; border-radius: 0.5rem; text-align: center; background-repeat: no-repeat; background-position: center; font-size: 12px; height: 100%; min-height: 120px; } .build-card:hover { background-color: rgba(255,255,255,0.1); } .card-bard { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/4/47/TUI_ArchetypeTreeBG_BardWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-bard:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/4/47/TUI_ArchetypeTreeBG_BardWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-cleric { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/7/7c/TUI_ArchetypeTreeBG_ClericWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-cleric:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/7/7c/TUI_ArchetypeTreeBG_ClericWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-fighter { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/6/66/TUI_ArchetypeTreeBG_Fighter.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-fighter:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/6/66/TUI_ArchetypeTreeBG_Fighter.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-mage { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/f/f1/TUI_ArchetypeTreeBG_MageWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-mage:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/f/f1/TUI_ArchetypeTreeBG_MageWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-ranger { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/e/e7/TUI_ArchetypeTreeBG_Ranger.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-ranger:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/e/e7/TUI_ArchetypeTreeBG_Ranger.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-rogue { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/7/78/TUI_ArchetypeTreeBG_RogueWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-rogue:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/7/78/TUI_ArchetypeTreeBG_RogueWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-tank { background: linear-gradient(270deg, rgb(17 17 17 / 50%), rgb(17 17 17 / 50%)), url(/aoc/images/0/06/TUI_ArchetypeTreeBG_TankWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .card-tank:hover { background: linear-gradient(270deg, rgb(17 17 17 / 0%), rgb(17 17 17 / 50%)), url(/aoc/images/0/06/TUI_ArchetypeTreeBG_TankWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } .build-card a { color: #fff; font-weight: 500; text-shadow: 2px 1px #000; font-size: 20px; } .build-card a:hover { color: #f9a916; } .build-card img:hover { opacity: 0.75; } .card-line { background-color: #f9a916; width: 32px; height: 1px; display: block; margin: 5px auto; } .nav-tabs .nav-link { margin-right: 0.5rem; } .mw-parser-output .nav-tabs .nav-item.show .nav-link, .mw-parser-output .nav-tabs .nav-link.active { color: #fff; background-color: #151515; font-weight: 700; cursor: default; border: 1px solid #2a2b2b; border-bottom: 1px solid #151515; } .mw-parser-output .nav-tabs { border-color: transparent; margin-bottom: -1px; } .mw-parser-output .nav-link:focus, .mw-parser-output .nav-link:hover { color: #fff; } .mw-parser-output .nav-link { color: #f9a916; font-weight: 700; } .mw-parser-output .nav-tabs .nav-link:focus, .mw-parser-output .nav-tabs .nav-link:hover { cursor: pointer; background: #151515; border: 1px solid #2a2b2b; border-bottom: 1px solid #151515; } .absolute { position: absolute; top: 0; left: 0; } .grayscale-1 { filter: grayscale(1); } .bg-secondary { background-color: rgba(255,255,255,.1)!important; color: rgba(255,255,255,.5); margin-top: 0.35rem; font-weight: 100; font-size: 0.7em; } li b { color: #05a37e; } .oo-ui-windowManager-modal > .oo-ui-dialog.oo-ui-window-setup { z-index: 999; } .network-banner { background-color: #111111; position: fixed; top: 0; width: 100%; border-bottom: 1px solid rgb(34 34 34); z-index: 999; height: 37px; -ms-overflow-style: none; scrollbar-width: none; white-space: nowrap; overflow-y: auto; } .network-banner::-webkit-scrollbar { display: none; } .network-banner a { color: #cacaca; padding: 6px 12px; opacity: 0.35; font-size: 13px; } .network-banner a:hover { color: #fff; opacity: 1; } .navbar-toggler-icon { width: 1.25em; height: 1.25em; } .navbar-toggler { border: none; } ::marker { font-size: 18px; font-weight: bold; } .modal-content { background-color: #15131b; border: 1px solid #2a2b2b; } .modal-header { border-bottom: 1px solid #2a2b2b; } .btn-close { background: #ffffff var(--bs-btn-close-bg) center / 1em auto no-repeat; margin: unset!important; } .btn-close:hover { cursor: pointer; } .default-box { display: flow-root; background-color: rgba(255, 255, 255, 0.04); padding: 0.75rem; border-radius: 0.5rem; border: 1px solid rgba(255, 255, 255, 0.05); margin-bottom: 2rem; } .default-box h2 { font-size: 1.1rem; margin-bottom: 0.75rem; border-left: 4px solid #f9a916; padding: 0.5rem 1rem; } .accordion-button { background: linear-gradient(135deg, rgba(249, 169, 22, 0.2) 0%, rgba(51, 153, 102, 0.2) 33%, rgba(51, 102, 255, 0.2) 66%, rgba(203, 36, 180, 0.2) 100%); color: #fff; padding: 0.5rem 0.75rem; user-select: none; } .accordion-button:hover { cursor: pointer; opacity: 0.75; } .accordion-item { border: none; } .accordion-body { color: #ccc; background: #1d1d1d; padding: 1rem; } .accordion-button:not(.collapsed) { background-color: #111111; box-shadow: none; color: #fff; } .accordion-button::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); } .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); } .tree { max-width: fit-content; border-radius: 0.5rem; border: 1px solid rgb(34 34 35); } #tree-bard { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/4/47/TUI_ArchetypeTreeBG_BardWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; display: grid; } #tree-cleric { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/7/7c/TUI_ArchetypeTreeBG_ClericWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-fighter { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/6/66/TUI_ArchetypeTreeBG_Fighter.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-mage { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/f/f1/TUI_ArchetypeTreeBG_MageWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-ranger { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/e/e7/TUI_ArchetypeTreeBG_Ranger.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-rogue { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/7/78/TUI_ArchetypeTreeBG_RogueWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-tank { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/0/06/TUI_ArchetypeTreeBG_TankWide.webp); background-repeat: no-repeat; background-size: cover; background-position: right; } #tree-book { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/d/d2/Book_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-greatsword { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/8/84/Greatsword_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-longbow { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/b/be/Longbow_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-dagger { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/b/b6/Dagger_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-mace { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/5/58/Mace_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-scepter { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/8/8b/Scepter_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-shortbow { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/f/fd/Shortbow_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-sword { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/d/d4/Sword_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-wand { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/7/7d/Wand_tree_bg.webp); background-repeat: no-repeat; background-size: cover; background-position: left; display: grid; } #tree-stamina { background: linear-gradient(rgb(17 17 17 / 75%), rgb(17 17 17 / 75%)), url(/aoc/images/3/35/TUI_SkillTreeBG_Universal.webp), #151515; background-repeat: no-repeat; background-size: cover; background-position: center; } .skill-tree-entry { min-width: 40px; min-height: 40px; z-index: 998; } .skill-tree-entry-img { outline: 2px solid #f9a916; } .skill-tree-entry-img:hover { opacity: 100 !important; cursor: help; } .opacity-15 { opacity: .15 !important; } .equipment-container { max-width: fit-content; border-radius: 0.5rem; border: 1px solid rgb(34 34 35); background: #151515; } .equipment-entry { height: 60px; width: 60px; } .equipment-entry img { padding: 5px; } .equipment-entry-bg { background-image: url(/aoc/images/a/ac/Char_Item_Slot_backImg.webp); background-size: contain; } .upgrade-order { position: absolute; top: -3px; right: -3px; background: #ffffff; color: #000000; padding: 0 3px; font-size: 9px; font-weight: 500; } .inline-skill { padding-left: 1px; background-color: rgb(249 169 21 / 10%); margin: 3px 0; } .mb-5 { margin-bottom: 4rem !important; } .rounded-circle { overflow: hidden; } .eq-container { max-width: 400px; width: 100%; border-radius: 0.5rem; border: 1px solid rgb(34 34 35); } .eq-bard { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/f/f5/Bard_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-cleric { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/5/5b/Cleric_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-fighter { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/c/ce/Fighter_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-mage { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/5/54/Mage_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-ranger { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/d/d3/Ranger_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-rogue { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/b/b9/Rogue_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-tank { background: linear-gradient(rgb(17 17 17 / 60%), rgb(17 17 17 / 60%)), url(/aoc/images/5/56/Tank_eq.webp); background-repeat: no-repeat; background-size: cover; background-position: center; } .eq-entry { padding: 2px; border-radius: 0.5rem; border: 1px solid rgb(255 165 0 / 50%); background: rgb(27 27 27); } @media (min-width: 768px) { .dropdown:hover > .dropdown-menu-auto { display: block; margin-top: 0; } } @media (max-width: 425px) { #pageActions { float: none; margin-bottom: .5rem; text-align: right; } } @media (max-width: 541px) { .toc { float: none; margin-left: 0; } } @media (max-width: 650px) { .section-entry-quick-browse, .section-quick-browse { display: none; } } @media (max-width: 767px) { #eq-box-1 { margin-right: 0; border-right: none; margin-bottom: 1.5rem; border-bottom: 2px solid #1d1d1d; } } @media (max-width: 991px) { .builds-menu, .guides-menu { min-width: unset; } .dropdown-menu { margin-bottom: 1rem; } } @media (max-width: 1080px) { #sidebar { display: none; } } @media (min-width: 1200px) { #other-builds { font-size: 2rem!important; } }