/*
css-rules:
- at the top of this css are the definitions by element
- the rest of the css is by class;
  it's own class, or by its parents' (grandparents, etc) class
*/

/* Pagina styles */
body
{
	margin:						0px;
	padding:					0px;
    text-align:                 center;
	font-size:					10pt;
	font-family:				Helvetica, Sans-Serif;
	color:						black;
	position:					relative; 
	line-height:				17px;
	background-image:			url(images/AchtergrondPatroon2.png);
	background-repeat:			repeat;
	
	color:						#8C8C8C; 
}

html
{
	overflow-y:					scroll;
}

body
{
    text-align:					-moz-center;
}

/* Standaard html elementen */
/* Waaarom ?
h1, h2
{
	color:						#8C8C8C;
	font-size:					17px;
}*/

h1 
{
	color: #C4291F;
	font-size: 1.8em;
	margin: 5px 0 5px 0;
}

h2 
{
	color: #C4291F;
	font-size: 1.2em;
	margin: 5px 0 5px 0;
}

h3
{
	color: #8c8c8c;
	font-size: 1.0em;
	margin: 0;
	text-transform:uppercase;
}

h4
{
	color: #000000;
	font-size: 1.0em;
	margin: 0;
}

h5
{
    font-family: Arial;
	color: #4e7390;
	text-transform: uppercase;
	font-size: 1.0em;
	margin: 0;
}

/* Plaatjes standaard zonder omlijning */
img 
{
	padding:					0px 0px 0px 0px;
	border-style:				none;
	display:					block;
}

/* De panel waar usercontrols in geplaatst worden */
.usercontrolpanel
{
	padding:					0px 0px 0px 0px;
}

a		{ color: #8C8C8C; text-decoration: none; }
a:hover { color: #8C8C8C; text-decoration: underline; }

div.Main
{
	width: 100%;
	/*background-color: #e5e1dc;*/
	margin: 0;
	spacing: 0;
	padding: 0;
}

div#ContainerTop
{
	width: 100%;
	background-color: White;
	margin: 0;
	text-align: center;
	z-index: 1;
}

div#TopNav
{
	width: 960px;
	height: 67px;
	background-color: White;
	margin: auto;
	padding: 0;
	padding-top: 8px;
	float: center;
	text-align: left;
	font-size: 7.1pt;
	color: #8C8C8C;
	z-index: 1;
}

div#TopNav img
{
	display: inline;
}

div#searchbar
{
	background-image: url(images/SearchIcon2.jpg);
	background-position: left center;
	background-repeat: no-repeat;
	border-style: solid;
	border-color: Gray;
	border-width: 1px;
	width: 120px;
	float: left;
}

div#ContainerMood
{
	width: 100%;
	/*background-color: White; todo: ie6 naar 188*/
	margin: 190px 0 0 0;
	text-align: center;
}

div#MoodImageContainer
{
	/*background-color: White;*/
	margin: auto;
	text-align: center;
	z-index: -1;
}

div#ContainerMiddle
{
	width: 100%;
	height: 100%;
	background-color: #4e7390;
	text-align: center;
	vertical-align: middle;
	z-index: 0;
}

div#centerLifeCycle
{
	margin: 0 auto;
	padding: 0;
	spacing: 0;
	width: 960px;
	height: 54px;
}

div#viewExperiences
{
	background-image: url(images/Experiences.png);
	background-repeat: no-repeat;
	width: 114px;
	height: 54px;
}

div#viewExperiences:hover
{
	background-image: url(images/ExperiencesHover.png);
}

div#LifeCycle
{
	filter: Alpha(opacity=90);
	opacity: .95;
	width: 100%;
	height: 54px;
	color: #FFFFFF;
	background-color: #4e7390;
	z-index: 0;
	text-align: center;
}

div#flashholder
{
	position: absolute;
	width: 100%;
	background-color: #FFFFFF;
	top: 75px;
	left: 0;
	z-index: -1;
}
	
div#LiveCycle
{
	width: 960px;
	background-color: gray;
	margin: auto;
	padding: 0;
	text-align: center;
}

div#gradientholder
{
	width: 100%;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/App_Themes/Teleplan/images/GradientVerticaal.png');
	background-repeat: repeat-x;
	background-position: left top;
}

html>body div#gradientholder
{
	/*background-image: url(images/GradientVerticaal.png);*/
}

div#MoodVisualContentPage
{
	width: 960px;
	height: 133px;
	background-color: gray;
	margin: auto;
	padding: 0;
	text-align: center;
}

div#ContainerTicker
{
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	spacing: 0;
	text-align: center;
	vertical-align: middle;
}

div#ContainerContent
{
	color: #000000;
	width: 960px;
	margin: auto;
	background-color: white;
	text-align: left;
	clear: both;
}

div#containerContentCenter
{
	width: 960px;
	color: #000000;
	margin: auto;
	padding: 0;
	background-color: #FFFFFF;
	vertical-align: middle;
	align: center;
}

div#CenterLeft
{
	width: 320px;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
}

div#CenterMiddle
{
	width: 320px;
	min-height: 320px;
	margin: 0;
	padding: 0;
	spacing: 0;
	margin-left: 0;
	margin-right: 0;
	background-color: transparent;
	float: left;
	z-index: 0;
	overflow: hidden;
}

div#CenterRight
{
	width: 318px;
	background-color: #FFFFFF;
	margin: 0;
	spacing: 0;
	float: right;
	overflow: hidden;
}

div#wheel
{
	background-color:white;
	z-index:-1;
}

div#Footer
{
	width: 960px;
	height: 100%;
	background-color: White;
	margin: auto;
	padding: 0;
	text-align: center;
	clear: both;
}

div#FooterText
{
	color: #B0B0B0;
	font-size: 7.6pt;
	font-family: Helvetica, Sans-Serif;
	margin: auto;
	padding-top: 28px;
	padding-bottom: 9px;
	vertical-align: middle;	
}

div#FooterText a
{
	color: #B0B0B0;
	text-decoration: none;
}

div#FooterText a:hover
{
	color: #9C9C9C;
	text-decoration: underline;
}

span#FooterTextCenter
{
	color: #9C9C9C;
	font-weight: bolder;
}

div#FooterLogo
{
	margin: auto;
	padding: 0;
	text-align: center;
	clear: both;
	padding-bottom: 17px;
	margin-right: 2px;
}

div#FooterLogo img
{
	display: inline;
}

div#ContentPageContainerMiddle
{
	width: 100%;
	/*todo: 183 voor ie6 */
	height: 186px;
	margin: auto;
	text-align: center;
	vertical-align: middle;
	z-index: -1;
}

div#ContentPageLifeCycle
{
	filter: Alpha(opacity=90);
	opacity:.90;
	width: 100%;
	height: 54px;
	color: #FFFFFF;
	background-color :#4e7390;
	text-align: center;
}

div#ContentPageMoodImage 
{
	text-align: center;
	width: 100%;
	position: absolute;
	top: 75px;
	left: 0;
	z-index: -1;
}

div#ContentPageCenterLeft
{
    background-color: White;
	width: 640px;
	min-height: 320px;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
	overflow: hidden;
}

div.printablearea
{
	width: 640px;
	min-height: 320px;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
	overflow: hidden;
}

div#MovieCenter
{
	width: 960px;
	min-height: 320px;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
	overflow: hidden;
}

div#breadcrumbs
{
	width: 96%;
	height: 20px;
	margin-left: 18px;
	padding-top: 10px;
	clear: both;
}

div#breadcrumbs a
{
	color: #A7A095;
	font-weight: bold;
	text-decoration: none;
}

div#breadcrumbs a:hover
{
	color: #C4291F;
}

div#ContentPageCenterRight
{
	width: 320px;
	background-image: url(images/Rightcolumnbg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	min-height: 261px;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
	overflow: hidden;
}

div#WorldmapLifeCycle
{
	filter: Alpha(opacity=90);
	opacity:.90;
	left: 0;
	width: 100%;
	height: 54px;
	color: #FFFFFF;
	background-color :#4e7390;
	z-index: 0;
	text-align: center;
}

div#WorldmapMoodImage
{
	position: absolute;
	top: 75px;
	left: 0;
	z-index: -1;
	width: 100%;
	text-align: center;
}

div#WorldmapContainerMiddle
{
	width: 100%;
	margin: auto;
	text-align: center;
	vertical-align: middle;
	z-index: -1;
}

div#WorldmapContainerContent
{
	color: #FFFFFF;
	width: 960px;
	margin: auto;
	background-color: transparent;
	text-align: left;
	clear: both;
}

div#WorldmapContainerContentCenter
{
	background-image: url(images/AchtergrondWitVerticaal.png);
	background-repeat: repeat-x;
	background-position: bottom;
}

div#WorldmapTopRight
{
	float:right;
	width: 320px;
	height:132px;
	filter: Alpha(opacity=90);
	opacity:.90;
	background-color :#4e7390;
	color: #FFFFFF;
	text-align: center;
}

div.toprightcontentholder
{
	margin: 20px 0 0 20px;
}

div.maincontentholder
{
	margin: 8px 18px 18px 18px;
	height:  auto;
}

/* Content text styles */
div.maincontentholder a
{
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	/*background-image: url(images/RedLinkArrow.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;*/
}

div.maincontentholder a:hover
{
	color: #C4291F;
}

div.maincontentholder img
{
	display: inline;
}

div#rightcontentspacer
{
	width: 318px;
	height: 30px;
}

div#WorldmapLeft
{
	width: 640px;
	height: 100%;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
	overflow: hidden;
	color: #000000;
	background-color: #FFFFFF;
}

div#WorldmapBottomRight
{
	background-image: url(images/AchtergrondCountrymap.png);
	background-color: #D3DDD8;
	background-repeat: no-repeat;
	float: right;
	width: 320px;
	min-height: 460px;
}

div#QuoteContainerContent
{
	color: #000000;
	width: 960px;
	margin: auto;
	background-color: white;
	text-align: left;
	clear: both;
}

div#QuoteContainerMiddle
{
	width: 100%;
	margin: auto;
	z-index: -1;
	height: 186px;
	text-align: center;
}

div#StockPageCenterLeft
{
	width: 640px;
	margin-left: 0;
	margin-right: 0;
	margin: 0;
	padding: 0;
	spacing: 0;
	float: left;
}

.searchBox
{
	position: relative;
	background-color: #8C8C8C;
	margin: auto;
	padding: 0px;
	/*clear: both;*/
	height: 17px;
	/*width: 218px;*/
	width: 116px;
}

.searchBox img
{
	float: left;
	position: relative;
	margin: auto;
	padding: 0px;
	width: 18px;
}

.searchBox input[type=text]
{
	float: right;
	border-width: 0px;
	height: 15px;
	padding: 0px;
	padding-left: 2px;
	padding-right: 2px;
	margin: 1px;
	margin-left: 0px;
	width: 93px;
	color: #8C8C8C;
	font-size: 8pt;
	font-family: Helvetica, Sans-Serif;
}

div#bottomnavigation
{
	margin-top: 10px;
	clear: both;
	width: 100%;
	font-weight: bold;
}
div#bottomnavigation a
{
	color: #000000;
}

div#leftbottomnav
{
	float: left;
	margin-left: 18px;
}

div#backlink
{
	background-image: url(images/pijltjelinks.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 14px;
	float: left;
}

div#toplink
{
	background-image: url(images/pijltjeboven.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 14px;
	margin-left: 20px;
	float: left;
}

div#rightbottomnav
{
	float: right;
	margin-right: 18px;
}

/*---------------------- MENU --------------------*/

div.menuControl
{	
	padding: 0px;
	margin: 0px;
	margin-left: 20px;
	margin-right: -20px;
	margin-top: -47px;
	position: absolute;
	float: left;
	display: block;
}

div.menuTab
{	
	padding: 0px;
	margin: 0px;
	
	margin-right: 2px;
	text-align: left;
	
	float: left;
	height: 47px;
}

div.menuTab
{	
	padding: 0px;
	margin: 0px;
	display: inline;
	position: relative;
}

div.menuTab a
{
	padding: 0px;
	margin: 0px;
	overflow: hidden;
}

div.menuTab				{ color: #444444; font-size: 13.5pt; }
div.menuTab a			{ color: #444444; cursor: pointer; text-decoration: none; }
div.menuTab:hover,
div.menuTab:hover a,
div.menuTab a:hover		{ background-color: #aea79d; color: White; text-decoration: none; }


div.menuTab .menuLeftCorner
{ 
	padding: 0px;
	margin: 0px;
	width: 19px;
	height: 19px;
	float:left;
	text-align: left;
	margin: auto;
	margin-left:0px;
	background-image: url(images/Menuhoekjelinks.jpg);
	visibility:hidden;
	position: relative;
}

div.menuTab .menuRightCorner
{ 
	padding: 0px;
	margin: 0px;
	width: 19px;
	height: 19px;
	text-align: right;
	float:right;
	margin: auto;
	margin-left: 0px;
	margin-right:0px;
	background-image: url(images/Menuhoekjerechts.jpg);
	visibility:hidden;
	position: relative;
}

div.menuTab:hover .menuLeftCorner,
div.menuTab:hover .menuRightCorner
{
	visibility: visible;
}

div.popupwheel
{
	color:#ffffff;
	background-color:#779686;
	font-family:Arial;
	font-weight:bold;
	padding: 10px;	
	width:200px;
	height:110px;
	position:absolute;
	z-index:1;
	left:0px;
	top:0px;
	display:none;
	text-align:left;
}

.menuTab
{
	z-index: 2;
	/*filter: Alpha(opacity=90);*/
	opacity:.90;
}

.mainMenu
{
	z-index: 3;
	position: relative;
}


div.menuText
{
	margin: 0px;
	padding: 0px;
	
	text-align: left;
	width: 90%;	/* IE6, ideally should be 100% */
	top: -6px;
	left: 11px;
	
	padding-bottom: 0px;
	padding-left: 8px;
	padding-right: -8px;
	
	margin-top: auto;
	margin-bottom: 0px;
	
	background-image: url(images/Reddot.jpg);
	background-repeat: no-repeat;
	background-position: 0px 6px;
	
	float: left;
	display: block;
	position: relative;
	height: 22px;
/*	overflow: hidden;*/
}

div.menuTextSelected
{
	margin: 0px;
	padding: 0px;
	
	text-align: left;
	width: 90%;	/* IE6, ideally should be 100% */
	top: -6px;
	left: 11px;
	
	padding-bottom: 0px;
	padding-left: 8px;
	padding-right: -8px;
	
	margin-top: auto;
	margin-bottom: 0px;
	
	background-image: url(images/Greydot.jpg);
	background-repeat: no-repeat;
	background-position: 0px 6px;
	
	float: left;
	display: block;
	position: relative;
	height: 22px;
/*	overflow: hidden;*/
}

.dotText
{
	display: block;
	margin: 0px;
	padding: 0px;
/*	overflow: hidden;*/
	padding-left: 20px;
	padding-right: -20px;
	background-image: url(images/Reddot.jpg);
	background-repeat: no-repeat;
	background-position: 12px 6px;
	width: 84%;
}

.dotTextSelected
{
	display: block;
	margin: 0px;
	padding: 0px;
/*	overflow: hidden;*/
	padding-left: 20px;
	padding-right: -20px;
	background-image: url(images/Greydot.jpg);
	background-repeat: no-repeat;
	background-position: 12px 6px;
	width: 84%;
}

.subMenuText
{
	display: block;
	margin: 0px;
	padding-left: 8px;
	padding-right: -8px;
	width: 95%;
/*	overflow: hidden;*/
}

.mainMenu
{
	margin: 0px;
	padding: 0px;
	width: 100%;
	text-align: left;
	display: block;
	visibility: hidden;
	position: relative;
	float: left;
	/*filter: Alpha(opacity=90);
	opacity:.90;*/
	background-color: #aea79d;
/*	margin-top:		5px;
	padding-top:	4px;*/
	width: 100%;
	z-index: 2;
}

.subMenu
{
	margin: 0px;
	padding: 0px;
	width: 100%;
	text-align: left;
	display: none;
	position: relative;
	float: left;
	/*filter: Alpha(opacity=90);
	opacity:.90;*/
	/*background-color: #aea79d;*/
/*	margin-top:		5px;
	padding-top:	4px;*/
	width: 100%;
	z-index: 2;
}

.menuItem,
.menuItem a
{
	width: 100%;
}

.menuTab div.mainMenu
{
	margin: 0px;
	margin-top:		5px;
	padding-top:	2px;
	padding-bottom: 8px;
}

.menuTab:hover div.mainMenu
{
	display: block;
	visibility: visible;
}

div.menuItem:hover > div.subMenu
{
	position: absolute;
	display: block;
	left: 100%;
	border-left-style: solid;
	border-left-width: 2px;
	border-left-color: #C0C0C0;
}

div.mainMenu a
{
	padding-top:		4px;
	padding-bottom:		4px;
	width: 100%;
	display: block;
}

div.subMenu a
{
	padding-top:		4px;
	padding-bottom:		4px;
	width: 100%;
	display: block;
}

div			 .subMenu a,
div:hover	 .subMenu a,
div	.subMenu a:hover
{
	color: Black;
	font-size: 9.5pt;
	font-weight: bold;
}

.menuTab			.mainMenu a,
.menuTab:hover		.mainMenu a,
.menuTab .mainMenu a:hover
{
	color: Black;
	font-size: 10pt;
	font-weight: bold;
}

.mainMenu div.menuItem a:hover,
.subMenu  div.menuItem:hover
{
	background-color: #FFFFFF;
}



/*-------------STOCK----------------*/

.StockControl
{
	/*border: solid 1px black;*/
	margin-left: auto;
	margin-right: auto;
}

.StockHeader
{
	background-color: #b0c1d9;
	color: #333356;
	font-weight: bold;
}

.StockControl img
{
	display: inline;
}

td.StockRow
{
	background-color: white;
	color: Black;
}

.StockRowAlternate
{
	background-color: #eeeeee;
	color: Black;
}

.StockRow a,
.StockRowAlternate a
{
	font-weight: bold;
	color: #135cae;
}

.StockUp
{
	color: Green;
	padding-left: 13px;
	background-image: url('images/stock_up.gif');
	background-repeat: no-repeat;
} 

.StockDown
{
	color: Red;
	padding-left: 13px;
	background-image: url('images/stock_down.gif');
	background-repeat: no-repeat;
}

.StockUnchanged
{
	color: Black;
}

.StockChart
{
	margin-left: auto;
	margin-right: auto;
}



/*-------------Ticker----------------*/
div#Ticker
{
	width:	960px;
	height:	25px;
	color: Black;
	font-size: 12.5px;
	font-weight: bold;
	background-color: white;
	margin: auto;
	padding: 0;
	padding-top: 12px;
	text-align: left;
}

#TickerTitle,
.TickerTitle
{
	padding-left: 18px;
	float: left;
}

#TickerContents,
.TickerContents
{
	background-color: white;
	padding-left: 8px;
	float: left;
	font-size: 11px;
	zoom: 1;
}

#TickerContentsDate,
.TickerContentsDate
{
	background-color: white;
	color: #4c718c;
	zoom: 1;
}

#TickerContentsText,
.TickerContentsText
{
	background-color: white;
	padding-left: 6px;
	color: black;
	zoom: 1;
}

#TickerContents a:hover,
.TickerContents a:hover 
{
	text-decoration: none;
}

div.listitem {
    cursor: default;
}
div.listitem-hover {
    cursor: pointer;
    _cursor: hand;
}