html {height: 100%;overflow-y: scroll;}
body {
	height: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	color: #000;	
	font-size: 75%;
	line-height: 1.5;
	text-align: center;
}
a img {border: 0;}

h2, h3, h4, h5, h6, body, input, textarea {font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;}


/* Headings
-------------------------------------------------------------- */

h1 {font-size: 1.5em; border-top: 1px solid #000; border-bottom: 1px solid #000;line-height: 2.5;padding-left: 10px;}
h2 {font-size: 1.4em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.2em;}
h5 {font-size: 1.1em;}
h6 {font-size: 1em;}

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 	0;
}

#andrea {font-size: 16.734em;}
#andrea a {color: #fff;}

/* Text elements
-------------------------------------------------------------- */

a, a:visited, #nav a:hover, #header .made:hover { text-decoration: none;}

a:focus, a:hover { text-decoration: underline; }
a {color: #5a4659; }
a:focus,:focus {outline: 1px dotted #fff;}
a:active {outline: none;}

strong,dfn { font-weight: bold; }
em,dfn { font-style: italic; }
sup, sub { line-height: 0; }

.amp {
font-family: Skia, Tahoma, "Book Antiqua", serif;
font-style: italic;
font-weight: normal;
}
h1 .amp, h2 .amp, h3 .amp, h4 .amp, h5 .amp, h6 .amp {font-family: "Cooper Std", Skia, Tahoma, serif;font-size: inherit;}

.made {font-weight: 700; letter-spacing: 1px;font-family: "museo-sans-1","museo-sans-2",sans-serif;}
.made span {font-weight: 500;}
#header .made {font-size: 1.5em; color: #fff;height: 16px;line-height: 1em;}


/* Form elements
-------------------------------------------------------------- */

label       { font-weight: bold; }
label span  { font-weight: normal; color: #b8b8b8;font-style: italic;}
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc;}
legend      { font-weight: bold; font-size:1.2em;}


/* Form fields
-------------------------------------------------------------- */

input[type=text],
textarea, select { 
  font-size: 100%;
  line-height: 1.5;
  padding: 10px 5px;
  width: 97%;
  color:#666;
  background:#fff; 
  border:1px solid; 
  border-color:#b8b8b8 #DFDFDF #DFDFDF #b8b8b8;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
}
input[type=text]:focus, 
textarea:focus, select:focus { 
  border-color:#808080;
  color:#333; 
}

input[type=text], 
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}

textarea { width: 97%; height: 100px; padding: 10px 5px; }

input[type=checkbox], input[type=radio], 
input.checkbox, input.radio { 
  position:relative; top:.25em; 
}

fieldset {border: 5px solid #e5e5e5; background: #f2f2f2;-moz-border-radius: 5px; border-radius: 5px; -webkit-border-radius: 5px;}

form.inline { line-height:3; }
form.inline p { margin-bottom:0; }


/* Success, notice and error boxes
-------------------------------------------------------------- */

.error,
.notice, 
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.error a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }


/* Misc classes
-------------------------------------------------------------- */

.left  { float: left;}
.right { float: right;}
.clear { clear: both;}

.clearTop {margin-top: 0;}

.small { font-size: .8em; margin-bottom: 1.875em; line-height: 1.5em; }
.large { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.hide  { display: none; }


/* Page Stylings
-------------------------------------------------------------- */

/* Home */

.tweetarrow {background: url(img/twitter-arrow.png) no-repeat 30px 0;width: 100%; height: 10px;}
.tweet {
	background: #000; 
	color: #e6e6e6;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 20px 20px 40px 20px;
	position: relative;
	margin-bottom: 20px;
	width: 250px;
}
.tweet a.date {position: absolute; right: 30px;bottom: 15px;}

/* Blog */
.flickr_photo {position: relative; padding: 10px 0;border-bottom: 1px solid #000;width:680px;}
.flickr_photo .title, .flickr_photo .description {float: left;}
.flickr_photo .description p {margin-top: 0;}
.flickr_photo .date, .flickr_photo img {float: right;}
.flickr_photo img, #blogThumbs ul li img {border: 1px solid #000;padding: 3px;}
.flickr_photo .description {width: 400px;}

#blogThumbs {margin-top: 10px;}
#blogThumbs ul {list-style: none; margin: 0; padding: 0;}
#blogThumbs ul li {float: left; margin: 0 5px 5px 0;}
#blogThumbs ul li img {width: 55px;height: auto;padding-bottom: 3px;}

/* Work */
.snapshot, .services {margin: 0 10px;float:left; padding: 0 20px;}
.snapshot {background:#E5E5E5;width:400px;height:260px;}
.snapshot p {margin-top: 5px;clear:both;}

#snapShots {margin: 0; list-style: none;padding: 0;height: 100px;}
#snapShots li {float: left;margin: 0 5px 2px 0;}
#snapShots li img.thumb {width: 95px;}
#snapShots li img {border: 0 solid #E5E5E5;}

.services {width:440px;}

.feature, .project {width:220px;float: left;margin: 0 20px 20px 0;border-bottom:  1px solid #ddd;padding-bottom: 10px;}
.feature h3, .project h3 {margin: 0 0 5px 0;padding: 0;}
.feature p, .project p, .snapshot p {color: #666; font-size: 0.95em; line-height: 1.4em;}
.feature a, .project a {color: #000;}

.feature {height: 340px}
.feature .thumbs {margin: 0;padding: 0; list-style: none;height: 200px;}
.feature .thumbs li {float: left;background: #E5E5E5;margin: 0 2px 2px 0;width: 108px;height: 108px;}
.feature .thumbs img.thumb {width: 100px;height: 100px;}
.feature .thumbs img {border: 4px solid #E5E5E5;}
.feature p {padding-top: 10px;clear: both;}

.project {height: 150px;}

/* About */
#aboutphoto img {margin-top:20px;border:10px solid #E5E5E5;}

/* 404 */

#error404 {margin: 30px 0 0 60px;font-size: 1.1em; line-height: 1.75em;}
#error404 span.quote {font-size: 13.875em;padding: 0;line-height: 0.90em;}
#error404 p {width: 620px;}
#error404 span.quote, #error404 p {margin-right: 10px;margin-left: 10px;}

.symbol {font-size: 1.75em;}

/* Structure
-------------------------------------------------------------- */

.container {text-align: left;width: 960px;margin: 0 auto;}

#header {height: 370px;background:url(img/bg.png) repeat-x;padding-top: 10px;}
#header a#home {float: left;}
#header .socialmedia {margin: 0;padding: 0;float:right;height: 16px;}
#header .socialmedia li {display: inline;padding-right:5px;}
#banner {background: url("img/banner-1.jpg") no-repeat 50% 0;height:283px;position:absolute;top:40px;width: 100%;}

#andrea, #pagenotfound {clear: both;}
#andrea {margin: 35px 0 0 25px;padding: 0;}
#pagenotfound {margin: 90px 0 0 20px;}


#nav, #nav a, #nav li {height: 90px;color: #fff;}
#nav {
	margin: 16px 0 0 25px; 
	padding: 16px 0 0; 
	font-family: "Futura", "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 14pt;
	font-weight: 500;
	list-style: none;
	z-index: 10;
	position: relative;
	width: 510px;
	background: url("img/nav_bg.gif") repeat-x;
}
#nav li.active, #nav li:HOVER {background: url(img/arrow.png) no-repeat 50% 42px;}
#nav li {float:left; padding: 0 15px;width:97px;text-align: center;}
#nav a {display: block;margin-top: -4px;}

.socialmedia img {border: 0;}
.socialmedia a {color: #000;}

#content {
	clear: both;
	padding-top: 10px;
	/* Sticky footer - http://ryanfait.com/sticky-footer/ */
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -240px; /* the bottom margin is the negative value of the footer's height */
}
#content .socialmedia {margin: 0;padding: 0;}
#content .socialmedia li {display: inline;padding-right:5px;}


.col { float: left; margin: 0px 0px 0px 20px; padding: 0px; }
.col .col { margin: 0px; }

.one { width: 60px; }
.two { width: 140px; }
.three { width: 220px; }
.four { width: 300px; }
.five { width: 380px; }
.six { width: 460px; }
.seven { width: 540px; }
.eight { width: 620px; }
.nine { width: 700px; }
.ten { width: 780px; }
.eleven { width: 860px; }
.twelve { width: 940px; }


.divider {border-right: 1px solid #000;}

#footer, .push {height: 240px;clear: both;}
#footer, #footer a {color: #fff;}
#footer {background: #000;margin-top: 40px;}

#footer h2 {margin-top: 5px;}
#footer .contact,#footer .approval{float: left;padding: 0 10px;margin: 20px 0;text-align: left;}
#footer .contact {width: 240px;border-right: 1px solid white;height: 170px;}
#footer .contact ul {list-style: none;margin: 0; padding: 0;line-height: 24pt;color: #fff;}
#footer .contact ul li {font-weight: bold;}
#footer .contact ul li a {color: #fff;border-bottom: 1px dashed #fff;padding-bottom: 3px;}
#footer .contact ul li a:hover {border-bottom: 1px solid #fff;text-decoration: none;}
#footer .contact ul li span {font-size: 18pt;display: block; float: left;margin-right: 5px;}
#footer .approval {width: 659px;padding-left: 30px;}

.tagcloud {list-style: none;margin: 0;padding: 0;font-size: 0.85em;}
.tagcloud li {float:left;padding-right: 8px;line-height: 16pt;}

.tagcloud .level1,.tagcloud .level2,.tagcloud .level3 {font-weight: bold;}

.tagcloud .level1 {font-size: 1.5em;}
.tagcloud .level2 {font-size: 1.25em;}
.tagcloud .level3 {font-size: 1em;}

.approval .tagcloud li {line-height: 21pt;}
.approval .tagcloud .level1 {font-size: 2.5em;}
.approval .tagcloud .level2 {font-size: 2em;}
.approval .tagcloud .level3 {font-size: 1.5em;}
.approval .tagcloud .level4 {font-size: 1.25em;}

#copyright {font-size: 7pt;line-height: 0;padding: 15px 0; color: #333;clear: both;background: white;}

/* Extras
-------------------------------------------------------------- */


/**** Tooltips - http://oncemade.com/css-tooltip/# ***/
#header .tooltip span {
  bottom: -35px;
  top: auto;
  padding: 5px 8px;
  background-color: #fff;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  color: #000;
}
#header .tooltip span small {
  top: -6px;
  bottom: auto;
  border-top: 0;
  border-bottom: 6px solid #fff;
}

.tooltip:hover span { display: block; }
.tooltip { position: relative; }
.tooltip span {
  position: absolute;
  right: 0;
  top: -35px;
  display: none;
  min-width: 50px;
  padding: 0 8px;
  white-space: nowrap;
  font-size: 11px;
  text-align: center;
  background-color: rgba(0,0,0,.8);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  color: #fff;
}
.tooltip span small {
  position: absolute;
  right: 10px;
  bottom: -6px;
  border-top: 6px solid rgba(0,0,0,.8);
  border-left: 6px solid transparent;
}

/*
 * jQuery Nivo Zoom v1.0
 * http://nivozoom.dev7studios.com
 *
 * Copyright 2010, Gilbert Pellegrom
 * Free to use and abuse under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * April 2010
 */
 
.nivoZoomHover {
	position:absolute;
	top:0px;
	left:0px;
	z-index:9;
	width:100%;
	height:100%;
	cursor:pointer;
}
.nivoCaption {
	display:none;
	position:absolute;
	z-index:110;
	text-align:center;
	background:#010101;
	color:#fff;
	padding:4px 0;
	overflow:hidden;
}
a.nivoZoom {
	border:0 !important;
}
.nivoZoomHover {
	background:url(img/zoom.png) no-repeat 50% 50%;
}
.nivoZoomHover.loading {
	background:url(img/loading.gif) no-repeat 50% 50%;
	border:4px solid #000;
	width:16px;
	height:16px;
	top:43%;
	left:43%;
	opacity:0.8;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}
a.nivoZoom img.nivoLarge {
	-moz-box-shadow:0px 0px 50px #808080;
	-webkit-box-shadow:0px 0px 50px #808080;
	box-shadow:0px 0px 50px #808080;
}