/*
	Designed in Dec 2007 while on Holidays in Coolum
*/

/* elements */
body {
	margin: 0;
	padding: 0;
	background: #FFF url(../img/bg-page.png) right repeat-y;
	font-family: sans-serif;
	font-size: 100.01%;
}
a {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

/* layout */
div#wrap{float:left;width:100%;margin-left:-200px}
div#content{margin-left:200px}
div#sidebar{float:right;width:190px}
div#extra{float:right;clear:right;width:200px}
div#footer{clear:both;width:100%}

/* header */
#header {
	padding: .5em;
	color: #14052E;
	background: #0A1029 url(../img/bg.png) top repeat-x;
}
#header h1 {
	margin-bottom: 0;
	font-size: 140%;
	text-shadow: 1px 2px 2px blue;
}
#header p {
	margin: .5em 1em;
	text-align: right;
	font-size: 90%;
	color: #001DE1;
}

/* content */
#wrap {
	padding: 0;
	background: #FFF;
}
#content {
	margin: 0;
	background: url(../img/bg-content-rt.png) right top no-repeat;
}

/* toggle */
.stream {
	margin: 0 .5em 0 0;
	padding-left: 2.2em;
	font-family: "Palatino Linotype","Book Antiqua",Palatino,FreeSerif,serif;
}
.stream li {
	position: relative;
	padding: .2em 10em .2em 0;
	border-bottom: 1px dotted #CCC;
	cursor: s-resize;
}
.stream li:hover {
	background: url(../img/bg-li-down.png) right bottom no-repeat;
}
.stream li.show {
	cursor: n-resize;
}
.stream li a {
	padding-right: 18px;
	font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
	cursor: pointer;
}
.stream a:hover {
	background: #666 url(../img/itms_arrow.png) right top no-repeat;
}
.stream li.show:hover {
	background: url(../img/bg-li-up.png) right bottom no-repeat;
}
.stream li a strong {
	padding-right: 5px;
	background: #fff;
	font-weight: normal;
}
.date {
	display: none;
	position: absolute;
	top: .5em;
	right: 15px;
	text-align: right;
	font-size: 75%;
	color: #DDD;
	font-family: sans-serif;
}
.stream li:hover .date,
.show .date {
	display: block;
}
.date strong {
	font-size: 110%;
	color: #CDCDCD;
}
.description {
	display: none;
	font-size: 90%;
	color: #333;
}
.show .description {
	display: block;
}

/* sidebar */
#menu {
	margin: 0;
	padding: 0;
}
#menu li {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #0A1029;
	background: #0A1029 url(../img/bg-menu.png) top repeat-x;
}
#menu li:hover {
	background: #5062B6 url(../img/bg-menu.png) 0 -75px repeat-x;
}
#menu li.selected {
	background: #9DA7D6 url(../img/bg-menu.png) 0 -150px repeat-x;
}
#menu li a {
	display: block;
	width: 100%;
	padding: 1em 0;
	color: #FFF;
	text-indent: -9999px;
	background: url(../img/service-badges.png) no-repeat;
}
#toggleall {
	letter-spacing: .2em;
	text-align: center;
}

/* loading */
#latest {
	background: url(../img/loading.gif) center no-repeat;
	min-height: 100px;
}
#latest li {
	background: #FFF;
}

/* branding */
#menu .menu_latest a {
	background-position: -200px 50%;
}

#menu .menu_twitter a {
	background-position: -400px 50%;
}
.twitter a strong {
	color: #82C3C5;
}
.twitter a:hover {
	background-color: #9AE4E8;
}

#menu .menu_flickr a {
	background-position: -600px 50%;
}
.flickr a strong {
	color: #D90073;
}
.flickr a:hover {
	background-color: #0063DC;
}

#menu .menu_lastfm a {
	background-position: -800px 50%;
}
.lastfm a strong {
	color: #B21834;
}
.lastfm a:hover {
	background-color: #000;
}

#menu .menu_upcoming a {
	background-position: -1000px 50%;
}
.upcoming a strong {
	color: #820002;
}
.upcoming a:hover {
	background-color: #900;
}

#menu .menu_blog a {
	background-position: -1200px 50%;
}
.blog a strong {
	color: #025;
}
.blog a:hover {
	background-color: #f60;
}

#menu .menu_youtube a {
	background-position: -1400px 50%;
}
.youtube a strong {
	color: #c00;
}
.youtube a:hover {
	background-color: #039;
}

#menu .menu_digg a {
	background-position: -1600px 50%;
}
.digg a strong {
	color: #1B5790;
}
.digg a:hover {
	background-color: #3B5D14;
}

#menu .menu_facebook a {
	background-position: -1800px 50%;
}
.facebook a strong {
	color: #3B5998;
}
.facebook a:hover {
	background-color: #C3CDDF;
}

#menu .menu_reader a {
	background-position: -2000px 50%;
}
.reader a strong {
	color: #8E7C6A;
}
.reader a:hover {
	background-color: #D52;
}

#menu .menu_iusethis a {
	background-position: -2200px 50%;
}
.iusethis a strong {
	color: #185CA7;
}
.iusethis a:hover {
	background-color: #FF7C00;
}