/*-----------------------------------------------------------------------------
Fat Free Design Style Sheet

version:   1.0
author:    FAT FREE DESIGN
email:     info@fatfreedesign.co.uk
website:   http://www.fatfreedesign.co.uk/
Copyright 2009 / All Rights Reserved
----------------------------------------------------------------------------- */

/* =Site Wide Rules
---------------------------------------------------------------------------------------------------- */
* {
  	margin: 0;
	padding: 0;}

body {
	font-family: "Lucida Grande", sans-serif;
	background: #f5f5f5 url(../images/body_bg.gif) repeat-x 0 0; 
	color: #333; 
	text-align: left;
	font-size: 68.75%;}
	
body#control_panel {
	font-family: "Lucida Grande", sans-serif;
	background: #f5f5f5 url(../images/controlpanel_body_bg.gif) repeat-x 0 0; 
	color: #333; 
	text-align: left;
	font-size: 68.75%;}
	
a img {
	text-decoration: none;
	border: none;
	border: 0;}


/* =CONTAINER
---------------------------------------------------------------------------------------------------- */
#container {
	position: relative;
	width: 824px;
	min-height: 100%;
	overflow:hidden;
	margin: 0 auto;
	text-align: left;}


/* =LoGo
---------------------------------------------------------------------------------------------------- */
#logo {
	float:left;
	height: 23px;
	font-size: 2em;
	font-weight: normal;
	margin: 20px 0 0 0;}
	
#logo p {
	text-indent: -5000px;}
	
#logo img.none {
	border: 0;
	text-decoration: none;}
	
#logo a:link, #logo a:visited {
	text-decoration: none;
	background-color: transparent;
	color: #fff;}
	
#logo a:hover {
	color: #ccc;}
    

/* =HEADER - CMS
---------------------------------------------------------------------------------------------------- */
#header {
	width: 30%;
	margin: 0;
	padding: 0;} /* CMS */
	
#header p {
	text-indent: -5000px;}
    

/* =NAVIGATION
---------------------------------------------------------------------------------------------------- */
#main_nav {
	width: 80%;
	float: right;
	margin: 25px 0 0 0;}

#main_nav li {
	float: right;
	list-style: none;
	margin: 0;
	padding: 0;
	border-right: 1px solid #565656;}

#main_nav li a:link, #main_nav li a:visited {
	display: block;	
	text-decoration: none;
	color: #fcfcfc;
	padding: 0.5em 1em;
	background-color: #1c1919;}

#main_nav li a:hover {
	display: block;	
	text-decoration: none;
	color: #fff;
	padding: 0.5em 1em;
	background: #000;
	margin: 0;}

#main_nav li.no_bdr {
	border-right: none;}

/* NOTE - CAN WE HIGHLIGHT MAIN AND SUB NAV MENU WHEN USER IS ON A PARTICULAR PAGE? */	
#biography #main_nav #t-biography a,
#portfolio #main_nav #t-portfolio a,
#print_sales #main_nav #t-sales a,
#contact #main_nav #t-contact a{
	background: #161616;}

/* SUB NAVIGATION */

#sub_nav {
	width: 150px;
	margin: 125px 0 0 0;
	padding: 0;}

#sub_nav ul {
	float:left;
	list-style-type: none;}
	
#sub_nav li {
	display: block;
	margin: 0;
	padding: 0 0 1.6em 0;
	font-size: 1em;}
	
#sub_nav li ul li { /* second-level lists */
	margin: 0;
	padding: 0.5em 0 0 2em;}
	
#sub_nav li ul {
	display: block;
	margin: 0;
	padding: 0;}
	
#sub_nav li a:link, a:visited {
	color: #666;
	text-decoration: none;} 

#sub_nav li a:hover {
	color: #393845;} 
	

/* =CONTENT RIGHT COLUMN - for pages other than gallery
---------------------------------------------------------------------------------------------------- */
#main_content {
	float: left;
	width: 824px;
	margin: 50px 0 75px 0;
	padding: 0;
	text-align: left;
	color: #1c1919;
	background-color: transparent;}
	
#main_content h1 {
	font-size: 1.4em;
	margin: 0;
	padding: 0 0 1em 0;}
	
#main_content p {
	font-size: 1.1em;
	line-height: 1.7em;
	margin: 0;
	padding: 0 0 1em 0;}
	
#main_content p img{
	float:right;
	margin: 5px;
	padding: 0;}
	
#main_content ul {
	margin: 0 0 1.25em 1.25em;
	padding: 0;}
	
#main_content li {
	list-style-position: inside;
	padding: 0;
	margin: 0 0 0.25em 0;}
	
	
/* =PORTFOLIO RIGHT COLUMN
---------------------------------------------------------------------------------------------------- */
#gallery_content {
	float: right;
	width: 600px;
	margin: 0 0 75px 0;
	padding: 0;
	text-align: left;
	color: #1c1919;
	background-color: transparent;}
	
#gallery_content h1 {
	font-size: 1.4em;
	border-bottom: 1px dotted #ccc;
	margin: 0;
	padding: 0 0 1em 0;}
	
	
#gallery_content p {
	font-size: 1.1em;
	line-height: 1.7em;
	margin: 0;
	padding: 0;}
	
#gallery_content ul {
	margin: 2em 0 0 0;
	padding: 0;}
	
#gallery_content ul li {
	display: inline;
	list-style-type: none;
	padding: 0 2em 10px 0;
	margin: 0;}
	
#gallery_content ul li img {
	border: 1px solid #ddd;
	margin-bottom: 2em;}
	
#gallery_content p.controls {
	float: right;
	padding: 0;
	margin: 10px 0 0 -40px;}
	
#gallery_content a:link, #gallery_content a:visited {
	color: #666;
	text-decoration: none;} 

#gallery_content li a:hover {
	color: #393845;}
	
	
/* =CENTRE COLUMN - home page
----------------------------------------------------------------------------------------------------- */
#col_C {
	float:left;
	text-align: center;
	padding: 0;
	margin:0 0 0 100px;
	}
	
#col_C img.home {
	margin: 75px 0;}
		
	
/* =Footer
---------------------------------------------------------------------------------------------------- */
#footer {
	clear: both;
	width: 824px;}
	
#footer p {
	text-align: right;
	margin: 0;
	padding: 0;
	font-size: 0.8em;
	color: #ccc;}
	
	
/* =Contact Form
---------------------------------------------------------------------------------------------------- */	
label {
	display: block;}

input[type="text"] {
	width: 20em;}

textarea {
	width: 40em;
	height: 100px;}

input.submit {
	width: auto;}

input:focus, textarea:focus {
	background: #ffc;}

input [type="text"], textarea {
	border-top: 2px solid #999;
	border-left: 2px solid #999;
	border-bottom: 2px solid #ccc;
	border-right: 2px solid #ccc;}

fieldset {
	margin: 20px 0 40px 0;
	padding: 10px;
	background-color: #f5f5f5;
	border: 1px solid #ccc;}
	
fieldset em {
	font-size: 0.9em;
	color: #999;}
	
/* =hides the field to avoid spam */

.organisation {
visibility:hidden;}


/**************************************************************************************************
SlideShow v 1.3
**************************************************************************************************/
.slideshowContainer {
	border: 0;
	width: 600px;
	height: 480px;
	margin-bottom: 5px;}
	
.slideshowContainer h2{
	float:left;
	font-size: 1.4em;
	margin: 0 0 0 -40px;
	padding: 0 0 1em 0;}
	
.slideshowContainer_35mm {
	border: 0;
	width: 600px;
	height: 396px;
	margin-bottom: 5px;}
	
.slideshowContainer img, .slideshowContainer_35mm img {
	float: right;}

.loading {
	background: url(images/loading.gif) center no-repeat;}

.slideshowThumbnail {
	outline: none;}

.slideshowThumbnail img {
	border: 1px solid #fff;
	margin-bottom: 5px;}
	
.current img {
	padding: 5px;}

.outline {
	border: 1px solid #00ff00;
	z-index: 0;
	position: absolute;}

#thumbnails {
	visibility: hidden;
	position: absolute;
	left: -5000px;
	border: 1px solid red;}
	
#thumbnails img {
	margin: 0;}

#thumbnails a:link, #thumbnails a:visited {
	color: #333;
	text-decoration: none;}
	
#thumbnails a:hover {
	color: #00ff00;
	background-color: #000;}
	
.slideshowContainer #SLIDE_text {
	float:left;
	margin:10px 0 0 -40px;
	padding:5px 0 0 0;
	text-align: left;
	font-weight: normal;
	font-size: 0.9em;
	color: #999;
	letter-spacing: 0.01em;}
		
	
/* =FormStyles - control panel
----------------------------------------------------------------------------- */

#theform {
	padding: 5px 0;
	border-bottom: 1px dotted #ccc;}

#theform label {
	color:#000000;
	font-size: 1em;}

#theform p {
	color: #000;
	margin: 5px 0 5px 0;
	padding:10px 0 0 0;}

#theform input:focus {
	background-color:#efefef;}

#theform input {
	font-size: 1em;
	width: 200px;}

#theform input.submit {
	margin: 0;
	padding: 10px 0 0 0;
	width: auto;}

.formtext {
	font-size:1em;}


/* =Control Panel
----------------------------------------------------------------------------- */
#controlnav {
	color: #000;
	clear: both;
	width: 824px;
	margin: 80px 0 0 0;
	padding: 0 0 50px 0;}

#controlnav p {
	font-size: 1em;
	margin: 0;
	padding: 5px 0;}
	
#controlnav p.whoops {
	font-size: 1.8em;
	color: #cc0000;}

#controlnav h2 {
	font-size: 1.25em;
	font-weight: bold;
	margin: 0;
	padding: 0 0 15px 0;
	border-bottom: 1px dotted #999;}
	
#controlnav h2 img {
	margin: 0 10px 0 0;
	padding: 0;}
	
#controlnav li#top_nav {
	display: inline;
	margin: 0;
	padding: 0 100px 0 0;}

#controlnav ul#controlnav_border_last {
	border-top: 1px dotted #666;}

#controlnav h3 {
	font-size: 1.1em;
	font-weight: bold;
	margin: 15px 0 3px 0;
	padding: 0 0 0 0;}

#controlnav h3 img {
	margin: 0;
	padding: 0 10px 0 0;}

#controlnav table {
	width: 824px;
	border-top: 1px solid #333;
	border-right: 1px solid #333;
	border-left: 1px solid #333;}

#controlnav th {
	color: #000;
	padding: 0.5em 1em;
	font-size: 1.05em;
	vertical-align: text-top;
	background-color: #ccc;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;}

#controlnav td {
	padding: 0.5em 1em;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;}
	
#controlnav th.lastcol, #controlnav td.lastcol {
	border-right: 0;}

#controlnav ul {
	margin: 0;
	padding: 0;}

#controlnav li {
	clear:left;
	list-style: none;
	margin:0;
	padding-bottom: 5px;}

#controlnav a {
	text-decoration: none;
	color: #4a6e6a;}

#controlnav a:hover {
	color: #cccccc;}

#controlnav ul#controlnav_border {
	border-bottom: 1px dotted #666;
	margin-bottom: 10px;}

.divider {
	margin: 10px 0;}

.newsdivider {
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #999999;
	margin:0;
	padding: 10px 0 0 0;}

#controlnav textarea {
	width: 600px;
	height: 100px;}

#controlnav input password{
	width: 20em;}

#controlnav textarea:focus {
	background-color:#efefef;}

#top_nav {
	background-color: #efefef;
	margin: 10px 0 0 0;
	padding: 3px 0 3px 3px;
	border: 1px dotted #ccc;
	height: 1.8em;}

#top_nav input {
 margin: 0 15px 3px 0;
 float:left;}

.instructions {
	color: #cc0000;}