MediaWiki:Hydra.css

/* CSS placed here will affect users of the Hydra skin */
/* For elements which only display in the mobile view */

.mobileonly {
	display: none
}

body.page-Astroneer_Wiki h1.firstHeading {
	display: none
}

@font-face {
font-family: 'Roboto-Regular';
src: local('Roboto-Regular'),local('Roboto-Regular'),url(/media/hydra/fonts/Roboto-Regular.ttf) format('truetype')
}

body {
	background: #9ed2cd url(https://astroneer.gamepedia.com/media/astroneer.gamepedia.com/1/1b/Bgrepeat.png) repeat fixed center center
}

body #pageWrapper {
	margin-right: 5px
}

div#mw-page-base {
	background-color: rgba(0,0,0,0);
	background-image: none
}

#mw-head-base {
	background-color: rgba(0,0,0,0);
	background-image: none;
	border-bottom: 0px
}

div#mw-head {
	background: rgba(0,0,0,0.1);
	color: #fffdfb;
	height: 30px;
	left: 193px;
	margin-top: 3em;
	margin-right: 5px;
	position: absolute;
	width: auto
}

.mw-wiki-logo {
	-webkit-filter: drop-shadow(0px 0px 10px #999999);
	filter: drop-shadow(0px 0px 3.5px #999999) drop-shadow(1px 1px 1px #999999)
}

#left-navigation {
	margin-left: 10px;
	margin-top: 0
}

#right-navigation {
	margin-top: 0
}

div#p-sharing .menu {
	margin-left: 10px;
	min-width: 0px;
	width: 48px
}

#p-sharing #socialIconImages img {
	width: 100%
}

#p-sharing #socialIconImages a {
	width: 40px
}

div.vectorMenu h3 span::after {
    filter: invert(100%);
    top: 0.5em;
}

.vectorTabs #ca-watch.icon a,
.vectorTabs #ca-unwatch.icon a {
    padding-top: 28px;
}

div#p-search {
    margin-top: -7px;
}

#p-search form,
#p-search input {
    margin: 0.15em 0 0;
}

div.vectorTabs {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
    height: 30px;
    margin: 0;
    padding: 0;
}
 
div.vectorTabs span,
div#mw-head div.vectorMenu h3 {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
}

div.vectorTabs span a {
    padding-top: 0.5em;
}

div.vectorTabs li.selected a,
div.vectorTabs li.selected a span,
div.vectorTabs li.selected a:visited,
div.vectorTabs li.selected a:visited span {
    color: #FFFFFF !important;
    font-weight: bold;
    text-decoration: none;
}
 
div.vectorTabs ul {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
}
 
div#mw-head,
div.vectorTabs li a,
.vectorTabs li a span,
div#mw-head div.vectorTabs a,
div.vectorMenu h3 span {
    color: #fffdfb;
}

div.vectorMenu h3 span {
    font-family: arial;
    padding-top: 0.6em;
}
 
div.vectorTabs li a:hover,
div.vectorTabs li a:hover span {
    color: #FFFFFF;
}
 
div.vectorTabs li a {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
}
 
div.vectorTabs li.selected, 
div.vectorTabs ul li {
    background-color: rgba(0, 0, 0, 0);
    background-image: none;
}

div#mw-head div.vectorMenu h4,
div#p-variants.vectorMenu #mw-vector-current-variant {
    padding-top: 0.5em;
}

div.vectorMenu div.menu {
    background-color: #fffdfb;
    border: none;
    top: 2em;
}

div#mw-head div.vectorMenu ul {
	background-color: rgba(0,0,0,0);
	border: none
}

div#mw-head div.vectorMenu li a {
	color: #333333
}

div#mw-panel {
	margin-top: -15px
}

div#mw-panel div.portal:not(#p-claimWiki):not(#p-socialProfiles):not(#p-sitePromos) {
	background: #fffdfb;
	box-shadow: 6px 6px 18px -10px #676767;
	margin: 5px;
	padding-top: 5px
}

div#mw-panel div.portal div.body, #mw-panel.collapsible-nav .portal {
	background-image: none
}

div#mw-panel div.portal div.body ul li a, div#mw-panel div.portal div.body ul li a:visited {
	color: #636467
}

div#mw-panel div.portal h3, div#mw-panel div.portal h3:visited, #mw-panel.collapsible-nav .portal h3 a, #mw-panel.collapsible-nav .portal h3 a:visited, #mw-panel.collapsible-nav .portal.collapsed h3 a, #mw-panel.collapsible-nav .portal.collapsed h3 a:visited {
	color: #636467;
	font-weight: bold;
	text-transform: uppercase
}

div#mw-panel div#p-socialProfiles.portal .body {
	margin: auto
}

.socialSidebar {
	width: auto;
	max-width: 100%
}

div#content {
	background: #ecb18f;
	border: none;
	box-shadow: 6px 6px 18px -10px #676767;
	box-sizing: border-box;
	color: #333333;
	font-family: 'Roboto-Regular';
	font-size: 110%
}

a, a:visited, div#content a.extiw, div#content a.extiw:visited, div#content a.external, div#content a.external:visited {
	color: #337ab7
}

.catlinks, ul#filetoc {
	background: #fffdfb;
	border: none;
	box-shadow: 6px 6px 18px -10px #676767;
	clear: both;
	margin-top: 1em;
	padding: 5px
}

.catlinks li {
	border-left: none
}

.CategoryTreeToggle {
	color: #337ab7
}

#toc, .toc, .mw-warning {
	background-color: #fffdfb;
	border: none;
	box-shadow: 6px 6px 18px -10px #676767
}

div.mw-warning-with-logexcerpt {
	border: 2px solid #00a9c6
}

fieldset {
	border: 1px solid #00a9c6
}

div#footer ul li {
	color: #333333
}

div#footer ul li a {
	color: #337ab7
}

table.wikitable {
	background: none repeat scroll 0 0 transparent
}

table.wikitable > caption {
	color: #6b6b6b
}

table.wikitable > tr > th, table.wikitable > * > tr > th {
	background: rgba(0,0,0,0.1);
	border: none;
	color: #fffdfb;
	text-align: center
}

table.wikitable > tr > td, table.wikitable > * > tr > td {
	border: 1px solid #aaaaaa;
	padding: 0.2em
}

.wikitable th {
	background: rgba(0,0,0,0.1);
	border: none;
	color: #fffdfb;
	padding: 0.2em
}

.wikitable td {
	border: 1px solid #aaaaaa;
	color: #333333;
	padding: 0.2em
}

table.mw_metadata th {
	background: rgba(0,0,0,0.1);
	border: none;
	color: #fffdfb
}

table.mw_metadata td {
	background-color: transparent;
	border: 1px solid #aaaaaa;
	color: #333333
}

.mw-datatable th {
	border: none
}

.mw-datatable, .mw-datatable td {
	border: 1px solid #aaaaaa
}

.TablePager {
	border: 1px solid #aaaaaa;
	color: #333333;
	padding: 0 0.15em
}

.TablePager th {
	background: rgba(0,0,0,0.1);
	border: none;
	color: #fffdfb;
	padding: 0 0.15em
}

.TablePager tr:hover td {
	background-color: rgba(0,0,0,0.1) !important;
	color: #333333
}

.TablePager th a {
	background: rgba(0,0,0,0.1);
	color: #fffdfb !important
}

.TablePager td {
	background: transparent !important;
	border: 1px solid #aaaaaa;
	color: #fffdfb
}

fieldset#mw-searchoptions {
	background-color: rgba(0,0,0,0);
	border-color: #aaaaaa !important
}

.mw-search-profile-tabs {
	background-color: rgba(0,0,0,0);
	border: 1px solid #aaaaaa;
	margin-top: 1em
}

.mw-search-profile-tabs div.search-types ul li.current a {
	color: #000000
}

#pagehistory li {
	background-color: rgba(0,0,0,0);
	border: none;
	padding: 3px
}

#pagehistory li.selected {
	background-color: #fffdfb;
	background-image: none;
	border: 1px dashed #aaaaaa;
	padding: 3px
}

table.diff {
	background: transparent
}

td.diff-context {
	background: none repeat scroll 0 0 transparent;
	color: #000000
}

td.diff-deletedline {
	background-color: #FFE49C;
	border-color: #FFE49C;
	color: #000000
}

td.diff-addedline {
	background-color: #A3D3FF;
	border-color: #A3D3FF;
	color: #000000
}

div.thumb {
	border: 1px solid #fffdfb;
	margin: 2px;
}


img.thumbborder {
	border: 1px solid #fffdfb;
	padding: 5px
}

div.thumbinner {
	background-color: #fffdfb;
	border: medium none;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
	margin-bottom: .5em;
}

li.gallerybox div.thumb {
	background-color: rgba(255,253,251,0.42);
	border: 1px solid #fffdfb;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
}

html .thumbimage {
	border: 1px solid #4ba5ec
}

div.tright div.tleft {
	border: 1px solid #4ba5ec !important
}

div.tright {
	clear: right;
	float: right
}

.client-js #preftoc {
	background-color: rgba(0,0,0,0);
	border: 0px;
	margin: 0 0 4px !important
}

.client-js #preftoc, .client-js #preftoc li, .client-js #preferences, .client-js #preftoc li a {
	background-image: none;
	background-color: transparent;
	color: #666666
}

.client-js #preftoc li:first-child {
	margin-bottom: 0;
	margin-left: 5px
}

.client-js #preftoc li.selected a {
	background-color: #fffdfb;
	background-image: none;
	border-color: #fffdfb;
	border-style: solid;
	border-width: 1px;
	color: #333333
}

.client-js #preferences {
	background-color: #fffdfb;
	border: 1px solid #fffdfb;
	box-shadow: 6px 6px 18px -10px #676767
}

.client-js #preferences fieldset {
	border-color: #aaaaaa
}

.wikiEditor-ui {
	background: rgba(0,0,0,0);
	border: none
}

.wikiEditor-ui-tabs div {
	border-bottom: 1px solid #aaaaaa;
	border-right: 1px solid #aaaaaa
}

.wikiEditor-ui-buttons {
	background: rgba(0,0,0,0);
	border-top: none;
	margin-right: 5px
}

.wikiEditor-ui-toolbar {
	background: none repeat scroll 0 0 rgba(0,0,0,0)
}

.wikiEditor-ui-toolbar .tabs span.tab a, .wikiEditor-ui-toolbar .tabs span.tab a:visited {
	color: #333333
}

.wikiEditor-ui-toolbar .tabs span.tab a.current, .wikiEditor-ui-toolbar .tabs span.tab a.current:visited {
	color: #333333;
	font-weight: bold
}

.wikiEditor-ui-toolbar .sections .section {
	background-color: rgba(0,0,0,0.1);
	border-top: 1px solid #aaaaaa;
	color: #333333
}

.wikiEditor-ui-toolbar .page-characters div span {
	border: 1px solid #aaaaaa;
	color: #333333
}

.wikiEditor-ui-toolbar .booklet .pages {
	background-color: rgba(0,0,0,0.1)
}

.wikiEditor-ui-toolbar .booklet .index .current {
	background-color: rgba(0,0,0,0.1);
	color: #0645ad
}

.wikiEditor-ui-toolbar .booklet .index div {
	color: #000000
}

.wikiEditor-ui-toolbar .page-characters div span:hover {
	background-color: rgba(0,0,0,0.1);
	border-color: #aaaaaa;
	color: #333333
}

.wikiEditor-ui-toolbar .page-table th, .wikiEditor-ui-toolbar .page-table td {
	color: #000000
}

.wikiEditor-ui-toolbar .page-table td {
	border-top: 1px solid #aaaaaa
}

.wikiEditor-ui-tabs div a {
	background: none repeat scroll 0 0 #aaaaaa;
	display: inline-block;
	color: #333333
}

.wikiEditor-ui-tabs div.current {
	border-bottom: 1px solid #aaaaaa
}

.wikiEditor-ui-tabs div.current a {
	color: #333333;
	font-weight: bold
}

.wikiEditor-ui-tabs {
	border-left: 1px solid #aaaaaa;
	border-top: 1px solid #aaaaaa
}

.wikiEditor-preview-contents {
	background: rgba(0,0,0,0);
	background-color: rgba(0,0,0,0.1);
	border-color: #aaaaaa;
	border-style: solid;
	border-width: 0 1px 1px;
	color: #333333
}

.wikiEditor-ui-controls {
	background: rgba(0,0,0,0);
	border-bottom: 1px solid #aaaaaa
}

.wikiEditor-preview-contents, .wikiEditor-preview-loading {
	background-color: transparent
}

.editOptions {
	background-color: rgba(0,0,0,0.1);
	border-color: -moz-use-text-color #aaaaaa #aaaaaa;
	border-image: none;
	border-radius: 0 0 5px 5px;
	border-style: none solid solid;
	border-width: medium 1px 1px
}

input#wpSummary {
	margin-bottom: 1em;
	margin-top: 1em;
	width: 80%
}

.pagetab {
	border-style: solid solid none;
	border-width: thin;
	border-color: #808080;
	padding: 0.25ex 1ex 0ex;
	font-size: 95%
}

.ambox {
	background-color: #eeeeee;
	border-bottom-color: #383838;
	border-right-color: #383838;
	border-top-color: #383838;
	border-collapse: collapse;
	font-size: 95%;
	margin: 0 auto 2px auto;
	width: 80%
}

.ambox-gray {
	border-left-color: #383838
}

.ambox.ambox-tiny {
	font-size: 90%;
	margin: 2px 0;
	width: auto
}

.ambox + .ambox {
	margin-top: -2px
}

.ambox-text {
	padding: 0.25em 0.5em
}

.ambox-image {
	padding: 2px 0px 2px 0.5em;
	text-align: center;
	width: 60px
}

.ambox-tiny .ambox-image {
	padding: 2px 0.5em;
	text-align: left;
	width: auto
}

.ambox-blue {
	border-left: 10px solid #1e90ff
}

.ambox-red {
	border-left: 10px solid #b22222
}

.ambox-orange {
	border-left: 10px solid #f28500
}

.ambox-yellow {
	border-left: 10px solid #f4c430
}

.ambox-purple {
	border-left: 10px solid #9932cc
}

.ambox-gray {
	border-left: 10px solid #bba
}

.ambox-green {
	border-left: 10px solid #228b22
}

.amsmalltext {
	font-size: smaller;
	margin-left: 0.8em;
	margin-top: 0.5em
}

.infoboxtable {
	background-color: rgba(0,0,0,0);
	border: 1px solid #fffdfb;
	box-shadow: 6px 6px 18px -10px #676767;
	color: #333333;
	float: right;
	font-size: 89%;
	margin-bottom: 0.5em;
	margin-left: 1em;
	padding: 0.2em;
	width: 300px
}

.infoboxtable td {
	vertical-align: top
}

.infoboxtable td > div {
	background-color: rgba(255,253,251,0.42);
	border: 2px solid inherit;
	font-weight: bold;
	padding: 0.5px 7px;
	text-align: right
}

.infoboxname {
	background-color: rgba(255,253,251,0.42);
	font-size: 110%;
	font-weight: bold;
	padding: 0.5em
}

.infoboxdetails {
	background-color: rgba(255,253,251,0.42);
	padding: 0em
}

.copyright-icon {
	background: url(https://commons.gamepedia.com/media/commons.gamepedia.com/thumb/b/b6/Copyright.png/32px-Copyright.png) transparent center center no-repeat;
	background-size: 100%;
	width: 32px;
	height: 32px
}

.fpmain {
	width: 100%;
	overflow: hidden;
	z-index: 1
}

.fpbanner {
	background: rgba(0,0,0,0.1);
	border: 1px solid rgba(0,0,0,0.1);
	box-shadow: 6px 6px 18px -10px #676767;
	color: #333333;
	margin: 0 5px 5px 5px;
	padding: 5px;
	min-height: 80px
}

.fpbannertable {
	display: table;
	border: none;
	background: transparent;
	width: 100%;
	min-height: 75px;
	margin: 0;
	padding: 5px
}

.fpbannercell {
	display: table-cell;
	text-align: center;
	vertical-align: middle
}

.fpbannerblock {
	border: none;
	color: #ffffff;
	font-weight: bold;
	text-shadow: 0 0 8px rgba(255,255,255,0.75);
	font-size: 132%;
	width: 100%;
	margin: 0 0 10px 0;
	padding: 0 0 5px 0;
	
}

.fpmidsections {
	float: left;
	width: 100%;
	overflow: hidden
}

.fpbox {
	background: #fffdfb;
	border: 1px solid rgba(0,0,0,0.1);
	box-shadow: 1px 1px 5px  rgba(0,0,0,0.3);
	color: #333333;
	margin: 5px;
	margin-bottom: 15px;
	padding: 3px;
	overflow: auto;
	border-radius: 10px;
}

.fpbox .mainheading {
	border: none;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	font-size: 150%;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding: 0 0 5px 0;
	overflow: auto
}

.fpbox .heading {
	border: none;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	text-align: center;
	font-size: 132%;
	margin: 0 0 10px 0;
	padding: 0 0 5px 0;
	overflow: auto
}

.fpmain .columns .leftcol {
	width: 100%;
	margin: 0;
	padding: 0
}

.fpmain .columns .rightcol {
	width: 100%;
	margin: 0;
	padding: 0
}

.fpsection1, .fpsection2, .fpsection3, .fpsection4 {
	float: left;
	clear: both;
	width: 100%
}

div.fp2columnonly, div.fp3columnonly {
	display: block;
	//background: red;
	/* what is it good for? */
}
	

.fpbox.plain {
	background: transparent;
	border: none;
	box-shadow: none
}

.fpimagelist ul {
	list-style-type: none;
	list-style-image: none
}

.fpvideos {
	margin: 0 auto;
	overflow: hidden;
}

.fpvideo {
	display: inline-block;
	margin: 0 5px;
	width: 100% !important;
}

.header {
	background-color: rgba(0,0,0,0.1);
	border: none;
	box-shadow: 0px 1px 5px rgba(0,0,0,0.3);
	color: #444444;
	font-size: 150%;
	margin-bottom: 10px;
	text-align: center;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

table.navbox {
	border: 1px solid #aaaaaa;
	clear: both;
	font-size: 88%;
	margin: auto;
	padding: 1px;
	text-align: center;
	width: 100%
}

table.navbox + table.navbox {
	margin-top: -1px
}

.navbox-title, .navbox-abovebelow, table.navbox th {
	padding-left: 1em;
	padding-right: 1em;
	text-align: center
}

.navbox-group {
	font-weight: bold;
	padding-left: 1em;
	padding-right: 1em;
	white-space: nowrap
}

.navbox, .navbox-subgroup {
	background: rgba(255,255,255,0.2)
}

.navbox-list {
	border-color: rgba(255,255,255,0.2)
}

.navbox-title, table.navbox th {
	background: rgba(255,253,251,0.42);
	color: #444
}

.navbox-abovebelow, .navbox-group, .navbox-subgroup .navbox-title {
	background: rgba(255,253,251,0.42);
	color: #333
}

.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
	background: rgba(0,0,0,0.1);
	color: #333
}

.navbox-even {
	background: rgba(255,255,255,0.1);
	color: #333
}

.navbox-odd {
	background: transparent
}

.collapseButton {
	font-weight: normal;
	width: auto
}

.navbox .collapseButton {
	width: 6em
}

.navbar {
	font-size: 88%;
	font-weight: normal
}

.navbox .navbar {
	font-size: 100%
}

table.collapsed tr.collapsible {
	display: none
}
iframe.twitter-timeline {
	width: 50% !important;
}
div.embedvideowrap {
padding: 3px;
box-shadow: 3px 3px 5px rgba(0,0,0,0.3);
margin-bottom: .5em;
}
.multicolumn li {
	-webkit-column-break-inside: avoid;
	          page-break-inside: avoid;
	               break-inside: avoid;
}
.multicolumn>ul>li {
	list-style: none;
}
div.padding {
	padding: 15px;
	padding-top: 5px;
}
.fpsection1 .header img {
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH";
}

@media (min-width:500px)  {
.multicolumn {
	column-count:2;-moz-column-count:2;-webkit-column-count:2
}
}
@media (min-width:1100px) {
	.fpsection2 {
		clear: none;
		width: calc(100% - 410px);	}
	
	.fpsection3 {
		float: right;
		width: 400px;
		clear: none;
	}
	
}
@media (min-width:1200px) {
	.multicolumn {
		column-count:3;-moz-column-count:3;-webkit-column-count:3
	}
}