/************************************************** NON CRITICAL BASICS */
::-webkit-input-placeholder
{ /* Chrome/Opera/Safari */
	color: #ccc;
}
::-moz-placeholder
{ /* Firefox 19+ */
	color: #ccc;
}
:-ms-input-placeholder
{ /* IE 10+ */
	color: #ccc;
}
:-moz-placeholder
{ /* Firefox 18- */
	color: #ccc;
}
hr
{
	border: 0;
	height: 1px;
	background-color: #676767;
	background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#676767), to(#f8f4ef));
	background: -o-webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#676767), to(#f8f4ef));
	background: -moz-webkit-gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#676767), to(#f8f4ef));
	background: gradient(radial, 50% 50%, 0, 50% 50%, 350, from(#676767), to(#f8f4ef));
	margin: 15px 0 30px 0;
}
hr.text
{
	text-align: center;
	font-weight: 400;
	text-transform: lowercase;
	color: #676767;
}
hr.text:after
{
	content: attr(data-title);
	display: inline-block;
	position: relative;
	top: -0.8em;
	font-size: 1.2em;
	padding: 0 0.25em;
	background: #f8f4ef;
}
.red { color:#e41318; }
.green { color:#30cd0e; }
th { font-weight: bold; }
h1 > span, .h1 > span,
h2 > span, .h2 > span,
h3 > span, .h3 > span,
h4 > span, .h4 > span,
h5 > span, .h5 > span,
h6 > span, .h6 > span
{
	color: #262a2d;
	font-weight: 300;
	font-size: 14px;
	font-weight: normal;
}
/***********************************************************************/

/****************************************************** BASIS ELEMENTEN *
FORM FIELDS
BUTTONS
TABLES
RESPONSIVE TABLE
ZEBRA TALBE
FIELDSVALS TABLE	
***********************************************************************/

/********************************************************* FORM FIELDS */
fieldset
{
	border: 1px solid #ddd;
	margin-bottom: 1.5em;
}
legend
{
	padding: 0 0.5em;
	color: #328D9E;
}
div.comment,
.fieldval div.radio,
.fieldval div.checkbox,
html input:not([type]),
html input[type='number'],
html input[type='text'],
html input[type='date'],
html input[type='email'],
html input[type='password'],
html select,
html option
{
	padding: 5px;
	margin: 0;
	vertical-align: middle;
	background-color: White;
	border: 1px solid #cdcdcd;
	color: #555;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	/*-webkit-appearance:none;*/
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
div.comment,
.fieldval div.radio,
.fieldval div.checkbox
{
	background-color: transparent;
	border-color: transparent;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	padding-left: 0;
	line-height: 18px;
}
.fieldval div.radio,
.fieldval div.checkbox
{
	min-height: 18px;
	height: auto;
}
html input:not([type]).data-customer,
html input[type='number'].data-customer,
html input[type='text'].data-customer,
html input[type='date'].data-customer,
html input[type='email'].data-customer,
html input[type='password'].data-customer,
html select.countryselect
{
	width:100%;
}
html textarea
{
	margin: 2px;
	border: none;
	background-color: #e7e4e2;
	max-width: 100%;
}
.fieldval div.radio:hover,
html input:not([type]):hover,
html input[type='number']:hover,
html input[type='text']:hover,
html input[type='date']:hover,
html input[type='email']:hover,
html input[type='password']:hover,
html input[type='checkbox']:hover,
html select:hover,
html option:hover,
html textarea:hover
{
	-webkit-box-shadow: 0 0 3px #cdcdcd;
	-moz-box-shadow: 0 0 3px #cdcdcd;
	box-shadow: 0 0 3px #cdcdcd;
}
.fieldval div.radio:focus,
html input:not([type]):focus,
html input[type='number']:focus,
html input[type='text']:focus,
html input[type='date']:focus,
html input[type='email']:focus,
html input[type='password']:focus,
html input[type='checkbox']:focus,
html select:focus,
html option:focus,
html textarea:focus
{
	-webkit-box-shadow: 0 0 3px #bbb;
	-moz-box-shadow: 0 0 3px #bbb;
	box-shadow: 0 0 3px #bbb;
}
html input[type='number']
{
	text-align: right;
}
.comment.required
{
	text-align: right;
}
/**********************************************************************/

/************************************************************ BUTTONS */
html button,
html *[role=button],
html input[type='button'],
html input[type='submit']
{
	position: relative;
	display: inline-block;
	min-height: 20px;
	line-height: 20px;
	padding: 4px 18px;
	border: 1px solid #0A7943;
	background-color: #0A7943;
	color: White;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
}
html button > .fa,
html *[role=button] > .fa,
html input[type='button'] > .fa,
html input[type='submit'] > .fa
{
}
html button span,
html *[role=button] span,
html input[type='button'] span,
html input[type='submit'] span
{
	display: inline-block;
	text-align:center;
	padding: 0;
}
html button .fa + span,
html *[role=button] .fa + span,
html input[type='button'] .fa + span,
html input[type='submit'] .fa + span
{
}
html button.icon,
html *[role=button].icon,
html input[type='button'].icon,
html input[type='submit'].icon
{
	padding: 0;
	min-width: auto;
	line-height: normal;
}
html button.icon > .fa,
html *[role=button].icon > .fa,
html input[type='button'].icon > .fa,
html input[type='submit'].icon > .fa
{
	position: inherit;
	border: 0;
	text-align: center;
	margin-left: -1px;
}

/* HOVER */
html button:hover,
html *[role=button]:hover,
html input[type='button']:hover,
html input[type='submit']:hover
{
	background-color: #262a2d;
	border-color: #262a2d;
	color: #fff;
}
html button:hover > .fa,
html *[role=button]:hover > .fa,
html input[type='button']:hover > .fa,
html input[type='submit']:hover > .fa
{
	border-color: white;
}
html button.login:hover > .fa-lock:before,
html *[role=button].login:hover > .fa-lock:before,
html input.login[type='button']:hover > .fa-lock:before,
html input.login[type='submit']:hover > .fa-lock:before
{
	content: '\f13e';
}
html button.login:hover > .fa-unlock-alt:before,
html *[role=button].login:hover > .fa-unlock-alt:before,
html input.login[type='button']:hover > .fa-unlock-alt:before,
html input.login[type='submit']:hover > .fa-unlock-alt:before
{
	content: '\f023';
}
/**********************************************************************/

/****************************************************** EXTRA BUTTONS */
button.secondary,
*[role=button].secondary,
input[type='button'].secondary,
input[type='submit'].secondary
{
	background-color: #F3E044;
	border-color: #F3E044;
	color: #000;
}
button.secondary:hover,
*[role=button].secondary:hover,
input[type='button'].secondary:hover,
input[type='submit'].secondary:hover
{
}
button.warning,
*[role=button].warning,
input[type='button'].warning,
input[type='submit'].warning
{
	color: #fff;
	background-color: #e85e5e;
	border-color: #e85e5e;
}
button.warning:hover,
*[role=button].warning:hover,
input[type='button'].warning:hover,
input[type='submit'].warning:hover
{
}
button.disabled,
*[role=button].disabled,
input[type='button'].disabled,
input[type='submit'].disabled
{
	background-color: #676767;
	border-color: #676767;
}
button.disabled:hover,
*[role=button].disabled:hover,
input[type='button'].disabled:hover,
input[type='submit'].disabled:hover
{
	background-color: #676767;
	border-color: #676767;
}
button.special,
*[role=button].special,
input[type='button'].special,
input[type='submit'].special
{
	background-color: #30cd0e;
	border-color: #30cd0e;
	color: White;
	text-transform: uppercase;
}
button.special:hover,
*[role=button].special:hover,
input[type='button'].special:hover,
input[type='submit'].spacial:hover
{
}

html button.subscribe,
html *[role=button].subscribe,
html input[type='button'].subscribe,
html input[type='submit'].subscribe
{
	padding: 6px 18px;
	border-color: White;
	background-color: transparent;
	color: White;
	text-transform: uppercase;
}
html button.subscribe:hover,
html *[role=button].subscribe:hover,
html input[type='button'].subscribe:hover,
html input[type='submit'].subscribe:hover
{
	background-color: #262a2d;
	border-color: #262a2d;
	color: #fff;
}
html button.transparent,
html *[role='button'].transparent,
html input[type='button'].transparent,
html input[type='submit'].transparent {
	border-color: transparent;
	background-color: transparent;
	color: inherit;
}
html button.favorite,
html button.favorite .fa
{
	padding: 0;
}
html button.clear,
html *[role=button].clear,
html input[type='button'].clear,
html input[type='submit'].clear,
html button.clear:hover,
html *[role=button].clear:hover,
html input[type='button'].clear:hover,
html input[type='submit'].clear:hover
{
	background-color: transparent;
	border: 0;
	border-radius: 0;
	color: inherit;
	height: auto;
	min-height: 20px;
	margin: 0;
	min-width: 0;
	padding: 0;
	background-color: initial;
	border: initial;
	border-radius: initial;
	color: initial;
	height: initial;
	margin: initial;
	min-width: initial;
	padding: initial;
}
html button.clear > .fa,
html .button.clear > .fa,
html input[type='button'].clear > .fa,
html input[type='submit'].clear > .fa
{
	position: relative;
	line-height: 20px;
	width: auto;
}
html button.clear.warning > .fa
{
	color: #e85e5e;
}

html button.hidden,
html *[role=button].hidden,
html input[type='button'].hidden,
html input[type='submit'].hidden
{
	background-color:#fff;
	width:0px;
	height:0px;
	min-height:0px;
	border:0;
}
button.logoff span
{
	color: White;
	font-weight: bold;
}
/**********************************************************************/

/******************************************************** STYLED TABLE */
table.styled {
	/*width:100%;*/
	margin-top:10px;
	margin-bottom:10px;
}
table.styled tr th,
table.styled tr td {
	padding: 0.25rem;
	vertical-align: top;
}
table.styled thead {
	background-color: #676767;
}
table.styled thead tr th {
	padding: 0.75rem 0.25rem;
	line-height: normal;
	text-align: left;
	font-weight: bold;
	color: White;
}
table.styled thead.webshop tr th {
	background-color: #148a4e;
}
table.styled tr th.right {
	text-align: right;
}
table.styled tr td.number {
	text-align: right;
}
table.styled tr.hr {
	margin-top: 0.5em;
}
table.styled tr.hr th,
table.styled tr.hr td {
	border-top: none;
	padding-top: 0.5em !important;
	vertical-align: top;
}
table.styled tr td img.tiny {
	max-height: 3.0em;
	max-width: 3em;
	margin: 0.25em 0.5em 0.25em 0;
	vertical-align:top;
}
@media only screen and (max-width: 767px)
{
	table.styled tr td img.tiny {
		margin: 0 0.5em 0 0;
	}
}
table.styled tbody + thead {
	border-top: 1em solid white;
}
table.styled.list tr td.image {
	height: 3em;
}
table.styled.list tr th,
table.styled.list tr td {
	padding-left: .5em;
	padding-right: .5em;
}
table.styled.list tr th:first-of-type,
table.styled.list tr td:first-of-type {
}
table.styled.list tbody tr th {
	text-align: left;
	vertical-align: top;
}
table.styled.list tr td {
	/*border-bottom: none;*/
}
table.styled.list tr td b{
	margin-left:20px;
}
table.styled.list tbody tr:hover > td {
	background-color: #e7e4e2;
}
table.styled.list tbody tr:hover th {
	background-color: #e7e4e2;
}
table.styled.list tr td a {
	text-decoration: none;
}
table.styled.list tr[onclick]:hover {
	background-color: #e7e4e2;
	cursor: pointer;
}
table.styled.list tr td > .fa {
	color: #88bce6;
}
table.styled.list tr th.center,
table.styled.list tr td.center {
	text-align: center;
	vertical-align: middle;
}
table.styled.list tr th.number,
table.styled.list tr td.number {
	text-align: right;
	vertical-align: middle;
}
table.styled.list tfoot th,
table.styled.list tfoot td {
}
table.styled.list tfoot:hover th,
table.styled.list tfoot:hover td {
	background-color: #e7e4e2;
}
table.styled.list tfoot td.clear {
	background-color: transparent;
}
table.styled.list tfoot.small {
	font-size: 0.8666666666666667em;
	font-weight: 600;
	color: #148a4e;
}
table.styled thead.basket tr th {
	background-color: #148a4e;
}
/**********************************************************************/

/**************************************************** RESPONSIVE TABLE */
@media screen and (max-width: 575.98px)
{
	table.responsive tfoot
	{
		display: block;
	}
	table.responsive tbody tr th
	{
		position: relative;
		top: 0;
		left: 0;
		background-color: #14909a;
		color: #fff;
		width: 100%;
	}
	table.responsive tfoot tr td
	{
		width: 100%;
		text-align: right;
	}
	table.styled.list tr td:hover
	{
		background-color: rgba(20,144,154,0.12);
	}
	table.responsive.styled.list.artlist tbody > tr ~ tr,
	table.responsive.styled.list.basket tbody > tr ~ tr
	{
		border-top: 4px solid #14909a;
	}
	table.responsive.styled.list tr th:first-of-type,
	table.responsive.styled.list tr td:first-of-type
	{
		padding: 0 0.25em;
	}
	table.responsive.styled.list td[data-type-title]
	{
		padding-left: 120px!important;
	}
	table.responsive.styled.list td.artlistvariant,
	table.responsive.styled.list td.artlistcount
	{
		text-align: right;
	}
	table.responsive.styled.list td.artlistorder
	{
		text-align: right;
		padding-bottom: 0.25em;
		border-bottom: 2px solid #e4e4e4;
	}
	table.responsive.styled.list tr th.center,
	table.responsive.styled.list tr td.center,
	table.responsive.styled.list td.number.left
	{
		text-align: left;
	}
	table.basket td.clear { display: none; }
	table.basket tbody th { display: none; }
}
/**********************************************************************/

/********************************************************* ZEBRA TABLE */
table.zebra tbody tr:nth-of-type(2n+2) td
{
	background-color: #f3f3f3;
}
/**********************************************************************/

/**************************************************** FIELDSVALS TABLE */
table.fieldsvals
{
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}
table.deliveryAddress
{
	max-width: 480px;
}
table thead th,
table.fieldsvals th
{
	text-align: left;
}
table.fieldsvals tbody + thead th
{
	padding-top: 1em;
}
table.fieldsvals th,
table.fieldsvals td
{
	vertical-align: top;
	padding-bottom: 4px;
}
.fieldheader
{
	padding-top: 1em;
	padding-bottom: .5em;
}
table.fieldsvals .fieldname
{
	color: Black;
	font-weight: 600;
	width: 35%;
}
table.fieldsvals .fieldval
{
	width: 65%;
}
table.fieldsvals .fieldval span.part
{
	display: inline-block;
}
table.fieldsvals .fieldval span.part + span.part
{
	float: right;
	text-align: right;
}
table.fieldsvals .fieldval span.part + span.part input
{
	margin-right: 0;
}
div.required,
table.fieldsvals .fieldval div.radio.required,
table.fieldsvals .fieldval.required input[type='text'],
table.fieldsvals .fieldval.required input[type='number'],
table.fieldsvals .fieldval.required input[type='password'],
table.fieldsvals .fieldval.required input[type='email'],
table.fieldsvals .fieldval.required textarea,
table.fieldsvals .fieldval.required select,
table.fieldsvals input[required='required'],
table.fieldsvals textarea[required='required'],
table.fieldsvals select[required='required']
{
	border-right: 2px solid #fd8204;
	border-radius: 0 2px 0 0;
}
div.comment,
table.fieldsvals .fieldval div.radio,
table.fieldsvals .fieldval textarea,
table.fieldsvals .fieldval input[type='text'],
table.fieldsvals .fieldval input[type='number'],
table.fieldsvals .fieldval input[type='password'],
table.fieldsvals .fieldval input[type='email'],
table.fieldsvals .fieldval select
{
	width: 100%;
	max-width: 100%;
}
table.fieldsvals .fieldval input[type='email'].inputtext
{
	width: auto;
}
table.fieldsvals .fieldval.checkbox
{
	min-height: 20px;
}
table.fieldsvals .fieldval.checkbox input[type='checkbox']
{
	float: left;
	width: 10%;
}
table.fieldsvals .fieldval.checkbox label
{
	float: left;
	width: 87%;
}
table.fieldsvals td.normal
{
	vertical-align: middle;
	padding-top: 1em ;
	width: 45%;
}
table.fieldsvals td.right
{
	text-align: right;
}

table.fieldsvals.passchange .fieldname
{
	width: 35%;
}

@media only screen and (max-width: 480px)
{
	table.fieldsvals,
	table.fieldsvals thead,
	table.fieldsvals tbody,
	table.fieldsvals tr,
	table.fieldsvals td,
	table.fieldsvals .fieldname,
	table.fieldsvals .fieldval
	{
		width: 100%;
		max-width: 100%;
		display: block;
	}
}


/* CONTEXT MENU */
.contextmenu ul.menu,
.contextmenu ul.menu li,
.contextmenu ul.menu a
{
	padding: 0;
	color: White;
	text-transform: none;
}
.contextmenu ul.menu li:hover
{
	opacity: 0.7;
	-moz-opacity: 0.7;
	-o-opacity: 0.7;
	-webkit-opacity: 0.7;
}
.contextmenu .warning { color: #fffc19!important; }
ul.accountmenu li
{
	height: 30px;
	line-height: 30px;
}
ul.accountmenu li a
{
	display:block;
	text-decoration: none;
}

/*********************************************************** SUBMENU */
.submenu .row
{
	margin: 0;
}
@media only screen and (min-width: 992px)
{
	ul.menu > li
	{
		position: relative; 
	}
	ul.menu li > .submenu
	{
		position: absolute;
		z-index: 999;
		right: 0;
		top: 100%;
		padding: 30px 0 25px 0;
		
		background-color: White;
		border-top: 1px solid #DCDBE4;
		-webkit-box-shadow: 0 1px 1px rgba(31,26,87,.22);
		-moz-box-shadow: 0 1px 1px rgba(31,26,87,.22);
		box-shadow: 0 1px 1px rgba(31,26,87,.22);
		
		opacity: 0;
		visibility: hidden;
	}
	ul.submenu li
	{
		text-align: left;
		line-height: 2rem;
	}
	ul.submenu li .heading
	{
		line-height: 2rem;
		font-weight: 700;
		color: Black;
		text-transform: uppercase;
	}
	ul.submenu.withsubs
	{
		display: block;
		width: 100%;
		-webkit-column-count: auto;
		-webkit-column-gap: normal;
		-moz-column-count: auto;
		-moz-column-gap: normal;
		column-count: auto;
		column-gap: normal;
	}
	ul.submenu.withsubs > li
	{
		display: block;
		float: left;
		width: 48%;
		margin-left: 1% !important;
		margin-right: 1% !important;
		margin-bottom: 1rem !important;
	}
	
	ul.menu li > .submenu	
	{
		opacity: 0;
		transition: all 0.3s 0.2s ;
	}
	ul.menu li:hover > .submenu
	{
		visibility: visible;
		opacity: 1;
	}
	
}
ul.submenu,
ul.submenu ul
{
	list-style-type: none;
	list-style-position: inside;
}
ul.submenu a
{
	text-decoration: none;
}
ul.submenu.withsubs > li > ul li > a
{
	color: #676767;
}
ul.submenu.withsubs > li > ul li > a:hover
{
	color: #30cd0e;
}
.submenu .readmore a
{
	text-transform: uppercase;
	font-weight: 600;
}

/* Taalkeuze */
ul.menu li > .submenu.languageselection
{
	min-height: 0px;
	padding: 0 ;
	margin: 0;
}
ul.submenu.languageselection li
{
	text-align: center;
	line-height: 18px;
}
.languageselection a
{
	display: block;
	padding: 0.5em;
	width: 3em;
}
.languageselection li
{
	xoverflow: hidden;
	padding: 0;
}
a[name=currentlanguage] img,
.languageselection li a img
{
	height: 18px;
	width: 24px;
}
.languageselection a img
{
	filter: gray;
	filter: grayscale(1);
	-webkit-filter: grayscale(1);
}
.languageselection li:hover a img
{
	filter: none;
	filter: grayscale(0);
	-webkit-filter: grayscale(0);
}

/******************************************************** MOBILE MENU */
@media only screen and (max-width: 992px)
{
	.mobilemenu
	{
		display: inline-block;
		padding: 0 10px;
		margin: 0;
		vertical-align: middle;
		width: 50px;
		height: 50px;
		line-height: 50px;
	}
	.mobilemenu .fa
	{
		line-height: 50px;
	}
	#topmenu
	{
		height: auto;
		border-top: 1px solid #fff;
	}
	#topmenu nav
	{
		opacity: 0;
		transition: opacity 0.5s;
		display: none;
	}
	.contextmenu
	{
		display: none;
	}
	ul.menu a
	{
		padding: 0.5rem 0;
	}
	#topmenu.active nav,
	#topmenu li
	{
		opacity: 1;
		display: block;
	}
	#topmenu.active
	{
		z-index: 5000;
		background-color: White;
		padding-bottom: 15px;
	}
	ul.menu > li
	{
		padding: 0 0 0 1rem;
	}
	#topmenu li
	{
		text-align: left;
		line-height: 30px !important;
	}
	#topmenu li.cloned,
	#topmenu li.cloned > a
	{
		background-color: #676767;
		color: White;
	}
	#topmenu li ul li
	{
		text-indent: 30px;
	}
	#topmenu li ul li ul li
	{
		text-indent: 45px;
	}
	#topmenu li ~ li
	{
		border-top: 1px solid #DCDBE4;
	}
	#topmenu li ul
	{
		border-top: 1px solid #DCDBE4;
	}
	.mainmenu-close
	{
		float: right;
	}
	.contextmenu ul.menu li:hover,
	.contextmenu ul.menu li.current,
	.contextmenu ul.menu li.ancestor,
	.contextmenu ul.menu li.active
	{
		color:#0A7943;
		opacity: 1;
		-moz-opacity: 1;
		-o-opacity: 1;
		-webkit-opacity: 1;
	}
	.submenu.languageselection,
	.submenu.languageselection a
	{
		line-height: 30px;
		width: 100%;
	}
	ul.menu li > .submenu.languageselection
	{
		padding: 10px 0 0 0;
	}
	.submenu.languageselection li
	{
		width: 100%;
		text-align: center;
	}
	
	.mobileopener
	{
		width: 30px;
		height: 30px;
		line-height: 30px;
		text-align: center;
		padding-right: 10px;
	}
	ul.menu li > .submenu
	{
		display: none;
	}
	ul.menu li.active > .submenu
	{
		display: block;
	}
	ul.menu li.active .mobileopener.fa-chevron-right:before
	{
		content: '\f078';
	}
	.submenu .row > div
	{
		padding: 0;
		float: none;
	}
	
}
/*********************************************************************/

/************************************************************ ZOEKEN */
.searchcontainer 
{
	color: White;
	line-height: 50px;
}
.searchcontainer label
{
	text-transform: uppercase;
}
.searchcontainer label,
.searchcontainer input,
.searchcontainer button
{
	display: inline-block;
	height: 30px;
	line-height: 30px;
	margin: 10px 0;
	vertical-align: middle;
}
.searchcontainer input[type='search']
{
	border: none;
	width: calc(100% - 130px);
	padding: 0 10px;
	color: #262a2d;
	-webkit-appearance:none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
.searchcontainer button
{
	border-color: White;
	background-color: White;
	color: #676767;
	padding: 0 1rem;
}
.searchcontainer button:hover
{
	border-color: White;
	background-color: White;
	color: #262a2d;
}
.searchcontainer button .fa
{
	line-height: 30px;
}

/*********************************************************************/

/******************************************************** BREADCRUMB */
.breadcrumb
{
	margin-bottom: 1rem;
	font-size: 0.95rem;
	text-transform: lowercase;
	text-align: right;
}
.breadcrumb ol,
.breadcrumb ol li
{
	padding: 0;
	margin: 0;
	display: inline-block;
}
.breadcrumb ol li
{
	list-style-type: none;
	list-style-position: inside;
}
.breadcrumb ol li a
{
	text-decoration: none;
}
.breadcrumb ol li:last-of-type a
{
	color: #262a2d;
}
/*********************************************************************/

/************************************************** MAIN CONTENT AREA */
main
{
	background-color: #ffffff;
	color: #000;
	margin: 1.5rem 0;
	padding-top: 15px;
	padding-bottom: 15px;
}
/*********************************************************************/

/************************************************************ FOOTER */
footer
{
	background-color: #676767;
}
footer *
{
	color: White;
}
footer a
{
	text-decoration:none;
	color: White;
}
footer a:hover
{
	color: #f5e032;
}
footer h1
{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 14px;
	text-transform: uppercase;
	text-shadow: none;
}
footer .newsletter
{
	background-color: #E41318;
	padding: 13px 13px 20px 30px;
	line-height: 34px;
	vertical-align: middle;
}
footer .newsletter h1
{
	display: inline-block;
	margin: 0;
}

footer .newsletter input.input-text {
	max-width: 340px;
	width: 100%;
	height: 34px;
	border: none;
	margin: 0 15px;
}
.footerlinks
{
	padding: 35px 0px 30px;
}
footer li
{
	padding: 5px 30px 5px 0;
}
footer ul.bullets li,
footer li.bullet
{
	padding: 5px 0 5px 15px;
	background: url('/_clientfiles/Layout/sprite.png') no-repeat scroll -247px -234px;
	transition: 0.2s;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
}
footer ul.bullets li:hover,
footer li.bullet:hover
{
	background-position: -247px -266px;
}
footer li.address,
footer li.phone,
footer li.email
{
	background: url('/_clientfiles/Layout/sprite.png') no-repeat scroll -230px -544px;
	padding: 4px 0 4px 22px;
	line-height: 25px;
}
footer li.phone
{
	background-position: -230px -476px;
}
footer li.phone a
{
	color: inherit;
	text-decoration: none;
}
footer li.email
{
	background-position: -230px -512px;
}
@media only screen and (max-width: 767px)
{
	footer .newsletter
	{
		padding: 15px;
	}
	footer .newsletter input.input-text
	{
		width: auto
	}
	footer [role=navigation]
	{
		margin-bottom: 1.5rem;
	}
	footer li,
	footer ul.bullets li,
	footer li.bullet
	{
		padding: 5px 0 5px 22px;
	}
}

@media only screen and (max-width: 480px)
{
	footer .newsletter
	{
		padding-top: 10px;
	}
	footer .newsletter input.input-text
	{
		margin: .5em 0;
		width: 100%;
		max-width: 100%;
	}
}
@media only screen and (min-width: 481px)
{
	footer li.phone a
	{
		color: inherit;
		cursor: 
	}
}
/*********************************************************************/

/************************************************ DROP-DOWN / POP-UP */
.activemenu
{
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
}
/*********************************************************************/

/************************************************ LOGINFORM (overrides) */
.fancyboxlogin
{
	border: 1px solid #676767;
	border-radius: 0 0 15px 15px;
	background-color: #f8f4ef;
	color: #262a2d;
	
	overflow: hidden;
	
	/* Prevent background color leak outs */
	-webkit-background-clip: padding-box; 
	-moz-background-clip: padding; 
	background-clip: padding-box;
}
.fancyboxlogin .fancybox-skin,
.fancyboxlogin .fancybox-outer,
.fancyboxlogin .fancybox-inner
{
	padding: 0 !important;
	border-radius: 0 0 15px 15px !important;
}
.fancyboxlogin .fancybox-skin
{
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
}
.pop-title
{
	margin: -10px -10px 5px -10px;
	height: 3rem;
	line-height: 3rem;
	color: White;
	background-color: #676767;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.5rem;
}
.pop-title .fa
{
}
.pop-title .close
{
	display: block;
	text-align: right;
	float: right;
	margin: 0.25em 0.5em 0 0;
}
#fancylogin
{
	padding: 10px;
	text-align: left;
	width: 100%;
	height: 100%;
	border: 0;
	font-size: 0.9em;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
}
#fancylogin .pop-title
{
}
#fancylogin input
{
	width:100%;
	line-height: normal;
	margin-bottom: .5em;
}
#fancylogin button[type='submit']
{
	margin-bottom: .5em;
	width:100%;
}
#fancylogin *[role=button]
{
	margin: .5em 0;
	font-size: .8em;
	width: 48%;
}
#fancylogin *[role=button] + *[role=button]
{
	float: right;
}
#fancylogin a:hover
{
	text-decoration: underline;
}
/*********************************************************************/


/******************************************* EMBED RESPONSIVE IMAGES */
.embed-responsive  img
{
	width: 100%;
}

/*********************************************************************/


/************************************************* WEBGROUP / ARTICLE */
.block
{
	display: block;
	position: relative;
	margin-bottom: 1rem;
	text-align: center;
	border: 1px solid #eee;
}
.block .title
{
	display: block;
	font-size: 1.2rem;
	line-height: 1.25em;
	height: 3.75em;
	max-width: 100%;
	overflow: hidden;
	margin-top: 0.5rem;
}
.block button
{
	width: 100%; 
}
@media only screen and (max-width: 767px)
{
	.block .title
	{
		font-size: 1.1rem;
	}
}
@media only screen and (max-width: 480px)
{
	.block .title
	{
		font-size: 1rem;
	}
}

/*********************************************************************/

/********************************************************* WEBGROUPS */
.webgroupcontent
{
	font-size: 1.1rem;
	clear: both;
	margin-bottom: 15px;
}
.webgroupcontent h1
{
	margin-bottom: 1rem;
}
.webgroupcontent img
{
	width: 100%;
	margin-bottom: 15px;
}
@media only screen and (max-width: 767px)
{
	.webgroupcontent
	{
		font-size: 1rem;
	}
	.webgroupcontent,
	.webgroupcontent img
	{
		margin-bottom: 10px;
	}
}
@media only screen and (max-width: 480px)
{
	.webgroupcontent,
	.webgroupcontent img
	{
		margin-bottom: 5px;
	}
}
/*********************************************************************/

/*********************************************************** ARTICLES */
.sorting,
.AllPages
{
	margin-bottom: 1rem;
}
.AllPages a
{
	display: inline-block;
	background-color: #ffffff;
	padding: 0.5em 1em;
	text-decoration: none;
	margin-right: 0.5em;
	vertical-align: middle;
}
.AllPages a.currentartpage
{
	color: #ffffff;
	background-color: #000;
}
.artdetailsimg
{
	margin-bottom: 20px;
}
#thumbscontainer
{
	margin: 0 -7px;
}
.thumb
{
	display: inline-block;
	width: calc(50% - 15px);
	margin: 15px 7px 0 7px;
	padding-top: calc(50% - 7.5px);
	position: relative;
}
.thumb a
{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	height: 100%;
	width: 100%;
	overflow: hidden;
}
.thumb a img
{
	max-width: none;
	height: 100%;
}

@media only screen and (max-width: 767px)
{
	.artdetailsimg
	{
		margin-bottom: 20px;
	}
}
@media only screen and (max-width: 480px)
{
	.artdetailsimg
	{
		margin-bottom: 10px;
	}
}
.imgzoom
{
	cursor: -webkit-zoom-in;
}
.price
{
	display: inline-block;
	position: absolute;
	bottom: 5px;
	right: 5px;
	width: 64px;
	height: 64px;
	line-height: 64px;
	border-radius: 50%;
	background-color: #e41318;
	color: White;
	font-size: 1.1rem;
	font-weight: bold;
	text-align: center;
	-ms-transform: rotate(9deg);
	-webkit-transform: rotate(9deg);
	transform: rotate(9deg);
}
.price .sup
{
	position: relative;
	top: -0.5em;
	
	font-weight: normal;
	font-size: 60%;
}
.price-place
{
	position: absolute;
	right: 0px;
	top: 0px;
}
.price-place .textfrom,
.price-place .textpiece
{
	position: absolute;
	top: -15px;
	left: 0;
	right:0;
	font-size: .7rem;
	text-align: center;
	font-weight: normal;
	text-transform: lowercase;
}
.price-place .price
{
	top: -10px;
}
.price-place .textpiece
{
	top: auto;
	bottom: -15px;
}
.artdesc thead th
{
	background-color: #0A7943;
	border-color: #0A7943;
	color: White;
	font-size: 16px;
	font-weight: bold;
	padding: 17px 20px 14px;
	text-decoration: none;
	text-transform: uppercase;
}
.artdesc thead th + td
{
	width: 100%;
}
.artdesc tbody
{
	background-color: White;
}
.artdesc tbody td
{
	padding: 17px 20px 14px;
}
.artdetailstexts
{
	position: relative;
}
.artdetailstexts h1
{
	padding-right: 60px;
}
.artdetailstexts .fieldsvals .fieldname,
.artdetailstexts .fieldsvals .fieldval
{
	line-height: 30px;
}
td[valign=middle] .login
{
	margin-top: 6px;
}
#orderAmount input,
#orderButton button
{
	/*max-width: 5em;*/
	width: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px)
{
	.lastviewed .col-md-4:first-of-type
	{
		display: none;
	}
}
@media only screen and (min-width: 768px) and (max-width: 991px)
{
	.lastviewed .col-sm-4:first-of-type
	{
		display: none;
	}
}
@media only screen and (min-width: 481px) and (max-width: 767px)
{
	.lastviewed .col-xs-4:first-of-type
	{
		display: none;
	}
}
/*********************************************************************/


/********************************************************  ORDERPATH  */
.orderpath
{
}
.orderpathdivider {
	display: none;
}
.orderpathfuture {
	display: inline;
}
.orderpathstep 
{
	display: inline-block;
	position: relative;
	padding: 0 1rem;
	width: 25%;
	height: 30px;
	line-height: 30px;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: center;
	text-transform: uppercase;
	background-color: #676767;
	color: White;
}
.orderpathstep a
{
	color: White;
}
.orderpathstep ~ .orderpathstep:before,
.orderpathfuture .orderpathstep:first-of-type:before
{
	position: absolute;
	z-index: 50;
	top: 0;
	left: -20px;
	font-family: 'FontAwesome';
	content: '\f054';
	font-size: 3.0rem;
	height: 30px;
	line-height: 30px;
	padding-top: 2px;
	color: #f8f4ef;
}
.orderpathstepnr
{
	display: none;
}
.orderpathactivestep,
.orderpathpassedstep
{
	background-color: #262a2d;
}
.orderpathactivestep
{
	font-weight: bold;
}
@media (max-width: 767px) {
	.orderpathstep {
		width: 100%;
		border-radius: 0;
		border: none;
	}
	.orderpathstep + .orderpathfuturestep,
	.orderpathpassedstep + .orderpathpassedstep
	{
		border-top: 1px solid #ccc;
	}
	.orderpathfuture {
		display: none;
	}
	.orderpathactivestep {
		border-radius: 0 0 5px 0;
	}
	.orderpathactivestep {
		display: block; 
		border-top: 1px solid #ccc;
	}
	.orderpathdivider { display: none; }
	.orderpathbutton {
		margin-left: 0;
		margin-bottom: 1em;
		min-width: 12em;
	}
	.orderpathstep:after
	{
		position: absolute;
		z-index: 50;
		top: 0;
		right: 0;
		font-family: 'FontAwesome';
		content: '\f054';
		font-size: 3.0rem;
		width: 16px;
		height: 30px;
		line-height: 30px;
		padding-top: 2px;
		color: #f8f4ef;
		overflow: hidden;
	}
	.orderpathstep:first-of-type:before,
	.orderpathstep:last-of-type:after
	{
		display: none;
	}
	
}
/*********************************************************************/

/************************************************ ORDERPATH  BUTTONS */
.orderpathbuttons {
	min-height: 30px;
	margin: 1em 0 1em 0;
}


.orderpathbuttons::after {	
	display: block;    
	clear: both;    
	content: "";	
}

.orderpathbutton {
	margin-left: 1em;
}
.orderpathbutton.prev {
	float: left;
	margin-left: 0;
}
.orderpathbutton.next {
	float: right;
}


@media (min-width: 481px) and (max-width: 767px) {
	.orderpathbutton
	{
		margin-right: 0em;
		margin-left: 0em;
	}
	.orderpathbutton.prev
	{
		margin-right: 1em;
	}
	.orderpathbutton.next
	{
		margin-left: 1em;
	}
}
@media (max-width: 480px) {
	.orderpathbuttons
	{
		text-align: center;
	}
	.orderpathbuttons .orderpathbutton
	{
		max-width: 100%;
		width: 240px;
		float: none !important;
		margin: 0 0 1em 0 !important;
	}
}
/*********************************************************************/

/*************************************************** BASKET STICKERS */
.addStickers {
	margin-top: 1rem;
	padding: 0 .5rem;
}
.addStickers input[type='radio'] {
	margin-right: .5rem;
	line-height: 1.5em;
	vertical-align: middle;
}
.addStickers label {
	line-height: 1.5em;
	vertical-align: middle;
}
/*********************************************************************/

/**************************************************** ORDER: PAYMENT */
.paymentmethodchoice
{
	margin: 0 0 10px 0;
	padding: 10px 0;
	position: relative;
	
	border: 1px solid #676767;
	
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
	cursor: pointer;
}
.paymentmethodchoice:hover,
.paymentmethodchoiceactive
{
	border-color: #30cd0e;
}
.paymentmethodchoiceradio
{
	position: relative;
	display:  inline-block;
}
.paymentmethodchoiceradio input
{
	position: absolute;
	top: 5px;
}
.paymentmethodchoice label
{
	display:  inline-block;
	padding-left: 1em;
}
.paymentmethodchoicetitle
{
}
.paymentmethodchoicesubtitle
{
	font-size: smaller;
}
.paymentmethodchoiceimage img
{
	display: none;
	max-width:  100%;
}
.paymentmethodchoicedescription
{
	display: none;
}
.paymentmethodchoicedescription p:last-of-type
{
	margin-bottom: 0;
}
.paymentmethodchoice .order-process-nav
{
	display: none;
}
.paymentmethodchoiceactive .paymentmethodchoicedescription
{
	display: block;	
}
/*********************************************************************/

/*****************************************************  BASKET TABLES */
table.basket th,
table.basket td
{
	padding-left: 10px;
	padding-right: 10px;
	vertical-align: middle !important;
}
table.basket input
{
	max-width: 50px;
}
@media only screen and (min-width: 768px)
{
	table.basket th:first-of-type,
	table.basket td:first-of-type
	{
		padding-left: 19px !important;
	}
}
table.basket thead th:last-of-type,
table.basket td:last-of-type
{
	padding-right: 19px !important;
}
@media only screen and (max-width: 767px)
{
	td[width]
	{
		width: 100%;
	}
	table.basket td.number
	{
		padding-right: 14px !important;
	}
	td.right
	{
		text-align: left;
	}
}
table.baskettotals td
{
	width: 50px;
	padding-right: .5em;
}
@media only screen and (min-width: 768px) and (max-width: 991px)
{
	table.baskettotals.edit td
	{
		padding-right: 17px !important;
	}
}
@media only screen and (min-width: 992px)
{
	table.baskettotals.edit td
	{
		padding-right: 28px !important;
	}
}
table.baskettotals tr.total
{
	border-top: 1px solid #676767;
}
table.baskettotals tr.total:after
{
	content: '+';
	position: relative;
	background-color: #f8f4ef;
	top: -25px;
}
table.baskettotals tr.total.noplus:after
{
	content: '';
	position: relative;
	background-color: #f8f4ef;
	top: 0;
}

table.baskettotals tr.total.sum
{
	border-bottom: 3px double #676767;
}
table.basket .partialtotal,
table.basket .partialtotal td
{
	background: #D3D0CD;
	font-style: italic;
}
/*********************************************************************/

/*************************************************  RESPONSIVE TABLES */
@media only screen and (max-width: 480px)
{
	table.flow-xxs, 
	table.flow-xxs thead, 
	table.flow-xxs tbody, 
	table.flow-xxs tr,
	table.flow-xxs th, 
	table.flow-xxs td
	{
		display: block;
		width: 100%;
		margin:0;
		height: auto;
	}
}
/*********************************************************************/

/************************************************** ERRORS / MESSAGES */
.msgarea
{
	z-index: 10000;
	line-height: 30px;
	margin: 0 auto 2em auto;
	max-width: 720px;
	-webkit-box-shadow: 1px 1px 5px 1px rgba(67,67,67,0.5);
	-moz-box-shadow: 1px 1px 5px 1px rgba(67,67,67,0.5);
	box-shadow: 1px 1px 5px 1px rgba(67,67,67,0.5);
}
.msgarea.slim
{
	max-width: 480px;
}
.msgarea.float
{
	position: fixed;
	top: 25%;
	left: 10%;
	right: 10%;
	z-index: 5000;
}
.msgarea.close {
	line-height: 0;
	margin: 0;
	display: none;
}
.msgbody
{
	background-color: #f5f5f5;
	border: 2px solid black;
	margin: 0;
	padding: .5em 1em;
}
.msgicon
{
	display: inline-block;
	background-color: Transparent;
	width: 30px;
	text-align: center;
	vertical-align: top;
	text-decoration: none;
	color: #fff;
	margin: -2px 1em 0 -2px;
	padding: 0.1em 0 0 0.1em;
}
.msgtitle
{
	display: inline-block;
	vertical-align: top;
	font-weight: bold;
	margin-right: 1em;
	margin-left: -5px;
}
.msgbody p
{
	margin: 0;
}
.msgbody p > a
{
	text-transform: lowercase;
}
.msgbody p button,
.msgbody p *[role='button'],
.msgbody p input[type='button'],
.msgbody p input[type='submit']
{
	margin-bottom: .5em;
}

.msgarea.error .msgbody
{
	border-color: #e41318;
}
.msgarea.error .msgicon
{
	color: #e41318;
}
.msgarea.warning .msgbody
{
	border-color: #ffcc00;
}
.msgarea.warning .msgicon
{
	color: #ffcc00;
}
.msgarea.info .msgbody
{
	border-color: #0A7943;
}
.msgarea.info .msgicon
{
	color: #0A7943;
}
.msgarea.notify .msgbody
{
	border-color: #30cd0e;
}
.msgarea.notify .msgicon
{
	color: #30cd0e;
}
.msgarea.bar
{
	margin-bottom: 0;
}
.msgarea.bar .msgicon
{
	color: #f6f6f6;
}
.msgarea.bar .msgbody
{
	border-color: #f6f6f6;
	color: White;
	background-color: transparent;
}
/*********************************************************************/

/************************************ FONTAWESOME MOUSEOVER EFFECTS */
html button:hover > .fa-lock:before,
html *[role='button']:hover > .fa-lock:before,
html input[type='button']:hover > .fa-lock:before,
html input[type='submit']:hover > .fa-lock:before {
	content: '\f13e';
}
html button:hover > .fa-unlock:before,
html button:hover > .fa-unlock-alt:before,
html *[role='button']:hover > .fa-unlock:before,
html *[role='button']:hover > .fa-unlock-alt:before,
html input[type='button']:hover > .fa-unlock:before,
html input[type='button']:hover > .fa-unlock-alt:before,
html input[type='submit']:hover > .fa-unlock:before,
html input[type='submit']:hover > .fa-unlock-alt:before {
	content: '\f023';
}
html button:hover > .fa-envelope:before,
html *[role='button']:hover > .fa-envelope:before,
html input[type='button']:hover > .fa-envelope:before,
html input[type='submit']:hover > .fa-envelope:before {
	content: '\f003';
}
html button.favorite .fa-heart,
html button.favorite .fa-heart-o
{
	color: #e85e5e;
}
html button.favorite:hover > .fa-heart:before
{
	content: '\f21e';
}
html button.favorite:hover > .fa-heart-o:before
{
	content: '\f004';
}

/*********************************************************************/


