/* CREDITS
 * ----------------------------------------------------------
 * Title:		Polsslag Live - CSS Main Stylesheet
 * Author:		David Candreva <david@inventis.be>
 * Date:		29/04/09
 * Last Edit:	29/04/09 David Candreva <david@inventis.be>
 * ----------------------------------------------------------
 * Inventis - Web Architects - We design the Web!
 * www.inventis.be
 */

/* Algemene Styles
---------------------------------------------------------- */
textarea, body{ font-family:Arial, Helvetica, sans-serif; font-size:12px; }
body{ color:#FFF; background:#000 url(../images/live/background.jpg) no-repeat center 0; }

/*default elements*/
strong, b{ font-weight:bold; }
em{ font-style:italic; }
abbr, acronym{ border-bottom:1px dotted; cursor:help; }
.clear{ clear:both; }
a{ text-decoration:none; color:#FFF; }
a:focus{ outline:none;  }

/* Container
---------------------------------------------------------- */
div#container{ margin:0 auto; width:961px; position:relative; }

div#navigation{ position:absolute; width:223px; height:211px; right:52px; top:0; }
div#navigation div.relative{ width:223px; height:211px;  background:url(../images/live/navigation.png) no-repeat 0 0; }

div#navigation ul{ position:absolute; top:86px; right:16px; }
div#navigation ul li{ margin-bottom:3px; }
div#navigation ul li a{ width:20px; height:11px; overflow:hidden; text-indent:-9000px; display:block; background:url(../images/live/nav_tile.png) no-repeat 0 0; }

div#navigation ul li.nl a{background-position:0 0;}
div#navigation ul li.fr a{background-position:0 -14px;}
div#navigation ul li.en a{background-position:0 -28px;}

div#navigation ul li.nl a:hover{background-position:-20px 0;}
div#navigation ul li.fr a:hover{background-position:-20px -14px;}
div#navigation ul li.en a:hover{background-position:-20px -28px;}


img#polsslag_logo{ margin-top:22px; }


div.columns{ width:100%; clear:both; padding-top:17px; padding-bottom: 20px; overflow: hidden; }

div.columns div.col{ float:left; line-height:18px; overflow:hidden; }

	div.columns div.one{ width:386px; }
	div.columns div.two{ width:223px; padding:0 23px 0 25px; }
	div.columns div.three{ width:304px; }
	div.columns div.four{ width:609px;padding:0 23px 0 0; }
	div.columns div.five{ width:936px;padding:0 0 0 0; }
	div.columns div.left{ width: 500px; }
	div.columns div.right{ width: 406px; float: right; }

div.columns div.col div.title{ width:100%; clear:both; overflow:hidden; }
div.columns div.col div.title h2{ font-size:18px;  }
div.columns div.col div.title h2 em{ color:#00a9ac; text-decoration:underline; font-style:normal; }
div.columns div.col.five div.title { padding-bottom: 10px; }
div.columns div.col p.description{ margin-bottom:14px; }
ul.videos li{ float:left; margin:2px; }
ul.videos li img{ border:3px solid #FFF; }

/* more */
div.more { clear: both; padding: 8px 0 40px; }
div.more a { font-size: 16px; color: #f6e500; }
div.more a:hover { text-decoration: underline; }

/* flickr box */
div#flickr-box{ overflow: hidden; }
div#flickr-box img{ border:3px solid #FFF; margin:2px; float: left; display: inline; }

/* twitter box */
div#twitter-box div.date{ color:#f6e500; font-size:10px; }
div#twitter-box div.twitter-entry{ padding-bottom:25px;}
div#twitter-box div.extra { clear: both; }
div#twitter-box div.extra a{ color:#f6e500; }
div#twitter-box div.extra a:hover{ text-decoration:underline; }

/* videos */
div.videos { overflow: hidden; }
div.videos img { float: left; display: inline; margin: 4px 4px 4px 0; border: 4px solid #FFFFFF; }
div.videos img.even { margin-right: 0; }

/* blog entry */
div.columns div.col div.blog-entry{ padding-bottom:50px; }
div.columns div.col div.blog-entry h3{ font-size:16px;  }
div.columns div.col div.blog-entry h3 a{ color:#f6e500; }
div.columns div.col div.blog-entry h3 em{ color:#00a9ac; font-style:normal; }
div.columns div.col div.blog-entry div.content a { color: #00a9ac; }
div.columns div.col div.blog-entry div.content a:hover { text-decoration: underline; }
div.columns div.col div.blog-entry div.content a img { border: 3px solid #FFFFFF; margin: 5px 10px 10px 0; float: left; }
div.columns div.col div.blog-entry div.content a.readmore { color:#f6e500; }
div.columns div.col div.blog-entry div.extra { clear: both; }
div.columns div.col div.blog-entry div.extra a{ color:#f6e500; }
div.columns div.col div.blog-entry div.extra a:hover{ text-decoration:underline; }