/*

Title:      	DCC Style Sheet
Author:     	David Cole
Vesion: 		1.0
Created: 		Jan 17th 2009
Last Modified: 	Jan 20th 2009

*/














p.intro {

	font-size: 90%;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;

}

p.list {
	margin: 5px 0 0 0;
	font-size: 90%;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;

}



p.body-copy {

	font-size: 90%;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	margin: 10px 0 0 0;
	padding: 0;

}



p.nav_bold {

	font-size: 13px;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	font-weight: bold
	margin: 0px 3px 0px 3px;
	background: #;
	border-bottom: 2px solid #fff;

}


p.nav_light {

	font-size: 13px;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	margin: 0px 3px 0px 3px;
	font-weight: bold
	border-bottom: 1px dotted #111;

}



h1 {
	color: #white;
	text-transform: uppercase;
	font-size: 1em;
}


h1.spaceabove {
	color: #white;
	text-transform: uppercase;
	font-size: 1em;
	margin-left: 0;
	margin-right: 0;
	margin-top: 25px;
	margin-bottom: 0px;
}


h2 {
	color: #white;
	text-transform: uppercase;
	font-size: 18px;
	margin-left: 0;
	margin-right: 0;
	margin-top: 20px;
	margin-bottom: 0px;
}

h2.top {
	color: #white;
	text-transform: uppercase;
	font-size: 18px;
	margin-left: 0;
	margin-right: 0;
	margin-top: 0px;
	margin-bottom: 0px;
}


body {
	font-size: 75%;
	color: #ffffff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	background: #3d3a33 url(images/pattern-1.png) repeat;
}


a:link,
a:visited {
	color: #fff;
	text-decoration: none;
	border-bottom: 0px dotted #d88f32;
	}
a:hover {
	color: #999;
	border-bottom: 0px dotted #888;

	}
	
	
a.mylink:link,
a.mylink:visited {
	color: #888;
	text-decoration: none;
	border-bottom: 0px dotted #d88f32;
	}
a.mylink:hover {
	color: #111;
	border-bottom: 0px dotted #888;

	}	
	
	
span.stage_bar {	
	font-size: 11px;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	}
	
div.stage_bar {	
	border: 0px solid pink;
	}
	

	
/* this is the container that everything is inside of */


div.wrapper {
	background: #2b2924 url(./background.gif);
	width: 760px;
/*	height: 510px; */
	padding: 0px 0px 10px 0px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 80px;
	margin-bottom: 20px;
	border: 10px solid #ffffff;

}

div.header {
	background: #2b2924;
	float: center;
	width: 760px;
	height: 40px;
	padding: 0px 0px 0px 0px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;

}

div.footer {
	clear: both;
	width: 740px;
	padding: 0px 0px 0px 0px;
	margin-left: 10;
	margin-right: 10;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;
	vertical-align: middle;

}


div.tile_stripe {
	background: url(./tile_stripe.gif);
	float: left;
	width: 740px;
	height: 40px;
	padding: 0px 0px 0px 0px;
	margin-left: 10px;
	margin-right: 0;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid pink;
	vertical-align: center;

}


/* this is the big white stripe at the top */


div.rule {
	background: #fff;
	float: center;
	width: 760px;
	height: 10px;
	padding: 0px 0px 0px 0px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;

}

/* this is the thinner gray rule at the bottom */


div.rule2 {
	background: #555;
	float: left;
	width: 740px;
	height: 2px;
	padding: 0;
	margin-left: 10px;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 10px;
	border: 0px solid #ffffff;

}


/* this is the small gray vertical divider bars at the bottom */


div.vert_spacer {
	background: #555;
	float: left;
	width: 2px;
	height: 40px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin: 0 15px 0 15px;
	border: 0px solid #ffffff;

}


/* this is the footer links */



div.bottom_links {
	float: left;
	height: 42px;
	padding: 12px 0px 0px 0px;
	margin-left: 13px;
	margin-right: 13px;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid #pink;
	
  }


/* this is the left column content area */


div.left {
	
	background: url(./trans_black.png);
	float: left;
	width: 200px;
	height: 380px;
	padding: 0px 0px 0px 0px;
	margin-left: 10px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	border: 0px solid lime;
	/* for IE */
    filter:alpha(opacity=100);
    /* CSS3 standard */
    opacity:1;
  }
  
  
  
  
div.left-transparent {
	
	/* background: url(./trans_black.png); */
	float: left;
	width: 200px;
	/* height: 380px; */
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 10px;
	border: 0px solid orange;
	/* for IE */
    filter:alpha(opacity=100);
    /* CSS3 standard */
    opacity:1;
  }

div.faux-cols {
background: url(faux-cols.png) repeat-y;
/* height: 400px; */
border: 0px solid pink;
padding: 0;
margin: 10px 0 10px 8px;
}


	

/* this is the div that holds the include for common intro copy, on the left */

	
div.intro {
	float: left;
	width: 180px;
/*	height: 200px;  */
	padding: 0px 10px 10px 10px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid pink;

  }	
  
  
/* this is the div that holds the unique page content on each page */
  
  
div.page_copy {
	float: left;
	width: 180px;
	 /* height: 100px;  */
	padding: 10px 10px 10px 10px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 0px;
	border: 0px solid lime;

  }	
  
  
div.mini-slides {
	float: left;
	width: 180px;
	 /* height: 100px;  */
	padding: 0;
	margin: -5px 0 0 10px;
	border: 0px solid lime;

  }	  
  


/* this div is a vertical slice that holds the left and right arrow buttons */


div.button {
	background: #fff;
	float: left;
	width: 50px;
	height: 380px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;

  }	
  
  /* this div is inside div.button, to push the button down to bottom */

  
  div.buttonspacer {
	background: #fff;
	float: left;
	width: 50px;
	height: 335px;  	/* this value pushes arrow buttons down from above */
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;

  }	
  
  
/* this is the main stage area */


div.stage {
	background: #fff;
	float: right;
	width: 530px;
	height: 355px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 10px;
	margin-top: 10px;
	margin-bottom: 0px;
	border: solid 0px pink ;
	text-align:center
  }	
  
  
div._bar {
	float: left;
	width: 530px;
	height: 15px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 10px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;
	text-align:center
  }  


div.next_buttons {
	float: left;
	width: 50px;
	height: 15px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 8px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;
	text-align:center
  }  


div.caption {
	float: left;
	width: 430px;
	height: 15px;
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 8px;
	margin-bottom: 0px;
	border: 0px solid #ffffff;
	text-align:center
  }  



div.stage_text {
/*	background: #333 url(column-bg.gif) repeat-y; */
	float: right;
	width: 520px;
/*	height: 380px; */
	padding: 0px 0px 0px 0px;
	margin-left: 0px;
	margin-right: 10px;
	margin-top: 10px;
	margin-bottom: 10px;
	border: 0px solid red;
	text-align:left
  }	

div.stage_text_nested {
	float: left;
	width: 500px;
/*	height: 380px; */
	padding: 0px 0px 0px 0px;
	margin: 0;
	border: 0px solid lime;
	text-align:left
  }	

div.logo {
	float: left;
	width: 204px;
	padding: 0px 0px 0px 0px;
	margin-left: 10px;
	margin-right: 0px;
	margin-top: 5px;
	margin-bottom: 10px;
	border: 0px solid #pink;
	
  }	
  
img.bio_pic {
	float: left;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 15px;
	
  }	  	
  
img.arrowbuttons {
	float: left;
	margin-left: 5px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
	
  }	  
  
	  
  
img.slide {
	float: middle;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
  }	 
  
    
  
img.icon {
	float: left;
	margin: 0 8px 0 0;
	padding: 0;
	border: 0;
  }	 


/* this is for the header links */


  
div.links {
	float: right;
	width: 530px;
	padding: 0;
	margin: 15px 15px 0px 0px;
	border: 0px solid #green;
	text-align: center;
  }
  

div.links span {
	margin: 0 10px;
	color: #bbb;
	}



hr {
color: #777; 
background-color: #777; 
border: 1px dotted #333; 
border-style: none none dotted; 
}



p,table {
margin: 0;
padding: 0;
}




/* FOOTER nav styling */
/* FOOTER nav styling */
/* FOOTER nav styling */
/* FOOTER nav styling */





ul#number-nav {
	list-style: none;
	margin: 6px 0 0 0;
	text-align: center;
	padding: 5px 0 0 0;
}

ul#number-nav li {
	margin: 0 8px 0 8px;
	display: inline;
	padding: 0;

}



li a:link,
li a:visited {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	}
	
li a:hover {
	color: #666;
	}



body#port-1 li#nav-1 a,
body#port-2 li#nav-2 a,
body#port-3 li#nav-3 a,
body#port-4 li#nav-4 a,
body#port-5 li#nav-5 a,
body#port-6 li#nav-6 a,
body#port-7 li#nav-7 a,
body#port-8 li#nav-8 a,
body#port-9 li#nav-9 a,
body#port-10 li#nav-10 a,
body#port-11 li#nav-11 a,
body#port-12 li#nav-12 a,
body#port-13 li#nav-13 a {
	color: #fff;
	border-bottom: 2px solid #fff;
	}
	



/* START SLIDE SHOW  */



#slideshow {
    position: absolute; 
    height:150;
    padding: 0;
    margin: 0;
    border: 0px dotted lime;
}

#slideshow img {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
    padding: 0;
    margin: 0;
}

#slideshow img.active {
    z-index:10;
    opacity:1.0;
    padding: 0;
    margin: 0;    
    border: 0px dotted pink;

}

#slideshow img.last-active {
    z-index:9;
    padding: 0;
    margin: 0;
    }



/* END SHOW  */




/* START JQUERY TWITTER TEST  */



div#twitter {
	width: 497px;
	margin-bottom: 2em;
	border: 1px solid #222;
}

div#twitter h2 {
	margin: 0;
	padding: 0.4em 1em;
	font-size: 1.1em;
	color: #fff;
	background-color: #222;
}

p#preloader {
	margin: 0;
	padding: 1em 1em 1em 3em;
	background: transparent url("loader.gif") 1em center no-repeat;
	/* generate your own loader gif: http://www.ajaxload.info */
}

ul#twitter_update_list {
	margin: 0;
	padding: 0 1em 0.5em 1em;
	list-style-type: none;
}

ul#twitter_update_list li {
	margin: 0;
	padding: 0.8em 0 1em 0;
	border-bottom: 1px dotted #777;
}

ul#twitter_update_list li a {
	/* timestamp link */
	color: #666;
}

ul#twitter_update_list li span {
	display: block;
}

ul#twitter_update_list li span a {
	/* links in tweet */
	color: #aaa;
}

ul#twitter_update_list li.firstTweet {
}

ul#twitter_update_list li.lastTweet {
	border-bottom: none;
}

a#profileLink {
	display: block;
	padding: 0.3em 1em;
	color: #fff;
	background-color: #222;
}


/* END JQUERY TWITTER TEST  */



img.inline {

margin: 10px 0 10px 0;
padding: 0;
border: 0;
}


a.inline:link,
a.inline:visited {
	font-size: 100%;
	color: #999;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	margin: 10px 0 0 0;
	padding: 0;
	border-bottom: 1px dotted #666;
	
	}

a.inline:hover {
	font-size: 100%;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	margin: 10px 0 0 0;
	padding: 0;
	border-bottom: 1px dotted #888;
	}
	




a.hotlink:link,
a.hotlink:visited {
	font-size: 12px;
	color: #888;
	font-family: arial, sans-serif;
	line-height: 1.4em;
	margin: 10px 0 0 0;
	padding: 0;
	}

a.hotlink:hover {
	font-size: 12px;
	color: #888;
	font-family: arial, sans-serif;
	line-height: 1.4em;
	margin: 10px 0 0 0;
	padding: 0;
	border-bottom: 1px dotted #888;
	text-decoration: underline 1px dotted #888;
	}



ul {
margin: 0;
border: 0;
padding: 0;
}


ul li {
	font-size: 90%;
	color: #fff;
	font-family: "Lucida Grande", Tahoma, Arial, sans-serif;
	line-height: 1.4em;
	margin: 5px 0 0 25px;
	padding: 0;

}









