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

/* -------------------------- CSS Reset -------------------------- */

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;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img {
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}
sup { 
	vertical-align: text-top;
	font-size: 7px;
} 

/* -------------------------- Wrapper -------------------------- */


.wrapper {
	width: 100%;
}

/* -------------------------- Header Styles -------------------------- */

/* HEADER
----------------------------------------------------------------------------- */
#header_wrapper {
	position: relative;
	width: 100%;
	min-width:960px;
	height: 87px;
	border-bottom: 1px solid #333;
	background: #000 url(../images/background.gif) repeat-x center top;
}

#header {
	position: relative;
	width: 928px;
	height: 83px;
	margin: 0 auto 8px auto;
	padding: 0 16px;
	border-top: 4px solid #999;
	background:#000 url(../images/header_bg.png) no-repeat center top;
}

/* BRANDING
----------------------------------------------------------------------------- */
#branding {
	float: left;
	height:65px;
	padding:18px 0 0 0;
	margin: 0;
	width:308px;
}

#branding a {
	background:url(../images/logo.gif) no-repeat left top;
	display:block;
	height:32px;
	text-indent:-9999px;
	width:151px;
}

#tagline {
	padding:0;
	margin: 0;
	width:255px;
	color: #666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-decoration: none;
}

/* NAV MAIN
----------------------------------------------------------------------------- */

#navMain {
	float: right;
	height:83px;
	padding:0;
	margin:0 8px 0 0;
	width:492px;
}

#navMain ul {
	float: right;
	color: #999;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	padding: 48px 0 0 0;
	text-decoration: none;
}

#navMain li {
	float: left;
	margin: 0 10px 0 0;
	padding: 0 10px 0 0;
	border-right: 4px double #444;
}

#navMain li.last {
	margin: 0;
	padding: 0;
	border-right: none;
}

#navMain li a {
	color: #999;
	text-decoration: none;
}

#navMain li a:hover {
	color:#fff;
}


body#home a#home,
body#about a#about,
body#portfolio a#portfolio,
body#contact a#contact {
	color: #666;
	border-top: 10px solid #ccc;
}

.header#identity a#identity,
.header#design a#design,
.header#websites a#websites {
	color: #000;
	background: #CCC url(../images/arrow.png) no-repeat 8px 5px;
}

/* -------------------------- General Styles -------------------------- */

body {
	font-family: Arial, Helvetica, sans-serif;
	background: #FFF;
}

.clear-fix {
	clear: both;
	height: 1px;
}

.clear-fix.tall {
	clear: both;
	height: 50px;
}

.content_wrapper {
	background: #fff;
	width: 100%;
}

.content {
	margin: 0 auto;
	width: 610px;
	height:100px;
	text-align: left;
	padding: 25px 378px 0 62px;
}

.content.quote {
	margin: 0 auto;
	width: 654px;
	text-align: right;
	padding: 5px 340px 0 56px;
}

.content.quote.twentyfive {
	padding: 25px 340px 0 56px;
}

.content.identities {
	margin: 0 auto;
	width: 800px;
	text-align: center;
	padding: 24px 0 0 0;
}

.content.websites {
	margin: 0 auto;
	width: 778px;
	text-align: left;
	padding: 0 210px 0 62px;
}

.content h1 {
	font-family: Times New Roman, Times, serif;
	font-size: 28px;
	line-height: 34px;
	color: #999;
	text-decoration: none;
	padding: 0 0 16px 0;
}

.content h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	color: #666;
	border-top: 1px solid #CCC;
	padding: 18px 0 7px 0;
}

.content h2.first {
	border-top: none;
	margin: 0;
	padding: 0 0 7px 0;
}

.content.quote h2 {
	font-family: Times New Roman, Times, serif;
	font-size: 28px;
	line-height: 34px;
	font-weight: normal;
	color: #999;
	text-decoration: none;
	border: none;
	padding: 0;
	margin: 0 16px 0 0;
}

.content p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #666;
	text-decoration: none;
	padding: 0 0 8px 0;
}

.content.column01 {
	float: left;
	width: 305px;
	padding: 0 0 10px 0;
}

.content.column01 p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 16px;
	color: #666;
	text-decoration: none;
}

.content.column02 {
	float: left;
	width: 305px;
	padding: 0 0 10px 0;
}

.content.column02 p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 16px;
	color: #666;
	text-decoration: none;
}

.content p.indent {
	margin: 0 16px 0 0;
}

.gold {
	color: #888855;
}

.italic {
	font-style: italic;
}

.bold {
	font-weight: bold;
}

/* -------------------------- sidebar Styles -------------------------- */

.sidebar {
	position: absolute;
	left: 756px;
	top: 0px;
	width: 180px;
	height:738px;
	padding: 37px 15px 25px 15px;
	text-align: center;
	background: url(../images/funstuff.jpg) no-repeat center top;
}
.sidebarportfolio {
	position: absolute;
	left: 756px;
	top: 0px;height: 697px;
	width: 180px;
	padding: 69px 30px 25px 0;
	text-align: left;
	background: url(../images/sidebar.jpg) no-repeat center top;
}
.sidebarportfolio.line {
	background: url(../images/sidebar_line.jpg) no-repeat center top;
}

.sidebarcontact {
	position: absolute;
	left: 756px;
	top: 0px;
	padding: 37px 15px 25px 15px;
	height: 636px;
	width: 180px;
	padding: 130px 15px 25px 15px;
	text-align: left;
	background: url(../images/sidebar.jpg) no-repeat center top;
}

.sidebar h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 14px;
	color: #666;
	padding: 8px 0 8px 0;
}

.sidebar p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #414041;
	line-height: 14px;
	padding: 0 0 7px 0;
}

.sidebar p.last {
	padding: 0 0 30px 0;
}

.sidebar p.movie {
	padding: 0 0 7px 0;
}

.album {
	width: 180px;
	height: 60px;
	padding: 0 0 110px 0;
	background: url(../about/albums/rotator.php) no-repeat center top;
}

.sidebar a.challenge {
	display: block;
	width: 180px;
	height: 78px;
	text-decoration: none;
	margin: 25px 0 25px 0;
	background: url(../images/challenge.png) no-repeat left top;
}

.sidebar a.challenge:hover {
	text-decoration: none;
	background-position: right top;
}

.sidebarportfolio ul {
	padding: 8px 0 0 0;
}

.sidebarportfolio li {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	width: 210px;
	text-indent: 20px;
}

.sidebarportfolio li.sub {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	width: 210px;
	text-indent: 30px;
}

.sidebarportfolio li.last {
	padding: 0 0 6px 0;
}

.sidebarportfolio li a {
	color: #333;
	display: block;
	text-decoration: none;
	padding: 4px 0 4px 0;
}
.sidebarportfolio li a:hover {
	color: #000;
	background: #DDD;
}

.sidebarportfolio li.sub a {
	color: #333;
	display: block;
	text-decoration: none;
	padding: 4px 0 4px 0;
}
.sidebarportfolio li.sub a:hover {
	color: #000;
	background: #DDD;
}
.sidebarcontact a  {
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 33px;
	display: block;
	width: 140px;
	height: 33px;
	color: #333;
	text-decoration: none;
	padding: 0 0 0 40px;
	background: url(../images/facebook.png) no-repeat left top;
}
.sidebarcontact a:hover {
	color: #000;
	text-decoration: none;
	background-position: left bottom;
}
.sidebarcontact a.linkedin  {
	background: url(../images/linkedin.png) no-repeat left top;
}

.sidebarcontact a.linkedin:hover {
	color: #000;
	text-decoration: none;
	background-position: left bottom;
}
.sidebarcontact a.twitter  {
	background: url(../images/twitter.png) no-repeat left top;
}

.sidebarcontact a.twitter:hover {
	color: #000;
	text-decoration: none;
	background-position: left bottom;
}
.sidebarcontactmargin {
	float: left;
	width: 180px;
	height: 20px;
}

.sidebarportfolio#id01 a#id01,
.sidebarportfolio#id02 a#id02,
.sidebarportfolio#id03 a#id03,
.sidebarportfolio#id04 a#id04,
.sidebarportfolio#id05 a#id05,
.sidebarportfolio#ds01 a#ds01,
.sidebarportfolio#ds02 a#ds02,
.sidebarportfolio#ds03 a#ds03,
.sidebarportfolio#ds04 a#ds04,
.sidebarportfolio#ds05 a#ds05,
.sidebarportfolio#ws01 a#ws01,
.sidebarportfolio#ws02 a#ws02,
.sidebarportfolio#ws03 a#ws03,
.sidebarportfolio#ws04 a#ws04,
.sidebarportfolio#ws05 a#ws05 {
	color: #000;
	background: url(../images/nav_edge.png) no-repeat left top;
}

/* -------------------------- downloads Styles -------------------------- */

.sidebardownloads {
	float: left;
	height: 636px;
	width: 175px;
	padding: 0px 15px 25px 40px;
	text-align: left;
	background: url(../images/sidebar.jpg) no-repeat center top;
}

.sidebardownloads h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #333;
	line-height: 14px;
	padding: 0 0 7px 0;
}

.sidebardownloads h1.last {
	padding: 0;
}

.sidebardownloads p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	line-height: 14px;
	padding: 0 0 4px 0;
}

.sidebardownloads p.italicnote {
	font-style: italic;
	padding: 0 0 7px 0;
}

.sidebardownloads p.last {
	padding: 0 0 18px 0;
}

.sidebardownloads p.first {
	padding: 0;
}
.sidebardownloads p.second {
	padding: 0 0 4px 12px;
}

.sidebardownloads p.third {
	padding: 0 0 4px 0;
}

.downloadsimage {
	float: left;
	padding: 0 20px 0 0;
}

.downloadslist {
	float: left;
	width: 250px;
	padding: 0;
	text-align: left;
}

.downloadslist h1 {
	font-family: Times New Roman, Times, serif;
	font-size: 18px;
	line-height: 20px;
	color: #666;
	text-decoration: none;
	padding: 0 0 12px 0;
}

.downloadslist h1.top {
	padding: 16px 0 8px 0;
}

.downloadslist p {
	padding: 0 0 8px 0;
}

.downloadslist a {
	color: #888;
	text-decoration: none;
}

.downloadslist a:hover {
	color: #000;
	text-decoration: underline;
}





/* -------------------------- Bland Styles -------------------------- */

.bland_wrapper {
	height: 286px;
	width: 100%;
	background: #fff url(../images/about_blur.jpg) repeat-x left top;
}

.bland_wrapper.home {
	height: 552px;
	width: 100%;
	background: #fff url(../images/home_blur.jpg) repeat-x left top;
}

.bland_wrapper.portfolio {
	height: 470px;
	width: 100%;
	background: #fff url(../images/portfolio_blur.jpg) repeat-x left top;
}

.bland_wrapper.sample {
	height: 59px;
	width: 100%;
	border-top: 1px solid #ccc;
	background: #fff url(../images/sample_name_back.jpg) repeat-x left top;
}

.bland_wrapper.thumbnailpage {
	background: #fff url(../images/thumbnail_blur.jpg) repeat-x left top;
}

.bland {
	height: 286px;
	margin: 0 auto;
	width: 960px;
	background: #ebebeb url(../images/bland.jpg) no-repeat left top;
}

.bland.home {
	height: 552px;
	margin: 0 auto;
	width: 1050px;
	background: #ebebeb url(../images/home_image.jpg) no-repeat left top;
}

.bland.about {
	height: 256px;
	width: 694px;
	padding: 30px 294px 0 62px;
	background: #fff url(../images/about_blur.jpg) repeat-x left top;
}

.bland.contact {
	height: 256px;
	width: 634px;
	padding: 30px 354px 0 62px;
	background: #fff url(../images/about_blur.jpg) repeat-x left top;
}

.bland.portfolio {
	height: 470px;
	width: 724px;
	padding: 0 215px 0 111px;
	background: none;
}

.bland.thumbnails {
	height: 286px;
	width: 840px;
	padding: 0 210px 0 0;
	background: none;
}

.bland.sample {
	height: 60px;
	width: 662px;
	padding: 0 326px 0 62px;
	background: none;
}

.bland h1 {
	font-family: Times New Roman, Times, serif;
	font-size: 28px;
	line-height: 36px;
	color: #777;
	text-decoration: none;
}

.bland h2 {
	font-family: Times New Roman, Times, serif;
	font-size: 22px;
	line-height: 22px;
	color: #777;
	text-decoration: none;
	margin: 0 0 18px 0;
}

.bland.sample h1 {
	float: left;
	font-family: Times New Roman, Times, serif;
	font-size: 20px;
	line-height: 40px;
	color: #777;
	text-decoration: none;
	margin: 6px 100px 0 0;
}

.bland p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #666;
	text-decoration: none;
	padding: 0 0 15px 0;
}

.bland.contact p {
	float: left;
	color: #000;
	padding: 0;
	margin: 1px 0 0 2px;
}

.bland.text {
	position: absolute;
	left: 62px;
	top: 400px;
	width: 500px;
	height: 150px;
	background: none;
	margin: 0;
}

.bland.text h1 {
	line-height: 34px;
	color: #999;
	text-decoration: none;
	padding: 0 0 16px 0;
}

.bland.text p {
	padding: 0 0 8px 0;
}

.bland.sample a {
	float: right;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 11px;
	color: #666;
	text-decoration: none;
	padding: 12px 0 0 0;
	margin: 10px 11px 0 16px;
}

.bland.sample a:hover {
	border-top: 10px solid #ccc;
	color: #666;
	margin: 0 11px 0 16px;
}

.bland.sample#ws01A a#ws01A,
.bland.sample#ws01B a#ws01B,
.bland.sample#ws01C a#ws01C,
.bland.sample#ws02A a#ws02A,
.bland.sample#ws02B a#ws02B,
.bland.sample#ws02C a#ws02C,
.bland.sample#ws03A a#ws03A,
.bland.sample#ws03B a#ws03B,
.bland.sample#ws03C a#ws03C {
	color: #000;
	background: #FFF;
}

.thumbnail {
	float: left;
	height: 278px;
	width: 138px;
	border-top: 4px solid #ccc;
	border-left: 1px solid #ccc;
}
.thumbnail.first {
	margin: 0 0 0 62px;
}
.thumbnail.id01 {
	background: url(../portfolio/identity/id01/image_small.jpg) no-repeat left top;
}
.thumbnail.id02 {
	background: url(../portfolio/identity/id02/image_small.jpg) no-repeat left top;
}
.thumbnail.id03 {
	background: url(../portfolio/identity/id03/image_small.jpg) no-repeat left top;
}
.thumbnail.id04 {
	background: url(../portfolio/identity/id04/image_small.jpg) no-repeat left top;
}
.thumbnail.id05 {
	background: url(../portfolio/identity/id05/image_small.jpg) no-repeat left top;
}
.thumbnail.ds01 {
	background: url(../portfolio/design/ds01/image_small.jpg) no-repeat left top;
}
.thumbnail.ds02 {
	background: url(../portfolio/design/ds02/image_small.jpg) no-repeat left top;
}
.thumbnail.ds03 {
	background: url(../portfolio/design/ds03/image_small.jpg) no-repeat left top;
}
.thumbnail.ds04 {
	background: url(../portfolio/design/ds04/image_small.jpg) no-repeat left top;
}
.thumbnail.ds05 {
	background: url(../portfolio/design/ds05/image_small.jpg) no-repeat left top;
}
.thumbnail.ws01 {
	background: url(../portfolio/websites/ws01/image_small.jpg) no-repeat left top;
}
.thumbnail.ws02 {
	background: url(../portfolio/websites/ws02/image_small.jpg) no-repeat left top;
}
.thumbnail.ws03 {
	background: url(../portfolio/websites/ws03/image_small.jpg) no-repeat left top;
}
.thumbnail.ws04 {
	background: url(../portfolio/websites/ws04/image_small.jpg) no-repeat left top;
}
.thumbnail.ws05 {
	background: url(../portfolio/websites/ws05/image_small.jpg) no-repeat left top;
}

.thumbnail a {
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	height: 15px;
	width: 128px;
	text-decoration: none;
	padding: 228px 0 32px 10px;	
}

.thumbnail a:hover {
	color: #000;
	background: url(../images/thumbnail_rollover.png) no-repeat left top;
}

/* FOOTER
----------------------------------------------------------------------------- */
#footer_wrapper {
	position: relative;
	width: 100%;
	min-width:960px;
	height: 50px;
	background: #000 url(../images/footer_bg.gif) repeat-x center 0;
}

#footer {
	position: relative;
	width: 912px;
	height: 50px;
	margin: 0 auto;
	padding: 0 24px;
	border: none;
	background: #000 url(../images/footer_bg.gif) repeat-x center 0;
}

#footer p {
	float: left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#666;
	margin:0;
}

#footer ul {
	float: left;
	padding: 14px 0 0 0;
}

#footer li {
	float: left;
	font-size:11px;
	padding: 0 10px 0 0;
	margin: 0 10px 0 0;
	border-right: 4px double #666;
}

#footer li.last {
	padding: 0;
	margin: 0;
	border-right: none;
}

#footer li a {
	display: block;
	color:#fff;
	text-decoration: none;
}

#footer a:hover {
	color:#ccc;
}

#footer a#home_mobile {
	display: none;
}

/* SOCIAL MEDIA
----------------------------------------------------------------------------- */

#socialmedia {
	float: right;
	height: 24px;
	padding: 8px 0 0 0;
}

#socialmedia p {
	float: left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#fff;
	padding: 6px 0 0 0;
	margin:0 8px 0 0;
}

#socialmedia a {
	float: left;
	display: block;
	width: 24px;
	height: 24px;
	text-decoration: none;
	margin: 0 8px 0 0;
	padding: 0;
}

#socialmedia a.twitter {
	background: url(../images/social_icons.gif) no-repeat -25px bottom;
}

#socialmedia a.twitter:hover {
	text-decoration: none;
	background-position: -25px top;
}

#socialmedia a.facebook {
	background: url(../images/social_icons.gif) no-repeat 0 bottom;
}

#socialmedia a.facebook:hover {
	text-decoration: none;
	background-position: 0 top;
}

#socialmedia a.linkedin {
	background: url(../images/social_icons.gif) no-repeat -50px bottom;
	margin: 0;
}

#socialmedia a.linkedin:hover {
	text-decoration: none;
	background-position: -50px top;
}

/* -------------------------- Form Styles -------------------------- */

.formtext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 14px;
	color: #666;
	float: left;
	text-align: right;
	width: 80px;
	margin: 2px 6px 10px 0;
}

.formEMAIL {
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	background-color: #fff;
	float: left;
	width: 544px;
	height: 16px;
	border: 1px solid #bbb;
	margin: 1px 0 7px 0;
}

.formTHREE {
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	background-color: #fff;
	border: 1px solid #bbb;
	height: 100px;
	width: 544px;
	margin: 1px 0 7px 0;
}
.submit {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	float: left;
	width: 100px;
	height: 22px;
	border: 1px solid #AAA;
	margin: 0 0 0 86px;
	background: #DDD;
}
.submit:hover {
	color: #333;
	border: 1px solid #888;
	background: #BBB;
}
.formalign {
	float: left;
	width: 634px;
}