/*
	Theme name: My Universe Comic
	Theme URI: http://myuniversecomic.com/
	Description: CSS Stylesheet for My Universe Comic
	Versión: 1.0
	Author: ?
	Author URI: ?
	Coder: MeTaL_oRgY
	Coder URI: http://metalize.liveonstyle.com
*/

/***** Global *****/
/* Body */
	body {
		margin: 0px;
		padding: 0px;
		text-align: justify;
		font-size: .8em;
		font-family: verdana, arial, serif;
		letter-spacing: .05em;
		line-height: 1.4em;
		color: #333;
		background: #ccc url('../images/bg.jpg') no-repeat center top
	}

/* Headers */
	h2 { font-size: 1.8em; font-weight: bold; font-family: 'Trebuchet MS', verdana, arial, serif; color: #9c0}
	h3 { font-size: 1.6em; font-weight: bold; font-family: 'Trebuchet MS', verdana, arial, serif; color: #9c0}
	h4 { font-size: 1.4em; font-weight: bold; font-family: 'Trebuchet MS', verdana, arial, serif; color: #9c0}
	h5 { font-size: 1.2em; font-weight: bold; font-family: 'Trebuchet MS', verdana, arial, serif; color: #9c0}
	h6 { font-size: 1.0em; font-weight: bold; font-family: 'Trebuchet MS', verdana, arial, serif; color: #9c0}
	
	h2 a:link, h2 a:visited { color: #9c0 }
	h2 a:hover, h2 a:active { color: #b1ec00 }
/* Anchors */
	a {
		outline: 0;
	}
	a img {
		border: 0px;
		text-decoration: none
	}
	
	a:link, a:visited {
		color: #75c7df;
		text-decoration: none
	}
	
	a:hover, a:active {
		color: #29afd6;
		text-decoration: none
	}
	
/* Images */
	img {
		margin: 20px
	}
	
/* Alignment and Structure elements */
	hr.Clear {
		height: 1px;
		width: 10%;
		border-top: 1px solid #fff;
		clear: both;
	}
	
	div.left {
		float: left;
		width: 49%
	}
	
	div.right {
		float: left;
		text-align: right;
		width: 49%
	}
	
	div.center {
		width: 100%;
		margin: 0 auto;
		text-align: center
	}
	
/***** Layout Design *****/
/* Header */
	div#LogoMenu {
		height: 135px;
		width: 900px;
		margin: 0 auto;
		padding: 0;
		background: #202d5a url('../images/head_bg.jpg') repeat-x left top
	}
	
	/* Logo */
		h1#Logo {
			margin: 0;
			padding: 0;
			float: left
		}
		
		h1#Logo a:link, h1#Logo a:visited, h1#Logo a:hover, h1#Logo a:active {
			width: 465px;
			height: 135px;
			margin: 0;
			padding: 0;
			background: #202d5a url('../images/head_home.jpg') no-repeat left top;
			color: #fff;
			text-indent: -9999em;
			display: block
		}
		
	/* Menu */	
		ul#Menu {
			width: 434px;
			float: left;
			margin: 0;
			padding: 0;
			list-style: none;
			list-style-type: none
		}
		
		ul#Menu li {
			margin: 0;
			padding: 0;
			display: inline
		}
		
		ul#Menu li a {
			display: block;
			height: 135px;
			float: left;
			color: #fff;
			background-position: center top;
			text-indent: -9999em
		}
		
		/* Images */
			ul#Menu li a#aboutlink {
				width: 100px;
				background-image: url('../images/head_about.jpg')
			}
			
			ul#Menu li a#extraslink {
				width: 105px;
				background-image: url('../images/head_extras.jpg')
			}
			
			ul#Menu li a#contactlink {
				width: 145px;
				background-image: url('../images/head_contact.jpg')
			}
			
			ul#Menu li a#rsslink {
				width: 84px;
				background-image: url('../images/head_rss.jpg')
			}
			
/* Content space */
	div#Content {
		width: 860px;
		padding: 10px 20px 10px 20px;
		position: relative;
		margin: 0 auto;
		background: #fff url('../images/content_bg.jpg') repeat-x left top
	}
		
/* Footer */
	div#Footer {
		clear: both;
		width: 900px;
		margin: 0 auto;
		font-family: arial, verdana, serif;
		font-size: .9em;
		background: #fff url('../images/footer_bg.jpg') no-repeat center center;
		color: #fff;
		height: 50px;
		line-height: 50px;
		text-align: center
	}
	
	div#Footer p {
		margin: 0;
		padding: 0;
		color: #c6ceea
	}
	
	div#Footer p a:link, div#Footer p a:visited {
		color: #fff
	}
	
	div#Footer p a:hover, div#Footer p a:active {
		color: #93c4db
	}
	
/***** Sections *****/
/* About */
	img#RichardCartoon {
		float: right;
		margin: 0 15px 0 25px;
	}
	
	h2#AboutMuc {
		text-indent: -9999em;
		height: 25px;
		background-image: url('../images/about_head_aboutmuc.gif');
		background-repeat: no-repeat
	}
	
	h2#AboutMe {
		text-indent: -9999em;
		height: 25px;
		background-image: url('../images/about_head_aboutme.gif');
		background-repeat: no-repeat
	}
	
/* Comments */
	/* Navigation */
		div#Nav {
			margin: auto;
			margin-top: -12px;
			width: 111px;
			height: 21px;
			color: #fff;
			font-size: .8em;
			text-align: center;
			background: #fff url('../images/nav.gif') no-repeat center top;
		}
		
		div#Nav #ArchiveLink {
			color: #fff;
			text-decoration: none;
		}

	/* Post Header and Info */	
		span.Categories {
			display: block;
			margin: 0 25px 0 0;
			height: 24px;
			line-height: 24px;
			float: right
		}
		
		span.Categories a, span.CommentsNumber a {
			color: #333;
			text-decoration: none;
		}
		
		span.CommentsNumber {
			display: block;
			float: right;
			width: 47px;
			height: 26px;
			line-height: 23px;
			text-align: center;
			background: url('../images/commentsnumber_bg.gif') no-repeat center center
		}
	
		div.Date {
			width: 34px;
			height: 46px;
			margin: 0 15px 0 0;
			padding: 2px 0 0 0;
			color: #fff;
			font-family: 'trebuchet MS', tahoma, verdana, arial, serif;
			letter-spacing: 0;
			line-height: 1em;
			float: left;
			background: #666 url('../images/date_bg.jpg') no-repeat left top
		}
		
		div.Date span {
			display: block;
			font-weight: bold;
			margin: 4px 0 0 0;
			text-align: center
		}
		
		div.Date .Day { font-size: 1.7em; margin-top: 5px }
		div.Date .Month { font-size: .95em }
		div.Date .Year { margin-top: -2px; font-size: .6em }
	
	/* Post Entry */
		div.Entry {
			clear: both;
			width: 850px;
			text-align: justify
		}
		
		div.Entry img {
			margin: 0 auto
		}
		
	/* Post Comments */
		.Comments {
			width: 100%;
			margin: 40px 0 0 0;
			text-align: justify
		}
		
		.Comments ol#CommentsList {
			margin: 0 auto;
			padding: 0;
			width: 849px;
			list-style: none;
			list-style-type: none
		}
		
		.Comments ol#CommentsList li {
			margin: 10px 0 10px 0
		}
		
		.Comments ol#CommentsList li cite {
			color: #777;
			font-weight: bold;
			display: block;
			float: left;
			width: 75%;
			text-align: left;
			font-style: normal
		}
		
		.Comments ol#CommentsList li cite a:link, .Comments ol#CommentsList li cite a:visited { color: #005888 }
		.Comments ol#CommentsList li cite a:hover, .Comments ol#CommentsList li cite a:active { color: #0098ea }
		
		.Comments ol#CommentsList li span.CommentDate {
			width: 20%;
			text-align: right;
			background-image: url('../images/calendar.gif');
			background-repeat: no-repeat;
			padding-left: 20px;
			line-height: 20px;
			height: 20px
		}
		
		.Comments ol#CommentsList div.CommentInfo {
			height: 50px;
			background: #fff url('../images/comment_cite_bg.jpg') no-repeat left 15px
		}
		
		.Comments ol#CommentsList p {
			margin: 0;
		}
		
		.Comments ol#CommentsList div.CommentCont {
			padding: 0 10px 20px 10px;
			background: #eee url('../images/comment_content_bg.jpg') no-repeat left bottom
		}
		
		.Comments ol#CommentsList div.OwnCommentInfo {
			height: 50px;
			background: #fff url('../images/comment_odd_cite_bg.jpg') no-repeat left 15px
		}
		
		.Comments ol#CommentsList div.OwnCommentCont {	
			padding: 0 10px 20px 10px;
			color: #fff;
			background: #b3b7c7 url('../images/comment_odd_content_bg.jpg') no-repeat left bottom
		}

/* Contact */
	h2#ContactRichard {
		text-indent: -9999em;
		height: 30px;
		background-image: url('../images/contact_richard.gif');
		background-repeat: no-repeat
	}
	
	.inputfield {
		width: 90%;
		margin: 0 auto;
		clear: both;
		text-align: center
	}
	
	.inputfield label {
		display: block;
		width: 30%;
		color: #9C0;
		height: 40px;
		line-height: 40px;
		float: left;
		text-align: right
	}
	
	.inputfield input {
		width: 30%;
		float: left;
		border: 2px solid #e2e2e2;
		padding: 3px;
		font-size: 1.4em;
		font-family: 'trebuchet MS', tahoma, verdana, arial, serif;
		color: #666;
		background: #eee url('../images/input_bg.jpg') repeat-x left top;
		margin: 10px 0 10px 15px
	}
	
	.inputfield textarea {
		width: 45%;
		margin: 10px 0 10px 15px;
		border: 2px solid #e2e2e2;
		padding: 3px;
		font-size: 1.4em;
		font-family: 'trebuchet MS', tahoma, verdana, arial, serif;
		background: #eee url('../images/input_bg.jpg') repeat-x left top;
		color: #666;
		float: left
	}
	
	.inputfield #Submit {
		float: none;
		background-image: none;
		margin: 10px auto
	}
	
/* Extras */
	h2#MoreRichard {
		text-indent: -9999em;
		height: 30px;
		background-image: url('../images/more_richard.gif');
		background-repeat: no-repeat
	}
	
	div#RichardSays {
		width: 250px;
		height: 280px;
		float: left;
		padding-top: 10px;
		background: #fff url('../images/richard_says.jpg') no-repeat left top
	}
	
	div#RichardSays p {
		width: 110px;
		line-height: 1.2em;
		text-align: left;
		margin: 0 0 15px 130px
	}
	
	/* Wallpapers */
		div#MucWallpapers {
			width: 290px;
			float: left;
			margin: 0 0 0 10px;
			padding: 0 0 10px 0;
			background: #333 url('../images/black_gradient.jpg') no-repeat left top
		}
		
		h3#MuWallpapersHead {
			color: #85d2e7;
			margin: 2px 0 0 8px;
			padding: 0;
			font-size: .9em;
			background-image: url('../images/bullet.gif');
			background-repeat: no-repeat;
			background-position: left center;
			text-indent: 15px;
		}
	
		ul#Wallpapers {
			margin: 5px 0 0 4px;
			padding: 0;
			list-style: none;
			list-style-type: none
		}
		
		ul#Wallpapers li {
			float: left;
			width: 86px;
			padding: 0;
			margin: 0 4px 15px 4px
		}
		
		ul#Wallpapers li a img {
			width: 86px;
			height: 65px;
			margin: 0;
			padding: 0;
			background: #333 url('../images/wallpaper_bg.jpg') no-repeat center center
		}
		
		ul#Wallpapers li span.WallpaperResolution {
			color: #fff;
			display: block;
			line-height: 10x;
			letter-spacing: 0;
			width: 86px;
			margin: 0;
			padding: 0;
			font-family: 'trebuchet MS', tahoma, verdana, arial, serif;
			text-align: right;
			font-size: .8em;
		}
		
	/* Avatars */
		div#MucAvatars {
			width: 298px;
			float: left;
			margin: 0 0 0 10px;
			padding: 0 0 10px 0;
			background: #333 url('../images/black_gradient.jpg') no-repeat left top
		}
		
		h3#MuAvatarsHead {
			color: #f90;
			margin: 2px 0 0 8px;
			padding: 0;
			font-size: .9em;
			background-image: url('../images/bullet.gif');
			background-repeat: no-repeat;
			background-position: left center;
			text-indent: 15px;
		}
	
		ul#Avatars {
			margin: 5px 0 0 4px;
			padding: 0;
			list-style: none;
			list-style-type: none
		}
		
		ul#Avatars li {
			float: left;
			width: 64px;
			padding: 0;
			margin: 0 4px 15px 4px
		}
		
		ul#Avatars li a img {
			width: 64px;
			height: 59px;
			margin: 0;
			padding: 0;
			background: #333 url('../images/avatar_bg.jpg') no-repeat center center
		}
		
		ul#Avatars li span.AvatarName {
			color: #fff;
			display: block;
			line-height: 10px;
			letter-spacing: 0;
			width: 64px;
			margin: 0;
			padding: 0;
			font-family: 'trebuchet MS', tahoma, verdana, arial, serif;
			text-align: right;
			font-size: .8em;
		}
	
	p#OffersRight {
		clear: both;
		text-align: right;
		width: 90%;
		margin: 0 auto;
		padding-top: 15px;
	}
	
	#contact_clear {
		height: 100px;
		clear: both;
	}	