/**************************************************************************************
CSS Stylesheet behorende bij Van Dijk Studieboeken Institutes, externe site

-------------- CHANGE HISTORY ----------------------
2005-04-13		Sandra Both			Bugzilla #4314: Adjusted layout of menu and submenu for support of firefox and mozilla.
2005-04-13		Sandra Both			Bugzilla #4316: Adjusted layout of subSubMenu for support of firefox and mozilla.
2005-05-23		Sandra Both			In h2 height van 16px toegevoegd, zodat plus/minus.gif ook in mozilla&firefox juiste hoogte krijgt,
									extra classes plusMinusCell, headerCell, amountCell en koopCell toegevoegd voor pagina additionele leermiddelen.
2005-05-24		Sandra Both			Bugfix height h2: only for plusMinusCell h2. Added correction margin-bottom & height for plusMinus gifs.
2005-05-31		Sandra Both			Replaced colors: #B4D3E8 -> #00a8c8, #005192 -> #FFFFFF, #FFD200 -> #FF7800.
2005-07-22		Sandra Both			#5950: Added optionalCourseArticleForgotten.
2006-05-05		Robin Roestenburg	Aanpassingen layout en nieuwe styles voor webshop.
2006-05-10		Robin Roestenburg	Webshop stijlen toegevoegd.
2006-05-22		Robin Roestenburg	#8975: Stijlen aangepast.
2006-05-23		Robin Roestenburg 	#8978: Stijlen toegevoegd voor de layout.
2006-05-23		Robin Roestenburg	Marketingaanpassing: kleur van link veranderd van rood naar #FF7800.
2006-05-23		Robin Roestenburg	Marketingaanpassing: stijl kader rechts aangepast.
2006-05-24		Robin Roestenburg	Rechterkant aangepast tbv flashbanners.
2006-05-30		Robin Roestenburg	Stijlen toegevoegd voor nieuwe hoofdpagina en bestelpagina.
2006-06-14		Marjan Hospers		Stijlen toegevoegd voor aanbiedingen in de webshops.
2006-07-21		Marjan Hospers		Stijlen voor wizardsteps toegevoegd/aangepast voor de uitlijning van de stappen.
2006-08-07		Marjan Hospers		Cursor: hand overal veranderd in cursor: pointer, zodat het ook werkt in Mozilla en Firefox.
2009-03-16		Sierk Rosema		.schoolSelfNot H2 toegevoegd vanwege Buzilla #22406.
2009-04017		Sierk Rosema		Stijlen voor de Webshop van "De Nieuwe Zaak" toegevoegd.
2009-06-02		Sierk Rosema		RFC019: .schoolSelfNot H2 verwijderd.
***************************************************************************************/
 
/**************************************************************************************
Algemeen gebied: HTML tags
***************************************************************************************/

body, table, p {
	font-family: Arial, Verdana, Helvetica, Sans-serif;    
    font-size: 12px;
	margin: 0px;
}

p	{
	margin-bottom: 0px;
}

body	{
	text-align: center;
}

table, p, h1, ul, ol, pre, td	{
	text-align: left;
	color: #005192;
}

h3	{
	font-size: large;
	text-align: left;
	color: #005192;
}

ul.li {
	margin-left: 0px;
}

h1, h2, .hilight  {
	font-size: 12px;
    color: #FFFFFF;
	background-color: #00a8c8;
	padding: 5px;
	padding-left: 10px;
	margin-bottom: 10px;
}

h1	{
	font-weight: bold;
}

h2, table.hilight {
	font-weight: normal;
}

table.hilight {
	margin: 5px;
}
table.hilight td{
    color: #FFFFFF;
}

form {
	margin: 0px;
}

img {
	border: 3px;
}

a {
	color: #ff8c00;
	text-decoration: underline;
	font-weight: normal; 
}

a:hover {
	color: #6C97B9;
}

.select {
	color: black;
}

.textArea , textarea{
	font-family: Arial, Verdana, Helvetica, Sans-serif;    
	/*width:60%;*/
}

input.text {
	font-family: Arial, Verdana, Helvetica, Sans-serif;
	border: 1px solid #666666;
	margin: 1px 0 0 0;
}

/**************************************************************************************
Algemeen gebied: classes
***************************************************************************************/

.button {
    font-size: 12px;
}

.checkBox {}

/* Tabel voor searchlist en entitylist. */
.courseTable {
	border: 1px;
}

/* Tabel voor searchlist en entitylist. */
.databaseTable {
	padding: 1px;
	spacing: 10px;
	background: none;
}

/* Tabel voor searchlist en entitylist. */
.databaseTable td {
	padding: 1;
}

/* Header voor de databaseTable class */
.databaseTable th {
	text-align: left;
	color: #000000;
}

/* Linkje in de header voor deze tabel */
.databaseTable th a {
	color: navy;
}

/* Class voor het beschrijven van de layout van input velden */
.label {
	color: #005192;
	width: 30%;		/* Een label heeft een vaste breedte (zorg dat de omvattende cel 100% breedte heeft */
}

/* Wordt gebruikt voor communicatie van (fout)meldingen naar de gebruiker */
.message {
	color:red;
}

input.radio {}

div.radio	{
	margin-bottom: 4px;
	clear: both;
}

div.radio div.radioButton {
	float: left;
	width: 30px;
}

div.radio div.radioLabel {
	float: left;
	width: 450px;
}

.text {
	text-align: left;
}

div.helpLayer {
	position: absolute;
	left: 0;		
	top: 0;			/* prevents creating scrollbars */
	width: 280px;
	visibility: hidden;
	z-index: 10;
	border: 2px solid #ffaa00;
}

div.helpLayer table {
	width: 100%;
	background-color: #ffffcc;
	border-collapse: collapse;
}

div.helpLayer table tr th {
	padding-left: 10px;
	text-align: left;
	background-color: #ff9900;
	font-weight: bolder;
}

div.helpLayer table tr td {
	padding: 1px;
}

div.helpLayer table tr td#content {
	padding: 10px;
}

/* Class voor het beschrijven van de layout van teksten en  'h', 'k' en 'n' in de tabellen met artikelen */
.articleTableText {
	color:red;
}

/* Class voor de teksten bij de artikelen */
.helpText {
	font-family: arial, helvetica, Trebuchet MS,;
	color: #FF0000;
	font-size: 11px;
	line-height: 16px;
}

/* Class voor de achtergrondkleur bij keuzevakken */
.optionalCourseArticle {
	background-color: #EBF1F6;
}

/* Class voor de achtergrondkleur bij keuzevakken als de gebruiker vergeten is een keuze te maken */
.optionalCourseArticleForgotten {
	background-color: #FF9933;
}

/* Class voor lettertype in-actieve prijzen */
.price_inactive
{
 	color: #9FC3DB;
}

/* Class voor lettertype actieve prijzen */
.price_active
{
	color: #005192;
}


/* Het sterretje dat aangeeft dat een veld verplicht is */
.required {
	color: red;
}


#header {
    height: 100%;
    background: #00a8c8;
}

#logo h4 a {
    float: left;
    display: inline;
    width: 224px;
    height: 62px;
    margin: 10px 0 0 0;
    text-decoration: none;
    text-indent: -999em;
    background: url( ../images/logo_vandijk.gif ) no-repeat right top;
}

/**************************************************************************************
Verdeling van gebieden op het scherm
***************************************************************************************/

/* Page rekt de tabel op het top niveau uit tot maximale hoogte/breedte zonder witruimtes*/
.page {
	border: 0;
	border-spacing: 0;
	border-collapse: collapse;
	width: 1000px;
	height:100%;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

.page td {
	padding: 0;
}

td.topArea {
	vertical-align: top;
	margin-top: 5px;
	margin-left: 0px;
	height: auto;
	padding-bottom: 20px;
}

.topArea table {
	
}

.topArea td.menuSpacerLeft, .leftArea {
	width: 150px;
	white-space: nowrap;
}

/* Het menu begint helemaal links */
.topArea td.menuSpacerLeft {
	width: 0px;:
}

td.leftArea {
	vertical-align: top;
	margin-left: 5px;
	padding-right: 10px;
	padding-left: 2px;
	height: 100%;
	white-space: nowrap;
}

.leftArea td {}

/*
    CMS content in het centrum van de pagina.
*/
.centerArea  {
	vertical-align: top;
	height: 100%;
	width: 552px;
    /*background-color: aquamarine;*/
}

/*
    CMS content in het centrum van de taxatie pagina.
*/
.centerAreaAppraiseBook  {
	vertical-align: top;
	height: 100%;
    width: 1000px;
}
.centerArea td {
	vertical-align: top;
}

.centerTopArea {}

.centerTopArea td {
	padding-bottom: 5px;
	vertical-align: center;
}

td.centerTopArea {
	height: 100%;
}

table.centerAreaContainer {
    width: 100%;
    /* four values: top, right, bottom and left respectively */
    margin : 0px 0px 0px 0px;
}


table.centerAreaContainerContainer {
	margin-bottom: 25px;
}

.centerAreaContainer td {
	margin-left: 0px;
	margin-right: 0px;
}

/*
    CMS content: de document title
    in het centrum van de pagina.
*/
.centerAreaContainer h1 {
    background-color :#00a8c8;
    font-size : 15;
}


td.centerCenterArea {
	height: 100%;
	vertical-align: top;
	/* padding-left: 8px; */
	padding-right: 0px;
	width: 100%;
}

/* makeTable gebruikt h2 in een table header, overrule de default */
.centerCenterArea h2, .centerArea th h2 {
	vertical-align: top;
	padding-bottom: 5px;
}

.centerCenterArea td {
}

.centerBottomArea {
	width: 100%;

}

.centerBottomArea td {
}

td.centerBottomArea {
	height: 100%;
	/* padding-left: 8px; */
	/*padding-right: 0px;*/
    padding-right : 10px;

}

td.rightArea {
	vertical-align: top;
	padding-bottom: 0px;
	padding-left: 5px;
	horizontal-align: right;
}

.rightArea table {
	/*margin-top: 0px;*/
}

.bottomArea {
	text-align: right;
	vertical-align: bottom;
}

/**************************************************************************************
TopArea gebied: HTML tags en classes
***************************************************************************************/
.topArea {
	background-color: #FFFFFF;
	border-spacing: 0;
	border-collapse: collapse;
}

.topArea a {
	color: #7D7B53;
	text-decoration: none;	
}

/* Custom: text of a link in the topArea is bold, white */
.topArea td {
	color: white;
	font-weight: bolder;
	font-size: 9pt;	
}

/*
    CMS content links in de pagina.
*/
.leftArea {
	/*background-color: darksalmon;*/
	white-space: nowrap;
    width : 200px;
}

.leftArea .groupTitle {
	font-weight: bold; 
}

.leftArea .groupItem {}

.leftArea a {
	color: #005192;
	text-decoration: none;
	font-family: Trebuchet MS, arial, helvetica;	
	margin: 7px;
	margin-left: 0px;
	margin-right: 0px;
}

/*	Deze class wordt gebruikt voor de stijl van de links in 
	het subsubmenu van 'contact' en 'site info' */
table.defaultLinks {
	margin-left: 0px;
	background-color: #ff8c00;
	border-bottom: 3px solid #ccdce9;
	margin-bottom: 20px;
	margin-right: 0px;
	width: 164px;
}

table.defaultLinks td {
	padding-left: 5px;
	padding-right: 5px;
}

table.defaultLinks tr td a:active,
table.defaultLinks tr td a:link,
table.defaultLinks tr td a:visited,
table.defaultLinks tr td a:hover {
	color: #FFFFFF;
	border: 0px;
	font-family: Trebuchet MS, arial, helvetica;
	font-size: 13px;
	text-decoration: none;
}

/* De layout van de tekst invoer box (om te zoeken in de site) in 
	het subsubmenu */
.defaultLinks input {
	font-size: 11px;
	border: 0px;
	width: 100%;
}

/**************************************************************************************
CenterArea gebied: HTML tags en classes
***************************************************************************************/
.centerArea .groupTitle {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 5px;
	margin-top: 5px;
}

.centerArea .groupItem {
	margin-left: 20px;
}

/**************************************************************************************
CenterTopArea gebied: HTML tags en classes
***************************************************************************************/

/**************************************************************************************
CenterCenterArea gebied: HTML tags en classes
***************************************************************************************/


/**************************************************************************************
CenterBottomArea gebied: HTML tags en classes
***************************************************************************************/

/*
    CMS content rechts in de pagina.
*/
.rightArea {
    /*background-color: gold;*/
    width : 250px;
}

.rightArea table {
    width : 100%;
}

.rightArea .groupTitle {
	font-size: 13px; 
	color: #ffcc00;
	margin-bottom: 5px;
	margin-top: 5px;
}

.rightArea .groupItem {
	margin-left: 15px;
}

/* TableItemListWithColumns */
.itemListWithColumns {
    width : 528px;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px;
}

.itemListWithColumns tr {
}

/* TableItemListWithColumns */
.itemListColumn {
  	width: 170px;
  	border: 1pt #d5e3ee solid;
}

/* Item attributen uit Hybris */
.itemAttributes {
}

.itemAttributeLabel {
    font-weight : bold;
}

.itemAttributeValue {
}


.itemListSpacerColumn {
    width : 9px;
}

/* TableItemListWithColumns */
.bestBuyListWithColumns {
    width : 100%;
}

.bestBuyListWithColumns tr {
}

/* TableItemListWithColumns */
.bestBuyListColumn {
    /*background-color:darkturquoise;*/
    border : 1px solid #d5e3ee;
    /* two values: top/bottom (first value) and right/left (second value) */
    /*margin : 0px 10px;*/
    width : 32%;
}

/* Item attributen uit Hybris */
.bestBuyAttributes {
}

.bestBuyAttributeLabel {
    font-weight : bold;
    border-right: solid white 2px;
}


.bestBuyListSpacerColumn {
    width : 1%;
}


/* TableItemListWithColumns */
.bestBuyListRow {
    /* two values: top/bottom (first value) and right/left (second value) */
    margin : 0px 10px;
}

.ItemDescription .header {
    font-size: 15px;
    color: #FFFFFF;
    background-color: #00a8c8;

    /* four values: top, right, bottom and left respectively */
    padding :5px 5px 5px 5px;
}

.ItemDescription .name {
    /* four values: top, right, bottom and left respectively */
    padding :5px 5px 5px 15px;
}

.ItemDescription .afbeelding {
    /* four values: top, right, bottom and left respectively */
    padding :15px 5px 5px 15px;
}

.ItemDescription .description {
    /* four values: top, right, bottom and left respectively */
    padding :0px 5px 5px 15px;
}

.ItemDescription .link {
    /* four values: top, right, bottom and left respectively */
    padding :0px 5px 5px 15px;
}


.navigator {
    background-color:#d5e3ee;
    font-weight : bold;
    font-size   : 12px;
    height: 30px;
}

/* De navigator voor zoekresultaten uit Hybris */
.navigator td, a {
    font-weight     : bold;
    text-decoration : none;
}
.navigator a:hover {
    font-weight     : bold;
    text-decoration : none;
}

/* de geselecteerde pagina */
.navigator b {
    text-decoration :underline;
}


.rightArea h1 {
	color: #005192;
	background-color: #B4D3E8;
	font-size: 12px;
    font-weight: bold;
	line-height: 16px;
	padding: 5px;
	margin-bottom: 5px;
}


/**************************************************************************************
BottomArea gebied: HTML tags en classes
***************************************************************************************/

/* The copyright text in the bottomarea */
.bottomArea small {
	color: #819FBD;
 	font-size: 10px;
	line-height: 28px;
	font-family: Trebuchet MS, arial, helvetica;
}

/* A link to the disclaimer in the disclaimer */
.bottomArea small a {
	color: #819FBD;
}

/**************************************************************************************
Menu: HTML tags en classes
**************************************************************************************/

/* Menu omvattende tabel */
.menuContainer {
	background-color: #ff8c00;  /* Oranje */
	width: 100%;
    height: 26px;
	border-collapse: collapse;
	border-bottom: 3px solid #ccdce9;
}

/* Ruimte aan de linkerzijde van het menu, boven de leftArea */
.menuContainer td.menuSpacerLeft {
	width: 0px;
    height: 26px;
	border-collapse: collapse;
}

/* Bevat het eigenlijke menu */
.menuContainer td.menuContainerCell {
    height: 26px;
}

/* Ruimte aan de rechterzijde van het menu, boven de rightArea */
.menuContainer td.menuSpacerRight {
	width: 100%;
    height: 26px;
	background-color: #ff8c00;
}

.menu {
	margin-top: 0;
	width: 100%;
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 10px;
	font-family: Trebuchet MS, arial, helvetica;
	text-decoration: none;
    border-bottom:solid #00a8c8 3px;
}

.menu tr td.menuSelected, .menu tr td.menuSelected a {
	background-color: #FFB200;
	padding: 0px;
	font-size: 13px;
}

.menu tr td {
	color: #17383E;
	background-color: #ff8c00;
	border-right: 1px solid #FFB200;
}

.menu tr td a, .menu tr td.menuSelected a {
	padding:4px;
	display:block;
	text-decoration: none;		
	font-weight: normal;
	font-size: 13px;
	color: #FFFFFF;
	cursor: pointer;					/* only needed when hand is not shown */
}

.menu tr td a:hover{ 
	background-color: #FFB200;
	color: #FFFFFF;
}

.menuSpan {
    white-space: nowrap;
}


/**************************************************************************************
Sub menu: HTML tags en classes
***************************************************************************************/

.subMenu {
    padding: 0px;
	border: 1px solid #CCDCE9; 
	border-top: 0px;
	border-spacing: 0px;
	border-collapse: collapse;
	background-color: #ff8c00;
}

.subMenu td a {
    white-space: nowrap;
	color: #FFFFFF;
/*
    width: 100%;		-- dit gaat fout in firefox: geeft een lege rand aan de rechterkant van de cel.
	height: 100%;		-- dit gaat fout in firefox: de oranje lijn tussen de regels valt hierdoor weg. In IE lijkt het geen effect te hebben
*/
	border: 1px solid #FFB200;
	line-height: 18px;
    cursor: pointer; /* only needed when hand is not shown */
	font-family: Trebuchet MS, arial, helvetica;
	font-size: 13px;    
	padding:4px;
	display:block;
}

.subMenu a:hover {
	background-color: #FFB200;
	color: #FFFFFF; 
}

/*	Het submenu klapt over de normale tekst heen in de centerArea en krijgt daarom 
een andere diepte index (z-index) */
.subMenuLayer {
    POSITION: absolute;
    z-index: 1; 
    visibility: hidden;
	padding-top:1px;
	width: 1px;		/* zorg ervoor dat het submenu niet breder wordt dan nodig */
}


/**************************************************************************************
Sub sub menu: HTML tags en classes
***************************************************************************************/
table.subSubMenu {
    width: 100%;
	border-bottom: 3px solid #CCDCE9;
	border-spacing: 0px;
	border-collapse: collapse;
	margin-bottom: 20px;
}

.subSubMenu td {    
	padding: 0px;
	vertical-align: middle;
	background-color: #ff8c00; /* Oranje */
}

.subSubMenu td.subSubMenuSelected {
	background-color: #FFB200;
}

.subSubMenu a, .subSubMenuSelected a {
	color: #FFFFFF;
	font-family: Trebuchet MS, arial, helvetica;
	font-size: 13px; 
	text-decoration: none;		
    font-weight: normal;
    cursor: Pointer; 				/* only needed when hand is not shown */
	padding:1px;
	display:block;
/*
	width: 100%; 
    height: 100%;
*/
}

.subSubMenu a:hover,
.subSubMenu tr td.subSubMenuSelected  {
	color: #FFFFFF;
}

/* Het menu heeft een donkere achtergrond, evenals de cellen. Deze class zorgt
   voor een lichte omlijning. */
.subSubMenuContainer {
	width: 100%;
	margin-top: 0px;
	border-collapse: collapse;
}

.subSubMenuContainer td table td {
	height: 19px;
	border-top: 1px solid #FFB200;
}

/**************************************************************************************
Sub sub menu Categories: HTML tags en classes
***************************************************************************************/
.subSubMenuCategories {
    width: 100%;
	border-spacing: 0px;
	border: 0px;
	background: none;
}

.subSubMenuCategories td {    
    height: 20px;
	padding: 2px;
	padding-left: 4px;
	vertical-align: middle;
	border: 0px;
	background-color: #00a8c8;
}

.subSubMenuCategories a, .subSubMenuCategoriesSelected a {
	color: #ffffff;
	font-size: 12px;
    width: 100%; 
    height: 100%;
    cursor: pointer; 				/* only needed when hand is not shown */
}

.subSubMenuCategoriesSelected a {
	color: white;
}

.subSubMenuCategories a:hover,
.subSubMenuCategories tr td.subSubMenuCategoriesSelected  {
    color: #cccccc;
}

/* Het menu heeft een donkere achtergrond, evenals de cellen. Deze class zorgt
   voor een lichte omlijning. */
.subSubMenuCategoriesContainer {
	width: 100%;
}

.subSubMenuCategoriesContainer td table td {
	height: 19px;
}

/**************************************************************************************
Header: HTML tags en classes
**************************************************************************************/
/* De header bevat algemene gegevens van een object boven de tabbladen. */

.header {
	background-color: #cccccc; 
	color: #010066; 
	font-size: 8pt;
	font-family : arial, verdana, helvetica, sans-serif;		           
	width: 100%;
	border-spacing: 0px;
	border-collapse: collapse;
}


/**************************************************************************************
Tab's: HTML tags en classes
**************************************************************************************/

.tab {
	background-color: #010066; 
	width: 100%;
	border-spacing: 0px;
	border-collapse: collapse;
	margin: 0px;
	padding: 0px;
}

.tabItem {
	background-color: #010066;
	color: #ffffff;
	font-size: 8pt;
	font-family : arial, verdana, helvetica, sans-serif;		           
	text-decoration: none
}

.tabItem A {
	color: white; 
	text-decoration: none
}

.tabItem A:hover {
	text-decoration: underline;
	color: white;
}

.tabItemSelected {
	background-color: #fc0204;
	color: #ffffff;
	font-size: 8pt;
	font-family : arial, verdana, helvetica, sans-serif;		
	text-decoration: none
}

.tabItemSelected A {
	color: white;
	text-decoration: none;
}

.tabItemSelected A:hover {
	text-decoration: underline;
	color: white; 	
}


/**************************************************************************************
Subtab: HTML tags en classes
**************************************************************************************/

.subTab {
	background-color: #dddddd;
	color: #000066;
	font-weight: bold;
}

.subTabItem {
	background-color: #dddddd;
	color: #010066; 
	font-weight: bold;
	font-size: 8pt;
	font-family : arial, verdana, helvetica, sans-serif;	
	
}

.subTabItem A {
	color: #010066;
	text-decoration: none;
	font-weight: bold;
	font-size: 8pt;
}

.subTabItem A:hover {
	text-decoration: underline
}

.subTabItemSelected {
	background-color: #dddddd; 
	color: #fc0204;
	text-decoration: none;
	font-weight: bold;
	font-size: 8pt;
	font-family : arial, verdana, helvetica, sans-serif;	
	
}

.subTabItemSelected A {
	color: #fc0204;
	text-decoration: none;
	font-weight: bold;
}

.subTabItemSelected A:hover {
	text-decoration: underline
}

.listDocumentContainer
{
	margin-bottom: 10px;
	width: 100%;
}

.FAQ h2
{
	background-color: white;
	color: #005192;
	font-weight: bold;
	padding-left: 0px;
	margin-bottom: 0px;
	padding-bottom:0px;
	margin-top: 0px;
	padding-top: 0px;
}

/**************************************************************************************
VDS-specific classes
**************************************************************************************/

table {
	border-collapse: collapse;
}

table.information	{
	background-color: #C8E9F8;
}

table.information th {
	background-color: #005192;
	color: white;
	font-weight: bold;
}

table.information td {
	padding: 4px;
	color: #005192;
	/*border: 1px solid #B4D3E8;*/
}

a.information, h2 a.information {
	text-decoration: none;
	color: #ff8c00;
}

table.WizardSteps	{
	width: 			150px;
	color: 			#FFFFFF;
	background-color: #00a8c8;
}

table.WizardSteps a	{
	font-family: 	Arial;
	font-size: 		9pt;
	font-weight: 	bold;		
	color: 			#FFFFFF;
}

table.WizardSteps a:hover {
	color: 			#FFFFFF;
}

table.WizardSteps td {
	font-family:	Arial;
	font-size: 		9pt;
	font-weight: 	bold;	
	color: 			#FFFFFF;
}

table.additionalArticleNav a {
	font-family:	Arial;
	font-size: 		9pt;
	text-decoration: none;
	color: #FFFFFF;
}
table.additionalArticleNav a:hover {
	color: #FFFFFF;
}

.buttonPrevNext {
	/*background-color: #00a8c8;*/
	background-color: #0098bc;  /** Oude kleur gelijk aan gifjes. */
	cursor: pointer;
	font-family: Arial;
	font-size: 9pt;
	color: #FFFFFF;
}

table.WizardSteps td.AvailableVink	{
	padding-top: 	10px;
	padding-left: 	5px;
	padding-right: 	0px;
}

table.WizardSteps td.AvailableStepName	{
	padding-top: 	10px;
	padding-left: 	0px;
	padding-right: 	10px;
}

table.WizardSteps td.notAvailableVink	{
	padding-top: 	10px;
	padding-left: 	5px;
	padding-right: 	10px;
}

table.WizardSteps td.notAvailableStepName	{
	padding-top: 	10px;
	padding-left: 	0px;
	padding-right: 	10px;
}

table.WizardSteps td.subAvailable	{
	padding-top: 	2px;
	padding-left: 	10px;
	padding-right: 	2px;
	font-weight:	normal;
}

table.WizardSteps td.subAvailable a {
	font-weight:	normal;
}

table.WizardSteps a {
	margin-left: 0px;
}

table.WizardSteps td.subAvailable a:hover {
	color: #FFFFFF;
}


.plusMinusCell {
	width: 10px;
}

.plusMinusCell H2 {
	height: 16px;
}

.smallIcon{
	margin-bottom:-12px;
	height:11px;
}
.headerCell {
	width: 100%;
}
.headerCell H2 a, .headerCell H2 a:hover{
	color: #FFFFFF;
}
.amountCell {
	width: 80px;
}
.koopCell {
	width: 80px;
}


.previousNextButton {
	background-color: #0098bc;  /* blauw gelijk aan het blauw van btn_onderin_links.gif */
	cursor: pointer;
	font-family: Arial;
	font-size: 9pt;
	color: #FFFFFF;
    vertical-align:middle;
}

.previousNextButtonOrange {
	background-color: #ff7800; /* oud oranje gelijk aan button gifjes */
	cursor: pointer;
	font-family: Arial;
	font-size: 9pt;
	color: #FFFFFF;
    vertical-align:middle;
}


table.SelectPackage {
	border: 1px solid #00a8c8;
	padding: 5px;
}

table.SelectPackage td {
	border: 0;
}

/******************************************
			WEBSHOP STIJLEN
 ******************************************/

.webShop td.cellContent {
	padding: 10px 10px 10px 10px;
	color: #00a8c8;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	border: 1px solid #D0ECF3;
	width: 190px;
}

.webShopTextLight {
	color: #ADD8E6;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
}

.webShopText {
	color: #00a8c8;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
}

.webShopTextPrice {
	color: #FF7800;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	margin-bottom: 15px;
}

.webShopTextArrowPrice {
	margin-left: 15px; 
	margin-right: 9px;
}

.webShopTextBig {
	color: #00a8c8;
	font-family: Arial;
	font-weight: bold;
	font-size: 15pt;
}

.webShopTextOfferArticles {
	font-family: Arial;
	font-weight: bold;
	color: #ff8c00;
	font-size: 9pt;
	height: 30 px;
	text-align: middle;
}

.webShop td.cellSpacerHorizontal {
	height: 20px
}
.webShop td.cellSpacerVertical {
	width: 20px
}

.webShop div.imageWebshop {
	margin-top: 10px;
	height: 	100%;
	float: 		left;
}

.webShop img.imageWebshop {
	margin-top: 10px;
	width: 		95px;
	height: 	110px;
	float: 		left;

}

.webShop div.textAndButton {
	margin-top: 10px;
	float: 		right;
	top: 		90px;	
	position: 	relative;
}

.webShop div.textAndButtonInfo {
	margin-top: -4px;
	float: 		right;
	top: 		40px;	
	position:	relative;
}

.webShop div.offerTextAndButtonInfo {
	margin-top: 20px;
	float: 		right;
	top: 		40px;	
	position:	relative;
}

.webShop div.offerTextAndButtonInfo .offerCheckBox {
	margin-bottom: 3px;
}

.webShop div.textAndButtonInfo img {
	margin-top: 5px;
}

.webShopArticle {
	width: 100%;
}

.webShopArticle td.cellContent {
	padding: 10px 10px 10px 10px;
	color: #00a8c8;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
	border: 1px solid #D0ECF3;
}

.webShopArticle div.imageWebshop {
	height: 258px;
	float: left;
}

.webShopArticle img.imageWebshop {
	width: 243px;
	height: 258px;
	float: left;

}

.webShopArticle div.textAndButtonInfo {
	font-family: Arial;
	font-size: 15pt;
	width: 327px;
	position: relative;
	float: right;
}


/**************************************
	   HOOFDPAGINA & BESTELPAGINA
 **************************************/
.rightAreaFlashContent {
	height: 		600px;
	width: 			120px;
 	margin-top: 	4px; 
	margin-bottom: 	4px;	
}

.showSiteBlueBox {
	padding: 5px 5px 5px 5px;
	background-color: #d5e3ee;
	width: 210px;
	height: 120px;
}

.showSiteBlueBoxBottom {
    background:#00a8c8;
    width: 210px;
	height: 3px;
}

.showSiteBlueBoxBottomBlank {
    background:white;
    width: 210px;
	height: 12px;
}

.showSiteBorderBox {
	padding: 5px 5px 5px 5px;
	border: 1px solid #00a8c8;
	width: 210px;
	height: 120px;
}

.showSiteOrangeBox {
	padding: 			5px 5px 5px 5px;
	background-color: 	#ff8c00;
	width: 				210px;
	height: 			120px;
}

.showSiteBlueBoxLabel {
	font-family: Arial;
	color: #00a8c8;
}

.showSiteBlueBoxInput {
	margin-left: 15px;
	border: 1px solid #00a8c8;
}


.messageAppraiseBook {
	background-color: #ff8c00;
	font-family: Arial;
	font-size: 9pt;
	color: #FFFFFF;
	padding: 5px;
	padding-left: 10px;
	margin-bottom: 10px;
}

.messageAppraiseBook a{
	color: #FFFFFF;
}

.commonBottomArea {
	background-color: #ff8c00;
}

.headerExterneSite {
	background-color: #00a8c8;
	cellpadding: 0px; 
	cellspacing: 0px; 
	width: 100%;
}

.addSaleOrderKruimelPad {
	font-family: Arial; 
	font-size: 9pt; 
	color: #ff8c00;
}

/**************************************
	   Webshop De Nieuwe Zaak
 **************************************/
 
 #lister .productImage {
    float: left;
    display: inline;
    width: 100px;
    margin: 0 10px 0 0;
}

 #lister .productImage {
    float: left;
    display: inline;
    width: 100px;
    margin: 0 10px 0 0;
}

#wsheader {
	height:90px;
	background:#00a8c8;
}

#wslogo h1 a {
	float:left;display:inline;
	width: 224px; height: 62px;
	margin: 10px 0 0 0;
	text-decoration: none;
	text-indent:-999em;
	background:url(../conf/logo_vandijk.gif) no-repeat left top;
}

#wsheaderMenu {
	float:left;
    display:inline;
	width:388px;
}
#wsheaderMenu ul {
	list-style:none;
	margin:66px 0 0 10px;
    padding:0;
}
#wsheaderMenu ul li {
	float:left;
    display:inline;
	margin:0 3px 0 0;
    padding:0;
	background:none;
}
#wsheaderMenu ul li a {
	display:block;
	width:110px;height:19px;
	padding:5px 0px 0 0px;
	background:url(../conf/btn_headerMenu.gif) no-repeat;
	font-size:13px;
	font-weight:bold;
/*	text-transform: uppercase; */
	text-align:center;
	text-decoration:none;
	color:#ffffff;
}
*  #wsheaderMenu ul li a {
	height:20px;
	padding:4px 0px 0 0px;
}
#wsheaderMenu ul li a:hover {
	background:url(../conf/btn_headerMenu.gif) 0px -24px no-repeat;
}
#wsheaderMenu ul li a.selected,
#wsheaderMenu ul li a.selected:hover {
	background:url(../conf/btn_headerMenu.gif) 0px -24px no-repeat;
}

#wsheaderSearch {
	float:left;display:inline;
	width:388px;
}
#wsheaderSearch .inputField {
	float:left;display:inline;
	padding:2px 5px 0 0;
	margin:57px 0 0 29px
}
#wsheaderSearch .inputField input {
	width:255px; height:15px;
	padding:2px 0 2px 5px;
	color:#666666;
	border:solid 1px #666666;
}
#wsheaderSearch .submitButton {
	float:left;display:inline;
	margin:57px 0 0 0px
}
