Line 1,717: |
Line 1,717: |
| background: url(images/8/83/Summer2020EventBanner.png) no-repeat center center; | | background: url(images/8/83/Summer2020EventBanner.png) no-repeat center center; |
| } | | } |
| + | |
| + | /* |
| + | From https://gbf.wiki/MediaWiki:Common.css |
| + | Provides the classes used by Template:Tooltip |
| + | Author: Tsubakura |
| + | */ |
| + | |
| + | .tooltip { |
| + | position: relative; |
| + | display: inline; |
| + | border-bottom: 1px dotted black; |
| + | font-size: inherit; |
| + | padding: inherit; |
| + | } |
| + | |
| + | .tooltiptext { |
| + | visibility: hidden; |
| + | padding: 12px 14px; |
| + | |
| + | position: absolute; |
| + | left: 50%; |
| + | bottom: calc(20px + 100%); |
| + | z-index: 99999; |
| + | |
| + | background: #fff; |
| + | box-shadow: 0 2px 0 0 rgba(0,0,0,0.15); |
| + | border: 1px solid #a2a9b1; |
| + | border-radius: 2px; |
| + | |
| + | white-space: normal; |
| + | font-weight: normal; |
| + | font-style: normal; |
| + | text-align: center; |
| + | font-size: 14px; |
| + | line-height: 1.6; |
| + | } |
| + | |
| + | .tooltiptext:after, |
| + | .tooltiptext:before { |
| + | content: ''; |
| + | position: absolute; |
| + | left: 50%; |
| + | border-style: solid; |
| + | } |
| + | |
| + | .tooltiptext:after { |
| + | top: 100%; |
| + | bottom: auto; |
| + | width: 20px; |
| + | height: 20px; |
| + | background: #fff; |
| + | margin-top: -10px; |
| + | margin-left: -10px; |
| + | box-shadow: 1px 1px 0px #a2a9b1; |
| + | transform: rotate(45deg); |
| + | border-width: 0; |
| + | } |
| + | |
| + | .tooltiptext:before { |
| + | top: 100%; |
| + | bottom: auto; |
| + | border-width: 18px; |
| + | margin-left: -18px; |
| + | border-color: rgba(0,0,0,0.15) transparent transparent transparent; |
| + | pointer-events: none; |
| + | } |
| + | |
| + | .tooltip .tooltip .tooltiptext, |
| + | .header-fixed-helper .tooltip .tooltiptext { |
| + | bottom: auto; |
| + | top: calc(20px + 100%); |
| + | } |
| + | |
| + | .tooltip .tooltip .tooltiptext:after, |
| + | .header-fixed-helper .tooltip .tooltiptext:after { |
| + | top: auto; |
| + | bottom: 100%; |
| + | border-width: 15px; |
| + | margin-left: -15px; |
| + | border-color: transparent transparent white transparent; |
| + | width: 0; |
| + | height: 0; |
| + | box-shadow: none; |
| + | background: none; |
| + | transform: none; |
| + | } |
| + | |
| + | .tooltip .tooltip .tooltiptext:before, |
| + | .header-fixed-helper .tooltip .tooltiptext:before { |
| + | top: auto; |
| + | bottom: 100%; |
| + | border-width: 16px; |
| + | margin-left: -16px; |
| + | border-color: transparent transparent #888 transparent; |
| + | } |
| + | |
| + | .tooltiptext span.hr { |
| + | display: block; |
| + | height: 1px; |
| + | background-color: #a2a9b1; |
| + | } |
| + | |
| + | .tooltiptext hr, |
| + | .tooltiptext span.hr { |
| + | margin: 10px 0 12px; |
| + | position: relative; |
| + | background: none; |
| + | } |
| + | |
| + | .tooltiptext hr:after, |
| + | .tooltiptext span.hr:after { |
| + | content: ''; |
| + | display: block; |
| + | width: 100%; |
| + | height: 1px !important; |
| + | position: absolute; |
| + | left: -14px; |
| + | background: #a2a9b1; |
| + | padding: 0 14px; |
| + | } |
| + | |
| + | .tooltip:hover > .tooltiptext, |
| + | .tooltip.hover > .tooltiptext { |
| + | visibility: visible; |
| + | } |
| + | |
| + | .tooltiptext { |
| + | opacity: 0; |
| + | transition: opacity 200ms ease, visibility 0s ease 200ms, transform 200ms ease; |
| + | transform: translate(-50%, 8px); |
| + | } |
| + | |
| + | .tooltip .tooltip .tooltiptext, |
| + | .header-fixed-helper .tooltip .tooltiptext { |
| + | transform: translate(-50%, -8px); |
| + | } |
| + | |
| + | .tooltip:hover > .tooltiptext, |
| + | .tooltip.hover > .tooltiptext { |
| + | opacity: 1; |
| + | transition-delay: 0s; |
| + | transform: translate(-50%, 0); |
| + | } |
| + | |
| + | .tooltiptext a { color: #0645ad; border-bottom: 0; } |
| + | .tooltiptext a:visited { color: #0b0080; } |
| + | .tooltiptext a:active { color: #faa700; } |
| + | .tooltiptext a:hover, a:focus { text-decoration: underline; } |
| + | .tooltiptext { color: #252525; } |
| + | .tooltiptext a.new { color: #ba0000; } |
| + | |
| + | .mw-body-content { z-index: auto !important;} |