/*========================================================*\
 * Rfolio - Base Stylesheet
 *
 * Created on 03/04/2009. Last edited on 03/04/2009.
 *
 * Copyright (c) Otto J. Rask
\*========================================================*/

/*========================================================*\
 * IMPORTS.
\*========================================================*/

@import 'reset.css';
@import 'layout.css';

/*========================================================*\
 * GENERAL.
\*========================================================*/

body {
	font-family: Verdana, Helvetica, Arial, Sans-Serif; font-size: 11px; color: #CCC;
}

strong {
	font-weight: bold;
}
em {
	font-style: oblique;
}

/* LINKS. ================================================*/
a:link {
	color: #FF6600; text-decoration: none; font-weight: bold;
}
a:hover {
	color: #FFF; text-decoration: underline;
}
a:active {
	outline: 1;
}
a:visited {
	color: #F00;
}

/* LIstS. ================================================*/
ul, ol {
	margin-bottom: 20px;
}


/* HEADINGS. =============================================*/

h2 {
	padding-bottom: 20px; margin-bottom: 20px;
	font-family: 'DejaVu Serif', Georgia, Times New Roman, Serif; font-size: 18px; color: #FFF; font-weight: bold; font-style: oblique; letter-spacing: 0.25em;
	border-bottom: 1px solid #999;
}

/*========================================================*\
 * HEADER.
\*========================================================*/

div#header a#rdlink {
	float: right;
	text-indent: -9999em;
	display: block;
	width: 32px; height: 32px;
	background: transparent url('images/icons/rdbutton_01.png') top center no-repeat;
}


/*========================================================*\
 * NAVIGATION.
\*========================================================*/

div#navigation ul {
	list-style-type: none;
}

	div#navigation ul li {
		padding-left: 32px;
		background: url('images/icons/home.png') 0px 25px no-repeat;
	}
	
		div#navigation ul li.menu_front { background-image: url('images/icons/home.png'); }
		div#navigation ul li.menu_about { background-image: url('images/icons/information.png'); }
		div#navigation ul li.menu_digital { background-image: url('images/icons/computer.png'); }
		div#navigation ul li.menu_design { background-image: url('images/icons/layout.png'); }
		div#navigation ul li.menu_photography { background-image: url('images/icons/camera.png'); }
		div#navigation ul li.menu_music { background-image: url('images/icons/music.png'); }
		div#navigation ul li.menu_other { background-image: url('images/icons/asterisk.png'); }

	div#navigation ul li a {
		display: block;
		padding: 15px 0 3px 0;
		border-bottom: 1px solid #666;
	}

		div#navigation ul li a:hover {
			text-decoration: none;
			border-bottom: 1px solid #808080;
		}
		
		/*div#navigation ul li.selected a {
			color: #FFF;
		}*/
		
		body#page_index li.menu_front a,
		body#page_about li.menu_about a,
		body#page_digital li.menu_digital a,
		body#page_design li.menu_design a,
		body#page_photography li.menu_photography a,
		body#page_music li.menu_music a,
		body#page_other li.menu_other a {
			color: #FFF;
		}
		
		div#navigation ul li dd {
			font-size: 10px; color: #808080;
		}


/*========================================================*\
 * CONTENT.
\*========================================================*/

div#content p {
	margin-bottom: 20px;
	text-align: justify;
}

div#content img.contentimg {
	float: left;
	margin-right: 20px; padding: 5px;
	background: #FFF;
}

div#content a img {
	margin: 7.5px 0; padding: 5px;
	background: #FFF;
}

	div#content a img.alt {
		margin-left: 15px;
	}
	
	div#content a:hover img {
  		background: #FF6600;
	}
	
/* MUSICLIST. */
ul#musiclist li {
	overflow: auto;
	padding: 5px 0;
	line-height: 200%;
	border-bottom: 1px solid #666;
}
	ul#musiclist li .trackname {
		float: left;
		text-align: left;
	}
	ul#musiclist li .trackinfo {
		float: right;
		text-align: right;
	}


/*========================================================*\
 * FOOTER.
\*========================================================*/

div#footer {
	padding: 20px 0;
	text-align: center;
	border-top: 1px solid #999;
}

	div#footer p {
		color: #C0C0C0; line-height: 200%;
	}
	
	div#footer a {
		color: #CC0000;
	}