/*
	design.css (extends core.css)
	contains all design specific colors, images and text formatting
	
	All style rule attributes in alpha-numeric order starting from 0-9 A-Z
	x = horizontal, y = vertical
	property: trbl, tb rl, t rl b, t r b l;
	
	-- START ALL STYLES --
*/


/* color glossary
-----------------------------------------------------------------------------
	
	#F0EEE4 (main background)
	#F6F5EF (content background)
	#EFEDE4 (droppings backaground)
	#EAE7DA (header borders)
	#F7F5D5 (highlight background)
	#444131 (main text color)
	#D5CFB2 (footer text color)
	#563C2F (menu brown)
	#AD102E (mdot red)
	#46A2C0 (mdot blue)
	#8D6EB1 (mdot purple)
	
*/

/* import additional sheets
----------------------------------------------------------------------------- */

@import url("core.css");

/* design specific presentational elements
----------------------------------------------------------------------------- */

body{
	background: #F0EEE4;
	color: #444131;
	font: normal normal 12px "Arial", Sans-Serif;
}

/* global text presentation
----------------------------------------------------------------------------- */

code, samp, kbd, var{ font-family: "Courier New", "Courier", Monospace; }

h1, h2, h3, h4, h5, h6, b, strong{ font-weight: bold; }
i, em, cite, dfn, ins{ font-style: italic; }
del, code, samp, kbd, var{ font-style: inherit; }

del{ text-decoration: line-through; }
ins{ text-decoration: none; }

abbr, acronym{ border: 0; cursor: help; text-decoration: none; }

h1{ font-size: 24px; }
h2{ font-size: 20px; }
h3{ font-size: 18px; }
h4{ font-size: 16px; }
h5{ font-size: 14px; }
h6{ font-size: 13px; }

ul, dl{ list-style: square; }
ol{ list-style: decimal; }

li, dt, dd,
p, pre, address,
legend, label, input, textarea, 
select, option, optgroup,
th, td{ font: inherit; }

small{ font-size: 10px; } 	/* 2px smaller, than body base */
big{ font-size: 14px; } 	/* 2px larger, than body base */

img.float-left,
img.float-right{
	background: #FFF;
	border: 1px solid #999;
	margin: 0 10px 5px;
	padding: 3px;
}

img.float-left{ margin-left: 0; }
img.float-right{ margin-right: 0; }

/* hyperlinks
----------------------------------------------------------------------------- */

a{ text-decoration: underline; }
.no-decor a{ text-decoration: none; }

#content-wrap a:link, 
#content-wrap a:visited{ color: #AD102E; }

#content-wrap a:hover, 
#content-wrap a:active{ color: #333; }

/* forms
----------------------------------------------------------------------------- */

label{
	font-size: 12px;
	font-weight: bold;
}

input,
select,
textarea{
	background: #FFF;
	border: 1px solid;
	border-color: #AAA #CCC #CCC #AAA;
	padding: 3px 5px;
	width: 300px;
}

textarea{ height: 150px; width: 550px; }

select,
.button input,
.chad input{ width: auto; }

fieldset.button{ text-align: right; }

	.button input{
		background: #000;
		border: 0;
		color: #FFF;
		text-transform: uppercase;
	}

	.chad input{ 
		background: transparent;
		border: 0;
		vertical-align: middle; 
	}

/* design specific presentational ID's
----------------------------------------------------------------------------- */

#wrap{}

#masthead{
	background: transparent url(img/m_shadow.gif) repeat-x 0 100%;
	position: relative;
}

#masthead-inner{
	background: transparent url(img/m_mh_logo.gif) no-repeat 100% 100%;
	padding: 15px 0 20px 30px;
}

	#masthead #mdot{
		background: transparent url(img/mdot_logo.gif) no-repeat 0 0;
		bottom: -5px;
		height: 15px;
		position: absolute;
		right: 78px;
		width: 44px;
	}

	#masthead h1{
		background: transparent url(img/m_logo.gif) no-repeat 0 0;
		height: 27px;
		text-indent: -130000em;
		width: 217px;
	}
	
		#masthead h1 a:link,
		#masthead h1 a:visited{
			display: block;
			height: 27px;
			width: 217px;
		}
	
	#masthead ul{
		list-style: none;
		margin: 15px 0 0;
	}
	
		#masthead ul li{
			background: transparent url(img/m_nav_dot.gif) no-repeat 0;
			float: left;
			font-size: 16px;
			padding: 0 10px 0 12px;
		}
		
			#masthead ul li.first{
				background: none;
				padding-left: 0;
			}
	
			#masthead ul li a:link,
			#masthead ul li a:visited{
				border-bottom: 2px solid #F0EEE4;
				color: #563C2F;
				text-decoration: line-through;
			}
			
			#masthead ul li a:hover,
			#masthead ul li a:active{ border-color: #AD102E; }

#content-wrap{
	background: #F6F5EF;
	min-width: 925px;
	padding: 20px 0 20px 30px;
}

#sidebar,
#sb-icons,
#column{ float: left; }

#sidebar{
	background: transparent url(img/m_sb_fill.gif) repeat-y 0 0;
	margin-right: 3px;
	width: 294px;
}

	#sidebar div.drop-wrap{
		background: transparent url(img/m_drop_sep.gif) no-repeat 100% 100%;
		margin: 0 16px 12px;
		padding: 0 0 14px;
	}

	#sidebar h2{
		background: transparent url(img/m_sb_head.gif) no-repeat 0 0;
		color: #563C2F;
		font-size: 18px;
		padding: 20px 20px 10px;
	}
	
	#sidebar h3{
		color: #ABA89C;
		font-size: 10px;
		margin: 10px 20px;
		text-transform: uppercase;
	}
	
	#sidebar p{
		color: #777466;
		font-size: 11px;
		margin: 5px 6px;
	}
	
		#sidebar p em,
		#column p em{
			background: #F7F5D5;
			font-style: normal;
			padding: 0 5px 0 0;
		}
	
	#sidebar div.foot{
		background: transparent url(img/m_sb_foot.gif) no-repeat 0 100%;
		padding: 5px 20px 15px;
	}

#sb-icons{
	list-style: none;
	margin: 48px 0 0;
	width: 72px;
}

	#sb-icons li{
		height: 15px;
		margin: 0 0 5px;
	}
	
	#sb-icons li a:link,
	#sb-icons li a:visited{
		background: transparent url(img/m_icon_game.gif) no-repeat 0 0;
		display: block;
		height: 15px;
		text-indent: -130000em;
		width: 72px;
	}
	
		#sb-icons li.photo a:link,
		#sb-icons li.photo a:visited{ background-image: url(img/m_icon_photo.gif); }
	
		#sb-icons li.thoughts a:link,
		#sb-icons li.thoughts a:visited{ background-image: url(img/m_icon_thought.gif); }
	
		#sb-icons li.quotes a:link,
		#sb-icons li.quotes a:visited{ background-image: url(img/m_icon_quote.gif); }
	
		#sb-icons li.movies a:link,
		#sb-icons li.movies a:visited{ background-image: url(img/m_icon_movie.gif); }
	
		#sb-icons li.music a:link,
		#sb-icons li.music a:visited{ background-image: url(img/m_icon_music.gif); }
	
		#sb-icons li.art a:link,
		#sb-icons li.art a:visited{ background-image: url(img/m_icon_art.gif); }
	
		#sb-icons li.books a:link,
		#sb-icons li.books a:visited{ background-image: url(img/m_icon_book.gif); }
	
		#sb-icons li.cool a:link,
		#sb-icons li.cool a:visited{ background-image: url(img/m_icon_cool.gif); }
	
	#sb-icons li a:hover,
	#sb-icons li a:active{ background-position: 0 -15px; }

#column{
	margin-right: 13px;
	width: 510px;
}

	#column div.drop-wrap{
		border-bottom: 1px solid #EAE7DA;
		margin: 0 0 15px 16px;
		padding: 0;
	}

	h2,
	#column h3{
		font-family: "Trebuchet MS", Sans-Serif;
		font-weight: normal;
		text-transform: lowercase;	
	}

	#column h2{
		color: #46A2C0;
		font-size: 24px;
	}
		
	#column h3{
		color: #8D6EB1;
		font-size: 20px;
	}
	
		#column h2 span,
		#column h3 span{
			border-bottom: 2px solid #EAE7DA;
		}
		
		#column h3:first-letter{ font-weight: bold; }
		
		#column h3 em.dot{
			background: transparent url(img/m_p_dot.gif) no-repeat 2px 0;
			color: #F6F5EF;
			font-size: 0;
			padding: 10px 8px 0;
		}
		
	#column p{
		line-height: 1.3;
		margin: 15px 0;
	}
	
		#column p strong.games,
		#column p strong.photo,
		#column p strong.thoughts,
		#column p strong.quotes,
		#column p strong.movies,
		#column p strong.music,
		#column p strong.art,
		#column p strong.books,
		#column p strong.cool{ 
			background-color: transparent;
			background-position: 0 0;
			background-repeat: no-repeat;
			padding: 0 0 1px 18px; 
		}

		#column p strong.games{ background-image: url(img/m_icon_game.gif); }
		#column p strong.photo{ background-image: url(img/m_icon_photo.gif); }
		#column p strong.thoughts{ background-image: url(img/m_icon_thought.gif); }
		#column p strong.quotes{ background-image: url(img/m_icon_quote.gif); }
		#column p strong.movies{ background-image: url(img/m_icon_movie.gif); }
		#column p strong.music{ background-image: url(img/m_icon_music.gif); }
		#column p strong.art{ background-image: url(img/m_icon_art.gif); }
		#column p strong.books{ background-image: url(img/m_icon_book.gif); }
		#column p strong.cool{ background-image: url(img/m_icon_cool.gif); }
	
		#column p.note{
			background: transparent url(img/m_note_dot.gif) no-repeat 5px;
			font-size: 11px;
			margin: -15px 0 0;
			padding: 5px 0 5px 20px;
		}
		
		#column p.warning{
			background: #F7F5D5;
			border: 1px solid #BBB55F;
			font-weight: bold;
			padding: 5px;
		}
		
			#column p.warning strong{ color: #AD102E; }
			
		#column .pages{
			border: 1px solid #EAE7DA;
			padding: 8px;
		}
		
		#column p.pages b,
		#column p.pages a:link,
		#column p.pages a:visited{
			font-size: 14px;
			text-decoration: none;
		}

#footer{
	background: transparent url(img/m_shadow.gif) repeat-x 0 0;
	position: relative;
}

#footer-inner{
	background: transparent url(img/m_footer_logo.gif) no-repeat 100% 0;
	padding: 25px 0 25px 30px;
}

	#footer #mdot{
		background: transparent url(img/mdot_logo_foot.gif) no-repeat 0 0;
		height: 15px;
		position: absolute;
		right: 78px;
		top: -7px;
		width: 44px;
	}

	#footer p{
		color: #D5CFB2;
		font-size: 24px;
	}

/* design specific presentational classes
----------------------------------------------------------------------------- */

.half-box{ float: left; width: 250px; }

/*
	-- /END ALL STYLES --
	
	- Please do not steal my code!
	- "I cannot abide useless people"
	- Thank you, I appreciate it.
*/