MediaWiki:Common.css: Difference between revisions

Revision as of 16:36, 8 June 2022

/* Changes the default font used for MediaWiki to Arial (does not include headings or monospaced text): */
body {font-family:Arial; font-size:1em}

/* Changes the default font used for MediaWiki headings to Noto Serif: */
#content h1 {font-family: "Noto Serif", serif}

#mw-site-navigation .sidebar-chunk h3, #mw-related-navigation .sidebar-chunk h3 {font-size:1.3em}
.toctitle {text-align:center; font-size:1.2em; line-height:2em}
.mw-body .toctitle h2 {font-family:Arial; font-weight:bold}
.toctogglespan {display:none}
.toc ul {line-height:1.4em}
.toc {border:1px solid #a2a9b1; padding:0 12px}

/* One-sided navigation menu */
@media (min-width:1340px) {
#mw-content-block {display:block}
#mw-content, #content-bottom-stuff {margin-left:14em}
#mw-content-wrapper {float:right; margin-left:-14em; width:100%}
#mw-related-navigation {width:14em; padding:0 1em 0 0}
div.color-middle {margin-right:0}
.mw-wiki-logo {display:inline-block}
}

/* mouse over link */
a:hover {text-decoration:underline}

/* selected link */
a:active {text-decoration:underline; color:orange}

ul > li:nth-child(2) > div:last-child, li:nth-child(4) > div:last-child {display:none}
ul > li:nth-child(4) > div:nth-child(2) {display:none}
ul > li:nth-child(3) > div:last-child {display:none}

.shadow:hover {box-shadow:0 0 8px rgba(37,37,37,0.5)}
.scale-up:hover {transform:scale(1.02)}
.responsive-image img {width:calc(100% - 1.5px); height:auto}
.thumbinner img {border:1px solid #c8ccd1}
.thumbinner {justify-content:center; padding:4px; border:1px solid #c8ccd1; transition:0.3s}
.thumbcaption:last-child {padding:4px 4px 0; text-align:justify; font-style:italic; font-size:13px}

.colourize img {transition:transform 0.5s, filter 1.5s ease-in-out; filter:grayscale(100%); -webkit-filter:grayscale(100%)}
.colourize:hover img {filter:none; -webkit-filter:grayscale(0)}

.green-bullet::after {content:" ■"; color:green; position:relative; bottom:1px; font-size:20px}
.orange-bullet::after {content:" ■"; color:orange; position:relative; bottom:1px; font-size:20px}
.maroon-bullet::after {content:" ■"; color:maroon; position:relative; bottom:1px; font-size:20px}



.FOMclock {
margin: 0 auto;
}
.FOMclock ul {
margin: 0 auto;
padding: 0;
text-align: inline
}

.FOMclock ul li {
display: inline;
}

.FOMdate {
display: inline;
}

.DateRange, 
.DateDiv {
display: none; 
}

h4{
    display: inline-block;
}

table {border-spacing:1.5em 0; margin:0 -1.5em}
tr td, td div {vertical-align:top; line-height:1.4em}
.wikitable td {vertical-align:middle}
.wikitable.column1-bold-fonts tr td:first-child {font-weight:bold}
.references {text-align:justify; font-size:14px}
.thumbinner, .thumbcaption {line-height:1.4em}


#blockquote td {padding:0 48px} /* id="blockquote" */
#col-padding-left td {padding-left:48px} /* id="col-padding-left" */
#heading1 td {text-align:center; font-weight:bold; font-size:20px} /* id="heading1" */
#heading2 td {line-height:24px; text-align:center; font-weight:bold; font-size:18px} /* id="heading2" */
#heading3 td {padding-top:2em; text-align:center; font-weight:bold; font-size:20px} /* id="heading3" */
#heading4 td {padding-top:2em; text-align:center; font-weight:bold; font-size:18px} /* id="heading4" */
#heading5 td {text-align:center; font-size:15px} /* id="heading5" */
#heading6 td {text-align:center; font-size:13px} /* id="heading6" */
#paragraph1 td {padding-top:16px} /* id="paragraph1" */
#paragraph2 td {padding-top:2em} /* id="paragraph2" */

#heading1-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:22px} /* id="heading1-table" */
#heading2-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:22px} /* id="heading2-table" */
#heading3-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:20px} /* id="heading3-table" */
#heading4-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:20px} /* id="heading4-table" */
#heading5-table table td:last-child {width:100%; text-align:center; font-weight:bold; font-size:18px} /* id="heading5-table" */
#heading6-table table td:last-child {width:100%; padding-top:2em; text-align:center; font-weight:bold; font-size:18px} /* id="heading6-table" */
#heading7-table table td:last-child {width:100%; text-align:center; font-size:15px} /* id="heading7-table" */
#heading8-table table td:last-child {width:100%; text-align:center; font-size:13px} /* id="heading8-table" */
#paragraph1-table table td {padding-top:16px} /* id="paragraph1-table" */
#paragraph2-table table td {padding-top:2em} /* id="paragraph2-table" */
#no-line-break-table table {padding-top:0} /* id="no-line-break-table" */
#col2-move-left table td:nth-child(2) {display:block; position:relative; left:-1em; margin-right:-1em} /* id="col2-move-left" */


/* Table for Contact Report 690 */
.CR690-tab-col2-move-left table td:nth-child(2) {display:block; margin-left:-1em; margin-right:-1em; text-align:right} /* class="CR690-tab-col2-move-left" */
.CR690-tab-col5-move-left table td:nth-child(5) {padding-left:3em} /* class="CR690-tab-col5-move-left" */


/* Class selectors – Table */
table.blockquote td {padding:0 48px; width:50%} /* class="blockquote" */
table.col-padding-left td {padding-left:48px; width:50%} /* class="col-padding-left" */
table.col-padding-right td {padding-right:48px; width:50%} /* class="col-padding-right" */
table.col2-padding-right table:last-child {padding-right:48px}
table.col3-padding-right table:last-child {padding-right:64px}
table.table-columns table:last-child {border-spacing:0.5em 0; margin:0 -0.5em}
table.col1 td:first-child {min-width:2em}
table.col2a td:nth-child(2):not(td:last-child) {min-width:1em}
table.col1-align-right td table tr td:first-child {min-width:2em; text-align:right}
table.col2-align-right td:nth-child(2):not(td:last-child) {min-width:2em; text-align:right}
table.col3-align-right td:nth-child(3):not(td:last-child) {min-width:2em; text-align:right}
.not-bold td {font-weight:normal !important} /* class="not-bold" */
.align-text-left td {text-align:left !important} /* class="align-text-left" */
.paragraph-table table {padding-top:16px} /* class="paragraph-table" */
.paragraph td {padding-top:16px} /* class="paragraph" */

/* ID selectors – Table */
#col2a td:nth-child(2):not(td:last-child) {min-width:1em} /* id="col2a" */



#btnHideEnglish, #btnHideSwiss-German {cursor:pointer; margin-bottom:12px; font-size:120%}
#center-align-buttons td {text-align:center; width:10%} /* id="center-align-buttons" */


#language-heading td {width:50%; text-align:center; font-weight:bold; font-size:20px} /* id="language-heading" */



/* The following class is used on the Test page. */
tr.contactperson td {
   background-color: cyan;
   line-height: 4em;
   font-weight: bold;
}





.divButton {padding:2px 10px; border:solid #707070 1px; font-size:14px; background:grey; display:inline-flex; max-width:60%; border-radius:2px; background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #F2F2F2), color-stop(1, #CFCFCF)); background-image:-o-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-moz-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-webkit-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image:-ms-linear-gradient(bottom, #F2F2F2 0%, #CFCFCF 100%); background-image: linear-gradient(to bottom, #F2F2F2 0%, #CFCFCF 100%); cursor:default; text-align:center}

.divButton:hover {background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #EAF6FD), color-stop(1, #A7D8F5)); background-image:-o-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image: -moz-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image:-webkit-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image:-ms-linear-gradient(bottom, #EAF6FD 0%, #A7D8F5 100%); background-image: linear-gradient(to bottom, #EAF6FD 0%, #A7D8F5 100%); border:#3c7fb1 solid 1px}

.divButton:active {border:solid #2c628b 1px; padding:2px 9px 2px 11px; background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #E5F4FC), color-stop(0.5, #C4E5F6), color-stop(0.51, #98D0EF), color-stop(1, #68B3DB)); background-image:-o-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image: -moz-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image:-webkit-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image:-ms-linear-gradient(bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%); background-image: linear-gradient(to bottom, #E5F4FC 0%, #C4E5F6 100%, #98D0EF 100%, #68B3DB 100%)}







.tooltip {position:relative; display:inline-block; border-bottom:1px dotted black}

.tooltip .tooltiptext {visibility:hidden; background-color:#d0dcf1; color:black; text-align:left; font-size:12px; border-radius:4px; padding:5px 8px; transform:translateX(-82%); position:absolute; z-index:1; bottom:140%; left:50%; width:max-content; max-width:350px; opacity:0; transition:opacity 1s; transition:0.5s ease-in-out}

.tooltip .tooltiptext::after {content:""; position:absolute; top:100%; left:82%; margin-left:-5px; border-width:8px; border-style:solid; border-color:#d0dcf1 transparent transparent transparent}

.tooltip:hover .tooltiptext {visibility:visible; opacity:1}

















.WD-Gewalt {border-bottom:1px dotted black; display:inline-block; position:relative}

.WD-Gewalt::after {background-color:#d0dcf1; border-radius:4px; bottom:120%; color:black; content: '[http://dict.figu.org/node/1624 FIGU Dictionary Site:Gewalt] Explanation from Ptaah: Gewalt has nothing to do with the terms ‹heftig› (violent) and ‹Heftigkeit› (violence), because the old Lyrian term with regard to ‹Gewalt› means ‹Gewila›, and it is defined as using, with all the coercive means that are at one’s disposal, physical, psychical, mental, and consciousness-based powers, abilities and skills, in order to carry out and carry through terrible actions and deeds.'; font-size:14px; left:50%; max-width:350px; opacity:0; padding:5px 8px; position:absolute; text-align:left; transform:translateX(-50%); transition:opacity 1s; visibility: hidden; width:max-content}

.WD-Gewalt:after {border-color:#d0dcf1 transparent transparent transparent; border-style:solid; border-width:5px; bottom:75%; content:""; left:50%; margin-left:-5px; opacity:0; position:absolute; transition:opacity 1s}

.WD-Gewalt:hover:before, .WD-Gewalt:hover:after {opacity:1; visibility:visible}