body {margin:0; padding:0; background:#04223d; font:12px Georgia, Times, serif; color:#525252}

#main {background:url(http://img3.turbomilk.com/i/v3/v/main.png) no-repeat 39% 0 #04223d; overflow:hidden}

#intro {min-width:1000px; margin-bottom:25px}
#intro p {font-size:2.05em; letter-spacing:0.01em; line-height:1.35em; color:#ade1fe; margin-top:15px; margin-bottom:0; text-shadow:0px 1px 0px #000; filter:dropshadow(color=#000000, offx=0, offy=1)}
#intro a {color:#fff; text-decoration:none; display:inline-block; position:relative}
#intro a strong {font-weight:normal; display:inline-block; position:relative; z-index:2}
#intro a span {display:none; width:100%; height:1.2em; position:absolute; top:0.2em; left:0; z-index:1; background:#fff; opacity:0.2; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); filter: alpha(opacity=20)}
#intro a:hover span {display:block}

.works div {float:left; padding:10px}
.works h3 {font-size:1.4em; margin:10px 0 2px; overflow:hidden}
.works h3 a {color:#000; text-decoration:none}
.works p {font:1.2em Georgia, Times, serif; color:#6a6a6a; margin:0}
.works p small {display:block; font-family:Segoe, arial, sans-serif; font-size:0.7em}
.works p small a {color:#3b709d; text-decoration:none}

#portfolio {min-width:1000px; margin-bottom:40px; font-family:Segoe, arial, sans-serif}

#portfolio .controls {width:640px; position:relative}
#portfolio .controls ul {list-style:none; margin:0; padding:0; overflow:hidden; font-size:1.1em}
#portfolio .controls ul li {float:left; position:relative; overflow:hidden; margin:0 2px 0 0; padding:0; border-top:1px solid rgba(223, 239, 247, 0.6); -moz-border-radius:4px 4px 0px 0px; -webkit-border-radius:4px 4px 0px 0px; border-radius:4px 4px 0px 0px}
#portfolio .controls ul li span {display:block; width:100%; height:100%; position:absolute; top:-1px; left:0; z-index:1; background:#dfeff7; border-top:1px solid #dfeff7; opacity:0.4; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); filter: alpha(opacity=40); -moz-border-radius:4px 4px 0px 0px; -webkit-border-radius:4px 4px 0px 0px; border-radius:4px 4px 0px 0px}
#portfolio .controls ul li a {display:block; position:relative; z-index:2; padding:4px 11px 3px; color:#dfeff7; text-decoration:none; text-shadow:0px 1px 0px #5e768a; filter:dropshadow(color=#5e768a, offx=0, offy=1)}
#portfolio .controls ul li.selected {border-top:1px solid #fff}
#portfolio .controls ul li.selected span {background:#fff; border-top:1px solid #fff;  opacity:1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); filter: alpha(opacity=100)}
#portfolio .controls ul li.selected a {color:#000; text-shadow:none; filter:none}
#portfolio .controls .more {display:block; position:absolute; top:5px; right:0; padding:0 12px 0 0; color:#dfeff7; background:url(http://img3.turbomilk.com/i/v3/p/more.png) no-repeat 100% 50%; font-size:0.95em; text-decoration:none; text-shadow:0px 1px 0px #254562; filter:dropshadow(color=#254562, offx=0, offy=1)}

#portfolio .contents {
	width:640px;
	height:650px;
	background:#fff;
	position:relative;
	overflow:hidden;
	border-bottom:1px solid rgba(170, 170, 170, 0.3);
	#-moz-box-shadow:1px 0px 1px 1px rgba(170, 170, 170, 0.3);
	#-webkit-box-shadow:1px 0px 1px 1px rgba(170, 170, 170, 0.3);
	#box-shadow:1px 0px 1px 1px rgba(170, 170, 170, 0.3);
}

#portfolio .mask {
	width:100%;
	height:30px;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	border-top:4px solid #fff;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,1.0)), to(rgba(255,255,255,0)), color-stop(0.3, rgba(255,255,255,1)));
	background-image: -moz-linear-gradient(rgba(255, 255, 255, 1.0) 20%, rgba(255, 255, 255, 0) 95%);
	background-image: -o-linear-gradient(rgba(255, 255, 255, 1.0) 20%, rgba(255, 255, 255, 0) 95%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#00ffffff);
	-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#00ffffff);
}

#portfolio .scroller {width:8px; height:100%; position:absolute; top:0; right:0; z-index:3; background:#e7ebee}
#portfolio .scroller .knob {width:8px; height:220px; position:absolute; top:0; left:0; background:#bcc6cf}
#portfolio .scroller .knob .top, #portfolio .scroller .knob .bottom {width:8px; height:15px; position:absolute; left:0; cursor:pointer}
#portfolio .scroller .knob .top {top:0; background:url(http://img3.turbomilk.com/i/v3/p/scroll_top.gif) no-repeat 1px 4px}
#portfolio .scroller .knob .bottom {bottom:0; background:url(http://img3.turbomilk.com/i/v3/p/scroll_bottom.gif) no-repeat 1px 4px}

#portfolio .works {overflow:hidden; position:absolute; top:0; left:0; padding-bottom:20px}
#portfolio .works div {width:250px; min-height:310px; float:left; padding:10px; margin:20px 0 0 30px}

#blog {
	min-width:1000px;
	min-height:428px;
	position:relative;
	z-index:2;
	background-image:url(http://img3.turbomilk.com/i/v3/bg/blog_t.png), url(http://img3.turbomilk.com/i/v3/bg/blog_b.png), url(http://img3.turbomilk.com/i/v3/bg/blog_m.png);
	background-repeat:repeat-x, repeat-x, repeat;
	background-position: 0 0, 0 100%, 0 0;
	background-color:#f8efc9;
	padding-bottom:1px;
}
#blog .section {min-height:428px; overflow:hidden; position:relative; z-index:2; margin-bottom:50px}
#blog a {text-decoration:none}
#blog .column {width:30%; float:left; margin-left:5%}

#blog h3 {font-size:2.8em; margin:12px 0 14px; font-weight:normal; color:#575033; text-shadow:0px 1px 0px #f7eeca}
#blog h3 a {color:#575033}

#blog .author {font:0.9em Georgia, Times, serif; margin:2px 0 21px; color:#a3966b}
#blog .author a {display:inline-block; margin-left:5px; padding-left:14px; background:url(http://img3.turbomilk.com/i/v3/p/comments.png) no-repeat 0 50%; color:#a3966b}

#blog .rss {display:inline-block; width:14px; height:15px; margin:0 0 -1px 6px; background:url(http://img3.turbomilk.com/i/v3/p/rss.png) no-repeat 0 0}
#blog .rss span {display:none}

#blog .portfolio {margin-left:0}
#blog .portfolio ul {font-size:1.2em; list-style:none; margin:0; padding:0}
#blog .portfolio ul li {position:relative; margin:12px 0; padding:0 0 0 59px; overflow:hidden; text-shadow:0px 1px 0px #f7eeca}
#blog .portfolio ul li a {color:#716539}
#blog .portfolio a.theme {display:block; width:52px; position:absolute; left:0; top:0; margin-left:0; background-position:100% 0}

#blog .articles h4, #blog .journal h4 {font:bold 1.5em Segoe, arial, sans-serif; margin:0; color:#777054; text-shadow:0px 1px 0px #f7eeca}
#blog .articles h4 a, #blog .journal h4 a {color:#777054}

#blog .journal .entry {font-size:1.2em; color:#716539}
#blog .journal .entry a {color:#3b709d}
#blog .journal .entry .more {display:inline-block; position:relative; margin-top:10px; font-size:0.85em; color:#716539}
#blog .journal .entry .more strong {display:block; position:relative; z-index:2; font-weight:normal; padding:0 3px}
#blog .journal .entry .more span {display:block; width:100%; height:100%; position:absolute; top:0; left:0; background:#a69552; opacity:0.2; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); filter: alpha(opacity=20)}
#blog .journal .entry .more:hover {color:#62562c}
#blog .journal .entry .more:hover span {opacity:0.3; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30); filter: alpha(opacity=30)}


#blog .spaceman {width:340px; height:226px; position:absolute; bottom:-24px; left:50%; margin-left:192px; background:url(http://img3.turbomilk.com/i/v3/v/spaceman.png) no-repeat 100% 0}
#blog .spaceman .bubble {
	margin:90px 0 0;
	width:160px;
	height:64px;
	position:relative;
	z-index:3;
	background:#fffffd;
	border-bottom:1px solid #f2e2a9;
	-moz-border-radius:8px 8px 8px 8px;
	-webkit-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
}
#blog .spaceman .bubble p {font-size:1.2em; color:#000; padding:12px 15px; text-align:center}
#blog .spaceman .bubble p a {color:#3b709d}
#blog .spaceman .bubble .tail {width:25px; height:12px; position:absolute; top:40px; left:100%; border-bottom:1px solid #f2e2a9}
#blog .spaceman .bubble .tail div {width:0; height:0; border-left:12px solid #fffffd; border-bottom:6px solid #fffffd; border-right:12px outset transparent; border-top:6px outset transparent}

#featured {min-width:1000px; height:329px; position:relative; overflow:hidden; border-top:1px solid #fff; background:url(http://img3.turbomilk.com/i/v3/bg/featured.png) repeat-x 0 0}
#featured .works {width:3500px; height:329px; position:absolute; top:0; left:0; padding-right:50px; overflow:hidden}
#featured .works div {
	margin:30px 0 0 30px;
	background:#fff;
	-moz-box-shadow:0px 3px 3px #aaa;
	-webkit-box-shadow:0px 2px 3px #aaa;
	box-shadow:0px 2px 3px #aaa;
	filter: progid:DXImageTransform.Microsoft.Shadow(strength=2, direction=180, color='#aaaaaa');
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength=2, Direction=180, Color='#aaaaaa')";
}
#featured .works h3 {font-family:Segoe, arial, sans-serif; margin:4px 0 0 0}
#featured .works p {margin:0}
#featured .scroller {width:100%; height:10px; position:absolute; bottom:0; left:0}
#featured .scroller .back {width:100%; height:100%; position:absolute; top:0; left:0; z-index:1; background:#000; opacity:0.1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10); filter: alpha(opacity=10)}
#featured .scroller .knob {width:530px; height:10px; position:absolute; top:0; left:0; z-index:2; background:#000; opacity:0.2; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); filter: alpha(opacity=20)}
#featured .scroller .knob .left, #featured .scroller .right {width:15px; height:10px; position:absolute; top:0; cursor:pointer}
#featured .scroller .knob .left {left:0; background:url(http://img3.turbomilk.com/i/v3/p/scroll_left.gif) no-repeat 4px 2px}
#featured .scroller .knob .right {right:0; background:url(http://img3.turbomilk.com/i/v3/p/scroll_right.gif) no-repeat 4px 2px}

#social {min-width:1000px; height:242px; background:url(http://img3.turbomilk.com/i/v3/bg/social.png) repeat-x 0 0}
#social .section {overflow:hidden}

#social .twitter {width:60%; height:242px; float:left; background:url(http://img3.turbomilk.com/i/v3/v/twitter.png) no-repeat 0 0}
#social .twitter .bubble {
	width:280px;
	height:140px;
	position:relative;
	float:right;
	margin-top:36px;
	border-bottom:1px solid #b3cad5;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	border-radius:10px 10px 10px 10px;
	background-image:-moz-linear-gradient(top, #f9fdfe, #dae9f2);
	background-image:-webkit-gradient(linear, center top, center bottom, from(#f9fdfe), to(#dae9f2));
	background-image:-o-linear-gradient(top, #f9fdfe, #dae9f2);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9fdfe', endColorstr='#dae9f2');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9fdfe', endColorstr='#dae9f2')";
	background-image: linear-gradient(top, #f9fdfe, #dae9f2);
}
#social .twitter .bubble .tail {width:28px; height:18px; position:absolute; top:38px; left:-28px; border-bottom:1px solid #a3bfcd}
#social .twitter .bubble .tail div {width:0; height:0; border-left:28px outset transparent; border-bottom:18px solid #eef6fa}

#social .twitter p {font-size:1.3em; margin:18px 20px; color:#597f92}
#social .twitter a {text-decoration:none; font-weight:bold; color:#597f92}
#social .twitter p small {font-size:0.7em}
#social .twitter p small a {font-weight:bold}
#social .twitter p.account {position:absolute; bottom:18px; left:20px; margin:0}
#social .twitter .follow {display:block; width:28px; height:33px; position:absolute; bottom:10px; right:10px; background:url(http://img3.turbomilk.com/i/v3/p/twitter.png) no-repeat 0 0}
#social .twitter .follow span {display:none}

#social .flickr {width:37%; float:right; margin-top:36px; background:url(http://img3.turbomilk.com/i/v3/p/flickr.gif) no-repeat 96% 10px}
#social .flickr div {position:relative; float:left; margin:0 20px 0 -50px; z-index:2}
#social .flickr div.even {margin-top:78px; margin-left:-73px; z-index:1}
#social .flickr div:first-child {margin-left:0}
#social .flickr div:last-child {margin-right:0}
#social .flickr div.last {margin-right:0}
#social .flickr div .shadow {
	width:95px;
	height:95px;
	position:absolute;
	top:0;
	left:0;
	margin:0;
	z-index:1;
	background:#000;
	-moz-box-shadow:0px 2px 4px #000;
	-webkit-box-shadow:0px 2px 4px #000;
	box-shadow:0px 2px 4px #000;
	opacity:0.45;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.30');
	/*filter: progid:DXImageTransform.Microsoft.Shadow(strength=2, direction=135, color='#50000000');
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength=2, Direction=135, Color='#50000000')";*/
}
#social .flickr a {display:block; float:left; padding:10px; background:#fff; position:relative;	z-index:2}
#social .flickr img {display:block}