/*  									APLUS NEW MEDIA 									*/
/*  								=======================									*/
/*									  CSS Stylesheet 2005									*/
/*									Written By: Aaron Glenn									*/
/* ======================================================================================== */



/* 				GLOBAL HTML STYLES				*/
/* ============================================ */
html *{margin: 0; padding: 0;}
html{border-left: 5 px solid #efefef;}
body{
	font-size: 76%;
	font-family: Trebuchet MS, Georgia, Times, Serif;
	color: #555;
	line-height: 150%;
	position: relative;
	background:    url("../_images/layout/side_bg_paisley.png") repeat-y top right;
}
a{text-decoration: none;color: #CC6600;}
a:hover{color: #FF9900;}
a img{border: 0;}
h1, h2, h3, h4, ul{}
h5, p, dl, td, #side h4, #side li {font-family: 'Trebuchet MS', 'Lucida Grande', Arial, Sans;}
h1{
	font-size: 3em;
	font-weight: normal;
	font-family: Georgia, Times New Roman, serif;
	padding-bottom: .5em;
	border-bottom: 1px solid #CC6600;
	text-transform: lowercase;
	margin: .25em 0 0 0;
}
h2{
	font-family: Georgia, Times New Roman, serif;
	text-transform: uppercase;
	letter-spacing: .15em;
	font-size: 1.3em;
	display: inline;
	float: left;
	margin-top: .25em;
}
h3{
	color: #999;
	font-size: 1.7em;
	font-weight: normal;
	font-family: Georgia, Times New Roman, serif;
	border-bottom: 1px solid #efefef;
	background:    url("../_images/layout/diag_grey.gif");
	line-height: 150%;
	margin: 0;
	padding: 0;
	padding-left: .4em;
	padding-bottom: .1em;
	margin-bottom: 1em;
	border-left: 3px solid #ccc;
}
h4{margin: .2em;clear: both;}
h5{font-weight: normal;	font-size: 110%;line-height: 120%;}
ul{list-style-type: none;font-size: 90%;}
dl{padding-left: .5em;}
dt{font-weight: bold;margin-bottom: .5em;}
dd{background:    url("../_assets/images/layout/bullet_plus.gif") no-repeat 0% 50%;	padding-left: 20px;}



/* Form Elements 											*/
/* ======================================================== */
form{background: #efefef; border: 1px solid #777;}
fieldset{padding: 20px; border: 0;}
legend{display: none;}
label{display: block; font-family: 'Trebuchet MS', Arial, sans-serif; font-size: 1.1em; font-weight: bold;}
textarea, input, select{
	font-family: 'Trebuchet MS', 'Lucida Grande', Arial, Sans;
	font-size: 1em;
	display: block;
	clear: left;
	margin-bottom: .5em;
	width: 300px;
}
textarea{height: 250px;}


/* Table Elements											*/
/* ======================================================== */
table{width: 50%;border: 1px solid #efefef;border-collapse: collapse;}
thead{background: #efefef;}
th{padding: .2em;text-align: left;border: 1px solid #fff;}
tr:hover{background: #f7f7f7;border-bottom: 1px solid #333;}
th.level{width: 25%;}
th.experience{width: 25%;}
td{padding: .3em 0 0 .5em;border: 1px solid #efefef;border-collapse: collapse;}


/* 				LAYOUT STYLES					  */
/* ============================================== */

#wrapper{width: 89%; overflow: hidden; }
#header{position: relative; width: 100%; height: 6em; margin: 50px 0 30px;}
#nav{display:inline; float: right;}
#main{width: 63%; display: inline; float: right;}
#side{width: 30%; display: inline; float: left; margin-left: 50px;}
#footer{display: none;}

/* Variations */
#page-index #side{float: right; margin: 0;}
#page-index #main{float: left; margin-left: 50px;}



/* 				HEADER STYLES					  */
/* ============================================== */
#header h1{margin-left: 50px;}
#header h2{margin-left: 50px; width: 50%;}
#inquiries{position: absolute; top: 0; right: 0; text-align: right;}
#inquiries h5, #inquiries a{
	font-family: 'Trebuchet MS', 'Lucida Grande', Arial, Sans;
	font-size: .8em;
	line-height: 1.5em;
	letter-spacing: 1px;
}


/* 				NAVIGATION						  */
/* ============================================== */

#nav{list-style-type: none;}
#nav li{display: inline; float: left; margin-left: 1.4em; margin-top: 0;}
#nav a{
	/*background: url(../_images/layout/nav_work.gif) no-repeat 0 0;*/
	padding-bottom: 2px;
	padding-top:2px;
	margin-top: 0;
	text-transform: lowercase;
	font-family: Arial, Helvetica, Sans;
	font-size: 1.7em;
	line-height: 1.7em;
	font-weight: bold;
	letter-spacing: -1px;
}
#nav a:hover{border-top: 4px solid;}

/* Set the links to active based on the page id */
#page-work #nav-work a,
#page-play #nav-play a,
#page-details #nav-details a,
#page-photos #nav-photos a,
#page-contact #nav-contact a{
	border-top: 4px solid;
}



/* 	MAIN CONTENT STYLES								*/
/* ================================================ */
#wrapper{background: url(../_images/layout/corner_graf.png) no-repeat 0 0; border-left: 1px solid #ccc;}


#main img{}
#main h4{font-family: Arial; font-size: 16px; font-weight: bold; letter-spacing: -1px; border-top: 1px solid #777;border-bottom: 1px solid #777; padding: 2px 0; margin: 1em 0;}
#main p{clear: both;}

#page-index #main, #page-contact #main, #page-admin #main{display: inline; float: left; margin-left: 50px; border: 1px solid #ccc;}
#page-index #side{float: right; width: 30%;}


/*
.project-featured, #support, #news, #intro{
border-bottom: 1px solid #a7a7a7;padding-bottom: 20px; overflow: hidden;
padding-bottom: 40px; overflow: hidden;
}*/


	/* 		PORTFOLIO PAGES								*/
	/* ================================================ */
	#main.portfolio{}
	#main.portfolio img{float: right; margin: 1em; margin-right: 0; padding: 4px;}
	#main.portfolio p{ margin: 10px;}
	#main .port-item{clear: both; border-bottom: 2px solid #999; padding: 1em; margin-bottom: 2em; padding-bottom: 2em;}
	#main .port-details{float: left; width: 30%; clear: left;}
	#main .port-details h4{ display: inline; border: 0; margin: 0; clear: none;}
	#main .port-details p{margin: 0;}
	#main .port-link{font-family: Arial; text-decoration: underline;}
	#main .port-image{position: relative;width: 400px;height: 150px; border: 1px solid #666; overflow: hidden; float: right;}

	#main .port-image a.port-image-link{width: 400px;height: 150px;position: absolute; top: 0; left: 0; z-index: 10;}
	#main .port-image a.port-image-link:hover{border: 1px solid #ccc;}
	#main .port-image img{position: absolute; top: -15px; left: -15px; z-index: 1;}
	 .innershadow{ position: absolute; top: 0; left: 0; z-index: 10; width: 400px; height: 150px;}
	 .innershadow[class]{ background: url(../_images/layout/inner_shadow.png) 0 0; }
	 .innershadow{ filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/_images/layout/inner_shadow.png', sizingMethod='scale'); }

	 .controls{position: absolute; top: 0; left: 0; z-index: 20; width: 300px; height: 20px;}
	 .controls li{display: inline; float: left; margin: 4px;}
	 .controls a{text-decoration: none; padding: 2px 4px; color: #333333; border: 1px solid;}
	 .controls a:hover{background: #ccc;color: #000;}

	/* 	PERSONAL PAGES									*/
	/* ================================================ */
	#main.personal{}
	.project-personal{width: 100%;}
	.project-personal img{border: 1px solid #ccc; }
	.project-featured h3{margin-bottom: .3em; margin-left: -10px;}
	.project-featured{padding: 0 0 40px 10px;}
	#project-personal{overflow: hidden;}
	#support{margin-top: 40px;}

	/* 	PHOTO PAGE										*/
	/* ================================================ */
	#page-photos #side{width: 25%;}
	#page-photos #main{width: 600px;}
	#flash-holder{display: none;}
	#photo-controls{}

	/* 	DETAILS/CONTACT PAGES							*/
	/* ================================================ */
	#page-details #side{border-left: 1px;}



/* 	SIDEBAR STYLES									*/
/* ================================================ */

#side h3{margin-bottom: .2em;}
#side h4{font-family: Arial; font-size: 14px; letter-spacing: -1px; border-bottom: 1px solid; background: #efefef; margin: 1em 0; padding: .1em .2em; padding-right:70px;}
#side h4 a{color: #555;}
#side h4 a:hover{color: #555; background: none;}
#side p{font-size: 90%; margin: 10px 1em;}
#side a{}
#side ul a, #side dl a{display: block;
		font-weight: normal;
		background:url("../_assets/images/layout/bullet_plus_small.gif") no-repeat left middle;
		padding-left: 1em;
		border-left: 1px dashed #ccc;
}
#side a:hover{}
#side ul{margin: 1em 2em;}

	/* 	LINKS											*/
	/* ================================================ */
#side div.links{width: 45%; display: inline; float: left; margin: 0 4px; background: #fff; }
#side .links dl{margin: 0; padding: 0; margin-left: 1px;}
#side .links dt{margin: 0;}
#side .links a{}
/*
#side .links a:hover{font-weight: bold; color: #9D4F00; background: #efefef; padding-left: 1.5em; border-left: 1px solid #ccc; }
*/


#music{margin-top: 1em;}


	/* 	NEWS ITEM										*/
	/* ================================================ */
	#side .news-item h4{margin-top: 0;}
	.news-item {font-family: Trebuchet MS, Arial, Sans;}

	.news-item{margin: 1em .5em 1em .4em;	position: relative; border: 1px solid #efefef;}
	.news-item p{padding-left: .3em; }
	.news-item a.news-link{
		display: block;
		text-align: right;
		padding: 2px;
		padding-left: 20px;
		padding-right: 4px;
	}
	#side a.news-link{clear: both;}
	.date{font-size: 9px; line-height: 9px;position: absolute; top: 4px; right: 1.2em;}
	#archived{display: block; height: 16px; text-align: center; margin-bottom: 16px;}

	/* CSS Hovers : IE Doesn't Apply */
	.news-item:hover{border: 1px solid #ccc;}
	.news-item:hover a,
	.news-item a:hover{	/*background: #fff url("../_images/layout/link_arrow.png") no-repeat 0 200px; */}
	.news-item:hover h4 a{background: none;}
	#archived{font-family: Arial; font-size: 11px; float: right; clear: right;}
	#rss-feed{font-family: Arial; font-size: 11px; float: left; padding-left: 20px; background: url(../_images/layout/rss-feed.gif) no-repeat top left;}


/* 				INTRO DISPLAY						*/
/* ================================================ */
#page-index #main{background: url(../_images/layout/hanging_paisley.png) no-repeat 100% 20px; border: 1px solid #fff;}
#intro{display: block;margin: 0 80px 2em 1em;}
#intro li{
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 2.2em;
	letter-spacing: -2px;
	font-weight: bold;
	color:#666666;
	line-height: 1.1;
	margin-right: .3em;
	border-right: 1px solid #ccc;
	padding-right: .3em;
	display: inline;
}
#intro li.intro-title{color: #CC6600;}
#intro li:hover{background-color: #efefef;cursor: pointer;}
#support{clear: left; margin-top: 20px;}
#support p{float: left; width: 200px; margin-left: 10px;}
#support a{display: block; float: left; }
#support a span{visibility: hidden;}

.links dd{display: none;}
.links {}
#link-firefox{width: 120px; height: 50px; background: url(../_images/misc/get-firefox_bw.png) no-repeat top left;}
#link-firefox:hover{background: url(../_images/misc/get-firefox_color.png) no-repeat top left;}
#link-jedit{width: 150px; height: 50px; background: url(../_images/misc/get-jedit_bw.png) no-repeat top left;}
#link-jedit:hover{background: url(../_images/misc/get-jedit_color.png) no-repeat top left;}
#link-thunderbird{width: 120px; height: 50px; background: url(../_images/misc/get-thunderbird_bw.png) no-repeat top left;}
#link-thunderbird:hover{background: url(../_images/misc/get-thunderbird_color.png) no-repeat top left;}


/* 				VARIOUS CLASSES						*/
/* ================================================ */
.clear{clear: both; height: 1px; line-height: 1px; visibility: hidden;}
.project-featured{overflow: hidden;}
.project-featured .port-description{float: left; width: 150px;}
.project-featured .port-image{float: right; clear: right;}
.required{border: 1px solid red;background: #ccc;}
.album-photo{border: 1px solid;	padding: 10px;}
.disclaimer{font-style: italic; background: #e7e7e7; border: 1px dashed; padding: 4px; margin: 10px;}
.framed{padding: 4px; background: #efefef; border: 1px solid #a7a7a7; margin: 1em;}
.f-left{float: left;}
.f-right{float: right;}
.code{font-size: 12px; border: 1px solid #ccc; background: #efefef; padding: 0; margin: 20px;}


/* 				ADMIN UI CSS						*/
/* ================================================ */
#page-admin form{background: #fff; border: 0; margin: 0; padding: 0;}
#page-admin fieldset{padding: 0;}
#page-admin dl{display: block; position: relative; border: 3px double #878177; padding: 20px 10px 10px 10px; margin: 20px;}
#page-admin dt{position: absolute; top: -15px; left: 10px; border: 1px solid #333; background: #efefef; padding: 3px 5px;}
#page-admin dd{}
.adminUI{/*position: absolute;	top: 0;	left: 0;*/	visibility: hidden;}
.adminUI li{float: left;}
 #controls li{display: inline;float: left;margin: 4px;}
 #controls a{text-decoration: none;	padding: 2px 4px;color: #333333;border: 1px solid;}
 #controls a:hover{	background: #ccc;color: #000; }
 .button{width: auto; display: inline; clear: none;}



