Foreground.css: Difference between revisions

Revision as of 02:12, 13 August 2016

html, body {
	height: 100% !important;
	background: url('http://www.therockmanexezone.com/assets/bg_TilesGrain.png') !important;
	background-repeat: repeat !important;
	background-position: top center !important;
	min-width: 490px;
}

#page-content {
	margin: 30px 1% 0 1% !important;
}

#navwrapper {
	background: url('http://www.therockmanexezone.com/assets/bg_header.png') !important;
	box-shadow: 0 4px 0 rgba(0,0,0,0.25) !important;
}

.top-bar {
	margin: 0 auto !important;
	max-width: 1360px !important;
	min-height: 88px !important;
	background: none !important;
}

.top-bar .title-area {
	height: 100% !important;
	z-index: 9999 !important;
}

.top-bar .name {
	height: 88px !important;
}

.top-bar .name h1 {
	height: 100% !important;
}

.top-bar .name h1 a {
	height: 100% !important;
}

.top-bar .name h1 a img {
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
}

.top-bar .name h1 a div.title-name {
	display: none !important;
}

.top-bar-section {
	height: 100% !important;
}

.top-bar-section>ul>.divider {
	display: none !important;
}

.top-bar-section>ul {
	background: none !important;
	height: 100% !important;
}

.top-bar-section>ul>li {
	height: 100% !important;
}

.top-bar-section>ul>li>a {
	background: none !important;
	height: 100% !important;
}

.top-bar-section .has-form {
	background: none !important;
}

.top-bar-section .dropdown {
	background: transparent !important;
}

.top-bar-section .dropdown li > a {
	background: transparent !important;
}

#top-bar-right > li > a > i.fa-cogs::after {
    content: " Tools";
    font-family: sans-serif
}

#personal-tools-dropdown > a > i::after {
    content: " User";
    font-family: sans-serif;
}

#page-content>div.row {
	max-width: 1360px !important;
	background-color: #FFF !important;
	padding: 25px 0 !important;
	margin-bottom: 30px !important;
	background-image: url('http://www.therockmanexezone.com/assets/bg_content_header_corner.png') !important;
	background-position: left top !important;
	background-repeat: no-repeat !important;
	border: 1px solid #CCCCCC !important;
	border-top: 12px solid #E0E0E0 !important;
	border-bottom: 4px solid #E0E0E0 !important;
	border-radius: 4px !important;
}

#page-content>div.row:first-child {
	display: none !important;
}

#p-cactions #drop1 {
	right: 15px !important;
	left: initial !important;
}

#wpTextbox1 {
	width: 100% !important;
}

.toctext span sup {
	top: initial !important;
	font-size: 60% !important;
	padding-top: 0.75em !important;
}

.toctext span sub {
	bottom: initial !important;
	font-size: 60% !important;
}

table.wikitable {
	width: auto;
	max-width: 100%;
}
table.wikitable > * > tr > td {
	padding: 0.25em 0.75em;
}

#p-Games {
	/* display: none; */
}

@media only screen and (min-width: 58.75em) {
	#p-Games {
		display: list-item;
	}

	table.wikitable {
		min-width: 500px;
	}

	.top-bar-section .dropdown {
		top: 75% !important;
		background: #222222 !important;
	}

	.top-bar-section .dropdown li > a {
		background: #222222 !important;
	}

	.top-bar-section>ul>li>a {
		line-height: 88px !important;
	}

	.top-bar-section > li {
		line-height: 88px !important;
	}

	.top-bar-section > li > a {
		display: inline-block !important;
	}

	.top-bar-section>ul>li>a::after {
		top: 44px !important;
	}

	#searchform>div.row>div.columns {
		line-height: 88px !important;
	}
}

@media only screen and (max-width: 58.75em) {
	.top-bar-section {
		left: 0 !important;
	}

	.top-bar a {
		font-size: 13pt !important;
	}

	.top-bar-section .dropdown {
		position: static;
		left: 0;
		height: 0;
		overflow: hidden;
		-webkit-transition: all 300ms ease-out;
		-moz-transition: all 300ms ease-out;
		transition: all 300ms ease-out;
	}

	.top-bar-section .dropdown .back h5 a {
		display: none !important;
	}

	.top-bar-section .dropdown .back h5::before {
		content: 'Close';
		color: white;
		padding: 8px 15px;
		line-height: 22.5px;
		display:block;
		cursor: pointer;
	}

	.top-bar-section .has-dropdown.moved > .dropdown {
		height: auto;
		background: rgba(255, 255, 255, 0.15) !important;
	}

	.top-bar-section .has-dropdown a {
		position: relative;
	}

	#page-content {
		margin-top: 10px !important;
	}
}

/* @media only screen and (min-width: 58.75em) {
	#toc {
		position: fixed !important;
		bottom: 0 !important;
		right: 1% !important;
		max-height: 100% !important;
		background: #DDD !important;
		color: #333 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		border-top-left-radius: 1em !important;
		border-top-right-radius: 1em !important;
	}
	#toc ul {
		margin: 5pt 1em 1em 1em !important;
		overflow: hidden !important;
	}
	#toctitle {
		position: relative !important;
		padding: 1em 1em 0 1em !important;
	}
	#toctitle h2 {
		margin: 0 !important;
		overflow: hidden !important;
		padding-bottom: 5pt !important;
		border-bottom: 1px solid black !important;
		min-width: 6em !important;
	}
	#toctitle h2::after {
		content: '×' !important;
		font-size: 100% !important;
		float: right !important;
	}
	#toctitle .toctoggle {
		color: transparent !important;
		float: left !important;
		height: 0 !important;
		overflow: hidden !important;
	}
	#togglelink {
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		color: transparent !important;
	}
	.tochidden {
		padding: 0 !important;
		width: 5em !important;
		height: 5em !important;
		overflow: hidden !important;
	}
	.tochidden #toctitle {
		height: 100% !important;
		width: 100% !important;
		padding: 0 !important;
	}
	.tochidden #toctitle::before {
		content: '📑' !important;
		font-size: 3em !important;
		float: right !important;
		overflow: hidden !important;
		height: 100% !important;
		width: 100% !important;
		line-height: 170% !important;
		text-align: center !important;
		vertical-align:middle !important;
	}
	.tochidden #toctitle h2::after {
		display: none !important;
	}
} */