/** Digitaloop CSS - By Nick Lee **/

/** General **/

body { font-size: 75%; font-family: 'Lucida Grande','Lucida Sans Unicode','Verdana',sans-serif; color: #ccc; line-height: 1.2; margin: 0px; padding: 0px; background: #fff; border-top: 3px solid #8ebe39; }

p { margin: 5px 0px 10px 0px;}

ul { padding: 0; margin: 0; font-size: 0.9em; }
li { padding: 0 0 0 6px; width: 134px; margin: 0 20px 0 0; list-style-image: none; list-style-type: none; line-height: 1.8em; background: url(../display_images/bullet.gif) no-repeat 0 7px; float: left; letter-spacing: -0.01em; }
li a, #introduction a { padding: 2px; }
li a:hover, #introduction a:hover { background: #8ebe39; }

a, a:link, a:active, a:visited { color: #4f9ec6; text-decoration: none; }
a:hover { color: #ffffff; }

img { border: none; }

h1, h2, h3 { font-family: 'Lucida Grande','Lucida Sans Unicode',Verdana,sans-serif; margin: 0; padding: 0; font-weight: normal; }
h1 { font-size: 2.5em; color: #fff; }
h2 { font-size: 1.8em; padding: 0 0 7px 0; margin: 0 0 10px 0; color: #222; line-height: 1em; background: url(../display_images/dotted_line.gif) repeat-x bottom left; }

h1 { background: url(../display_images/nick_lee.gif) no-repeat; text-indent: 1100px; overflow: hidden; height: 23px; width: 126px; }

/** Layout **/

#container { position: relative; margin: 0 auto;  background: #1b1b1f; }
#header { width: 960px; margin: 0 auto 20px auto; padding: 55px 0 0 0; background: #1b1b1f; }
#footer { background: #fff; padding: 20px 0 30px 0; margin: 40px 0 0 0; font-size: 0.9em; width: 100%; color: #777; }
#footer #contact { float: right; margin: 0 20px 0 0; }
#footer a:hover { color: #222; }

.inner-container { width: 960px; margin: 0 auto; overflow: hidden; }
.header { float: left; width: 140px; margin: 0 20px 0 0; }
.content { float: left; width: 800px; margin: 0; }

#introduction { border-top: 1px solid #4c4c57; color: #ccc; font-size: 1.3em; line-height: 1.6em; padding: 25px 0 0 0; letter-spacing: -0.01em; background: url(../display_images/bg_intro.gif) repeat-x; }
#introduction p { margin: 0; padding: 0; }

#work { position: relative; background: url(../display_images/bg_mainstage.jpg) repeat-x scroll; height: 210px; overflow: hidden; margin: 25px 0 0 0; text-align: left; }
#work-header { position: absolute; top: 30px; }
.work-item { margin: 0 0 0 160px; position: relative; clear: both; height: 210px; }
.work-info { float: left; padding: 15px 14px; background: #fff; width: 210px; border: 1px solid #d2d2e1; color: #777; margin: 30px 50px 0 0; }
.work-image { float: left; margin: 10px 0 0 0; }
.work-info p { margin: 0 0 10px 0; }
.work-info a { font-style: italic; font-family: Georgia,'Times New Roman',sans-serif; letter-spacing: -0.01em; }

.arrow-prev { position: absolute; left: -30px; top: 93px; width: 11px; height: 21px; background: url(../display_images/arrow_prev.gif) no-repeat top left; }
.arrow-next { position: absolute; left: 745px; top: 93px; width: 11px; height: 21px; background: url(../display_images/arrow_next.gif) no-repeat top left; } 
.arrow-prev:hover, .arrow-next:hover { background-position: bottom left; }
.arrow-prev a, .arrow-next a { padding: 7px 5px; outline: none; }

#previous-projects { border-top: 1px solid #4c4c57; padding: 20px 0 0 0; }

#other { border-top: 1px solid #4c4c57; margin: 25px 0 0 0; padding: 25px 0 0 0; }
#photography { float: left; height: 81px;}
#photography-header, #friends-header { float: left; width: 140px; margin: 0 20px 0 0; }
#photography img { background: #f8f8f8; padding: 2px; border: 2px solid #1c1612; }
#photography img:hover { background: #8ebe39; border: 2px solid #8ebe39; }
#photography-content { float: left; width: 300px; }
#photography-header img, #photography-header img:hover { background: none; border: none; }
.flickr_badge_image { width: 75px; height: 75px; float: left; margin: 0 26px 0 0; }
#flickr_badge_image3 { margin: 0 !important; }
#friends-content { float: left; width: 320px !important; overflow: hidden; }
#friends-content .delicious-posts ul { padding: 0; margin: 0; }

.clear { display: block; height: 1px; clear: both; overflow: hidden; }
img.full { position: relative; top: -9px; }
#loading { background:url(../display_images/loading.gif) center top no-repeat; }

/* sIFR */

/* These are standard sIFR styles... do not modify */
.sIFR-flash { visibility: visible !important; margin: 0; }
.sIFR-replaced { visibility: visible !important; }
span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden;}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] { display: none !important; }

.sIFR-hasFlash h2 { visibility: hidden; font-size: 24px; }

/*delicious*/
.delicious-banner { display: none; }


/* Thickbox */

#TB_overlay { position: fixed; z-index:100; top: 0px; left: 0px; height:100%; width:100%; }

.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG { background-color:#000; filter:alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; }

* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_window { position: fixed; background: #ffffff; z-index: 102; color:#000000; display:none; border: 4px solid #525252; text-align:left; top:50%; left:50%; }

* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
}

#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
}

#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
}

#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
}

#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
}

#TB_title{
	background-color:#e8e8e8;
	height:27px;
	display: none;
}

#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#TB_ajaxContent.TB_modal{
	padding:15px;
}

#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
}

#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}

* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

#TB_HideSelect { z-index:99; position:fixed; top: 0; left: 0; background-color:#fff; border:none; filter:alpha(opacity=0); -moz-opacity: 0; opacity: 0; height:100%; width:100%; }

* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#TB_iframeContent{ clear:both; border:none; margin-bottom:-1px; margin-top:1px; _margin-bottom:1px; }