/* ======================================================================================
Copyright 2011
TITLE: Main screen styles
AUTHOR: Dijon Correia
UPDATED: 14/04/2011 by Dijon
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*
	------------------------------------------------------------------------------------------------------------------------------------------------------------
	========================== GLOBAL ELEMENTS =================================================================================================================
	------------------------------------------------------------------------------------------------------------------------------------------------------------
*/

/* =START: IMPORTS
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@import "reset.css";
@import "typography.css";

/* =END: IMPORTS
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*
	------------------------------------------------------------------------------------------------------------------------------------------------------------
	========================== STRUCTURE =======================================================================================================================
	------------------------------------------------------------------------------------------------------------------------------------------------------------
*/
/* =START: BODY
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
* { margin: 0; padding: 0; } 

body {
	background: #231f20;
	/*overflow: hidden;*/
	text-align: center;
}

/* =START: MAIN ELEMENTS
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

#wrap {
	margin: 0 auto;
	width: 100%;
	position: relative;
	/*display: table;*/
	/*overflow: hidden;*/
	text-align: left;
	float: left;
	z-index: 1;
}

/* =START: BACKGROUND
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*  
#background-image img {
        /* Set rules to fill background 
        min-height: 100%;
        min-width: 1440px;

        /* Set up proportionate scaling 
        width: 100%;
        height: auto;

        /* Set up positioning 
        position: fixed;
        top: 0;
        left: 0;
}

@media screen and (max-width: 1440px) { /* Specific to this particular image 
        #background-image img {
                left: 50%;
                margin-left: -720px;   /* 50% 
        }
}

#background-image .activeslide, #background-image .activeslide img{  
    display: inline;  
}
*/
				
#background-image {
	float: left;
	position: relative;
	width: 100%;
	text-align: center;
	z-index: -1;
}
#background-image img {
	position: fixed;
    top: 0;
	left: 50%;
    margin-left: -720px;
}

/* =START: HEADER
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#header {
	float: left;
	width: 100%;
	margin: 0 auto;
	position: relative;
	text-align: center;
	z-index: 2;
}

/* =START: NAVIGATION
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* =Menu | Top */
.menu, .menu * {
	margin: 0;
	padding: 0;
	list-style: none;
	position: relative;
}
.menu ul {
	position: absolute;
	top: -999em;
	width: 180px;
	list-style: none;
}
.menu ul li {
	width: 100%;
}
.menu li:hover {
	visibility: inherit;
}
.menu li {
	display: inline-block;
	position: relative;
	zoom: 1;
}
html.ie7 .menu li {
	float: left;
}
.menu a {
	display: block;
	position: relative;
	zoom: 1;
}
.menu li:hover ul,
.menu li.over ul {
	left: 0;
	top: 24px;
}
.menu li ul {
	position: absolute;
	left: -999em;
}
ul.menu li:hover li ul,
ul.menu li.over li ul {
	top: -999em;
}
ul.menu li li:hover ul,
ul.menu li li.over ul {
	left: 180px;
	top: 0;
}

/* =Skin | Fancourt */
.menu-wrap {
	float: left;
	width: 100%;
	height: 24px;
	margin: 8px auto 0;
	text-align: center;
	z-index: 3;
}
.menu {
	width: 960px;
	height: 24px;
	margin: 0 auto;
	padding: 0;
	z-index: 4;
}
.menu a {
	font-size: 14px;
	height: 24px;
	line-height: 24px;
	padding: 0 8px;
	font-weight: normal;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: 0px 1px 3px rgba(0,0,0,0.6);
}
.menu a, .menu a:visited  { 
	color: #fff;
}
.menu li li,
.menu li li li {
	display: block;
	background: url('img/bg-darkgrey-60.png') transparent;
	z-index: 5;
}
.menu li:hover, .menu li.over,
.menu a:focus, .menu a:hover, .menu a:active {
	background: url('img/bg-darkgrey-60.png') transparent;
	outline: 0;
}
.menu ul a {
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	text-shadow: none;
	font-weight: normal;
	position: relative;
	padding: 2px 8px;
}

/* =IE | Hover fix */
*html .menu li {
behavior: expression(
this.onmouseover = new Function("this.className += ' over'"),
this.onmouseout = new Function("this.className = this.className.replace(' over','')"),
this.style.behavior = null
);
}

/* =Menu | Top */
.menu-top {
	position: absolute;
	top: 32px;
	right: 0;
	padding: 0 6px;
}
html.ie7 .menu-top {
	top: 0;
}
.menu-top a {
	display: block;
	position: relative;
	font-size: 11px;
	line-height: 30px;
	color: #333;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: uppercase;
}
.menu-top li {
	float: left;
	line-height: 26px;
	position: relative;
	zoom: 1;
}
.menu-top .spacer {
	display: block;
	padding: 0 10px;
	color: #333;
}

/* =START: CONTENT
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#content {
	position: relative;
	float: left;
	width: 100%;
	height: 448px;
	margin: 0 auto;
	text-align: center;
	overflow: hidden;
}
.container {
	width: 960px;
	height: 100%;
	margin: 0 auto;
	text-align: left;
	position: relative;
}
/* =Panel | Page */
.panels-display {
	display: block;
	position: absolute;
	/*bottom: 285px;*/
	/*bottom: 24px;*/
	bottom: 0;
	left: 0;
	padding-bottom: 24px;
	overflow: hidden;
}
.panels-display.hide {
	display: none;
}
.panel-controls h5{
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
	font-weight: normal;
}
.panel-controls {
	position: absolute;
	/*bottom: 261px;*/
	bottom: 0;
	left: 0;
	text-transform: uppercase;
	font-size: 11px;
}
.panel-controls a {
	text-decoration: none;
}
.panel-controls a:hover {
	text-decoration: none;
}
.panel-content {
	float: left;
	height: 100%;
}
.panel-content {
	padding: 10px;
}
.panel-content h3,
.panel-content h5 {
	font-weight: normal;
}
.panel-title-column {
	position: relative;
	float: left;
	width: 320px;
}
/* =Panel | Page | Left */
.panel-left {
	float: left;
	width: 315px;
	height: 100%;
	margin: 0 8px -9000px 0;
	padding: 0 0 9000px;
	/*overflow: hidden;
	overflow-y: scroll;*/
}
.panel-left-title h3 {
	/*line-height: 24px;*/
	padding: 1px 10px;
}
.panel-left-title {
	float: left;
	width: 315px;
	height: 24px;
	line-height: 24px;
}
/* =Panel | Page | Right */
.panel-right {
	float: left;
	width: 520px;
	height: 100%;
	margin: 0 0 -9000px;
	padding: 0 0 9000px;
	/*overflow: hidden;
	overflow-y: scroll;*/
}
.panel-right-title {
	display: block;
	height: 24px;
	line-height: 24px;
}
/* =Panel | Page | Single */
.panel-title-single {
	display: block;
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
}
/* =Panel | Page | Full */
.panel-full-title {
	float: left;
	width: 960px;
	height: 24px;
	line-height: 24px;
}
.panel-full-title h3 {
	float: left;
	padding: 1px 10px;
}
/* =Panel | Page | Full */
.panel-full {
	float: left;
	width: 960px;
	height: 100%;
}
.panel-full .panel-content {
	width: 960px;
	padding: 0;
}
.panel-full .panel-content.stretch {
	min-height: 396px;
}
html.ie7 .panel-full .panel-content.stretch {
	height: 396px;
}
/* =Panel | Page | Controls */
.panel-left-controls {
	float: left;
	width: 315px;
	height: 24px;
	line-height: 24px;
	margin: 0 8px 0 0;
}
.panel-right-controls {
	float: left;
	width: 510px;
	height: 24px;
	line-height: 24px;
	padding: 0 0 0 10px;
}
.panel-full-controls {
	float: left;
	width: 960px;
	height: 24px;
	line-height: 24px;
}
.control-pagination {
	float: left;
	padding: 0 10px 0 0;
}
.control-pagination.floatcenter {
	display: inline-block;
}
.control-open-close {
	float: right;
	padding: 0 10px;
}
.control-pagination li {
	float: left;
	margin: 0 2px;
}
.panel-right-controls .control-pagination {
	
}
.panels-full .panel-left-controls {
	margin-right: 0;
}
.panels-full .panel-right-controls {
	width: 645px;
	padding: 0;
}
.panels-full .control-pagination {
	padding-left: 10px;
}
a.controls-back-button {
	float: left;
	margin-right: 20px;
}

/* =Panel | Grid | Items */
.panel-grid-items {
	display: block;
}
.panel-grid-item {
	float: left;
	display: block;
	padding: 10px;
	width: 300px;
}
.panel-grid-item.item-odd {
	background: url('img/bg-darkgrey-40.png') transparent;
}
.panel-grid-item img {
	margin: 0 0 10px 10px;
}
.panel-grid-item:hover {
	background: #333;
}

/* =Panel | Grid | Items | List */
.panel-grid-items-list {
	display: block;
}
.panel-grid-list {
	float: left;
	display: block;
	width: 240px;
}
.panel-grid-list li {
	position: relative;
	float: left;
	width: 220px;
	height: 82px;
	padding: 5px 10px;
	text-transform: uppercase;
	border-bottom: 1px solid #333333;
    border-right: 1px solid #333333;
}
.panel-grid-list.divider li {
	padding-left: 0;
}
.panel-grid-list li p {
	display: block;
	float: left;
	width: 136px;
	line-height: 14px;
	margin: 0 0 5px;
	padding: 0;
}
.panel-grid-list-icon {
	float: left;
	margin-right: 10px;
}
.panel-grid-list-meta {
	position: absolute;
	bottom: 0;
	right: 0;
	display: block;
	width: 172px;
    height: 24px;
    line-height: 24px;
	padding: 5px 10px;
	text-align: right;
	/*background: url('img/bg-darkgrey-40.png') transparent;*/
}
.panel-grid-list-meta a {
	text-decoration: underline;
	height: 24px;
	line-height: 24px;
	padding: 0 0 0 5px;
}
.panel-grid-list li a:hover {
	text-decoration: none;
}
.panel-grid-list.col-even li.row-even {
	background: url('img/bg-darkgrey-40.png') transparent;
}
.panel-grid-list.col-odd li.row-odd {
	background: url('img/bg-darkgrey-40.png') transparent;
}
.panel-grid-list li:hover {
	background: #333;
}
/* =Tabs | Page | Content */
.tabs-controls {
	
}
.tabs-nav {
	float: left;
	width: 520px;
	margin: 0;
	padding: 0;
}
.tabs-nav {
	list-style: none;
}
.tabs-nav li {
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}
.tabs-nav li a {
	display: block;
	height: 24px;
	line-height: 24px;
	padding: 0 10px;
	font-size: 14px;
	text-decoration: none;
	text-transform: uppercase;
}
.tabs-nav li.tab-active {
	background: #231f20;
}
.tab-content {
	float: left;
	padding: 10px;
}
.tab-content h3,
.tab-content h5 {
	font-weight: normal;
}
.tab-content.tab-hide {
	display: none;
}
.tab-item-list {
	clear: both;
}
.tab-item-list p {
	float: left;
	width: 424px;
}
.tab-content a.readmore {
	float: right;
	display: block;
	padding: 0 0 0 20px;
}
html.ie7 .tab-content a.readmore {
	width: 55px;
}

/* =START: FOOTER
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#footer {
	/*position: relative;
	margin-top: -150px; /* negative value of footer height
	height: 150px;
	clear: both;
	bottom: 30px;*/
	/*position: absolute;*/
	display: block;
	position: relative;
	float: left;
	height: 150px;
	width: 100%;
	margin: 15px 0 10px;
	text-align: center;
	clear: both;
}
/* =Menu | Bottom */
.menu-bottom {
	float: left;
	text-align: left;
	margin: 0;
	padding: 0;
}
.menu-bottom li {
	float: left;
	position: relative;
	margin: 0;
	padding: 0;
}
.menu-bottom li:hover {
	background: url('img/bg-darkgrey-60.png') transparent;
}
.menu-bottom a {
	display: block;
	position: relative;
	font-size: 18px;
	color: #fff;
	padding: 15px 40px 15px 10px;
	font-weight: normal;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: 0px 1px 3px rgba(0,0,0,0.6);
}
/* =Logo | Footer */
.footer-icons {
	float: left;
	width: 800px;
	/*height: 80px;*/
	height: 75px;
	text-align: left;
}
a.logo-footer {
	/*display: inline-block;*/
	float: left;
	margin-right: 45px;
}
a.logo-footer img {
	border: 0 none;
}
/* =Menu | Footer */
.menu-footer {
	float: left;
	position: relative;
	margin: 0;
	padding: 0;
}
.menu-footer li {
	display: inline-block;
	position: relative;
	margin: 0;
	padding: 0;
}
.menu-footer a {
	display: block;
	position: relative;
	font-size: 11px;
	color: #fff;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: uppercase;
}
.menu-footer .spacer {
	display: inline-block;
	margin: 0 15px;
	line-height: 14px;
}
html.ie7 .menu-footer li {
	display: inline;
}
/* =Menu | Footer | Credits */
.menu-footer-credits {
	width: 960px;
	margin: 0 0 0 -490px;
    padding: 0 10px;
    position: absolute;
    bottom: -28px;
	left: 50%;
	background: #231f20;
}
.menu-footer-credits li {
	float: left;
	position: relative;
	margin: 0 15px 0 0;
	padding: 0;
	font-size: 11px;
}
.menu-footer-credits a {
	color: #fff;
	letter-spacing: normal;
	text-decoration: none;
}
/* =Logo | Bottom */
a.logo-main {
	float: right;
	display: block;
	margin: 7px auto 0;
}
a.logo img {
	border: 0 none;
	display: block;
}
