/*------------------------------ modern.css ------------------------------
 	
	Modern CSS thweet browsers 
 	These rules take over simple.css to create the hawtness that is this site.
 	komodomedia.com 

/*----------------------- GLOBAL STYLES ---------------------------------*/
html, body{
	width: 100%;
	height:100%;
	margin:0;
	padding:0;
}

html{
	background: #3F3534;
}

body{
	text-align: center;
	color:#3F3534;
	font:70%/145% Verdana,"Trebuchet MS", Arial, Helvetica, sans-serif;
	background:url(images/header_deco.jpg);
	background-position:center 10px;
	background-repeat:no-repeat;
	margin:0px auto 0px auto;
}


html>body hr{
	height:4px;
}

a{
	color:#0099cc;
	text-decoration: none;
}

img.wp-smiley{
	margin:0px;
} 
a img{
	padding: 3px;
	border: 1px solid white;
}
a:hover{
	text-decoration:none;
	border-bottom:1px dotted;
}
a:hover img{
	background-color:#efefef;
	border: 1px solid #cccccc;
}



hr{
	height:5px;
	background: #cccccc;
	border:none;
	border-bottom:2px solid #efefef;
}
html>body hr{
	height:4px;
}
h1, h2, h3, h4, h5{
	font-family:'Trebuchet MS';
}
h1 a, h2 a, h3 a, h4 a, h5 a{
	color:#333333;
}

h1{
	font-size:1.65em;
}
h2{
	font-size:1.4em;
}
h3{
	font-size:1.3em;
}
h4{
	font-size:1.2em;
}
h5{
	font-size:1.0em;
}
blockquote{
	background:#efefef url(images/blockquote.gif) left -10px no-repeat;
	margin:15px 0px 15px 0px;
	padding:0px;
	width:460px;
}
blockquote p{
	background:url(images/rounded_box_bottom.gif) left bottom no-repeat;
	padding:45px 15px 15px 55px;
}

#version{
	background-color: black;
	text-align: left;
	width:100%;
	height:15px;
	color: white;
}


/*----------------------- SITE CONTENT STYLES ----------------------------*/
#content-wrapper{
	width: 500px;
	background: url(images/site_column_footer.gif) left bottom no-repeat;
	float:left;
	clear:left;
	padding:0px;
	margin:0 0 20px 0;
}

html>body #content-wrapper{
	background: url(images/site_column_footer.png) left bottom no-repeat;
}

#content{
	padding:0px 20px 0px 20px;
	margin: 0px 0px 15px 0px;
	width:460px;
	text-align: left;
	float:left;
	background: url(images/site_column_bg.gif) left top repeat-y;
	overflow:hidden;
}



#content img{
	max-width:450px;
	margin:10px;
}

html>body #content{
	background: url(images/site_column_bg.png) left top repeat-y;
}


#site-wrapper{
	width:100%;
	background: url(images/footer_deco.gif) center bottom no-repeat;
	z-index:1000;

}	
#site{
	margin: 0px auto 0px auto;
	padding:0px;
	width:710px;
	position:relative;
	height:100%;
}
#nav{
	right:0px;
	width: 200px;
	position: absolute;
	top: 150px;
	text-align: left;
}
#sub-content{
	float:left;
	clear: left;
	text-align: left;
}
#masthead{
	width: 100%;
	height: 150px;
	margin: 0px;
}
html>body #masthead{

}
#logo-container{
	margin-left: 0px;
	width: 100%;
	height: 147px;	
}
html>body #logo-container{
	

	
}

#home-logo{
float: left;
	width:350px;
	height:147px;
	border:none;
	cursor:pointer;cursor:hand;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/style/images/logo.png',sizingMethod='crop');
		margin-left: 100px;
	background:url(images/logo.jpg) left bottom no-repeat;
	filter:none;	
}

.alt{
	background-color: #e8e8e8;
}
#footer-deco{
	height:180px;
	position:absolute;
	background:url(images/footer_deco.gif) left bottom no-repeat;	
	width:650px;
	bottom:10px;
	left:-65px;
}
#header-deco{
	width:100%;
	height:250px;
	position:absolute;
	top:0px;
	left:0px;
	overflow:hidden;
}
.new-section{
	height:40px;
	width:500px;
	background:#333333 url(images/section_seperator.gif) left top no-repeat;
	position:relative;
	left:-20px;
}
/*----------------------- PRIMARY NAV STYLES ----------------------------*/

/* ---------------------- TAB AND BACKGROUND IMAGE SETUP --------------------------*/
.menu{
height:22px;  
padding-left: 0px;
padding-bottom: 0px;
padding-right: 20px;
padding-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
margin-right: 0px;
margin-top: 0px;
background-color: #2b2424;
list-style-type: none;
list-style:none;
width: 478px;
float:left; 
overflow:hidden;}

.menu ul{
	background-color: black;
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}
.menu ul li{
	background-color: black;
	list-style-type: none;
	padding: 0px;
	float:left;
}
ul#tabunav {background-color: #3f3534;}

ul#tabunav li.first a{
margin-right: 0px;
margin-left: 7px;
margin-bottom: 0px;
margin-top: 0px;
float: left;	list-style-type: none;	height: 20px;	list-style:none;
	width:90px;	
}

ul#tabunav li.active a{
background-color: #d6d6d6;
margin-right: 0px;
margin-left: 7px;
margin-bottom: 0px;
margin-top: 0px;
float: left;	list-style-type: none;	height: 20px;	list-style:none;
	width:90px;	
}

ul#tabunav li a{
background-color: white;
color: black;
margin-right: 0px;
margin-left: 1px;
margin-bottom: 0px;
margin-top: 0px;
float: left;	list-style-type: none;	height: 20px;	list-style:none;
	width:90px;	
}



/*ul#tabunav a{background-color: #3f3534; float:left;width: 7em;padding: 5px 0;text-decoration:none;color: white}*/

ul#tabunav li a:hover{
	background-color: #E8E8E8;
}
.navbox{
	margin:0px 0px 10px 0px;
	padding:15px 0px 0px 0px;
	width:200px;
	position:relative;
	background:transparent url(images/nav_box_top.gif) left top no-repeat;
}
html>body .navbox{
	background:transparent url(images/nav_box_top.png) left top no-repeat;
}

.navbox .navbox-content{
	padding:0px 15px 0px 15px;
	background:transparent url(images/nav_box_bg.gif) left top repeat-y;
}
html>body .navbox .navbox-content{
	background:transparent url(images/nav_box_bg.png) left top repeat-y;
}
.navbox h1{
	display:none;
}
.navbox h2{
	margin:0;
	line-height:2.0em;
}
#nav ul, #nav ul li{
	list-style:none;
	list-style-image:none;
	margin:0px;
	padding:0px;
}

.navbox .navbox-footer{
	height:15px;
	width:200px;
	background:url(images/nav_box_footer.gif) left top no-repeat;
}
html>body .navbox .navbox-footer{
	background:url(images/nav_box_footer.png) left top no-repeat;
}
.navbox .alt{
	background:#e8e8e8 url(images/nav_list_alt_bottom.gif) left bottom no-repeat;
}
.navbox .alt a{
	background:url(images/nav_list_alt_top.gif) left top no-repeat;
}
.navbox a{
	display: block;
	padding:2px 5px 2px 5px;
	border:none;
	margin:0px;
	width:auto;
	outline: none;
	text-decoration:none;
}

.navbox .navbox-content a:hover{
	border:none;
	outline: none;
	background:url(images/nav_list_alt_top_over.gif) left top no-repeat;
	padding-left:25px;
	overflow:hidden;
}
#spinning a:hover{
	padding:2px 5px 2px 5px;	
	background:url(images/nav_list_alt_top.gif) left top no-repeat;
}
.navbox a:hover img{
	border:none;
}
.navbox li{
	padding:0px;
	margin:0px;
	/* 	some sort of a hack to get IE to 
		correctly apply the height to the li elements */
	height:1em;	
}
html>body .navbox li{
	width:auto;
	height:auto;
}
.navbox ul.tabbed{
	height:200px;
	width:170px;
	overflow:auto;
	display:none;
}
.navbox ul.tabbed li{
	width:auto;
}

.navbox ul.focused{
	display:block;
}

/*.wide .nav-group{
	margin:0px 10px 0px 0px;
	float:left;
}*/

#entertainment{
	clear: right;
}

.navbox .footer-tabs{
	height:45px;
	width:200px;
	background:url(images/nav_box.gif) left bottom no-repeat;	
}
html>body .navbox .footer-tabs{
	background:url(images/nav_box.png) left bottom no-repeat;
}
.navbox-tabs{
	background:url(images/nav_box_footer_tabs.gif) left bottom no-repeat;
	position:relative;
	top:3px;
	width:200px;
	height:45px;
}
html>body .navbox-tabs{
	background:url(images/nav_box_footer_tabs.png) left bottom no-repeat;
}
.navbox-tabs li,.navbox-tabs li a,.navbox-tabs li a span{
	float:left;
	width:100px;
	height:45px;
	display:block;
	padding:0px;
	margin:0px;
	overflow:hidden;
}
.navbox-tabs li a{
	/*
	position:absolute;
	left:0px;
	width:105px;
	*/
	cursor:pointer;cursor:hand;
}
html>body .navbox-tabs  li a{
}
.navbox-tabs li a span{
	text-indent:-9000px;
	background-position:left bottom;
	background-repeat: no-repeat;
}
.navbox-tabs li a:hover span, .navbox-tabs li a.focused span{
	background-position:left top;
}

/*---------------- LEFT SIDE NAV BOX TABS ------------------------------*/
.navbox-tabs li#navbox-tab-about a span{
	background-image:url(images/nav_box_tab_about.gif);
}

.navbox-tabs li#navbox-tab-design a span{
	background-image:url(images/nav_box_tab_design.gif);
}

.navbox-tabs li#navbox-tab-categories a span{
	background-image:url(images/nav_box_tab_categories.gif);
}

.navbox-tabs li#navbox-tab-spinning a span{
	background-image:url(images/nav_box_tab_music.gif);
}

.navbox-tabs li.even a.focused{
	background:url(images/nav_box_footer_tabs.gif) left top no-repeat;
}
html>body .navbox-tabs li.even a.focused{
	background:url(images/nav_box_footer_tabs.png) left top no-repeat;
}

/*------------------------ RIGHT SIDE NAV BOX TABS ------------------------------*/
.navbox-tabs li#navbox-tab-portfolio a span{
	background-image:url(images/nav_box_tab_portfolio.gif);
}
.navbox-tabs li#navbox-tab-other-links a span{
	background-image:url(images/nav_box_tab_other.gif);
}
.navbox-tabs li#navbox-tab-archive a span{
	background-image:url(images/nav_box_tab_archive.gif);
}
.navbox-tabs li#navbox-tab-gaming a span{
	background-image:url(images/nav_box_tab_play.gif);
}
.navbox-tabs li.odd a{
	left:95px;	
}
.navbox-tabs li.odd a.focused{
	background:url(images/nav_box_footer_tabs.gif) right center no-repeat;
}
html>body .navbox-tabs li.odd a.focused{
	background:url(images/nav_box_footer_tabs.png) right center no-repeat;
}
/*--------------------- ROTATING CSS ( STYLES THAT AREN'T PERMANENT - CONTENT STYLES) -----------------------------*/

ul.of-interest{
	margin: 10px 0px 10px 0px;
	padding: 0px;
	position: relative;
	height: 155px;
	width: 460px;
	list-style-type:none;
}
ul.of-interest li{
	padding: 0px;
	margin: 0px;
	background: none;
	list-style: none;
	list-style-image: none;
	float:left;
}
ul.of-interest li a{
	display: block;
	float: left;
	text-indent:-9000px;
	text-decoration:none;
	height: 155px;
	background:none;
	background-image: url(/images/topic_bar.gif);
	background-repeat: no-repeat;
	padding: 0px;
	margin: 0px;
	border:none;
	overflow:none;
}
ul.of-interest li a:hover{
	text-decoration:none;
}
ul.of-interest li a:active{
}

a#bragging-rights{
	background-position: left top;
	width: 150px;
}
a#tutorial-star-rater{
	background-position: center top;
	width: 160px;
}
a#interesting{
	background-position: right top;
	width: 150px;	
}
a#bragging-rights:hover{
	background-position: left bottom;
}
a#tutorial-star-rater:hover{
	background-position: center bottom;
}
a#interesting:hover{
	background-position: right bottom;
}
a#feedburner-link{
	float: right;
	padding: 0px;
	margin: 0px;
	background: none;
	position: relative;
	border:none;
}
/*------------------------------------ MUSIC PAGE STYLES ------------------------------------------*/

.album-image{
	text-align:center;
}

/*------------------------------------ SITE FORM STYLES ------------------------------------------*/

#content textarea{
	width:440px;
}

fieldset{
	border:none;
	margin:0px;
	padding:0px;
}
input, textarea{
	background: url(images/input_bg.gif) left top no-repeat;
	font-family: inherit;
	font-size: inherit;
	line-height:inherit;
	color: inherit;
	border-top: none;
	border-left: none;
	border-bottom: 1px solid #bfbfbf;
	border-right: 1px solid #bfbfbf;	
	padding: 5px;
	margin: 5px;
}
textarea{
	background-attachment:fixed;
}
html>body textarea{
	background-attachment:scroll;
}
input:focus, textarea:focus{
	color:#333333;
}

label{
	margin:0px 5px 0px 5px;
}
input.button{
	padding:0px;
	border:none;
	margin:5px;
	background:none;
	cursor:pointer;cursor:hand;
}
input#search-submit{
	margin:0px;
}
.loading{
	width:20px;
	height:25px;
	background:url(/style/images/ajax_load_small.gif) left top no-repeat;
}

.invalid{
background-color:#FB8F00;}

.required{
background-color:#FB8F00;}
/*-------------------------------------------- Link Love -------------------------------------------------*/

.link-love{
	
}
.link-love ul{
	list-style:none;
	margin:5px auto 5px auto;
	padding:0px 0px 0px 0px;
	clear:both;
	text-align:left;
}
.link-love h1, .link-love h2, .link-love h3{
	clear:both;
}
.link-love ul li{
	float:left;
	margin:0px;
	padding:0px;
}
.link-love ul li a img{
	width:75px;
	height:57px;
	margin:5px;	
	padding:0px;
	float:left;
	background:url(/style/images/ajax_load_small.gif) center center no-repeat;
}
.link-love a{
	float:left;
	width:85px;
	padding:0px;
	height:100px;
	display:block;
	margin-right:2px;
	text-align:center;
	border:1px solid #ffffff;
}
.link-love a:hover{
	background:#eeeeee;
	border:1px solid #ddd;
}
.link-love a:hover img{
	border:none;
}
.link-love a img{
	float:left;
	border:none;
}
.link-love-deco{
	background:url(images/link_love.gif) left center no-repeat;
	height:40px;
	padding:0px 0px 0px 45px;
}
/*-------------------------------- PSPS Safari hack ------------------------------------------------------*/
.psps{font:normal;#}

