/* ================================================= */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
strong{font-weight: bold;}


/* `Clear Floated Elements
-----------------------------------------------------*/
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	visibility: hidden;
	height: 0;
}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}

/* Common Styles *************************************/
/* ================================================= */
body{
	background: #e7e7e8 url(/images/body-bg.png) repeat-x;
	color: #333;
	color: rgba(0,0,0,.8);
	font-family: "Helvetica Neue", Helvetia, Arial, sans-serif;
  	font-size: 13px;
  	line-height: 18px;
}
	body#internal{background: #e7e7e8 url(/images/body-bg-internal.png) repeat-x;}

h1, h2, h3, h4, h5, h6{
	font-weight: normal;
	line-height: 1;
}

h1{
	color: #3d3d3d;
	font-size: 30px;
	margin-bottom: 25px;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
}
h2{
	color: #3d3d3d;
	font-size: 30px;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
}
h3{
	color: #3d3d3d;
	font-size: 24px;
	margin-bottom: 18px;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
}
h4{
	color: #3d3d3d;
	font-size: 18px;
	margin-bottom: 18px;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
}
h5{
	color: #3d3d3d;
	font-size: 18px;
	margin-bottom: 5px;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
}

p{margin-bottom: 18px;}


a{
	color: #2669c4;
	text-decoration: none;
}
	a:hover{
		color: #000;
		text-decoration: underline;
	}


.content
{
	width:960px;
	margin:0 auto;
	position:relative;
}

/* ===================HEADER===================== */
#header{
	background: url(/images/header-bg.jpg) no-repeat bottom right;
	height: 161px;
}
	#header h1 {
		position: absolute;
		left: 260px;
		top: 20px;
		width: 381px;
	}
	
		#header h1 a {
			background: transparent url(/images/logo.png) no-repeat;
			display: block;
			height: 98px;
			text-indent: -9999px;
			width: 381px;
		}
		
	

/* ===================TAG===================== */
#tag{
	height: 143px;
	padding-top: 35px;
	text-align: center;
}
	#tag h2, #tag a{
		color: #444;
		line-height: 1.2;
		text-shadow: 0 1px 1px rgba(255, 255, 255, 0.7)
	}

/* Main Content and Module Styles ********************/
/* ================================================= */
#main {margin-top: 25px;}
	#internal #main{margin-top: 35px;}


.mod{
	border-bottom: 1px solid #b2b1b1;
	border-bottom-color: rgba(0,0,0,.2);
	margin-bottom: 25px;
}
	.mod.last{border: none;}
	.mod h2{
		color: #3d3d3d;
		color: rgba(0,0,0,.7);
		font-size: 14px;
		font-weight: bold;
		margin-bottom: 10px;
		text-shadow: none;
		text-transform: uppercase;
	}
		.mod h2 span{font-weight: normal;}
	.mod ul{
		list-style-type: disc;
		margin-left: 15px;
		margin-bottom: 18px;
	}
		.mod ul.arrow-list{
			list-style-type: none;
			margin-left: 0px;
		}
		.mod ul.arrow-list li{
			background: url(/images/icon-arrow.png) 0px 5px no-repeat;
			padding-left: 22px;
		}
	
	.mod a.site-external span{display: none;}
		.mod a.site-external:hover span{
			color: #000;
			color: rgba(0,0,0,.8);
			display: inline;
			font-size: 12px;
			text-transform: none;
		}
		.mod a.site-external:hover{text-decoration: none;}
	
	.full{
		float: left;
		position: relative;
		width: 610px;
	}
		.full.right{float: right;}
	
	.col-half{
		float: left;
		padding-right: 20px; 
		width: 295px;
	}
		.col-half.last{padding-right: 0px;}
	
	.secondary{
		float: right;
		width: 300px;
	}
		.secondary.left{float: left;}

		img.glow-border{
			border: 3px solid #fff;
			margin-bottom: 18px;
			/* Outer Glow */
			box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
			-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
			-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		}
		img.align-right{
			float: right;
			margin: 0 0 20px 20px;
		}
		img.align-left{
			float: left;
			margin: 0 20px 20px 0;
		}
			.secondary img.align-left{margin-right: 10px;}

/* ==============CALLOUTS================= */
#callouts{
	background: url(/images/callouts-bg.png) repeat-x;
	border-bottom: 1px solid #fff;
	border-top: 1px solid #fff;
	height: 222px;
	margin-bottom: 10px;
}
	#callouts .column{
		float: left;
		padding: 35px 30px 0 0;
		width: 300px;
	}
		#callouts .last{
			padding-right: 0px;
		}	
		
	p.callouts-btn a{
		background: url(/images/callouts-btn.png) 0 0 repeat-x;
		color: #fff;
		font-size: 15px;
		height: 35px;
		line-height: 35px;
		padding: 7px 30px 9px;
		text-align: center;
		text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8)
		/* Rounded Corners */
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		/* Outer Glow */
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
		-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		
	}
		p.callouts-btn a:hover{
			background: url(/images/callouts-btn.png) 0px -35px repeat-x;
			color: #333;
			text-shadow: 0 1px 1px rgba(255, 255, 255, 0.7);
			text-decoration: none;
		}
		
/* ==============WORK==================== */
div.work-item{
	float: left;
	margin: 0 30px 25px 0;
	width: 300px;
}
	div.work-item.last{margin-right: 0px;}
	div.work-item a{display: block;}
		div.work-item a img{
			border: 3px solid #fff;
			/* Outer Glow */
			box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
			-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
			-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		}
			div.work-item a:hover img{border-color:#2669c4;}
		div.work-item a strong{
			color: #3d3d3d;
			display: block;
			font-size: 14px;
			margin: 18px 0;
			text-shadow: none;
			text-transform: uppercase;
		}
			div.work-item a strong em{font-weight: normal; font-style: normal;}
			div.work-item a:hover{text-decoration: none;}
		div.work-item a span, div.work a:hover span{
			color: #333;
		}


h1#project-title{float: left;}

p#project-trigger{
	color: #2669c4;
	cursor: pointer;
	float: right;
	margin-top: 15px;
}
	p#project-trigger:hover{color: #000;}
	div#project-list{display: none;}
		div#project-list ul{
			list-style-type: none;
			margin: 0px;
		}
			div#project-list ul li{
				float: left;
				margin: 0 20px 20px 0;
				position: relative;
				width: 176px;
			}
				div#project-list ul li.last{margin-right: 0px;}
				div#project-list ul li img{
					border: 3px solid #fff;
					/* Outer Glow */
					box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
					-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
					-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
				}
					div#project-list ul li a:hover img{border-color:#2669c4;}
				
				div#project-list ul li a span{
					background: #333;
					background: rgba(0,0,0,.6);
					color: #fff;
					display: none;
					position: absolute;
					bottom: 7px;
					left: 3px;
					text-align: center;
					width: 170px;
				}
					div#project-list ul li a:hover span{display: block;}
					div#project-list ul li a span strong{
						display: block;
						font-size: 14px;
						padding: 10px;
						text-transform: uppercase;
					}
					div#project-list ul li a:hover{text-decoration: none;}

div.screens{
	margin-bottom: 25px;
	height: 490px;
	width: 610px;
}
		
	div.screens img{
		border: 5px solid #fff;
		margin: 4px;
		/* Outer Glow */
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
		-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
	}
	
	ul.screens-nav{
		list-style-type: none;
		margin-bottom: 0px;
	}
		ul.screens-nav li#cycle-prev{
			position: absolute;
			left: -15px;
			top: 220px;
			z-index: 999;
		}
		ul.screens-nav li#cycle-next{
			position: absolute;
			right: -15px;
			top: 220px;
			z-index: 999;
		}

/* ===============FOOTER====================== */
#footer{
	color: #5a5a5a;
	font-size: 12px;
	margin-bottom: 20px;
}
	p#copyright{
		float: left;
	}
		p#copyright span{padding: 0 5px;}
		p#copyright a{color: #5a5a5a;}
			p#copyright a:hover{
				color: #000;
				text-decoration: underline;
			}
			
	p#ee-power{float: right;}