@charset "UTF-8";
/* CSS Document */


/* ////////////////// DEFAULTS ////////////////// */

* {
	padding: 0;
	margin: 0;
	}

html {
	/*background-image: url(img/layout/background/leg.jpg);*/
	}


body {
	background-color: #CCCCCC;
	}

p {
	padding-bottom: 1em;
	}
	
h1 {
	font: normal 130% sans-serif;
	clear: left;
	}

h2 {
	font: normal 130% sans-serif;
	margin-bottom: .7em;
	clear: left;
	}

h3 {
	font: normal 110% sans-serif;
	padding-bottom: 0;
	}

h4 {
	font: bold 100% sans-serif;
	padding-bottom: .1em;
	}

img {
	border-style: none;
	vertical-align: bottom;
	}

hr {
	margin: .5em;
	margin-left: .5em;
	clear: both;
	border: 1px solid #CCCCCC;
	}
	
hr.topnav {
	margin: .5em;
	clear: both;
	border: 1px solid #FFFFFF;
	}

li {
	list-style: none;
	}
	

span {
	}

ul {
	}
	
div {
	}

.italic {
font-style: italic;
}


/* _____ INLINE ELEMENTS _____ */





/* _____ LINK STATES _____ */


a:link, a:hover, a:active {
	text-decoration: none;
	color: #333333;
	}
	
a:visited {
	color:#666666;
	text-decoration: none;
	}	
	
a:hover.textlink {
	text-decoration: underline;
	}



/*.graphiclink {
	border: none;
	}*/
	

.graphiclink img{
	border: 1px solid #CCCCCC;
	padding: 3px;
	}

a:hover.graphiclink img {
	background-color: #66FFFF;
	border: 1px solid #CCCCCC;
	padding: 3px;
	}


/* ////////////////// LAYOUT ////////////////// */

#container {
	padding: 0;
	/*padding: 3em 3em 3em 4em;*/
	margin: 20px 40px;
	overflow: auto;
	font: 85% Arial;
	background-color: #FFFFFF;
	}

/* __________________ HEADER */

#header {
	background-color:#00FF00;
	}


#logo {
	position: fixed;
	left: 5em;
	top: 3em;
	display: block;
	height: 35px;	
	width: 65px;
	background: url(img/layout/logo/logo_lil.gif) no-repeat;
	background-color: #FFFFFF;
	z-index: 100;
	}

#logo:hover {
	background-position: 0 -35px;
	}

#logo span {
	display: none;
	}

ul#ul_top {
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: left;
	}
	
ul#ul_top li{
	padding: 0;
	margin: 0;
	display: inline;
	}
	

/* _____ UPPER NAV BUTTONS _____ */


#banner_buttons {
	position: fixed;
	left: 13em;
	top: 3em;
	}

#buttonlist li {
	float: left;
	margin-right: .3em;
	}

	#about {
		display: block;
		width: 16px;
		height: 16px;
		background: url(img/layout/buttons/about.gif) no-repeat;
		}
	#about:hover { 
		background-position: 0 -16px;
		}

	#about span {
	display: none;
	}

	#contact {
		display: block;
		width: 20px;
		height: 16px;
		background: url(img/layout/buttons/contact.gif) no-repeat;
		}
	#contact:hover { 
		background-position: 0 -16px;
		}
	#contact span {
		display: none;
		}

	#more {
		display: block;
		width: 20px;
		height: 16px;
		background: url(img/layout/buttons/more.gif) no-repeat;	
		}
	#more:hover { 
  		background-position: 0 -16px;
		}
	#more span{
	display: none;
	}





#nextproject
	{
	position: fixed;
	left: 20em;
	top: 3em;
	padding: 0;
	margin-top: .5em;
	z-index: 100;
	}


/* _____ NAV LEFT _____ */


#nav_left {
	float: left;
	margin: 6em 0 0 1em;
	padding: .5em;
	background-color: #FFFFFF;
	}

#nav_left ul {
	padding: 0;
	margin: 0;
	}

/*	
#display_nav li {
	padding: .125em .25em;
	margin: 0;
	border-right: 3px solid red;
	}*/

.vert_nav li {
	padding: .125em .25em;
	margin: 0;
	}
	
.linkon {
	padding: 2px;
	color: #000000;
	background-color:#C8C8C8; 
	}


/* ____________________ DISPLAY ______________________________ */
 
#display {
	padding: .5em 2em;
	margin-top: 6em;
	min-height: 600px;
	overflow: auto;
	background-color: #FFFFFF;
	}
	
.pres_group {
	margin-right: 2em;
	margin-bottom: 1em;
	color: #333333;
	float:left;
	width: 20em;
	}
	
a:hover {
	border:#CC0000;
	}
	
div.pres_head {
	color: #000000;
	}

p.headp {
	color: #666666;
	font-size: 85%;
	width: 35em;
	}

ul.headul {
	margin-bottom: .5em;
	}

p.blurb {
	font-size: 85%;
	color: #666666;
	width: 35em;
	clear: both;
	}
	
img.pres_img {
	margin-right: 2em;
	margin-bottom: 1em;
	margin-top: 1em;
	}

img.pres_imgborder {
	margin-right: 2em;
	margin-bottom: 1em;
	border: 1px solid #CCCCCC;
	}	
	
p.pres_caption {
	padding-left: 2em;
	margin: 1em 0;
	color: #666666;
	font-size: 85%;
	}


hr.preshr {
	padding: 2em;
	margin: 0;
	border-style: hidden;
	clear: both;
	}

hr.preshrline {
	padding: 0;
	margin: 2em;
	border: 1px solid #CCCCCC;
	clear: both;
	}

hr.titlerule {
	padding: 0;
	margin: 1em;
	border: 1px solid black;
	clear: both;
	}

/*WLT*/


/* ------------------RESUME-------------------- */

.res_blurb
	{
	font-size: 85%;
	color: #666666;
	max-width: 20em;
	margin-top: .3em;
	}



.pres_group ul {
	list-style: none;
	text-align: left;
	margin-left: 1em;
	}
	
.pres_group li{
	padding: 0;
	margin-right: 2em;
	}

.sidenote {
font-size: 80%;
max-width: 40em;
}

.invisible {
	visibility: hidden;
	}

h4 a {
	color: #333333;
	}	

h4 a:hover {
	text-decoration: underline;
	 }

/* _____ FOOTER _____ */

#footer {
	padding: .5em;
	background-color: #FFFFFF;
	clear: both;
	}
	
p.footer {
	font-size: .75em;
	text-align: right;
	}

.top {
	position: absolute;
	top: 5px;
	left: 5px;
	visibility: hidden;
	}

p.topbutton {
	color: #00FF00;
	margin-left: 12em;
	float: left;
	color: #333333;
	}


#twitter_update_list li {
	margin-bottom: .3em;
	list-style: inside;
	}


/* ____________________ TEXT SIZE JS ____________________ */

#textsize {
	position: fixed;
	top: 4em;
	right: 5em;
	text-decoration: none;
	}

.bigger {
	padding: 1px;
	margin-right: 3px;
	background: #FFFFFF;
	border: 2px solid #CCCCCC;
	}
.smaller {
	padding: 1px;
	margin: 0;
	background: #FFFFFF;
	border: 2px solid #CCCCCC;
	}


/*-------------------*/


#lastfm li {
	float: left;
	margin-bottom: 1em;
	margin-right: 1em;
	}

/*
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: block; height: 1px; overflow: hidden}
.r1{margin: 0 5px}
.r2{margin: 0 3px}
.r3{margin: 0 2px}
.r4{margin: 0 1px; height: 2px} 

*/

span.border {
	border: 1px solid red;
	}






/* 

COLOR: WHITE  #FFFFFF;

COLOR: LIGHT GREY  #CCCCCC;

	padding: 0;
	margin: 0;
	background-color: #FFFFFF;

border: 1px solid red;

background-color: #FFFFFF; WHITE */