/* ========== STYLE.CSS =============

Navigation:
-----------
- Basic Styles
- Header Styles
- Main Layout
- Link Styles
- Thermometer Styles
- Navigation Styles
- List Styles
- Form Styles
- Sentiment Styles
- Pagination Styles 

====================================*/

/* -------- BASIC STYLES ---------- */

* {line-height: 1.5; }
body, html {background:url(../images/bg.jpg) repeat-x; font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #959595; margin: -5px 0 0 0;}

.error {color:#1188c1; text-transform:uppercase;font-weight:bold;}
/* -------- HEADER STYLES ---------- */

h1 { font-size: 14px; text-transform: uppercase; font-weight: bold; color: #444; padding: 5px 0 5px 10px;} 
	h1 span.maker {font-size: 12px; text-transform: none;}
h2 { font-size: 11px; text-transform: uppercase; font-weight: bold; color: #1188c1; padding: 10px 0 10px 15px; border-bottom: 1px dashed #ccc; height: 17px;}

h3 { font-size: 15px; font-weight: normal; padding: 5px 0 0 15px;}
	h3 .top { color: #60a300; }
	h3 .flop { color: #ed1c24; }
h4 { font-weight: bold; color: #959595;}

/* -------- MAIN LAYOUT ---------- */

#container{ text-align:left; width:990px;}

#header{ position: relative; height: 133px;}
	#menu {position: absolute; right: 0; top: 10px;}
	#tagline {position: absolute; right: 741px; top: 86px;color:#005B7F; font-size:16px;}
	#beta{position: absolute; left: 14px; top: 90px;color:#005B7F; font-size:13px;}

#wrapper { float:right; width:730px; border-left: 1px dashed #ccc;}
	#content{ min-height:420px;z-index:99;}
		*html #content {height: 495px;}
	#search { height: 140px; width: 724px; color: #fff; background:url(../images/zoekbg.jpg) no-repeat; position: relative;}
		#search p {font-size: 13px; font-style: italic; padding: 20px;}
#left_column{ float:left; width:258px; border-top: 1px dashed #ccc; position: relative;}

#main_content {}
	#main_content p {padding: 5px 10px 5px 10px;}

#mid_column {width: 509px; float: left; min-height: 280px; overflow: auto; }

#right_column {float: right; display: block; width: 219px; background: #fff; min-height: 280px;}
	#right_column h4 {margin: 0 0 10px 0;}
	#right_content {padding: 10px;}
		#right_content img {float: left; padding: 3px; border: 1px solid #ccc; margin: 0 5px 0 0;}

#content_footer h2 a{ font-size: 11px; text-transform: uppercase; font-weight: bold; color: #1188c1; height: 17px;}
	#toplijst { width: 509px; float: left; border-right: 1px dashed #ccc;}
	#meestbekeken { width: 219px; float: left;}
	
#footer{ clear:both; width:100%; border-top: 1px dashed #ccc; text-align: right; color: #666; font-size: 10px; padding: 5px 0 5px 0; position: relative;}

.rulerListsIframe{width:730px;float:right;}
/* -------- LINK STYLES ---------- */

img a, a img{border: 0;}
a { text-decoration: none; font-weight: bold; color: #7d7d7d;}
	a:hover { text-decoration: underline; color: #000;}
#content_footer a{ color: #7d7d7d;}
#footer a {color: #636363;}
h1 span.maker a { color: #999999;}

/* -------- GRAPHIC STYLES ---------- */

#graphic {margin: 0 0 0 50px; padding: 10px 0 0 0;height:250px}
	a#graphic_part1 {background:url(../images/graphic_1_off.jpg); display: block; width: 95px; height: 216px; float: left;}
		a:hover#graphic_part1 {background:url(../images/graphic_1_on.jpg); display: block; width: 95px; height: 200px; float: left;}
	a#graphic_part2 {background:url(../images/graphic_2_off.jpg); display: block; width: 100px; height: 216px; float: left;}
		a:hover#graphic_part2 {background:url(../images/graphic_2_on.jpg); display: block; width: 100px; height: 200px; float: left;}
	a#graphic_part3 {background:url(../images/graphic_3_off.jpg); display: block; width: 104px; height: 216px; float: left;}
		a:hover#graphic_part3 {background:url(../images/graphic_3_on.jpg); display: block; width: 104px; height: 200px; float: left;}
	a#graphic_part4 {background:url(../images/graphic_4_off.jpg); display: block; width: 107px; height: 216px; float: left;}
		a:hover#graphic_part4 {background:url(../images/graphic_4_on.jpg); display: block; width: 107px; height: 200px; float: left;}

/* -------- ELEMENT STYLES ---------- */

.clearboth {clear: both;}
#logo {background: url(../images/logo.jpg); width: 362px; height: 133px; display: block; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.help {background: url(../images/help.jpg); width: 18px; height: 18px; display: block; position: absolute; top: 8px; left: 230px; }
.help_zoeken {background: url(../images/help_zoeken.jpg); width: 19px; height: 19px; display: block; position: absolute; top: 8px; right: 10px; }
/* -------- THERMOMETER STYLES ---------- */

#meter {background: url(../images/thermometer.jpg) left no-repeat; height: 401px; width: 62px; float: left;}
#thermoitems {padding: 0 0 0 0;position:relative;}
.thermo_item a { padding: 3px 20px 3px 3px; color:#7d7d7d;position:absolute;left:62px; margin:0 10px 0 0; max-width:140px; text-decoration:underline;}
	.thermo_item a.selected {color: #fff;}
	.thermo_item a.positief {background: url(../images/positief_off.jpg) right no-repeat;}
		.thermo_item a.selected {background: #1188c1 right no-repeat;}
		.thermo_item a.positief.selected {background: url(../images/positief_on.jpg) #1188c1 right no-repeat;}
	.thermo_item a.negatief {background: url(../images/negatief_off.jpg) right no-repeat;}
		.thermo_item a.negatief.selected {background: url(../images/negatief_on.jpg) #1188c1 right no-repeat;}
	.thermo_item a.neutraal {background: url(../images/neutraal_off.jpg) right no-repeat;}
		.thermo_item a.neutraal.selected {background: url(../images/neutraal_on.jpg) #1188c1 right no-repeat;}

#thermo_nav { margin: 10px 0 0 0; position: relative;}
	#thermo_nav a {margin: 0 5px 0 0;}
		*html #thermo_nav a {margin: 0 2px 0 0;}
		
	.aanpassen {background: url(../images/knop_aanpassen.jpg) no-repeat; width: 94px; height: 32px; display: block; float: left;}
	 
	.RulerAdmin{margin-top:10px;color:#FF7900;}
	a.adminButton{background:#FF7900; margin: 0 5px 0 0;padding:5px;color: #fff; font-size:14px;display: block; border: 1px solid #d4d4d4;float:left;}	
	a.adminButton.disabled{background:#E2E2E2;}
	
		#thermo_nav ul li {float: left;}
		#thermo_nav ul li ul { background:#fff; color: #000; display: none; position: absolute; top: 28px; left: 0px; width: 92px; border: 1px solid #d4d4d4;}
			*html #thermo_nav ul li ul {left: -98px;}
		
		#thermo_nav ul:hover li ul {display: block;}
			#thermo_nav ul li ul li a {padding: 5px; width: 82px; display:list-item;}
				#thermo_nav ul li ul li a:hover {background: #1188c1;}
					#thermo_nav ul li ul li a:hover {color: #fff;}
					#thermo_nav ul li ul li a.disabled {color:#E2E2E2;}
					#thermo_nav ul li ul li a.disabled:hover{text-decoration:none; background:none;}
	
	.rulerHeader h1 {width:215px; overflow:hidden;}			
	.deel {background: url(../images/knop_deel.jpg) no-repeat; width: 54px; height: 32px; display: block; float: left;}
	.publiceer {background: url(../images/knop_publiceer.jpg) no-repeat; width: 85px; height: 32px; display: block; float: left;}


/* -------- NAVIGATION STYLES ---------- */

#menu { background: url(../images/topmenu_left.jpg) no-repeat left; height: 29px; }
	#menu div {background: url(../images/topmenu_right.jpg) no-repeat right;}
	#menu div div {color: #7d7d7d; background: url(../images/topmenubg.jpg) repeat; margin: 0 11px 0 11px; padding: 6px 0 6px 0; min-height: 17px;}
	a.menuItem { color: #7d7d7d; padding: 3px; display:inline;}
		a.menuItemSelected {color:#1188c1;}
		a.menuItemHover { color: #666; }

/* -------- LIST STYLES ---------- */


#pijl_links {float: left; width: 12px; height: 25px; border-bottom: 1px dashed #ccc; padding: 12px 0 0 3px;}
	#pijl_links a {background:url(../images/pijl_links.jpg) no-repeat; height: 9px; width: 7px; display: block; }
#pijl_rechts {float: left; width: 12px; height: 25px; border-bottom: 1px dashed #ccc; padding: 12px 0 0 0px; }
	#pijl_rechts a {background:url(../images/pijl_rechts.jpg) no-repeat; height: 9px; width: 7px; display: block;}

#lijstitems {width: 480px; float: left;}
	.lijst_item {float: left; width: 160px; display: block;}
	.lijst_item ul { padding: 0 0 0 13px;}
	.lijst_item ul li { height: 16px; padding: 0 0 0 13px;}
		.lijst_item ul li.positief {background: url(../images/positief_off.jpg) left no-repeat;}
		.lijst_item ul li.negatief {background: url(../images/negatief_off.jpg) left no-repeat;}
		.lijst_item ul li.neutraal {background: url(../images/neutraal_off.jpg) left no-repeat;}

#meestbekeken ul { padding: 10px 0 10px 15px; }
	#meestbekeken h2 {background: #6ebde9; color: #fff;}
	#meestbekeken ul li{ padding: 0 0 0 13px; height: 16px; clear:both;}
		#meestbekeken ul li.positief {background: url(../images/positief_off.jpg) left no-repeat; }
		#meestbekeken ul li.negatief {background: url(../images/negatief_off.jpg) left no-repeat;}
		#meestbekeken ul li.neutraal{background: url(../images/neutraal_off.jpg) left no-repeat;}
	
	#meestbekeken a {float:left;max-width:95px;overflow:hidden;}
	#meestbekeken a.maker {font-size: 9px; color: #999999; font-style: italic;float:right;max-width:90px;}

/* -------- FORM STYLES ---------- */

#zoekformulier {margin: 0 0 0 20px;}
	*html #zoekformulier {margin:0 0 0 10px;}
input {border: 0;}
#zoekveld { float: left;margin-left:20px;}
#zoekknop { float: left;}
.zoekveld {background: url(../images/zoekveld.jpg) no-repeat; width: 544px; height: 26px; font-size: large; color: #999999; padding: 10px;}
.zoekknop {background: url(../images/zoekknop.jpg) no-repeat; width: 71px; height: 48px; margin: 0 0 0 10px; }
	*html .zoekknop {background: url(../images/zoekknop.jpg) no-repeat; width: 71px; height: 45px; margin: 0; }

/* -------- SENTIMENT STYLES ---------- */

#sentiment {padding:5px 0 5px 10px;}
	#sentiment ul { padding: 10px 0 10px 18px; }
	#sentiment ul li{ padding: 0 0 0 16px; margin: 0 0 8px 0;} 
	#sentiment ul li.positief {background: url(../images/positief_rondje.jpg) top left no-repeat;}
	#sentiment ul li.negatief {background: url(../images/negatief_rondje.jpg) top left no-repeat;}
	#sentiment ul li.neutraal{background: url(../images/neutraal_rondje.jpg) top left no-repeat;}
.sentiment {color: #1188c1; font-size: 18px; margin: 0 0 0 5px;}
.sentimentTimeframe {color: #7d7d7d; font-size: 12px; margin: 0 0 0 2px;text-transform: none; }
/* -------- RULER RESULTS STYLES ---------- */

.rulerResults{ padding:5px 0 5px 10px;}
	.rulerResults ul { padding: 5px 0px; }
	.rulerResults ul li{ padding: 0 0 0 16px; margin: 0 0 8px 0;} 
	.rulerResults ul li.positief {background: url(../images/positief_off.jpg) top left no-repeat;}
	.rulerResults ul li.negatief {background: url(../images/negatief_off.jpg) top left no-repeat;}
	.rulerResults ul li.neutraal {background: url(../images/neutraal_off.jpg) top left no-repeat;}

	#right_column .rulerResults h4 {margin: 0 0 3px 0;}

	.rulerResults .rulerTopics{ font-style:italic; max-height:16px;}
	.rulerResults .rulerDescription{}
	.rulerResults h2{border-bottom:none; padding:10px 0;}	
	
	.rulerResults .error { text-decoration: none; font-weight: bold; color: #7d7d7d; text-transform:none;}
	
	.removeRulerLink{ font-size: x-small; text-transform:lowercase;}
/* -------- PAGINATION STYLES ---------- */

#pagination {text-align: center; padding: 10px; font-size: 14px;}
	#pagination a{margin: 0 5px 0 0;}
	#pagination a.selected {color: #1188c1;}

/* -------- LIGHTBOX STYLES ---------- */

.lightBoxOverlay 
{
	position: fixed; 
	top: 0; 
	left: 0; 
	background-color: white; 
	opacity: 0.85; 
	filter:alpha(opacity=85);
	width: 100%; 
	height: 100%;
	z-index: 99;
}

.lightbox {position:fixed;width: 600px; min-height:250px; margin-top:-125px;margin-left:-300px;background-color: #ececec; border: 1px solid #d8d8d8; text-align: left; left: 50%; top: 50%; opacity: 1; filter:alpha(opacity=100);z-index: 100;}
	.lightbox_kruis {position: absolute; right: 0; margin: 0 15px 0 0; font-weight: bold; font-size: 16px;}
	.lightbox_links { width: 260px; margin: 20px; float: left;}
	.lightbox_rechts {float: left; margin: 20px 20px 20px 10px;}
	.lightbox_wide { width: 560px; margin: 10px 20px 20px 20px; display:table; clear:both;}
	.lightbox_navigatie { position: relative; margin: 0 0 30px 450px; padding: 0 0 15px 0;}
		.lightbox_navigatie .annuleer {background-color:#ECECEC; display: block; color: #30a0e0; font-size: 14px; font-weight: bold; float: left; margin: 0 10px 0 0;}
		.lightbox_navigatie .annuleer:hover{text-decoration: underline; }
		.lightbox_navigatie .submit {background: url(../images/lightbox_submit.jpg) no-repeat; width: 38px; height: 29px; display: block; float: left;}
		.lightbox_formulier {display:block;}
			.lightbox_formulier p {margin: 0 0 8px 0;}
			.lightbox_formulier .input-text{background: url(../images/lightbox_veld.jpg) no-repeat; width: 220px; height: 22px; padding: 5px; color: #4f4f4f;}
			.lightbox_formulier .wideTextBox{width: 540px; height: 22px; margin-top:3px; font-size: 14px; color: #999999; padding: 10px;}
			.lightbox_formulier .trackBackUrl{width: 540px; height: 22px; margin-top:3px; font-size: 14px; color: #30a0e0; font-weight:bold; padding: 10px;}
			.lightbox_formulier textarea {background: url(../images/lightbox_textarea.jpg) no-repeat; width: 220px; height: 87px; padding: 5px; border: 0px; color: #4f4f4f;}
.lightbox .label{display: block; color: #494949; font-weight: bold;}

.lightbox .removedTopic {float:left;margin: 10px; font-weight:bold;color:Red;}
.lightbox .currentTopic {float:left;margin: 10px; font-weight:bold;}

/* -------- INDEX GRAPHIC STYLE ---------- */
.indexGraphic
{
	width:398px;
	height:153px;
	margin-top: 30px;
}

/* -------- Social Media Sharing ---------- */
.socialMediaSharingitem
{
	float:left;
	margin:5px;
}

.iGoogle
{
	float:left;
	margin:5px;
}


.socialMediaSharingitem img
{
	height:16px;
}

/* -------- About|Help|Contact ---------- */
.infoBlock
{
	border-top: 1px dashed #ccc;
	padding:20px;
}

.infoBlock h1 
{
	padding:5px 0 5px 10px;
}
.infoBlock p 
{
	padding:5px 0 5px 10px;
	margin-top:5px;
	text-align:justify;
}

.infoBlock ul li 
{
	list-style-type:circle;
	list-style-position:inside;
	padding:0px 0 0 10px;
	text-align:justify;
}


.whorulesnl{ color: #1188c1;}

.infoBlock h2 {text-transform: none; font-size:13px; min-height: 17px; height:auto; border-bottom: none; }

.infoBlock img
{
	border: 1px dashed #ccc;
}

.infoBlock ol
{
list-style-position:inside;
list-style-type:decimal;
}

.TeezirLogo
{
	height:24px;
	vertical-align:top;
	padding: 0 0 0 5px;
	
}

.Note {
font-size:10px;
margin-top:5px;
}

.iGoogleDailyRuler
{
	position: absolute; right: 0px; top: 50px;
}

/* -------- No Results STYLES ---------- */
	.NoResults {padding:5px 10px;}
	.NoResults h2 {border-bottom:none; padding: 5px 10px; } 
	.NoResults h3 { font-size: 11px; font-weight: bold; padding: 10px 0 0px 10px; text-transform:uppercase;}
	.NoResults ul { padding: 5px 30px; }
	.NoResults  ul li {display:list-item; margin: 0; background: none; list-style-image: none;list-style-type:circle;}
	
/* -------- No Results STYLES ---------- */
img.errorLogo 
{
width:80%;
margin:  30px auto 30px 30px;	
}