/*
 * Collors:
 * Light blue: 	#7D90A7
 * Blue: 		#43699C
 * Red: 		#CC0000
 */
/* Default elements */
body{ font-family: Arial; margin:0px; margin-top:10px; font-size:0.8em; }

h1, h2, h3{ color: #FFF; }
h1{ font-size:1.5em; }
h2{ font-size:1.4em; line-height:1.4em; padding:0px; margin:0px; margin-bottom:3px; }
h3{}
a{ color:#FFF; }
form{ display:inline; padding:0px; margin:0px; }

/* Global classes */
.clear-float, .clear-both{ clear:both; }
.float-left{   float:left; width:30%; }
.float-center{ margin-left:35%; margin-right:35%; }
.float-right{  float:right; width:30%; text-align:right }
.button{}
.large{ font-size:3.0em; font-weight:bold; line-height:2.0em; }

/* Design */
#wrapper { width:920px; position:absolute; left:50%; margin-left:-450px; background-color: #EEEEEE; }

/* Header */
#wrapper #header{ height:580px; }
#wrapper #header .column{ width:300px; height:120px; float:left; margin-bottom:10px;  }
#wrapper #header #logo{ background-color:black; }
#wrapper #header #login{ background-color: #43699C; margin-left:10px; color:#FFF; position:relative; }
#wrapper #header #login h2{ margin:10px; margin-left:15px; margin-bottom:3px;}
#wrapper #header #login form{ padding:15px; padding-top:10px; }
#wrapper #header #login form input{ width:180px; margin:0px; margin-bottom:5px; float:left; margin-left:15px;  }
#wrapper #header #login form .button{ width:80px; height:50px; border:0px; background-color:#CC0000; position:absolute; float:right; font-size:1.4em; color: #FFF; font-weight:bold; margin-left:-10px; }
#wrapper #header #login form .button.logout{ width:100px; position:absolute; right:5px; bottom:5px;  }
#wrapper #header #login form a{ padding-left:15px; }
#wrapper #header #cart-summery{ background-color: #CC0000; margin-left:10px; overflow-y:none; overflow-x:auto; }
#wrapper #header #cart-summery form{ padding:15px; padding-top:10px; display:block; }

#wrapper #header #header-placeholder{ background-color: #DDDDDD; height:360px;position:relative; margin-bottom:10px; top:35px; }

#wrapper #header #header-placeholder #menu-fake-background{ background-color:#FFF; opacity:0.7; height:55px; width:100%; position:absolute; top:360px; left:0px; }
#wrapper #header #header-placeholder .menu{ width:100%; list-style:none; margin:0px; padding:5px; }
#wrapper #header #header-placeholder .menu li a{ font-size:1.2em; margin:5px; display:block; height:35px; width:125px; color:#FFF; font-weight:bold; text-align:center; vertical-align:middle; text-decoration:none; line-height:35px; }

#wrapper #header #header-placeholder #menu-top{ position:absolute; top:-50px; left:0px; }
#wrapper #header #header-placeholder #menu-top li{ display:block; float:right; }
#wrapper #header #header-placeholder #menu-top li a{ background-color:#43699C; } 
#wrapper #header #header-placeholder #menu-top li.last a{ width:200px; margin-right:20px; }

#wrapper #header #header-placeholder #menu-sub{ position:absolute; bottom:-55px; left:0px; }
#wrapper #header #header-placeholder #menu-sub li{ display:block; float:left; }
#wrapper #header #header-placeholder #menu-sub li a{ background-color:#CC0000; }
#wrapper #header #header-placeholder #menu-sub li.last{ float:right; } 
#wrapper #header #header-placeholder #menu-sub li.last a{ background-color:#43699C; margin-right:20px; }

/* Homepage */
/* Content */
#wrapper #content #info .column{  float:left; margin-bottom:10px; height:230px; background-color:#43699C; }
#wrapper #content #info .store-fake-background{ opacity:0.60; position:absolute; width:100%; left:0px; }
#wrapper #content #info .store-fake-background.blue{ background-color:#43699C; height: 40px; top:0px;  }
#wrapper #content #info .store-fake-background.white{ background-color:#FFF; height: 100px; top:100px; }
#wrapper #content #info .store-address{ position:absolute; margin:20px; top:100px; height:100px; font-weight:bold; font-size:1.1em; line-height:1.4em; left:0px; width:320px; }
#wrapper #content #info .store-address button{ width:120px; height:90px; position:absolute; top:-15px; right:-5px; display:block; cursor:pointer; font-weight:bold }
#wrapper #content #info #store-elst{ width:350px; margin-right:10px; position:relative; }
#wrapper #content #info #store-elst h2{ position:absolute; top:7px; left:7px; font-size: 1.3em; }
#wrapper #content #info #store-druten{ width:350px; margin-right:10px; position:relative; }
#wrapper #content #info #store-druten h2{ position:absolute; top:7px; left:7px; font-size: 1.3em; }
#wrapper #content #info #verzendkosten{ width: 200px; }

#wrapper #content #info #news{ min-height:100px; background-color:#7D90A7; margin-bottom:10px; padding:10px; }

#wrapper #content .header{ height: 75px; color: #FFF; }
#wrapper #content .header .large{ height:75px; vertical-align:middle; display:block; float:left; margin-left:10px; }

#wrapper #content #sale .header{ background-color:#CC0000; margin-bottom:10px;  }

#wrapper #content #new .header{ background-color:#43699C; margin-bottom:10px; }

/* Sub category's' */
#categoryInfoHolder { border-bottom:1px solid #333333; }
#categoryInfoHolder .categoryInfoShort{ float:left; background-color: #7D90A7; margin:10px; padding:5px; color:white; position:relative; text-align:center; cursor:pointer; width:150px; height:165px; }
#categoryInfoHolder .categoryInfoShort img{ display:block; }

/* Navigation controls */
.productNavigationControls{ padding:5px; text-align:center; }
.productNavigationControls span{ margin:5px; padding:5px; }
.productNavigationControls.top{ border-bottom:1px solid #333333; }
.productNavigationControls.bottom{ border-top:1px solid #333333; }

/* Product page */
.productInfoShort{ float:left; background-color: #7D90A7; margin:8px; padding:5px; color:white; position:relative; height: 320px; }
.productInfoShort .productInfoHolder{ z-index:20; display:none; background: url('img/blue-transp.png') repeat center; width:192px; height:143px; position:absolute; padding:5px; cursor: help;  }
.productInfoShort .productInfoHolder span { display:block; }
.productInfoShort .productImgHolder{ width: 200px; height: 200px; background-color:white; position:relative; cursor:pointer; margin-right:3px; }
.productInfoShort .productImgHolder .productMoreInfoLabel{ width:38px; height:38px; background-image:url('img/product-info.png'); position:absolute; right:5px; top:5px; z-index:10; cursor: help;  }
.productInfoShort .productImgHolder img{ width:100%; height:100%; border:1px solid white; }
.productInfoShort .productNameHolder{ padding:3px; font-weight:bold; }
.productInfoShort .productPriceHolder{ font-size:small; padding:3px;  }
.productInfoShort label, .productInfoShort .itemPrice-from{ display:none; }
.productInfoShort select{ width:200px; }
.productInfoShort .ui-selectmenu{ margin-bottom:3px; margin-top:3px; font-size:1em; height:1.8em }
.productInfoShort .productPropertyButtonHolder input{ width:203px; text-align:center; margin-top:5px; position:absolute; bottom:5px; margin-left:-2px; }
.productInfoShort .add-to-cart input{ width:203px; text-align:center; margin-top:5px; position:absolute; bottom:30px; }
.productInfoShort .itemPrice { display:none; }
.productInfoShort h3{ margin-top: 2px; }

/* Discount */
.product-discount-price{ color:red; text-decoration: line-through; font-weight:bold; }

/* Product details */
.productInfoFull{ border:1px; margin:10px; }
.productInfoFull h2{ line-height:1.2em; margin:0px; margin-bottom:3px; padding:3px; display:block; float:right; width:370px; color:#000; }
.productInfoFull .productImages{ background-color:#7D90A7; position: relative; border:1px solid #7D90A7; }
.productInfoFull .productImages img{ margin:5px; float:left; cursor:pointer; border:1px solid #FFF; width:500px; height:375px; }
.productInfoFull .productImages .productImagesTotal{ color:black; font-size:1em; text-align:center; padding:3px; clear:left; }
.productInfoFull .productImages .productOutletDiscount, .productInfoFull .productImages .productOutletSale{ margin:5px !important; }
.productInfoFull .productDescription{ text-align:justify; }
.productInfoFull .productPropertys{ padding:3px; padding:3px; font-size:1em; position:relative; color:#FFF; }
.productInfoFull .productPropertys select { float:left; width:100%; }
.productInfoFull .productPropertys .ui-selectmenu{ margin-bottom:5px; font-size:1em; height:1.8em }
.productInfoFull .productPropertys .itemPrice, .productInfoFull .productPropertys .itemPrice-from{ font-size:1.5em; display:block; padding:5px; text-align:right; }
.productInfoFull .productButtons{ clear:right; margin:0px; margin-top:3px; text-align:right; }
.productInfoFull .productButtons button{ width:235px; }

.productInfoFull .column-images{ float:left; width:402px; margin-right:5px; }
.productInfoFull .column-description{ clear:right; float:right; width:483px; padding:5px; }
.productInfoFull .column-propertys{ clear:right; float:right; width:483px; background-color:#7D90A7; padding:5px;  }
.productSocialMediaButtons{ float:right; clear:right; width:483px; }
.productSocialMediaButtons .smbtn {float:left; margin:2px; width:50px; text-align:center; }

.productOutletDiscount{ width:50px; height:50px;  position:absolute; left:1px; top:1px; z-index:5; }
.productOutletDiscount img{ width:50px !important; height:50px !important; border:none !important; margin:0px !important; }

.productInfoFull .productImages .productOutletDiscount{ margin:2px; }
.productCombinationProducts{ padding:0px; margin:10px; border-top:none !important; }
.productCombinationProducts h3{ background-color: #43699C; padding:10px; }
.productCombinationProducts .productInfoShort { margin:0px; }

/* Shoppingcart */
#cart{ width: 900px; padding:0px; margin-left:10px; }
#cart h1{ background-color: #43699C; padding:10px; }
#cart h2{ color:black; }

/* Progres bar */
#progresbar{ border:1px solid #43699C; color: #000; background-color:white; width:100%; height:20px; text-align:left; }
#progresbar span{ position:absolute; left:50%; margin-left: -100px; width:200px; text-align:center; }
#progresbar .bar{ background-color:#7D90A7; height:100%; }
#progresbar #bar-1{ width: 20%; }
#progresbar #bar-2{ width: 40%; }
#progresbar #bar-3{ width: 60%; }
#progresbar #bar-4{ width: 80%; }
#progresbar #bar-5{ width:100%; border-right:0px; }

/* Table */
/*
#shoppingcart{ font-size:1em; color:white; overflow:auto; overflow-x:hidden; }	
#shoppingcart table{ margin-left:55px; margin-top:3px; width:170px; }
#shoppingcart table .last-row td{ font-weight:bold; border-top:1px solid #CCC }
#shoppingcart table .last-column{ text-align:right }
*/
#shoppingCartPage table{ width:100%; border-collapse: collapse;  }
#shoppingCartPage th{ border-bottom:1px solid #ccc; }
#shoppingCartPage td.amount{ text-align:center; line-height:26px; }
#shoppingCartPage td.amount input{ float:right; }
#shoppingCartPage .col-product{ text-align:left; }
#shoppingCartPage .col-numberof{ width:125px; }
#shoppingCartPage .col-numberctr{ width:60px; }
#shoppingCartPage .col-price{ width:125px; text-align:right; }
#shoppingCartPage .col-total{ width:125px; text-align:right; }

#shoppingCartPage .odd{ background-color:#7D90A7; color:#FFF; }
#shoppingCartPage .price{ text-align:right; }
#shoppingCartPage .subtotal_ex td{ padding-top:5px; text-align:right; }
#shoppingCartPage .btw td{ text-align:right; }
#shoppingCartPage .subtotal_inc td{ padding-top:5px; font-weight:bold; text-align:right; }
#shoppingCartPage .paymentcosts td{ text-align:right; }
#shoppingCartPage .deliverycosts td{ text-align:right; }
#shoppingCartPage .total td{ text-align:right; font-weight:bold; }

#shoppingcart a{ position:absolute; border:1px solid #CC0000; background-color:#CC0000; width:225px; font-size:2em; text-align:center; padding:5px; }

/* second page */
.columnHolder fieldset{ margin-left:5px; }
.columnHolder fieldset label{ font-weight:bold; text-align:right; width:200px; display:block; padding:0px; margin:0px; margin-right:10px; float:left; }
.columnHolder fieldset input,
.columnHolder fieldset select,
.columnHolder fieldset #birthday { float:left; width:200px; }
.columnHolder fieldset select{ width:auto; }
.columnHolder fieldset #birthday select{ float:none; margin-right:3px; margin-top:0px; margin-left:0px; }
.columnHolder fieldset .button{ margin-left:210px; }
.columnHolder fieldset br{ clear:both; }

.columnHolder .edtCustomerLoginname,
.columnHolder .pwdCustomerPassword,
.columnHolder .btnLogin{ clear:left; margin-left:0px !important; }
.columnHolder a{ color:black; }

.columnHolder .left fieldset,.columnHolder .right fieldset{ text-align:center; border:none; background-color:#C00; color:#FFF; padding:5px; padding-top:35px; }
.columnHolder .left fieldset legend, .columnHolder .right fieldset legend{ background-color:#C00; font-size:1.2em; color:#FFF; padding:3px; position:absolute; margin-top:-30px; font-weight:bold; clear:both; }
.columnHolder .left fieldset input{ width:190px; }
.columnHolder .left fieldset .btnLogin{ width:200px; }
.columnHolder .left fieldset .button{ margin-left:-2px; }

.columnHolder .right fieldset,  .columnHolder .right fieldset legend { background-color:#7D90A7; }

#cart .req{  display:block; float:left; width:15px; color:#C00; font-size:1.5em; }
#cart #req-text{ float:right; width:305px; }
#cart #req-text .req{ display:inline; float:none;  }

/* Payment & Delivery options */
#shoppingCartPaymentoptions, 
#shoppingCartDeliveryoptions{ width:100%; }
#shoppingCartPaymentoptions input,
#shoppingCartPaymentoptions label,
#shoppingCartDeliveryoptions input,
#shoppingCartDeliveryoptions label{ width:auto; }
#shoppingCartPaymentoptions th, 
#shoppingCartDeliveryoptions th{ border-bottom:1px solid #ccc; }
#shoppingCartPaymentoptions .row-name,
#shoppingCartDeliveryoptions .row-name{ text-align:left; }

/* Text page */
#wrapper #content #info #news .inner{ padding: 10px; }

/* brands */
.brand{ float:left; margin:5px; background-color: #43699C; padding: 5px; height:220px; width:200px; }
.brand > a{ display:table-cell; background-color: white; width: 200px; height:200px; vertical-align: middle; text-align: center;}
.brand > a > img{  }
.brand .title{ display:block; text-align:center; text-transform: capitalize; color:white; font-weight:bold; }

/* Search */
#searchBar{ padding:10px; }
#searchBar label{ display:block; margin-right:5px; float:left; padding:3px; }
#searchBar input, #searchBar select{ float:left; }

.hidden{ display:none; }