#topBar{ background-color:#000000; height:25px; padding:1px; }
html, body { height: 100%; }
#content a {color:#000000;}
#content a:hover {background-color:#000000;color:#ffffff; text-decoration:none;}
#content h1 a, #content h2 a {text-decoration:none;}
body {margin:0; padding:0; font:12px Arial, Helvetica, sans-serif; color:#333333;}
body.grunge { background:#DCD7A6 url(images/bg1.jpg) no-repeat scroll center 26px;}
#page { margin:auto; width:937px; background-color:#FFFFFF; height: 100%; }
#titleBar { height:60px; background:url(images/page-title-bg.gif) repeat-x; position:relative; }
#titleBar h1 { background:#000000; font-size:24px; color:#FFFFFF; position:absolute; top:15px; margin:0; left:40px; height:25px; padding:10px; }
#titleBar #pageDescription { right:20px; top:40px; position:absolute; font-size:14px; }
#splash{ height:613px; overflow:hidden; position:relative;  }
#splash #splashImg { width:937px; position:absolute; z-index:1; }
#splash #logo { width:109px; height:159px; position:absolute; z-index:2; display:block; left:40px; top:8px;}
* html #logo  /* for Old IE */  { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/adam-coulombe-logo.png'); }
* > #logo /* for Good Browsers */ { background-image:url(images/adam-coulombe-logo.png); }
#splash #logo strong { display:none; }
#splash #headerNavLeft { position:absolute;  z-index:2; padding:0; margin:0; list-style:none; left:40px; top:207px; width:162px; }
#splash #headerNavLeft li { height:34px; float:left; margin-bottom:6px;}
#splash #headerNavLeft li a { height:34px; display:block; text-indent:-9999px;}
#splash #headerNavLeft li .photo { width:126px; background-image:url(images/headernav_photo.gif)}
#splash #headerNavLeft li .iphone { width:121px; background-image:url(images/headernav_iphone.gif)}
#splash #headerNavLeft li .graphic { width:141px; background-image:url(images/headernav_graphic.gif)}
#splash #headerNavLeft li .branding { width:162px; background-image:url(images/headernav_branding.gif)}
#splash #headerNavLeft li .code { width:94px; background-image:url(images/headernav_code.gif)}
#splash #headerNavRight { position:absolute; z-index:2; padding:0; margin:0; list-style:none; right:0px; top:207px; width:89px; }
#splash #headerNavRight li { height:20px; float:left; margin-bottom:6px;}
#splash #headerNavRight li a { height:20px; display:block; text-indent:-9999px;}
#splash #headerNavRight .contact { width:162px;width:89px; background-image:url(images/headernav_contact.gif)}
#splash #headerNavRight .resume { width:162px;width:75px; background-image:url(images/headernav_resume.gif)}
#content { padding:20px 40px 40px; background-color:#FFFFFF; }
#content:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#content { display: inline-block; _height: 1%; }
#content { display: block; }
#content h2 { font-size:22px; font-weight:normal; margin:10px 0 }
#content .col1{width:273px;padding-right:10px;}
#content .col2{width:273px;padding-left:5px;padding-right:5px;}
#content .col3{width:273px;padding-left:10px;}
#content .twoCols1{width:567px;margin-right:5px; }
#content  p { line-height:20px; }
#footer { height:270px; background-color:#000000; color:#515050; }
#footerLeft { width:558px; float:left; padding:20px 20px 20px 40px; }
#footerRight {width:273px; float:left; padding:20px; }
#footer dl.about { padding:10px 0 0; margin:0; } 
#footer dl.about dd, #footer dl.about dt { padding:0; margin:0; }
#footer dl.about dd { width:68px; height:15px; text-indent:-9999px; background:url(images/footer-about.gif) no-repeat; }
#footer dl.about dt { line-height:20px; padding:10px 0; }
#footerSepVert { height:200px; width:1px; float:left; background:url(images/dots_bk.gif) repeat-y; overflow:hidden; margin-top:19px; padding-top:1px; }
#footerSepHoriz { height:1px; background:url(images/dots_bk.gif) repeat-x; overflow:hidden; }
#footerNav { height:50px; overflow:hidden; margin:0px; padding:0px; list-style:none;}
#footerNav li { height:40px; overflow:hidden; margin:0px; padding:0px; list-style:none; display:block; float:left; }
#footerNav li a {  display:block; float:left; height:40px; text-indent:-9999px;  }
#footerNav li a:hover {  opacity:.60; -moz-opacity:.60; filter:alpha(opacity=60); -webkit-opacity:.60;}
#footerNav li a.photo { background:url(images/footer-photo.gif) 0 13px no-repeat; width:70px; }
#footerNav li a.code { background:url(images/footer-code.gif) 0 13px no-repeat; width:63px; }
#footerNav li a.branding { background:url(images/footer-branding.gif) 0 13px no-repeat; width:100px; }
#footerNav li a.graphic { background:url(images/footer-graphic.gif) 0 13px no-repeat; width:88px; }
#footerNav li a.iphone { background:url(images/footer-iphone.gif) 0 13px no-repeat; width:78px; }
#footerNav li a.contact { background:url(images/footer-contact.gif) 0 13px no-repeat; width:68px; }
#footerNav li a.resume { background:url(images/footer-resume.gif) 0 13px no-repeat; width:81px; }
.oneThird {width:273px;}
#footer #footerPhotoStream h3 {background-color:#333333; color:#FFFFFF; font-size:18px; font-weight:bold; opacity:0.9; -moz-opacity:0.9; filter:alpha(opacity=90); position:absolute; margin:0 0 0 20px; padding:2px 5px 2px 5px; }
#footer #footerPhotoStream ul{ list-style:none; margin:0; padding:0 0 0 20px;}
#footer #footerPhotoStream ul li { float:left; list-style:none; margin:0; padding:0;}
#footer #footerPhotoStream ul li a { display:block; float:left; background-image:url(images/placeholder-thumb.gif); width:75px; height:75px;}
#footer #footerCodeStream h3 {background-color:#1b1b1b; color:#FFFFFF;  position:absolute; font-size:18px; font-weight:bold;; margin:0 0 0 20px; padding:2px 5px 2px 5px; }
#footer #footerCodeStream ul { list-style:none; margin:0; padding:35px 0 0 20px;}
 #footer #footerCodeStream ul li { background:url(images/footer-codelist-item-bg.gif) repeat-y; padding:0 0 0 11px; line-height:19px;  margin:7px 0;}
 #footer #footerCodeStream ul li a{ background-color:#1b1b1b; color:#FFFFFF; text-decoration:none; display:inline; padding:2px 5px 2px 0; }
#footer #endorsements { width:250px; margin:auto; }
#endorsements a { display:block; float:left; text-indent:-9999px; }
#endorsements .snipplr {width:85px;height:43px; background:url(images/snipplr.gif) no-repeat; }
#endorsements .flickr { width:86px;height:43px; background:url(images/flickr.gif) no-repeat; }
#endorsements .php { width:78px;height:43px; background:url(images/php.gif) no-repeat; }
#endorsements .jquery { width:110px;height:34px; background:url(images/jquery.gif) no-repeat; }
#endorsements .wordpress { width:139px;height:34px; background:url(images/wordpress.gif) no-repeat; }
#endorsements .snipplr:hover { background:url(images/snipplr_on.gif) no-repeat; }
#endorsements .flickr:hover {  background:url(images/flickr_on.gif) no-repeat; }
#endorsements .php:hover {background:url(images/php_on.gif) no-repeat; }
#endorsements .jquery:hover {background:url(images/jquery_on.gif) no-repeat; }
#endorsements .wordpress:hover { background:url(images/wordpress_on.gif) no-repeat; }
ul#codeList { list-style:none; margin:0; padding:0; width:567px; }
ul#codeList li { background:transparent url(images/dots-hr_wt.gif) repeat-x scroll 0 bottom;
margin:0;
padding:15px 0 35px;}
ul#codeList li.first{ padding-top:0px;}
ul#codeList .preWrap { background:url(images/codebg.gif) no-repeat #e6e6e6; height:100px; width:497px; padding:10px 0 0 70px; overflow:hidden; position:relative; }
ul#codeList pre { color:#7f7f7f; }
ul#codeList .preWrap a.showCode {position:absolute; display:block; background:url(images/code-show.gif) no-repeat; width:607px; text-indent:-9999px; height:26px; bottom:0px; left:0px; opacity:0.8; -moz-opacity:0.8; filter:alpha(opacity=80);}
ul#codeList .preWrap a.showCode:hover {opacity:1; -moz-opacity:1; filter:alpha(opacity=100);}
ul#codeLanguages { list-style:none; margin:0; padding:0; }
ul#codeLanguages li { margin:0; padding:0; float:left; }
ul#codeLanguages li a { display:block; margin:0 10px 5px 0; padding:1px 5px; float:left; background-color:#000; color:#FFFFFF; text-decoration:none; font-size:18px; }
ul#codeLanguages li a:hover { text-decoration:underline; background:none; color:#000000 }
#feed { width: 849px; list-style-type:none; padding:0; margin:0; background-image:url(/images/feedbg.gif) }
#feed:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#feed{ display: inline-block; _height: 1%; }
#feed{ display: block; }
#feed li { width: 283px; height:283px; margin:0; padding:0; float:left; }
#feed li a { width:160px; height:240px; padding:5px; display:block; background-color:#CCCCCC; text-decoration:none; margin:auto; position:relative;  }
#feed li a:hover{background-color:#aeaeae;}
#feed li a span { display:block; position:absolute;color:#FFF; background-color:#000000; display:block; display:none; padding:10px; opacity:0.85; -moz-opacity:0.85; filter:alpha(opacity=85);  }

#feed li a span strong { font:18px Arial, Helvetica, sans-serif; }
#contact-area {
	width:567px;margin-right:5px;
	margin-top: 25px;
}
#contact-area:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#contact-area { display: inline-block; _height: 1%; }
#contact-area { display: block; }

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 437px;
	font-family: Helvetica, sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
}

#contact-area textarea {
	height: 90px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #000;
}

#contact-area input.submit-button {
	width: 75px;
	float: right;
}

#contact-area label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 1.4em;
}
#contact-area .response { background-color:#000000; color:#FFFFFF; display:none; padding:5px; text-align:center; margin-bottom:15px; font-size: 1.4em; }
.left {float:left}
#imOnline { width:119px; height:33px; padding:25px 0 0 28px; display:block; color:#727272; text-decoration:none; font:12px Arial, Helvetica, sans-serif; position:absolute; right:10px;  }		
* html #imOnline   /* for Old IE */  { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/im-online.png'); }
* > #imOnline  /* for Good Browsers */ { background:url(images/im-online.png) no-repeat;  }