@import url('https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed:300,400,500,600');

@import url('https://fonts.googleapis.com/css?family=Fira+Sans');

body														{
															margin:									0;
															padding:								0;
															font-family: 							'Barlow Semi Condensed', sans-serif;
															font-weight:							400;
															font-size:								16px;
															line-height:							160%;
															background-image: 						url('../images/system/background_top.png'), url('../images/system/background_bottom.png');
															background-repeat: 						repeat-x, repeat-x;
															background-position:					left top, left bottom;
															}

#languageslide												{
															z-index:								6000;
															position:								fixed;
															background:								#999;
															top:									200px;
															width:									200px;
															left:									-200px;
															height:									160px;
															transition:								left 0.4s ease-in-out;
															-o-transition:							left 0.4s ease-in-out;
															-ms-transition:							left 0.4s ease-in-out;
															-moz-transition:						left 0.4s ease-in-out;
															-webkit-transition:						left 0.4s ease-in-out;
															}

#languagetoggle												{
															position:								absolute;
															left:									200px;
															top:									1px;
															padding:								5px;
															background:								rgba(0, 0, 88, 0.4);
															display: 								block;
															width:									30px;  /* */
															height:									31px;  /* */
															border-radius: 							0px 10px 10px 0px;
															background-repeat: 						no-repeat;
															background-position:					center center;
															}

#languagetoggle:hover										{
															background:								rgba(0, 0, 88, 1);
															background-repeat: 						no-repeat;
															background-position:					center center;
															}

.languagebox 												{
															padding:								0px;
															}

.language-sel 												{
															display: 								block;
															width: 									200px; /* */
															height: 								40px;
															background-color: 						#f1f1f1;
															min-width:								160px;
															background-repeat:						no-repeat;
															background-size:						30px 30px;
															background-position:					5px 5px;
															padding-left:							0px;
															float:									left;
															color:									#000;
															border-top:								1px solid #fff;
															border-right:							1px solid #fff;
															border-bottom:							1px solid #ccc;
															border-left:							1px solid #ccc;
															}

.language-sel:hover 										{
															background-color:						#4CAF50;
															color:									#fff;
															}

	.sline1													{
															margin-top:								0px;
															padding-left:							50px;
															font-family: 							'Barlow Semi Condensed', sans-serif;
															font-weight:							600;
															font-size:								16px;
															}

	.sline2													{
															margin-top:								-8px;
															padding-left:							50px;
															font-family: 							'Barlow Semi Condensed', sans-serif;
															font-weight:							400;
															font-size:								13px;
															}

#languageslide:hover										{
															left:									0px;
															}



#slideouthamburger 											{
															position: 								fixed;
															top: 									0px;
															left:									0;
															width:									100vw;
															padding: 								3px;
															text-align: 							left;
															z-index:								2000;
															background:								#fff;
															background-image: 						url('../images/system/header_logo_small.png');
															background-position:					right top;
															background-repeat:						no-repeat;
															-webkit-transition-duration:			0.3s;
															-moz-transition-duration:				0.3s;
															-o-transition-duration:					0.3s;
															transition-duration:					0.3s;
															-webkit-box-shadow:						0px 6px 5px -2px rgba(0,0,0,0.5);
															-moz-box-shadow:						0px 6px 5px -2px rgba(0,0,0,0.5);
															box-shadow:								0px 6px 5px -2px rgba(0,0,0,0.5);
															display:								none;
															}

	#slideouthamburger_inner 								{
															position:								fixed;
															top:									0px;
															left:									-250px;
															background:								#f1f1f1;
															width:									250px;
															padding:								0px;
															height:									100vh;
															-webkit-transition-duration:			0.3s;
															-moz-transition-duration:				0.3s;
															-o-transition-duration:					0.3s;
															transition-duration:					0.3s;
															text-align:								left;
															display:								flex;
															flex-direction:							column;
															}

	#slideouthamburger_inner a								{
															text-decoration:						none;
															}

	#slideouthamburger:hover 								{
															left:									250px;
															}

	#slideouthamburger:hover #slideouthamburger_inner 		{
															left:									0;
															}

		.hamburger 											{
															display:								inline-block;
															cursor:									pointer;
															margin-top:								5px;
															margin-left:							5px;
															}

		.bar1, .bar2, .bar3 								{
															width:									30px;
															height:									4px;
															background-color:						#565656;
															margin:									4px 4px;
															transition:								0.4s;
															}


#navbar 													{
															position:								fixed;
															height:									60px;
															top:									-64px;
															width:									100%;
															display:								block;
															transition:								top 0.5s;
															z-index:								1000;
															display:								flex; /* equal height of the children */
															}

#navbar-menu												{
															position:								relative;
															height:									60px;
															background-color:						#CC9693;
															width:									100%;
															max-width:								1000px;
															display:								block;
															overflow:								auto;
															display:								flex; /* equal height of the children */
															margin:									0 auto;
															-webkit-box-shadow:						0px 6px 5px -2px rgba(0,0,0,0.5);
															-moz-box-shadow:						0px 6px 5px -2px rgba(0,0,0,0.5);
															box-shadow:								0px 6px 5px -2px rgba(0,0,0,0.5);
															}

#navbar a													{
															flex: 									1;
															}

#pagelayout													{
															display:								flex;
															flex-direction:							column;
															margin:									0 auto;
															width:									100%;
															max-width:								1000px;
															min-height:								100vh;
															margin-top:								50px;
															margin-bottom:							50px;
															}

#pageheader													{
															position:								relative;
															display:								block;
															width:									100%;
															padding-bottom:							15%;
															background-image: 						url("../images/system/header_logo_2.png");
															background-repeat:						no-repeat;
															background-size:						cover;
															border-radius: 							200px 20px 0px 0px;
															}

#menubar													{
															position:								relative;
															height:									60px;
															background-color:						#CC9693;
															width:									100%;
															display:								flex;
															overflow:								auto;
															background-color:						#bbb;
															}

#menubar a													{
															flex: 									1;
															text-decoration:						none;
															}

	.menu-item												{
															position:								relative;
															height:									60px;
															display:								flex;
															justify-content: 						center;
															align-items: 							center;
															font-weight:							400;
															font-size:								18px;
															color:									#ffffff;
															}

		.menu-color-1										{
															background-color:						#fece3e;
															}

		.menu-color-2										{
															background-color:						#f95a4b;
															}

		.menu-color-3										{
															background-color:						#f58d4e;
															}

		.menu-color-4										{
															background-color:						#f04950;
															}

		.menu-color-5										{
															background-color:						#e966ac;
															}

		.menu-color-6										{
															background-color:						#b868ad;
															}

		.menu-color-7										{
															background-color:						#8869ad;
															}

		.menu-color-8										{
															background-color:						#3276b5;
															}

		.menu-color-9										{
															background-color:						none;
															color:									#000;
															border-top:								1px solid #fff;
															border-right:							1px solid #fff;
															border-bottom:							1px solid #ccc;
															border-left:							1px solid #ccc;
															}

		.menu-item:hover									{
															background-color:						#ffffff;
															color:									#00008B;
															font-weight:							600;
															}

#carousel													{
															position:								relative;
															background-color:						#cecece;
															width:									100%;
															height:									40%;
															display:								block;
															overflow:								auto;
															}

	#jssor_1												{
															position:								relative;
															margin:									0 auto;
															top:									0px;
															left:									0px;
															width:									1000px;
															height:									400px;
															overflow:								hidden;
															visibility:								hidden;
															}

	.slides													{
															cursor:									default;
															position:								relative;
															top:									0px;
															left:									0px;
															width:									1000px;
															height:									400px;
															overflow:								hidden;
															}

	.slidesimage											{
															position:								absolute;
															top:									30px;
															left:									30px;
															width:									500px;
															height:									40px;
															font-family:							'Barlow Semi Condensed',sans-serif;
															font-size:								32px;
															font-weight:							500;
															line-height:							1.2;
															text-align:								center;
															color: 									rgba(34,139,34 ,1);
															}

	#carousel .regel1										{
															width:									100%;
															background-color:						rgba(255,255,255,0.7);
															font-weight:							400;
															font-size:								24px;
															clear:									both;
															padding:								8px 0;
															}

	#carousel .regel2										{
															width:									100%;
															background-color:						rgba(255,255,255,0.7);
															font-weight:							400;
															font-size:								48px;
															clear:									both;
															padding:								8px 0 15px 0;
															}

	#carousel .regel3										{
															width:									100%;
															background-color:						rgba(255,255,255,0.7);
															font-weight:							400;
															font-size:								32px;
															}

#maincontent												{
															position:								relative;
															min-height:								100vh;
															background-color:						#CC9693;
															width:									100%;
															display:								flex;
															overflow:								auto;
															background-color:						#bbb;
															margin-top:								40px;
															}

	#leftcol												{
															flex:									1; /* additionally, equal width */
															padding:								14px 5px;
															padding-right:							20px;
															background-color:						#fff;
															}

	.prodselect-main 										{
															width:									calc(25% - 20px);
															height:									150px;
															position:								relative;
															border:									1px solid #1B5E20;
															overflow: 								hidden;
															float:									left;
															margin:									9px 9px;
															}

	.prodselect-main:hover .prodselect-text 				{
															background-color:						rgba(0, 0, 88, 1);
															color:									#fff;
															}

	.prodselect-text										{
															display: 								flex;
															align-items: 							center;
															justify-content: 						center;
															position:								absolute;
															bottom:									0px;
															left:									0px;
															width:									calc(100% - 10px);
															height:									40px;
															background-color:						rgba(0, 0, 88, 0.3);
															color:									#fff;
															font-weight:							600;
															text-align:								center;
															font-size:								16px;
															line-height:							20px;
															padding-left:							5px;
															padding-right:							5px;
															}
															
															
	


	#rightcol												{
															flex:									.8; /* additionally, equal width */
															padding:								0;
															background-color:						#ebf3ec;
															border-spacing:							0;
															border-collapse:						collapse;
															}


		.tab												{
															display: 								flex; /* equal height of the children */
															overflow:								hidden;
															background-color:						#ebf3ec;
															}

		.tab button 										{
															flex:									1; /* additionally, equal width */
															height:									40px;
															background-color:						#275929;
															color:									#ffffff;
															float:									left;
															border:									none;
															outline:								none;
															cursor:									pointer;
															transition:								0.3s;
															font-family: 							'Barlow Semi Condensed', sans-serif;
															font-weight:							500;
															font-size:								18px;
															}

		/* Change background color of buttons on hover */
		.tab button:hover 									{
															background-color: 						#ebf3ec;
															color:									#000000;
															}

		/* Create an active/current tablink class */
		.tab button.active 									{
															background-color: 						#ebf3ec;
															color:									#000000;
															}

		/* Style the tab content */
		.tabcontent 										{
															display:								none;
															padding:								6px 12px;
															border:									none;
															border-top:								none;
															}

		.col2li 											{
															margin-left: 							0px;
															font-size:								16px;
															padding: 								3px 30px 3px 24px;
															list-style: 							none;
															background-image: 						url("../images/system/calendar.svg");
															background-repeat:						no-repeat;
															background-position:					0px 7px;
															background-size:						14px;
															text-align:								justify;
															line-height:							140%;
															}

		.tabs-image											{
															width:									100%;
															height:									auto;
															}

		.tabs-image-image									{
															margin-top:								20px;
															width:									100%;
															height:									auto;
															}

#bottommenu													{
															position:								relative;
															height:									160px;
															width:									100%;
															display:								flex;
															overflow:								auto;
															background-color:						#8ebc32;
															justify-content:						space-evenly;
															}

	.bottommenu-item										{
															display:								block;
															overflow:								auto;
															height:									160px;
															background-color:						none;
															flex:									.4;
															}

#copyrights													{
															position:								relative;
															height:									60px;
															background-color:						#000;
															width:									100%;
															overflow:								auto;
															font-size:								14px;
															font-weight:							500;
															text-align:								center;
															line-height:							60px;
															color:									#fff;
															border-radius: 							0px 0px 20px 20px;
															}

/* default text atribs */

	p															{
																text-align:								justify;
																}

	a															{
																font-weight:							700;
																color:									#1B5E20;
																text-decoration:						none;
																}

	b															{
																font-weight:							700;
																color:									#000058;
																}

	h1 															{
																font-weight:							400;
																font-size:								36px;
																line-height:							40px;
																color:									#000058;
																}

	h2 															{
																font-weight:							400;
																font-size:								24px;
																line-height:							28px;
																color:									#000058;
																}

	h3 															{
																font-weight:							600;
																font-size:								18px;
																line-height:							22px;
																color:									#000058;
																}

	ul 															{
																margin-left: 							0px;
																}

	li 															{
																margin-left: 							-10px;
																font-size:								16px;
																padding: 								3px 30px 3px 24px;
																list-style: 							none;
																background-repeat:						no-repeat;
																background-position:					0px 10px;
																background-size:						14px;
																text-align:								justify;
																line-height:							160%;
																}

	.color-select												{
																color:									red;
																font-weight:							600;
																}

.double-arrow													{
																background-image: 						url("../images/system/double-right-arrows.svg");
																}
																
.plus-sign														{
																background-image: 						url("../images/system/plus.svg");
																}
																
.check-circle													{
																background-image: 						url("../images/system/check-circle.svg");
																}

.notabs															{
																width:									calc(100% - 22px);
																margin:									0px 10px;
																margin-top:								64px;
																}

.voorbeeld 														{
																margin: 								0px 0px 40px 3px;
																padding: 								3px 20px 3px 170px;
																min-height:								140px;
																height:									auto;
																background-repeat:						no-repeat;
																background-position:					0px 2px;
																background-size:						140px;
																font-weight:							400;
																text-align:								justify;
																line-height:							24px;
																clear:									both;
																}

.type2col 														{
																margin-top:								20px;
																margin-bottom:							50px;
																border-collapse:						collapse;
																border-spacing:							0;
																width:									100%;
																table-layout:							fixed;
																}


.type2col th													{
																border-width:							0px;
																padding:								8px 1px;
																overflow:								hidden;
																color:									#fff;
																background-color:						#3E8E41;
																border-radius: 							8px 8px 0px 0px ;
																}

.type2col td													{
																font-size:								14px;
																padding:								5px 10px;
																border-style:							solid;
																border-width:							0px;
																overflow:								hidden;
																word-break:								normal;
																border-top-width:						1px;
																border-bottom-width:					1px;
																border-color:							#3E8E41;
																color:									#000;
																vertical-align:							top;
																}

.type2col tr td:nth-child(2)									{
																text-align:								left;
																font-weight:							500;
																}

.type2col tr td:nth-child(3)									{
																text-align:								left;
																font-weight:							500;
																}

.type2col tr													{
																background-color:						none;

																}

.type2col tr:first-child 										{
																border:									0px;
																}

.type2col tr:hover												{
																background-color:						#b1d1b3;
																}

.typeordercol													{
																width:									100%;
																margin-top:								20px;
																border-collapse:						collapse;
																table-layout: 							fixed;
																border-spacing:							0;
																width:									100%;
																margin-bottom:							50px;
																}


.typelist1col													{
																width:									100%;
																border-collapse:						collapse;
																table-layout: 							fixed;
																border-spacing:							0;
																width:									100%;
																margin-bottom:							50px;
																}

.typelist1col th												{
																border-width:							0px;
																padding:								8px 1px 4px 1px;
																overflow:								hidden;
																color:									#fff;
																background-color:						#3E8E41;
																}

.typelist1col tr:hover											{
																background-color:						#b1d1b3;
																}

.typelist1col td												{
																font-size:								14px;
																padding:								5px 10px;
																border-style:							solid;
																border-width:							0px;
																overflow:								hidden;
																word-break:								normal;
																border-top-width:						1px;
																border-bottom-width:					1px;
																border-color:							#3E8E41;
																color:									#000;
																white-space:							nowrap;
																}

.typeordercol th												{
																border-width:							0px;
																padding:								8px 1px 2px 1px;
																overflow:								hidden;
																color:									#fff;
																background-color:						#3E8E41;
																}

.typeordercol th:first-child										{
																border-radius: 							8px 0px 0px 0px ;
																}

.typeordercol th:last-child										{
																border-radius: 							0px 8px 0px 0px ;
																}

.typeordercol .order-number 		{
																width:									140px;
																}

.typeordercol .dia-width 		{
																width:									100px;
																}

.typeordercol td												{
																font-size:								14px;
																padding:								5px 10px;
																border-style:							solid;
																border-width:							0px;
																overflow:								hidden;
																word-break:								normal;
																border-top-width:						1px;
																border-bottom-width:					1px;
																border-color:							#3E8E41;
																color:									#000;
																text-align:								center;
																white-space:							nowrap;
																}

.typeordercol tr td:nth-child(2)								{
																text-align:								center;
																}

.typeordercol tr td:nth-child(3)								{
																text-align:								center;
																}

.typeordercol tr												{
																background-color:						none;
																}

.typeordercol tr:first-child 									{
																border:									0px;
																}

.typeordercol tr:hover											{
																background-color:						#b1d1b3;
																}

.tableheader 													{
																margin: 								0px 10px;
																padding: 								3px 20px 3px 30px;
																height:									18px;
																background-repeat:						no-repeat;
																background-position:					0px 2px;
																background-size:						18px;
																font-weight:							600;
																text-align:								justify;
																line-height:							18px;
																}

	.header-image												{
																width: 									auto;
																height:									24px;
																}

	.nextline 													{
																margin: 								0px 0px;
																padding: 								5px 0 0 26px;
																font-size:								14px;
																background-repeat:						no-repeat;
																background-position:					8px 7px;
																background-size:						14px;
																white-space:							nowrap;
																line-height:							15px;
																background-image: 						url("../images/system/right-arrow.svg");
																}

		.specifications											{
																background-image: 						url("../images/system/specifications.svg");
																}

		.construction											{
																background-image: 						url("../images/system/construction.svg");
																}

		.techspecs												{
																background-image: 						url("../images/system/techspec.svg");
																}

		.images													{
																background-image: 						url("../images/system/images.svg");
																}

		.graphics												{
																background-image: 						url("../images/system/graphics.svg");
																}

		.certificates											{
																background-image: 						url("../images/system/certificate.svg");
																}

		.toxicity												{
																background-image: 						url("../images/system/toxicity.svg");
																}

		.safety													{
																background-image: 						url("../images/system/plug.svg");
																}

		.nen13180												{
																background-image: 						url("../images/system/nen13180.svg");
																}

		.marine													{
																background-image: 						url("../images/system/marine.svg");
																}

		.ce														{
																background-image: 						url("../images/system/ce.svg");
																}

		.glasswool												{
																background-image: 						url("../images/system/glasswool.svg");
																}

		.imagedownload											{
																width:									100%;
																display:								block;
																overflow:								auto;
																}

		.greenleaf												{
																background-image: 						url("../images/system/green-leaf.svg");
																}

		.loc													{
																background-image: 						url("../images/system/loc.svg");
																}

		.male													{
																background-image: 						url("../images/system/male.svg");
																background-size:						22px;
																font-size: 								20px;
																font-weight: 							400;
																}

		.female													{
																background-image: 						url("../images/system/male.svg");
																background-size:						22px;
																font-size: 								20px;
																font-weight: 							400;
																}

		.mspeaks													{
																background-image: 						url("../images/system/mspeaks.svg");
																}

		.fspeaks													{
																background-image: 						url("../images/system/fspeaks.svg");
																}

		.downloadthumb											{
																width:									48%;
																padding-top:							25%; /* 1:1 Aspect Ratio */
																position:								relative; /* If you want text inside of it */
																margin:									2px;
																background-position: 					center;
																background-repeat:						no-repeat;
																background-size:						cover;
																border:									1px solid #ccc;
																}

		.downloadthumb:hover									{
																background-color:						#fff;
																}


	.country 													{
																margin: 								0px 0px 0px 3px;
																padding: 								3px 20px 3px 30px;
																height:									24px;
																background-repeat:						no-repeat;
																background-position:					0px 2px;
																background-size:						24px;
																font-weight:							500;
																text-align:								justify;
																line-height:							24px;
																white-space:							nowrap;
																color:									#000;
																}

	.contact 													{
																margin: 								0px 0px 0px 5px;
																padding: 								3px 20px 3px 34px;
																height:									28px;
																background-repeat:						no-repeat;
																background-position:					0px 2px;
																background-size:						28px;
																font-weight:							600;
																text-align:								justify;
																line-height:							28px;
																line-height:							28px;
																}

	.language													{
																width:									24px;
																height:									24px;
																float:									left;
																margin-top:								2px;
																margin-right:							10px;
			`													}

			/* https://www.flaticon.com/packs/countrys-flags */
			.poland											{
															background-image: 						url("../images/system/flags/pl.png");
															}

			.dutch											{
															background-image: 						url("../images/system/flags/netherlands.svg");
															}

			.german											{
															background-image: 						url("../images/system/flags/germany.svg");
															}

			.france											{
															background-image: 						url("../images/system/flags/france.svg");
															}

			.sweden											{
															background-image: 						url("../images/system/flags/sweden.svg");
															}
															
			.serbia											{
															background-image: 						url("../images/system/flags/serbia.svg");
															}

			.united-kingdom									{
															background-image: 						url("../images/system/flags/united-kingdom.svg");
															}

			.united-states									{
															background-image: 						url("../images/system/flags/united-states.svg");
															}

			.russia											{
															background-image: 						url("../images/system/flags/russia.svg");
															}

			.eu												{
															background-image: 						url("../images/system/flags/european-union.svg");
															}
															
			.japan											{
															background-image: 						url("../images/system/flags/japan.svg");
															}

			.na												{
															background-image: 						url("../images/system/not-available.svg");
															}

			.switzerland									{
															background-image: 						url("../images/system/flags/switzerland.svg");
															}

			.mobile											{
															background-image: 						url("../images/system/contact-mobile.svg");
															}

			.email											{
															background-image: 						url("../images/system/contact-email.svg");
															}

			.clock											{
															background-image: 						url("../images/system/contact-clock.svg");
															}

			.fax											{
															background-image: 						url("../images/system/contact-fax.svg");
															}

			.landline										{
															background-image: 						url("../images/system/contact-landline.svg");
															}

			.mspeaks										{
															background-image: 						url("../images/system/mspeaks.svg");
															}

			.fspeaks										{
															background-image: 						url("../images/system/fspeaks.svg");
															}

			.contactus										{
															background-image: 						url("../images/system/contact.svg");
															}

.mobvis														{
															display:								none;
															}

.u-vmenu													{
															display:								block;
															overflow:								auto;
															background-color:						none;
															width: 									100%;
															padding:								0;
															margin:									0;
															}

.u-vmenu ul 												{
															list-style:								none;
															margin-left:							0px;
															padding:								0;
															}

.u-vmenu li 												{
															list-style:								none;
															margin-left:							20px;
															padding:								0;
															}

.u-vmenu ul ul												{
															display:								none;
															margin-left:							30px;
															}

.u-vmenu ul li a 											{
															height: 								40px;
															line-height:							40px;
															display:								block;
															font-size:								16px;
															color:									#000;
															text-decoration:						none;
															outline:								none;
															padding-left:							20px;
															}

.u-vmenu ul li a:hover										{
															background-color:						#b1d1b3;
															}

.u-vmenu ul li a[data-option='on']{
	background: url(../images/system/on.png) right center no-repeat;
}
.u-vmenu ul li a[data-option='off'] {
	background: url(../images/system/off.png) right center no-repeat;
}

#loading {
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   position: fixed;
   display: block;
   opacity: 0.8;
   background-color: #fff;
   z-index: 99;
   text-align: center;
}

#loading-image {
  position: absolute;
  left: calc(50% - 30px);
  top: calc(50% - 30px);
  width:	60ox;
  height:	60px;
  z-index: 10000;
}
