/* General */

html {
	height: 100%;
}

body {
	background: url('../images/background-blank.jpg');
	font-family: "Source Sans Pro","lucida grande",tahoma,verdana,arial,sans-serif;
	color: #333;
}

h1 {
	display: none;
}

h2 {
	color: #5a5a5a;
	font-size: 150%;
	margin-bottom: 10px;
}

em {
	font-style: italic;
}

strong {
	font-weight: bold;
}

code {
	font: 0.9em/1.3em Monaco, "Andale Mono", "Courier New", Courier, mono;
	background-color: #eee;
	padding: 5px;
	display: block;
}

/* Scaffolding */

#FrontPage #Container {
	background: url('../images/background.jpg');
	background-repeat: repeat-x;
}

#FrontPage #ContainerInner {
	width: 768px;
	margin: 0 auto;
	padding: 0 0 20px 0;
	position: relative;
}

#ContentPage #Container {
	position: relative;
}

#ContentPage #Menu {
	background: url('../images/menu-background-content.png');
	background-repeat: repeat-x;
	height: 95px;
}

#FrontPage #Menu {
	position: relative;
}

#AboutContainer {
	margin-bottom: 20px;
}

#RenderersContainer {
	float: right;
	margin-left: 20px;
}

/* Menu */

#Logo {
	position: absolute;
	left: 277px;
	top: 29px;
}

#FrontPage #Menu a {
	display: block;
	height: 36px;
	position: absolute;
}

#Menu a {
	font-weight:300;
	color:#b5b5b5;
	text-decoration:none;
}

#Menu a:hover {
	color:#eee;
}

#Menu > a,
#ContentPage #Menu > ul > li > a {
	font-size:150%;
}
#FrontPage #Menu > a {
	width: 100px;
}

#FrontPage #Menu #AboutButton,
#FrontPage #Menu #NewsButton {
	left:163px;
	text-align:right;
}

#FrontPage #Menu #PluginsButton,
#FrontPage #Menu #SupportButton {
	left:505px;
}

#FrontPage #Menu #AboutButton,
#FrontPage #Menu #SupportButton {
	top: 100px;
}

#FrontPage #Menu #NewsButton,
#FrontPage #Menu #PluginsButton {
	top: 137px;
}

#FrontPage #CompareButton {
	display: block;
	height: 117px;
	position: absolute;
	background: url('../images/button-comparison.jpg');
	width: 339px;
	top: 81px;
	left: -172px;
	background-position: 0 0;
}

#FrontPage #CompareButton:hover {
	background-position: 0 -117px;
}

#FrontPage #SupportSubMenu {
	display: none;
	background-position: 0 -131px;
	height: 45px;
	position: absolute;
	left: 604px;
	top: 98px;
	padding-top: 10px;
}

#SupportSubMenu a {
	color: #b5b5b5 !important;
	text-decoration: none !important;
	display: block;
}

#ContentPage ul li ul a {
	margin:0 0 0 12px;
}

#SupportSubMenu a:hover {
	color: #eee !important;
	text-decoration: none !important;
}

#ContentPage #Menu > a {
	display:block;
	background:url('../images/menu-left-content.jpg');
	width:125px;
	height:93px;
}

#ContentPage #Menu a,
#ContentPage #Menu > ul {
	float:left;
}

#ContentPage #Menu > ul {
	margin-left:20px;
}

#ContentPage #Menu ul li {
	display:inline-block;
}

#ContentPage #Menu > ul > li > a {
	margin:30px 0 0 20px;
}

#ContentPage ul li ul {
	display:none;
	position:absolute;
	top:62px;
}

#ContentPage ul li ul li:first-child a {
	margin:0 0 0 20px;
}

/* Social sidebar */

#SocialButtons {
	position: absolute;
	top: 345px;
	left: 0;
	width: 32px;
}

#SocialButtons a {
	display: block;
	width: 32px;
	height: 32px;
	background: url('../images/socialbuttons.png');
	margin-bottom: 4px;
}

#SocialButtons #Facebook {
	background-position: 0 0;
}

#SocialButtons #Twitter {
	background-position: -32px 0;
}

#SocialButtons #GooglePlus {
	background-position: -64px 0;
}

/* Middle */

#BelowMenuRSS {
	display: block;
	width: 87px;
	height: 64px;
	background: url('../images/belowmenu-rss.jpg');
	position: absolute;
	top: 185px;
	left: 527px;
}

#BelowMenuRSS:hover {
	background-position: 0 -64px;
}

#DownloadFor {
	position: absolute;
	top: 275px;
	left: 284px;
}

#FrontPage #ContainerInner > p {
	display: none;
}

/* Downloads */

#Downloads {
	width:728px;
	text-align:center;
	padding-top:309px;
	margin:0 auto;
}

#MainDownloadButtons {
	margin-left:110px;
}

#Downloads img {
	float: left;
}

#Downloads #DownloadOSX,
#Downloads #DownloadWindows,
#Downloads #DownloadLinux,
#Downloads #ShowAdvancedDownloads {
	background:		url('../images/downloadbuttons.jpg');
	height:			176px;
	float:			left;
}

#Downloads #DownloadOSX {
	width:			171px;
	background-position:	0 0;
}

#Downloads #DownloadWindows {
	width:			171px;
	background-position:	-171px 0;
}

#Downloads #DownloadLinux {
	width:			171px;
	background-position:	-337px 0;
}

#Downloads #ShowAdvancedDownloads {
	width:			100px;
	background-position:	-507px 0;
	position:absolute;
	top:309px;
	right:25px;
}

#Downloads #DownloadOSX:hover {
	background-position:	0 -176px;
}

#Downloads #DownloadWindows:hover {
	background-position:	-171px -176px;
}

#Downloads #DownloadLinux:hover {
	background-position:	-337px -176px;
}

#Downloads #ShowAdvancedDownloads:hover {
	background-position:	-507px -176px;
}

#Downloads #ShowAdvancedDownloads.expanded {
	background-position: -609px 0;
}

#Downloads #ShowAdvancedDownloads.expanded:hover {
	background-position: -609px -176px;
}

#AdvancedDownloads {
	display: none;
	padding: 0 0 10px;
	border-bottom: 1px #eee solid;
	box-shadow: 1px 0px 20px #ccc;
	background: -webkit-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.3)); /*Safari 5.1-6*/
	background: -o-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.3)); /*Opera 11.1-12*/
	background: -moz-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.3)); /*Fx 3.6-15*/
	background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0.3)); /*Standard*/
	width:513px;
	margin:0 auto 20px auto;
}

#AdvancedDownloads div {
	width: 169px;
	float: left;
}

#AdvancedDownloads div:first-child {
	width: 173px;
}

#AdvancedDownloads div:last-child {
	width: 171px;
}

#AdvancedDownloads a {
	font-size: 14px;
	color: #444;
	text-decoration: none;
}

#AdvancedDownloads a:hover {
	text-decoration: underline;
}

/* Ad */

#Advertisement,
#AdvertisementTaller {
	line-height:0.5;
}

#Advertisement {
	margin:20px 0;
	width:728px;
}

#FrontPage #Advertisement {
	margin:20px auto;
}

#AdvertisementTaller {
	margin: 0 auto;
	text-align: center;
	display: inline-block;
}

/* Front page content divs */

#FrontPage .textContainer {
	text-align: left;
	margin: 20px auto;
	background-color:rgba(255, 255, 255, 0.3);
	box-shadow: 1px 0px 20px #ccc;
	padding:20px;
	border:#eee 1px solid;
}

#FrontPage .textContainer td {
	font-size:		18px;
	color:			#333;
}

#FrontPage .textContainer td a {
	color:			#333;
	text-decoration:	none;
}

#FrontPage .textContainer td a:hover {
	color:			#000;
	text-decoration:	underline;
}

#FrontPage .textContainer tr > td:first-child {
	color:			#999;
	padding-right:		20px;
}

#FrontPage .textContainer p {
	margin-bottom:8px;
}

#FrontPage .textContainer img {
	float:none;
}

#DonationsLink {
	float:right;
}

#DonationsLink a,
#FrontPage .textContainer p a {
	color: #276c93;
	text-decoration: none;
}

#DonationsLink a:hover,
#FrontPage .textContainer p a:hover {
	text-decoration: underline;
}

/* Content Area */

#ContentArea {
	position:		relative;
	padding:		20px 50px 0 40px;
	font-size:		14px;
}

#ContentArea p {
	margin-bottom:		5px;
}

#RenderersContainer ul {
	margin:			0 0 0 5px;
	padding-left:		10px;
	float:			left;
	list-style-type:	disc;
}

#RenderersContainer ul.left {
	margin:			0 20px 0 5px;
}

#RenderersContainer ul li {
	font-size:		13px;
}

/* General content pages */

#ContentPage #ContentArea a {
	color: #c33;
	text-decoration: none;
}

#ContentPage #ContentArea a:hover {
	color: #c00;
	text-decoration: underline;
}

#ContentPage h3 {
	font-size: 18px;
	margin: 20px 0 10px 0;
}

#ContentPage h4 {
	font-size: 14px;
	font-weight: bold;
	margin-top: 20px;
}

/* About page */

#RendererImages {
	background:		url('../images/about-renderers.jpg');
	background-repeat:	repeat-x;
	height:			82px;
	position:		absolute;
	top:			427px;
	left:			0;
	width:			100%;
}

#ThirdPartyImages {
	margin-top: 20px;
}

#ThirdPartyImages h2 {
	margin-bottom: 15px;
}

#ThirdPartyImages a {
	margin-right: 20px;
}

#ThirdPartyImages a:hover {
	text-decoration: none !important;
}

#ThirdPartyImages img {
	vertical-align: top;
}

/* News page */

.newsPage td {
	font-size:		16px;
	color:			#333;
}

.newsPage td a {
	color:			#333 !important;
	text-decoration:	none;
}

.newsPage td a:hover {
	color:			#000 !important;
	text-decoration:	underline;
}

.newsPage tr > td:first-child {
	color:			#999;
	padding-right:		20px;
}

/* FAQ page */

.fAQPage #ContentArea ul {
	list-style-type: disc;
}

.fAQPage #ContentArea ol {
	list-style-type: decimal;
}

.fAQPage #ContentArea ul li,
.fAQPage #ContentArea ol li {
	margin: 20px 0 0 20px;
}

.fAQPage #ContentArea a {
	color: #333 !important;
}

.fAQPage h4 {
	margin-bottom: 5px;
}

.fAQPage h4 a {
	font-size: 16px;
}

#FAQMenu h4 {
	font-size: 16px;
}

.fAQSection {
	margin-top: 100px;
}

.fAQSection h3 {
	font-size: 22px !important;
}

.fAQSection thead {
	font-weight:bold;
}

.fAQSection td {
	padding:3px;
}

/* Plugins page */

#PluginList {
	margin: 20px 0 40px 0;
}

#PluginList td {
	padding: 5px 20px 5px 0;
}

#PluginList thead td {
	font-weight: bold;
}

#PluginLoginForm {
	padding: 10px 0;
}

.formRow {
	padding: 10px 0 0 0;
	clear: left;
}

#PluginLoginForm .formRow {
	padding-right: 0 !important;
	clear: right;
}

.pluginsPage label,
.pluginsPage input {
	float: left;
	display: block;
}

.pluginsPage #PluginEditForm label,
.pluginsPage #PluginAddForm label{
	width: 150px;
	padding-top: 3px;
}

.pluginsPage #PluginEditForm input,
.pluginsPage #PluginAddForm input,
.pluginsPage #PluginEditForm textarea,
.pluginsPage #PluginAddForm textarea {
	padding: 5px;
	width: 450px;
}

.extraFileOptions,
#ExtraFiles {
	display: none;
}

.extraFileOptions {
	margin-left: 30px;
}

/* Comparison page */

#ServerList {
	margin: 20px 0 40px 0;
}

#ServerList td {
	padding: 5px 10px;
	background-color: #ddd;
	border: 1px #ccc solid;
}

#ServerList thead td {
	font-weight: bold;
}

#ServerList sup {
	cursor: pointer;
	font-weight: bold;
	color: #c33;
}

#ServerList .yes {
	background-color: #90ff90;
}

#ServerList .no {
	background-color: #ff9090;
}

#ServerList .partial {
	background-color: #ffb;
}

/* Exceptions for low resolutions */

@media (max-width: 1125px) {
	#CompareButton {
		display: none !important;
	}
}

@media (max-width: 808px) {
	#FrontPage #ContainerInner {
		width:600px;
	}
	#Logo {
		left: 193px;
	}
	#FrontPage #Menu #AboutButton,
	#FrontPage #Menu #NewsButton {
		left:90px;
	}

	#FrontPage #Menu #PluginsButton,
	#FrontPage #Menu #SupportButton {
		left:410px;
	}

	#FrontPage #SupportSubMenu {
		left: 505px;
	}

	#Downloads {
		width:auto;
	}

	#MainDownloadButtons {
		margin-left:46px;
	}

	#BelowMenuRSS {
		left: 443px;
	}

	#DownloadFor {
		left: 200px;
	}

	#Advertisement {
		display:none;
	}

	#Downloads #ShowAdvancedDownloads {
		right:-59px;
	}
}