/*
Theme Name: Ocean
Theme URI: http://thinktankdesign.ca/
Description: The fith verson of the Ocean theme for ThinkTank Design.
Version: 5.0
Author: Robert Hurst
Tags: blue, fixed width, one column, custom pages
*/

/* CLEARFIX */
.clearfix:after{content:" ";display:block;clear:both;visibility:hidden;line-height:0;height:0; }.clearfix{display:inline-block;}html[xmlns] .clearfix{display:block;}* html .clearfix{height:1%;}
/* RESET */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,canvas,details,figcaption,figure,;footer,header,hgroup,menu,nav,section,summary{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,;q:before,q:after{content:'';content:none}a{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

html{
	background: #00658c url('images/html.background.jpg') no-repeat top center fixed;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 62.5%;
}
h1{
	font-size: 3.6em;
	line-height: 1.8em;
	text-shadow: 0px 0px 4px #000;
	color: #eee;
}
h1.page_title{
	margin-bottom: 50px;
}
h2{
	font-size: 2.4em;
	line-height: 1.6em;
	color: #eee;
}
h3{
	font-size: 1.8em;
	line-height: 1.4em;
	color: #eee;
}

a{
	border: none;
	outline: none;
	text-decoration: none;
	font-weight: normal;
	color: #ceff8c;
}
a img{
	border: none;
	outline: none;
	text-decoration: none;
	font-weight: normal;
}
a:hover{
	color: #93ff00;
}

ul{
	font-size: 1.8em;
	line-height: 1.6em;
	margin: 1.6em;
	font-weight: bold;
	color: #eee;
	text-shadow: 0px 0px 2px #000;
}

p{	
	font-size: 1.6em;
	line-height: 1.6em;
}

textarea{	
	font-family: Helvetica, Arial, sans-serif;
}

#wrapper,
#footer{
	position: relative;
	display: block;
	width: 980px;
	margin: 0 auto;
	z-index: 1;
}

#header{
	padding:50px;
	height: 79px;
}
#header div.logo{
	float: left;
}
#header div.logo a:hover{
	background: #000;
}
#header div.logo a,
#header div.logo a.js:hover/* .js:hover allows javascript to override the css hover state */ {
	display: block;
	padding: 6px 10px;
	
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	
	background: transparent;
}
#header div.navigation{
	float: right;
}
#header div.navigation div.button{
	float: left;
	margin-left: 50px;
	height: 79px;
}
#header div.navigation div.button a:hover{
	background: #000;
}
#header div.navigation div.button a,
#header div.navigation div.button a.js:hover /* .hover:hover allows javascript to override the css hover state */ {
	line-height: 25px;
	font-weight: bold;
	font-size: 1.6em;
	display: block;
	padding: 6px 10px;
	margin: 15px 0;
	background: transparent;
	
	color: #fff;
	
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
#header div.navigation div.button.current a{
	border: 1px solid #fff;
}

#project-previews{
	height: 260px;
	overflow: hidden;
}
#project-previews div.project-preview{
	float: left;
	margin-right:37px;
}
#project-previews div.project-preview.last{
	margin-right:0;
}
#project-previews div.project-preview div.thumb{
	width: 195px;
	padding: 10px;
	
	border: 1px solid #fff;
	background: #fff url('images/projectpreview.background.jpg') repeat-x;
	
    -moz-box-shadow: 0px 0px 4px #000; /* FF3.5+ */
    -webkit-box-shadow: 0px 0px 4px #000; /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 4px #000; /* Opera 10.5, IE 9.0 */  
}
#project-previews div.project-preview div.title{
	width: 175px;
	margin: 0 10px 10px 10px;
	padding: 10px;
	
	border: 1px solid #000;
	background: #000;
	
	color: #fff;
	font-size: 1.1em;
	font-weight: bold;
	text-align: center;
}
#project-previews div.project-preview:hover div.title{
	background: #ceff8c;
	
	color: #000;
}
#content{
	margin-bottom: 50px;
}
#content p{
	margin: 25px 0;
}
#content.home{
	width: 420px;
	float: left;
	margin-left: 50px;
	
	line-height: 1.4em;
	color: #fff;
}

#posts{
	margin: 0 100px;
}
#posts p{
	color: #fff;
}
#posts a{
	text-decoration: underline;
}
#posts .alignleft{
	float: left;
}
#posts .alignright{
	float: right;
}
#posts div.wp-caption{
	padding-top: 5px;
	border: 1px solid #fff;
	margin: 25px 0;
	
	background: #fff;
	
    -moz-box-shadow: 0px 0px 4px #000; /* FF3.5+ */
    -webkit-box-shadow: 0px 0px 4px #000; /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 4px #000; /* Opera 10.5, IE 9.0 */  	
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
#posts div.wp-caption a{
	display: block;
	text-align: center;
}
#posts div.wp-caption img{
	margin: auto;
}
#posts div.wp-caption.alignleft{
	margin-right: 25px; 
}
#posts div.wp-caption.alignright{
	margin-left: 25px; 
}
#posts p.wp-caption-text{
	padding: 0;
	margin: 6px 0;
	text-align: center;
	color:#000;
}
#posts div.project div.thumb{
	float: right;
	width: 250px;
	overflow: hidden;
	margin-left: 25px;
	margin-bottom: 25px;
	
	background: #fff;
	border: 1px solid #fff;
	
    -moz-box-shadow: 0px 0px 4px #000; /* FF3.5+ */
    -webkit-box-shadow: 0px 0px 4px #000; /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 4px #000; /* Opera 10.5, IE 9.0 */
}

#contact{
	width: 422px;
	margin: 0 50px 0 38px;
	float: left;
	
	line-height: 1.4em;
	color: #fff;
}
div.contact_form p{
	margin: 25px 0;
}
div.contact_form p input,
div.contact_form p textarea{
	width: 400px;
	padding: 0.1em 10px;
	
	background: #fff;
	border: 1px solid #fff;
	
	font-size: 1.3em;
	line-height:1.2em;
	
    -moz-box-shadow: inset 0px 1px 2px #808080; /* FF3.5+ */
    -webkit-box-shadow: inset 0px 1px 2px #808080; /* Saf3.0+, Chrome */
    box-shadow: inset 0px 1px 2px #808080; /* Opera 10.5, IE 9.0 */  
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}
div.contact_form p textarea{
	display: block;
}
div.contact_form p label{
	font-size: 1.3em;
	line-height: 1.8em;
	margin-left: 10px;
}
div.contact_form p input[type="submit"]{
	width: 200px;
	margin: auto;
	
	color: #fff;
	background: #000;
	
    -moz-box-shadow: none; /* FF3.5+ */
    -webkit-box-shadow: none; /* Saf3.0+, Chrome */
    box-shadow: none; /* Opera 10.5, IE 9.0 */
}
div.contact_form p input[type="submit"]:hover{
	color: #000;
	background: #ceff8c;
	
    -moz-box-shadow: none; /* FF3.5+ */
    -webkit-box-shadow: none; /* Saf3.0+, Chrome */
    box-shadow: none; /* Opera 10.5, IE 9.0 */
}
#contact_page_form{
	float: left;
	margin-right: 25px;
}
#contact_page_content{
	float: right;
	width: 300px;
	padding-left: 33px;
}
#footer_wrapper{
	background: #002e40;
	
    -moz-box-shadow: inset 0 8px 16px #002533; /* FF3.5+ */
    -webkit-box-shadow: inset 0 8px 16px #002533; /* Saf3.0+, Chrome */
    box-shadow: inset 0 8px 16px #002533; /* Opera 10.5, IE 9.0 */  
}
#footer{
	padding:25px 0;
}
#to_top{
	position: absolute;
	top: 0;
	right: 50px;
	width: 198px;
	height: 49px;
	margin: 0 auto;
}
#to_top a{
	display: block;
	
	font-size: 1.8em;
	font-weight: bold;
	text-align: center;	
	line-height: 50px;
	color: #fff;
	
	background: #fff url('images/to_top.jpg') repeat-x;
	background-position:0px -50px;
	
	border: 1px solid #000;
	border-top: none;
	font-weight: bold;
		
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-radius: 0 0 6px 6px;
	border-radius: 0 0 6px 6px;
}
#to_top a:hover{
	color: #000;
	background-position:0px 0px;
}
#article_navigation{
	width: 290px;
	float: left;
	margin: 0 25px 0 50px;
}
#latest_projects{
	width: 290px;
	float: left;
	margin: 0 25px;
}
#article_navigation a,
#latest_projects a{
	font-weight: bold;
}
#special_links{
	text-align: center;
	
	width: 200px;
	float: left;
	margin: 50px 50px 0 25px;
}
#special_links div.facebook,
#special_links div.dig,
#special_links div.stumble_upon,
#special_links div.rss{
	margin: 10px 0;
}
#special_links div.media_temple{
	margin: 25px 0;
}