/* mo'media main.css | 05/2010 */
@import "base.css";

body {
	width: 60em;
	margin: 2em auto 1em auto;
}

h1 { font: normal 1.25em/1.6em Helvetica,Arial,sans-serif; color: #f20953; text-shadow: 0 1px 0 #FFF; }
h2 { font: normal 1.0em/1.6em Helvetica,Arial,sans-serif; color: #00A3B8; text-shadow: 0 1px 0 #FFF; }

p { font: normal .85em/1.5em Helvetica,Arial,sans-serif; padding: 0 0 .7em 0; }

a { color: #888; }
a:hover { color: #00A3B8; }


ul#left {
	float: left;
	width: 40em;
}

	ul#left li {
		margin-bottom: .7em;
		padding: .5em .7em .2em .7em;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		position: relative;
	}
	
		ul#left li h1 a { 
			color: #f20953; 
			text-decoration: none;
		}
	
		ul#left li span {
			visibility: hidden;
			position: absolute;
			right: -.5em;
			top: -.5em;
			font: normal .9em/.9em Helvetica,Arial,sans-serif;
			color: #fff;
			padding: .5em .7em;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			background: #00A3B8;
			-moz-box-shadow: 0px 0px 7px #ccc;
			-webkit-box-shadow: 0px 0px 7px #ccc;
		}
	
	ul#left li:hover {
		background: #f6f6f6;
		-moz-box-shadow: 0px 0px 7px #ccc;
		-webkit-box-shadow: 0px 0px 7px #ccc;
	}
	
		ul#left li:hover span {
			visibility: visible;
		}
	
		ul#left li:hover h1 a {
			color: #00A3B8;
			border-bottom: none;
		}
		
		ul#left li:hover h1 a:hover {
			color: #00A3B8;
			border-bottom: 1px solid #00A3B8;
		}
		

ul#right {
	float: right;
	width: 15.7em;
}

	ul#right li {
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		background: #f6f6f6;
		padding: .5em .7em .1em .7em;
		margin-bottom: 1em;
		-moz-box-shadow: 0px 0px 7px #ccc;
		-webkit-box-shadow: 0px 0px 7px #ccc;
	}
	
	ul#right li.logo {
		text-align: right;
		padding: 0;
		background: none;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		margin-bottom: 1.4em;
	}
	
	ul#right li p {
		color: #555;
	}