/********************

GLOBAL PAGE LAYOUT

********************/ 

* {

	margin: 0;

	padding: 0;

}



html {

	height: 100%;

}



body {

	font-family: Tahoma, Sans-serif;

  color: #666666;

  font-size: 11px;

	height: 100%;

}



div#Main {

	background-image:url(img/back_body.jpg);

  background-repeat:repeat-x;

}



img#MainLogo {

	padding-left: 0px;

	padding-top: 0px;

}



/* Hoofdcontainer rond header, wrapper en footer */

div#Container {

	margin: 0 auto 0 auto;

	padding: 0; 

	width: 1000px;

	border-left: 1px solid #9b9b9b;

	border-right: 1px solid #9b9b9b;

	border-bottom: 1px solid #9b9b9b;

}



/* Container rond hele bovenkant (van logo tot broodkruimels) */

div#Header {

	border-top: 1px solid #9b9b9b;

	background-image:url(img/back_header.jpg); 

	background-position: top right;

	background-repeat: no-repeat;

}



/* Logo, 'Mijn winkelwagentje' en 'Inloggen / Registreren'  */

/* z-index wordt gebruikt samen met div.fw_tabcontrol_header */ 

div#Header div#Top {

	height: 48px;

	position: absolute;

	z-index: 100; 

	width: 1000px;

}



/* Breadcrumbs */

div#Header div#Bottom {

	padding: 6px 0 0 0;

	border-bottom: 1px solid #9b9b9b;

	background-color: white;

	

}



/* Container rond de inhoud (zonder de header) */

div#Wrapper {

	margin: 20px 10px 0 10px;

}



div#Left {

	width: 200px;

	float: left;

}



div#Content {

	margin: 0 10px 0 6px;

	padding: 0 0 20px 10px;

	width: 570px;

	float: left;

}



/* Wordt gebruikt wanneer er geen zijbalk links is */

div#WideContent {

	margin: 0 10px 0 0;

	padding: 0 0 20px 0;

	width: 770px;

	float: left;

}



div#Right {

	float: right;

	width: 180px;

}



div#Footer {

	margin: 0 10px 0 10px;

	clear: both;

	width: 980px;

	border-top: 1px solid #498797;

}





/********************

TABS

********************/ 

div.fw_tabcontrol_header {

	height: 27px;

	position: relative;

	z-index: 1; 

	margin: 123px 0 0 0;

}



div.fw_tabcontrol_header ul {

	background-image: url(img/back_navigation.gif);

	background-repeat: repeat-x;

	margin: 0 0 0 420px;

	padding: 4px 0 5px 0;

	width: 580px;

	list-style-type: none;

}



div.fw_tabcontrol_header ul li {

	margin: 0 10px 0 0;

	padding: 4px 10px 5px 10px;

	display: inline;

	/*border-left: 1px solid #E6F9FF;

	border-right: 1px solid #E6F9FF;

	background: #E6F9FF url('img/tab.gif') repeat-x;*/

}



div.fw_tabcontrol_header ul li.selected {

	margin: 0px 10px 0 0;

	padding: 4px 10px 10px 10px;

	display: inline;

	/*border-left: 1px solid #F3EFCF;

	border-right: 1px solid #F3EFCF;

	background: #F3EFCF url('img/tab_active.gif') repeat-x;*/

}



div.fw_tabcontrol_header ul li a {

	font-family: Arial;

	font-weight: bold;

	font-style: italic;

	font-size: 12px;

	color: black;

}

div.fw_tabcontrol_header ul li a:hover {

	text-decoration: underline;

}



div.fw_tabcontrol_header ul li.selected a {

	font-family: Arial;

	font-weight: bold;

	font-style: italic;

	font-size: 12px;

	color: black;

	text-decoration: underline;

}



div.fw_tabcontrol_header ul li.selected a:hover {

		text-decoration: underline;

}



/* deze hebben we niet in deze site */

div.fw_tabcontrol_page {

	background: #F4F0D0;

	height: 1px;

	background-color: transparent;

}



div.fw_tabcontrol_page div {

	margin: 0 0 0 220px;	

}



ul.fw_navigation_horizontal {

	width: 778px;

	list-style-type: none;

	margin: 0;

	padding: 0;

	padding-top: 3px;

}



ul.fw_navigation_horizontal li {

	margin: 0px;

	padding: 4px 0 4px 10px;

	float: left;

	display: inline;

}



ul.fw_navigation_horizontal li a.selected {

	font-weight: bold;

	text-decoration: underline;

}



div.fw_navigation_vertical a.selected {

	font-weight: bold;

	text-decoration: underline;

}





/********************

WIDGETS

********************/ 

.float_left {

	float: left;

}



/* Plaatsing van het logo */ 

div#Header img {

	margin: 16px 0 0 15px;

	float: left;

}



/* Widgets in de zijbalk */

div.widget {

	margin: 0 0 20px 0;

	border: 1px solid #9b9b9b;

}



/* Knoppen naar 'Mijn bestellingen' en 'Mijn gegevens' */ 

div#UserMenu {

	margin: 0 auto 0 auto;

	padding: 0 0 80px 0;

	width: 140px;

}



/* Inhoud van de widgets in de zijbalk */

div.content {

	padding: 4px;

	/*background: #f6fbfd;*/

	background-image:url(img/bg_shopmenu.jpg);

}



div#Search {

	margin: 0 0 20px 0;

	padding: 6px;	

	border: 1px solid #9b9b9b;

	/*background: #fefae4;*/

}



div#BreadCrumbs {

	margin: 0 10px 0 10px;

	padding: 4px 0 4px 0;

}



/* Box met één product binnen een grid */

div.product {

	width: 178px;

	height: 280px;

	border: 1px solid #DDD;

	float: left;

	margin: 10px 4px 10px 4px;

}



/* Thumbnail picture */

div.fw_picture {

	width: 100px;

	height: 100px;

	padding: 4px;

	margin: 0 auto 0 auto;

}



/* Vreemde naam, maar wordt gebruikt om prijs en 

   'In winkelwagentje'-knop te centreren binnen een grid */

div.image_product {

	text-align: center;

	height: 160px;

	padding: 10px;

}



div.price {

	height: 60px;

	width: 100%;

	text-align: center;

}



div.add_to_cart {

	width: 140px;

	margin: 0 auto 0 auto; 

}



/* Tabel met één product */ 

table#Product {

	border: 1px solid #DDD;

	width: 100%;

	background: none;

}



table#Product td {

	padding: 10px;

}



table#Product td.image {

	text-align: center;

	vertical-align: top;

	border-right: 1px solid #DDD;

}



div.descr_button {

	float: right;

}



div.product_descr {

	margin: 0 0 10px 0;

	padding: 10px 16px 10px 16px;

	clear: both;

}



div.product_options {

	border-top: 1px solid #DDD; 

	padding: 10px 0 16px 0;

}



div.price_wrapper {

	margin: 0 0 40px 0;

	padding: 12px 0 16px 0;

	height: 24px;

	border-top: 1px solid #DDD;

}



div.price_2 {

	float: left;

}



div.cart_2 {

	float: right;

}



hr {

   clear: both;

   visibility: hidden;

}



div.buttons {

	margin: 0 0 16px 0;

	height: 26px;

}



/* Twee knoppn naast elkaar */

div.buttons div.left {

	float: left;

}



div.buttons div.right {

	float: right;

}



/* Zelfde achtergrond als een formulier */

div.backdrop {

	margin: 10px auto 20px auto;

	padding: 10px 10px 10px 10px;

	width: 90%;

	background: #FDFDFD;

}



div.checkout_left {

	width: 48%; 

	float: left;

}



div.checkout_right {

	width: 48%; 

	float: right;

}



div.step {

	margin: 0 0 10px 0;

}







/********************

HEADERS

********************/

h1 {

	margin: 0 0 16px 0;

	font-size: 1.7em;

	font-weight: normal;

	font-family: Georgia;

}



h2 {

	margin: 0 0 16px 0; 

	font-size: 1.6em;

	color: #77abdd;

	font-weight: normal;

	font-family: Georgia;

}



h3 {

	margin: 0 0 20px 0; 

	font-size: 1.4em;

	color: #0282c3;

	font-weight: normal;

	font-family: Georgia;

}



table#Product td h3 {

	margin: 0 0 10px 0;

}



h4 {

	margin: 0;

	font-size: 1em;

	font-weight: normal;

}



table#Product td h4 {

	margin: 0 0 10px 0;

	font-size: 1.2em;

	font-weight: normal;

	color: #498797;

	font-family: Georgia;

}



/* Titels bij een zijbalk widget */ 

div.top h4 {

	padding: 4px;

}



/********************

PARAGRAPHS

********************/

p {

	margin: 0 0 14px 0; 

	line-height: 1.5em;

	font-size: 1em;

}



p em, li em, label em {

	background: #faf1bf;

	font-style: normal;

}



table.fw_datagrid td em {

	color: #498797;

	font-style: normal;

}



span.fw_datagrid_norowsmessage {

	margin: 0 0 20px 0;	

	padding: 4px 0 4px 36px;

	height: 24px;

	color: #D52900;

	background: url('img/icons/flag.gif') no-repeat;

}



/* Bij een gekleurde achtergrond */

div.content p em {

	color: #000000;

}



p.notice {

	margin: 0 0 20px 0;

	padding: 10px 10px 10px 56px;

	background: #FDFDFD url('img/icons/notice.gif') no-repeat 10px 2px;

	border: 1px solid #ffd800;

	background-color:#fefae4;

}



table#Product td span {

	color: #0282c3;

	font-weight: bold;

}



table#Product td div.price_2 p, div.price p {

	margin: 0;

	font-size: 1.4em;

}



table#Product td div.price_2 p span {

	color: #498797;

	font-weight: normal;

	font-family: Georgia;

}



table#Product td div.price_2 p span.strike, span.strike {

	color: #000;

	font-weight: normal;

	text-decoration: line-through;

	font-family: Trebuchet MS, Verdana, Arial, sans-serif;

}



/********************

LINKS

********************/

a:link {color: #0282c3; text-decoration: none; }

a:visited {color: #0282c3; text-decoration: none; }

a:active {color: #0282c3; text-decoration: underline; }

a:hover {color: #0282c3; text-decoration: underline; }



div#UserInfo a:link {color: #FF6813; text-decoration: none; }

div#UserInfo a:visited {color: #FF6813; text-decoration: none; }

div#UserInfo a:active {color: #FF6813; text-decoration: none; }

div#UserInfo a:hover {color: #FF6813; text-decoration: none; }



/********************

IMAGES

********************/

table#Product td p img {

	vertical-align: top;

}



div#UserMenu img {

	margin: 0 0 10px 0;

}



/********************

DIALOG BOX

********************/

div.fw_dialog_container {

	margin: 0;

	text-align: center;

	background: #FFF;

	border-top: 3px solid #498797;

	border-left: 1px solid #498797;

	border-right: 1px solid #498797;

	border-bottom: 1px solid #498797;

}



.fw_dialog_icon {

	margin: 0;

}



.fw_dialog_text {

  	line-height: 1.5em;

  	color: #000;

}



/********************

FORMS 

********************/

table.form {

	margin: 10px auto 20px auto;

	padding: 10px 0 10px 0;

	width: 90%;

	background: #FDFDFD;

}



table.form th {

	margin: 0; 

	padding: 4px 4px 4px 0;

	width: 30%;

	color: #666666;

	font-weight: normal;

	text-align: right;

}



table.form td {

	margin: 0; 

	padding: 4px 0 4px 4px;

	width: 70%;

}



div.submit {

	margin: 10px 0 60px 0;

	padding: 20px 0 20px 0;

	border-top: 1px solid #A7A37E;

}



div.submit_no_line {

	margin: 10px 0 60px 0;

}



div.submit div.right {

	float: right;

}



input, textarea {

	font-family: Trebuchet MS, Verdana, Arial, sans-serif;

	font-size: 1em;

	border: 1px solid;

	border-color: #666 #ccc #ccc #666;

	padding: 2px 4px 2px 4px;

	background-color:#e6f9ff;

}



select {

	font-family: Trebuchet MS, Verdana, Arial, sans-serif;

	font-size: 1em;

	width: 40%;

	background-color:#e6f9ff;

}



table.fw_datagrid td input {

	font-family: Trebuchet MS, Verdana, Arial, sans-serif;

	font-size: 0.9em;

	border: 1px solid;

	border-color: #666 #ccc #ccc #666;

	padding: 1px 4px 1px 4px;

}



input.fw_checkbox {

	border: none;

}



input.fw_button {

	border: none;

}



/********************

LISTS

********************/

ul {

	margin: 20px 40px 20px 40px;

	

}



ul li {

	list-style-type: square;

}



/* Cart and login */

ul#TopMenu {

	margin: 0px 10px 0 0;

	padding: 4px 0 4px 10px; 

	list-style-type: none;

	float: right;

	background: #E6F9FF url('img/ul_top.gif') repeat-x;

}



/* Footer */

ul#FooterMenu {

	margin: 6px 0 20px 0;

	padding: 0;

	float: left;

	width: 60%;

}



/* Rechter Footer */

ul#RightFooterMenu {

	margin: 6px -10px 20px 0;

	float: right;

	padding: 0;

}



ul#TopMenu li, ul#FooterMenu li, ul#RightFooterMenu li {

	padding: 0 10px 0 0;

	display: inline;

	list-style-type: none;

}



ul#TopMenu li.cart {

	padding: 2px 10px 10px 24px;

	/* background: url('img/icons/cart.gif') no-repeat; */

}



ol {

	margin: 20px 40px 20px 40px; 

	padding: 0; 

}



ol li {

	margin: 0 0 6px 0;

}



div#SubMenu {

	background: #EFEBCA;

	height: 22px;

}



/* Head menu */

ul#MenuMenu {

	margin: 0 0 0 220px;

	padding: 4px 0 5px 0;

	width: 540px;

	list-style-type: none;

}





ul#MenuMenu li {

	margin: 0 10px 0 0;

	padding: 5px 10px 5px 10px;

	display: inline;

	background: #E6F9FF;

}



ul#MenuMenu li.selected {

	background: #EFEBCA;

}



/* Sub menu */

ul#SubMenuSubMenu {

	margin: 0 0 0 220px;

	padding: 6px 0 6px 0;

	width: 540px;

	list-style-type: none;

}



ul#SubMenuSubMenu li {

	margin: 0 4px 4px 0;

	padding: 4px 0 4px 10px;

	display: inline;

}



/********************

DATAGRID AND TABLES

********************/

table {

	margin: 10px auto 10px auto;

	padding: 10px;

	background: #FDFDFD;

}



div#Search table {

	margin: 0;

	padding: 0; 

	background: none;

}



table th {

	text-align: left;

}



/* Table with product options: size, color, ... */

table#ProductOptions {

	width: 100%;

	border-collapse: collapse;

	background: #FAFAFA;

}



table#ProductOptions th {

	width: 40%;

	padding: 4px 6px 4px 0; 

	text-align: right;

	color: #837901;

}



table#ProductOptions td {

	width: 60%;

	padding: 4px 0 4px 0;  

	text-align: left;

}



table.fw_datagrid {

	margin: 0 0 20px 0;

	border-collapse: collapse;

	cursor: default;

	background: none;

	border: 1px solid #DDD;

}



table.fw_datagrid tr th {

	padding: 4px;

	font-weight: normal;

	background-color: #EEE;

	text-align: left;

}



table.fw_datagrid tr td {

	padding: 4px;

}



table.fw_datagrid tbody tr.over {

	background-color: #F9F9F9;

}



/********************

POPUP

********************/

div.fw_panel_popup {

	border: 1px solid red;

}



div.fw_panelheader {

	height: 20px;

	background: #EFEBCA;

	border: 1px solid #E6E2AF;

	margin: 0;

	width: 658px;

}



div.popup_content {

	width: 620px;

	overflow: hidden;

	height: 310px;

	margin: 20px auto 0 auto;

}



/* Wrapper voor tabel met inhoud winkelwagentje */

div.cart_contents {

	margin: 0 0 20px 0;

	padding: 1px 0 0 0;

	height: expression(this.scrollHeight > 220? "220px" : "auto" );

	overflow: auto;

	width: 620px;

	height: auto;

	max-height: 220px;

}



table#C_dgBasketItems {

	margin: 0 auto 0 auto;

	width: 580px;

}



div.fw_popupbackground {

	background-color:#CCCCCC; 

	opacity:.7; 

	filter:alpha(opacity=70); 

	/* IE */

}

