/**
 * NoNumber Page stylesheet
 *
 * @package			Tabber
 * @version			1.8.3
 *
 * @author			Peter van Westen <peter@nonumber.nl>
 * @link			http://www.nonumber.nl
 * @copyright		Copyright © 2011 NoNumber! All Rights Reserved
 * @license			http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
 */

div.tabber_nav {
	display: block;
	clear: left;
	margin: 5px 0 0 0;
	padding: 0 10px;
	line-height: 1em;
	zoom: 1; /* Fix for IE height issue */
}
div.tabber_nav ul.tabber_tabs {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	list-style-image: none !important;
	background: none !important;
}
div.tabber_nav li.tabber_tab {
	float: left;
	margin: 5px 2px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
	list-style-image: none !important;
	background: none !important;
}
div.tabber_nav li.tabber_tab.active {
	margin-top: 0 !important;
}
/* Tabs */
div.tabber_nav li.tabber_tab a,
div.tabber_nav li.tabber_tab a:link,
div.tabber_nav li.tabber_tab a:visited,
div.tabber_nav li.tabber_tab a:active,
div.tabber_nav li.tabber_tab a:hover {
	color: #666666;
	outline: 0;
	text-decoration: none;
}
div.tabber_nav li.tabber_tab a,
div.tabber_nav li.tabber_tab a:hover {
	display: block;
	width: auto;
	_width: 0%;
	padding: 5px 5px 0 5px;
	height: 20px;
	_height: 25px;
	font-size: 14px;
	line-height: 1em;
	font-weight: bold;
	white-space: nowrap;
	border: solid 1px #B4B4B4;
	border-bottom: none;
	background: #FFFFFF url(../images/gradient.png) repeat-x 0 -100px;
	text-decoration: none !important;
}
div.tabber_container.rounded div.tabber_nav li.tabber_tab a,
div.tabber_container.rounded div.tabber_nav li.tabber_tab a:hover {
	-webkit-border-radius: 10px 10px 0 0;
	-moz-border-radius: 10px 10px 0 0;
	border-radius: 10px 10px 0 0;
}
/* Tabs: Active state */
div.tabber_nav li.tabber_tab.active a,
div.tabber_nav li.tabber_tab.active a:hover {
	color: #FFFFFF;
	background-color: #0078FF;
}
div.tabber_nav li.tabber_tab.active a {
	padding-bottom: 5px;
}
/* Tabs: Hover state */
div.tabber_nav li.tabber_tab a:hover {
	color: #333333;
	background-color: #80BCFF; /* 50% white */
}

/* Content area */
div.tabber_content,
div.tabber_content > div,
div.tabber_content div.tabber_item {
	position: relative !important;
	overflow: hidden !important;
}
div.tabber_content {
	margin-top: -1px;
	clear: left;
	padding: 10px 20px;
	border: 1px solid #B4B4B4;
}
div.tabber_container.rounded div.tabber_content {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

/* STYLING FOR IF JAVASCRIPT FAILS */
div.tabber_noscript div.tabber_content {
	margin: 0;
	padding: 0;
	border: none;
}

/* EXTRA STYLING
 * If you want to change styles, it's best to place your custom (overriding) styles in the templates stylesheet,
 * so they do not get overwritten when updating Tabber.
 */

/* Style: blue */
/* Tabs: Normal state */
div.tabber_nav li.tabber_tab.blue a {
	background-color: #BFDDFF; /* 75% white */
}
/* Tabs: Hover state */
div.tabber_nav li.tabber_tab.blue a:hover {
	background-color: #80BCFF; /* 50% white */
}
/* Tabs: Active state */
div.tabber_nav li.tabber_tab.active.blue a,
div.tabber_nav li.tabber_tab.active.blue a:hover {
	background-color: #0078FF;
}
/* Content area */
div.tabber_content.blue {
	/*background-color: #BFDDFF;*/
}

/* Style: green */
/* Tabs: Normal state */
div.tabber_nav li.tabber_tab.green a {
	background-color: #BFE5C0; /* 75% white */
}
/* Tabs: Hover state */
div.tabber_nav li.tabber_tab.green a:hover {
	background-color: #80CC82; /* 50% white */
}
/* Tabs: Active state */
div.tabber_nav li.tabber_tab.active.green a,
div.tabber_nav li.tabber_tab.active.green a:hover {
	background-color: #009905;
}
/* Content area */
div.tabber_content.green {
	/*background-color: #BFE5C0;*/
}

/* Style: grey */
/* Tabs: Normal state */
div.tabber_nav li.tabber_tab.grey a {
	background-color: #D9D9D9; /* 75% white */
}
/* Tabs: Hover state */
div.tabber_nav li.tabber_tab.grey a:hover {
	background-color: #B3B3B3; /* 50% white */
}
/* Tabs: Active state */
div.tabber_nav li.tabber_tab.active.grey a,
div.tabber_nav li.tabber_tab.active.grey a:hover {
	background-color: #666666;
}
/* Content area */
div.tabber_content.grey {
	/*background-color: #D9D9D9;*/
}

/* Style: mystyle */
/* This is an example of how you can make your own style
 * You can add styles as you like
 * You can use css to style the Tabber elements how you want it.
 * It's best to place your custom (overriding) styles in your templates stylesheet (css file),
 * so they do not get overwritten when you update this extension.
 */
/* Tabs: Normal state */
div.tabber_slide.mystyle a {
	background-color: #123456;
}

/* Tabs: Hover state */
div.tabber_slide.mystyle a:hover {
	background-color: #ABCDEF;
}

/* Tabs: Active state */
div.tabber_slide.active.mystyle a,
div.tabber_slide.active.mystyle a:hover {
	background-color: #456789;
}

/* Content area */
div.tabber_content.mystyle {
	/*background-color: #CCDDEE;*/
}