
/*
Theme Name: Forks Open Doors
Theme URI: http://www.forksopendoors.com/
Description: Custom theme for Brendan and Otilee at Forks Open Doors Creative Design
Version: 1.0
Author: Tim Gittos
Author URI: http://www.chromasplosion.com/
Tags: grey, pink, custom header, fixed width, two columns, widgets

	Forks Open Doors v1.0
	 http://www.forksopendoors.com

	This theme was designed by Brendan Ninness and Otilee and built by Tim Gittos,
	whose blog you will find at http://www.timgittos.com/

*/


/* <!-- */
/* holy grail 3 column settings */
.holygrail .colmid {
    float:left;
    width:200%;
    position:relative;
    right:100%;
}
.holygrail .colleft {
    float:left;
    width:100%;
    margin-left:-50%;
    position:relative;
    left:32em;         		/* Left column width*/
}
.holygrail .centre-colwrap {
    float:left;
    width:50%;
    position:relative;
    right:32em;         		/* Width of left column */
    padding-bottom:1em; 	  /* Centre column bottom padding. Leave it out if it's zero */
}
.holygrail .centre-col {
    margin-left: 32.6em;    /* Centre column side padding:
                           	Left padding = left column width + centre column left padding width
                           	Right padding = right column width + centre column right padding width */
    position:relative;
    left:200%;
    overflow:hidden;
}
.blog.holygrail .centre-col {
    margin-right: 18.4em;     /* Centre column side padding:
                           	Left padding = left column width + centre column left padding width
                           	Right padding = right column width + centre column right padding width */
}
.holygrail .left-col {
    float:left;
    float:right;			      /* This overrides the float:left above */
    width:30.8em;        		/* Width of left column content (left column width minus left and right padding) Changed to 2 * margin by TG 26.08.09 */
    position:relative;
    right:0.6em;         		  /* Width of the left-had side padding on the left column */
}
.holygrail .right-col {
    float:left;
    float:right;			      /* This overrides the float:left above */
    width:14.8em;        		  /* Width of right column content (right column width minus left and right padding) */
    margin-right:2.4em;  		  /* Width of right column right-hand padding + left column left and right padding */
    position:relative;
    left:50%;
    padding: 0.6em;
}
.holygrail {
  /* The margin causes the scroll-bar */
  /*margin: -1em 0.6em 0.6em 0.6em;*/
}
/* --> */

/* General styles */

body {
    margin:0;
    padding:0;
    border:0;			          /* This removes the border around the viewport in old versions of IE */    
    width:100%;    
    background:#fff;    
    min-width:600px;        /* Minimum width of layout - remove line if not required */    					    
                            /* The min-width property does not work in old versions of Internet Explorer */
}
/* column container */
.colmask {	
  position:relative;		    /* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
  clear:both;    
  float:left;    
  width:100%;				        /* width of whole page */
}

html { 
  font-family: 'Century Gothic', Verdana, sans-serif; 
  font-size: 0.8em; 
}
body { 
  min-width: 550px;
  background: #e8e7e3;
}
a { 
  text-decoration: none; 
  color: #e80570; 
}
:focus {
  outline: none;
}
#header { 
  position: relative; 
  margin: 0.6em 0.6em 0 0.6em;
}
#header .contact { 
  color: #292827; 
  position: absolute; 
}
#header h1 a { 
  display: block;
  width: 100%; 
  height: 100%;
}
#header h1 a span { 
  font-size: 1px; 
  text-transform: uppercase; 
  letter-spacing: -0.1em;
  display: none;
}
#header .contact { 
  bottom: 0; 
  left: 32.6em; 
  margin: 0;
}
#header .contact em { 
  color: #e80570;
  font-style: normal;
}
#menu { 
  background: #292827; 
  color: #e8e7e3; 
  height:50em;
}
#menu .tagline { 
  text-transform: lovercase; 
  color: #e8e7e3; 
  font-size: 1.2em; 
  display: block; 
  width: 390px;
  text-align: right;
}
#menu a { 
  color: #e8e7e3; 
  text-decoration: none;
}
#menu .ui-accordion-content { 
  margin: 0 0 0 2em; 
}
#menu .scroll-pane { 
  height: 15em; 
  width: 20em; 
  /*overflow: auto;*/ 
  padding-left: 2em; 
  padding-top: 0px;
}
#menu .scroll-pane p { 
  margin-top: 0 
}
div.jScrollPaneDrag {	
  background: #e80570; 
}
#menu p { 
  height: 1.2em; 
  width: 320px;
}
#menu a:hover, #menu .active a { 
  color: #e80570;
}
#content { 
  overflow: hidden;
  height: 50em; 
  color: #e8e7e3;
  background: transparent;
}
#content.page {
  background: #292827;
}
#content p.editLink { 
  position: absolute; 
  top: 0.6em; 
  right: 0.6em; 
}
#content .column { 
  float: left; 
  width: 48%;
  margin-right: 0.6em;
}
#content .feature {
  margin-top: 0.6em; 
  float: left;
}
#content .edit {
  float: right;
  margin-top: 0.2em;
}
#content .hscroll-pane { 
  float: left;
}
#content #gallery { 
  height: 80%; 
  width: 98%; 
  display: block; 
  margin-top: 0.6em;
}
#content #gallery .images { 
  position: relative; 
  width: 120em; 
}
#content .gallery img { 
  margin-left: 0.6em
}
#content .hentry, #content .commentlist, #content #respond { 
  color: #000; 
  /*background: #e8e7e3;*/
  border: solid #292827 1px; 
}
#content .hentry h1 #content .hentry h2, #content .hentry h3, #content .hentry h4, #content .hentry h5 { 
  color: #292827; 
  font-weight: strong;
}
#content .hentry .navigation {
  margin-top: -20px;
}
#content .hentry .alignleft {
  float: left;
}
#content .hentry .alignright {
  float: right;
}
#content .hentry small { 
  float: left; 
}
.hentry h2.post-title { 
  margin: 0; 
  padding: 0;  
  float: left;
  color: #e80570;
}
#content .hentry small { 
  font-size: 1.2em; 
  color: #292827; 
  float: left;
  line-height: 1.6em;
  margin-left: 10px;
}
#content .hentry .entry { 
  margin-top: 40px;
  clear: both; 
}
#content .hentry .postmetadata {
  margin-bottom: 30px;
}
#content .hentry .tags {
  float: left;
}
#content .hentry .comment-link {
  float: right;
}
#content .comment { 
  margin: 0.6em; 0; 
}
#content .hentry { 
  margin-bottom: 2em; 
  padding: 10px;
}
#content .post {
  padding: 1.2em;
}
#sidebar li.widget {
  margin-top: 2em;
}
#searchsubmit {
  border: 0;
  background: #292827;
  color: silver;
  text-transform: uppercase;
  font-size: 1.2em;
  padding-left: 0;
}
.footer { 
  background: #e8e7e3;
  color: #292827;
  position: absolute;
  bottom: -3em;
  display: block;
  width: 100%;
  height: 3em;
}
/* jScrollPane */
.jScrollPaneContainer {	
  position: relative;	
  overflow: hidden;	
  z-index: 99; 
}
.jScrollPaneTrack {	
  position: absolute;	
  cursor: pointer; 
  left: 0;	
  height: 100%;	
  background: #e8e7e3;
}
.jScrollPaneDrag { 
  position: absolute; 
  background: #e8e7e3; 
  cursor: pointer;	
  overflow: hidden; 
}
/*
.jScrollPaneDragTop {	
  position: absolute;	
  top: 0;	
  left: 0; 
  overflow: hidden; 
}
.jScrollPaneDragBottom { 
  position: absolute; 
  bottom: 0;	
  left: 0; 
  overflow: hidden; 
}
.jScrollIntervalTrack { 
  position: absolute; 
}
.jScrollPaneDragLeft { 
  position: absolute; 
  bottom: 0;	
  left: 0; 
  overflow: hidden; 
}
.jScrollPaneDragRight {	
  position: absolute;	
  bottom: 0; 
  right: 0; 
  overflow: hidden; 
} */
/* Gallery */
.gallery { 
  overflow: hidden; 
  position: relative; 
  height: 485px;
  margin-top: 0.6em;
}
.gallery ul { 
  position: absolute; 
  list-style: none; 
  overflow: none; 
  white-space: nowrap; 
  padding: 0; 
  margin: 0; 
  margin-left: -10px;
}
.gallery ul li { 
  display: inline;
  margin-right: 0.6em;
}
.gallery .slider { 
  position: absolute; 
  bottom: 0; 
  background: gray; 
  display: block; 
  height: 10px; 
  width: 100%; 
}
.gallery .handle { 
  position: relative; 
  cursor: move; 
  top: 0; 
  z-index: 100; 
  background: #e80570; 
  height: 100%; 
  width: 50px; 
}  
.description { 
  font-size: 0.9em; 
  margin-top: 1.5em;
}
.blog #content { 
  overflow: visible; 
  color: #000; 
  background: #fff;
}
.blog #content form textarea { 
  width: 95%; 
  margin: 0 0.6em; 
}
#sidebar { 
  min-height: 50em; 
  background: #292827; 
  color: #e8e7e3;
}
#sidebar ul { 
  list-style-type: none; 
  margin: 0 0 0 10px; 
  padding: 0; 
}

.blog .post, .blog .commentlist, .blog #respond {
  background: #fff;
}

/* Headers */
h1, h2, h3, h4, h5 { 
  color: #292827;
  font-weight: strong; 
}
h1.page-title {
  color: #e80570;
  font-weight: normal;
}
#header h1 { 
  background: url('images/logo.png') no-repeat; 
  width: 16em; 
  height: 1.7em; 
}
/* Gallery */
.description h2 { 
  text-transform: uppercase; 
  margin: 0; 
  font-size: 0.9em;
}
/* Sidebar */
#sidebar h1, #sidebar h2, #sidebar h3, #sidebar h4, #sidebar h5  {
  color: #e8e7e3;
  font-weight: normal;
}
#sidebar h2 {
  margin-bottom: 0;
}
/* Menu */
#menu h1, #menu h2, #menu h3, #menu h4, #menu h5  {
  font-weight: normal;
}
#menu h2 { 
  font-size: 2em; 
  margin: 0.6em 0 0 0.6em; 
  height: 1.5em; /*changed from 2*/
}
#menu h2.first { 
  margin-top: 0.5em; 
}
#menu h3 { 
  font-size: 1.5em; 
}
/* Blog */
h2.post-title {
  margin-top: 1.5em;
  color: #e80570;
}
.hentry h2.cleared {
  clear: both;
}
#content .description h1 { 
  font-size: 1em; 
  color: #e8e7e3; 
}
#content .description h2 {
  color: #e8e7e3; 
}
#content .hentry h2.title { 
  float: left; 
}
