/* Table of Contents

	- Global Reset
	- Basic Structural Rules
		- Common HTML Elements
	- Specific Structural Rules
	- Form Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


/* Global Reset

	This is an easy way to make sure that all browsers will default all element rules to the same settings.
	
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
	border: none;
	font-size: inherit;
	line-height: inherit;
}
fieldset,img { border: 0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; font-weight: normal; }
ol,ul { list-style: none; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight: normal; }
q:before,q:after { content:''; }
abbr,acronym { border: 0; }

/* Basic Structural Rules

	These ids and classes create the most basic building blocks for the website.
	(html) sets the default font type, color and size for the entire site.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/


html {
	width: 100%;
	color: #fff;
	font-family: Helvetica, Arial, Verdana;
	text-align: center;
	background: url(../images/template/pageBackground.gif) top repeat;
}

body {
	margin: 0 auto 0 auto;
	width: 100%;
	text-align: center;
	background: url(../images/template/pageBackgroundTop3.gif) top repeat-x;
}

#wrapper {
	margin: 0 auto 0 auto;
	width: 980px;
	font-size: 12px;
	line-height: 18px;
	display: block;
}

#header {
	margin: 0 auto 0 auto;
	padding: 0;
	height: 150px;
	width: 980px;
	text-align: left;
	display: block;
	float: left;
	clear: both;
}

#printHeader { display: none; }

#content {
	margin: 0 auto 0 auto;
	padding: 0;
	width: 980px;
	text-align: left; 
	display: block;
	float: left;
}

#content.work { overflow-x: hidden; }

#footer {
	margin: 0 auto 0 auto;
	width: 980px;
	text-align: left;
	display: block;
	clear: both;
}

/* Common Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

a { color: #99ff29; text-decoration: none; outline: none; }
a:hover { color: #79da0f; text-decoration: none; }

#content div { display: block; }

strong { font-weight: bold; }

h1 { padding: 25px 10px 30px 10px; color: #fff; font-size: 40px; line-height: normal; font-weight: normal; text-shadow: 3px; width: auto; display: block; clear: both; }

#content.home h1 { padding: 25px 10px 30px 10px; color: #9e9e9e; font-size: 33px; line-height: normal; font-weight: normal; text-shadow: 3px; width: auto; display: block; clear: both; }
#content.home h1 strong { color: #fff; font-weight: bold; }

h2 {
	padding: 0 0 9px 0;
	font-size: 16px;
	font-weight: normal;
	line-height: 18px;
	width: auto;
	display: block;
	clear: both;
}

h3 {
	padding: 0;
	font-size: 13px;
	line-height: 18px;
	width: auto;
	display: block;
	clear: both;
}

h4 {
	padding: 0;
	font-size: 13px;
	line-height: 18px;
	width: auto;
	display: block;
	clear: both;
}

p {
	padding: 0;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	width: auto;
	display: block;
}

ul {
	padding: 0;
}

ol {
	padding: 0;
}

ul li, ol li {
	padding: 0;
	list-style: disc;
	list-style-position: outside;
}

ul.arrow { margin: 0; padding: 6px 0 0 0; list-style: none; display: block; clear: both; }

ul.arrow li { padding: 3px 22px 3px 0; background: url(../images/template/arrow.gif) right no-repeat; display: block; float: left; clear: both; }

ul.arrow a { color: #91dc22; font-size: 11.5px; margin: 0; padding: 0; }

sup { font-size: 6px; }

/* Specific Structural Rules

	Use this area to define rules for specific content/pages/design elements.
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

/* header logo */

#logo a { margin: 0; padding: 0; height: 150px; width: 330px; background: url(../images/template/headerLogo.gif) top left no-repeat; display: block; float: left; clear: none; }

/* navigation */

ul.navigation { margin: 0; padding: 18px 10px 10px 10px; width: auto; display: block; float: right; clear: none; }

ul.navigation li { margin: 7px 0 0 0; padding: 0; text-align: right; list-style: none; }

ul.navigation a { margin: 0; padding: 0; font-size: 14px; letter-spacing: 1px; color: #868686; }
ul.navigation a:hover, ul.navigation li.active a { color: #fff; }
ul.navigation li.active a:hover { color: #ccc; }

/* footer */

#footer { margin: 0; padding: 10px 0 20px 0; display: block; clear: both; }

#footer p { margin: 0; padding: 10px; color: #909090; font-size: 11px; }


/* Homepage Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

/* homepage portfolio area */

#portfolio { margin: 0; padding: 0; width: 570px; display: block; float: left; clear: none; position: relative; }

#portfolio a.flashLink { margin: 0; padding: 0; height: 435px; width: 570px; display: block; clear: both; position: absolute; top: 0; left: 0; z-index: 1000; cursor: pointer;  }

#portfolio p { margin: 0; padding: 0; height: 435px; width: 570px; display: block; clear: both; }

#portfolio p img { margin: 0; padding: 0; }

#portfolioFlash { margin: 0; padding: 0; height: 435px; width: 570px; display: block; clear: both; }

#portfolio ul { padding: 0 10px 0 10px; clear: both; }

/* homepage news */

#news { margin: 0; padding: 10px 15px 10px 15px; width: 260px; display: block; float: left; clear: none; }

#news p { font-size: 12px; }

/* homepage clients */

#clients { margin: 0; padding: 10px 0 10px 10px; width: 110px; display: block; float: left; clear: none; }

#clients ul { margin: 0 0 -10px 0; padding: 0; list-style: none; display: block; float: left; clear: none; }

#clients li { margin: 0 0 40px 0; padding: 0; list-style: none; display: block; float: left; clear: none; }

/* divider */

div.divider { margin: 0; padding: 0; height: 45px; background: url(../images/template/divider.gif) left repeat-x; display: block; clear: both; }

/* Studio Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

/* blurb */

#blurb { margin: 0; padding: 0 10px 15px 10px; width: 960px; display: block; float: left; clear: none; }

#blurb img { margin: 0 30px 30px 0; padding: 0; display: block; float: left; clear: none; }

#blurb p { padding: 0 0 25px 0; font-size: 15px; line-height: 18px; width: auto; display: block; }

/* testimonials */

#testimonials { margin: 0 70px 0 0; padding: 0 10px 0 10px; width: 380px; display: block; float: left; clear: none; }

#testimonials h2 { margin: 0; padding: 0 0 10px 0; font-size: 12px; background: url(../images/template/divider.gif) bottom left repeat-x; display: block; clear: both; }

#testimonials div { margin: 0; padding: 15px 0 0 0; display: block; float: left; clear: none; }

#testimonials img { margin: 0 10px 10px 0; padding: 0; display: block; float: left; clear: none; }

#testimonials p { font-size: 12px; line-height: 15px; padding: 0 0 15px 0; width: auto; display: block; }

/* awards */

#awards { margin: 0; padding: 0 10px 0 10px; width: 480px; display: block; float: left; clear: none; }

#awards div { margin: 0; padding: 0 15px 0 0; width: 225px; display: block; float: left; clear: none; }
#awards div.right { padding: 0 0 0 15px; }

#awards h2 { margin: 0; padding: 0 0 10px 0; font-size: 12px; background: url(../images/template/divider.gif) bottom left repeat-x; display: block; clear: both; }

#awards ul { margin: -15px 0 0 0; padding: 0 0 0 25px; }

#awards li { margin: 0 0 -15px 0; padding: 0; font-size: 12px; font-weight: normal; line-height: 15px; }

#awards li.title { margin: 0 0 -14px -25px; padding: 15px 0 0 0; font-size: 12px; font-weight: bold; list-style: none; }

#awards div.awards { margin: 40px 0 0 0; padding: 0; width: 480px; display: block; float: left; clear: both; }

#awards div.awards img { margin: 0; padding: 0; display: block; clear: both; }

/* Work Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#work { margin: 0; padding: 35px 0 0 10px; width: 999px; display: block; float: left; clear: none; }

#work div { margin: 0; padding: 0 0 45px 0; color: #d5d5d5; width: 333px; display: block; float: left; clear: none; }

#work img { margin: 0; padding: 0; width: 333px; display: block; float: left; clear: none; }

#work h2 { margin: 0; padding: 0 20px 7px 0; color: #fff; font-size: 17px;  background: url(../images/template/arrow.gif) top right no-repeat; display: block; float: left; clear: both; }

#work h2 strong { color: #decb64; font-weight: normal; }

#work p { padding: 0 20px 0 0; font-size: 11.5px; line-height: 14px; width: auto; display: block; float: none; clear: both; }

#work div.popUp p { color: #333; text-align: left; }

/* Work Detail Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

#workDetail { margin: 0; padding: 0 0 0 10px; width: 999px; display: block; float: left; clear: none; }

#workDetail h2 {
	margin: 0;
	padding: 10px 25px 7px 0px;
	color: #fff; font-size: 17px;
	display: block;
	float: left;
	clear: left;
}

#workDetail h2 strong { color: #decb64; font-weight: normal; }

#workDetail a.button {
	margin: 10px 0 0 0;
	padding: 3px 0 3px 22px;
	color: #a6a6a6;
	font-size: 11px;
	background: url(../images/template/arrow2.gif) left no-repeat;
	display: block;
	float: left;
	clear: none;
}

#workDetail a.worklink {
	margin: 10px 0 0 0;
	padding: 2px 0 2px 22px;
	color: #a6a6a6;
	font-size: 11px;
	display: block;
	float: left;
	clear: none;
}
#workDetail img { margin: 0; padding: 20px 20px 10px 0; display: block; float: left; clear: both; }

/* 2 Column */

#workDetail div.twoColumn { margin: 0; padding: 0; width: 999px; display: block; float: left; clear: none; }

#workDetail div.twoColumn img { margin: 0; padding: 20px 30px 10px 0; width: 469px; clear: none; }

/* News Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

/* news navigation */

#newsNavigation { margin: 40px 50px 0 0; padding: 0 10px 0 10px; width: 230px; display: block; float: left; clear: none; }

#newsNavigation ul { margin: -15px 0 0 0; padding: 0; font-size: 12px; line-height: 15px; }

#newsNavigation li { margin: 0 0 -15px 0; padding: 0 0 25px 0; list-style: none; }

#newsNavigation li.active a { color: #79da0f; }

#newsNavigation li a { color: #d4d4d4; }
#newsNavigation li a:hover, #newsNavigation li.active a:hover { color: #fff; }

/* news article */

#newsArticle { margin: 35px 0 0 0; padding: 0 0 0 10px; width: 550px; display: block; float: left; clear: none; }

#newsArticle h1 { margin: 0; padding: 0 0 10px 0; font-size: 22px; display: block; clear: both; }

#newsArticle div { margin: 0; padding: 15px 0 0 0; display: block; float: left; clear: none; }

#newsArticle p { padding: 15px 0 10px 0; font-size: 14px; line-height: 24px; }

#newsArticle ul { padding: 0px 0 0px 15px; }

#newsArticle li { padding: 0 0 0 5px; font-size: 14px; }

#newsArticle span { margin: 0; padding: 0 3px 0 0; font-size: 11px; display: inline; }

/* news article icon */

#newsArticleIcon { margin: 93px 0 0 0; padding: 0 0 10px 0; width: 110px; display: block; float: left; clear: none; }

#newsArticleIcon ul { margin: 0 0 -10px 0; padding: 0; list-style: none; display: block; float: left; clear: none; }

#newsArticleIcon li { margin: 0 0 40px 0; padding: 0; list-style: none; display: block; float: left; clear: none; }

/* Contact Rules
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _*/

/* form */

#form { margin: 0 40px 0 0; padding: 0 10px 0 10px; width: 420px; display: block; float: left; clear: none; }

#form fieldset { margin: 0 0 15px 0; padding: 0; display: block; clear: both; }

#form label { padding: 0 0 4px 0; font-size: 11px; display: block; clear: both; }

#form textarea { padding: 5px; width: 410px; display: block; clear: both; }

#form input.text { padding: 5px; width: 290px; display: block; clear: both; }

#form a.button {
	margin: 0;
	padding: 3px 22px 3px 0;
	color: #91dc22;
	font-size: 11.5px;
	background: url(../images/template/arrow.gif) right no-repeat; display: block; float: left; clear: both;
}

/* info */

#info { margin: 0 40px 0 0; padding: 20px 0 0 10px; width: 180px; display: block; float: left; clear: none; }

#info h2 { margin: 0; padding: 0 0 5px 0; font-size: 15px; }

#info p { margin: 0; padding: 0 0 10px 0; font-size: 12px; line-height: 15px; }

#info ul.links { margin: 0; padding:15px 0 0 0; }

#info ul.links li { margin: 0; padding: 0; list-style: none; }

#info a.graphic {
	margin: 0;
	padding: 0 0 18px 0;
	text-indent: -5000px;
	overflow: hidden;
	height: 15px;
	display: block;
	clear: both;
}

#info a.linkedIn { width: 53px; background: url(../images/logos/linkedIn.gif) top left no-repeat; }
#info a.twitter { width: 53px; background: url(../images/logos/twitter.gif) top left no-repeat; }
#info a.delicious { width: 75px; background: url(../images/logos/delicious.gif) top left no-repeat; }