Difference between revisions of "MediaWiki:Common.css"

Revision as of 13:27, 26 June 2020

.charaBox {
width: 20%;
float:left;
height: 7em;
box-shadow: 5px 5px 5px black;
border-radius: 5px;
}

.charaBox p {
padding-top: 1em;
}

.FAQ {
background-color: #0d1c00;
border-radius: 15px;
padding: 1em;
padding-top: 0.2em;
padding-bottom: 0.4em;
border: 2px solid #1b3d00;
}

.FAQ h3 {
padding-top: 0px;
padding-bottom: 0.3em;
}

.FAQanswer {
background-color: #081200;
border-radius: 15px;
padding: 0.2em 1em 0.2em 1em;
}

.FAQanswer p {
margin-bottom: 0.2em;
}

.noticetext {
float:left;
width: 65%;
}

.videtails {
border-left: 3px solid #1b3d00;
border-radius: 10px;
}

.videtailsinfo {
margin-left: 2em;
font-style: italic; 
}

.vidinfonav {
background-color: #081200;
border-radius: 15px;
overflow: auto;
margin-top: 1em;
padding: 0 0.7em 0 0.7em;
}

.prevvidtop p {
width: 45%;
float: left;
text-align: center;
font-weight: bold;
padding-top: 0.3em; 
margin-right: 1%;
word-break: break-all;
word-break: break-word;
}

.nextvidtop p {
width: 45%;
float: right;
text-align: center;
font-weight: bold;
padding-top: 0.3em; 
margin-left: 1%;
word-break: break-all;
word-break: break-word;
}

.prevvid p {
width: 45%;
float: left;
text-align: center;
padding-top: 1em;
word-break: break-all;
word-break: break-word;
font-weight: bold;
}

.prevvid a:hover {
text-decoration: none;
text-shadow: 0px 0px 5px gold;
color: yellow;
}

.prevvid a:visited {
color: gold;
}

.nextvid p {
width: 45%;
float: right;
text-align: center;
padding-top: 1em;
word-break: break-all;
word-break: break-word;
font-weight: bold;
}

.nextvid a:hover {
text-decoration: none;
text-shadow: 0px 0px 5px gold;
color: yellow;
}

.nextvid a:visited {
color: gold;
}

.solution {
text-shadow: 0 0 5px white;
font-weight: bold;
}

.textexampletitle {
background-color: #081200;
border: 2px solid #1b3d00;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
margin-top: 1.2em;
margin-bottom: 0px;
font-family: monospace;
font-size: 1.1em;
color: yellow;
font-weight: bold;
padding-top: 0.5em;
}

.textexamplebox {
background-color: black;
border: 2px solid #1b3d00;
border-top: 0;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
font-family: monospace;
font-size: 1.1em;
padding-bottom: 1em;
}

.tablenav a {
color: gold;
}

.tablenav a:visited {
color: gold;
}

.tablenav a:hover {
color: yellow;
text-shadow: 0px 0px 5px gold;
text-decoration: none;
font-weight:bold;
}

body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }
body.page-Join.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; }

.updatenew {
border: 1.5px solid #0d1c00;
background-color: #0d1c00;
border-radius: 10px;
padding: 0.7em;
}

.updatenew h3 {
margin-top: 0;
padding-top: 0;
}

.updateold {
margin-top: 1em;
border: 1.5px solid #0d1c00;
border-radius: 10px;
padding: 0.7em;
}

.updateold h3 {
margin-top: 0;
padding-top: 0;
}

.static {
background: white;
width: 20%;
height: auto;
position:absolute;
}

.static:hover {
opacity:0;
}

.active {
width: 20%;
height: auto;
}

.linkboxes1 {
width: 100%;
text-align: center;
position:relative;
}

.linkboxes1 img {
width: 20%;
height: auto;
margin: 0 1% 0 1%;
border-radius: 5%;
max-height: 360px;
max-width: 280px; 
}

.linkboxes2 {
width: 100%;
text-align: center;
position:relative;
}

.linkboxes2 img {
width: 20%;
margin-top: 2em;
height: auto;
margin: 0 1% 0 1%;
border-radius: 5%;
max-height: 360px;
max-width: 280px; 
}

iframe {
border: 3px solid #1b3d00;
margin-left: auto;
margin-right: auto;
display: block;
border-radius: 10px;
box-shadow: 0 0 10px #1b3d00;
}

.storyquote {
width: 80%;
margin-left: 4em;
margin-right: 4em;
height: fit-content;
display: inline-block;
}

.storyquote img {
background-color: #0d1c00;
border: 3px solid #1b3d00;
border-radius: 10px;
padding: 0.2em;
float:left;
max-width: 6em;
z-index: 1;
position: absolute;
box-shadow: 5px 10px 8px #000000;
}

.storyquotename {
background-image: linear-gradient(7deg,#1b3d00,#000000,#000000,#000000);
float:left; 
width: 100%;
padding-left: 5.3em;
font-size: 1.4em;
color: gold;
text-shadow: 0px 0px 2px gold;
font-weight:bold;
}

.storyquotebox {
font-style:italic;
font-size:1.2em;
width: 80%;
background-color: #0d1c00;
border: 3px solid #1b3d00;
border-radius: 10px;
float:left;
padding-left: 5.5em;
padding-right: 1.8em;
padding: 0.5em 2em 0.5em 5.5em;
}

.articleimg {
background-color: #0d1c00;
border: 3px solid #1b3d00;
max-width: 16em;
padding: 0.7em 0.7em 0em 0.7em;
text-align: center;
border-radius: 10px;
}

.articleimg p {
margin-bottom: 0px;
padding: 0.2em;
background-color: #1b3d00;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
padding-left: 0.6em;
padding-right: 0.6em;
text-align: left;
}

.articleimg img {
border-radius: 10px;
max-width: 15.5em;
border: 3px solid #1b3d00;
}

.mw-body-content p {
margin-bottom: 1.1em;
text-align: justify;
}

.vip9 i {
opacity: 0.5;
font-weight: normal;
}

.vip9 {
font-weight: bold;
background-color: #0a3831;
color: #ffffff;
}

.vip8 i {
opacity: 0.5;
font-weight: normal;
}

.vip8 {
font-weight: bold;
background-color: #00064c;
color: #d6d8ff;
}

.vip7 i {
opacity: 0.5;
font-weight: normal;
}

.vip7 {
font-weight: bold;
background-color: #1f352c;
color: #eacf9a;
}

.vip6 i {
opacity: 0.5;
font-weight: normal;
}

.vip6 {
font-weight: bold;
background-color: #4c3200;
color: #ffa700;
}

.gamejack {
margin-left: 3em;
background: linear-gradient(to right, rgba(56,36,0,0), rgba(56,36,0,0.2), rgba(56,36,0,0.8), rgba(56,36,0,1));
}

.ph p {
margin-top: 0;
margin-bottom: 0;
}

.summary .ph ul {
margin-top: 0;
}

.summary .ph {
margin-top: 0;
}

.ph {
border-radius: 5px;
background: linear-gradient(to right, rgba(56,36,0,0), rgba(56,36,0,0.2), rgba(56,36,0,0.8), rgba(56,36,0,1));
display:inline-block;
min-width: 99%;
margin-top: 0.3em;
}

.ph:hover {
background-color: #382400;
}

.mw-collapsible-content .ph {
display:inline-block;
min-width: 99%;
margin-top: 0;
}

.mw-collapsible-content .ph:hover {
background-color: #382400;
}

.vip5 i {
opacity: 0.5;
font-weight: normal;
}

.vip5 {
font-weight: bold;
background-color: #3c002f;
color: #ff317d;
}

.vip4 i {
opacity: 0.5;
font-weight: normal;
}

.vip4 {
font-weight: bold;
background-color: #292929;
color: #a5a5a5;
}

i {
opacity: 0.5;
}

.simple-tooltip-img {
border: none;
vertical-align: middle;
width: 1.3em;
}

.tooltipster-default {
border-radius: 5px;
background: #081200;
border: 2px solid #1b3d00;
color: #fff;
box-shadow: 0px 0px 7px black;
}

.vip3 i {
opacity: 0.5;
font-weight: normal;
}

.vip3 {
font-weight: bold;
background-color: #450202;
color: red;
}

.vip2 i {
opacity: 0.5;
font-weight: normal;
}

.vip2 {
font-weight: bold;
background-color: #021b45;
color: royalblue;
}

.vip i {
opacity: 0.5;
font-weight: normal;
}

.vip {
font-weight: bold;
background-color: #132b00;
color: gold;
}

.toctogglelabel {
color:#337800;
}

.tocnumber {
color:#337800;
}

.fauxheader {
font-weight: bold;
color: white;
font-size: 1.1em;
padding-top: 0.2em;
}

p.fauxheader {
margin: 0px;
}

.fadediv {
background: linear-gradient(to right, rgba(27,61,0,1), rgba(27,61,0,0), rgba(27,61,0,0), rgba(27,61,0,0));
height: 2px;
margin: 0px;
}

.fadediv2 {
background: linear-gradient(to right, rgba(50,112,0,1), rgba(50,112,0,0), rgba(50,112,0,0), rgba(50,112,0,0));
height: 2px;
margin: 0px;
}

.transcriptsum {
background-color: #081200;
border: 2px solid #1b3d00;
border-radius: 15px;
margin-top: 1.2em;
font-family: monospace;
font-size: 1.1em;
}

.summary {
margin-left: 4em;
margin-right: 1em;
padding: 0em 1em 0.5em 1em;
border: 2px solid #1b3d00;
border-top: none;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
word-wrap: break-word;
}

.toc, .mw-warning, .toccolours {
background-color: black;
border: 2px solid #1b3d00;
border-radius: 15px;
}

ul {
list-style-image: none;
}

.indented {
padding: 1em;
padding-top: 0;
padding-bottom: 0;
margin-left: 1.3em;
}

b {
color: gold;
}

.supple {
font-style: italic;
opacity: 0.5;
color: white;
font-size: 0.8em;
}

.canquote {
font-style: italic;
font-weight: bold;
color: green;
font-size: 1.025em;
font-family: monospace;
}

.mw-body h1 {
font-family: Arial;
}

.mw-body h2 {
font-family: Arial;
}

.mw-body h3 {
font-family: Arial;
color: white;
}

.mw-body h4 {
font-family: Arial;
color: white;
}

.mw-collapsible-toggle {
float:left;
margin-left:0;
margin-right:1em;
background-color: #0d1c00;
border: 3px solid #1b3d00;
padding: 0.7em;
border-radius: 15px;
}

.transcript {
background-color: #081200;
border: 2px solid #1b3d00;
border-radius: 15px;
margin-top: 1.2em;
margin-bottom: 1.2em;
font-family: monospace;
font-size: 1.1em;
}

.poem {
margin-left: 10px;
margin-top: 20px;
margin-right: 10px;
word-wrap: break-word;
padding-bottom: 0.5em;
}

.poem p {
margin-top: 0;
margin-bottom: 0;
}

.mw-content-ltr .mw-collapsible:not(.mw-made-collapsible) th:before, .mw-content-rtl .mw-content-ltr .mw-collapsible:not(.mw-made-collapsible) th:before, .mw-content-ltr .mw-collapsible:not(.mw-made-collapsible):before, .mw-content-rtl .mw-content-ltr .mw-collapsible:not(.mw-made-collapsible):before, .mw-content-ltr .mw-collapsible-toggle, .mw-content-rtl .mw-content-ltr .mw-collapsible-toggle {
float: none;
}

.mw-collapsible-text {
color: gold;
font-weight: bold;
}

.infobox {
background-color: #0d1c00;
border: 3px solid #1b3d00;
float: right;
margin: 0 0 1em 1em;
padding: 0.7em;
padding-top: 0px;
padding-bottom: 0px;
width: 33%;
max-width: 300px;
border-radius: 10px;
}

.infobox img {
max-width: 95%;
height: auto;
margin-left: auto;
margin-right: auto;
border: 2px solid #1b3d00;
border-top: 1px solid #1b3d00;
border-radius: 15px;
}

.infobox-title {
font-size: 1.5em;
background-color: #1b3d00;
border-top: 1px solid #1b3d00;
border-bottom: 1px solid #1b3d00;
padding-left: 0.4em;
padding-right: 0.4em;
}

.infobox-title p {
margin: 0px;
text-align: center;
background-color: #0d1c00;
border: 1px solid #1b3d00;
border-radius: 10px;
margin-bottom: 0px;
word-break: break-all;
word-break: break-word;
padding-left: 0.3em;
padding-right: 0.3em;
}

.infobox-image {
text-align: center;
background-color: #1b3d00;
border: 2px solid #1b3d00;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
}

.infobox-image p {
text-align: left;
font-style: italic;
opacity: 0.5;
margin-left: 0.7em;
}

.infobox table {
width: 100%;
background-color: #081200;
border: 2px solid #081200;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
margin-top: 1em;
word-break: break-all;
word-break: break-word;
}

.infobox th {
vertical-align: top;
width: 100px;
text-align: left;
}

.infobox td {
vertical-align: top;
}

.infobox tr {
display: block;
border-bottom: 2px solid #1b3d00;
}

.infobox-title h2 {
margin: 0px;
padding: 0px;
margin-top: 10px;
font-size: 0.5em;
}

.nodivider tr {
border-bottom: none;
}

#mw-panel {
background-color:black;
border: 3px solid #112600;
padding-bottom: 20px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
}

#mw-panel .portal h3 {
color:white;
}

#mw-panel .portal .body li a {
color:#337800;
}

#mw-panel .portal .body li a:hover {
color:gold;
}

#mw-panel .portal .body li a:visited {
color:#285e00;
}

#mw-head {
background-color:black;
}

body {
background-image: url(http://johnisdead.withinhubris.com/images/c/cc/Jidwikibg.png);
}

.mw-body, .parsoid-body {
background-color: black;
border: 3px solid #112600;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
color: white;
}

.mw-body-content p {
color:white;
}

.mw-body h1, .mw-body-content h1 {
color:white;
}

.mw-body-content h2 {
color:white
}

.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul {
color:white;
}

.mw-parser-output a.external {
color:#337800;
}

.mw-parser-output a.external:hover {
color:gold;
}

.mw-parser-output a.external:visited {
color:#285e00;
}

a {
color:#337800;
}

a.new {
color:#d33;
}

a:hover {
color:gold;
}

a:visited {
color:#285e00;
}

.vectorTabs {
background-color: #112600;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
background-image: none;
}

.vectorTabs ul {
background-image: none;
}

.vectorTabs li {
background-image: none;
padding: 0px 5px 0px 5px;
}

.vectorTabs li.selected {
background-image: none;
}

.vectorTabs span {
background-image: none;
}

.vectorTabs li.selected a, .vectorTabs li.selected a:visited {
color: white;
font-weight: normal;
margin-top: 5px;
background-color: black;
border: 3px solid black;
border-bottom: none;
border-top-right-radius: 25px;
border-top-left-radius: 25px;
}

.vectorTabs li a, .vectorTabs li a:visited {
color: gold;
font-weight: bold;
}

.vectorTabs li a:hover, .vectorTabs li a:hover {
color: gold;
text-shadow: 0px 0px 2px gold;
text-decoration: none;
font-weight: bold;
}

.vectorMenu h3 span {
color:#337800;
padding-top: 1.5em;
}

.vectorMenu li a {
color:#337800;
}

.vectorMenu .menu {
background-color: black;
border: 2px solid #112600;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
}

#editform, #toolbar, #wpTextbox1 {
background-color: #060d00;
color:white;
}

.editOptions {
background-color: #0d1c00;
color:white;
border: 1px solid #112600;
}

textarea {
border: 1px solid #112600;
}

.oo-ui-textInputWidget .oo-ui-inputWidget-input {
background-color: black;
color: white;
border: 1px solid #112600;
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
background-color: #1b3d00;
color: gold;
border-color: #1b3d00;
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
background-color: #337800;
color: gold;
border-color: #337800;
box-shadow: 0px 0px 4px gold;
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
background-color: #1b3d00;
color: #a55858;
border-color: #1b3d00;
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
background-color: #337800;
color: gold;
border-color: #337800;
box-shadow: 0px 0px 4px gold;
}

pre, .mw-code {
background-color: black;
color: white;
}

.frontbox {
text-align:center;
float:left;
width: 68%;
padding-right: 3%;
}

.frontbox p {
text-align:center;
}

.frontbox h1 {
text-decoration: none;
margin-top: 0px;
margin-bottom: 0px;
border: none;
font-size: 2.1em;
font-weight: bold;
}

.frontbox h2 {
text-decoration: none;
margin-top: 0px;
margin-bottom: 0px;
border: none;
}

.frontbox h3 {
text-decoration: none;
margin-top: 0px;
margin-bottom: 0px;
border: none;
}

.frontsidebox {
background-color: black;
border: 3px solid #0d1c00;
padding: 0.7em;
padding-top: 0px;
padding-bottom: 1em;
border-radius: 10px;
float: left;
width: 25%;
}

.frontsidebox img {
display: block;
max-width: 95%;
height: auto;
margin-left: auto;
margin-right: auto;
border: 2px solid #0d1c00;
border-top: 1px solid #0d1c00;
border-radius: 15px;
}

.frontsideboxtitle {
text-align: center;
font-size: 1.5em;
background-color: #0d1c00;
border-top: 1px solid #0d1c00;
border-bottom: 1px solid #0d1c00;
padding-left: 0.4em;
padding-right: 0.4em;
}

.frontsideboxtitle h2 {
font-size:1.1em;
padding: 0.2em 0 0.2em 0;
margin: 0px;
text-align: center;
background-color: black;
border: 1px solid #0d1c00;
border-radius: 10px;
margin-bottom: 0px;
font-weight: bold;
animation-duration: 4500ms;
animation-name: glow;
animation-iteration-count: infinite;
}

.frontsideboximage {
text-align: center;
background-color: #0d1c00;
border: 2px solid #0d1c00;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
margin-bottom: 1em;
}

@keyframes glow {
   0% {
      text-shadow: 0px 0px 2px white;
      color: #6eff81;
   }
   50% {
      text-shadow: 0px 0px 6px white;
      color: #ffffff;
   }
   100% {
      text-shadow: 0px 0px 2px white;
      color: #6eff81;
   }
}

.frontsidebox2 {
background-color: black;
border: 3px solid #0d1c00;
padding: 0.7em;
padding-top: 0px;
padding-bottom: 1em;
border-radius: 10px;
float: left;
width: 25%;
margin-top: 2em;
}

.frontsidebox2 img {
display: block;
max-width: 95%;
height: auto;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
border-radius: 15px;
}

.frontsidebox2 img:hover {
box-shadow: 0px 0px 10px gold;
}
.tablenotes {
background-color: #081200;
border: 2px solid #1b3d00;
padding: 1.25em;
padding-top: 0;
padding-bottom: 0;
border-radius: 15px;
}

.tablenotes h3 {
font-size: 1.1em;
}

.tablenotes p {
margin-top: 0px;
}

.tablenav .playersub a {
color:green;
}

.tablenav .playersub a:hover {
color:green;
text-shadow: 0px 0px 5px green;
}