@charset "utf-8";
/* CSS Doument by Scotty Sengphaathit */
/* Background pattern from subtlepatterns.com */

/* Font */
@font-face {
	font-family: 'prosto-bold';
	src: url('../font/prosto_bold/tt-prosto-bold-webfont.woff');
	font-style: normal;
	font-weight: bold;
}

@font-face {
	font-family: 'andes';
	src: url('../font/andes/Andes-Regular-webfont.woff');
	font-style: normal;
	font-weight: normal;
}

/* Site Design */
a {
	transition: all .3s ease;
}
div.clearfix {
	clear: both;
}
html {
	background-attachment: fixed;
}
body {
	background: #0c1530;
	background-image: -moz-linear-gradient(50% 0% 0deg,rgb(12,21,48) 0%,rgb(1,9,31) 100%); 
	background-image: -webkit-gradient(linear,50% 0%,-47% 0%,color-stop(0, rgb(12,21,48)),color-stop(1, rgb(1,9,31)));
	background-image: -webkit-linear-gradient(0deg,rgb(12,21,48) 0%,rgb(1,9,31) 100%);
	background-image: -webkit-linear-gradient(top, rgb(12,21,48) 0%,rgb(1,9,31) 100%); /*Legacy code*/
	background-image: -o-linear-gradient(0deg,rgb(12,21,48) 0%,rgb(1,9,31) 100%);
	background-image: -ms-linear-gradient(0deg,rgba(12,21,48,.5) 0%,rgba(1,9,31,.5) 100%);
	background: linear-gradient(0deg,rgba(33,44,66,1) 0%,rgba(34,44,68,.7) 100%), url(../../images/site/bg/swirl_pattern.png); 
	color: #0f0e0a;
	font-family: andes;
	font-size: 100%;
	font-weight: normal;
}
div#header {
	color: rgb(231, 236, 240);
	font-family: prosto-bold;
	margin-top: 2.5%;
	text-align: center;
}
div#header h1 {
	font-size: 330%;
	margin-bottom: 0.5%;
}
div#header p {
	font-size: 100%;
	margin-bottom: 3%;
}
div#main {
	margin-left: auto;
	margin-right: auto;	
	width: 60%;
}
div.content_container, div#nav, div#sub_nav, div#banner_container, div#footer {
	background: rgba(27, 34, 50, .5);
	border-radius: 3px;
	margin-bottom: 1%;
	padding: 1% .5%;
}
div.content_container {
	padding-bottom: 0%;
}
div#nav, div#sub_nav {
	padding: 1% 1%;
}
div#sub_nav {
	margin-left: 1.5%;
	width: 94%;
}
div#nav li, div#sub_nav li, div#footer li {
	display: inline;
}
div#nav li a, div#sub_nav li a, div#footer li a {
	border-radius: 3px;
	font-size: 110%;
	margin-right: 1%;
	padding: .5% 2%;
	text-decoration: none;
}
div#sub_nav li a {
	font-size: 90%;
}
div#footer li a {
	font-size: 90%;
}
div#nav li a:link, div#nav li a:visited, div#sub_nav li a:link, div#sub_nav li a:visited, div#footer li a:link, div#footer li a:visited {
	background: rgb(228, 228, 228);
	color: #0f0e0a;
}
div#nav li a:hover, div#nav li a:active, div#sub_nav li a:hover, div#sub_nav li a:active, div#footer li a:hover, div#footer li a:active {
	background: rgb(205, 205, 205);
	color: #000;
}
div#nav li a.active:link, div#nav li a.active:visited, div#nav li a.active:hover, div#nav li a.active:active, div#sub_nav li a.active:link, div#sub_nav li a.active:visited, div#sub_nav li a.active:hover, div#sub_nav li a.active:active {
	background: rgb(169, 169, 169);
	color: #0f0e0a;
}
div.content_50_50_column_container, div.content_100_column_container, div.content_65_column_container, div.content_35_column_container {
	float: left;
	width: 49%;
	margin: 0% .5%;
}
div.content_50_50_column_container, div.content_100_column_container, div.content_32_column_container {
	float: left;
	width: 49%;
	margin: 0% .5%;
}
div.content_32_column_container {
	width: 32.33%;
}
div#footer_60_column_container {
	background: #F00;
	float: left;
	width: 59%;
	padding: 0% .5% 0% .5%
}
div#footer_40_column_container {
	background: #0F0;
	float: left;
	width: 39%;
	padding: 0% .5% 0% .5%
}
div.content_100_column_container {
	width: 99%;
}
div.content {
	background: rgb(228, 228, 228);
	border-radius: 3px;
	min-height: 300px;
	padding: 2%;
	margin-bottom: 2%;
}
div.content h1 {
	color: #293144;
	font-size: 150%;
	font-weight: normal;
	margin-bottom: .5%;
	text-align: center;
}
div.content h2 {
	font-size: 120%;
	font-weight: normal;
	margin-bottom: .4%;
}
div.content h3 {
	font-size: 110%;
	margin-bottom: .3%;
}
div.content p {
	font-size: 100%;
	margin-bottom: .3%;
}
div.content ul {
	padding-left: 4%;
	list-style-type: disc;
}
div#footer {
	color: #d4d4d4;
	font-size: 90%;
}
div#footer ul {
	margin-bottom: 2%;
}
div#footer p {
	margin-top: 1%;
}
@media only screen and (min-width: 1900px) {
	div#main {
		width: 50%;
	}
}