/* ------------------------------

@website:	Rutten Elektroshop
@author:	Cybox
@date: 		Mei 2016

------------------------------ */

html {

}
html, body {
    width: 100%;

}
body {
	background-color: #fff;
	font-family: 'Ubuntu',Arial, sans-serif;
	font-size: 13px;
	line-height: 16px;
	color: #000;

	background: #f3f3f3;
}
small {
    font-size: 10px;
    color: gray;
}
a {
	/*color: #666;*/
    color: #333;
	text-decoration: none;
}
a:hover {
	color: #0089CA;
}
#product_page .product_content .description a,
div.pagina_content a,
 div.bestelbox span.levertijd.long,
 div#newslist a {
    color: #006d9e
}
#product_page .product_content .description a:hover,
div.pagina_content a:hover,
 div.bestelbox span.levertijd.long:hover,
 div#newslist a:hover {
    color: #0089CA;
}


h1 {
	font-size: 18px;
	margin-bottom: 10px;
    margin-top: -5px;
    /*font-family: 'Dosis', sans-serif;*/
    font-weight: 300;
}
.pageheader h1 {
    padding-top: 5px;
    padding-bottom: 5px;
}
h2 {
	font-size: 14px;
}

ul { margin-left: 10px; }

/* ------------------------------

Helpers / clearers

------------------------------ */

pre {
    clear: both;
}

.clear {
	clear: both;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

html[xmlns] .clearfix {
	display: block;
}

* html .clearfix {
	height: 1%;
}

/** bovenkant rounded **/
.rounded {
    border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius:8px 8px 0 0;
    behavior: url(/css/PIE.php);
}
/** linksboven rechtsonder rounded **/
.rounded2 {
    border-radius: 8px 0px 8px 0;
    -moz-border-radius: 8px 0px 8px 0;
    -webkit-border-radius:8px 0px 8px 0;
    behavior: url(/css/PIE.php);
}
/** onderkant rounded **/
.rounded3 {
    border-radius: 0px 0px 8px 8px;
    -moz-border-radius: 0px 0px 8px 8px;
    -webkit-border-radius:0px 0px 8px 8px;
    behavior: url(/css/PIE.php);
}

/** rechts rounded **/
.rounded4 {
    border-radius: 0px 8px 8px 0px;
    -moz-border-radius: 0px 8px 8px 0px;
    -webkit-border-radius:0px 8px 8px 0px;
    behavior: url(/css/PIE.php);
}
/** links rounded **/
.rounded5 {
    border-radius: 8px 0px 0px 8px;
    -moz-border-radius:  8px 0px 0px 8px;
    -webkit-border-radius: 8px 0px 0px 8px;
    behavior: url(/css/PIE.php);
}

img.rounded {
    border-radius: 10px;
    -moz-border-radius:  10px;
    -webkit-border-radius: 10px;
    behavior: url(/css/PIE.php);

}


.shadow {
    -moz-box-shadow:    2px 2px 3px 0px #ccc;
    -webkit-box-shadow: 2px 2px 3px 0px #ccc;
    box-shadow:         2px 2px 3px 0px #ccc;
    behavior: url(/css/PIE.php);
}

.extrashadow {
    -moz-box-shadow:    2px 2px 5px 0px #000;
    -webkit-box-shadow: 2px 2px 5px 0px #000;
    box-shadow:         2px 2px 5px 0px #000;
    behavior: url(/css/PIE.php);
}
.shadow.blue {
    -moz-box-shadow:    2px 2px 5px 0px #0089CA;
    -webkit-box-shadow: 2px 2px 5px 0px #0089CA;
    box-shadow:         2px 2px 5px 0px #0089CA;
    behavior: url(/css/PIE.php);
}

/* ------------------------------

Layout

------------------------------ */

#wrapper {
	margin: 0 auto;
	margin-top:0px;
	position: relative;

    box-sizing: border-box;

    max-width: 100%;
    width: 1280px;
    padding: 15px 30px 30px 30px;
    background: #fff;
}

#header {
	width: 100%;
	height: 130px;
	margin: 0 auto;
	margin-bottom: 10px;
	background: #f3f3f3;
	position: relative;
    padding: 8px 0;



    box-sizing: border-box;
    max-width: 100%;
    width: 1280px;
    padding: 10px 30px;
    background: #fff;

    margin-bottom: 0;

}


#header > .content {
   /* width: 960px;

    max-width: 96%;
    width: 1280px;
    position: relative;
    margin: 0px auto;
    */
    width: 100%;
}
#printheader {
    display: none;
}

#header #menu,#header #menu ul li {
	float: left;
    white-space: nowrap;
}

/* Search */
#header #search {
    float: left;
    width: 180px;
    padding: 0;
    width: 240px;
}
#header #menu {
    float: left;
    width: 315px;

    padding: 0;
}
#menu .content {
/*    background: #efefef; */
    height: 50px;
    padding: 2px 0px 2px 7px;
    position: relative;
}
#menu .title {
    font-weight: bold;
    color:black;
    /*background: #0089CA; */
    padding: 5px 7px 5px 7px;
    position: relative;
}
#menu ul {
   width: 150px;
   float: left;
   margin-left: 0;

}
#menu ul li {
    margin-right: 5px;
    float: left; clear: both;
}
#header #search {

    position: absolute;
    left: 320px;
    top: 50%;
}
#header #search input#sq {

    padding: 5px 5px;
    margin-bottom: 5px;
    background: white;


        margin: 0;


    font-family: "Ubuntu", arial, sans-serif;
    font-size: 18px;

    padding: 4px 8px;
    border: 1px solid #d5d5d5;
    border-radius: 3px;
    background: #fff;
    line-height: 1.4;
    width: 500px;
    max-width: calc(100vw - 648px);
    height: 38px;
    -webkit-appearance: none;
}
#searchbutton {
    height: 29px;
    width: 27px;


    height: 32px; width: 32px;
    border: 4px solid #fff;
    min-width: 0;


    background-color: #ccc;
    background-image: url(/images/icons/searchn.png);
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: 0 0;

    position: absolute;
    right: -42px;
    top: 50%; margin-top: -16px;
    padding: 0;
    -webkit-appearance: none;
}
#searchbutton:hover {
    background-color: #0089CA;
    /*background-color: #efefef;
    background-position: 4px 4px;*/
}
#search .content {
  /*  background: #efefef; */
  position: relative;
  float: left;

}
#header #search #clearsearch {
        display: block;
        position: absolute;
        width: 14px; height:14px;
        border: 8px solid white;

        background-image: url(/images/icons/clear2.png);
        background-size: 14px 14px;
        background-repeat: no-repeat;
        background-position: center center;
        top:8px; right: 8px;
        opacity: 0;
        transition: opacity 50ms ease 0ms;
        pointer-events: none;
        cursor: pointer;
        background-color: #ccc;
    }

body.scroll #header #search #clearsearch {
    top: 3px;
}
#header #search #clearsearch:hover {
    background-color: #0089CA
}
#header #search.hasinput #clearsearch {
    opacity: 1;
    pointer-events: all;
}


#content .content {
    min-height: 457px;
    background: #fff;

}
.content.padded {
    padding: 10px;
    min-height: 447px!important;
}
#search .title {
   font-weight: bold;
    color:black;
    /*background: #0089CA; */
    padding: 5px;
    position: relative;
    display: none;
}
.searchmessage {
    width:240px;
    float: left;
}

#search .content {
}
#header #logo {
	float: left;
/*	background-image: url('../images/logo.png');
	background-repeat: no-repeat;
	background-position: 5px 0; */
	width: 250px;
	height: 72px;
		background-image: url('/images/logo@2x.png');
		background-size: 100% auto;
		background-repeat: no-repeat;


    margin-left: 5px;
    position: relative;
   /* cursor: pointer; */

   transition: width 150ms ease;
}
#header #logo img {
    width: 100%;

}
#header #logo a{
    display: block;
    position: absolute;
    width: 100%; height: 100%;
}

/* basket */
#header #basket {
    float: left;

    padding: 0;
    cursor: pointer;

    color: white;
    background: #0089CA;

    float: right;
    border-radius: 4px;

    background-image: url(/images/icons/cartn3large.png);
    background-size: 24px 24px;
    background-position: 16px center;
    background-repeat: no-repeat;

    box-sizing: border-box;
    width: 200px;
    padding-left: 52px;
    height: 48px;
    position: relative;

    transition: background 150ms ease;

    position: absolute;
    right: 30px;
    top: 50%;

}
#header #basket.added {
    background-color: #00C72F;
}
#header #basket .summary {
    font-size: 16px;
}
#header #basket:hover {
    background-color: #009be3;
}
#header #basket .summary span {
    display: inline-block;
}
#header #basket .summary span.arts {
    background: white;
    border-radius: 100%;
    color: #0089CA;
    width: 24px;
    height: 24px;

    text-align: center;
    display: block;
    line-height: 24px;

    font-weight: bold;
    display: inline-block;
    margin-right: 10px;


    width: 32px; height: 32px;
    line-height: 32px;
    width: 30px; height: 30px;
    line-height: 30px;
}

body.scroll #header #basket .summary {
    line-height: 32px;
}

#header #basket.added .summary span.arts {
    color: #00C72F
}
#header #basket .summary span.amount {
    font-size: 18px;
}
#basket .summary {
  /*  background: #efefef; */
    /*
    padding: 0;
    position: absolute;
    left: 54px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    */
    line-height: 46px;
}
#basket .title {
    font-weight: bold;
    color:#0089CA;
  /*  background: #0089CA; */
    padding: 5px 7px;
    position: relative;
    display: none;
}

#basket .title a:hover {
   color: white!important;
}
#basket .linkie {
    color: inherit;
    display: block;
    font-size: 11px;
    margin-top: -28px;
    text-align: right;
    display: none;
}
/* ------------------------------

Category listing menu

------------------------------ */

#categories_list {
    font-size: 16px;
	width: 260px;
	float: left;
    clear: left;
	background: #efefef;
	position: relative;
	margin-right: 20px;
    margin-top: 4px;

}
#categories_list ul {
    margin-left: 0;
}
#categories_list ul li {
    /*border-bottom: 1px solid #D5D5D5;
    border-top: 1px solid #D5D5D5;
    margin-top: -1px;*/
}

#categories_list_title {
    padding: 12px;
    background: #ddd;
    color: #666;
    border: none;
   /* font-weight: bold;*/
    box-sizing: border-box;
    width: 260px;
    font-size: 18px;
    position: relative;
	float: left;
    clear: left;

    display: none;
}
#categories_list >ul >li> a {
    padding: 10px 0 10px 10px;
    display: block;
    height: 100%;
    /*
    border-bottom: 1px solid rgba(255,255,255,.5);
    */
}
#categories_list ul li a.highlight {
    color: #0089CA;
}
#categories_list ul li a.highlight:hover {

}


#categories_list ul li ul {
	display: none;
}
#categories_list ul li ul.active {
    display: block;
}
#categories_list > ul > li {
    border: 1px solid #efefef;
}
#categories_list > ul > li:hover {
    border: 1px solid #0089CA;

}
#categories_list > ul > li.active {

    border: 1px solid #0089CA

}
#categories_list > ul > li.active > a,
#categories_list > ul> li:hover > a,
#categories_list > ul> li > a:hover{
    color: #0089CA;
    /*font-weight: bold;*/
    background: white;


    background: #0089CA;
    color: white;

}
#categories_list * {
     -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* Internet Explorer/Edge */
  user-select: none;
}
#categories_list > ul > li.active > a {
   /* padding-bottom: 6px;*/
}
#categories_list ul li ul.active {
	display: block;
    padding-top: 6px;
    background: #fff;
}
#categories_list ul li ul.active li:last-child {
    padding-bottom: 6px;

}
#categories_list ul li ul li{
    padding-left: 10px;
    padding-right: 8px;
   /* margin-top: -1px;*/
    /*white-space: nowrap;*/
    overflow: hidden;
    font-size: 14px;
    border: none;
}


#categories_list ul li ul li a{
    padding: 2px 5px 5px 2px;

    display: block;
    float: left; clear: both;
    padding: 5px;
    border-radius: 2px;
    line-height: 1;
    margin-bottom: 3px;
}
#categories_list ul li ul li.active a {
   /* color: #0089CA;*/
    background: #0089CA;
    color: white;
}

#categories_list ul li ul li a:hover {
    /* color: #0089CA;*/
    background: #009be3;
    color: white;
}



/* ------------------------------

Content holder

------------------------------ */

#content {
	width: 680px;
	float: left;
	background: #fff;
	min-height: 500px;
	position: relative;
    /*margin-top: -36px;*/

    width: calc(100% - 280px);
    padding-left: 10px;
    box-sizing: border-box;

}

#category_info .smessage {
    display: block;
    width: 100%; float: left;
    margin-bottom: 12px;
}

/* ------------------------------

Content > Category page (hoofdcategorie of producten in categorie)

------------------------------ */
#loading {
    width: 700px;
    margin-top: 70px;
    float: left;
    margin: 4em 0;
    text-align: center;
    display: none;
    width: 100%;
}

#content h1 {
    margin-left: 0px;
    font-size: 36px;


    color: #0089CA;
    line-height: 1;
    margin-bottom: 10px;
}
div#content div.aanbiedingen h2 {

}
#content h2 {

    font-weight: 400;
}
div#content div.aanbiedingen h2 {
    margin-left: inherit; font-weight: normal;
}

#category_products {
  /*min-height: 750px;*/
}
#category_products.relatedproducts {
    min-height: 0;
}

#category_products.shown{
    display: block;
}
#category_products.shown.relatedproducts:not(.tile) {
    border-top: 1px solid #d5d5d5;
}
#category_products {

    margin-left: 0px;
    width: 100%;
    float: left;
}
#category_products.categories {
}
#category_products .item {
	background: #fff;
	padding: 10px 5px;
	height: 91px;
	position: relative;
    border-bottom: 1px solid #D5D5D5;
    width: 100%; float: left;
}
#category_products .item .calcprijs,#category_products .item .viewcount,
#category_products .item .sortvoorraad {
   display: none;
}
#category_products .item h2{
   /* overflow: hidden; */
    font-size: 16px;
    margin-left: 0;
    font-weight: 400;
    height: 18px;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
}
#category_products .item div.ct {
    float: left;
    /*outline: 1px solid blue;*/
    width: calc(100% - 365px);
}
#category_products.tile .item div.ct {
    width: 100%;
}

#category_products.tile .item h2 {
    white-space: normal;
    height: 34px;
}
#category_products.tile:not(.categories) .item h2 {
    font-size: 14px;
}


#category_products .item .categorie {
    display: none;
}
#category_products .item h3.artcode{
	font-size: 11px;
    color: #666;

}
#category_products .item .description {

    width: 100%;
    float: left;
    position: relative;
    max-height: 66px;
    overflow: hidden;
    box-sizing: border-box;
    padding-right: 8px;

}
#category_products .item .description .leesmeer {
    white-space: nowrap;
    display:block;
    display: none;
}
#category_products .item .thumb {
	float: left;
	height: 90px;
    width: 100px;
	margin-right: 5px;
    text-align: center;

}
#category_products .item .thumb img {
    max-width: 80px;
    margin-top: 4px;
}
#category_products .item .thumb2 {
	display: none;
}
#category_products .item .thumb2.active {
    display: block;
}
#category_products .item .specs {
	float: right;
	width: 230px;
	margin-left: 10px;
    height: 82px;
    height: 70px;
    padding-right: 20px;
    padding-top: 2px;
}
#category_products.tile .item .specs {
    height: 38px;
    padding-top: 0;

}
	#category_products .item .specs div {
	}
	#category_products .item .specs .priceprice {
		font-size: 20px;
		font-weight: 300;
		color: #0089CA;
		white-space: nowrap;
	}
    #category_products .item .specs .add {
        margin-top:6px;
        display: none;
    }
    .price > div {
        /*clear: both;*/
    }
    .price div span {
        float: left;
        margin-right: 5px;
    }
    .price .van {
        margin-bottom: 0;
        font-size: 13px;
        position: relative;
        float: left;
        margin-right: 5px;
    }


	#category_products .item .specs .eta {
		color: #666;
        line-height: 1.4;
        margin-top: 8px;
	}
	#category_products.tile .item .specs .eta {
        margin-top: 4px;
    }
	#category_products .item .specs .eta span {
        display: block;
        white-space: nowrap;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
#category_products .andersom {
	background: #efefef;
	border-top: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
}

#category_info {
    padding: 10px;
    position: relative;
    min-height: 5px;
    padding: 0px 5px 10px 11px;
    padding: 0 0 10px 0;
}
/* tile view */
#category_products.tile {
    width: 700px;
    border-left: none!important;
    float: left; clear: both;
    margin-bottom: 15px;

    width: 100%;
}
#category_products.tile  .item	{
		width: 23.5%!important;
        height: 270px;
        height: 240px;
        float: left;
        overflow: hidden;
        margin: 0px;
        margin: 15px 16px 0px 0px;

        margin: 1%;
        box-sizing: border-box;

        position: relative;

        padding: 10px 10px!important;
        border: 1px solid transparent;
        /*border-bottom: 1px solid #d8d8d8;*/
        border-radius: 3px;
        /*-moz-box-shadow:    2px 2px 3px 0px #ccc;
        -webkit-box-shadow: 2px 2px 3px 0px #ccc;
        box-shadow:         2px 2px 3px 0px #ccc;
        behavior: url(/css/PIE.php);*/
	}

	#category_products.tile  .item:hover {
        border: 1px solid rgba(0, 138, 202, 0.67);
    }
    #category_products.tile  .item:hover h2 a {
        color: #0089CA;
    }
	#category_products.tile  .item:nth-child(4n+1){

        margin-left: 0;
    }
    #category_products.tile  .item:nth-child(4n+4) {

        margin-right: 0;
    }


    #category_products.categories.tile .item {
        height: 180px;
    }

    .categories.tile .productcount {
        font-size: 11px;
        text-align: center;
        display: block;
        margin: 0px auto;
    }

    .item .aanbieding {
        position: absolute;
        bottom: -6px;
        left: 8px;
        color: #0089CA;
        font-family: 'Dosis', sans-serif;
        font-size: 34px;
        width: 155px;
        height: 40px;
        background: url(/images/icons/aanbieding.png) top left no-repeat;
        padding-top: 8px;
        padding-left: 2px;
        z-index: 3;

    }
    .tile .item .aanbieding {
        left: inherit; bottom: inherit;
        top: 8px; right: 8px;
    }

    .tile .item h2 {
        font-size: 12px;
        overflow: hidden;
        word-wrap: break-word;
    }
    .tile .item:hover {
        cursor: pointer;
    }
    .tile .item h2 a {
        word-wrap: break-word;
    }
    .tile .item.active h2 a {
        color: #0089CA;
    }
    .categories.tile .item h2 {
        text-align: center;
    }
	.tile  .item .thumb {
		float: none;
		width: 180px;
		text-align: center;
		height: 100px;
		overflow: hidden;
		display: none;
	}
	.tile  .item .thumb2 {
		float: none;
		width: 190px;
		text-align: center;
		height: 105px;
		width: 100%;
		/*outline:1px solid red;*/
        margin-bottom: 5px;
		overflow: hidden;
        display:block!important;
        position: relative;
	}
	.tile  .item .thumb2 img {
        position: absolute;
        top: 50%; left: 50%;
        transform: translate(-50%,-50%);
    }

    .tile .item a.button {
        width: 100%;
        box-sizing: border-box;

    }
	.tile  .item .thumb img.product-img {
		margin: 0 auto;

	}
	#category_products.tile  .item .specs {
		position: absolute;
		bottom: 10px;
		left: 0;
		margin-left: 0;

        width: 100%;
        /*outline: 1px solid red;*/
        padding: 0 10px;
        box-sizing: border-box;
	}
    .tile .item .price > div {
        clear: none!important;
    }
    .tile .item .price > div > div {
        margin-right: 5px;
    }
    .tile  .item .specs .price {
    }
	.tile  .item h2 {
		padding-top: 10px;
        display: block;
        height: 34px;
		clear: both;
	}
	.tile  .item .description, .tile  .item .specs .eta .levertijd {
		display: none!important;
	}
	.tile  .andersom {
		border-top: 0px!important; border-bottom: 0px!important;
	}
	.tile  .add {
	   margin-top: 7px;
		width: 100%;
	}

.category_products_controls {
	padding: 10px 0;
/*	background: #efefef; */
	border-top: 1px solid #d5d5d5;
    height: auto;
    width: 100%; box-sizing: border-box;
    float: left;
    position: relative;
}
.paginefooter .category_products_controls {

}
.category_products_controls * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /*cursor: default;*/
}

#category_footer {
	padding: 10px 8px;
	background: #efefef;
	border: 1px solid #d5d5d5;
    height: auto;
    width: 100%;
    float: left;
    clear: both;
}
.category_products_controls .pricerange {
    float: left;
    margin: 0;
    width:  33.33%;
    height: 50px;
}
.category_products_controls .ppp {
    width:  33.33%;
    float: left;

    position: relative;
}

.category_products_controls .ppp ul {

}
.category_products_controls .ppp ul.active {

}
.category_products_controls .subfilter {
    width: 100%;
    float: left;
    position: relative;
    height: auto;

}
.category_products_controls .subfilter p {
    width: 200px;
   }
.category_products_controls .subfilter p.smessage {
    margin-top: 8px;
}
.category_products_controls .subfilter ul {
    clear: left;
    float: left;
    width: 100%;
    margin-top: 5px;
    box-sizing: border-box;
    /*outline:1px solid red;*/
    margin-bottom: 1em;
    height: auto;
    padding: 0;
    right: auto;
    position: relative;
    cursor: default;
}
.category_products_controls .subfilter ul li {
    display: block;
    width: auto; float: left;
    padding: 3px 5px;
    padding: 5px;
    background: #ddd;
    margin: 0 5px 5px 0;
    border-radius: 2px;
    line-height: 1;
    cursor: pointer;

}
.category_products_controls .subfilter ul li small {

}
.category_products_controls .subfilter ul li.close {
    display: none;
}
.category_products_controls .subfilter ul.active {
    margin-top: 1px!important;
    padding-bottom: 5px;
    min-width: 140px;
}

.category_products_controls .paginacontainer {
    width: 100%;
    /*outline:1px solid red;*/

    float:left;
    position: relative;

}
.pagefooter .category_products_controls .paginacontainer {
    text-align: center;

}
.category_products_controls .paginacontainer > p{
    width: auto;
    float: none;
    display: block;
    margin-right: 0;
    margin-bottom:  .5em;
}
.category_products_controls .pagina, #category_footer .pagina {
    width: auto;
   /* float: left;
    clear: both;*/
    display: inline-block;
    position: relative;
}
.category_products_controls .pagina span, #category_footer .pagina span {
    display: block;
    float: left;
    font-size: 24px;
    color: #0089CA;
    cursor: pointer;
}
.category_products_controls .pagina .prevpage.hidden {
    color: #999;
    cursor: default;
}
.category_products_controls .pagina .nextpage.hidden{
    color: #999;
    cursor: default;
}

.category_products_controls ul li {

    cursor: pointer;
}




/*
.category_products_controls .pagina span.nextpage, #category_footer .pagina span.nextpage {
    float: right;
    margin-right: 80px;
}
.category_products_controls .pagina ul, #category_footer .pagina ul {
    width: 40px;
    right: auto!important;
    left: 83px;
    padding: 0;
}
.category_products_controls .pagina ul li, #category_footer .pagina ul li {
    font-size: 18px;
    text-align: center;
}
.category_products_controls .pagina p {
    width: 42px;
}
.category_products_controls .pagina ul.active {
    padding-bottom: 5px;
}

.category_products_controls div p {
    margin-right: 8px;
}
*/

.category_products_controls .pricerange select, .pppselect {
    width: 200px;
    display: block;
    float: left;
    height: 26px;
    background: white;
    border: 1px solid #CCCCCC;
    font-family: 'Open Sans',arial,serif;
    font-size: 12px;
    padding: 3px;
    margin-top: 3px;
    cursor: pointer;
}
.pppselect {
    width: 60px;
}

.category_products_controls .weergaveset {

    width: 33%;
    float: right;
}
.category_products_controls .weergave, .category_products_controls .sorteren {
/*    vertical-align: middle;
    float: right;
    clear: right;
    width: 33.333%;
    !*outline: 1px solid blue */
}
.category_products_controls > div p, #category_footer > div p  {

}

.category_products_controls .weergaveset > div {
    width: 100%;
    position: relative;
    float: left;
    margin-bottom: 0;
    /*outline:1px solid orange;*/
}

.category_products_controls div.weergaveset > div > p {
    width: auto;
    text-align: right;
    padding: 3px 0;
    width: 50%;
        line-height: 1;
        display: inline-block;
        height: 16px;

}
.category_products_controls div.weergaveset > div > ul {
    width: 50%;
    box-sizing: border-box;

    line-height: 1;
    /*outline: 1px solid green;*/
}
.category_products_controls div.weergaveset > div > ul.active li:hover {
    color: #0089CA;
}

.category_products_controls .ppp p {
    width: 140px;
}
.category_products_controls > div {
}
.category_products_controls ul, #category_footer ul {
    width: 100%;
    margin-left: 0;
    float: right;
    width: 100px;
    height: 20px;
    overflow: hidden;
    padding: 0px 10px;
    cursor: pointer;
    position: absolute;
    right: 0px;
    z-index: 1;

}
.category_products_controls .weergave ul {
  /*  margin-top: -4px; */
}
.category_products_controls ul li, #category_footer ul li  {
   display: none;
   padding: 3px 0;
   /*height: 16px;*/
   overflow: hidden;
   white-space: nowrap;
    width: auto!important;
}

.category_products_controls ul.active, #category_footer ul.active {
    background: white;

    -moz-box-shadow:    2px 2px 5px 0px #000;
    -webkit-box-shadow: 2px 2px 5px 0px #000;
    box-shadow:         2px 2px 5px 0px #000;
    /*behavior: url(/css/PIE.php);*/

    z-index: 12;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-top: -4px;
    overflow: visible;
    height: auto;
}

.category_products_controls ul.active li, #category_footer ul.active li {
    display: block;
}
.category_products_controls .pagina ul li.active,
.category_products_controls .pagina ul li.active.visible {
    color: #0089CA;
    display: block;
}
.category_products_controls div ul li.active {
    color: #0089CA;
    display: block;
}

.category_products_controls div.subfilter ul li:hover {
    background: #009be3;;
    color: white;
}
.category_products_controls div.subfilter ul li.active {
    background: #0089CA;
    color: white;
}


.category_products_controls div ul li:hover small,
.category_products_controls div ul li.active small {
    color: white;
}

.category_products_controls div ul.disabled li.active {
    color: #000;
    cursor: auto;
}
.category_products_controls div ul.disabled li.active:hover {
    color: #000!important;
}

div.pagefooter .category_products_controls div.subfilter,
div.pagefooter .category_products_controls div.weergaveset,
div.pagefooter .category_products_controls div.sorterenweergave {
    display: none;
}

.subfilter ul.active {
    right:inherit!important;
    left: -10px!important;
    height: auto!important;
    width: auto!important;
}


.category_products_controls li.close {
    position: absolute;
    width: 20px!important;
    top: -4px;
    right: 2px;
    color: #0089CA;
    font-size: 23px;
}

.category_products_controls .weergave  li.tile {
    background: url(/images/icons/view_tile.png);
    background-repeat: no-repeat;
    background-position: left 7px;
    padding-left: 12px;
    line-height: 1.2;
}
.category_products_controls .weergave  li.list {
    display: inline-block;
    background: url(/images/icons/view_list.png);
    background-repeat: no-repeat;
    background-position:  left 7px;
    padding-left: 12px;
    line-height: 1.2;
}

.category_products_controls .weergave  li.list.active {
    display: inline-block;
    background: url(/images/icons/view_list_active.png);
    background-repeat: no-repeat;
    background-position:  left 7px;
    padding-left: 12px;
}
.category_products_controls .weergave  li.list:hover,.category_products_controls .weergave  li.list.active:hover  {
    background: url(/images/icons/view_list_active.png);
    background-repeat: no-repeat;
    background-position: left 7px;

}
.category_products_controls .weergave  li.tile.active {
    display: inline-block;
    background: url(/images/icons/view_tile_active.png);
    background-repeat: no-repeat;
    background-position:  left 7px;
    padding-left: 12px;
}
.category_products_controls .weergave  li.tile:hover,.category_products_controls .weergave  li.tile.active:hover  {
    background: url(/images/icons/view_tile_active.png);
    background-repeat: no-repeat;
    background-position:  left 7px;

}
/*
.category_products_controls .sorteren {
    float: right;
    margin-top: 2px;
    clear: right;
}*/
.category_products_controls .sorteren  span {
}

.category_products_controls .sorteren  li.desc {
    display: block;
    background: url(/images/icons/sort_desc.png);
    background-repeat: no-repeat;
    background-position:  left 7px;
    padding-left: 12px;
}
.category_products_controls .sorteren  li.asc {
    display: block;
    background: url(/images/icons/sort_asc.png);
    background-repeat: no-repeat;
    background-position:  left 7px;
    padding-left: 12px;
}
#category_products .relevance {
    display: none;
}

.category_products_controls div.weergave span, .category_products_controls div.sorteren span {
   /* cursor: pointer;
    margin: 0px 4px 0 0;*/
}

/** nieuwe pager **/
.category_products_controls div.pagina p {
    margin-right: 4px;
    width: 42px;
    float: left;
}
.category_products_controls div.pagina ul {
    height: 22px;
    height: auto;
    width:100%;
    float: left;
    left: inherit;
    right: auto!important;
    position: relative;
    cursor: auto;
    padding: 0;
}
.category_products_controls div.pagina ul  li {
    float: left;
    border: 1px solid #ccc;

    background: white;


    background: #ddd;
    border: 1px solid transparent;
    width: 20px!important;
    height: 20px!important;
    padding: 0!important;
    font-size: 14px;
    margin-right: 3px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    border-radius: 1px;
}
.category_products_controls div.pagina ul li.arrow {
    font-size: 19px;
    line-height: 18px;
}

.category_products_controls div.pagina ul li.visible {
    display: block;
    color: #333;
}
.category_products_controls div.pagina ul li.disabled {
    /*border-color: #ccc;*/
    color: #ccc;
    cursor: default!important;
}
.category_products_controls div.pagina ul li:not(.disabled):hover {

    color: white;
    background-color: #009be3;
    border-color: transparent;
}
.category_products_controls div.pagina ul li.active,.category_products_controls div.pagina ul li.active.visible {
    /*border-color: #0089CA;*/
    color: white;
    background-color: #0089CA;
    border-color: transparent;
}

.category_products_controls .paginacontainer .paginaselect {
    width: 33.33%;
    margin-left:0;
    float: left;
}
.pagefooter .category_products_controls .paginacontainer .paginaselect {
    margin-left: 33.33%;
}
.pagefooter .category_products_controls .paginacontainer .paginaselect.onepage {
    display: none;
}
.category_products_controls .paginacontainer .paginaselect p,
.category_products_controls .subfilter p {

    font-size: 12px;
    line-height: 15px;
    color: #333
}
.category_products_controls .paginacontainer .paginaselect p {
    margin-bottom: 5px;
}
.category_products_controls .paginacontainer .sorterenweergave {
    width:300px;
    float: left;
    position: absolute;
    right: 0; bottom:0;
    /*outline:1px solid purple;*/

}
.category_products_controls .paginacontainer .sorterenweergave > div{
    display: block;
    float: right; width: auto;
    /*outline:1px solid blue;*/
}
.category_products_controls .paginacontainer .sorterenweergave > div.sorteren {
    margin-right: 4px;
}
.category_products_controls .paginacontainer .sorterenweergave > div.weergave {
    margin-right: 8px;
    padding-top:4px;
}
.category_products_controls .paginacontainer .sorterenweergave p {
    display: inline;
    color: #333;
    font-size: 12px;
    line-height: 15px;
}
.category_products_controls .paginacontainer .sorterenweergave span.selectview {
    width: 18px; height: 18px;
    display: block;
    float: left;

    background-color: #bbb;
    background-size: 18px 18px;
    background-position: 0 0;
    background-repeat: no-repeat;

    margin-left: 10px;
    cursor: pointer;
}
.category_products_controls .paginacontainer .sorterenweergave span#viewtile {
    background-image: url(/images/icons/view-tile2.png);
}
.category_products_controls .paginacontainer .sorterenweergave span#viewlist {
    background-image: url(/images/icons/view-list2.png);
}
.category_products_controls .paginacontainer .sorterenweergave span.selectview:hover {
    background-color: #009BE3;
}
.category_products_controls .paginacontainer .sorterenweergave span.selectview.active {
    background-color: #0089CA;
}
.category_products_controls .paginacontainer .sorterenweergave > div.sorteren select {

    padding:  4px;
    border: 1px solid #ddd;
    border-radius: 2px;
    display: inline-block;
    vertical-align: middle;
}




/* ------------------------------

Product page

------------------------------ */
#product_page h1 {
    font-size: 28px;
}
#product_page .pageheader {
    margin-bottom: 15px;
}
#product_page h1 span {
	color: #ddd;
}
#product_page .pageheader h2 {

    color: #ccc;
    font-size: 18px;
    margin-bottom: 14px;

}
#product_page h3:not(.artcode) {
    font-size: 16px;
    font-weight: 300;
    margin-top: 15px;
    margin-bottom: 4px;
}
#product_page .bestellen h3 {
    font-size: 20px;
    line-height: 1.2;
}
.bestellen h3.aanbieding {
    color: #0089CA;
}
#product_page .bestellen.downloads a {
    /*white-space: nowrap; */
}


#product_page ul {
    margin-left: 20px;
    float: left; clear: both;
}
#product_page ul li {
    list-style-type: disc;
    list-style-position: outside;
    margin-bottom: 4px;
    max-width: 100%;
    float: left; clear: both;
}


#product_page .product_content .imagelarge {
	margin-bottom: 0;
    width: 433px;
    height: auto;
    box-sizing: border-box;
    width: 100%;
    border: 1px solid #d5d5d5;

    float: left;
    background: #fff;
    position: relative;
}
#product_page .product_content .imagelarge iframe {
    width: 100%; height: 100%;
}
#product_page .product_content .imagelarge:after {
    display: block;
    content: "";
    padding-top: 66%;



}
#product_page .product_content .imagelarge > div {
    position: absolute;
    padding: 0px;
    box-sizing: border-box;
    overflow: hidden;
    width: 100%; height: 100%;
}
#product_page .product_content .imagelarge img {
    display: block;
    max-width: 100%;
    max-height: 100%;

    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
}
#product_page .product_content .imagelarge div {
    display: none;
}
#product_page .product_content .imagelarge .shown {
    display: block;
}
#product_page .product_content .imagelarge .fotoid {
    display: none;
}
#product_page .imagethumbs {
    margin-bottom: 20px;
    margin-top: 10px;
    float: left;
}
#product_page .imagethumbs > div {
    float: left;
    width: 75px;
    height: 75px;
    border: 1px solid #d5d5d5;
    padding:0;
    margin: 0px 10px 10px 0px;
    cursor: pointer;
    text-align: center;
    overflow: hidden;
}
#product_page .imagethumbs > div.fotothumb.active {
    border-color: #0089CA;
}

#product_page .imagethumbs div span.fotoid {
    display: none;

}
.imagethumbs .helper {
    width: 75px; height: 75px;
    display: table-cell;
    vertical-align: middle;
}
#product_page .imagethumbs div img {
    display: inline;
}
#product_page .imagethumbs div .video {
    margin-top: 3px; margin-left: 2px;
    width: 70px; height: 69px;
    overflow: hidden;
}
#product_page .imagethumbs div .video img {
    margin-top: 7px; width: 75px;
}

#product_page .imagethumbs div .video .overlay {
    display: block;
    width: 50px;
    height: 34px;
    background: url(/images/icons/video.png) top left no-repeat;
    position: absolute;
    top: 25px; left:16px;
    z-index: 9;
}
#product_page .imagethumbs div .video:hover .overlay {
    background: url(/images/icons/video_active.png) top left no-repeat;
}


#product_page .product_content .description {
    clear: left;
    width: 100%;
}
#product_page .product_content .description > div {
       float: left; clear: both;
}
#product_page .description ul li {
    position: relative;
    float: left;
    list-style-type: none;
    padding-left: 12px;
    background-image: url(/images/icons/bull.png);
    background-repeat: no-repeat;
    background-position: 0px 6px;

}
#product_page .description ul li span {
    display: inline-block; width: 150px;
}

/*
#product_page .product_side {
	float: right;
	width: 200px;
}
	#product_page .product_side ul {
		margin-left: 0;
	}
	#product_page .product_side ul li {
		clear: left; margin: 20px 0px;
		position: relative;
	}
	#product_page .product_side ul li img {
		float: left; width: 50px; border: 1px solid #efefef; margin-right: 5px;
	}
	#product_page .product_side ul li a {
		position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block;
	}
*/
.product_content  div{
}

#product_page .product_content {
	width: 490px;
    float: left;

    /*outline: 1px solid blue;*/
    width: calc(100% - 290px);
    width: calc(100% - 320px);
}
#product_page .product_content.lists {
    width: 100%;
}
#product_page .product_content.lists div {
    width: 100%; float: left;
}
#product_page .product_content .add {
	width: 200px;
	float: right;
	min-height: 50px;
}
#product_page .related_products {
    margin-top: 2em;
    padding-top: 1em;
    border-top: 1px solid #ccc;
    width: 100%; float: left;
}
#product_page .related_products ul {
    margin: 0; padding: 0;
}
#product_page .related_products ul li{
    border: 1px solid #ddd;
    float: left;
    padding: 10px;
    margin: 5px;
}
#product_page .printprice {
    display: none;
}
#product_page .bestellen {
	float: right;
    position: relative;
    width: 250px;
    /*border: 1px solid #d5d5d5;*/
    background: #fff;
    padding: 12px;
    clear: right;

    background: #f4f4f4;
    box-sizing: border-box;
    width: 300px;
}
#product_page .bestellen h3 {
    margin-top: 0;
}
#product_page .bestellen .productid {
    display: none;
}
#product_page .bestellen h2{
    margin-bottom: 10px;
}
#product_page .bestellen > div{
    margin: 5px 0;
    float: left;
    clear: right;
}
#product_page .bestellen .add{
    margin-top: 15px;
}
#product_page .bestellen div span {
/*
    display: block;
    float: left;
    width: 70px;
    */
}
.bestellen div {
}
    .bestellen > div {
        width: 100%;
        float: left;
        font-size: 14px;
        line-height: 1.6;

    }
    .bestellen div.prijs span {
        display: block;
        float: left;
        margin-right: 5px;
    }
     .bestellen div.prijs span.staffelps {
         color: #000;
         font-weight: normal;
         display: inline-block;
         margin-left: 3px;
         float: none;font-size: 13px;
     }
      .bestellen div.prijs.staffel span.staffelaantal {
          clear: left;

          line-height: 20px;
      }
       .bestellen div.prijs.staffel span.prijs {
           clear: right;
       }
         .bestellen div.prijs.staffel span.incbtw {
             line-height: 2;
             clear: both;
             margin-left: 92px;
         }


        .bestellen div.aantal {

            width: 100%;
            float: left;
            margin-bottom: 8px;
        }
        select {
            border: 1px solid #d5d5d5;
            border-radius: 3px;
            background: #fff;
            font-family: Ubuntu, arial, sans-serif;
            font-size: 14px;
            padding: 3px 6px;
        }
        .bestellen div.aantal span  {
            display: inline-block;
            margin-right: 6px;
            padding: 4px 8px 4px 2px;
        }
         .bestellen div.aantal select {
             width: 80px;
         }


 .bestellen div.prijs span.voor {
     clear: both;
 }
    .bestellen span.incbtw {
        display: inline-block;
        margin-left: 5px;
        font-size: .9em;
        color: #222;

        margin-left: 8px;
        line-height: 44px;
    }

.bestellen div span.prijs {
    font-size: 32px;
    font-weight: 300;
    display: block;
    float: left;
    clear: both;
    width: auto!important;
    color: #0089CA;
    line-height: 1;
}
.bestellen div.staffel span.prijs {
    font-size: 20px;
    margin-right: 4px;
}
.bestellen .vanprijs {
    position: relative;
    width: auto!important;
}
.bestellen .prijs .streep, .price .streep {
    /*
    background: url(/images/icons/vanvoor2.png) top left;
    background-size: 100% 100%;
    display: block;
    width: 100%!important;

    height: 70%;
    bottom: 15%;
    position: absolute;
     left: -1px;
     */


    position: absolute;
    width: 106%;
    bottom: 2px;
    left:0;


    color: inherit;

    height: 1px;
    background-color: currentColor;
    opacity: .8;
    -webkit-transform-origin:left bottom;
    -moz-transform-origin:left bottom;
    -ms-transform-origin:left bottom;
    -o-transform-origin:left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-15deg);
    -moz-transform: rotate(-15deg);
    -ms-transform: rotate(-15deg);
    -o-transform: rotate(-15deg);
    transform: rotate(-15deg);
}

#product_page .bestellen.bestelbox {


}


.bestellen .staffel span.staffelaantal {
    width: 85px!important;
}

.bestellen.extra {
    margin-top: 20px;
}
.bestellen.extra a {
    font-size: 13px;
    line-height: 1.4;
    display: inline-block;
    padding: 2px 0;
}
.bestellen.extra a {

}
/*
.bestellen .add {
    border: 1px solid lightgrey;
}
*/

#product_page .bestellen .change p {
    margin-top: 10px;
    margin-bottom: 5px;
    font-size: 11px;
}
#product_page .bestellen .change span {
    float: left;
    margin-right: 10px;
}

/** popups **/
#product_page .popup {
    position: absolute;
    z-index: 9;
    /*width: 500px;
    height: 300px;*/
    background: #fff;/*
    right: 20px;
    top: 415px;   */
    padding: 10px;
    display: none;
    border: 1px solid #efefef;
    background: #efefef;

    background: white;
    border: 1px solid #0089CA;
    box-shadow: 0 2px 15px rgba(0,0,0,.4)!important;

    box-sizing: border-box;
    width: 300px;
    right: 0;
}
.popup .element textarea {
    width: 240px;
}

.popup .closebup {
    display: block;
    position: absolute;
    top: -15px; right: -15px;
    background: url("../images/fancybox/fancybox.png") repeat scroll -40px 0 transparent;
    cursor: pointer;
    width: 30px; height: 30px;
}

.popup span.close {
    position: absolute;
    z-index: 9;

    /*top: 3px;
    right: 0px;*/


    background-color: #ccc;
    font-size: 23px;
    cursor: pointer;

    background-image: url("/images/icons/clear2.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 14px 14px;
    border: 8px solid white;
    cursor: pointer;
    display: block;
    height: 14px;
    width: 14px;

    position: absolute;
    right: 5px;
    top: 5px;
    transition: opacity 50ms ease 0ms;


}
.popup span.close:hover {

    background-color: #0089CA;
}


.popup h3 {
    margin-top: 0!important;
    margin-bottom: 8px!important;

}
.popup .subtitle,.popup .subtitle a {
    color: #00c200;
    font-size: 15px;
}
.popup .subtitle {
    display: block;
    width: 100%; float: left;
    margin: 3px 0 3px 0;
    line-height: 1.4;
}

#product_page .popup.share {
    /*height: 105px; */
  /*  width: 100px;
    top: 390px; right: 60px;
    padding: 5px;*/
}
.popup.share div {
    position: relative;
    width:  100px;
    height: 22px;
    margin: 5px;
}

    .popup.share div {
        float: left;
        width: auto;
    }
.popup.share div img {
    opacity: 0.8;
}
.popup.share div img:hover {
    opacity: 1;
}
.popup .mail-this {
    display: block;
    background-image: url(/images/icons/mail.png);
    background-position: 0 0;

    width: 49px; height: 19px;
    padding-left: 23px;
    font-size: 12px;
    color: black;
    padding-top: 1px;
}
.popup .mail-this:hover {
    background-position: 0px 20px;
}

.popup.question, .popup.mailthis {
    top: 380px; right: 0;
    width: 312px;
    width: 280px;
}
.popup.question input,
.popup.question textarea,
.popup.mailthis input,
.popup.mailthis textarea {
    width: 100%!important;
}
.popup.question textarea {
    height: 100px;
}
.popup .button {
    margin-top: 20px;
    margin-bottom: 5px;
}

/** youtube **/
.fancbxvideo {
    display: block;
    width: 170px;
    height: 128px;
    overflow: hidden;
    position: relative;
    border: 1px solid #EFEFEF;
}
.fancbxvideo .overlay {
    display: block;
    width: 50px;
    height: 34px;
    background: url(/images/icons/video.png) top left no-repeat;
    position: absolute;
    top: 45px; left:60px;
    z-index: 9;
}
.fancbxvideo:hover .overlay {
    background: url(/images/icons/video_active.png) top left no-repeat;
}
.fancbxvideo img {
    width: 170px;
}


#fancybox-overlay {
    cursor: auto!important;
}

/* ------------------------------

Breadcrumbs

------------------------------ */
.pageheader {
    /*
    background: #EFEFEF;
    border-top: 1px solid #d5d5d5;
	border-left: 1px solid #d5d5d5;
	border-right: 1px solid #d5d5d5;
	*/
	border-bottom: 1px solid #d5d5d5;

	float: left;
	width: 100%; box-sizing: border-box;
  /*  z-index: 9; */
   /* position: relative;*/
}

.breadcrumbs {
	padding: 10px ;
	padding: 0 10px 10px 0;
    color: #666666;
	/*
	background: #efefef;
	border-top: 1px solid #d5d5d5;
	border-left: 1px solid #d5d5d5;
	border-right: 1px solid #d5d5d5;*/
}

.breadcrumbs span {
    color: #333;
    margin: 0;
    line-height: 1.5;
}
.breadcrumbs span:after {
    content: "›";
    display: inline-block;
    margin: 0 5px 0 7px;
}
.breadcrumbs span:last-child:after {
    display: none;
    content: "";
}

.breadcrumbs .active{
    color:#333;
/*    font-weight: 600;*/
}

.breadcrumbs .disabled {
    color: gray;
}

.breadcrumbs .done {
    color: gray;
}


.pagefooter {
    display: none;
    background: #fff;
    border: none;
    z-index: 9;
    position: relative;
    clear: both;
    width: 100%; height: auto; float: left;
    margin-top: -1px;
}
.pagefooter .category_products_controls {
    border: 0;
}

/* ------------------------------

Buttons

------------------------------ */

a.button, input.button {
	background: #EFEFEF;
	color: #000;
/*	font-weight: bold;*/
    min-width: 140px;
	display: block;
	padding: 6px;
	text-align: center;
    border: 1px solid #D5D5D5;
    font-size: 14px;
    font-weight: normal;
    float: right;
    position: relative;
 }
 .button.wider {
    width: auto!important;
    padding: 6px 24px;
 }

a.button:hover, input.button:hover {
    color: #0089CA!important;
    cursor: pointer;
}
div.add a.button, a.button.blue, input.button.blue, a.button.green, input.button.green,
a.button.red, input.button.red {

    border: none;
    text-align: right;
    color: #999;
    border: none;
    border: 1px solid #d5d5d5;
    width: 130px;
    position: relative;
   /* -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;*/

    text-align: center;

line-height: 1.6;


    background-color: #009BE3;
    border: none;
    border-bottom: 2px solid rgba(0,0,0,.3);
    color: white;
    border-radius: 4px!important;

    transition: background-color 150ms ease;

    width: 100%; box-sizing: border-box;

}
a.button.green, input.button.green {
    background-color: #00c72f;
}
a.button.red, input.button.red {
    background-color: #970214;
}

input.button.blue, input.button {
    font-family: Ubuntu;
    line-height: 1.6;
}
a.button.addtocart {

    background-image: url(/images/icons/cartn3.png);
    background-position: 12px center;
    background-size:  24px 24px;
    background-repeat: no-repeat;
    padding-left: 25px;
}
#product_page .bestellen div.add a.button {

}

div.add a.button:hover, a.button.blue:hover, input.button.blue:hover {
    background-color: #0089CA;
    color: #fff!important;;
}
a.button.green:hover, input.button.green:hover {
    background-color: #00c12f;
    color: #fff!important;;
}

a.button.red:hover, input.button.red:hover {
    background-color: #8b0214;
    color: #fff!important;;
}
div.add a.button.activated {
    background-color: #00c72f;
    color: #fff;
    text-align: center;
}
.tile div.add a.button.activated {

}

/** bestelbutton met aantalselect **/
div.add.withaantal {
    background: #EFEFEF;
    border: none;
    text-align: left;
    padding-right: 10px;
    color: #666666;
    border: none;
    border: 1px solid #d5d5d5;
    width: 156px;
    position: relative;
    height: 65px;
}
div.add.withaantal .aantal {
    float: left;
    clear: right;
}
div.add.withaantal .aantal span {
    margin-left: 8px;
    margin-top: 5px;
}
div.add.withaantal a {
    background: url(/images/icons/cart.png) 0px 0px no-repeat;
    position: absolute;
    bottom: 2px; left: 7px;
    padding-left: 35px;
    height: 24px;
    white-space: nowrap;
}
div.add.withaantal a:hover, div.add.withaantal a.activated {
    background: url(/images/icons/cart_active_new.png) 0 0 no-repeat;
    color: #0089CA!important;
}
.selectcontainer {
    width: 50px;
    overflow: hidden;
    border: 1px solid #d5d5d5;
    margin-top: 0px!important;
    /*background: url("/images/icons/sort_desc.png") no-repeat scroll 36px 9px white;*/
}

.selectcontainer select {
    width: 71px;
    padding: 2px;
    border: none;
    background: transparent;
    cursor: pointer;
    /*-webkit-appearance: none;*/
}

#shoppingcart .selectcontainer {
    margin-top: -3px!important;
}

    a.added {
        margin-top: -30px;
        background-image: none!important;
        color: #0089CA!important;
        display: none;
    }



/* ------------------------------

Basket-summary (header)

------------------------------ */
#basket {
    width: 140px;
}
#basket .title { }

#basket img {
    float: left;
    margin-right: 5px;
}

#basket .product_id {
    display: none;
}

#basket .title {
   /* font-weight: bold;*/
}

#basketlinks {
    height: 34px;
    float: right;
    background: #efefef;
    border-left: 1px solid #d4d4d4;
    padding: 3px 3px 3px 0px;
    font-size: 11px;
}


/* ------------------------------

Winkelwagen-pagina

------------------------------ */
#shoppingcart {
    width: 679px;
    width: 100%;
    box-sizing: border-box;
    /*border-bottom: 1px solid #D5D5D5;*/
    float: left;
}
#shoppingcart .item {
	background: #fff;
	padding: 10px 20px;
	min-height: 80px;
	position: relative;
    border-bottom: 1px solid #D5D5D5;

}
#shoppingcart .item.empty {
    padding: 10px 0;
}
#shoppingcart .item:last-child {
    border-bottom: 0;
}
#shoppingcart .header{
    min-height: 0;
    /*background: #efefef;*/
    z-index: 9;
    width: 638px;
    width: 100%;
    box-sizing: border-box;


    border-bottom: 1px solid #ccc;
}
#shoppingcart .header .thumb{
    display: block;
    width: 50px;
    height: 10px!important;
}
#shoppingcart .header span {
    margin-bottom: 10px;
}
#shoppingcart .item .productid{
    display: none;
}
#shoppingcart .item h2{
	display: inline;
    margin-left: 0!important;
}
#shoppingcart .item:not(.header) .description {


    display: block;
    max-width: calc(100% - 314px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

}
#shoppingcart .item .thumb {
	float: left;
	margin-right: 10px;
    height: 50px;
    min-width: 50px;
    text-align: center;
}
#shoppingcart .item .prijs {
    float: right;
    width: 80px;
}
#shoppingcart .item .aantal {
    float: right;
    width: 80px;
    margin-top: -2px;
}
#shoppingcart .header.item .aantal {
    margin-top:0;
}
#shoppingcart .item .aantal select {
    font-size: 13px;
    padding: 2px 4px;

}
#shoppingcart .item .subtotaal {
    float: right;
    width: 80px;
}


#shoppingcart .item span.artcode{

	font-size: 11px;
    color: #666;
    display: inline;
}

#shoppingcart .item span.remove{
	font-size: 10px;
    color: #666;
    display: block;
    position: absolute;
    left: 80px;
    /* left: 670px; */
    bottom: 2px;
    cursor: pointer;
}
#shoppingcart .item span.remove:hover {
    color: black;
}
/*
select.aantalselect {
    display: block;
    width: 50px;
    float: left;
    height: 24px;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    font-family: 'Open Sans',arial,serif;
    font-size: 12px;
    padding: 3px;
    margin-top: -4px;
}
*/
select.aantalselect.active {

    background: #DBFFDC;
}


#shoppingcart .totals {
    width: 270px;
    float: right;
    background: #EFEFEF;

    position: relative;

}
#shoppingcart .totals div {
    padding: 5px;
    padding-left: 10px;
}
#shoppingcart .totals div span {
    display: block;
    float: right;
    width: 100px;
}
#shoppingcart .totals .totaal {
    font-size: 16px;
   /* font-weight: bold;*/
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}
#shoppingcart .totals .small {
    font-size: 11px;
}

#shoppingcart .order {
    float: right;
    position: relative;
    margin: 15px 0 15px 15px;
    width: 273px;
    clear: right;
}

#shoppingcart .stock {
    clear: both;
    display: block;
    width: 400px;
    float: left;
    position: absolute;
    left: 80px;
    bottom: 20px;
}

/* ------------------------------

Besteltraject

------------------------------ */
div.kcontent {
    float: left;
    width: 100%;
}
.klantgegevens {
    float: left;
    width: calc(100% - 280px);
    /*outline: 1px solid red;*/
    position: relative;
    line-height: 1.6;
    
    margin-top: -123px;

}

.klantgegevens .sub {
    float: left;
    margin: 10px 20px 10px 10px;
    min-width: 150px;
}
.klantgegevens .sub .sub_extra {
    margin-top: 20px;
}

.klantgegevens .sub .title {
    /*font-weight: bold;*/
    font-size: 18px;
}
.klantgegevens .opmerking {
    width: 400px;
}

/* Besteltraject */
label.error {
	position: absolute;
	margin: 6px 0 0 -52px;
	clear: both;
	white-space: nowrap;


	background: #fff;

	padding: 3px 5px;
	font-size: 11px;

	z-index: 9;
	background: rgba(255,255,255,.5);
	border-radius: 2px;

    background: #be0404;
    color: white;
    border: none;
    line-height: 1.2;

}
label.error[for=akkoord] {
    margin-top: -28px;
    margin-left: -54px;
}



.row {
    width: 100%;
    clear: both;
}

#bestelform h2 {
    margin-left: 5px;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.4;
    margin-bottom:4px;

}

.column {
    width: 50%;
    float: left;
    margin-bottom: 15px;
    padding: 10px;
    box-sizing: border-box;
}
#verzendadres {
    padding-top: 0;

}
.column:nth-child(odd) {

}
.column:nth-child(even) {

}
div.p_bestellen .column {
    margin-bottom: 0;
    /*border-right: 1px solid #ccc;*/
}
div.p_bestellen .column.right {
    float: right;


}
.p_bestellen .pageheader {
    border-bottom:0;
}
div.p_bestellen #bestelform .column h2 {
    /*margin-left: 177px;*/

    display: block; float: left;
}
div.p_bestellen #bestelform .column h2.mtop {
    margin-top: 12px;
}
.column#verzendadres {
    display: none;
    opacity: 0;
}

.column#iszakelijk {
    display: none;
    opacity: 0;
    width: 100%;
    background: #efefef;
    border: 1px solid #d5d5d5;
    padding: 20px;
    border-radius: 3px;
    margin-bottom: 20px;
}
.column#iszakelijk h2 {
    line-height: 1;
}

.element#selectbedrijf {
    padding: 20px 0;
}


.column.submit{
    float: right;
    clear: both;

}

.element { /*een form element, bestaande uit <p>titel en <input> */
    width: 100%;
    float: left;
    padding: 7px 5px;
}
.element p {
    display: block;
    float: left;
    width: 170px;
    margin-top: 8px;
    box-sizing: border-box;
    padding-right: 8px;
    text-align: right;
}

div.popup .element p{
    text-align: left;
    line-height: 1.8;
    margin-top:0;
}
div.popup .element {
    /*padding: 7px 3px 0 3px;*/
    padding: 5px 0 0;

}

.element input:not([type=radio]), .element select {
    display: block;
    width: 240px;
    float: left;

    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    font-family: Ubuntu, arial, sans-serif;
    font-size: 13px;
    padding: 6px;
    border-radius: 3px;
    box-sizing: border-box;
    line-height: 1.6;
}

    .element input[name=telefoon] {
        width: 140px;
    }
    .element input.postcode {
        width: 110px;
    }
    .element select.land {
        width: 120px;
    }
    .element select.betalen {
        width: 160px;
    }
    .element select.verzenden {
        width: 200px;
    }
    .element input.naam {
        width: 180px;
    }
    .element select.plaats {
        width: 180px;
    }

    .element input.error {
        border-color: #BE0404;
    }

.element select {
    box-sizing: border-box;
}
.element select {


}
.column textarea, .popup textarea, #contactform textarea {
    display: block;
    width: 320px;
    float: left;
    height: 58px;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    font-family: Ubuntu,arial,serif;
    font-size: 13px;
    padding: 6px;
    margin-top: 4px;
    border-radius: 3px;
}
.popup textarea {
    width: 290px;
}
.column.opmerking{
    margin-top: -5px;
}

.column input[type=submit] {
    float: right;
    clear: both;
}

.akkoord {
    margin-top: 30px;
    float: right;
    width: 270px;
    min-height: 100px;
    margin-right: 3px;
}
.akkoord input[type=submit] {
    float: right;
    margin-top: 10px;
}
div.akkoord > div.cbset {
    float: left; width: 100%;
    background: #efefef;
    padding: 8px;
    box-sizing: border-box;
    margin-bottom: 5px;

}
div.akkoord > div.cbset label {
    position:relative;
    display: block;
}
div.akkoord > div.cbset label.error {
    position: absolute;
}
div.akkoord > div.cbset label span {
    padding-left: 24px;
    display: block;
}
div.akkoord > div.cbset label input {
    position: absolute;
    top: 0px; left: 0;

}

div.akkoord > div.cbset.orderwarnings,
p.orderwarning {

    float: left; width: 100%;
    background: #efefef;
    padding: 8px;
    box-sizing: border-box;
    margin-bottom: 5px;


    padding-left: 33px;
    background-image: url('../images/icons/orderwarning.png');
    background-position: 5px 10px;
    background-repeat: no-repeat;
    background-color: #ffeec5;
    
}
p.orderwarning {
    padding: 15px 8px;
    padding-left: 33px;
    margin: 2em 0;
    background-position: 7px 13px;
}


div.goorder {
    float: right;
    margin-top: 12px;
    width: 270px;

}
div.goorder input.button {
    font-size: 15px
}

/* ideal response pagina keuze buttons */
.idealactions .button {
    float: left;
}

div.kcontent .akkoord {

    margin-right: 0;

}

/* ------------------------------

Tekstpagina's (pagina.php)

------------------------------ */
#content h1.pagina {
    padding-top: 5px;
}

.pagina_content {
    font-size: 15px;
    line-height: 1.4;

    width: 80%;
    box-sizing: border-box;
    float: left;
    padding: 1em 2em 1em 0;
}
.pagina_content .datum {
    font-size: 16px;
    line-height: 1.5;
}
#content .pagina_content h2{
	font-size: 16px;
    margin-left: 0;
    margin-top: -5px;
    line-height:1.2;
}

.pagina_fotos {
    margin-top: 20px;
    float: right;
    clear: right;
    width: 20%;
}
.pagina_fotos .thumb {
    margin-bottom: 10px;
}
.pagina_files {
    padding-top: 10px;
    clear: both;

}
.pagina_files .title {
    display: block;
    font-size: 17px; font-weight: 300;
    line-height: 1.4;
}
.pagina_files ul  {
    list-style-type: disc;
    list-style-position: outside;
    margin-left: 20px;
}

.pagina_files h2 {
    margin: 0!important;
    font-size: 16px;
}
.pagina_files  a {
    line-height: 1.5;
}



/* ------------------------------

Contactform

------------------------------ */
#contactform textarea {
    width:290px;
}
/* ------------------------------

Footer

------------------------------ */
.footer {
    width: 100%;
    background: #fff;
    border-top: 1px solid #ccc;

    font-size: 14px;
    line-height: 1.6;
    padding-top: 1em;

    margin: 0px auto;
    max-width: 100%;
    width: 1280px;
    padding: 30px;
    box-sizing: border-box;

    background: #fff;

/*    padding-top: 8px;
    padding-bottom: 4px;
    position: relative;
    margin-top: 50px;
    */
}
.footer .content {
    position: relative;
}

div.footer div.column {
    width: 210px;
   /* margin-left: 10px; */
    margin-bottom: 0;
    padding-left: 0;
    position: relative;

    width: 24%!important;
    box-sizing: border-box;
    margin-right: 1%!important;
    padding-top: 0;
}
.column:nth-child(2n) {
    margin-left:0!important;
}
div.footer div.column:nth-child(4n){
    margin-right: 0!important;
}

div.footer div.column li a {
    font-size: 14px;
}
div.footer strong, div.pagina_content strong {
    font-weight: 300;
    font-size: 17px;
    line-height: 1.4;
}
#msmail {
    background: none repeat scroll 0 0 white;
    border: 1px solid #D5D5D5;
    font-size: 14px;

    color: #000;
    float: left;
    margin: 0;


    box-sizing: border-box;
    padding: 6px 6px;
    font-family: Ubuntu, arial, sans-serif;
    border-radius: 3px;

    width: 90%;

}
#submitmailstage {
    width: 90%;
    margin-top: 10px;
    float: left;

}
#submitmailstage:hover {

}
div.footer label.error {
    margin: 18px 0 0 -100px;
}

div.footer ul  {
   /* list-style-type: disc; */
    color: #000;
    font-size: 13px;
}
div.footer ul li {
    padding: 2px 0;
}

/* ------------------------------

Aanbedingsblokken
(verander je dit, denk dan ook ff aan het beheer)

------------------------------ */
.aanbiedingen {
    margin-left: 10px;
    width: 700px;
    clear: both;
}
div.aanbieding, .news_panel {
    float: left;
    padding: 15px;
    height: 222px;
    margin: 15px 15px 0 0;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}
div.aanbieding.news_panel {
    background: #efefef!important;
    color: black!important;
    filter: none;
    border: none;
}
#content div.aanbieding.news_panel h2,  #content div.aanbieding.news_panel h3 a{
    color: #666;
    text-align: left;
    text-transform: none;
    font-weight: normal;
    margin-bottom: 0;
}
div#content div.aanbiedingen div.aanbieding h2 {
    line-height: 1.2;

    font-weight: 300;
}
#content div.aanbieding.news_panel h3 a:hover {
    color: #999;
}
#content div.aanbieding.news_panel > p {
    display: block;
    max-height:  152px;
    overflow: hidden;
    text-align: left;
    line-height: 1.4;
}
#content div.aanbieding.news_panel.large > p {
    max-height: 146px;
}

#content div.aanbieding.news_panel.mega > p {
    max-height:  163px;
}

#content div.aanbieding.news_panel.medium > p {
    max-height:  163px;
}

.aanbieding .url, .news_panel .url {
    display: none;
}
#content div.aanbieding h1 {
    white-space: nowrap;
    color: white;
    padding-left: 0;
}
#content div.aanbieding.link h2 {
    white-space: normal;
}

.textshadow {
   	text-shadow: #252525 2px 2px 1px ;


}
.aanbieding h3 a {
    color: white;
}

.aanbieding .percentage {
    color: red;
}



.aanbieding .acontent {


    /*background: url(../images/icons/gr_home.png) top left repeat-x; */
}

.aanbieding .acontent * {
    color: #000;
}

.aanbieding .title {


    z-index: 2;
    padding: 15px;
    position: absolute;
    top: 0; left: 0;
    width: 100%;


}

#content .aanbieding h3 {
    font-weight: normal;
    font-size: 22px;
    line-height: 1.2;
    margin-left: 0;
    margin-bottom: 1em;
}
#content .aanbieding.news_panel h3 {
    margin-bottom: .5em
}
.aanbieding h3 span {
    display: none;

    font-weight: normal;
    white-space: nowrap;
}

.aanbieding h4 {
    margin-bottom: 4px;
    float: right;
}

.aanbieding .aprijs.percentage {

}


.aanbieding .acontent .info {


}
.aanbieding .axprijs {
    width: 100%;
    box-sizing: border-box;
    padding: 15px;
    position: absolute;

    bottom:0; right: 0;

}
.aanbieding span.van {
    display: inline-block;
    margin-right: 12px;
}
.aanbieding span.voorprijs {
    font-size: 32px;
    font-weight: bold;
    display: inline-block;
    margin-left: 12px;

}
.aanbieding .van {

}
.aanbieding span.voor {

}

.aanbieding .van span {

    font-weight: bold;
}


/** mega **/
.aanbieding.mega {

    color: white;
}
#content .aanbieding.mega .title h2 {
    font-size: 44px;
}
.aanbieding.mega .acontent {

    position: absolute;
    bottom: 0px;
    left: 0;
    padding: 30px;
    width: 100%;
    box-sizing: border-box;

}
.aanbieding.mega .foto img {

}

/** large **/
.aanbieding.large {

    color: white;
}
.aanbieding.large .acontent {

    position: absolute;

    width: 100%; padding: 15px;
    bottom:0;
    left:0;
    box-sizing: border-box;

}

.aanbieding.large .title {


    z-index: 2;
    padding: 10px;
    position: absolute;
    top: 0; left: 0;
}
#content .aanbieding.large .title h2 {
    font-size: 36px;
}
.aanbieding.large .foto img {

}

/** medium **/

    .aanbieding.medium {

        color: white;
    }
    .aanbieding.medium.left .acontent {
        height: 90px;
        position: absolute;
        bottom: 15px; left: 0px;

    }
    .aanbieding.medium.right .acontent {
        height: 90px;
        position: absolute;
        bottom: 15px; right: 0px;

    }
    #content .aanbieding.medium .title h2 {
        font-size: 24px;
        color: #fff;
    }
    #content .aanbieding.medium .acontent .info h3 {
        font-size: 18px;
    }

    .aanbieding.medium .title {


        z-index: 2;
        padding: 15px;
        position: absolute;
        box-sizing: border-box;
        width: 100%;

        top: 0; left: 0;

    }
    .aanbieding .foto {
        left: 0;
        top: -5px;
    }
    .aanbieding.medium .foto img {

    }

/** small **/
.aanbieding.small {

    background: white;
    border: 1px solid #efefef;
}
.aanbieding.small .acontent {

    position: absolute;
    bottom: 0; left: 0px;

    background: none;
    opacity: 1;
    z-index: 3;

    box-sizing: border-box;
    width:100%;

}

#content .aanbieding.small .title {

    filter: none;
}
#content .aanbieding.small .title h2 {
    font-size: 18px;
    text-shadow: none;
    color: #000;
}
#content .aanbieding.small .acontent .info {

}
#content .aanbieding.small .acontent .info h3 {
    font-size: 16px;
}

.aanbieding.small .title {


    box-sizing: border-box;
    width: 100%;
    z-index:3;
    padding: 10px;
    text-align: center;
}
.aanbieding.small .foto {
    left: 0;
    top: 35px;

    text-align: center;
}
.aanbieding.small .aprijs  {

}
.aanbieding.small .aprijs .voorprijs {
    font-size: 24px;
}
.aanbieding.small .foto img {
    width: auto;
}
div.aanbieding.small > img {
    display: block;
    margin: 23px auto;
    top: inherit;
    left: inherit;
    position: relative;

}
div.aanbieding.pdf.small > img {
    margin-top:0;
}
div.aanbieding.pdf.large > img {

}




/** news panel **/
.news_panel {
}
.news_panel h2 {
    font-size: 28px!important;
    padding-left: 0!important;
    margin-bottom: 8px!important;
}

#content div.aanbieding.news_panel h2 a, #content div.aanbieding.news_panel h3 a {
    color: #0089CA!important;
}
.news_panel h3 {
    margin-left: 0!important;
    font-size: 18px!important;
    font-weight: normal!important;
}
.news_panel .leesmeer {
    /*    background: none repeat scroll 0 0 #EFEFEF;
    bottom: 4px;
    left: -10px;
    margin-right: 10px;
    position: absolute;
    text-align: right;
    white-space: nowrap;
    width: 100%;
    */
    color: #0089CA

}
#smessage {
    margin-top: -45px;
    margin-left: 10px;
    z-index: 12;
    position: absolute;
    width: 220px;
    display: none;
}

#newslist {
    /*padding: 10px;*/
    line-height: 1.8;
    float: left;
    clear: both;
    position: relative;
}
#newslist h3 {
    font-weight: 300;
    font-size: 17px;
    line-height: 1.4;
}

/* link */
#content div.aanbieding.link {
   /* background:   white; */
}
#content div.aanbieding.small .acontent .info {
    padding: 15px;
}
#content div.aanbieding.link p {
    color: black;
    font-size: 17px;
}
#content div.aanbieding.link .title {

}
#content div.aanbieding.link h2 {
    color: white;
    white-space: normal;
}

/* specstable */
.specstable {
    margin-left: 0;
    width: 80%;
}
.specstable tr {
    border-bottom: 1px solid #eee;
}
.specstable tr td {
    padding: 2px 0px;

}
.specstable tr td:first-child {
   /* background: url("/images/icons/bull.png") 4px 7px no-repeat;
    padding: 2px 6px 2px 17px;*/
    padding: 2px 6px 2px 2px;
}
table.openingstijden {
    margin-left: -5px;
}
table.openingstijden tr td{
    padding: 5px;
}

#contactform div.artikel div.element p {
     clear: both;
     width: 100%;
    text-align: left;
}
#contactform div.artikel div.element input {

}

#addartikel {
    display: block; float: left; clear: both;
    margin: 10px 0;
    width: 300px;
    color: #0089CA;
    cursor:pointer;
}
#addartikel:hover {
    text-decoration: underline;
}
#contactform div.artikel {
  background: none repeat scroll 0 0 #EFEFEF;
  clear: both;
  float: left;
  margin: 10px 0;
  width: 50%;
  padding: 5px;
}

#contactform input[type=checkbox] {
    width: 25px;
    margin-top: -0px;
}

body * {
    box-shadow: none!important;

}

/* new top menu */
div#topbar {
    width: 100%;
    border-bottom: 1px solid #d8d8d8;
    padding-bottom: 10px;
    margin-bottom: 8px;
}
div#topbar a {
    padding: 3px 8px;
}
div#topbar a.active {
    color: #0089CA
}

#product_page div.related_products h3 {
    line-height: 2;
    font-size: 18px;
    font-weight: 300;
}

/* new scrolled view */
body.scroll {
    padding-top: 130px;
}
body.scroll div#header {
    position: fixed;
    width: 100%;
    z-index:99;
    top: 0; left: 0;
    box-shadow: 0 0 5px rgba(0,0,0,.3)!important;
    height: 60px;
    padding: 10px 0;
}
body.scroll div#header div#topbar {
    display: none;
}
body.scroll div#header > div.content {
    width: 1280px;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0 30px;
    position: relative;

}
body.scroll div#header #logo {
    width: 125px;
    height: 35px;
}
body.scroll #header #basket {
    height: 35px;
}
body.scroll #header #search input#sq {
    height: 25px;
}

#preview {
    position: fixed;
    top: 0; left: 0;
    font-size: 28px;
    color: #0089CA;
    padding: 18px;
    z-index: 100;
}

/* voorraad */
span.voorraad, span.levertijd {
    display: block; 
}
span.voorraad.winkel, span.levertijd.fast {
    color: #00c200;
}
span.voorraad.leverancier {
    color: #f4ac00;
}
span.voorraad.none  {
    color: #b91010;
}
span.levertijd.long {
    /*color: #333;*/
}
div.bestelbox span.levertijd.long {
    cursor: pointer;
}
div.bestelbox span.levertijd.long:after {
    display: inline;
    content: "  › ";
}
div.bestelbox  span.levertijd.long:hover {
    color: #0089CA;;
}

    span.voorraad:before {
        /*
        content: "";
        display: inline-block;
        width: 10px; height: 10px;
        border-radius: 100%;
        background-color: currentColor;
        margin: 0px 5px 2px 2px;
        vertical-align: middle;
        */
        /*
        content: "•••";
        display: inline-block;
        line-height: 20px;
        vertical-align: top;
        margin-right: 4px;
        font-size: 38px;
        */
        content: "";
        display: inline-block;
        width: 34px; height: 10px;
        line-height: 20px;
        vertical-align: baseline;
        margin-right: 4px;
        background-image: url(/images/icons/voorraad-high.png);
        background-size: 34px 10px;



    }
    span.voorraad.leverancier:before {
        background-image: url(/images/icons/voorraad-mid.png);
    }
    span.voorraad.none:before {
        background-image: url(/images/icons/voorraad-low.png);
    }
    /*
    span.voorraad.leverancier {
         background: linear-gradient(to right, #00c200 0%,#00c200 33%, #f4ac00 34%,#f4ac00 100%);
    }
    */
    /*
    span.voorraad.leverancier:before {
        background: linear-gradient(135deg, rgba(0,194,0,1) 0%,rgba(244,172,0,1) 100%);
    }
    */


span.voorraad.leverancier, span.levertijd.mid {

}

p.emptycat {
    padding: 1em;
}

div.paymentreturn a.button {
    float: left;
    width: 250px;
    margin-right: 12px;
}
div.paymentreturn strong {
    font-weight: normal;
    color: #b91010;
    font-size: 1.2em;
}
div.rmaform p {

}

/* home */
.aanbiedingen {
    width: 100%; float: left;
    margin-left: 0;

    box-sizing: border-box;
    position: relative;
    font-size: 15px;

}
.aanbiedingen div.aanbieding {
    float: left;

    box-sizing: border-box;
    margin-top: 0;
    margin-bottom: 2%;
}
.aanbiedingen div.aanbieding.mega {
    width: 100%;
}

.aanbiedingen div.aanbieding.large {
    width: 66%;
    margin-right: 2%;
}
    .aanbiedingen div.aanbieding.medium.m2 {
        margin-right: 0;
    }

.aanbiedingen div.aanbieding.medium {
    width: 49%;
    margin-right: 2%;

}
    .aanbiedingen div.aanbieding.medium.m2 {
        margin-right: 0;
    }

.aanbiedingen div.aanbieding.small {
    width: 32%;
    margin-right: 2%;
}
    .aanbiedingen div.aanbieding.s3 {
        margin-right: 0;
    }

.aanbiedingen div.aanbieding * {
}
.aanbiedingen  div.aanbieding  {

    border-radius: 3px;

    transition: all 150ms ease;

}
.aanbiedingen  div.aanbieding:hover {

}
.aanbiedingen  div.aanbieding.small {
    border: 1px solid #d5d5d5;

}

.aanbiedingen div.aanbieding div.title {
    color: #fff;
    background: #0089CA
}
.aanbiedingen div.aanbieding.small div.title {
    background: rgba(255,255,255,0);
    color: #111;
}
.aanbiedingen div.aanbieding  * {


}
.aanbiedingen div.aanbieding.medium div.acontent {
    position: absolute;
    width: 100%;
    padding: 15px; box-sizing: border-box;
    top: 50px; left:0;
    z-index: 3;

    width: 80%;
    top: 80px;
    padding: 10px 15px;
    background: rgba(255,255,255,.8);
    border-radius: 0 3px 3px 0;
}

.aanbiedingen div.aanbieding span.voorprijs {
    font-weight: 300;
    color: #0089CA;
}
.aanbiedingen div.aanbieding div.bg {
    position: absolute;
    top:0; left: 0;
    width: 100%; height: 100%;
    z-index: 2;
    background: rgba(255,255,255,.2);
     background: rgba(0, 179, 255, 0.09);

      background:  linear-gradient(to bottom, rgba(0, 179, 255, 0.3) 0%, rgba(0, 179, 255, 0) 100%);
      background:  linear-gradient(to bottom, rgba(100, 100, 100, 0.3) 0%, rgba(100, 100, 100, 0.1) 100%);


    transition: opacity 150ms ease;
}
.aanbiedingen div.aanbieding.news_panel div.bg {
    opacity: .7;
}
.aanbiedingen div.aanbieding.news_panel img {
    max-width: 23%;
    float: left;
    margin-right: .8em;
    margin-top: .2em
}
.aanbiedingen div.aanbieding div.bg2 {
    position: absolute;
    top:0; left: 0;
    width: 100%;
    top: 0px; bottom:0;

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
    opacity: .7;
    transition: all 150ms ease;
    transform: scale(1);

}
.aanbiedingen div.aanbieding.small div.bg {
    display: none;
}
.aanbiedingen div.aanbieding.small div.bg2 {
    background-size: auto auto;
    background-position: center 36px;
    opacity: 1;
    top: 0;
}
.aanbiedingen div.aanbieding div.title,.aanbiedingen div.aanbieding div.acontent {
    opacity: 1;
    transition: transform 150ms ease;
    -webkit-transition: -webkit-transform 150ms ease;
}
.aanbiedingen div.aanbieding:hover  div.bg2{
    opacity:1;
    transform: scale(1.06);
}
.aanbiedingen div.aanbieding:hover div.bg,
.aanbiedingen div.aanbieding:hover div.acxontent {
    opacity:0.5;
}
.aanbiedingen div.aanbieding:not(.small):hover div.acontent {
    transform: translateX(-100%);
}
.aanbiedingen div.aanbieding:not(.small):hover div.title {
    transform: translateY(-100%);

}

/* home usps*/

div#home_usps {

    background: #fff;
    width: 100%;
    box-sizing: border-box;

    float: left;
    background: #efefef;
    padding: 15px;
    margin: 1em 0;
}
div#home_usps > div {
    display: block;
    box-sizing: border-box;

    background: #ccc;
    background: none;
    margin: 0;

    padding: 15px;
    padding: 0;
    padding: 15px 0;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.6;
    width: 50%; float: left;
    position: relative;

    border-radius: 4px;
    padding-left: 50px;
/*
    background: #0089CA;
    color: white;*/

    width: 54%;
}

div#home_usps > div:nth-child(2),
div#home_usps > div:nth-child(4) {
    width: 46%;
}

div#home_usps > div  span {
    font-size: 48px;
    color: #00c72f;
    position: absolute;
    /*background: white;*/

    display: block;
    line-height: 64px;
    top: 0; left: 0px;

    width: 50px; height: 60px;
    top: 50%; margin-top: -30px;
    text-align: center;
    border-radius: 100%;
}

body *.mobonly {
    display: none;
}

img.loadinggif {
    width: 48px; height: 48px;
}

div.p_bestellen .element p {
        width: 40%;
    }
    div.p_bestellen .element input:not([type="radio"]),  div.p_bestellen .element select {
        max-width: 58%;
    }
    .column textarea, .popup textarea, #contactform textarea {
        width: 85%;
        box-sizing: border-box;
    }
    div.p_bestellen .column textarea {
        height: 107px;
    }

input.button {
    -webkit-appearance: none;
}


#kiek-container #kiek-overlay {
    box-shadow: none;
    background: rgba(200,200,200,.8);
    opacity: 1;
}
#kiek-container div#kiek-left,
#kiek-container div#kiek-right {
    color: white;
    background-color: #0089CA;
    border-radius: 4px;

    line-height:  86px!important;

    height: 100px;
    width: 64px;
    top: 50%;
    margin-top: -32px;
    left: 2%;

}
#kiek-container div#kiek-right {
    left: auto;
    right: 2%;
}
#kiek-container div#kiek-left:hover,
#kiek-container div#kiek-right:hover {
    background-color: #009BE3;
}
#kiek-container #kiek-title {
    font-weight: normal;
}
#kiek-container #kiek-close {
    width: 32px; height: 32px;
    background-image: url(/images/icons/closew.png);
    background-size: 24px 24px;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #0089CA;
    margin-left: -16px;

    padding: 8px;
    border-radius: 100%;
    cursor: pointer;

    /*top: 5%; right: 5%; bottom: auto; left: auto;*/

    transition: all 150ms ease;
}

#kiek-container #kiek-close:hover {
    background-color: #009BE3;
    transform: rotate(90deg);
}
#kiek-container div#kiek-close span.kiek-close {
    display: block;

    width: 100%; height: 100%;
    position: absolute; top: 0; left: 0;
}
#kiek-container {
  display: block;
  position: fixed;
  z-index: 5000;
}



