* { 
margin: 0; 
padding: 0;
border: 0;
}

body {
font-family: "Helvetica Neue", Helvetica, Arial, Sans-Serif; 
font-size: 12px;
background-color: #000;
height:100%;
overflow: hidden;
}

/* =Clearfix (all browsers)--------------------------------*/
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
/* IE6 */ * html .clearfix {height: 1%;}
/* IE7 */*:first-child+html .clearfix {min-height: 1px;}

#blog {
overflow-y:visible;
}

.pane {
text-align: left;
position: absolute;
}
 
h1, h2 { 
color: #395262;
font-family: "gesta-1", "gesta-2", "Helvetica Neue", Helvetica, Arial, Sans-Serif;
font-size: 27px;
font-weight:normal;
margin: 25px 0 15px 20px;
}

h1 {
text-transform: uppercase;
}

h3, h4 {
font-family: "gesta-1","gesta-2", "Helvetica Neue", Helvetica, Arial, Sans-Serif;
}

h3, .textAreaLeft h3 a {
color: #C82F7B;
font-size: 21px;
line-height: 20px;
margin: 20px;
font-weight:normal;
}

.textAreaLeft h3 a {
margin-left:0;
}

h4 {
color: #000;
font-size: 18px;
margin: 18px 0 0 20px;
font-weight:normal;
}

#content2 h1, #content2 h2 {
color:#3FA9F5;
}

#content3 h1, #content3 h2 {
color:#21942f;
}

#content4 h1, #content4 h2 {
color:#C82F7B;
}

em {
color: #333;
font-weight: bold;
font-style: normal;
}

img, img a {
border: 0;
border-bottom: 0;
}

.backimage {
position: absolute;
width: 100%;
}

.backimageFixed {
width: 100%;
position: fixed;
}

.greyText {
color: #999;
}

/* background image positioning */

#holder{position:absolute;width:200%;height:200%;top:-50%;left:-50%}
#holder[id]{display:table}
#holder div{position:absolute;left:0;top:50%}
#holder[id] div{display:table-cell;vertical-align:middle;position:static}
#holder img{position:relative;top:-50%;margin:0 auto;display:block;-ms-interpolation-mode:bicubic;width:100%}
*:first-child+html #holder div{position:absolute}/*force IE 7 back to position:absoulte*/

/* text, image containers */

.textArea {
position: relative;
padding: 14px 260px 1px 115px;
}

.textAreaLeft {
position: relative;
float: left;
width:445px;
padding: 14px 0px 1px 115px;
}

.textAreaRight {
position: relative;
float: right;
width:340px;
padding: 14px 70px 1px 0px;
}

.artAreaLeft {
position: relative;
float: left;
width:380px;
padding:0px 0px 1px 115px;
}

.artAreaRight {
position: relative;
float: right;
width:380px;
padding:0px 75px 1px 40px;
}

.textArea ul, .textAreaRight ul {
list-style-type: none;
list-style-position: outside;
color: #333;
font-size: 12px;
line-height: 18px;
margin: 0 165px 20px 20px;
padding: 0;
}

.textAreaLeft ul li, .textAreaRight ul li {
padding-bottom: 10px;
}

.textAreaLeft ul {
margin-left:35px;
line-height:18px;
} 

ul.nav_categories li {
padding-bottom:3px;
}

#tweets {
position: relative;
float: right;
width:155px;
}

#tweets h2 {
margin-left: 0;
margin-right: 0;
}

#tweets ul {
list-style: none;
margin:15px 0 20px 0;
font-size: 11px;
line-height:15px;
}

#tweets ul li {
padding-bottom: 10px;
}
#tweets ul li a {
font-style: italic;
}

.tweet_time {
color:#3FA9F5;
font-style:normal;
}

.artAreaLeft h2,.artAreaRight h2 {
margin-top: 0;
}

.textArea ol {
list-style-position: inside;
color: #333;
font-size: 16px;
line-height: 28px;
margin-bottom: 28px;
}

.textArea p, .textAreaLeft p, .textAreaRight p, .artAreaLeft p, .artAreaRight p {
color: #333;
font-size: 13px;
line-height: 18px;
margin: 10px 0 15px 20px;
}

.textAreaLeft p.small {
font-size: 11px;
color:#666;
font-weight: bold;
margin-bottom:30px;
}

.textAreaLeft a.tag {
margin: 0 2px;
border-bottom:none;
}

.textAreaLeft a.tag:hover {
border-bottom: 1px solid #3FA9F5;
}

.textAreaRight a {
font-weight: bold;
}

p.large {
color:#575757;
font-size: 17px;
line-height: 26px;
margin-bottom: 20px;
}

.textAreaLeft p.firstLine, .textAreaRight p.firstLine {
margin-top: -1px;
padding-top: 0;
}

.hiddenFields {
display:none;
}

/* Folio Image Thumbnails */

.thumb, a.thumb, a.thumbright, a.thumb:visited, a.thumbright:visited {
display: block;
border: 5px solid #fff;
padding:0;
height:70px;
background-color: #fff;
}

a.thumb {
margin:0 0 20px 20px;
}

.thumb {
margin:0 20px 20px 20px;
}

.thumb, a.thumb {
float: left;
}

.thumbright, a.thumbright {
float: right;
margin:0 0 10px 10px;
}

a.featured, a.featured:visited {
display: block;
position: relative;
border: 5px solid #fff;
margin:0 0 15px 20px;
padding: 0;
height: 202px;
}

.thumbimage {
background-color: #fff;
background-color: rgba(255,255,255,1.5);
}

a.thumb:hover, a.thumbright:hover, a.featured:hover {
border-width: 5px;
border-style: solid;
padding: 0;
}

#content2 a.thumb:hover, #content2 a.thumbright:hover {
border-color: #3FA9F5;
}

#content3 a.thumb:hover, #content3 a.featured:hover {
border-color: #21942f;
}

#content4 a.thumb:hover {
border-color: #C82F7B;
}

.alignRight, a.alignRight {
float: right;
padding-left: 6px;
padding-top: -4px;
border-bottom: none;
}

.thumbprofile {
float:left;
display: block;
border: 5px solid #fff;
padding:0;
height:70px;
background-color: #fff;
margin:3px 13px 0 20px;
}

/* Twitter, etc logos */

.linkedin a, .twitter a {
float: left;
display: block;
width: 113px;
height: 35px;
border: 0;
margin-left: 20px;
}

.linkedin a {
background: transparent url(../images/logo_linkedin.png) top left no-repeat;
}

.twitter a {
background: transparent url(../images/logo_twitter.png) top left no-repeat;
}

.applecert a {
float: left;
display: block;
width: 145px;
height: 35px;
border: 0;
margin-left: 20px;
margin-bottom: 30px;
background: transparent url(../images/logo_applecertpro.png) top left no-repeat;
}

.linkedin a:hover, .twitter a:hover, .applecert a:hover {
border-bottom: 0;
background-position: bottom left;
}

.linkedin a:visited, .twitter a:visited, .applecert a:visited {
border-bottom: 0;
}

/* blog + news dates */

.dateBox {
float: left;
width:46px;
height: 45px;
margin: 4px 13px 0px 20px;
padding: 9px 6px 3px 6px;
background-color: #fff;
text-align: center;
color: #999;
}

.day {
font-size: 23px;
line-height: 23px;
color:#3FA9F5;
}

.month, .year {
font-size: 11px;
line-height: 9px;
text-transform:uppercase;
}

#blogwrapper ul {
list-style:none;
margin-left: 20px;
}

/* Blog Images, File Links */

.blogfileimage, .blogfileimage a {
float:right;
background-color:#ccc;
padding:6px;
border:0;
text-decoration:none;
margin:0 0 4px 3px;
font-weight:normal;
}

.blogimagefile a:hover {
border-bottom:none;
}

/* Blog Comments */

.commenticon {
float: left;
width: 44px;
height: 44px;
background-color: #333;
margin: 0 0 0 20px;
border:3px solid #fff;
}

.comments {
float: right;
width:339px;
background:transparent url(../images/commentbase.png) top left no-repeat;
margin: 0;
padding: 14px 18px 16px 18px;
}

.comments p {
font-size: 11px;
font-style: italic;
padding-left: 16px;
margin: 0;
}

p.commentname {
font-weight: bold;
text-transform: uppercase;
font-style: normal;
padding-bottom: 6px;
}

.commentname a {
color:#C82F7B;
}

.commentdate {
font-weight: normal;
text-transform: none;
}

/* Contact panel icons */

.icons, a.icons {
display: block;
position: relative;
float: left;
border: 2px solid #ccc;
margin:0 0 6px 6px;
height: 44px;
padding-bottom: 0;
}

a.icons:hover {
border-width: 2px;
border-style: solid;
border-color: #666;
padding-bottom: 0;
}

a.icons:visited {
border-width: 2px;
border-style: solid;
border-color: #ccc;
padding-bottom: 0;
}

a.icons:hover.pink {
border-color: #C82F7B;
}

a.icons:hover.blue {
border-color: #3FA9F5;
}

a.icons:hover.green {
border-color: #21942f;
}

/* film panel mini icons */

#content2 .vimeo, #content2 .vimeo a, #content2 .vimeo a:hover, #content2 .vimeo a:visited, 
#content2 .xr, #content2 .xr a, #content2 .xr a:hover, #content2 .xr a:visited  {
height: 15px;
padding-bottom: 0;
margin-bottom: -1px;
border-bottom: 0px none;
border: 0;
}

.vimeo {
width:66px;
}

.xr {
width:121px;
}

/* navigation */

#nav {
position: fixed;
top: 148px;
left: 0;
margin-left: 35px;
z-index: 50;
}

#nav ul {
list-style: none;
}

#nav li {
margin-bottom: 20px;
padding: 0
}

#nav li.webdev a:hover,
#nav li.webdev.selected a,
#nav li.film a:hover,
#nav li.film.selected a,
#nav li.art a:hover,
#nav li.art.selected a,
#nav li.general a:hover,
#nav li.general.selected a {
background-position: 0 0;
}

#nav li.webdev a:hover,
#nav li.webdev.selected a,
#nav li.film a:hover,
#nav li.film.selected a,
#nav li.art a:hover,
#nav li.art.selected a,
#nav li.general a:hover,
#nav li.general.selected a {
color: #000;
}

#nav li.webdev a {
background:transparent url(../images/navbase_green.png) -245px 0px no-repeat;
}

#nav li.film a {
background:transparent url(../images/navbase_blue.png) -245px 0px no-repeat;
}

#nav li.art a {
background:transparent url(../images/navbase_pink.png) -245px 0px no-repeat;
}

#nav li.general a {
background:transparent url(../images/navbase.png) -245px 0px no-repeat;
}

#nav a {
display: block;
color: #fff;
text-decoration: none;
font-size: 15px;
line-height: 33px;
font-weight: bold;
width:222px;
height: 33px;
padding-left:22px;
border-bottom: none;
text-decoration: none;
}

/* pseudo classes */

a {
color: #000;
text-decoration: none;
font-weight: bold;
border-bottom: none;
}

a:hover {
color: #d22758;
border-bottom: 1px solid #3FA9F5;
}

/* a:visited {
border-bottom: none;
} */

.clearfloat {
clear:both; 
height:0; 
overflow:hidden;
margin:0;
}

/* layout divs */

#logo {
position: fixed;
top: 30px;
left: 0;
width: 280px;
height: 101px;
background: url('../images/logo.png');
z-index: 100;
text-indent: -20000px;
}

#wrapper {
overflow: hidden;  
width: 100%;
height: 100%;
margin-left: 192px;
position: absolute;
top: 0;
left: 0;
z-index: 40;
}

#blogwrapper {
position: absolute;
width: 100%;
margin-left: 192px;
top: 0;
left: 0;
}
 
#inner-graphics {
position: relative;
height: 22000px;
}
  
#content1, #content2, #content3, #content4, #content5, #content6, #end {
position: absolute;
width:990px;
background-color: #fff;
background-color: rgba(255,255,255,0.9);
filter:alpha(opacity=90);
padding-bottom: 20px;
}

#content1 {
top:129px;
}
 
#content2 {
top: 2000px;
}
 
#content3 {
top: 4000px;
}
 
#content4 {
top: 6000px;
}

#content5 {
top: 8000px;
}

#content6 {
top: 10000px;
}

#end {
top: 12000px;
}

.thumbsRight {
float: right;
width: 200px;
margin-top: 5px;
}

.rss {
margin-left: 20px;
border-bottom: 0;
}

.shareThis {
height: 20px;
margin-left: 17px;
border-bottom: none;
}

.shareThis a:link, .shareThis a:visited, .shareThis a:hover, .rss a:link, .rss a:hover, .rss a:visited {
border-bottom: 0;
}

/* footer */

#footer {
position: absolute;
bottom: 0;
right: 0;
width: 472px;
height: 85px;
background: transparent url('../images/footerbase.png') top right no-repeat;
z-index:30;
}

#blogfooter {
position: relative;
float: right;
width:872px;
height:85px;
background: transparent url('../images/footerbase.png') top right no-repeat;
}

#footer p, #blogfooter p {
font: 9px/12px Helvetica, Arial, sans-serif;
text-align: left;
color: #a7a7a7;
margin-top:31px;
}

#footer a, #blogfooter a {
border-bottom: 0;
color:#ccc;
}

#footer a:hover, #blogfooter a:hover {
color:#3fa9f5;
}

#footer p.alignleft, #blogfooter p.alignleft {
float: left;
width:300px;
text-align: right;
}

#blogfooter p.alignleft {
margin-left: 401px;
}

#footer p.alignright, #blogfooter p.alignright {
float: right;
width:127px;
}

/* HCard microformat */

#hcard-Nick-Foxall {
margin:0 0 0 20px;
float: left;
width:145px;
}

#connectIcons {
float: right;
width: 170px;
margin: 0;
}
.vcard, .fn, .org, .email, .adr {
padding-bottom: 6px;
}

/* Form Elements */

fieldset {
margin-left: 20px;
}

label {
float: left;
text-align: left;
width: 78px;
padding: 10px 0 0 0;
font-size: 12px;
line-height: 12px;
}

label.comment {
width:85px;
}

label.commentoption {
float: none;
}

input, textarea {
border:3px solid #CCC;
background-color:#fff;
filter:alpha(opacity=100);
padding:5px;
color:#666;
margin:2px 0 10px 0;
font: 12px Helvetica, Arial, sans-serif;
width:220px;
}

input.comment, textarea.comment {
width:323px;
}

.areaselect {
border: 1px solid #ccc;
padding:3px;
width:190px;
margin:2px 0 10px 0;
font: 12px Helvetica, Arial, sans-serif;
color:#666;
}

input:focus, textarea:focus {
  border-color: #3FA9F5;
}

.captchaset {
height:30px;
margin-bottom: 8px;
margin-top: 8px;
}

input.checkbox {
width:25px;
margin:7px 0 7px 80px;
border:none;
background:transparent;
}

input.submit {
display:block;
float: right;
margin-right: 8px;
margin-top: 2px;
background:transparent url(../images/btnbase.png) no-repeat center top;
border:none;
color:#fff;
font:normal 12px Helvetica, Arial, sans-serif;
cursor: pointer;
line-height:18px;
height:32px;
width:234px;
}

input.submit.comment {
display:block;
float: left;
margin-left: 85px;
}
