/**
 * Onze TV
 *
 * Contains all general layout declarations.
 *
 * @author 			Davy De Pauw (davy@marlon.be)
 * @copyright		Marlon BVBA <http://www.marlon.be>
 * @date 			2009-05-12
 * @lastmodified	2009-05-13
 */

/* page structure
---------------------------------------------------------- */

#container {
	position: relative;
	width: 955px;
	margin: 0 auto;
	background: #fff;
}

/* header
---------------------------------------------------------- */

#header {
	height: 134px;
	background: #f09;
}

#logo {
	position: absolute;
	top: 9px;
	left: 35px;
	width: 100px;
	height: 110px;
	text-indent: -999em;
	overflow: hidden;
	background: url(../img/sprite_assets.png) no-repeat 0 0;
}

#baseline {
	position: absolute;
	top: 55px;
	right: 25px;
	width: 275px;
	height: 30px;
	text-indent: -999em;
	background: url(../img/sprite_assets.png) no-repeat -225px 0;	
}

/* navigation
---------------------------------------------------------- */

#nav {
	position: absolute;
	top: 0;
	left: 8px;
	width: 174px;
}

/* common navigation properties
---------------------------------------------------------- */

.nav li {	
	float: left;
	width: 174px;
	margin: 0 0 9px 0;
	font-size: 1.1em;
	overflow: hidden;
}

.nav li a {
	float: left;
	width: 174px;
	text-decoration: none;
	color: #333;
	background: #ddeaef url(../img/sprite_corners.png) no-repeat 0 0;
}

.nav li.big {
	font-size: 1.75em;
}

.nav li.big a span { padding: 9px; }

.nav li a:hover { background-color: #afc4cc; background-position: 0 0 !important; }
.nav li a:hover span { color: #666; background-position: -174px 100% !important; }

.nav li a span {
	float: left;
	padding: 5px 9px;
	width: 156px;
	cursor: pointer;
	background: url(../img/sprite_corners.png) no-repeat -174px 100%;
}

.nav .selected { background-color: #afc4cc; }

.nav li ul {
	padding: 0 0 0 0;
	background: #fff !important;
}

.nav li.loggedin a { background-position: -348px 0; }
.nav li.loggedin a span { background-position: -522px 100%; }

.nav li li { 
	margin: 5px 0 0 0;
	font-size: 1em;
	padding: 0 0 0 18px;
	width: 156px;
	background: #fff !important; 
}

#nav li li a,
#nav li li span { width: 156px; background: none; }

#nav li li a span { padding-left: 8px; padding-right: 8px; }

#nav li li a:hover { color: #666; background: #afc4cc url(../img/sprite_corners.png) no-repeat -696px 0 !important; }
#nav li li a:hover span { color: #666; background: url(../img/sprite_corners.png) no-repeat -853px 100% !important; }

#nav li li span { padding: 3px 0; }

#nav li li li,
#nav li li li a,
#nav li li li span { width: 138px !important; }

#nav li li li a:hover { background-position: -1009px 0 !important; }
#nav li li li a:hover span { background-position: -1147px 100% !important; }


.nav li.hover li a { color: #333; }

.nav li li a { background: #fff !important; }

/* main
---------------------------------------------------------- */

#main {
	position: relative;
	padding: 0 0 5px 0;
	overflow: hidden;
	height: auto;
	border-top: 5px solid #fff;
	background: url(../img/bg_main.png) repeat-y 0 0;
}

/* content
---------------------------------------------------------- */

#content {
	float: left;
	display: inline;
	margin: 5px 0 0 191px;
	padding-bottom: 45px;
	width: 576px;
}

/* breadcrumb
---------------------------------------------------------- */

#breadcrumb {
	width: 517px;
	font-size: .91em;
	padding: 10px 28px 0 28px;
}

#breadcrumb strong {
	float: left;
	padding-right: 10px;
	color: #666;
}

#breadcrumb a {
	float: left;
	text-decoration: none;
}

#breadcrumb a:hover {
	text-decoration: underline;
}

#breadcrumb span {
	float: left;
	width: 15px;
	text-indent: -999em;
	background: url(../img/sprite_assets.png) no-repeat 5px -350px;
}

#breadcrumb em {
	float: left;
	font-style: normal;
	font-weight: bold;
	color: #f09;
}

/* buttons
---------------------------------------------------------- */

.button {
	float: left;
	width: 174px;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background: #666 url(../img/sprite_corners.png) no-repeat 0 0;
}

.button span {
	float: left;
	padding: 3px 9px;
	width: 156px;
	cursor: pointer;
	color: #fff;
	background: url(../img/sprite_corners.png) no-repeat -174px 100%;
}

.button:hover {
	background-color: #f09;
}

/* widget
---------------------------------------------------------- */

.widget {
	padding: 20px 28px;
}

/* visuals
---------------------------------------------------------- */

.visual {
	margin: 0 10px;
}

/* visuals
---------------------------------------------------------- */

.welcome {
	padding: 0 0 0px 0; /* was 15px */
	border-bottom: 5px solid #fff;
}

/* news & search results
---------------------------------------------------------- */

.news h1 {
	margin-bottom: 15px;
}

.news .entry,
.search .result {
	margin-bottom: 35px;
}

.news .entry h2,
.search .result h2 {
	font-size: 1.33em;
	margin: 0 0 4px 0;
	color: #666;
}

.news .entry h2 a,
.search .result h2 a,
.news h3 a { text-decoration: none; }

.date {
	display: block;
	margin: 0 0 10px 0;
	font-weight: bold;
}

.news .summary {
    padding-bottom: 1em;
}

/* paging
---------------------------------------------------------- */

.paging {
	text-align: center;	
}

.paging a { margin: 0 5px; }
.paging .current { font-weight: bold; }

.paging .next,
.paging .previous {
	margin: 0 10px;
}

/* onze tv
---------------------------------------------------------- */

#onzetv {
	float: left;
	display: inline;
	margin: 50px 0 0 26px;
	width: 120px;
	height: 104px;
	overflow: hidden;
}

#onzetv a.button {
	float: left;
	width: 100%;
	height: 100%;
	text-indent: -999em;
	overflow: hidden;
	background: url(../img/sprite_assets.png) no-repeat 0 -120px;	
}

#onzetv a.button:hover { background-position: -120px -120px; }

#onzetv form {
	position: relative;
	display: none;
	float: left;
	width: 120px;
	height: 100%;
	overflow: hidden;
}

#onzetv form fieldset {
	width: 100%;
	height: 100%;
	background: url(../img/sprite_assets.png) no-repeat -240px -120px;
}

#onzetv form .field {
	position: absolute;
	top: 44px;
	left: 9px;
	padding: 2px 5px;
	width: 52px;
}

#onzetv form .btn-send {
	position: absolute;
	top: 44px;
	right: 6px;
	width: 38px;
	height: 22px;
	text-indent: -999em;
	font-size: 0;
	line-height: 22px;
	overflow: hidden;
	cursor: pointer;
	border: none;
	background: url(../img/sprite_assets.png) no-repeat -120px -301px;
}

#onzetv form a { color: #fff; }

#onzetv form .feedback {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	padding: 18px 10px;
	width: 120px;
	height: 68px;
	color: #fff;
	overflow: hidden;
	background: url(../img/sprite_assets.png) no-repeat -360px -120px;
}

#onzetv form .feedback a.thanks {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 68px;
	text-indent: -999em;
	background: url(../img/sprite_assets.png) no-repeat -481px -120px;
}

/* rte
---------------------------------------------------------- */

.rte h2 {
	margin: 15px 0 5px 0;
	padding-top: 5px;
	font-size: 1.34em;
	color: #666;
}

.rte h3 {
	margin: 15px 0 0 20px;
}

.rte h4 {
	margin: 10px 0 0 0;
}

.rte h3 { font-size: 1.167em; }
.rte h4 { font-size: 1em; }

.rte p {
	margin: 0;
	padding: 0;
}

.rte ul,
.rte ol {
	margin: 0;
	padding: 0 0 0 35px;
}

.rte ul { list-style: disc outside; }
.rte ol { list-style: decimal outside; }

/* columns
---------------------------------------------------------- */

.cols {
	
}

.col {
	float: left;
	margin-right: 30px;
	width: 240px;
}

.cols .last { margin-right: 0; }

/* aside
---------------------------------------------------------- */

#aside {
	float: right;
	display: inline;
	margin: 0 8px 20px 0;
	padding-bottom: 12px;
	width: 174px;
	background: #fff;
}

/* aside
---------------------------------------------------------- */

#aside .nav {
	
}

#aside .nav li {
	margin-bottom: 5px;
	overflow: hidden;
	background: #f09 url(../img/sprite_corners.png) no-repeat 0 0;
}

#aside .nav li a {
	padding: 5px 9px;
	background: url(../img/sprite_corners.png) no-repeat -174px 100% !important; 
}

#aside li.hover { background-color: #666; }

#aside .nav li {
	
}

#aside .nav li a span {
	float: left;
	width: 124px;
	padding: 4px 10px 4px 38px;
	background-image: inherit;
	background-position: 0 50%;
	background-repeat: no-repeat;
}

#aside li.hover span,
#aside li a:hover span { background-position: -172px 50% !important; }

#aside .nav a,
#aside .nav li.hover span {
	color: #fff !important;
}

/* skip to nav links
---------------------------------------------------------- */

#skip {
	position: absolute;
	margin: 0;
}

#skip li{
	text-indent:-999em;
}

/* footer
---------------------------------------------------------- */

#footer {
	position: absolute;
	bottom: 0;
	left: 0;
	clear: both;
}

#footer .contents {	
	position: relative;
	float: left;
	display: inline;
	margin: 5px 0 0 191px;
	padding: 9px 28px;
	width: 520px;
	border-top: 5px solid #fff;
}

#copyrights {  }

#footer ul {
	clear: both;
	position: absolute;
	top: 9px;
	right: 28px;
}

#footer li {
	float: left;
	margin-left: 20px;
}

/* common
---------------------------------------------------------- */

.more {
	padding-left: 10px;
	color: #666;
	background: url(../img/sprite_assets.png) no-repeat 0 -350px;
}

.hide {
	position: absolute;
	display: block;
	padding: 0 !important;
	text-indent: -999em ;
	font-size: 0px;
	height: 0px !important;
	line-height: 0px !important;
	background: none !important;
}

.hidden {
	text-indent: -999em;
}

/* browser fixes
---------------------------------------------------------- */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

