/**********************************************************
 *              Section, Page and Body Classes
 **********************************************************/
/** 
 * Section Class
 * The section class takes the 2nd part of the URL and
 * builds a section-[path-part] class from it. If you emulate
 * site sections using the Pathauto module this can be a 
 * powerful way to style site sections.
 */
/* .section-[path-part] {}  replace [path-part] */

/* Front or not front. */
.front {}
.not-front {}

/* Is the user logged in. */
.logged-in {}
.not-logged-in {}

/* Node type body classes */
.node-type-book  {}
.node-type-blog  {}
.node-type-forum {}
.node-type-page  {}
.node-type-poll  {}
.node-type-story {}

/**
 * Warning! 
 * The sidebar body classes are integral to how genesis
 * applies the layout - do not add margin, padding, borders,
 * or positioning styles to these classes! @see layout.css. 
 */
.one-sidebar   {}
.two-sidebars  {}
.sidebar-right {}
.sidebar-left  {}

/** 
 * Optional Region body classes
 * When any of the following regions are active a body class can be set.
 * To use you need to uncomment the conditional statements in 
 * genesis_preprocess_page(), @see template.php.
 */
/*
.leaderboard       {}
.header-blocks     {}
.secondary-content {}
.tertiary-content  {}
.footer            {}
*/

/** 
 * Page Path Class
 * The page path class takes the entire URL and
 * builds a page-[path] class from it. See example
 * below. You need to use Firebug or view source to
 * find out what the actual class will be, and be aware
 * that this will change if your URL alias changes!
 */
/* .page-[example-node-path] {}  replace [example-node-path] */


/**********************************************************
 *                  The wrapper divs
 *    Be careful how you modify these, see layout.css
 **********************************************************/
/**
 * Width Setting
 *
 * Genesis supports Elastic, Fluid and Fixed width values.
 * Elastic layouts are dynamic and will expand or contract when 
 * the font size is changed. Fluid widths change when the browser 
 * is resized and fixed width layouts stay the same width even 
 * when the broswer is resized or the font size is changed.
 *
 * Elastic layouts use ems,       e.g. 80em
 * Fluid layouts use percentages, e.g. 85%
 * Fixed widths use pixels,       e.g. 960px
 */
#container {
	width: 960px;     /* Width for IE6 */
}
body > #container {
	width: 100%;      /* Width for all other browsers */
	max-width: 960px; /* set a maximum width */
	min-width: 960px; /* set a minimum width */
}

/* Column wrappers */
#columns,
#content-column {
	margin: 0px;
	font-size: 0px;
}

#main-content {
	font-size: 11px;
}

/**********************************************************
 *                       Regions
 **********************************************************/
/* Target all regions with this low specifity selector. */
.region {}

/**
 * Most regions have an .inner div to set paddings or other
 * design contingencies.
 */
 
/* Leaderboard is a full width region at the very top, 
   ideal for displaying banners. */
#leaderboard {}

/* Header blocks region is embedded in the header, 
   usefull for displaying small banners. */
#header-blocks {
  float: left;
  margin-left: 2em; /* LTR */
}

/* Secondary content is a full width region between 
   the header and the main columns. */
#secondary-content {}

/* Tertiary content is a full width region above the footer, 
   below the main content. */
#tertiary-content {}

/* Content top and bottom are above and below the main content, 
   within the main content column. */
#content-top {}
#content-bottom {}


/**********************************************************
 *                      Sidebars
 **********************************************************/
/* Target both sidebars with this low specifity selector. */
.sidebar {}

/* Target a specific sidebar, inner or sidebar-inner. */
#sidebar-left  {}
#sidebar-right {}


/*********************************************************
*                     GPanel Regions
**********************************************************/
.two-col-50 {}
.two-col-50 .col-1 {}
.two-col-50 .col-2 {}

.two-col-50.with-nested {}
#two-col-50-nested {}
.two-col-50.with-nested .col-1 {}
.two-col-50.with-nested .col-2 {}
.two-col-50.with-nested #two-col-50-nested .col-1 {}
.two-col-50.with-nested #two-col-50-nested .col-2 {}

.three-col-33 {}
.three-col-33 .col-1 {}
.three-col-33 .col-2 {}
.three-col-33 .col-3 {}

.four-col-25 {}
.four-col-25 .col-1 {}
.four-col-25 .col-2 {}
.four-col-25 .col-3 {}
.four-col-25 .col-4 {}


/**********************************************************
 *                   Skip navigation
 **********************************************************/
/**
 * To hide the skip-nav you can use: 
 * 
 * height: 0; 
 * overflow: hidden;
 * 
 * Do not use display:none as this hides it from screen readers!
 */
#skip-nav {
   text-align: right; /* LTR */
}

/* Override default pseudo class styles */
#skip-nav a:link    {}
#skip-nav a:visited {}
#skip-nav a:hover   {}
#skip-nav a:focus   {}
#skip-nav a:active  {}

/**
 * An alternative method is to position the skip-nav link offscreen
 * until the user tabs the link into focus. Uncomment the following to use.
 * 
 * Adjust the style of the active/focused link to suit.
 */
/*
#skip-nav {
   text-align: left;
}
#skip-nav a:link, 
#skip-nav a:hover, 
#skip-nav a:visited {
  height: 1px;
  overflow: hidden;
  position: absolute;
  top: -999em;
}
#skip-nav a:active,
#skip-nav a:focus {
  background: #FFF;
  color: #C00000;
  height: 1.5em;
  overflow: visible;
  position: fixed;
  top: 0;
  right: 0;
  width: auto;
  z-index: 1000;
}
*/


/**********************************************************
 *                 Header Elements
 **********************************************************/
/* #header wraps #branding, #search-box-top and #header-blocks. */
#header {
	height: 90px;
	
	overflow: hidden;
}
	#branding {
		float: left;
		
		width: 15%;
	}
		#site-name {
			display: block;
			
			margin: 0px;
			padding: 25px 0px 0px;
		}
			#site-name a {
				display: block;
				
				width: 126px;
				height: 46px;
				
				margin: 0px;
				padding: 0px;
				
				background: url(../images/sprite.png) no-repeat -10px -10px;
				
				color: #222222;
				font-size: 0px;
				line-height: 0px;
			}
		#site-slogan {
			display: none;
		}
	#nav {
		float: left; 
		
		width: 85%;
		
		margin: 0px;
		padding: 40px 0px 0px;
		
		clear: none;
	}
		ul.primary-links {
			display: block;
			
			float: right;
			
			margin: 0px;
			padding: 0px;
		}
			ul.primary-links li {
				display: block;
				
				float: left;
				
				margin: 0px 0px 0px 30px;
				padding: 0px;
				
				list-style: none;
				list-style-type: none;
				list-style-image: none;
			}
				ul.primary-links li a {
					display: block;
					
					color: #999999;
					font-size: 14px;
					font-family: Helvetica, Verdana, Arial, sans-serif;
					text-decoration: none;
				}
				ul.primary-links li a:hover {
					color: #666666;
				}
				ul.primary-links li a.active {
					color: #FF6600;
				}


/**********************************************************
 *                    H1 Page Title
 **********************************************************/
/* The main title on each page. */
h1#page-title {
	display: none;
}


/**********************************************************
 *                     Pager 
 **********************************************************/
/* The first 2 classes provide the base pager styles. */
.item-list ul.pager    {}
.item-list ul.pager li {
  margin: 0;
}

/* Theme the various states of pager links. */
.item-list ul.pager li a:link    {}
.item-list ul.pager li a:visited {}
.item-list ul.pager li a:hover   {}

/* Note: .pager-current is for the current page. */
.item-list ul.pager li.pager-item     {}
.item-list ul.pager li.first          {}
.item-list ul.pager li.last           {}
.item-list ul.pager li.pager-current  {}
.item-list ul.pager li.pager-first    {}
.item-list ul.pager li.pager-previous {}
.item-list ul.pager li.pager-next     {}
.item-list ul.pager li.pager-last     {}


/**********************************************************
 *               Footer, Footer Message
 **********************************************************/
#footer {
	margin: 0px;
	padding: 20px 0px;
	
	color: #666666;
	font-size: 10px;
	
	clear: both;
}

#footer p {
	margin: 0px;
	
	color: #666666;
}

#footer .follow_label {
	float: right;
	
	display: block;
	
	margin: 3px 10px 0px 0px;
	
	color: #666666;
}

#footer .social {
	float: right;
	
	display: block; 
	
	width: 16px;
	height: 16px;
	
	margin: 0px 0px 0px 5px;
	padding: 0px;
	
	color: #dedede;
	font-size: 0px;
	line-height: 0px;
	
	background: url(../images/sprite.png) no-repeat 0 0;
}
#footer .social.facebook {
	background-position: -10px -154px;
}
	#footer .social.facebook:hover {
		background-position: -10px -190px;
	}
#footer .social.twitter {
	background-position: -46px -154px;
}
	#footer .social.twitter:hover {
		background-position: -46px -190px;
	}
#footer .social.flicker {
	background-position: -82px -154px;
}
	#footer .social.flicker:hover {
		background-position: -82px -190px;
	}
#footer .social.vimeo {
	background-position: -118px -154px;
}
	#footer .social.vimeo:hover {
		background-position: -118px -190px;
	}
#footer .social.google {
	background-position: -154px -154px;
}
	#footer .social.google:hover {
		background-position: -154px -190px;
	}
#footer .social span {
	display: none;
}