@charset "utf-8";
/*
Copyright is held by original owners.
CSS Document: The Picture Club.
Version: 1.01
*/

/*
ATTRIBUTES
**********
Font Primary: #FFF, Verdana, 11px
Page Heading: #FFF, Interstate/Expressway, 18px
Content Headings: #FFF, Verdana
__________

DIMENSIONS
**********
Main site width: 1000px
Content Main: 722px
Gutter width: 20px
__________

CSS INDEX:
**********
+ Global Styles
  - Text
  - Headings  
  - Links
  - Lists
  - Forms
+ Page Layout
  - Content (Containers)
+ Header
+ Footer
+ Navigation
  - Primary
  - Secondary
+ Banners
+ Page Tools
+ Content (Body)
__________

*/

/*
=================================
GLOBAL STYLES
*/

* {
	margin:0em;
	padding:0em;
	border:none;
}

#TPC{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:70%;
	color:#fff;
}	

ul {
	list-style:none;
}
	
.accessible {
	display:block;
	position:absolute;
	left:-9999em;
	z-index:0;
	height:0px;
	width:0px;
	line-height:0px;
	font-size:0px;
	float:left;
	clear:none;
	visibility:collapse;
}

.invisible {
	display:none;
}	

.right {
	float:right;
}

.left {
	float:left;
}

.image.right {
	margin:0em 0em 2em 2em;
}

.image.left {
	margin:0em 2em 2em 0em;
}

a {
	text-decoration:underline;
}

a:link {
	color:#00cccc;
}
a:visited {
	color:#009999;
}
a:hover {
	color:#ff1d4d;
}
a:active {
	color:#ff1d4d;
}

/*
FORMS
*/

button {
    cursor:pointer;
}

form button span {
    padding:3px 12px;
    color:#fff;
    line-height:18px;
    font-size:12px;
    text-transform:lowercase;
}

form button {
    width:auto;
    height:auto;
    overflow:visible;   
    border:1px solid #0B6066;
    border-bottom-color:#223A4D;
    border-right-color:#223A4D;
    background:#000;
    padding:0em;
    margin:4px 8px;
}

form button:hover {
    background:#006178;
    border:1px solid #223A4D;
    border-bottom-color:#0B6066;
    border-right-color:#0B6066;
   
}

form .line {
    clear:both;
    margin:10px 0px;
}

form .line label {
    display:block;
    text-transform:uppercase;
    padding:4px 0px;
    font-size:10px;
    font-weight:bold;
}

form .line input {
    width:250px;
    border:1px solid #014153;
    background:#011823;
    color:#fff;
    text-indent:2px;
    margin-left:8px;
    line-height:14px;
    padding:2px 0px;
}

#client_login_form {
    background:url(../images/black_30.png) repeat;
    _background:#01283b;
    padding:15px 20px;
	width: 400px;
}


/*
PAGE LAYOUT
*/
html {
	background:#fff;
}

body {
	background:#012638 url(../images/bg_page_large.jpg) center top repeat;
}

#header {
	width:950px;
	margin:0em auto;
	position:relative;
	background:url(../images/bg_header_2.gif) 116px top no-repeat;
	height:215px;
	z-index:20;
}

#headerfront {
	width:950px;
	margin:0em auto;
	position:relative;
	background:url(../images/bg_header_2.gif) 116px top no-repeat;
	height:215px;
	z-index:20;
}

#page {
	background:url(../images/bg_footer_2.gif) center bottom repeat-x;
}

#content-container {
	clear:both;
	position:relative;
	z-index:10;
	width:750px;
	padding-left:195px;
	margin:0em auto 0em auto;
	/* contain primary navigation */
	min-height:300px;
	_height:300px;
}

#content {
}


/*
HEADER
*/


#company a {
    position:absolute;
    top:65px;
    left:120px;
    display:block;
    height:77px;
    width:356px;
    background:url(../images/logo_the_picture_club.png) left top no-repeat;
    _background:url(../images/logo_the_picture_club.gif) left top no-repeat;
    z-index:30;
}


#companynone {
	position:absolute;
	top:65px;
	left:120px;
	display:block;
	height:77px;
	width:356px;
	z-index:30;
}


/*
NAV PRIMARY
*/

#nav-primary {
	position:absolute;
	z-index:40;
	top:215px;
}

#nav {
	list-style:none;
	padding:0px;
}

#nav li {
	float:left;
	clear:left;
	padding-left:13px;
	padding-bottom:20px;
	background:url(../images/bullet_b.gif) left top no-repeat;
}

#nav li span {
	display:none;
}

#nav li a {
	float:left;
	display:inline-block;
	width:150px;
	height:13px;
	background-position:left top;
	background-repeat:no-repeat;
}

#nav li a:hover, #nav li a.active {
	background-position:left -22px;
}


/* second tier */
    #nav ul li a {
        height:10px;
    }
    
    #nav ul li {
        background-image:none;
        padding:4px 0px 4px 13px;
        margin-left:15px;
    }
    
    #nav ul li:hover, #nav ul li.active, #nav ul .sfhover {
        background:url(../images/bullet_a.gif) 2px 4px no-repeat;
    }

    .nav_pri_1 a {
        background-image:url(../images/nav_pri_about.gif);
    }
    .nav_pri_2 a {
        background-image:url(../images/nav_pri_what_we_do.gif);
    }
    .nav_pri_3 a {
        background-image:url(../images/nav_pri_producer.gif);
    }
    .nav_pri_3a a {
            background-image:url(../images/nav_pri_james.gif);
    }    
    .nav_pri_4 a {
    	    background-image:url(../images/nav_pri_directors.gif);
    }
    
	.nav_pri_4a a {
            background-image:url(../images/nav_pri_jeremy.gif);
    }    
    
	.nav_pri_4b a {
            background-image:url(../images/nav_pri_tim.gif);
        }    
    
	.nav_pri_5 a {
        background-image:url(../images/nav_pri_contact.gif);
    }
    
	.nav_pri_6 a {
        background-image:url(../images/nav_pri_client_login.gif);
    }
	
/*
FOOTER
*/

#footer {
	width:950px;
	margin:0px auto 0em auto;
	clear:both;
	position:relative;
	color:#878787;
	padding-bottom:0px;
	overflow:auto;
	margin-top:120px;
	padding-top:8px;
}

#footer .links {
	padding-top:20px;
}

#footer .links li {
	float:left;
	margin-right:30px;
}

#footer #copyright {
	float:right;
	margin-right:120px;
}

#footer .pages {
	clear:both;
	text-align:center;
	margin:22px auto 8px auto;
	font-size:9px;
}

#footer .address {
	clear:both;
	text-align:center;
	margin:2px auto 2px auto;
	font-size:11px;
}

#footer .address a {
	color: #676767;
	text-decoration:none;
}

#footer .pages li {
	display:inline;
}

#footer .page_links .pages a {
	display:inline-block;
	width:auto;
	background:url(../images/divider_footer_links.gif) right 3px no-repeat;
	padding-left:7px;
	padding-right:8px;
	text-decoration:none;
	color:#676767;
}

#footer .page_links .pages a:hover {
	text-decoration:underline;
}


#footer #site_design a {
	position:absolute;
	z-index:10;
	bottom:20px;
	right:10px;
	display:block;
	background:url(../images/logo_flip_creative.gif) no-repeat;
	width:78px;
	height:17px;
}

#footer #site_design a span {
	position:absolute;
	left:-999em;
}

/*
CONTENT
*/



	/* columns */


	#content .col {
		float: left; 
		margin-bottom:1.4em;
		
	}
	
	#content .three .col {
		width:25%;
		margin-left:60px;
		float: left;
	}
	
	#content .three .col {
		width:25%;
		margin-left:60px;
		float: left;
	}
	
	
	#content .two .col {
		width:405px;
		margin-right:0px;
		margin-left:0px;
		margin-bottom: 0px;
		padding: 0px;		
		float: right;
	}
	
	#content .col.first-child {
		margin-left:0px;
		width: 275px;
		float:left;
	}
	
	#content .colpast.first-child {
		margin-left:0px;
		width: 180px;
		float:left;
	}
	
	#content .colpast.second-child {
		margin-left:40px;
		width: 250px;
		float:left;
	}
	
	#content .col.last-child {
		margin-left:0px;
		width: 275px;
		float: right;
		text-align: right;
	}
	
	#content .one .col {
		width:70%;
		margin-left:60px;
	}
	
h1, h2. h3 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	margin-bottom:.4em;
}

#content h1 {
	color:#fff;
	margin-bottom:1em;
	font-size:140%;
}

#content h2 {
	color:#009999;
	font-weight:normal;
	text-transform:uppercase;
	font-size:1.4em;
	margin-bottom:1em;
}

#content h3 {
	font-size:1.2em;
	margin-bottom:.5em;
}

#content-container p {
	margin-bottom:1.4em;
}

#content p, #content li, #content {
	line-height:120%;
}

#content li ul, #content li ol {
	margin-bottom:0em;
}

#content ul, #content ol {
	margin-bottom:1.4em;
	margin-left:1em;
}

#content ul li{
	padding-left:10px;
	margin-top:2px;
	background:url(../images/bullet_c.gif) left 4px no-repeat;
}
#content ol li{
	margin-top:2px;
	padding-left:0em;
}

#content ol {
	list-style:decimal;
	margin-left:3em;
}

/* Gallery */

#content .gallery {
	width:387px;
	float:right;
	position:relative;
	margin-top:-33px;
}

#content .gallery .description {
	padding:0em 15px;
	width:357px;
	margin-bottom:4px;
	overflow:hidden;
}

#content .gallery .description h2 {
	font-weight:bold;
	color:#fff;
	text-transform:none;
	font-size:1.3em;
	margin:0em;
	
	line-height: 20px;
	
	clear: both;
}

#content .gallery .description .type {
	clear: both;
	display:inline-block;
	color:#ea1d4b;
	margin:0em;
	line-height: 20px;

}

#content .gallery .item {
	position:relative;
	float:left;
	width:129px;
	height:76px;
	text-align:center;
	font-size:10px;
	color:#002738;
}

#content .gallery .item .title {
	position:absolute;
	top:0px;
	left:0px;
	width:129px;
	margin:0em;
	text-transform:uppercase;
	z-index:30;
}

#content .gallery .item .preview {
	position:absolute;
	top:9px;
	left:0px;
	width:129px;
}

#content .gallery .item .title a {
	display:block;
	height:10px;
	width:103px;
	text-decoration:none;
	color:#034a6b;
	padding:66px 13px 0px 13px;
	overflow:hidden;
	font-size:10px;
	font-family:Arial, Helvetica, sans-serif;
}

#content .gallery .item .title a:hover {
	cursor:pointer;
	color:#f5fdff;
	background:url(../images/bg_gallery.png) left top no-repeat;
	_background-image:url(../images/bg_gallery.gif);
}