﻿html																{}
body																{color:#444; font-size:12px; font-weight: 400; font-family: 'Arial', sans-serif; -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; background-color:#f58c0c;} 

/*===ELEMENTS============================================================================================================================*/
/* BODY        {text-align:left; font-family:Arial; color:#444444; font-size:12px;margin:0px; padding:0px; background-color:#f58c0c;} 
HTML		{width:100%;}
FIELDSET	{padding:0px; margin:0px; border:0px;}
FORM		{padding:0px; margin:0px;}
SELECT		{float:left; font: 11px Tahoma; margin:0px; margin:0px; width:150px;}
LABEL		{float:left; font: 11px Tahoma; padding:0px; margin:0px;}
INPUT		{padding:0px; margin:0px;}
OPTION		{padding:0px; margin:0px;}
RADIO		{padding:0px; margin:0px;}
CHECKBOX	{padding:0px; margin:0px;}	
TEXTAREA	{padding:0px; margin:0px;}	
IMG			{border:none;} */

A:link			{color: #000000; text-decoration:none;}
A:visited		{color: #000000; text-decoration:none;}
A:active		{color: #000000; text-decoration:none;}
A:hover			{color: #000000; text-decoration:none;}

/* P				{margin:0px; padding:0px; line-height:17px;} */
H1				{font-size:19px; color: #000;}
H2				{margin: 0px; font-size:14px; color:#333333;}
H2 B			{color:#477eb6;}
H3				{padding: 2px 4px; margin-left: 5px; font-size:13px; color:#666666; border: solid 1px #ececec; float:left;}
H3.selected		{border: solid 1px #f58c0c;}

/* UL				{padding:0px; margin:0px;}
UL LI			{list-style-type:none;} */

/*=== Start coding here ==========================================================================================================================================*/

DIV#background			{width:100%; height:100%; background: #ffffff url(/images/style/bodyBackground.gif) no-repeat center top;}
DIV#mainContainer		{width:900px; margin: 0px auto;}
    
DIV#topContainer		{width:900px; height:114px; padding:37px 0px 0px 0px; display: flex;}	
    A#logo              {width:190px; height:74px; margin:3px 20px 0px 0px; background: url(/images/style/logo.jpg) no-repeat bottom left;}    

	#navigationTopContainer 	{display: flex; flex: 1 1 auto;}
	#navigationTopContainer .partShoppingCart1.buttonOrderSummary {margin-left: auto; margin-right: 30px;}
	
DIV#socialContainer             {margin: auto 0; margin-left: auto;}
    a#facebook                  {width:25px; height:25px; display:block;  background:url(/images/style/facebook.png) no-repeat;}
	
DIV#headerContainer		{width:900px; height:320px; margin:3px 0px 10px 0px; background: url(/images/style/header.jpg) no-repeat top; border-radius:10px; position: relative;}
	DIV#welcome				{left:0; right:0; bottom: 35px; position:absolute;  text-align: center; padding:20px;}
		DIV#welcome H1			{font-size:26px; color:#ffffff; font-weight:700; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); margin: 0; padding:0;}
		DIV#welcome P			{color:#fff; margin-top: 5px; font-size:18px; line-height:1.3em; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); padding:0;}
	
DIV#navigationContainer	{width:213px; float:left; margin: 0px 10px 0px 0px;}
	DIV#navigation	{width:213px; background: url(/images/style/navigationMiddle.gif) repeat-y;}
	DIV#navigationTop		{width:213px; height:7px; background: url(/images/style/navigationTop.gif) no-repeat;}
	DIV#navigationFooter	{width:213px; height:17px; background: url(/images/style/navigationBottom.gif) no-repeat bottom;}	
		
DIV#contentContainer	{width:677px; float:left;}

#contentContainerFullWidth {border:solid 1px #cdcdcd; border-radius: 10px; padding:13px; background-color: #fff;}
		
DIV#basketLargeContainer	{width:677px; float:left;}
DIV#basketLargeContainer span	{float:right; text-align:right; display:block; width:50px; padding-right:5px;}
DIV#basketLargeContainer span.colour { color:#477eb6;}
DIV#basketLargeContainer img	{float:left;}
	DIV#basketLarge				{width:677px; height:42px; background: url(/images/style/basketLargeTop.gif) no-repeat; cursor:pointer}
	DIV.basketItem				{width:600px; height:109px; padding: 11px 66px 15px 11px; float:left; background: url(/images/style/basketLargeMiddle.gif) no-repeat;}	
	DIV.basketItem H2			{font-size:14px; color:#333333;display:block; height:25px; width:500px; padding-left:25px}
	DIV.basketItem img			{margin-right:5px;float:left}	
		DIV.basketImage				{width:107px; height:107px; float:left; margin: 0px 20px 0px 25px; border:solid 1px #ececec;}
	DIV.basketDetails			{height: 30px; padding-top:0px;}
	DIV.basketDetails p			{width:65px; float:left;}
	DIV.basketDetails p a		{cursor:pointer;}
	DIV.basketDetails a			{padding:4px 9px; margin-right:5px; display:block; float:left; background-color:#ffffff; border: solid 1px #ececec; color:#666666;cursor:pointer;}
	DIV.basketDetails a.selected	{border: solid 1px #f58c0c;}
	DIV.basketDetails span		{float:right; text-align:right; display:block; width:120px;}
	DIV.basketDetails span.colour	{ color:#f58c0c; width:70px;}
	DIV.basketDetails a.basketProductAdd			{color: green;font-weight:bold;}
	DIV.basketDetails a.basketProductRemove		{color: red;font-weight:bold;}
	DIV#basketFooter			{width:606px; height:67px; padding:20px 36px 22px 36px; clear:both; float:left; background: url(/images/style/basketLargeFooter.gif) no-repeat;}
	DIV#basketFooter p b		{color:#f58c0c;}


		DIV#basketButton			{width:166px; height:31px; float:left; background: url(/images/style/basketButton.gif) no-repeat;cursor:pointer;}
		DIV#basketButton a			{width:136px; height:31px;color:white;display:block;padding-top:8px;padding-left:30px;font-weight:bold;}
		DIV#basketFooterInfo		{width:210px; height:90px; float:right;padding-right:10px;}
		DIV#basketFooterInfo span	{width:120px; padding-bottom:5px;display:block;float:left;text-align:right;}
		DIV#basketFooterInfo span.colour	{width:70px;color:#f58c0c;}
		
DIV#basketSmall		{width:677px; height:42px; float:left; background: url(/images/style/basketSmall.gif) no-repeat; cursor:pointer}
	DIV.basketContent		{width:225px; height:40px; float:left;}
		DIV.basketContent span		{display:block; padding: 13px 0px 0px 10px; float:left;}
		DIV.basketContent span b	{padding-left: 5px; color:#f58c0c;}
		DIV.basketContent img	{padding-left: 10px;padding-top: 13px;float:left}
	

DIV#multiviewContainer			{width:677px; float:left; margin-top: 10px;}
	DIV#multiviewContainerTop		{width:677px; height:10px; float:left; background: url(/images/style/contentTop.png) no-repeat;}
	DIV#multiviewContainerBottom	{width:677px; height:10px; float:left; background: url(/images/style/multiviewBottom.gif) no-repeat;}
	DIV#multiviewItemContainer		{width:677px; float:left; background: url(/images/style/multiviewMiddle.gif) repeat-y;}
	DIV#multiviewItemContainer	 IFRAME{margin:10px;}

#contactView {margin-bottom: 10px; overflow: hidden;}

DIV#contactView DIV.partContentText	{width:320px;float:left;}

/*  productItemSmall */		
		DIV.productItemSmall										{width:33.333%; float:left; padding-left:13px;padding-right:12px;}
		DIV.productItemSmall IMG                                    {cursor:pointer; margin:0px 8px 5px 0px;}
		DIV.productItemSmall A.productItemSmallTitleA				{display:block;width:100%;padding:10px 0px; height: 48px;}
		DIV.productItemSmall SPAN STRIKE		{margin-left:10px;}
		DIV.clearBothDiv						{clear:both; height:30px; font-size:1px; background: url(/images/style/multiviewMiddle.gif) repeat-y; border-bottom:dashed 1px #cdcdcd;}
		DIV.productItemSmall SPAN 				{color:#f58c0c;font-weight:bold;height:20px;display:block;}

		/* .partContentFileImageGallery.productBoxColorThumbs		{width:45px;height:35px;border:none;cursor:pointer;margin-top:10px;margin-right:5px;} */

        .productAjaxImageContainer {display: flex; flex-wrap: wrap;}
        .productAjaxImageContainer .partContentFileImageGallery.single:nth-child(1) {width: calc(100% - 5px); height: auto;}
        .productAjaxImageContainer .partContentFileImageGallery.single {width: calc(25% - 5px); height:35px;border:none;cursor:pointer;margin-top:10px;margin-right:5px;}
		.productAjaxImageContainer .partContentFileImageGallery.productBoxColorThumbsSelected		{border:solid 1px #f58c0c; }

/* ProdcutItemLarge */


	DIV#productSingleImage{width:380px;height:400px; float:left;padding-bottom:50px;}
		
		DIV.productSingleDimensionContainer			{width:260px; border-top: dashed 1px #ececec; margin-top:10px;float:left;padding-bottom:5px;}
		DIV.productSingleDimensionContainer P		{height:40px;}
		DIV.productSingleDimensionContainer DIV			{padding: 2px 4px; margin: 7px 0px 0px 5px; font-size:13px; color:#444444; border: solid 1px #ececec; float:left;cursor:pointer;}
		DIV.productSingleDimensionContainer DIV.selected	{border: solid 1px #f58c0c;cursor:pointer;}
		
DIV#singleviewContainer			{width:677px; float:left;}
		DIV#singleviewContainerTop		{width:677px; height:10px; float:left; background: url(/images/style/contentTop.png) no-repeat;}
		DIV#singleviewContainerBottom	{width:677px; height:10px; float:left; background: url(/images/style/multiviewBottom.gif) no-repeat;}
		DIV#singleviewItemContainer		{width:100%; float:left; padding: 5px 15px 0 15px; background: url(/images/style/singleviewMiddle.gif) repeat-y;}
		DIV#singleviewItemContainer p i	{color:#477eb6;}
		DIV#singleviewItemContainer p.inline	{float:left; padding:10px 0px 0px 10px;}
		DIV#singleviewItemContainer h2	{padding: 10px 0px 0px 10px;}
		#singleviewItemContainer h1 {margin-bottom: 5px;}
		
		DIV#singleviewDescription{float:left;border-top: dashed 1px #ececec;width:260px; margin-top: 10px;}
		#singleviewDescription table  {margin:10px; margin-top: 0;}

		DIV#singleviewDescription .partContentText p	{padding:10px;}
			DIV#singleviewInformationContainer	{width:260px; float:left; border: solid 1px #ececec;}
			DIV#singleviewInformationContainer h2	{padding:10px 0px 10px 10px;}
			DIV#singleviewInformationContainer p	{padding:0px 0px 0px 10px;}
			DIV#singleviewInformationContainer b	{color:#f58c0c;}
				/* DIV#singleviewThumbnail				{width:240px; padding:0px 0px 0px 10px;}
				DIV#singleviewThumbnail p			 {padding:15px 0px 15px 5px; float:left;width:150px;cursor:pointer}
				DIV#singleviewThumbnail	IMG			{float:left; color:#444444; border: solid 1px #ececec; margin: 5px 5px 0px 0px;}
				DIV#singleviewThumbnail	IMG.productBoxColorThumbsSelected {border: solid 1px #f58c0c;} */


			#singleviewInformation .filterLabel {margin-left: 10px; margin-bottom: 5px; font-weight: 700; color: #f58c0c; display: block;}
			#singleviewInformation .controlCheckBoxRadio4 {margin-left: 10px; font-size: 16px;}
		
			DIV#singleviewImageContainer	{width:380px; height:320px; padding:0px 5px 0px 10px; float:left;}
            #singleviewImageContainer .partContentFileImageGallery {margin-bottom: 15px;}
				a#inWinkelmandje			{width:380px; height:30px; background:#f58c0c; padding:0px 0px 0px 0px; cursor:pointer; color:white;display:block; border-radius:10px; }
				span#orderButtonPlus        {display:block; float:left; width:38px; font-size:28px; font-weight:bold; padding:0px 3px 3px 10px;}
				span#orderButtonText        {display:block; float:left; width:280px; padding:8px 8px 8px 0px;}

            #ajaxProductSingleThumbnailContainer                        {display: flex; width: 100%; flex-wrap: wrap;}
				.thumbnailImageContainer                                    {padding: 10px; cursor:pointer; width: calc(50% - 10px);}
					.thumbnailImageContainer .partContentFileImageGallery img		    {margin: 0;}

					.thumbnailImageContainer .productBoxColorThumbsSelected {border: solid 1px #f58c0c;}
						.thumbnailImageContainer p                          {margin: auto 0;}



/* DIV#orderContainer                                              {padding:20px 25px 20px 25px;} */

DIV#footer				{height:1px; clear:both; overflow:hidden;}
DIV#footerBackground		{height:15px; clear:both; background: url(/images/style/footer.gif) repeat-x;}

div#bodyFooter													{width:900px; margin:0px auto; padding:0px; line-height:17px;height:50px;}
div#bodyFooter ul												{padding:0px; margin:0px; list-style-type:none; text-align:right;}
div#bodyFooter ul li											{color:#ffffff; display:inline; border-left: solid 1px #ffffff; padding:0px 6px 0px 10px; }
div#bodyFooter ul li#footerCopyright						    {border-left:none;}
div#bodyFooter ul li a:link										{color:#ffffff; text-decoration:none;}
div#bodyFooter ul li a:visited									{color:#ffffff; text-decoration:none;}
div#bodyFooter ul li a:active									{color:#ffffff; text-decoration:none;}
div#bodyFooter ul li a:hover									{color:#ffffff; text-decoration:none;}

.clearBoth                                                      {clear:both;}
DIV#messageContainer                                            {padding:10px;}

/********************************************** 
ShoppingCart custom code
**********************************************/

#shoppingCart   {display: flex; flex-direction: column;}
	
	#shoppingCartFooterContainer 	{display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-start;}

		/* coupon code */
		#shoppingCartCouponCodeContainer 	{margin-right: auto; padding-right: 25px; padding-top: 25px; padding-bottom: 15px;}
			#shoppingCartCouponCodeContainer .partButton.couponCodeButtonShow {text-decoration: underline;}
			#shoppingCartCouponCodeContainer .partButton.couponCodeButtonShow:hover {color: #000;}
			
			#shoppingCartCouponCodeControl 			{display: none; margin-bottom: 10px;}
			#shoppingCartCouponCodeControl.active 	{display: flex;}
				#shoppingCartCouponCodeControl .inputCouponCode 	{height: 36px; border:solid 1px #999; border-radius: 3px; margin-right: 5px; padding:0 8px; flex: 1 1 auto;}
				#shoppingCartCouponCodeControl .inputCouponCode.error {border-color: #eb0400;}
				#shoppingCartCouponCodeControl .partButton {height: 36px; width: 36px; justify-content: center; border-radius: 3px; background-color: #00b900; flex: 0 0 auto;}

		/* cost overview */
		#shoppingCartPriceContainer 		{line-height: 1.3em; background-color: rgba(0,0,0,0.05); width: 100%; max-width: 400px; margin-bottom: 25px; padding:25px; padding-top: 10px; align-self: flex-end;}
			
			#shoppingCartPriceContainer .shoppingCartPriceLine 				{margin-top: 15px; display: flex; justify-content: space-between;}
				#shoppingCartPriceContainer .shoppingCartPriceLine .label 		{}
				#shoppingCartPriceContainer .shoppingCartPriceLine .value 		{font-weight: 700; color: #000; text-align: right; margin-left: 15px; width: 150px; white-space: nowrap;}

				#shoppingCartPriceContainer .shoppingCartPriceLine#priceInclusiveVat .label {font-weight: 700; color: #000;}
				#shoppingCartPriceContainer .shoppingCartPriceLine#priceInclusiveVat .value {font-size: 1.75em;}

		/* shopping cart button container */		
		.shoppingCartOverviewButtonContainer	 						{display: flex; justify-content: space-between; flex-wrap: wrap; padding-bottom: 10px;}
			.shoppingCartOverviewButtonContainer .partButton 				{margin-left: 15px; margin-bottom: 15px;}
			.shoppingCartOverviewButtonContainer .partButton:first-child 	{margin-left: 0;}

		/* responsive */	
		@media screen and (max-width: 667px){
			/* coupon code */
			#shoppingCartCouponCodeContainer {padding-right: 0;}

			/* cost overview */
			#shoppingCartPriceContainer 	{align-self: auto; padding:15px; padding-top: 0;}
				#shoppingCartPriceContainer .shoppingCartPriceLine .value {width: auto;}
				#shoppingCartPriceContainer .shoppingCartPriceLine#priceInclusiveVat .value {font-size: 1.25em;}

			/* shopping cart button container */		
			.shoppingCartOverviewButtonContainer {flex-direction: column;}
			.shoppingCartOverviewButtonContainer .partButton {margin-left: 0; justify-content: center;}

			.shoppingCartOverviewButtonContainer .buttonToOrderProcess	{order:1;}
			.shoppingCartOverviewButtonContainer .buttonToShop 			{order:2;}
		}

/********************************************** 
Order custom code
**********************************************/   

#customOrder 							{}
	#customOrder .basicContainer 			{}
		#customOrderContainer 					{}
			#customOrderProcessAndCartContainer 	{display: flex; flex-wrap: wrap; padding:10px;}
				#customOrderProcessContainer 			{margin-right: 25px; width: calc(100% - 275px);}
          			#customOrder .orderStepControls                 {background-color: #fff;}
				#customOrderCartContainer 				{width: 250px;}

/* responsive */
@media screen and (max-width: 1023px){
	#customOrderProcessContainer 					{order: 2; margin-right: 0; width: 100%;}
	#customOrderCartContainer 						{order: 1; width: 100%; margin-bottom: 20px;}
}

