@charset "utf-8";
/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700,600);

html, body { min-width: 280px; }

body { 
	padding: 0px; margin: 0px; 
	background: #cecece;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px; line-height: 26px; letter-spacing: 0.5px;
	color: #787878;
}

a:link { color: #a0c4ff; text-decoration: none; }
a:visited { color: #a0c4ff; text-decoration: none; }
a:hover { color: #84aff5; text-decoration: underline; }
a:active { color: #84aff5; text-decoration: none; }

h1 { font-size: 40px; color: #3e3e3e; line-height: 50px; }
h2 { font-size: 26px; color: #5e5e5e; line-height: 34px; }
h3 { font-size: 22px; color: #7e7e7e; }

/* Floats */
.left { float:left; }
.right { float:right; }
.center { margin-left: auto; margin-right: auto; }
.clear { clear:both; }

/* Text Positioning */
.tcenter { text-align:center; }
.tleft { text-align: left; }
.tright { text-align: right; }

/* Fixed */
.fixed { max-width: 1150px; } 

/* Collumns */
.col3 { width: 33.3333%; }
.col2-3 { width: 66.6666%; }
.col2 { width: 49.9999%; }
.col4 { width: 24.9999%; }


/* Header Setup */
header { background: #FFF; border-bottom: 5px solid #a9a9a9; padding: 10px; }
	header .logo { display:block; height: 84px; width: 200px; }
		header .logo img { height: 100%; }
	
	header nav { position: relative; }
		header nav > a { display: none; }
		header nav ul { padding: 0px; margin: 14px 0px; list-style: none; position:relative; z-index: 999999999; }
			header nav ul li { float:left; display: block; padding:0px; margin: 0px; position: relative; font-weight: 600; font-size: 16px; border-left: 1px solid #efefef; border-right: 1px solid #f0f0f0;}
			header nav ul li:first-child { border-left: none; }
			header nav ul li:last-child { border-right: none; }
				/* Sub Navigation */
				header nav ul li ul { position:absolute; display:none; margin-top:0px; background: #FFF; border-top: 2px solid #cfcfcf; right:0px; transition: ease-in-out all 0.35s; -webkit-transition: ease-in-out all 0.35s; z-index: +10; }
				header nav ul li:hover ul { display:block; }
				header nav ul li ul:hover { border-top-color: #909090; }
					header nav ul li ul li { float:none; border: none; border-top: 1px solid #efefef; border-bottom: 1px solid #f0f0f0; }
					header nav ul li ul li:first-child { border-top: none; }
					header nav ul li ul li:last-child { border-bottom: none; }
			
				/* Links */
				header nav ul li a:link, header nav ul li a:visited { color: #a0a0a0; display: block; padding: 15px 30px; transition: ease-in-out all 0.35s; -webkit-transition: ease-in-out all 0.35s; }
				header nav ul li a:hover, header nav ul li a:active { color: #707070; text-decoration: none; }

/* SubNavigation */
.subnav { background: #a9a9a9; padding: 0px 10px 5px 10px; border-bottom: 2px solid #6a6a6a; }
	.subnav nav { position:relative; }
		.subnav nav > a { display:none; }
		.subnav nav ul { padding: 3px 0px; margin: 0px; list-style:none; overflow:hidden; }
			.subnav nav ul li { float:left; display:block; border-left: 1px solid #6a6a6a; border-right: 1px solid #8a8a8a; overflow:hidden;}
			
			.subnav nav ul li:first-child { border-left: none; }
			.subnav nav ul li:last-child { border-right: none; }
		
			.subnav nav ul a:link, .subnav nav ul a:visited { display:block; padding: 0px 10px 0px 10px; color: #FFF; }
			.subnav nav ul a:hover, .subnav nav ul a:active { display:block; padding: 0px 10px 0px 10px; color: #39F; text-decoration: none; }


/* Icon's */
.icon { text-indent: -99999999px; display:block; }
	.icon_account { background: url(../images/icon_account.png) center 19px no-repeat; width:14px; height: 16px; opacity: 0.35; -webkit-opacity: 0.35; }
		.icon_account:hover { opacity: 1.0; -webkit-opacity: 1.0; }
	.icon_add { background: #1e1e1e; width: 15px; height: 15px; float:left; padding: 0px !important; margin: 5px 5px; }
		.icon_add:hover { background: #39F; }

/* Sections */
.section { position:relative; }
	.section > div { height:100%; position:relative; }

/* Windows */
.window { background: #FFF; margin: 5px 5px; }
	.window h1, .window h2, .window h3 { padding: 10px; margin:0px; }
	.window p { padding: 10px; margin: 0px; }	
	
	/* Form Setup */
	.window.fields { } /* Placeholder */
		.window.fields img.thumb { width: 80px; height: 80px; border: 1px solid #cecece; margin: -40px 10px 0px 0px; }
		.window.fields label { display:inline-block; width: 35%; padding: 10px;}
			.window.fields label span, span.fields { display:inline-block !important; padding: 0px 2px 0px 2px !important; color: #C30; font-size: 16px; font-weight:bold; }
		.window.fields label+input[type=text], .window.fields label+input[type=password], .window.fields label+input[type=file], .window.fields label+select { width: 49%; display:inline-block; padding: 5px; margin: 5px; }
		.window.fields label+textarea { width: 96%; height: 125px; padding: 5px; margin: 5px 10px; }
		.window.fields .clear.border { border-bottom: 1px solid #e0e0e0; padding-top: 5px; margin: 0px 10px 5px 10px; }
		.window.fields input[type=submit] { padding: 10px; margin: 10px; font-weight:bold; border: 1px solid #c0c0c0; background: #efefef; cursor:pointer; }
			.window.fields input[type=submit]:hover { background: #e0e0e0; }

/* Table / Table List */
table.tbl { padding: 0px; margin: 0px 0px 10px 0px; width: 100%; }
	table.tbl tr { padding: 5px; background: #E0E0E0; }
	table.tbl tr:nth-child(odd) { background: #FFF; }
		table.tbl tr td { padding: 5px; border-right: 1px solid #C0C0C0; color: #1e1e1e; }
		table.tbl tr:nth-child(odd) td { border-right: 1px solid #E0E0E0; }
	table.tbl tr:hover { background: #C0C0C0; }
		table.tbl tr:hover td { border-color: #A0A0A0; }

/* Stream Notification */
.stream_notification { position: absolute; padding: 0px; background: #59abc3; width: 100%; text-align: center; color: #FFF; font-size: 16px; text-shadow: none; font-weight: bold; box-shadow: #000 0px 0px 25px 0px; border-bottom: 2px solid #326d7e;	}
	.stream_notification p { margin: 5px; padding: 0px; }

/* Title */
.window.title { min-width: 200px; width:50%; margin-bottom: 0px; }
	.window.title h1, .window.title h2, .window.title h3 { padding: 10px 10px 0px 10px; }
	.window.title span { display:block; padding: 5px 10px 10px; margin: 0px; font-size: 18px; }
	
.splitter { height: 1px; border-top: 1px solid #13141b; border-bottom: 1px solid #1e2029; margin: 20px 0px 20px 0px; }

/* News */
.news { overflow:hidden; }

/* Timeline */
.timeline { }
	.timeline .item { position:relative; padding: 10px; opacity: 0.65; -webkit-opacity: 0.65; transition: ease-in-out all 0.35s; -webkit-transition: ease-in-out all 0.35s; overflow:hidden; }
	.timeline .item:hover { opacity: 1.0; -webkit-opacity:1.0; }
		.timeline .item .date { position: absolute; right: 0px; top: 10px; bottom: 10px; font-size: 55px; opacity: 0.25; padding: 10px;  }
			.timeline .item .date span { font-weight:bold; text-transform:uppercase; }
		.timeline .item h1, .timeline .item h2, .timeline .item h3 { padding: 0px; margin: 0px; }
		.timeline .item p { padding: 0px; margin: 0px; }


/* No Results */
.noresults { opacity: 0.35; -webkit-opacity: 0.35; transition: ease-in-out all 0.35s; -webkit-transition: ease-in-out all 0.35s; padding: 10px; }
.noresults:hover { opacity: 0.50; -webkit-opacity: 0.50; }
	.noresults h2 { padding: 0px; margin: 0px; }
	.noresults p { padding: 0px; margin: 0px; color: 3e3e3e; }

/* About */
.about { overflow:hidden; }
	.about .me { }
		.about .me img { padding: 8px; background: #131313; border-radius: 5px; margin: 0px 10px 10px 10px; border: 1px solid #000; }
		.about .me p { padding-right: 30px; }
	
	.about ul.social { list-style: none; margin: 5px 10px; padding: 0px; }
		.about ul.social li { padding: 10px 0px 10px 45px; font-size: 16px; }
			.about ul.social li span { text-indent: -99999px; width: 34px; height: 35px; display: block; margin: -5px 0px 0px -45px; position:absolute; }
			.about ul.social .facebook span { background: url(../images/icon_facebook.png) center center no-repeat;  }


			.about ul.social .twitter span { background: url(../images/icon_twitter.png) center center no-repeat; }
			.about ul.social .linkedin span { background: url(../images/icon_linkedin.png) center center no-repeat; }
			.about ul.social .googleplus span { background: url(../images/icon_googleplus.png) center center no-repeat; }
		/* Links */
		.about ul.social a:link, .about ul.social a:visited { color: #c0c0c0; }
		.about ul.social a:hover, .about ul.social a:active { color: #909090; text-decoration: none; }

/* Contact Form */
.contact { }
	.contact form { margin: 0px; padding: 0px 20px 0px 0px; }
		.contact form p { padding: 10px; display:block; margin: 0px; }
		.contact form p:nth-child(even) { background: #262733; }
			.contact form p label { display:inline-block; min-width: 100px; }
				.contact form p label span { color: #C33; }
			.contact form p input[type=email], .contact form p input[type=text] { background:#131313; color: #e2e1e1; padding: 10px; border-radius: 5px; border: none; min-width: 200px; width: 49.99999%; display:inline-block; }
			.contact form p input[type=submit] { padding: 10px; border-radius: 5px; cursor:pointer; border: none; background: #84aff5; color: #FFF; font-size: 16px;  font-weight: bold; min-width: 100px;}
				.contact form p input[type=submit]:hover { background: #131313; color: #84aff5; }
		.contact form textarea {display:block; background:#131313; color: #e2e1e1; padding: 10px; border-radius: 5px; border: none; min-width: 200px; width: 95%; min-height: 250px; }
		
			
/* Projects */
.projects { }
	.projects img { padding: 8px; background: #131313; border-radius: 5px; margin: 10px 10px 10px 0px; border: 1px solid #000; max-width: 350px; width: 95%; }
	.projects a { display:block; margin-bottom: 0px; }
		.projects a h2 { margin: 0px 0px 24px 0px; padding: 0px; }



/* Footer */
footer { text-align:left; padding: 10px 0px; font-size: 16px; overflow:hidden; text-align:center; }
	footer a:link, footer a:visited { color: #c0c0c0; }
	footer a:hover, footer a:active { color: #909090; }
	footer p { padding: 0px; margin: 0px; font-size: 12px; }


/* Mobile Responsive */
@media all and (max-width: 1000px) {
	/* Logo Adjust */
	header { padding: 10px 5px 5px 5px; }
		header .logo { display:block; height: auto; max-width: 250px; width:auto; }
			header .logo img { height: auto; width:100%; }
			
		header nav { }
			header nav ul { padding: 0px; margin: 0px; list-style: none; position:relative; }	
	
	
}

@media all and (max-width: 900px) {
	
}

@media all and (max-width: 799px) {
	

}


@media all and (max-width: 900px) {
	header { }
		header nav { display:block; float:right; padding: 10px 0px 10px 30px; }
			header nav > a { display:block; width: 50px; height: 35px; background: url(../images/nav_icon.png) center center no-repeat #a0a0a0; text-indent: -999999px; }
			header nav:hover > a { background-color: #39F; }
			header nav > ul { display: none; position:absolute; background: #3e3e3e; overflow: hidden; right: 0px; border-top: 2px solid #39F }
				header nav > ul li { margin: 0px; padding: 0px; float: none; border: none; width: 200px; text-align:center; }
				header nav > ul li:hover { background: #2e2e2e; }
				/* Remove Icon */
				header nav > ul li a.icon { text-indent: 0px; background: none; display:block; height: auto; width: auto; border-top: 2px solid #4e4e4e; }
				/* Sub Nav */
				header nav > ul li ul { display:block; position:relative; padding: 0px; margin: 0px; background: none; border: none; }
					header nav > ul li ul li { border: none; }
						header nav > ul li ul li:hover { background: #3e3e3e; }
		header nav:hover > ul { display: block; }
			/* Links */
			header nav ul li a:link, header nav ul li a:visited { color: #FFF; display: block; padding: 15px 0px; }
			header nav ul li a:hover, header nav ul li a:active { background: none; text-decoration: none; }

	.window.title { width: auto; min-width: 0px;	 }
}

@media all and (max-width: 765px) {
	.about { }
		.about .col2-3, .col3 { width: 100%; float:none; overflow:hidden; }
	.window.fields .col2.left { width: auto; float: none; }
}


@media all and (max-width: 450px) {	
	/* Window */
	.window { }
		.window.fields label { display:block; width: auto; }
		.window.fields label+input[type=text], .window.fields label+input[type=password] { margin: 5px 10px; display:block; width:85%; }
		.window.fields input[type=checkbox] { margin: 5px 10px; }
	
}

@media all and (max-width: 375px) {
	
	header { min-width:300px; padding: 10px 5px 5px 5px; }
		header .logo { display:block; height: auto; max-width: 215px; width:auto; }
			header .logo img { height: auto; width:100%; padding-top: 3px; }
}