Pearl Dental Software Wiki

MediaWiki:Common.css: Difference between revisions

MediaWiki:Common.css (view source)

Revision as of 12:24, 24 January 2023

2,922 bytes removed ,  12:24, 24 January 2023
no edit summary
No edit summary
No edit summary
Tag: Manual revert
 
(43 intermediate revisions by the same user not shown)
Line 3: Line 3:
#ca-talk { display:none !important; }
#ca-talk { display:none !important; }
#footer-poweredbyico { display: none; }
#footer-poweredbyico { display: none; }
body { background: #acccb4; }
 
body.page-Main_Page.action-view .catlinks,
body.page-Main_Page.action-view #contentSub,
body.page-Main_Page.action-view #siteNotice {
    display: none;
}
body.page-Main_Page h1.firstHeading { display: none; }
body.page-Main_Page h1.firstHeading { display: none; }
:root {
:root {
     --body-main: #e8f1ea;
     --body-main: #ffffff;
     --body-light: #e8f1ea;
     --body-light: #e8f1ea;
     --body-mid: #ACCCB4;
     --body-mid: #ACCCB4;
Line 12: Line 18:
     --body-border: #2f4d36;
     --body-border: #2f4d36;
     --body-background-color: #acccb4;
     --body-background-color: #acccb4;
     --button-background: #ECF3EE;
     --found: #4c7c58;
     --button-color: #fff;
     --button-color: #ffffff;
     --button-border: #ECF3EE;
     --button-border: #ECF3EE;
     --button-dark: #ECF3EE;
     --button-dark: #ECF3EE;
    --button-background: #ACCCB4;
     --button-light: #ECF3EE;
     --button-light: #ECF3EE;
     --sidebar: #000000;
     --sidebar: #000000;
     --background-text-color: #444;
     --background-text-color: #444;
     --background-link-color: #52351e;
     --background-link-color: #212152;
     --search-box: #efeee6;
     --search-box: #ECF3ED;
     --link-color: #273f2d;
     --link-color: #273f2d;
     --redlink-color: #ba0000;
     --redlink-color: #ba0000;
Line 29: Line 36:




 
@font-face {
    font-family: 'IBM Plex Sans';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('filepath://IBMPlexSans-Regular.woff2') format('woff2');
}


:root {
:root {
Line 72: Line 85:
.mw-body-content h5,
.mw-body-content h5,
.mw-body-content h6 {
.mw-body-content h6 {
     font-family: 'PT Serif', 'Palatino', 'Georgia', serif;
     font-family: 'Open Sans','sans-serif', 'PT Serif', 'Palatino', 'Georgia', serif;
}
}


Line 2,700: Line 2,713:
}
}


.inventorytable .inv-quantity-text,
:root {
.lootingbagtable .inv-quantity-text,
    --transcript-border-color: #b4a36a;
.runepouchtable .inv-quantity-text,
     --transcript-border-hover-color: #88701d;
.equipment .inv-quantity-text {
     --filter-transcript-icon: none;
    font-family: 'RuneScape Small';
     font-size: 12pt;
    position: absolute;
    top: -8px;
    left: 4px;
    text-shadow: #000 1px 1px;
    color: #ffff00;
     pointer-events: none;
}
}


.inventorytable .inv-quantity-text.qty-1,
.transcript {
.lootingbagtable .inv-quantity-text.qty-1,
    background: var(--body-light);
.runepouchtable .inv-quantity-text.qty-1,
    border-radius: 0 0 120px 120px / 0 0 8px 8px;
.equipment .inv-quantity-text.qty-1 {
    box-shadow: 0 5px 7px -7px rgba(0, 0, 0, 0.4);
     color: #ffff00;
    width: 50%;
    overflow: hidden;
    margin-bottom: 1em;
    padding: 0.5em 1em 1em 1em;
     clear: left;
}
}


.inventorytable .inv-quantity-text.qty-100k,
.transcript.godletter {
.lootingbagtable .inv-quantity-text.qty-100k,
    margin: 20px auto;
.runepouchtable .inv-quantity-text.qty-100k,
     padding: 20px 30px;
.equipment .inv-quantity-text.qty-100k {
     color: #fff;
}
}


.inventorytable .inv-quantity-text.qty-10m,
.quest-action {
.lootingbagtable .inv-quantity-text.qty-10m,
    text-align: center;
.runepouchtable .inv-quantity-text.qty-10m,
    font-style: italic;
.equipment .inv-quantity-text.qty-10m {
     margin: 0 5%;
     color: #01ff80;
}
}


.runepouchtable .inv-quantity-text {
.quest-action:before,
     left: -1px;
.quest-action:after {
     content: '———';
    margin: 4px;
    letter-spacing: -1px;
}
}


.runepouchtable td.middle-rune .inv-quantity-text {
.speaksin-list ul {
     left: 23px;
     display: grid;
}
    grid-template-columns: repeat(2, 1fr);
 
     grid-gap: 0.15em 1.6em;
.equipment .inv-quantity-text {
     top: -3px;
}
}


span.noted-item {
.transcript-chatbox-image {
     width: 30px;
     display: inline-block;
     height: 29px;
    margin-right: 5px;
     position: relative;
     text-align: center;
     text-align: center;
     display: inline-block;
     width: 32px;
}
}


span.noted-item a {
.transcript-chatbox-image + .transcript-chatbox-image {
     width: 30px;
     left: -10px;
     height: 29px;
    top: 10px;
     margin-right: 0;
}
}


.noted-item a {
.transcript-opt::before {
     background-image: url('filepath://Bank_note.png');
    content: '';
     background: url('/images/Black-chevron.svg');
     background-repeat: no-repeat;
     background-repeat: no-repeat;
    filter: var(--filter-transcript-icon);
     display: inline-block;
     display: inline-block;
     background-position: center;
     width: 7px;
    height: 10px;
    margin-right: 5px;
}
}


td.noted-item a {
.transcript-opt.disabled {
     width: 32px;
     filter: opacity(0.5);
    line-height: 28px;
}
}


.noted-item img {
:root {
     transform: scale(0.65);
     --blockquote-color: #444e5a;
}
}


.equipment {
.quote-source {
    background: var(--equipment-background-color);
     text-align: right;
    border: 9px solid transparent;
    border-image-source: var(--equipment-border-image-source);
    border-image-slice: 9;
    border-image-width: 9px;
    border-image-outset: 0;
     border-image-repeat: repeat;
    margin: 7px 0;
}
}


.equipment-div,
.quote-source::before {
.equipment-div-buttons {
     content: '— ';
    background-repeat: no-repeat;
    background-position: top left;
    position: relative;
    width: 175px;
    margin: 5px;
     display: flex;
}
}


.equipment-div {
blockquote {
     background-image: var(--equipment-div-background-image);
     color: var(--blockquote-color);
    height: 222px;
}
}


.equipment-div-buttons {
.mw-body-content blockquote {
     background-image: var(--equipment-div-buttons-background-image);
     border-color: var(--body-mid);
    height: 244px;
}
}


.equipment-blank {
:root {
     background-image: var(--equipment-blank-background-image);
     --byline-arrow-filter: invert(29%) sepia(0%) saturate(376%) hue-rotate(172deg) brightness(87%) contrast(80%);
     width: 36px;
    --tile-border-color: #FBFDFC;
     height: 36px;
    --tile-background-color: #D9E9DE;
    --tile-link-button-color: #f5e9db;
    --tile-link-button-highlight-color: #dfccb0;
    --tile-dark-color: #fff;
    --tile-dark-bg: #5d6773;
    --tile-dark-link-color: #ccc;
     --tile-dark-byline-color: rgba(255, 255, 255, 0.7);
     --tile-dark-header-color: #fff;
}
}


.equipment-left {
.tile {
     float: left;
    background: var(--tile-background-color);
     clear: left;
    border: 1px solid var(--tile-border-color);
     margin-right: 7px;
     box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
     padding: 1.5em 2em 1em;
     max-width: 40em;
}
}


.equipment-center {
.tile h2 {
     margin-left: auto;
    font-size: 1.4em;
     margin-right: auto;
     font-weight: bold;
    border: none;
     margin: 0 0 0.4em;
}
}


.equipment-right {
.tile .byline + h2 {
    float: right;
     margin-top: -0.5em;
    clear: right;
     margin-left: 7px;
}
}


.equipment-stats,
.tile.dark {
.equipment-ikod {
     color: var(--tile-dark-color);
     font-family: 'RuneScape';
     background: var(--tile-dark-bg);
    font-size: 16px;
     border: none;
    line-height: 14px;
     box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
     color: #ff981f;
    text-shadow: 1px 1px 0 black;
}
 
td.equipment-stats b {
    font-family: 'RuneScape';
    font-weight: bold;
     display: block;
     margin-top: 2px;
}
}


td.equipment-stats data {
.tile.dark h2 {
     display: block;
     color: var(--tile-dark-header-color);
    padding-left: 8px;
}
}


td.equipment-stats data img {
.tile.dark a {
     vertical-align: bottom;
     color: var(--tile-dark-link-color);
}
}


td.equipment-ikod {
.tile.dark .byline {
     max-width: 325px;
     color: var(--tile-dark-byline-color);
}
}


td.equipment-ikod em {
.byline {
     font-style: normal;
     font-size: 0.9em;
     display: block;
     color: var(--byline-color);
    margin-bottom: 3px;
}
}


td.equipment-ikod b {
.byline a {
     font-weight: normal;
     color: var(--byline-color);
    color: white;
}
}


td.equipment-ikod strong {
.tile-row {
     font-weight: normal;
     display: flex;
     color: red;
    flex-flow: row wrap;
     margin-bottom: 1em;
}
}


td.equipment-ikod ul {
.tile-halves {
     list-style: none;
     display: flex;
     margin: 0;
    flex-flow: row wrap;
     border: 1px solid var(--tile-border-color);
    background: var(--tile-background-color);
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}
}


td.equipment-ikod li {
.tile-halves h2 {
     display: inline-block;
     font-size: 1.4em;
    width: 32px;
     font-weight: bold;
     height: 32px;
     border: none;
     line-height: 32px;
     margin: 0 0 0.4em;
     margin: 0;
    margin-right: 14px;
}
}


td.equipment-ikod img {
.tile-halves .byline + h2 {
     cursor: help;
     margin-top: -0.5em;
}
}


td.equipment-ikod hr {
.tile-top {
     border-top: 1px solid #0e0e0c;
     width: 100%;
     border-bottom: 1px solid #474745;
     padding: 1.3rem 1.5rem 0.6rem;
    margin: 7px 0;
}
}


.equipment-plinkp {
.tile-top.tile-image {
    position: absolute;
    width: 36px;
    height: 36px;
    left: 0px;
     display: flex;
     display: flex;
    justify-content: center;
     align-items: center;
     align-items: center;
    background-color: var(--byline-color);
    overflow: hidden;
    padding: 0;
    height: 13vw;
    max-height: 12em;
    transition: 0.4s ease-out;
}
}


.equipment-head,
.tile-halves:hover .tile-top.tile-image img {
.equipment-cape,
     transform: scale(1.1);
.equipment-neck,
     transition: 0.5s ease-out;
.equipment-ammo,
.equipment-weapon,
.equipment-torso,
.equipment-shield,
.equipment-legs,
.equipment-gloves,
.equipment-boots,
.equipment-ring,
.equipment-statsbutton,
.equipment-ikodbutton {
     position: absolute;
     display: flex;
    justify-content: center;
    align-items: center;
}
}


.equipment-head {
.tile-top.tile-image a {
     left: 70px;
     width: 100%;
    top: 0px;
}
}


.equipment-cape {
.tile-top.tile-image img {
     left: 29px;
     width: 100%;
     top: 39px;
    object-fit: cover;
    max-height: 200px;
     transition: 0.4s ease-out;
}
}


.equipment-neck {
.tile-bottom {
     left: 70px;
     background: var(--tile-background-color);
     top: 39px;
     border-top: 1px solid var(--tile-border-color);
}
     width: 100%;
 
     padding: 1rem 1.5rem 0.6rem;
.equipment-ammo {
     left: 111px;
     top: 39px;
}
}


.equipment-weapon {
.tile-bottom.link-button {
     left: 14px;
     align-self: flex-end;
     top: 78px;
     padding: 0;
}
}


.equipment-torso {
.tile-bottom.link-button a {
     left: 70px;
     display: block;
     top: 78px;
    text-align: center;
     padding: 0.75em 1.5em 0.8em;
    text-decoration: none;
}
}


.equipment-shield {
.tile-bottom.read-more {
     left: 126px;
     background: var(--tile-link-button-color);
     top: 78px;
     transition: 0.3s ease-out;
}
}


.equipment-legs {
.tile-bottom.read-more a {
     left: 70px;
     color: var(--byline-color);
     top: 118px;
    font-weight: bold;
     text-align: right;
}
}


.equipment-gloves {
.tile-bottom.read-more:hover {
     left: 14px;
     background: var(--tile-link-button-highlight-color);
    top: 158px;
}
}


.equipment-boots {
.tile-bottom.read-more:hover .arrow {
     left: 70px;
     transform: translateX(50%);
    top: 158px;
}
}


.equipment-ring {
.tile-bottom.read-more .arrow {
     left: 126px;
     filter: var(--byline-arrow-filter);
     top: 158px;
    margin-left: 0.4em;
     transition: 0.3s ease-out;
}
}


.equipment-statsbutton {
.tile.oswf-day {
     top: 204px;
     margin-left: 0.5em;
    left: 0px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    box-shadow: 2px 2px 3px black;
}
}


.equipment-ikodbutton {
.oswf-tile {
     top: 204px;
     margin: 1em;
    left: 90px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    box-shadow: 2px 2px 3px black;
}
}


:root {
.oswf-tile.oswf-complete {
    --transcript-border-color: #b4a36a;
     opacity: 0.65;
    --transcript-border-hover-color: #88701d;
     --filter-transcript-icon: none;
}
}


.transcript {
.oswf-tile .oswf-summary {
    background: var(--body-light);
     font-size: 105%;
     border-radius: 0 0 120px 120px / 0 0 8px 8px;
     line-height: 1.6;
     box-shadow: 0 5px 7px -7px rgba(0, 0, 0, 0.4);
     margin-top: -0.4em;
    width: 50%;
    overflow: hidden;
     margin-bottom: 1em;
    padding: 0.5em 1em 1em 1em;
    clear: left;
}
}


.transcript.godletter {
.oswf-tile .oswf-img {
     margin: 20px auto;
     display: block;
     padding: 20px 30px;
     max-width: 75px;
    float: right;
}
}


.quest-action {
.oswf-tile .oswf-img img {
     text-align: center;
     max-width: 100%;
    font-style: italic;
     height: auto;
     margin: 0 5%;
}
}


.quest-action:before,
.oswf-tile .oswf-guidance {
.quest-action:after {
     border-top: 1px solid #eee;
     content: '———';
     padding-top: 1em;
     margin: 4px;
    letter-spacing: -1px;
}
}


.speaksin-list ul {
:root {
     display: grid;
     --mainpage-recent-updates-description-color: #333;
     grid-template-columns: repeat(2, 1fr);
     --bigtile-background-color: #f9f3eb;
     grid-gap: 0.15em 1.6em;
    --bigtile-background-fade-zero: rgba(249, 243, 235, 0);
     --bigtile-background-fade-seventyfive: rgba(249, 243, 235, 0.75);
}
}


.transcript-chatbox-image {
.mainpage-header {
     display: inline-block;
     display: flex;
     margin-right: 5px;
     margin: 2.6em 1.75em 1.5em;
    position: relative;
    text-align: center;
    width: 32px;
}
}


.transcript-chatbox-image + .transcript-chatbox-image {
.mainpage-header .header-intro {
     left: -10px;
     flex: 2;
    top: 10px;
    margin-right: 0;
}
}


.transcript-opt::before {
.mainpage-header .header-intro h1 {
     content: '';
     font-size: 2.5em;
    background: url('/images/Black-chevron.svg');
     font-weight: bold;
    background-repeat: no-repeat;
     border: none;
     filter: var(--filter-transcript-icon);
     margin: 0 0 0.15em;
    display: inline-block;
     width: 7px;
    height: 10px;
     margin-right: 5px;
}
}


.transcript-opt.disabled {
.mainpage-header .header-intro p {
     filter: opacity(0.5);
     font-size: 1.1em;
    line-height: 1.7em;
}
}


:root {
.mainpage-header .header-stats {
     --blockquote-color: #444e5a;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
     margin-top: -1em;
}
 
.mainpage-header .header-stats ul {
    list-style: none;
}
}


.quote-source {
.mainpage-body {
     text-align: right;
     display: flex;
    flex-flow: row wrap;
}
}


.quote-source::before {
.mainpage-body h2 a {
     content: '— ';
     color: var(--text-color);
}
}


blockquote {
.mainpage-body .tile {
     color: var(--blockquote-color);
     padding-left: 1.75em;
    padding-right: 1.75em;
    max-width: 100%;
}
}


.mw-body-content blockquote {
.mainpage-body .tile-row {
     border-color: var(--body-mid);
     width: 100%;
    margin-bottom: 0.9rem;
}
}


:root {
.mainpage-left {
     --byline-arrow-filter: invert(29%) sepia(0%) saturate(376%) hue-rotate(172deg) brightness(87%) contrast(80%);
     flex: 2;
     --tile-border-color: #FBFDFC;
     display: flex;
     --tile-background-color: #D9E9DE;
     flex-flow: column wrap;
     --tile-link-button-color: #f5e9db;
     margin-right: 0.9rem;
    --tile-link-button-highlight-color: #dfccb0;
    --tile-dark-color: #fff;
    --tile-dark-bg: #5d6773;
    --tile-dark-link-color: #ccc;
    --tile-dark-byline-color: rgba(255, 255, 255, 0.7);
    --tile-dark-header-color: #fff;
}
}


.tile {
.mainpage-left > * {
     background: var(--tile-background-color);
     margin: 0 0 0.9rem;
    border: 1px solid var(--tile-border-color);
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
    padding: 1.5em 2em 1em;
    max-width: 40em;
}
}


.tile h2 {
.mainpage-right {
     font-size: 1.4em;
     flex: 1;
     font-weight: bold;
     display: flex;
     border: none;
     flex-flow: column wrap;
    margin: 0 0 0.4em;
}
}


.tile .byline + h2 {
.mainpage-right > * {
     margin-top: -0.5em;
     margin: 0 0 0.9rem;
}
}


.tile.dark {
.arrow {
     color: var(--tile-dark-color);
     background: url('filepath://White-chevron.svg') no-repeat;
     background: var(--tile-dark-bg);
     display: inline-block;
     border: none;
     height: 0.7rem;
     box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
     width: 0.45rem;
    vertical-align: middle;
}
}


.tile.dark h2 {
.arrow.dark {
     color: var(--tile-dark-header-color);
     filter: invert(80%);
}
}


.tile.dark a {
.mainpage-recent-updates .tile-halves {
     color: var(--tile-dark-link-color);
     flex: 1;
    align-content: flex-start;
    margin-right: 0.9rem;
}
}


.tile.dark .byline {
.mainpage-recent-updates .tile-halves:hover .tile-top img {
     color: var(--tile-dark-byline-color);
     transform: scale(1.04);
}
}


.byline {
.mainpage-recent-updates .tile-halves:last-child {
     font-size: 0.9em;
     margin-right: 0;
    color: var(--byline-color);
}
}


.byline a {
.mainpage-recent-updates .tile-bottom.link-button a {
     color: var(--byline-color);
     text-align: left;
    padding: 1rem 1.5rem 0.75rem;
}
}


.tile-row {
.mainpage-recent-updates h2 {
     display: flex;
     margin: -0.5em 0 0.3em;
    flex-flow: row wrap;
    margin-bottom: 1em;
}
}


.tile-halves {
.mainpage-recent-updates p:not(.byline) {
     display: flex;
     font-size: 0.9em;
     flex-flow: row wrap;
     line-height: 1.75em;
     border: 1px solid var(--tile-border-color);
     color: var(--mainpage-recent-updates-description-color);
    background: var(--tile-background-color);
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}
}


.tile-halves h2 {
.mainpage-contents .tile-halves {
     font-size: 1.4em;
     flex: 1;
     font-weight: bold;
     margin-right: 0.9rem;
    border: none;
    margin: 0 0 0.4em;
}
}


.tile-halves .byline + h2 {
.mainpage-contents .tile-halves:last-child {
     margin-top: -0.5em;
     margin-right: 0;
}
}


.tile-top {
.mainpage-contents .tile-top {
     width: 100%;
     position: relative;
    padding: 1.3rem 1.5rem 0.6rem;
}
}


.tile-top.tile-image {
.mainpage-contents h2 {
     display: flex;
     margin: 0;
    align-items: center;
    background-color: var(--byline-color);
    overflow: hidden;
     padding: 0;
     padding: 0;
    height: 13vw;
    max-height: 12em;
    transition: 0.4s ease-out;
}
}


.tile-halves:hover .tile-top.tile-image img {
.mainpage-skills ul {
     transform: scale(1.1);
     columns: 3;
     transition: 0.5s ease-out;
     margin: 1em 0.7em 0.7em 1em;
}
}


.tile-top.tile-image a {
.mainpage-skills li {
     width: 100%;
     display: flex;
    margin-bottom: 0.29em;
}
}


.tile-top.tile-image img {
.mainpage-skills li a:first-child {
     width: 100%;
     border-radius: 3px;
     object-fit: cover;
    padding: 4px;
     max-height: 200px;
     width: 25px;
     transition: 0.4s ease-out;
     height: 25px;
     text-align: center;
}
}


.tile-bottom {
.mainpage-skills li a:last-child {
     background: var(--tile-background-color);
     flex: 1;
     border-top: 1px solid var(--tile-border-color);
    display: flex;
     width: 100%;
    align-items: center;
     padding: 1rem 1.5rem 0.6rem;
     color: var(--base-text-color);
     font-weight: bold;
     padding-left: 0.7em;
    text-decoration: none;
}
}


.tile-bottom.link-button {
.mainpage-skills li:hover a:first-child {
     align-self: flex-end;
     border-radius: 3px 0 0 3px;
    padding: 0;
}
}


.tile-bottom.link-button a {
.mainpage-skills li:hover a:last-child {
    display: block;
     color: rgba(255, 255, 255, 0.9);
    text-align: center;
     border-radius: 0 3px 3px 0;
     padding: 0.75em 1.5em 0.8em;
     text-decoration: none;
}
}


.tile-bottom.read-more {
.mainpage-wikinews .news-date {
     background: var(--tile-link-button-color);
     font-weight: bold;
     transition: 0.3s ease-out;
     margin-bottom: 0.3em;
}
}


.tile-bottom.read-more a {
.mainpage-wikinews p:not(.news-date) {
    color: var(--byline-color);
     margin-left: 1em;
    font-weight: bold;
     text-align: right;
}
}


.tile-bottom.read-more:hover {
.popular-pages ul {
     background: var(--tile-link-button-highlight-color);
     display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0.6em;
    margin: 1em 0 0.7em 0;
}
}


.tile-bottom.read-more:hover .arrow {
.mp-popular-page-light {
     transform: translateX(50%);
    display: flex;
    align-items: center;
    list-style: none;
     background-color: var(--body-mid);
    transition: 0.2s;
}
}


.tile-bottom.read-more .arrow {
.mp-popular-page-light a {
     filter: var(--byline-arrow-filter);
     flex: 1;
     margin-left: 0.4em;
    display: block;
     transition: 0.3s ease-out;
    color: #fff;
    font-weight: bold;
    text-align: center;
     text-decoration: none;
     padding: 0.7em 1em;
}
}


.tile.oswf-day {
.mp-popular-page-light:hover {
     margin-left: 0.5em;
     filter: brightness(115%);
    transition: 0.2s;
}
}


.oswf-tile {
.mainpage-discord {
     margin: 1em;
     border: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
}


.oswf-tile.oswf-complete {
.mainpage-discord .tile-top {
     opacity: 0.65;
     display: flex;
    align-items: center;
    background: #FFFFFF;
    padding: 1em 1.75em;
}
}


.oswf-tile .oswf-summary {
.mainpage-discord .tile-top a {
     font-size: 105%;
     flex: 1;
     line-height: 1.6;
     position: relative;
     margin-top: -0.4em;
     text-decoration: none;
}
}


.oswf-tile .oswf-img {
.mainpage-discord .tile-top a:hover .arrow {
     display: block;
     transform: translateX(50%);
    max-width: 75px;
    float: right;
}
}


.oswf-tile .oswf-img img {
.mainpage-discord .tile-bottom {
     max-width: 100%;
     background: #FF0000;
     height: auto;
    border: none;
     padding: 1em 1.75em;
}
}


.oswf-tile .oswf-guidance {
.mainpage-discord .tile-bottom p {
     border-top: 1px solid #eee;
    color: #fff;
     padding-top: 1em;
    font-weight: bold;
    font-size: 0.9em;
    text-align: center;
     text-transform: uppercase;
     letter-spacing: 0.03em;
    margin: 0;
}
}


:root {
.mainpage-discord .partner-icon {
    --mainpage-recent-updates-description-color: #333;
     margin-right: 0.75em;
    --bigtile-background-color: #f9f3eb;
    --bigtile-background-fade-zero: rgba(249, 243, 235, 0);
     --bigtile-background-fade-seventyfive: rgba(249, 243, 235, 0.75);
}
}


.mainpage-header {
.mainpage-discord .server-name {
     display: flex;
     color: #000000;
     margin: 2.6em 1.75em 1.5em;
     font-weight: bold;
    font-size: 1.25em;
    margin: 0.5em 0 -0.15em;
}
}


.mainpage-header .header-intro {
.mainpage-discord .server-tagline {
     flex: 2;
     color: #202122;
    margin-bottom: 0.5em;
}
}


.mainpage-header .header-intro h1 {
.mainpage-discord .arrow {
     font-size: 2.5em;
     position: absolute;
     font-weight: bold;
    top: calc(50% - .5em);
     border: none;
     right: 0;
     margin: 0 0 0.15em;
     height: 1em;
     width: 0.7em;
    background-size: 0.7em 1em;
    transition: 0.3s ease-out;
}
}


.mainpage-header .header-intro p {
.mainpage-twitter {
     font-size: 1.1em;
     border: none;
     line-height: 1.7em;
     box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
}


.mainpage-header .header-stats {
.mainpage-twitter .tile-top {
    flex: 1;
     display: flex;
     display: flex;
    justify-content: center;
     align-items: center;
     align-items: center;
     margin-top: -1em;
     background: #00aced;
    padding: 1em 1.75em;
}
}


.mainpage-header .header-stats ul {
.mainpage-twitter .tile-top a {
     list-style: none;
     flex: 1;
    position: relative;
    text-decoration: none;
}
}


.mainpage-body {
.mainpage-twitter .tile-top a:hover .arrow {
     display: flex;
     transform: translateX(50%);
    flex-flow: row wrap;
}
}


.mainpage-body h2 a {
.mainpage-twitter .tile-bottom {
     color: var(--text-color);
     background: #0084b4;
    border: none;
    padding: 1em 1.75em;
}
}


.mainpage-body .tile {
.mainpage-twitter .tile-bottom p {
     padding-left: 1.75em;
     color: #fff;
     padding-right: 1.75em;
    font-weight: bold;
     max-width: 100%;
    font-size: 0.9em;
     text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
     margin: 0;
}
}


.mainpage-body .tile-row {
.mainpage-twitter .twitter-logo {
    width: 100%;
     margin-right: 0.75em;
     margin-bottom: 0.9rem;
}
}


.mainpage-left {
.mainpage-twitter .twitter-name {
     flex: 2;
     color: #fff;
     display: flex;
     font-weight: bold;
     flex-flow: column wrap;
     font-size: 1.25em;
     margin-right: 0.9rem;
     margin: 0.5em 0 -0.15em;
}
}


.mainpage-left > * {
.mainpage-twitter .twitter-tagline {
     margin: 0 0 0.9rem;
    color: rgba(255, 255, 255, 0.9);
     margin-bottom: 0.5em;
}
}


.mainpage-right {
.mainpage-twitter .arrow {
     flex: 1;
    position: absolute;
     display: flex;
    top: calc(50% - .5em);
     flex-flow: column wrap;
    right: 0;
     height: 1em;
     width: 0.7em;
     background-size: 0.7em 1em;
    transition: 0.3s ease-out;
}
}


.mainpage-right > * {
.mainpage-facebook {
     margin: 0 0 0.9rem;
     border: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
}


.arrow {
.mainpage-facebook .tile-top {
    background: url('filepath://White-chevron.svg') no-repeat;
     display: flex;
     display: inline-block;
     align-items: center;
     height: 0.7rem;
     background: #385899;
     width: 0.45rem;
     padding: 1em 1.75em;
     vertical-align: middle;
}
 
.arrow.dark {
    filter: invert(80%);
}
}


.mainpage-recent-updates .tile-halves {
.mainpage-facebook .tile-top a {
     flex: 1;
     flex: 1;
     align-content: flex-start;
     position: relative;
     margin-right: 0.9rem;
     text-decoration: none;
}
}


.mainpage-recent-updates .tile-halves:hover .tile-top img {
.mainpage-facebook .tile-top a:hover .arrow {
     transform: scale(1.04);
     transform: translateX(50%);
}
}


.mainpage-recent-updates .tile-halves:last-child {
.mainpage-facebook .tile-bottom {
     margin-right: 0;
    background: #1771E6;
    border: none;
     padding: 1em 1.75em;
}
}


.mainpage-recent-updates .tile-bottom.link-button a {
.mainpage-facebook .tile-bottom p {
     text-align: left;
    color: #FFF;
     padding: 1rem 1.5rem 0.75rem;
    font-weight: bold;
    font-size: 0.9em;
    text-align: center;
     text-transform: uppercase;
     letter-spacing: 0.03em;
    margin: 0;
}
}


.mainpage-recent-updates h2 {
.mainpage-facebook .facebook-logo {
     margin: -0.5em 0 0.3em;
     margin-right: 0.75em;
}
}


.mainpage-recent-updates p:not(.byline) {
.mainpage-facebook .facebook-name {
     font-size: 0.9em;
    color: #FFF;
     line-height: 1.75em;
     font-weight: bold;
     color: var(--mainpage-recent-updates-description-color);
     font-size: 1.25em;
     margin: 0.5em 0 -0.15em;
}
}


.mainpage-contents .tile-halves {
.mainpage-facebook .facebook-tagline {
     flex: 1;
     color: rgba(255, 255, 255, 0.9);
     margin-right: 0.9rem;
     margin-bottom: 0.5em;
}
}


.mainpage-contents .tile-halves:last-child {
.mainpage-facebook .arrow {
     margin-right: 0;
    position: absolute;
    top: calc(50% - .5em);
    right: 0;
    height: 1em;
    width: 0.7em;
    background-size: 0.7em 1em;
     transition: 0.3s ease-out;
}
}


.mainpage-contents .tile-top {
.mainpage-instagram {
     position: relative;
     border: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
}


.mainpage-contents h2 {
.mainpage-instagram .tile-top {
     margin: 0;
     display: flex;
     padding: 0;
    align-items: center;
    background: #FFFFFF;
     padding: 1em 1.75em;
}
}


.mainpage-skills ul {
.mainpage-instagram .tile-top a {
     columns: 3;
     flex: 1;
     margin: 1em 0.7em 0.7em 1em;
     position: relative;
    text-decoration: none;
}
}


.mainpage-skills li {
.mainpage-instagram .tile-top a:hover .arrow {
     display: flex;
     transform: translateX(50%);
    margin-bottom: 0.29em;
}
}


.mainpage-skills li a:first-child {
.mainpage-instagram .tile-bottom {
    border-radius: 3px;
     background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
    padding: 4px;
    width: 25px;
    height: 25px;
    text-align: center;
}
 
.mainpage-skills li a:last-child {
     flex: 1;
    display: flex;
    align-items: center;
    color: var(--base-text-color);
    font-weight: bold;
    padding-left: 0.7em;
    text-decoration: none;
}
 
.mainpage-skills li:hover a:first-child {
    border-radius: 3px 0 0 3px;
}
 
.mainpage-skills li:hover a:last-child {
    color: rgba(255, 255, 255, 0.9);
    border-radius: 0 3px 3px 0;
}
 
.skill-agility a:first-child,
.skill-melee a:first-child {
    background: #bc483d;
}
 
.skill-agility:hover a:last-child,
.skill-melee:hover a:last-child {
    background: #932419;
}
 
.skill-ranged a:first-child {
    background: #748d36;
}
 
.skill-ranged:hover a:last-child {
    background: #4c6215;
}
 
.skill-magic a:first-child {
    background: #6274ab;
}
 
.skill-magic:hover a:last-child {
    background: #304791;
}
 
.skill-fishing a:first-child,
.skill-fletching a:first-child {
    background: #3e8e9a;
}
 
.skill-fishing:hover a:last-child,
.skill-fletching:hover a:last-child {
    background: #1a6671;
}
 
.skill-cooking a:first-child,
.skill-thieving a:first-child {
    background: #91689e;
}
 
.skill-cooking:hover a:last-child,
.skill-thieving:hover a:last-child {
    background: #713684;
}
 
.skill-farming a:first-child,
.skill-woodcutting a:first-child {
    background: #59924f;
}
 
.skill-farming:hover a:last-child,
.skill-woodcutting:hover a:last-child {
    background: #306f25;
}
 
.skill-mining a:first-child {
    background: #6385a8;
}
 
.skill-mining:hover a:last-child {
    background: #315f8d;
}
 
.skill-smithing a:first-child {
    background: #d2b244;
}
 
.skill-smithing:hover a:last-child {
    background: #b69213;
}
 
.mainpage-wikinews .news-date {
    font-weight: bold;
    margin-bottom: 0.3em;
}
 
.mainpage-wikinews p:not(.news-date) {
    margin-left: 1em;
}
 
.popular-pages ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0.6em;
    margin: 1em 0 0.7em 0;
}
 
.mp-popular-page-light {
    display: flex;
    align-items: center;
    list-style: none;
    background-color: var(--button-background);
    transition: 0.2s;
}
 
.mp-popular-page-light a {
    flex: 1;
    display: block;
    color: #009F52;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    padding: 0.7em 1em;
}
 
.mp-popular-page-light:hover {
    filter: brightness(115%);
    transition: 0.2s;
}
 
.mainpage-discord {
    border: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
 
.mainpage-discord .tile-top {
    display: flex;
    align-items: center;
    background: #5865f2;
    padding: 1em 1.75em;
}
 
.mainpage-discord .tile-top a {
    flex: 1;
    position: relative;
    text-decoration: none;
}
 
.mainpage-discord .tile-top a:hover .arrow {
    transform: translateX(50%);
}
 
.mainpage-discord .tile-bottom {
    background: #FF0000;
    border: none;
    padding: 1em 1.75em;
}
 
.mainpage-discord .tile-bottom p {
    color: #fff;
    font-weight: bold;
    font-size: 0.9em;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin: 0;
}
 
.mainpage-discord .partner-icon {
    margin-right: 0.75em;
}
 
.mainpage-discord .server-name {
    color: #fff;
    font-weight: bold;
    font-size: 1.25em;
    margin: 0.5em 0 -0.15em;
}
 
.mainpage-discord .server-tagline {
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0.5em;
}
 
.mainpage-discord .arrow {
    position: absolute;
    top: calc(50% - .5em);
    right: 0;
    height: 1em;
    width: 0.7em;
    background-size: 0.7em 1em;
    transition: 0.3s ease-out;
}
 
.mainpage-twitter {
     border: none;
     border: none;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}
.mainpage-twitter .tile-top {
    display: flex;
    align-items: center;
    background: #00aced;
     padding: 1em 1.75em;
     padding: 1em 1.75em;
}
}


.mainpage-twitter .tile-top a {
.mainpage-instagram .tile-bottom p {
    flex: 1;
     color: #FFF;
    position: relative;
    text-decoration: none;
}
 
.mainpage-twitter .tile-top a:hover .arrow {
    transform: translateX(50%);
}
 
.mainpage-twitter .tile-bottom {
    background: #0084b4;
    border: none;
    padding: 1em 1.75em;
}
 
.mainpage-twitter .tile-bottom p {
     color: #fff;
     font-weight: bold;
     font-weight: bold;
     font-size: 0.9em;
     font-size: 0.9em;
Line 3,675: Line 3,444:
}
}


.mainpage-twitter .twitter-logo {
.mainpage-instagram .instagram-logo {
     margin-right: 0.75em;
     margin-right: 0.75em;
}
}


.mainpage-twitter .twitter-name {
.mainpage-instagram .instagram-name {
     color: #fff;
     color: #000000;
     font-weight: bold;
     font-weight: bold;
     font-size: 1.25em;
     font-size: 1.25em;
Line 3,686: Line 3,455:
}
}


.mainpage-twitter .twitter-tagline {
.mainpage-instagram .instagram-tagline {
     color: rgba(255, 255, 255, 0.9);
     color: #000000;
     margin-bottom: 0.5em;
     margin-bottom: 0.5em;
}
}


.mainpage-twitter .arrow {
.mainpage-instagram .arrow {
     position: absolute;
     position: absolute;
     top: calc(50% - .5em);
     top: calc(50% - .5em);
Line 3,700: Line 3,469:
     transition: 0.3s ease-out;
     transition: 0.3s ease-out;
}
}


.mainpage-editing {
.mainpage-editing {
Retrieved from "https://help.pearldentalsoftware.com/w/Special:MobileDiff/693...1315"