/* defaults */
body {
	font-family:'helvetica neue',helvetica,arial,sans-serif;
	background: url(/images/noise2.png) repeat center top;
	color:#000;
	font-size:16px;		
	min-width:600px;
}

a {
	border-bottom:1px dotted #666;
	color:#000;
	text-decoration:none;
}
a:hover {
	border-bottom:0 none;
}
strong {
	font-weight:bold;
}

.clear {
	clear:both;
}

/* element styling */

.modal-box {
	
	padding:30px;
	background:#e5e5e5 url(/images/trans-back-bottom2.png) left bottom repeat-x;
	text-shadow:0 1px 0 rgba(255,255,255,1);
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	-moz-box-shadow:0 1px 3px rgba(0,0,0,.3);
	border:1px solid rgba(255,255,255,.6);
	position:absolute;
	
}

a.button-style {
	padding: 0 .75em 0em .75em;
	margin:5px;
	height:21px;
	line-height:21px;
	color:rgba(0,0,0,.6);
	background:#fff url(/images/trans-back-bottom2.png) left bottom repeat-x;
	text-shadow:0 1px 1px rgba(255,255,255,.8);
	border:0 none;
	-moz-border-radius:5px;
	font-size:.7em;
	-moz-box-shadow:0px 1px 0 rgba(255,255,255,.9),0 -1px 1px rgba(0,0,0,.1),0px 1px 2px rgba(0,0,0,.5);	
	display:block;
	
}

a.button-style:active {
	margin-top:6px;
}
a.button-style:hover {
	background:rgba(255,255,255,.4);
}

/* boxes */

#colophon {
	position:relative;
	margin:60px auto;
	width:280px;
	z-index:500;
}

div#background-swapper {
	width:60%;
	position:relative;
	margin:60px auto;
	padding-top:50px;

}

#preview-fields fieldset {
	-moz-border-radius:5px;
	padding:0 10px 0 3px;
	border:1px solid rgba(0,0,0,.05);
	-moz-box-shadow:0 1px 0 rgba(255,255,255,.5);
	text-align:right;
	float:right;
	height:26px;
	line-height:26px;
	margin:5px;
	margin-top:-40px;
	margin-right:-20px;
	font-size:.8em;
	color:rgba(0,0,0,.7);
}

#preview-fields ul {
}

#preview-fields li{
	display:inline;
}

#preview {
	height:300px;	
	border:3px solid rgba(0,0,0,.3);
	background-image:url(/images/noise2.png);
	margin:10px 5px;
	display:none;
}
#preview-pane {
	margin:0 auto;
}

/* colophon */
#colophon h1 {
	font-size:2.5em;
	letter-spacing:-.035em;
	margin:.15em 0 0;
	font-weight:normal;
	font-weight:200;
	line-height:.8em;
}

#colophon p {
	font-size:.75em;
	line-height:1.6em;
	color:#666;
	margin:1em 0;
}
#colophon p a {
	font-weight:bold;
	color:#555;
}
#colophon h3 {
	font-size:.8em;
	color:#666;
	margin:1em 0 0;
	font-weight:400;
	text-align:center;
}
#colophon h3 a {
	color:#666;
}

img#headshot {
	float:left;
	display:block;
	margin-right:15px;
	margin-top:-5px;
	border:3px solid #fff;
	-moz-box-shadow:0px 1px 3px rgba(0,0,0,.2);
	-webkit-box-shadow:0px 1px 3px rgba(0,0,0,.2);
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}	

#networks {
	margin:20px 0 0;
}
#networks li a {
	display:block;
	border:1px solid #efefef;
	background:#edf1f2 url(/images/trans-back-bottom.png) left 0 repeat-x;
	-moz-box-shadow:0px 1px 3px rgba(0,0,0,.3);
	-webkit-box-shadow:0px 1px 3px rgba(0,0,0,.3);
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	font-size:.8em;
	padding:0 10px 0 0;
	margin:0 0 10px;
}

#networks li a span {
	display:block;
	padding:1em;
	background:url(/images/carrot.png) right 52% no-repeat;
	margin-right:4px;
}
#networks li a#dribbble span {
	background:url(/images/icon-dribbbled.png) right 65% no-repeat;
	margin-right:0;
}
/* background-swapper */

.icon {
	width:26px;
	height:26px;
	margin:5px;
	background:rgba(0,0,0,.3);
	-moz-box-shadow:1px 1px 0 rgba(255,255,255,.4),-1px -1px 0 rgba(0,0,0,.1),0px 1px 5px rgba(9,9,9,.5);
	position:relative;
	border:0 none;
	display:inline-block;
	float:left;
}
.icon span {
	display:none;
}
.icon:hover {
	border:4px solid rgba(0,0,0,.5);
	margin:1px;
	
}

/* buttons */

#sidebar {
	width:100%;
	height:32px;
	position:fixed;
	top:0;
	left:0;
	background:#e9e9e9 url(/images/trans-back-bottom2.png) left bottom repeat-x;
	-moz-box-shadow:0px 1px 25px rgba(0,0,0,.2);
	-webkit-box-shadow:0px 1px 25px rgba(0,0,0,.2);
	border-bottom:1px solid rgba(255,255,255,.1);
}
#sidebar a.button-style {
	float:left;
}
#icon-small {
	border:0 none;
	display:block;
	position:absolute;
	bottom:10px;
	right:10px;
	height:31px;
	background:rgba(255,255,255,.05);
	//-moz-border-radius:5px;
}