MediaWiki:Timeless.css: Difference between revisions

Revision as of 23:48, 23 May 2023

.oo-ui-windowManager-modal > .oo-ui-dialog {
	background: rgba(42,42,42,0.75);
}

.clearright {
	clear: right;
}

.mainpage-vasque {
    position: relative;
    display: inline-block;
    overflow: hidden;
    background: linear-gradient(to bottom,rgba(255,255,255,0),#494744 255px),url(https://psp2i.wiki/images/6/66/Vasque_Home.png) right top no-repeat #494744;
    border: 1px solid #7F7A76;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-vasque-text {
    background-color: rgba(45, 40, 44, 0.75);
}

.vasque-blurb {
	margin: 10px 30px 10px 30px;
}

.vasque-text {
	margin:10px 0 0 30px;
	padding-bottom:10px;
}

.vasque-header {
	margin:0 0 0 20px;
	padding-top:10px;
}

.mainpage-curtz {
	position: relative;
    display: inline-block;
    overflow: hidden;
    background: linear-gradient(to bottom,rgba(255,255,255,0),#39433A 255px),url(https://psp2i.wiki/images/5/58/Curtz_home.png) right top no-repeat #39433A;
    border: 1px solid #879978;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-curtz-text {
	background-color: rgba(30, 40, 35, 0.75);
}
.curtz {
	margin:10px 30px 0 30px;
	padding-bottom:10px;
	padding-top:10px;
}

h3.news {
    margin: 10px 0 0 20px;
}

p.news-date {
    position: relative;
    top: 10px;
    margin: 10px 0 0 20px;
}

p.news-text {
    margin: 10px 30px 0 30px;
}
    

.mainpage-news-text {
    background-color: rgba(9, 19, 31, 0.75);
    border-radius: 10px;
    margin: 0px 10px 10px 10px;
    padding-bottom: 10px;
}


.mainpage-news {
    position: relative;
    display: inline-block;
    overflow: hidden;
    background: linear-gradient(to bottom,rgba(255,255,255,0),#05254C 255px),url(https://psp2i.wiki/images/0/0f/Hal_news.png) right top no-repeat #05254C;
    border: 1px solid #1B3C60;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.3);
}

.mainpage-news .tile-bottom {
    border: none;
    padding: 0.8rem 1.5rem 0.4rem;
}

.mainpage-news h2,
.mainpage-editing a {
    color: #fff;
}

.mainpage-news p {
    color: rgba(255, 255, 255, 0.9);
}

.mainpage-news ul {
    list-style-image: url('filepath://Transparent-chevron.svg');
}

.wikitable tr:hover {
    background:#3F3F3F;
}

.jquery-tablesorter > thead,
.mw-sticky-header > thead {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

@media screen and (max-width: 1099px) and (min-width: 851px) {
	.skin-timeless .jquery-tablesorter > thead,
	.skin-timeless .mw-sticky-header > thead {
		top: 3.5em;
	}
}

@media screen and (min-width: 1100px) {
	.skin-timeless .jquery-tablesorter > thead,
	.skin-timeless .mw-sticky-header > thead {
		top: 3.5em;
	}
}

.jquery-tablesorter > tfoot,
.mw-sticky-header > tfoot {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
}

.client-js .sortable:not(.jquery-tablesorter) > * > tr:first-child > th:not(.unsortable), .jquery-tablesorter th.headerSort {
	background-position-x: center;
	background-position-y: 90%;
	padding-bottom:12px;
	padding-right:0.5em;
}

.mwe-popups.mwe-popups-type-reference .mwe-popups-title {
  display:none;
}

ol.references li:target, sup.reference:target {
  background-color:#444;
}

/* Homepage Buttons effects (main content grid) */
.home-tile {
	position: relative;
	display: inline-block;
	height: 105px;
	width: 105px;
	margin: 1px;
	overflow: hidden;
	background: #333;
}

.home-tile img {
	position: absolute;
	width: 105px;
	height: 105px;
	transition: 0.3s;
}

.home-tile .home-tile-silver img {
	top: 0;
	z-index: 1;
}

.home-tile .home-tile-gold img {
	bottom: 0;
	background: radial-gradient(circle at 50% 75%, #727272 0, #151515 50%);
	z-index: 2;
	opacity: 0;
}

.home-tile .home-tile-link {
	position: absolute;
	bottom: 0;
	width: 100%;
	background-color: rgba(179, 36, 36, 0.9);
	text-align: center;
	text-transform: uppercase;
	color: #DB8200;
	text-shadow: 0 0 2px;
	font-size: 12px;
	z-index: 4;
	font-family: 'Liberation Sans', 'Segoe UI', sans-serif;
}

.home-tile .home-tile-link a {
	color: #DB8200;
	text-decoration: none;
}

.home-tile:hover .home-tile-gold img {
	opacity: 1;
}

code, pre, .mw-code {
  color: #eee;
  background: #4d4d4d;
}

.talkbox {
   width: 65%;
   margin-left: auto;
   margin-right: auto;
   margin-top: 0.5em;
   margin-bottom: 0.5em;
   border: none;
   color:#eee;
   background-color: #2a2a2a;
}

.talkbox .th {
    background-color: #8B0000;
    color:#eee;
}

.diff-addedline .diffchange {
  color: #000;
}

.diff-deletedline .diffchange {
  color: #000;
}

.diff-context,
#pagehistory li.selected {
  background-color: #4a4a4a;
  color: #eee;
}

.mw-echo-ui-notificationItemWidget-unread:hover {
  background-color: rgba(41,98,204,0.1);
}

.mw-echo-ui-notificationItemWidget-content-actions-timestamp,
.oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
.mw-echo-ui-notificationItemWidget-content-message-header {
  color:#eee;
}

.mw-tmh-player-interstitial,
.mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
  background: none;
  box-shadow: none;
}

.mw-echo-ui-notificationItemWidget:last-child,
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > .mw-echo-ui-notificationsListWidget > .mw-echo-ui-notificationItemWidget,
.mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup > .oo-ui-popupWidget-body > .mw-echo-ui-notificationsListWidget > .mw-echo-ui-notificationItemWidget:last-child,
.mw-echo-ui-pageNotificationsOptionWidget.oo-ui-optionWidget-selected {
  background-color: #2a2a2a;
}

.mw-echo-ui-placeholderItemWidget {
  background-color: #333;
}

.more_info {
  border-bottom: 1px dotted;
  position: relative;
}

.more_info .title {
    position: absolute;
    top: 20px;
    background: silver;
    padding: 4px;
    left: 0;
    white-space: nowrap;
    color:black;
}

.noprint {
  line-height: 2.2;
}

.mw-footer-container {
  border: 1px solid #333;
  background: #333;
}

.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:first-child > .oo-ui-buttonElement-button:hover,
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child > .oo-ui-buttonElement-button:hover,
.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active,
.oo-ui-messageDialog-message,
.oo-ui-toolbar-actions .oo-ui-toolbar, .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
.ve-ui-mwSaveDialog-license,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	color:#eee;
}

body #mw-page-header-links li.selected a,
body #p-logo-text a,
body #searchInput,
body .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,
body .mw-body .mw-search-profile-tabs,
body .mw-body fieldset#mw-searchoptions,
body .mw-changeslist-legend,
body .mwe-popups .mwe-popups-extract,
body .suggestions .suggestions-result,
body .suggestions a.mw-searchSuggest-link,
body .suggestions a.mw-searchSuggest-link:active,
body .suggestions a.mw-searchSuggest-link:focus,
body .suggestions a.mw-searchSuggest-link:hover,
body .suggestions-special .special-query,
body .wikitable,
body .mediawiki,
body {
    color: #eee
}

.cm-mw-matchingbracket {
  background-color:#585858 !important;
  box-shadow:inset 0 0 1px 1px #585858 !important;
  font-weight:bold !important; 
}

@media only screen and (min-width:1100px) {
    body #mw-related-navigation .sidebar-chunk,
    body #mw-site-navigation .sidebar-chunk {
        border-radius: .5rem;
        box-shadow: 0 1px 2px rgb(33 34 35/50%),0 1px 2px rgb(26 26 27/50%)
    }
}

.mainpage-contents .tile-below {
    flex: 1;
    margin-right: 0.9rem;
}

.mainpage-contents .tile-below:last-child {
    margin-right: 0;
}

.tile-below {
    display: flex;
    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);
}

.tile-below h2 {
    font-size: 1.4em;
    font-weight: bold;
    border: none;
    margin: 0 0 0.4em;
}

.tile-below .byline + h2 {
    margin-top: -0.5em;
}


.mainpage-popular .tile-halves {
  display: flex;
}

#personal h2,
#p-logo-text a,
#content h1, 
#content h2 {
  font-family: 'Liberation Sans', 'Segoe UI', sans-serif;
  line-height: 1.3;
}

#content h3,
#content h4,
#content h5 {
  font-family: 'Liberation Sans', 'Segoe UI', sans-serif;
}

.mw-body h3 {
	font-weight:bold;
}

.thumbimage {
    border: none;
    background-color: transparent;
}

.thumbinner .thumbimage, .thumbborder {
  border: none;
}

.thumbcaption {
  padding: 4px 6px;
  background: #2a2a2a;
  margin-right: 2px;
}

.thumbinner {
  background: none;
  border: none;
  padding: 0;
}

#menus-cover {
  background:#2a2a2a;
}

#mw-wrapper .dropdown-active .pokey, #mw-wrapper .dropdown-active .dropdown, #mw-wrapper .dropdown-active .sidebar-inner {
	background:#333;
	color:#eee;
	border:none;
}

#mw-site-navigation .sidebar-inner {
	background:#333;
	border:none;
}

#mw-content-block {
	background:#2a2a2a;
}

#mw-header-nav-hack {
	background:#333;
	border-top:solid 2px #666;
}

.mw-body li.gallerybox div.thumb {
	background:#4c4c4c;
	border:solid #666;
}

ul#filetoc, .toc, .toccolours, .mw-warning {
	padding:0.75em 1em;
	margin-top:0.5em;
	margin-bottom:0em;
	min-width: 0;
}

.mwe-popups .mwe-popups-extract {
	color:#DB8200;
}
.mw-body dd {
	margin-bottom:0em;
}

.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection {
   background: #585858 !important;
}

a.mw-selflink:hover {
	color:#eee;
}

.mwe-popups.mwe-popups-image-pointer .mwe-popups-extract {
	color:#DB8200;
	padding-bottom:3px;
}

.mwe-popups.mwe-popups-is-not-tall .mwe-popups-extract {
	color:#DB8200;
	padding-bottom:3px;
}

.messagebox {
    width: 65%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    border: none;
    border-left: 15px solid #8B0000;
    background-color: #2a2a2a;
    color:#ccc;
}

.messagebox, .errorbox, .warningbox, .successbox {
  padding: 0px 12px;
}

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

ul.gallery.mw-gallery-slideshow .gallerybox.slideshow-current {
    background:#2a2a2a;
}

.navbox {
    font-size: 0.85em;
    background: #4c4c4c;
    border-collapse: collapse;
    margin: 15px auto;
    width: 100%;
    clear: both;
    border: none;
}

.navbox:not(.navbox-collapsible) {
    box-shadow: 0 2px 3px -2px rgba(0, 0, 0, 0.1);
}

.navbox .navbox-title {
    font-size: 110%;
    background: #B32424;
    text-align: center;
    padding: 3px 8px;
    border: none;
}

.navbox .navbox-title .mw-collapsible-toggle {
    font-size: 0.9em;
    margin-left: 6em;
    float: right;
}

.navbox .navbox-footer {
    background: #8B00000;
    border-top: 1px;
    text-align: center;
    font-size: smaller;
}

.navbox .navbox-group-title {
    background: #444;
    border-bottom: 1px solid #666;
    font-weight: bold;
    padding-left: 10px;
    width: 15%;
}

.navbox .navbox-group-title a {
    white-space: normal;
}

.navbox .navbox-list {
    border-bottom: 1px solid #666;
    border-left: 1px solid #666;
    padding: 4px 8px;
}

.navbox .navbox-list ul {
    margin: 0;
}

.navbox .navbox-list li {
    display: inline-block;
}

.navbox .navbox-list li + li::before {
    content: '• ';
}

.navbox .navbox-parent {
    padding: 0;
}

.navbox .navbox-subgroup {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

.navbox .navbox-subgroup > tbody > tr:last-child > td {
    border-bottom: none;
}

.navbox .navbox.navbox-collapsible {
    font-size: 100%;
    margin: 5px 0 0;
}

.navbox .navbox.navbox-collapsible .navbox-title {
    background: #8B0000;
    padding: 0 8px;
}

.navbox img {
    height: auto;
    width: auto;
    padding: 0 1px;
}

.navbox + .navbox {
    margin-top: -8px;
}

.navbox-data {
    display: none;
}

.navbox-data + .navbox {
    margin-top: -8px;
}

.mw-collapsible.mw-collapsed {
    min-width: 250px;
}

.mw-collapsible .mw-collapsible-toggle {
    font-weight: normal;
}

.navbox-title-name-plain {
    padding-right: 6em;
}

.navbox-title-name-notplain {
    padding-right: 0;
}

.navbox-title-noname-plain {
    padding-left: 0;
}

.navbox-title-noname-notplain {
    padding-left: 6em;
}

.mwe-popups .mwe-popups-container {
  background-color: #2A2A2A;
}

.mwe-popups {
  background: #2a2a2a;
  box-shadow: 0 30px 90px -20px rgba(0, 0, 0, 0);
}

.mwe-popups .mwe-popups-extract[dir='ltr']:after {
 right:0;
 background-image:-webkit-linear-gradient(to right,rgba(255,255,255,0),#2a2a2a 50%);
 background-image:linear-gradient(to right,rgba(255,255,255,0),#2a2a2a 50%)
}

.mwe-popups .mwe-popups-settings-icon {
  display: none;
}

ul.tabbernav li a:link {
	color:#DB8200;
}

ul.tabbernav li.tabberactive a:hover {
  background: #333;
  border-bottom: 1px solid #333;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  border-right: 1px solid #666;
  color:#DB8200;
  }
  
ul.tabbernav li a {
  background: #2a2a2a;
  border-bottom: 1px solid #666;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  border-right: 1px solid #666;
  color:#DB8200;
  }
  
ul.tabbernav li.tabberactive a {
  background-color: #333;
  border-bottom: 1px solid #333;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  border-right: 1px solid #666;
  color:#DB8200;
  }
  
ul.tabbernav li a:hover {
  background: #333;
  border-bottom: 1px solid #666;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  border-right: 1px solid #666;
  color:#DB8200;
  }
  
ul.tabbernav {
  border-bottom: 1px solid #666;
  color:#DB8200;
  }
  
.tabber .tabbertab {
  border: 1px solid #666;
  border-top: 0;
  }

.thumbimage {
  background-color: #333;
}

.mw-advancedSearch-namespace-selection {
  background:#2a2a2a;
  }
  
.mw-advancedSearch-fieldContainer {
  background:#2a2a2a;
  }

.mw-advancedSearch-fieldContainer .oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
  background:#2a2a2a;
  color:#c1c1c1;
  }

.gallerytext p {
  color:#c1c1c1;
}

.zoom_img img{
-moz-transition:-moz-transform 0.1s ease-in; 
-webkit-transition:-webkit-transform 0.1s ease-in; 
-o-transition:-o-transform 0.1s ease-in;
transition:transform 0.1 ease-in;
}

.zoom_img img:hover{
-moz-transform:scale(2); 
-webkit-transform:scale(2);
-o-transform:scale(2);
transform:scale(2);
}

ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper, ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper, ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
  background: rgba(42,42,42,0.8);
}

.tocnumber {
	display: none;
}

.toc, .toccolours {
  border: 1px solid #666;
  background-color: #2a2a2a;
}

	.cm-mw-pagename { text-decoration: underline; }
	
	.cm-mw-matching { background-color: #ffd700; }
	
	.cm-mw-skipformatting { background-color: #adf; }
	.cm-mw-list { color: #08f; font-weight: bold; }
	.cm-mw-doubleUnderscore, .cm-mw-signature, .cm-mw-hr { color: #08f; font-weight: bold; background-color: #eee; }
	.cm-mw-indenting { color: #08f; font-weight: bold; }
	.cm-mw-mnemonic { color: #290; }
	.cm-mw-comment { color: #84a0a0; font-weight: normal; }
	.cm-mw-apostrophes-bold, .cm-mw-apostrophes-italic { color: #08f; }

.wikiEditor-ui-toolbar .page-table th,
.wikiEditor-ui-toolbar .section-help .page-table td.cell-syntax, .wikiEditor-ui-toolbar .section-help .page-table td.cell-result,
.wikiEditor-ui-toolbar .section-help .page-table td.cell-description,
.wikiEditor-ui-toolbar .group .tool-select .options .option,
.wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited,
.wikiEditor-ui-toolbar .group .tool-select .label,
.CodeMirror pre.CodeMirror-line, .CodeMirror pre.CodeMirror-line-like {
	color:#eee;

}
	
	pre.CodeMirror-line.cm-mw-section-1,
	pre.CodeMirror-line-like.cm-mw-section-1 {
		font-size: 1.8em;
		line-height: 1.2em;
	}
	pre.CodeMirror-line.cm-mw-section-2,
	pre.CodeMirror-line-like.cm-mw-section-2 {
		font-size: 1.5em;
		line-height: 1.2em;
	}
	pre.CodeMirror-line.cm-mw-section-3,
	pre.CodeMirror-line-like.cm-mw-section-3 {
		font-weight: bold;
	}
	pre.CodeMirror-line.cm-mw-section-4,
	pre.CodeMirror-line-like.cm-mw-section-4 {
		font-weight: bold;
	}
	pre.CodeMirror-line.cm-mw-section-5,
	pre.CodeMirror-line-like.cm-mw-section-5 {
		font-weight: bold;
	}
	pre.CodeMirror-line.cm-mw-section-6,
	pre.CodeMirror-line-like.cm-mw-section-6 {
		font-weight: bold;
	}
	.cm-mw-section-header { color: #08f; font-weight: normal; }
	
	.cm-mw-template { color: #b19cd9; font-weight: normal; }
	.cm-mw-template-name { color: #b19cd9; font-weight: bold; }
	.cm-mw-template-name-mnemonic { font-weight: normal; }
	.cm-mw-template-argument-name { color: #b19cd9; font-weight: bold; }
	.cm-mw-template-delimiter { color: #b19cd9; font-weight: bold; }
	.cm-mw-template-bracket { color: #b19cd9; font-weight: bold; }
	
	.cm-mw-templatevariable { color: #f50; font-weight: normal; }
	.cm-mw-templatevariable-name { color: #f50; font-weight: bold; }
	.cm-mw-templatevariable-bracket { color: #f50; font-weight: normal; }
	.cm-mw-templatevariable-delimiter { color: #f50; font-weight: bold; }
	
	.cm-mw-parserfunction { font-weight: normal; }
	.cm-mw-parserfunction-name { color: #a11; font-weight: bold; }
	.cm-mw-parserfunction-bracket { color: #a11; font-weight: bold; }
	.cm-mw-parserfunction-delimiter { color: #a11; font-weight: bold; }
	
	pre.CodeMirror-line.cm-mw-exttag,
	pre.CodeMirror-line-like.cm-mw-exttag {
		background-color: rgba( 119, 0, 170, 0.02 );
	}
	.cm-mw-exttag { background-color: rgba( 119, 0, 170, 0.04 ); }
	.cm-mw-exttag-name { color: #290; font-weight: bold; }
	.cm-mw-exttag-bracket { color: #290; font-weight: normal; }
	.cm-mw-exttag-attribute { color: #290; font-weight: normal; }
	
	.cm-mw-htmltag-name { color: #290; font-weight: bold; }
	.cm-mw-htmltag-bracket { color: #290; font-weight: normal; }
	.cm-mw-htmltag-attribute { color: #290; font-weight: normal; }
	
	pre.CodeMirror-line.cm-mw-tag-pre,
	pre.CodeMirror-line-like.cm-mw-tag-pre,
	.cm-mw-tag-pre {
		background-color: rgba( 0, 0, 0, 0.04 );
	}
	pre.CodeMirror-line.cm-mw-tag-nowiki,
	pre.CodeMirror-line-like.cm-mw-tag-nowiki,
	.cm-mw-tag-nowiki {
		background-color: rgba( 0, 0, 0, 0.04 );
	}
	
	.cm-mw-link { color: #e69710; font-weight: normal; }
	.cm-mw-link-pagename { color: #e69710; font-weight: normal; }
	.cm-mw-link-tosection { color: #E5CC3B; font-weight: normal; }
	.cm-mw-link-bracket { color: #e69710; font-weight: normal; }
	/* .cm-mw-link-text { } */
	.cm-mw-link-delimiter { color: #e69710; font-weight: normal; }
	
	.cm-mw-extlink, .cm-mw-free-extlink { color: #E25600; font-weight: normal; }
	.cm-mw-extlink-protocol, .cm-mw-free-extlink-protocol { color: #E25600; font-weight: bold; }
	/* .cm-mw-extlink-text { } */
	.cm-mw-extlink-bracket { color: #E25600; font-weight: bold; }
	
	.cm-mw-table-bracket { color: #e0e; font-weight: bold; }
	.cm-mw-table-delimiter { color: #e0e; font-weight: bold; }
	.cm-mw-table-definition { color: #e0e; font-weight: normal; }
	.cm-mw-table-caption { font-weight: bold; }
	
	/* .cm-mw-template-ground {} */
	.cm-mw-template2-ground { background-color: rgba( 170, 17, 17, 0.04 ); }
	.cm-mw-template3-ground { background-color: rgba( 170, 17, 17, 0.08 ); }
	.cm-mw-template-ext-ground { background-color: rgba( 119, 0, 170, 0.04 ); }
	.cm-mw-template-ext2-ground { background-color: rgba( 119, 0, 170, 0.08 ); }
	.cm-mw-template-ext3-ground { background-color: rgba( 119, 0, 170, 0.12 ); }
	.cm-mw-template-link-ground { background-color: rgba( 34, 17, 153, 0.04 ); }
	.cm-mw-template-ext-link-ground { background-color: rgba( 77, 9, 162, 0.08 ); }
	.cm-mw-template-ext2-link-ground { background-color: rgba( 91, 6, 164, 0.12 ); }
	.cm-mw-template-ext3-link-ground { background-color: rgba( 98, 4, 166, 0.16 ); }
	.cm-mw-template2-ext-ground { background-color: rgba( 145, 9, 94, 0.08 ); }
	.cm-mw-template2-ext2-ground { background-color: rgba( 136, 6, 119, 0.12 ); }
	.cm-mw-template2-ext3-ground { background-color: rgba( 132, 4, 132, 0.16 ); }
	.cm-mw-template2-link-ground { background-color: rgba( 102, 17, 85, 0.08 ); }
	.cm-mw-template2-ext-link-ground { background-color: rgba( 108, 11, 113, 0.12 ); }
	.cm-mw-template2-ext2-link-ground { background-color: rgba( 111, 9, 128, 0.16 ); }
	.cm-mw-template2-ext3-link-ground { background-color: rgba( 112, 7, 136, 0.2 ); }
	.cm-mw-template3-ext-ground { background-color: rgba( 153, 11, 68, 0.12 ); }
	.cm-mw-template3-ext2-ground { background-color: rgba( 145, 9, 94, 0.16 ); }
	.cm-mw-template3-ext3-ground { background-color: rgba( 139, 7, 109, 0.2 ); }
	.cm-mw-template3-link-ground { background-color: rgba( 125, 17, 62, 0.12 ); }
	.cm-mw-template3-ext-link-ground { background-color: rgba( 123, 13, 89, 0.16 ); }
	.cm-mw-template3-ext2-link-ground { background-color: rgba( 122, 10, 105, 0.2 ); }
	.cm-mw-template3-ext3-link-ground { background-color: rgba( 122, 9, 116, 0.24 ); }
	.cm-mw-ext-ground { background-color: rgba( 119, 0, 170, 0.04 ); }
	.cm-mw-ext2-ground { background-color: rgba( 119, 0, 170, 0.08 ); }
	.cm-mw-ext3-ground { background-color: rgba( 119, 0, 170, 0.12 ); }
	.cm-mw-ext-link-ground { background-color: rgba( 34, 17, 153, 0.04 ); }
	.cm-mw-ext2-link-ground { background-color: rgba( 77, 9, 162, 0.08 ); }
	.cm-mw-ext3-link-ground { background-color: rgba( 91, 6, 164, 0.12 ); }
	.cm-mw-link-ground { background-color: rgba( 34, 17, 153, 0.04 ); }
	
	.cm-mw-matchingbracket {
		background-color: #eee;
		box-shadow: inset 0 0 1px 1px #999;
		font-weight: bold;
	}

.CodeMirror-gutter {
  background:#2a2a2a;
}

.CodeMirror-linenumber {
  background:#2a2a2a;
  color:#c1c1c1;
}


.mainpage-header {
    display: flex;
    margin: 0em 1.75em 1.5em;
}

.mainpage-header .header-intro {
    flex: 2;
}

.mainpage-header .header-intro h1 {
    font-size: 2.5em;
    font-weight: bold;
    border: none;
    margin: 0 0 0.15em;
}

.mainpage-header .header-intro p {
    font-size: 1.1em;
    line-height: 1.7em;
}

.mainpage-header .header-stats {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -1em;
}

.mainpage-header .header-stats ul {
    list-style: none;
}

.mainpage-body {
    display: flex;
    flex-flow: row wrap;
}

.mainpage-body .tile {
    padding-left: 1.75em;
    padding-right: 1.75em;
    max-width: 100%;
}

.mainpage-body .tile-row {
    width:100%;
    margin-bottom: 0.9rem;
}

.mainpage-contents {
    background:#4c4c4c;
    padding: 55px 1em 2em 2.5em;
    flex-wrap: nowrap;
    align-items: flex-start;
    overflow-x: auto;
    position: relative;
    border: 1px solid #666;
}

.mainpage-contents::before {
    content: 'Navigation';
    margin: 1em;
    position: absolute;
    top: 0;
    color: #eee;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.mainpage-contents .tile-halves {
    border: none;
    background: none;
    box-shadow: none;
    flex: 0 0 auto;
    width: 200px;
    margin-right: 10px;
}

.mainpage-contents .tile-top {
    padding: 0;
    height: initial;
}

.mainpage-contents .tile-bottom {
    padding: 0.5rem 1rem;
}

.mainpage-contents h2 {
    padding: 0 0 0.35em;
    width: 100%;
}


.tile {
    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 {
    font-size: 1.4em;
    font-weight: bold;
    border: none;
    margin: 0 0 0.4em;
}

.tile .byline + h2 {
    margin-top: -0.5em;
}

.tile-halves {
    border: 1px solid #e4eaee;
    background: #ffffff;
    box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1);
}

.tile-halves .byline + h2 {
    margin-top: -0.5em;
}


.tile-halves h2 {
    font-size: 1.4em;
    font-weight: bold;
    border: none;
    margin: 0 0 0.4em;
}

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

.tile-top.tile-image {
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 0;
    max-height: 12em;
    transition: 0.4s ease-out;
}

.tile-top.tile-image:hover img {
    transform: scale(1.1);
    transition: 0.5s ease-out;
}

.tile-top.tile-image a {
    width: 100%;
}

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

.tile-bottom {
    width: 100%;
    padding: 1rem 1.5rem 0.6rem;
    border:none;
}

.tile-bottom.link-button {
    align-self: flex-end;
    padding: 0;
    background: #B41E2B;
    border:none;
}

.tile-bottom.link-button a {
    display: block;
    text-align: center;
    padding: 0.75em 1.5em 0.8em;
    text-decoration: none;
    border:none;
}

.tile-bottom.read-more {
    transition: 0.3s ease-out;
}

.tile-bottom.read-more a {
    font-weight: bold;
    text-align: right;
}


.tile-bottom.read-more:hover .arrow {
    transform: translateX(50%);
}

.tile-bottom.read-more .arrow {
    filter: invert(36%) sepia(9%) saturate(463%) hue-rotate(175deg) brightness(94%) contrast(80%);
    margin-left: 0.4em;
    transition: 0.3s ease-out;
}

.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: #B32424;
}

.mp-popular-page-light a {
    flex: 1;
    display: block;
    color:#DB8200;
    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-left {
    flex: 2;
    display: flex;
    flex-flow: column wrap;
    margin-right: 0.9rem;
}

.mainpage-left > * {
    margin: 0 0 0.9rem;
}

.mainpage-right {
    flex: 1;
    display: flex;
    flex-flow: column wrap;
    margin-right: 0.9rem;
}

.mainpage-right > * {
    margin: 0 0 0.9rem;
}

.arrow {
    display: inline-block;
    height: 0.7rem;
    width: 0.45rem;
    vertical-align: middle;
}

.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: #525ee0;
    border: none;
    padding: 1em 1.75em;
}

.mainpage-discord .tile-bottom p {
    color: #ffffff;
    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: #ffffff;
    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;
}

.tile-popular {
    width: 100%;
    padding: 1.3rem 1.5rem 0.6rem;
    background-color: #4c4c4c;
    border: 1px solid #666;
}

.mainpage-discord .tile-top a:hover .arrow {
    transform: translateX(50%);
}

.CodeMirror-scroll { background:#4c4c4c; }


@media only screen and (max-width: 65.999rem) {

    .mainpage-contents .tile-halves:nth-child(1),
    .mainpage-contents .tile-halves:nth-child(2),
    .mainpage-contents .tile-halves:nth-child(3) {
          margin-bottom: 0.9rem;
    }

    .mainpage-contents .line-break {
          width: 100%;
    }

     .mainpage-header .header-stats,
     .mainpage-articleoftheweek {
	          display: none;
	    }

}

@media only screen and (min-width: 66rem) and (max-width: 72.999rem) {

     .mainpage-header .header-stats,
     .mainpage-articleoftheweek {
	          display: none;
	    }
}
@media only screen and (min-width: 73rem) and (max-width: 99.999rem) {


    .mainpage-header .header-stats,
    .mainpage-contents .line-break {
          display: none;
    }

}

@media only screen and (min-width: 100rem) {
    .mainpage-header .header-intro {
          margin-right: 2em;
    }

    .mainpage-contents .line-break {
          display: none;
    }
   .themainpage {
  width:82rem;
  margin: 0 auto;
} 
}

@media screen and (max-width: 1000px) {
    .popular-pages ul {
          grid-template-columns: repeat(2, 1fr);
    }}

#mw-header-container {
  background:#333;
}

#mw-content-container,
#searchInput {
  background:#2a2a2a;
  color:#eee;
}

#personal h2 span,
#p-logo-text a {
  color:#eee;
}

#mw-content {
	background:#333;
	border:1px solid #2a2a2a;
}

@media only screen and (min-width:1100px) {
    body #mw-related-navigation .sidebar-chunk,
    body #mw-site-navigation .sidebar-chunk {
  background:#333;
  border: 1px solid #2a2a2a;
}
}
#simpleSearch {
  border: solid 1px #666;
}

a {
color:#DB8200;
}
a:hover {
color:#DB8200;
}
a:visited {
color:#DB8200;
}
a:visited:hover {
color:#DB8200;
}

.wikiEditor-ui-toolbar .tabs span.tab a,
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled,
.oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover, 
.mw-parser-output a.external:visited:hover,
.mw-parser-output a.external:visited,
.mw-parser-output a.external:hover,
.mw-parser-output a.external,
.tools-inline li.selected a {
  color:#DB8200;
}
	
/* 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;
  }
}

/* Align top colour bar with page columns */
.ts-inner {
  padding: 0 0 0 1em;
}

/* Re-aligning bottom logos */
#footer { padding-right: 1em; }

.mw-body .mw-parser-output h1.buttontext::after,
.mw-body .mw-parser-output h2.buttontext::after {
	border:none;
}

body .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend,
body .mw-body .mw-search-profile-tabs,
body .mw-body fieldset#mw-searchoptions,
body .mw-changeslist-legend,
body .mw-warning,
body .suggestions,
body .suggestions .suggestions-results,
body .suggestions .suggestions-special,
body .wikitable,
body ul#filetoc {
    background-color: #4C4C4C;
    border-color: #666666;
}
 
body .thumbborder,
body .thumbinner .thumbimage,
body .wikitable>*>tr>td,
body .wikitable>*>tr>th,
body .wikitable>tr>td,
body .wikitable>tr>th {
    border-color: #666666;
    color:#eee;
}
 
body .wikitable>*>tr>th,
body .wikitable>tr>th {
    background-color: #595959;
    color:#eee;
}

.mw_metadata > tr > th, .mw-datatable > tr > th, .wikitable > tr > th, .mw_metadata > tr > td, .mw-datatable > tr > td, .wikitable > tr > td, .mw_metadata > * > tr > th, .mw-datatable > * > tr > th, .wikitable > * > tr > th, .mw_metadata > * > tr > td, .mw-datatable > * > tr > td, .wikitable > * > tr > td {
	padding: 0.1em 0.5em;
}

.toctogglelabel {
	color:#DB8200;
}

.mw-wiki-title {
   line-height: 1 !important;
}

.oo-ui-toolbar-bar {
	background: #2a2a2a;
	color:#eee;
}

.oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link, .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
	background:#444;
	color:#eee;
}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.oo-ui-window-content,
.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover,
.oo-ui-dialog-content > .oo-ui-window-head, .oo-ui-dialog-content > .oo-ui-window-body, .oo-ui-dialog-content > .oo-ui-window-foot,
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:active, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link, .oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active > .oo-ui-tool-link,
.oo-ui-processDialog .oo-ui-actionWidget.oo-ui-labelElement > .oo-ui-buttonElement-button,
.oo-ui-window-body,
.oo-ui-panelLayout,
.oo-ui-menuLayout.oo-ui-menuLayout-showMenu.oo-ui-menuLayout-top > .oo-ui-menuLayout-content,
.oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle,
.oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover,
.oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
	background:#444;
}

.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:first-child > .oo-ui-buttonElement-button,
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child > .oo-ui-buttonElement-button,
.oo-ui-popupWidget-popup,
.oo-ui-popupWidget-head,
.ve-ui-mwNoticesPopupTool-items, .ve-ui-mwHelpPopupTool-items,
.ve-ui-mwSaveDialog-options,
.oo-ui-processDialog-location,
.oo-ui-popupToolGroup-tools {
	background:#2a2a2a;
}

.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:first-child > .oo-ui-buttonElement-button:hover,
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child > .oo-ui-buttonElement-button:hover,
.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active,
.oo-ui-messageDialog-message,
.oo-ui-toolbar-actions .oo-ui-toolbar, .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-toolbar-actions .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
.ve-ui-mwSaveDialog-license,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	color:#eee;
}

.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active {
	border: none;
}

.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover, .oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive):not(.oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active {
	background:#2a2a2a;
	border-right: 1px solid #c8ccd1;
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button,
.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
	background: #444;
	color:#eee;
}

.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
	color:#fff;
}

.wikiEditor-ui-toolbar .group .tool-select .menu .options .option:hover,
.CodeMirror-gutter {
  background:#2a2a2a;
}

.wikiEditor-ui-toolbar .group .tool-select .options .option,
.wikiEditor-ui-toolbar {
	background:#444
}

.wikiEditor-ui-toolbar .booklet > .index > .current {
	background:#2a2a2a;
	color:#5bf;
}

.wikiEditor-ui-toolbar .booklet > .index > :hover {
	background:#333;
}

.wikiEditor-ui-toolbar .page-characters div span {
	color:#eee;
}

.wikiEditor-ui-toolbar .page-characters div span:hover {
	background:#444;
}

body .editOptions {
background-color: #2a2a2a;
color:#eee;
}

body textarea,
body .oo-ui-textInputWidget .oo-ui-inputWidget-input,
body .mw-code,
body mw-tagfilter-input mw-ui-input mw-ui-input-inline {
background-color: #4D4B4E;
    color: #eee;
}

form input:not(.mw-widgets-datetime-dateTimeInputWidget-editField):not(.mw-history-compareselectedversions-button) {
	margin: 0;
	padding: 0;
}

form:not(.oo-ui-layout) textarea,
form:not(.oo-ui-layout) input {
	border:none;
	border-radius:0px;
}

/** Translation CSS changes **/

/* Change background of language list to match rest of the wiki, and remove the bottom border */

.mw-pt-languages {
	background-color: #333;
	border-bottom:none;
}

/* Remove other languages label */

.mw-pt-languages-label {
	display:none;
}

/* Align languages and "translate this page" on the left-hand side of the page */

.mw-pt-languages-list,
.mw-pt-translate-header {
	text-align:left;
}

/* Correct black text on black blackgrounds */

.tux-breadcrumb,
.tux-editor-header,
.tux-messagelist .tux-message-pagemode .tux-pagemode-source,
.tux-messagelist .tux-message-proofread .tux-proofread-source,
.tux-statsbar .tux-statsbar-info,
.tux-messagelist,
.tux-messagelist .tux-message-pagemode .tux-pagemode-translation,
.grid .tux-message-editor .messagekey,
.tux-messagelist .tux-message-proofread .tux-proofread-translation,
.mw-ui-button.mw-ui-quiet, .mw-ui-button.mw-ui-quiet.mw-ui-progressive, .mw-ui-button.mw-ui-quiet.mw-ui-destructive,
.tux-message-editor .shortcutinfo,
input[type="checkbox"]:hover + .mw-ui-button.mw-ui-quiet, input[type="checkbox"]:hover + .mw-ui-button.mw-ui-quiet.mw-ui-progressive, input[type="checkbox"]:hover + .mw-ui-button.mw-ui-quiet.mw-ui-destructive, .mw-ui-button.mw-ui-quiet:hover, .mw-ui-button.mw-ui-quiet.mw-ui-progressive:hover, .mw-ui-button.mw-ui-quiet.mw-ui-destructive:hover {
	color:#eee;
}

/* Correct link colors */

.tux-breadcrumb__item--aggregate {
	color:#DB8200;
}

/* Correct colors of the translation boxes */

.ext-translate-container .tux-messagelist .tux-message-pagemode,
.tux-message-editor .editcolumn,
.grid .tux-message-editor .infocolumn-block,
.ext-translate-container .tux-messagelist .tux-message-proofread {
	background-color:#333;
}

.ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact:hover,
.ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact:hover {
	background-color:#4c4c4c;
	border-left:1px solid #777;
	border-right:1px solid #777;
	border-bottom:1px solid #777;
}

.ext-translate-container .tux-messagelist .tux-message-pagemode:first-child .tux-message-item-compact,
.ext-translate-container .tux-messagelist .tux-message-proofread:first-child .tux-message-item-compact {
	border-top:1px solid #777;
}

/* Correct floating bottom bar on translation page */

.tux-action-bar {
	background-color:#333;
	color:#eee;
	box-shadow:2px 4px 10px rgba(0,0,0,0.5);
}

.tux-action-bar.floating {
	border:none;
	border-radius:5px;
}

.tux-action-bar button {
	background-image:none;
	background-color:#4c4c4c;
	color:#eee;
}

.tux-action-bar button:hover {
	background-color:#222;
	background-image:none;
	color:#eee;
}

/* Correction of floating translation box */

.tux-message-editor__caret::after {
	border:none;
}

.tux-editor-editsummary-block input,
.tux-editor-editsummary-block input:disabled {
	color:#eee;
	background-color:#2c2c2c;
	border:1px solid #777;
}