/*controllercontroller.com CSS stylesheet*/
/*author: Kevin Finlayson*/
/*company: Dust and Mold*/

/*dissect only*/

/*

1. universal reset
2. structure
		i) global
		ii) sections
		iii) forms
		iv) special
3. typography
		i) global
		ii) special
		iii) sIFR
4. navigatino		
5. accessibility
6.  special

*/


/*1. UNIVERSAL RESET*/

* {
	padding: 0px;
	margin: 0px;
}

/*2. STRUCTURE*/

/*i) global*/

body {
	background: #dedede url("comps/bg.gif") repeat-x top left;
	color: #555555;
	font: 10px/1.3em verdana, "Lucida Grande", "Lucida Sans", arial, sans-serif;

}

#wrapper {
	width:800px;
	height: auto;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;
	background: transparent url("comps/ccbody.gif") repeat-y top left;
}

#header {
	background: transparent url("comps/cchead2.jpg") no-repeat top left;
	width: 800px;
	height: 180px;
}

#navstrip {
	background: transparent url("comps/ccnav1.jpg") no-repeat top left;
	width: 690px;
	\width: 800px;
	w\idth: 690px;
	padding-left: 110px;
	height: 94px;
	position:relative;
	overflow: hidden;
}

#main {
	background: transparent url("comps/ccmain.jpg") no-repeat top left;
	width: 760px;
	\width: 800px;
	w\idth: 760px;
	height: auto;
	min-height: 300px;
	padding: 20px 20px 0px 20px;
	position: relative;
}

#footer {
	background: transparent url("comps/ccfoot1.jpg") no-repeat top left;
	width: 760px;
	\width: 800px;
	w\idth: 760px;
	height: 279px;
	clear: both;
	padding: 25px 20px 0px 20px;
	position:relative;
	overflow: hidden;	
}

#footerleft {
width:200px;
height: 219px;
float:left;
background-color: transparent;
margin-bottom: 25px;
position:absolute;
left: 70px;
top: 20px;
}

#footerright {
width: 210px;
height: 219px;
background-color: transparent;
float: right;
margin-bottom: 25px;
position: absolute;
top: 20px;
left:530px;
}

#footercenter {
width: 200px;
height: 219px;
background-color: transparent;
margin-bottom: 25px;
position: absolute;
top: 20px;
left: 300px;
}	

#footerleft p {
	margin-top: 6px;

}


blockquote
{
	margin: 15px 30px 0 10px;
	padding-left: 20px;
	border-left: 5px solid #ddd;
}

/*ii) sections*/

/* front page */

#side {
	width: 305px;
	\width: 385px;
	w\idth: 305px;
	height: auto;
	min-height: 300px;
	padding: 0px 50px 20px 30px;
	float: right;
	background: transparent;

}

#content {
	width: 305px;
	\width: 375px;
	w\idth: 305px;
	height: auto;
	float:left;
	min-height: 600px;
	padding: 0px 20px 20px 50px;
	background-color: transparent;
}

#marquee {
	background-color: transparent; 
	position: relative;
	width: 660px;
	\width: 760px;
	w\idth: 660px;
	padding: 0px 50px 0px 50px;
	margin-bottom: 30px;
}

/*bio, releases, media*/

#fullpage {
	width: 660px;
	\width: 760px;
	w\idth: 660px;
	padding: 0px 50px 0px 50px;
	height: auto;
	position: relative;
}

#fullpage p, #articlecontent p, #side p {
	margin-bottom: 1em;
}

.releases {
width: 400px;
margin-bottom: 20px;
clear:left;
margin-top: 20px;
}

/*tourdiary, news, gallery*/

#sidebar {
	width: 200px;
	\width: 290px;
	w\idth: 200px;
	height: auto;
	min-height: 300px;
	padding: 0px 50px 0px 20px;
	float: right;
	background: transparent;
	margin-top: -25px;
}

#articlecontent {
	width: 420px;
	\width: 470px;
	w\idth: 420px;
	height: auto;
	min-height: 300px;
	padding: 0px 0px 0px 50px;
	float:left;
	background-color: transparent;
}

#bodygallery #articlecontent {
		width: 540px;
	\width: 590px;
	w\idth: 540px;
	}

#bodygallery #sidebar {
	width: 100px;
	\width: 150px;
	w\idth: 100px;
	padding-left: 0px;
	}

/*3. TYPOGRAPHY*/

/*i) global*/

p {
	display: block;
}

a, a:visited {
	color: #229bce;
	text-decoration: none;
	background-color: transparent;
}

a:hover {
		color: #229bce;
	text-decoration: underline;


}


h1, h2, h3, h4 {
	font-family: 'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, helvetica, Sans-Serif;
	color: #232323;

}

h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited, h4 a, h4 a:visited {
	text-decoration: none;
	padding: 0;
	background-image: none;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
	text-decoration: none;
	background-color: transparent;
}

h1 {
	font-size: 30px;
}

h2 {
	color: #232323;	
font-size: 21.8px;
letter-spacing: -1px;
padding-left: 30px;
margin-left: -30px;
margin-bottom: 5px;
background: transparent url("comps/marginicon.gif") no-repeat top left;
font-weight: normal; 
line-height: 1em;
}

h2 a, h2 a:visited {
	color: #232323;
	background-color: #ffffff;
	text-decoration: none;
}

h2 a:hover {
	color: #000000;	
}

h3, h3 a, h3 a:visited {
	line-height: 1.3em;
	font-weight:normal;
letter-spacing: -1px;
font-size: 16.4px;
color: #666666;
margin-top: 10px;
background-color: transparent;
text-decoration: none;
}

h3 a:hover {
	color: #232323;
	background-color: #efefef;
	border-bottom: 1px dotted #cccccc;
}


* html h3, * html h3 a, * html h3 a:visited {
font-weight: bold;
}


#footer p {
	color: #7f875e;
	font-size: 93%;
}

#footer a, footer a:visited {
	color: #646c46;
	background-color: transparent;
text-decoration: none;
}

#footer a:hover {
	text-decoration: underline;
	background-color: transparent;
}

#footer h2 {
	color: #959E6F;
	text-decoration:none;
	background: transparent url("comps/marginiconfooter.gif") no-repeat top left;
}

#footer h2 a, #footer h2 a:visited {
	color: #959E6F;
	text-decoration:none;
	background-color: transparent;
}

#footer h2 a:hover {
	color: #7f875e;
	text-decoration:none;
	background-color: transparent;
}

#footer h3, #footer h3 a, #footer h3 a:visited {
	color: #85896B;
		text-decoration:none;
	background-color: transparent;

}

#footer h3 a:hover {
	color: #484C39;
	background-color: #E0DABD;
text-decoration: none;
	border-bottom: 1px dotted #918B6D;
}

.footer {
position:absolute;
top: 260px;
}

.footer, p.footerpromo, a.footerpromo, a.footerpromo:visited, a.footer, a.footer:visited {
	color: #888888 !important;
	font-size: 93%;
	font-weight: normal;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Sans-Serif;
	margin-left: 0px;
}

a.footerpromo, a.footerpromo:visited {
	font-size: 93%;
	position:absolute;
	top: 260px;
	right: 20px;
}

a.footerpromo:hover, a.footer:hover {
	color: #888888 !important;
	text-decoration: underline;
	background-color: transparent;
}

a.footer {
position:absolute;
left:300px;
}

.rssCcat, .rssCcat a, .rssCcat a:visited, .category_list, .category_list a, .category_list a:visited {
letter-spacing: -1px;
line-height: 1.3em;
font-size: 16.4px;
color: #555555;
margin-top: 10px;
background-color: #ffffff;
text-decoration: none;
margin-bottom: 0.5em;
} 

p.footerpromo {
position:absolute;
right: 120px;
top:260px;
}

.rssCcat a:hover, category_list a:hover {
	color: #232323 !important;
	background-color: #efefef !important;
	border-bottom: 1px dotted #cccccc !important;
}
/* ii)special */

	
a.mail, a.mail:visited, a.mail:hover {
	padding-left: 20px;
	background: transparent url("comps/mailicon.gif") no-repeat top left; 
	position:absolute;
	right: 70px;
	color: #ee550a;
	margin-top: 60px;
	font-weight: bold;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Sans-Serif;
}

.orange {
color: #ee550a;
}

.playingwith, .caption, .biocaption {
	color: #999999;
	font-style: italic;
}

.caption {
	font-size: 93%;
	position: absolute;
	right: 50px;
	top: 415px;
}

.biocaption {
	font-size: 93%;
	position: absolute;
	right: 50px;
	top: 343px;
}

.info {
	color: #bbbbbb;
	font-size: 93%;
}

#footer .info {
	color: #A5B562;
	margin-bottom: -10px;
	font-size: 100%;
}

.name {
	color: #999999;
	background-color: #ffffff;
	font-size: 93%;

}

div.itemlinks a, div.itemlinks a:visited, div.itemlinks a:hover {
	color: #999999;
	background-color: #ffffff;
	font-size: 93%;
}

div.itemlinks a:hover {
	text-decoration: underline;
}

a.dark, a.dark:visited, a.dark:hover {
	color: #9d8448;
	background-color: #ffffff;
	font-size: 93%;
	font-weight: bold;
}

a.dark:hover {
	text-decoration: underline;
}

a.fancy, a.fancy:visited {
	color: #9d8448;
	font-family: "Lucida grande", "Lucida sans unicode", "Trebuchet MS", Sans-serif;
	text-decoration: none;
	padding-right: 15px;
	background: transparent url("comps/link.gif") no-repeat top right;
	font-size: 105%;
}

a.fancy:hover {
		color: #9d8448;
		font-family: "Lucida grande", "Lucida sans unicode", "Trebuchet MS", Sans-serif;
	text-decoration: underline;
	background-color: transparent;
}

.newslink {
	padding-left: 23px;
	background: transparent url("comps/newsicon.gif") no-repeat top left;
}

.diarylink {
	padding-left: 17px;
	background: transparent url("comps/diaryicon.gif") no-repeat top left;
}

.large {
	font-size: 150%;
}

/*iii) sIFR*/

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}


/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h2 {
	visibility: hidden;
	font-size: 18px;
	line-height: 27px;
}


/*4. NAVIGATINO */

/* i) ul */ 

ul#nav {position: relative; top: 0; left: 0; }

ul#nav {background:transparent url("comps/ccspritegrid2.jpg") no-repeat top left; }


ul#nav li {display: inline;}
ul#nav li a {
	display: block;
	position: absolute;
	top: 0;
	width: 0px;
	/*text-indent: -100px; */
	text-decoration: none;
	padding: 94px 0 0 0;
	overflow: hidden;
	height: 0px !important;
	height /**/:94px; /* IE5/Win */
	background: transparent url(comps/ccspritegrid2.jpg) no-repeat top left;
}

/* ii) magical sprite grid */
ul#nav li#news a {background-position: 0px 0px; width: 55px; left: 0;}
ul#nav li#news a:hover {background-position: 0px -94px;}

ul#nav li#bio a {background-position: -55px 0px; width: 35px; left: 55px;}
ul#nav li#bio a:hover {background-position: -55px -94px;}

ul#nav li#rel a {background-position: -90px 0px; width: 70px; left: 90px; }
ul#nav li#rel a:hover {background-position: -90px -94px;}

ul#nav li#med a {background-position: -160px 0px; width: 55px; left: 160px;}
ul#nav li#med a:hover {background-position: -160px -94px;}

ul#nav li#gal a {background-position: -215px 0px; width: 55px; left: 215px;}
ul#nav li#gal a:hover {background-position: -215px -94px;}

ul#nav li#mer a {background-position: -270px 0px; width: 55px; left: 270px;}
ul#nav li#mer a:hover {background-position: -270px -94px;}

ul#nav li#tou a {background-position: -325px 0px; width: 75px; left: 325px;}
ul#nav li#tou a:hover {background-position: -325px -94px;}

ul#nav li#for a {background-position: -400px 0px; width: 50px; left: 400px;}
ul#nav li#for a:hover {background-position: -400px -94px;}


/*5. ACCESSIBILITY*/

#accessibility {
	position: absolute;
	top: -10000px;
text-indent: -1999px;
}

a.logo_outdent {
	display: block;
	height: 130px;
	width:320px;
	text-indent: -1999px;
background-color: transparent;
}

/*6. SPECIAL*/

img {
	padding: 5px;
	border: 1px solid #cccccc;	
}

.divider {
	padding:0px;
	border: none;
	margin:20px 0px 20px 0px;
}

.clean {
	padding:0px;
	border: none;
	margin:0px;
}

.left {
	float: left;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-right: 5px;
}

.leftrelease {
	float: left;
	margin-top: 5px;
	margin-bottom: 30px;
	margin-right: 5px;
}


.right {
	float: right;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-left: 5px;
}

.rssThumb {
	float:left;
	margin: 0px 10px 10px 0px;
	padding: 3px;
	border: 1px solid #cccccc;
	background-color: #ffffff;
}

#footerright .rssThumb {
margin: 10px 5px 0px 0px;
background-color: #959E6F;
border: 0px;
}q

.rssFull img {
border: 1px solid #cccccc;
}

.rssFull {
margin-bottom: 20px;
margin-top: 20px;
}

#fullsize {
margin-bottom: 20px;
}

.marquee_box {
padding: 4px; 
border: 1px solid #999999; 
padding-bottom: 4px;

}

.articleimage {
max-width:410px;
margin-bottom: 20px;
}

#desc {
color: #ffffff;
}

#articlecontent img {
margin-right: 10px;
margin-bottom:10px;
background-color:transparent !important;
}


/* 6. COMMENTS*/

#comments {
width: 360px;
height: auto;
min-height: 40px;
margin-top: 20px;
padding: 10px 10px 20px 10px;   
float:none;
}

.even {
background: #efefef url("comps/comment_even.gif") bottom left;
background-repeat: no-repeat;
}

.odd {
background: #dedede url("comps/comment_odd.gif") bottom left;
background-repeat: no-repeat;
}

.mycomment {
background: #D7F2FF url("comps/mycomment.gif") bottom left;


}

#cmntform {
width: 360px;
float:none;
margin: 20px 0px 20px 0px;
padding: 10px 10px 20px 10px;
background-color:#efefef;
border: 1px solid #dedede;

}

#cmntform span {
display: block;
}

#cmntform label {
float: left;
width: 90px;
}

#cmntform p {
font-size: .93em;
}

#cmntform .button {
margin: 0 25px 0 0;
}

.cmnt img {
border: 1px solid #333;
height: 40px;
width: 40px;
margin: 0 10px;
background: #DCEEC9 url(/img/grav.jpg);
}

.cmnt {
margin: 10px 0;
padding: 5px 0;
color: #333;
}

.cmnt a, .cmnt a:visited { color: #496C23; text-decoration: none; }

.cmsg {
padding: 5px 0 0 0;
border-top: 1px solid #333;
}


.mycmnt { background: #DCEEC9; font-weight: bold; }
.mycmnt .cmsg { font-weight: normal; }

.cmntinner {
padding: 0 15px;
margin: 0 80px 0 0;
}

.gravatar {
width:35px;
height:35px;
margin:0px 5px 10px 0px;
background-color: #ffffff;
padding: 2px;
float:left;
background-image: url("comps/gravatar.png");
}

#footerright img {
width:40px;
height:40px;
}


/* 7? THUMBS*/

li.right {
float: none;

	font-weight: normal;
letter-spacing: -1px;
font-size: 11.8px;
color: #555555;
margin-bottom: 10px;
background-color: transparent;
text-decoration: none;
position: absolute;
right: 10px;
bottom: -10px;
}

li.left {
float: none;

	font-weight: normal;
letter-spacing: -1px;
font-size: 11.8px;
color: #555555;
margin-bottom: 10px;
background-color: transparent;
text-decoration: none;
}


ul#rssThumbNav {
list-style: none;
width: 540px;
position:relative;
}

#bodygallery #articlecontent img {
	width: 70px;
	height: 70px;
	border: 0;
	padding: 0;
	margin:0;
	margin-bottom: 5px;
	}

#bodygallery #articlecontent .rssThumbFloat {
background-color: #efefef;
float: left;
width: 70px;
\width: 78px;
w\idth: 70px;
margin-right: 10px;
margin-bottom: 10px;
font-size: 93%;
color: #777777;
height: 100px;
padding: 4px;
overflow: hidden;
border: 1px solid #dedede;
}

#videocontainer {
	width: 310px;
	margin-right: 20px;
	height: 140px;
	float: left;
	margin-bottom: 10px;
}

#videocontainer p {
}

#vidlink {
	float: left;
	margin-right: 10px;
}

#main h3 {
	clear:both;
	margin: 20px 0px 10px 0px;
}

#videocontainer h4 {
	font-style: italic;
	font-weight: bold;
	font-size: 1.18em;
	margin-bottom: 5px;
	
}

#sidebar h5 {
	font-size: 1em;
	margin: 10px 0;
}

#sidebar h4 {
	margin: 10px 0;
	font-size: 1.18em;
}