/* 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Title : Yin-Yang * DARK *
Author : Ben Rinehart
URL : 

Description : Package site design - * DARK *

	NOTE:  Check #portfolio section to change width/height of portfolio images; see spec sheet. 

Created : 
Modified : 

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/

body{
	background: #000;
	color: #989796;
	font: 13px "Copperplate Gothic Bold", Copperplate, verdana, arial, helvetica, sans-serif;
	}

/* START CONTAINER */
#container{
	width: 902px;
	\width: 922px;
	w\idth: 902px;
	margin: 10px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	}/* END CONTAINER */

	/* START HEADER */
	#header{
		padding: 0;
		margin-bottom: 0;
		height: 60px;
		}
	
		#header .vcard .adr, #header .vcard .tel, #header .vcard .email{
			text-align: right;
			padding-left: 10px;
			}
	
	#header .vcard .org{
		text-align: left;
		float: left;
		display: block;
		width: 500px;
		height: 60px;
		padding: 0;
		margin: 0;
		background: url(../images/logo.gif) top left no-repeat;
		text-indent: -1000px;
		}
	
	#header .vcard .org a{
		width: 230px;
		height: 60px;
		padding: 0;
		margin: 0;
		border: 0;
		display: block;
		text-decoration: none;
		}
		
		#header .secondaddress{
			float: right;
			}
		
		#header .secondaddress .org{
			display: none;
			}/* END HEADER */
	
	/* START NAVIGATION */
	#navigation{
		clear: both;
		border-right: 1px solid #4D4D4A;
		border-bottom: 1px solid #4D4D4A;
		border-left: 1px solid #4D4D4A;
		text-align: center;
		}
	
		#global{
			margin: 0;
			padding: 20px 0;
			}
		
			#global li{
				list-style-type: none;
				display: inline;
				padding: 5px 0;
				}
		
				#global li a:link, #global li a:visited{
					padding: 5px 10px;
					text-decoration: none;
					color: #aaa;
					}

				#global li a:hover, #global li a:active{
					color: #666662;
					}

		a:link{
			color: #aaa;
			}
			
		a:visited{
			color: #666;
			}
		
		a:hover, a:active{
			color: #666662;
			text-decoration: none;
			}/* END NAVIGATION */
	
	/* START PAGE BODY */
	#page_body{
		padding: 0;
		border-top: 1px solid #4D4D4A;
		border-right: 1px solid #4D4D4A;
		border-left: 1px solid #4D4D4A;
		}
		
		#content{
			height: 550px;
			overflow: auto;
			padding: 0 15px 0 25px;
			margin: 0;
			}
		
		#page_body p, #page_body ul, #page_body dl, #page_body ol{
			font: 12px/18px helvetica, arial, verdana, sans-serif;
			}
			
		#page_body p{
			text-indent: 25px;
			}
	
		#page_body h1, #page_body h2, #page_body h3, #page_body h4, #page_body h5, #page_body h6{
			font-family: "Copperplate Gothic Bold", Copperplate, verdana, arial, helvetica, sans-serif;
			color: #ccc;
			}
			
			#page_body h1{
				font-size: 24px;
				line-height: 36px;
				color: #fff;
				}
			
			#page_body h2{
				font-size: 20px;
				}
			
			#page_body h3{
				font-size: 16px;
				}
			
			#page_body h4, #page_body h5, #page_body h6{
				font-size: 14px;
				}
				
				#page_body h5{
					font-size: 12px;
					}/* END PAGE BODY */

	/* START INFO PAGES */	
	img.figure-a{
		display: block;
		margin: 0 auto;
		}
	
	img.figure-b{
		float: right;
		margin: 0 0 0 10px;
		}
		
	img.figure-c{
		float: left;
		margin: 0 10px 0 0;
		}
	
	#resources{
		margin: 0;
		padding: 0;
		}
	
		#resources li{
			list-style-type: none;
			padding: 5px 0;
			}
	
		#promotions {
			width: 560px;
			height: 400px;
			margin: 0 auto;
			padding: 75px 0;
			}/* END INFO PAGES */
	
	/* START PORTFOLIO */
	#portfolio{
		width: 900px;
		display: block;
		margin: 0 auto;
		padding: 0;
		height: 550px;
		}
		
		#portfolio ul{
			margin: 0;
			padding: 0;
			}

		#portfolio li{
			float: left;
			display: block;
			padding: 0;
			margin: 0;
			width: 150px;					/* Change based on # of galleries - see stylesheet */
			text-align: center;
			font: 12px/24px "Century Gothic", arial, helvetica, sans-serif;
			letter-spacing: 2px;
			}
			
			#portfolio li a.image{
				width: 150px;				/* Change based on # of galleries - see stylesheet */
				height: 525px;				/* Change based on # of galleries - see stylesheet */
				overflow: hidden;
				display: block;
				margin: 0 auto;
				}
				
				#portfolio li a img{
					border: none;
					opacity: 0.5;
					filter: Alpha(opacity=50);
					}

					#portfolio a:hover img{
						opacity: 1;
						filter: Alpha(opacity=100);
						}/* END PORTFOLIO */

	/* START GALLERIES */
	#slideshow{
		width: 900px;
		height: 550px;
		margin: 0 auto;
		}
		
		#video{
			width: 600px;
			height: 336px;
			margin: 0 auto;
			}
	
		#enlarge{
			width: 760px;
			height: 500px;
			overflow: hidden;
			}
			
			#enlarge img{
				display: block;
				margin: 0 auto;
				}
		
		#thumbnails{
			width: 140px;
			float: left;
			margin: 7px 0;
			}
		
		#thumbnails ul{
			margin: 0;
			padding: 0;
			}
			
			#thumbnails ul li{
				display: inline;
				margin: 0;
				padding: 0;
				}
			
			#thumbnails ul li a{
				display: block;
				float: left;
				width: 50px;
				height: 50px;
				margin: 4px 9px;
				overflow: hidden;
				border: 1px solid #4D4D4A;
				}
		
		#thumbnails img{
			border: none;
			}/* END GALLERIES */
	
	/* START FORMS */
		fieldset{
			padding: 10px;
			margin: 0;
			border: none;
			}

			fieldset fieldset{
				clear: left;
				float: left;
				width: 375px;
				margin: 5px 0;
				width: auto;
				}

				fieldset fieldset label{
					width: 335px;
					}

		legend{
			color: #fff;
			}

		label{
			display: block;
			float: left;
			clear: left;
			width: 100px;
			font-size: 12px;
			margin-top: 3px;
			}

		.required{
			color: #fff;
			}

		input[type="checkbox"], input[type="radio"]{
			margin: 0 15px 0 0;
			}

		input[type="text"], textarea{
			width: 250px;
			float: left;
			margin: 3px;
			}

		input[type="submit"], input[type="reset"]{
			margin: 3px;
			}

		input[type="submit"]:hover, input[type="reset"]:hover{
			cursor: pointer;
			}/* END FORMS */
	
	/* START FOOTER */
	#footer{
		clear: both;
		padding: 0;
		margin-top: 0;
		}/* END FOOTER */
