/* CSS door CM Specialist.nl */ /* Versie 6.4.3 */ /* Instellingen categorie en artikelweergave */ .shopHeader {clear: both;} .shopHeader img {height: auto !important; max-width: 100%;} .shopSortOptieTable {width: 100%; margin: 10px 0px;} .shopSortPres {width: 20px; text-align: center;} .shopSortPres a {color:#999; font-size:16px;} .shopSortPres a:hover {color:#000;} .shopSortPres a.actief {color:#000;} .shopSortOptie2 {text-align: right;} .shopSortOptie {text-align: right;} .shopFooter {margin-top:20px;} .slidingProduct {box-shadow: 0 1px 10px rgba(0,0,0,.3); border-radius:10px; overflow:hidden; z-index:999 !important; pointer-events: none;} /* Einde instellingen categorie en artikelweergave */ /* Categorie sortering en weergave */ .shopSortOptieTable a {text-decoration: none; transition: all .3s ease;} .shopSortOptieTable a.actief {font-weight: bold; color:#000; *background:#eee;} .shopSortOptieTable a.actief.asc .titel::after {content:"\f0d7"; font-family: "Font Awesome 5 Pro"; margin-left:5px; font-weight: normal;} .shopSortOptieTable a.actief.desc .titel::after {content:"\f0d8"; font-family: "Font Awesome 5 Pro"; margin-left:5px; font-weight: normal;} .aantalPerPagina select {padding:5px 25px 5px 10px} .aantalPerPagina span {line-height:31px; padding-right:5px;} .presentatieWijze, .sorteerKnoppen {display:inline-block; vertical-align: middle; padding:0; *border:1px solid #eee; border-radius: 4px; overflow: hidden;} .presentatieWijze a, .sorteerKnoppen a {padding:5px; display: inline-block; line-height: 1.5em; color:#666;} .sorteerKnoppen a {padding:5px 10px;} .presentatieWijze a:hover, .sorteerKnoppen a:hover {color:#000; *background:#eee;} .presentatieWijze .titel {display: none;} .presentatieWijze i {font-weight: bold;} .shopAfdrukkenKnop .pdfKnop {margin-left: 5px;} .shopNavigatie {margin: 10px 0; vertical-align: middle; width:100%;} .shopNavigatieVorige {text-align:left; width:30%;} .shopNavigatieVolgende {text-align:right; width:30%;} .shopNavigatieLijst {text-align:center; width:40%;} .shopNavigatie .button {white-space: nowrap;} /* Einde Categorie sortering en weergave */ /* Categorieen */ .shopCategorieHolder .categorie {position: relative; width: 25%; float: left;} .shopCategorieHolder .categorie .inner {position: relative; border: 1px solid #dddddd; margin: 5px; transition: all .3s ease;} .shopCategorieHolder .categorie .inner:hover {box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);} .shopCategorieHolder .categorie a {text-indent: -9999px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 100; background:url("images/spacer.gif");} .shopCategorieHolder .categorie .titel {padding: 0 10px; position: relative; z-index:-1;} .shopCategorieHolder .categorie .titel h2 {border-top: 1px solid #e8e8e8; color: #4bace0; font-size: 15px; font-weight: 600; margin: 0; overflow: hidden; padding: 15px 0; text-align: center; text-overflow: ellipsis; white-space: nowrap;} .shopCategorieHolder .categorie .afbeelding {box-sizing: border-box; display: table; padding: 5px; width: 100%;} .shopCategorieHolder .categorie .afbeelding .valign {display: table-cell; height: 210px; text-align: center; vertical-align: middle; width: 100%;} .shopCategorieHolder .categorie .afbeelding .valign img {position: relative; z-index:-1; max-width: 100%; width: auto !important; height: auto !important; max-height: 140px;} /* Einde categorieen */ /* Algemeen voor Lijst, Tegel, Compact en Detail */ .artikel .inner .afbeeldingHouder {position: relative; width: 100%;} .artikel .inner .afbeeldingHouder img {position: absolute; top: 0; right: 0; left: 0; bottom: 0; max-height: 100%; max-width: 100%; margin: auto; padding: 10px; height: auto !important; width: auto !important; box-sizing: border-box;} .artikel .inner .afbeeldingHouder .verhouding {display: block; padding-bottom: 100%;} .artikel .afbeelding {position: relative;} .artikel .labels {top:0; left:0; position:absolute; z-index:10; pointer-events:none;} .artikel h2.titel a {text-decoration: none;} .artikel .artikelnr {display: none;} .artikel .artikelnr > .titel {padding-right:0.3em;} .artikel .artikelnr > .nummer {text-transform:uppercase; white-space: nowrap;} .artikel .voorraad {margin:0.25em 0;} .artikel .voorraad .status {display: table; border-spacing:0;} .artikel .voorraad .status .image {display: table-cell; vertical-align: middle; *display:none;} .artikel .voorraad .status .toelichting {display: table-cell; vertical-align: middle; font-size:12px; font-weight: bold; } .artikel .voorraad .status .negatief {color:#fff; background-color:#E10101; border-radius:5px; padding:4px 7px; line-height: 1em} .artikel .voorraad .status .positief {color:#fff; background-color:#64A43A; border-radius:5px; padding:4px 7px; line-height: 1em} .artikel .extraUitleg {margin: 0.25em 0;} .artikel .prijzen {margin: 0.25em 0;font-weight:bold; color:#000; font-size:15px;} .artikel .prijzen .valuta {padding-right: 0.3em; font-family:"Ubuntu", Helvetica,Arial,sans-serif;} .artikel .prijzen .van {text-decoration: line-through; opacity:.7;} .artikel .prijzen .voor {color: #4bace0; font-size: 100%;} .artikel .prijzen .vanaf {display: block; font-size: 12px; font-weight: normal; padding-right: 0.3em;} .artikel .artikelEenheid {font-size:12px; font-weight:normal;} .artikel .btwinfo {font-size:12px; font-weight:normal; padding-left: 0.25em;} .artikel .artikelBestelEenheid {font-size:12px; font-weight:normal;} .artikel .bestellen {z-index:2;} .artikel .bestellen .variatie select {width:100%; margin-bottom:0.25em;} .artikel .bestellen .bestelknop input {width:24px; text-align:center;} .artikel .favorieten {clear: both; font-size: 12px; margin: 10px 0; position: relative; z-index: 10;} .artikel .favorieten a {text-decoration:none;} .artikel .favorieten .image {padding-right:0.6em;} .artikel .favorieten .image img {position: relative; top: 2px;} .artikel .favorieten.aan i {font-weight: bold;} .artikel .verlang {clear: both; font-size: 12px; margin: 0.25em 0 0; position: relative; z-index: 10;} .artikel .verlang a {text-decoration:none;} .artikel .verlang .image {padding-right:0.6em;} .artikel .verlang .image img {position: relative; top: 2px;} .artikel .verlang.aan i {font-weight: bold;} .artikel .project {font-size:12px; clear:both; margin:0.5em 0; padding:10px 10px 5px 10px; background:#eee; border-radius:5px; } .artikel .project select {width:100%;} .artikel .project a {text-decoration:none;} .artikel .project .image {padding-right:0.6em;} .artikel .project .image img {position: relative; top: 2px;} .artikel #extraVrachtkosten {display:inline-block; padding:5px 10px; margin:0.5em 0; background-color:#eee; border-radius:5px;} .artikel #extraVrachtkosten a {text-decoration:none;} .winkelKnop .relatieBtwTotaalPrijs, .winkelwagenHouder .relatieBtwPrijs {display: none;} .relatieBtwPrijs {display: block; font-size:11px; color:#666; font-weight: normal; margin-top:-10px;} .relatieBtwPrijs .exBtwToelichting{padding-left: 0.3em;} .relatieBtwTotaalPrijs {display: block; font-size:.8em; color:#666; font-weight: normal;} .relatieBtwTotaalPrijs .exBtwToelichting {padding-left: 0.3em;} .shopLijst .artikel .variatie, .shopTegel .artikel .variatie, .shopCompact .artikel .variatie {display: none;} /* Einde algemeen voor Lijst, Tegel, Compact en Detail */ /* Lijstweergave 1*/ .shopLijst .artikel {position: relative; transition: all .3s ease;} .shopLijst .artikel:nth-child(odd) {background: #EFEFEF;} .shopLijst .artikel > a {position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; text-indent: -9999px;} .shopLijst .artikel .inner {display:table; width:100%;} .shopLijst .artikel .inner .col1, .shopLijst .artikel .inner .col2, .shopLijst .artikel .inner .col3 {display:table-cell; vertical-align: top; } .shopLijst .artikel .inner .col1 {width:120px; padding: 10px 0px 10px 10px; box-sizing: border-box;} .shopLijst .artikel .inner .col2 {width:auto; padding: 10px; box-sizing: border-box;} .shopLijst .artikel .inner .col3 {width:145px; padding:10px 10px 10px 0px; box-sizing: border-box;} .shopLijst .artikel .afbeeldingHouder {height:90px;} .shopLijst .artikel .afbeeldingHouder .labels img {width:50px; height:auto;} .shopLijst .artikel .omschrijving {padding: 0;} .shopLijst .artikel .omschrijving h2.titel a {font-size:14px; margin:0; font-family: arial;} .shopLijst .artikel .omschrijving .artikelnr {font-size:11px;} .shopLijst .artikel .prijzen {font-size:14px;} .shopLijst .artikel .prijzen .vanaf {display: inline-block;} .shopLijst .artikel .bestellen {padding:10px;} .shopLijst .artikel .favorieten {display: none;} /* Einde Lijstweergave 1 */ /* Tegelweergave 2*/ .shopTegel .artikel {display:block; width:25%; float:left; position: relative;} .shopTegel .artikel:nth-of-type(4n+1) {clear:both;} .shopTegel .artikel .inner {*height:auto !important; border: 1px solid #ddd; padding: 10px; margin:5px; position: relative; transition: .3s all ease;} .shopTegel .artikel .inner:hover {box-shadow: 0 0 25px -1px rgba(0, 0, 0, 0.20);} .shopTegel .artikel .inner > a {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; text-indent: -9999px; z-index: 2; background-image: url('images/spacer.gif');} .shopTegel .artikel .afbeeldingHouder {height:200px; line-height: 0;} .shopTegel .artikel .afbeeldingHouder img {width: 90%;} .shopTegel .artikel .afbeeldingHouder .labels img {width:50px; height:auto;} .shopTegel .artikel .omschrijving h2.titel { height: auto; margin: 0; overflow: hidden;} .shopTegel .artikel .omschrijving h2.titel a {display: block; font-size: 13px; font-weight: bold; line-height: 1.25em;} .shopTegel .artikel .omschrijving .artikelnr {font-size:11px; display:none;} .shopTegel .artikel .omschrijving .artikelnr .titel {display:none;} .shopTegel .artikel .omschrijving .merk {display: none;} .shopTegel .artikel .prijzen {color: #707070; font-size: 14px; line-height: 1.35em;} .shopTegel .artikel .prijzen .vanaf {font-size: 11px;} .shopTegel .artikel .prijzen .btwinfo {display: block;} .shopTegel .artikel .bestellen {z-index: 2;} .shopTegel .artikel .bestellen .variatie select {width:100%;} .shopTegel .artikel .bestellen .bestelknop {display: none; width: 75px;} .shopTegel .artikel .bestellen .bestelknop input {width:24px; text-align:center; display:none;} .shopTegel .artikel .favorieten {display:block;} .shopTegel .artikel .verlang {display:block;} .shopTegel .artikel .btwinfo {display: block; line-height: 1.25em; margin: 0 0 10px; padding: 0;} .shopTegel .artikel .inner .betaalinTermijnen {color: #75cf32; font-size: 11px;} .shopTegel .artikel .opDeHoogteHoudenKnop {background-color: #000; border: 0; color: #fff; font-size: 13px; padding: 10px; text-decoration: none; transition: all 0.3s ease 0s; line-height: normal; border-radius: 3px; font-family: "Open Sans", Helvetica, Arial, Sans-Serif; cursor: pointer; position: absolute; top: 0; display: flex; margin: auto; width: 100%; flex-direction: column; text-align: center; box-sizing: border-box; bottom: 0;} /* Einde Tegelweergave 2 */ /* Compacte weergave 3*/ .shopCompact .artikel {background: #fff; position: relative; border-bottom: 1px solid #ddd; transition: all .3s ease;} .shopCompact .artikel:hover {background: #fff; z-index:1;} .shopCompact .artikel > a {display: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 0; text-indent: -9999px;} .shopCompact .artikel .details {left: 0; margin: 0; opacity: 0; overflow: hidden; position: absolute; top: -25px; transition: all 0.5s ease 0s; visibility: hidden;} .shopCompact .artikel:hover .details {opacity:1;} .shopCompact .artikel .inner {display:table; width:100%; border-spacing:5px; table-layout: fixed;} .shopCompact .artikel .inner .col1, .shopCompact .artikel .inner .col2, .shopCompact .artikel .inner .col3, .shopCompact .artikel .inner .col4 {display:table-cell; vertical-align: middle; padding:0; margin: 0;} .shopCompact .artikel .inner .col1 {width:90px;} .shopCompact .artikel .inner .col2 {width:auto;} .shopCompact .artikel .inner .col3 {width:170px; white-space: nowrap;} .shopCompact .artikel .inner .col4 {width:55px; padding: 0 0 0 10px;} .shopCompact .artikel .afbeeldingHouder .label img {width:50px; height:auto;} .shopCompact .artikel .afbeeldingHouder {border: 3px solid #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); display: block; left: 0; margin: 10px; position: absolute; top: 0; width: auto;} .shopCompact h2.titel {margin: 0;} .shopCompact h2.titel a {display: block; font-family: arial; font-size: 13px; margin: 0;} .shopCompact .artikel .prijzen {text-align: right; font-size:14px; margin:0;} .shopCompact .artikel .prijzen .voor {font-size:100%;} .shopCompact .artikel .bestellen input {height: auto; line-height: 1em; padding: 4px; width: 22px; margin:0; float:left;} .shopCompact .artikel .bestellen a.wButBestel {height: 20px; overflow: hidden; padding: 2px; position: relative; text-indent: 9999px; width: 17px; border:0; display: inline-block;} .shopCompact .artikel .bestellen a.wButBestel:before {content:"+"; display:block; margin-bottom:5px;text-indent: 0; text-align:center; font-size:18px; font-weight: bold; line-height: 1em;} .shopCompact .artikel .variatie select {margin-right: 0.5em; width: auto;} .shopCompact .artikel .artikelEenheid {float:right;} .shopCompact .artikel .artikelnr:empty::after {content: "-";} .shopCompact .artikel .artikelnr .titel {display:none;} .shopCompact .artikel .favorieten {display: none;} /* Einde Compacte weergave 3 */ /* Artikel detailscherm */ .artikel.detail .links {float:left; width:50%;} .artikel.detail .rechts {float:right; width:45%;padding-left:20px;} .artikel.detail .artikelTabs {clear:both; margin-top:20px;} .artikel.detail h1 {line-height: 1.25em; text-decoration:none;} .artikel.detail .artikelEenheid {display:block;} .artikel.detail .artikelBestelEenheid {display:block;} .artikel.detail .rechts .bestellen {border-bottom: 1px solid #eee; border-top: 1px solid #eee; margin: 10px 0 5px; padding: 10px 0;} .artikel.detail .bestelknop {display: inline-table; position: relative;} .artikel.detail .bestellen .bestelknop input {display: table-cell; vertical-align: middle; border-radius: 3px 0px 0px 3px; height: 38px; position: relative; text-align: center; width: 40px; margin: 0px 0px 0px 0px; border-color: #e9e7e8;} .artikel.detail .bestellen .bestelknop .wButBestel {display: table-cell; vertical-align: middle; border-radius: 0px 3px 3px 0px; padding: 10px 20px; text-align: center; transition: .3s all ease;} .artikel.detail .bestellen .bestelknop .wButBestel::before {content: ""; font-family: "Font Awesome 5 Pro"; margin: 0px 10px 0px 0px;} .artikel.detail .bestellen .prijzen {display: inline-block; margin: 0px 0px 0px 10px;} .artikel.detail .variatie {margin: 0 0 10px;} .artikel.detail .gekoppeldeCategorie {border-bottom: 1px solid #eee; margin: 0 0 10px; padding: 0 0 10px;} .artikel.detail .gekoppeldeCategorie ul {list-style-type: none; margin: 0; padding: 0;} .artikel.detail .gekoppeldeCategorie li {line-height: 25px;} .artikel.detail .gekoppeldeCategorie li a {color: #000; text-decoration: none;} .artikel.detail .gekoppeldeCategorie li a:hover {color: #909090;} .artikel.detail .gekoppeldeCategorie li a .seperator {margin: 0px 5px;} .artikel.detail .gekoppeldeCategorie li::before {content: ""; font-family: "Font Awesome 5 Pro"; margin: 0px 10px 0px 0px;} .kenmerkgroepKeuze {margin-bottom: 10px;} .kenmerkgroepKeuze.afbeeldingen {display: flex; flex-wrap: wrap; margin-left: -5px; margin-right: -5px;} .kenmerkgroepKeuze.afbeeldingen .artikel {width: calc(25% - 5px); max-width: 90px; position: relative; display: flex; border-width: 2px; border-radius: 3px; box-shadow: none !important; padding: 0; border: 2px solid #d0d0d0; box-sizing: border-box; margin: 2.5px;} .kenmerkgroepKeuze.afbeeldingen .artikel:hover {border-color: #aaa;} .kenmerkgroepKeuze.afbeeldingen .artikel.actief {border-color: #41ae28;} .kenmerkgroepKeuze.afbeeldingen .artikel a.link {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; text-indent: -9999px;} .kenmerkgroepKeuze.afbeeldingen .artikel img {border-radius: 3px;} .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo {position: absolute; z-index: 2; left: 5px; top: 5px; } .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo .kenmerkAfbeelding {position: relative; line-height: 0;} .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo .kenmerkAfbeelding img {border-radius: 50px; overflow: hidden; max-width: 15px; border: 2px solid #fff;} .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo .kenmerkAfbeelding .titel {position: absolute; top: -30px; transform-origin: center; transition: .3s ease 0s; padding: 5px 9px; background: #000; color: #fff; font-size: 12px; line-height: 1.25em; border-radius: 3px; opacity: 0; pointer-events: none; text-align: center; display: inline-block; box-sizing: border-box; white-space: nowrap; left: 50%; transform: translateX(-50%);} .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo .kenmerkAfbeelding:hover .titel {opacity: 1;} .kenmerkgroepKeuze.afbeeldingen .artikel .kenmerkInfo .kenmerkAfbeelding .titel::before {content: ""; width: 8px; height: 8px; background: inherit; position: absolute; left: -50%; right: -50%; margin: 0 auto; bottom: -3px; transform: rotate(45deg); z-index: -1;} .kenmerkgroepKeuze.kenmerkAfbeeldingen {display: flex; flex-wrap: wrap; margin-left: -5px; margin-right: -5px;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel {width: 30px; max-width: 90px; position: relative; display: flex; border-width: 2px; border-radius: 3px; box-shadow: none !important; padding: 2px; border: 2px solid #d0d0d0; box-sizing: border-box; margin: 2.5px;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel:hover {border-color: #aaa;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel.actief {border-color: #41ae28;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel a.link {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; text-indent: -9999px;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel .titel {position: absolute; top: -30px; transform-origin: center; transition: .3s ease 0s; padding: 5px 9px; background: #000; color: #fff; font-size: 12px; line-height: 1.25em; border-radius: 3px; opacity: 0; pointer-events: none; text-align: center; display: inline-block; box-sizing: border-box; white-space: nowrap; left: 50%; transform: translateX(-50%);} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel:hover .titel {opacity: 1;} .kenmerkgroepKeuze.kenmerkAfbeeldingen .artikel .titel::before {content: ""; width: 8px; height: 8px; background: inherit; position: absolute; left: -50%; right: -50%; margin: 0 auto; bottom: -3px; transform: rotate(45deg); z-index: -1;} .kenmerkgroepKeuze.tags .artikel {position: relative; line-height: 1; padding: 10px; border: 2px solid #d0d0d0; display: inline-block; margin: 0 5px 5px 0; border-radius: 3px; font-weight: bold;} .kenmerkgroepKeuze.tags .artikel:hover {border-color: #aaa;} .kenmerkgroepKeuze.tags .artikel.actief {border-color: #41ae28;} .kenmerkgroepKeuze.tags .artikel a.link {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; text-indent: -9999px;} /* Einde artikel detailscherm */ /* Gallery artikeldetail */ .volledigGallery .carousel-cell-groot {position: relative; width: 100%; margin: 0 0 10px;} .volledigGallery .carousel-cell-groot img {position: absolute; top: 0; right: 0; left: 0; bottom: 0; max-height: 100%; max-width: 100%; margin: auto; height: auto !important; width: auto !important;} .volledigGallery .carousel-cell-groot .verhouding {display: block; padding-bottom: 100%;} .flickity-button {opacity: 0; transition: .3s all ease;} .galleryHouder:hover .flickity-button {opacity: 1;} .galleryHouder:hover .flickity-button:disabled {opacity: .3;} .flickity-prev-next-button .flickity-button-icon {position: absolute; left: 35%; top: 35%; width: 30%; height: 30%;} .flickity-button {width: 35px; height: 35px;} .thumbnailGallery .carousel-cell img {margin: 5px; border: 2px solid #f2f2f2; border-radius: 3px; width: auto !important; height: auto !important; max-width: unset !important;} .thumbnailGallery .carousel-cell-yt img {margin: 5px; border: 2px solid #f2f2f2; border-radius: 3px; height: auto !important; max-width: unset !important;} .thumbnailGallery .carousel-cell.is-selected img, .thumbnailGallery .carousel-cell-yt.is-selected img {border-color: #365376;} .thumbnailGallery .flickity-button {height: 100%; background: hsla(0, 0%, 100%, 0.75); border-radius: 0; z-index: 2;} .thumbnailGallery .flickity-button.previous {left: 0;} .thumbnailGallery .flickity-button.next {right: 0;} .volledigGallery .carousel-cell-groot.videoGroot img::before {content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(37, 40, 45, .40);} .volledigGallery .carousel-cell-groot.videoGroot .playKnop {position: absolute; top: 45%; bottom: 0; left: 0; right: 0; margin: 0 auto; text-align: center; color: #FFF; font-size: 50px;} /* Einde gallery artikeldetail */ /* Bestelmatrix */ .bestelmatrixHolder {width: 100%; overflow-x: auto;} .bestelmatrixHolder table {width: 100%; min-width: 1070px;} .bestelmatrixHolder table tr th {text-align: left; border-right: 1px solid #eee;} .bestelmatrixHolder table tr th:last-child {border-right: 0;} .bestelmatrixHolder table tr th .artikel {display: grid; grid-gap: 10px; grid-template-columns: 50px 1fr;} .bestelmatrixHolder table tr th .artikel .omschrijving {display: flex; flex-direction: column;} .bestelmatrixHolder table tr th .artikel .omschrijving h2.titel {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25em; font-size: inherit; font-weight: bold; display: block; margin: auto 0;} .bestelmatrixHolder table tr th .artikel .omschrijving h2.titel a {font-size: inherit; font-weight: inherit;} .bestelmatrixHolder table tr td {border-top: 1px solid #eee; border-right: 1px solid #eee; padding: 10px;} .bestelmatrixHolder table tr td:last-child {border-right: 0;} .bestelmatrixHolder table tr td .artikel h2.titel {overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.25em; font-size: inherit; font-weight: bold; display: block;} .bestelmatrixHolder table tr td .artikel h2.titel a {font-size: inherit; font-weight: inherit;} .bestelmatrixHolder table tr td .artikel .bestellen .bestelknop .alInWinkelmand {margin: auto 0 auto auto; text-align: right; font-weight: bold;} .bestelmatrixHolder table tr td .artikel .bestellen .bestelknop .alInWinkelmand:empty {display: none;} .bestelmatrixHolder table tr td .artikel .bestellen .bestelknop .alInWinkelmand::after { content: "\f07a"; font-family: "Font Awesome 5 Pro"; margin-left: 5px; font-weight: normal; } .bestelmatrixHolder table tr:nth-child(even) td {background: #fafafa;} .bestelmatrixHolder .knoppen { display: flex; margin: 10px 0 0; border-top: 1px solid #eee; padding: 20px 0;} .bestelmatrixHolder .knoppen .bestellen {margin-left: auto;} .bestelmatrixHolder .knoppen .bestellen .klein {text-align: center;} /* Einde bestelmatrix */ /* Vrije Veld Holder */ .vrijveldVeldA {width: 202px;} .vrijveldVeldB {width: 202px;} /* Winkelmandje */ .winkelmandjeKop a:link, .winkelmandjeKop a:visited, .winkelmandjeKop a:hover {text-decoration: none !important; color: #000; font-family: "Ubuntu", "Helvetica Neue",Helvetica Neue,Helvetica,Arial, Sans-Serif; font-size: 17px;} .winkelmandje3, .winkelmandjeLeeg {padding:20px; background:#fff; border-bottom:1px solid #ccc;} .winkelmandje4 {color: #000; font-size: 16px; font-weight: bold; padding: 15px 20px; text-align: right;} .winkelmandje10 {padding: 0px;} .winkelmandje11 {vertical-align: top; text-align:right;} .winkelmandje12 {vertical-align: top; text-align:center; width:20px;} .winkelmandje13 {vertical-align:top;} .winkelmandje14 {white-space:nowrap; vertical-align:top;text-align:right; padding-left: 5px;} .winkelmandje15 {vertical-align: top; padding: 0px 0 0 10px; width: 16px;} .winkelmandje16 {font-size: 10px; padding-right:15px;} /* Einde Winkelmandje */ /* Kassa */ .kassaTitel{background-image: url('images/tabeltitel2.jpg');font-weight: bold;height:26px;} .kassaTitelB{width:110px;text-align:right;} .kassaTitelC{text-align:right;padding-right:15px;width:95px;} .kassaTitelD{width:20px;} .kassaArtikelen {padding:1px;} .shopLijst1Prijs1A_1, .shopLijst1Prijs1A_2 {font-size:18px;font-weight:normal;} /* Einde Kassa */ .shopLijst1Variatie_1, .shopLijst1Variatie_2 {font-size: 11px; font-weight: normal; text-decoration: none;} .artT2AA_1, .artT2AA_2 {padding-left:10px; text-align:right; vertical-align:top; width:150px;} .shopNavigatie {margin: 10px 0; vertical-align: middle; width:100%;} .shopNavigatieVorige {text-align:left; width:30%;} .shopNavigatieVolgende {text-align:right; width:30%;} .shopNavigatieLijst {text-align:center; width:40%;} .shopNavigatie .button {background-color: #e9e7e8; border-color: #e9e7e8; color: #777;} .artT4_1, .artT4_2 {height:60px;} .artT4A_1, .artT4A_2{font-weight: bold; font-size: 18px; margin-top:5px;} .artT4B_1, .artT4B_2{width:50px;} .artT4C_1, .artT4C_2{width:30px;} .artT4D_1, .artT4D_2{font-weight: bold; text-align:center;} .artT4E_1, .artT4E_2{font-weight: bold; text-align:right; padding-right:15px; white-space: nowrap;} .winkelmandje21 {background-image: url('images/tabeltitel2.jpg'); font-weight: bold; height:26px;} .winkelmandje22 {background-image: url('images/tabeltitel2.jpg'); font-weight: bold; height:26px;} .artT21B {width:80px; vertical-align:middle; text-align:right;} .artT21C {text-align:right; padding-right:15px; vertical-align:middle; width:125px;} .artT22B {width:200px; vertical-align:middle; text-align:right;} .artT22C {text-align:right; padding-right:15px; vertical-align:middle; width:120px;} .artT23AA, .artT23BB, .artT23CC{background-color: #EFEFEF; height:26px; padding:3px; text-align:right; width:80px;} .artT23A, .artT23B, .artT23C{height:22px; padding:3px; text-align:right;} .artT23DD {background-color: #EFEFEF;} .lev1AA {height:10px;} .lev1 {height:26px;} .lev1A{height:30px; width:25px;} .lev1B{padding-top:2px;} .lev1C{width:100px; padding-right:15px; text-align:right; font-weight: bold;} .lev1Ar, .lev1Br, .lev1Cr {height:2px; border-bottom:1px solid #BFBFBF;} .lev1Bb, .lev1Cb{border-top:1px solid #BFBFBF; background-color: #EFEFEF;} .gewA {height:21px; border-bottom:1px solid #BFBFBF; border-left:1px solid #BFBFBF; background-color: #EFEFEF; padding-top:5px;} .lev2A {width:30px; vertical-align:top; height:26px; padding-top: 4px;} .lev2B {vertical-align:top; height:22px; padding-top:6px; padding-left: 4px;} .lev2C {width:100px; padding-right:15px; text-align:right; font-weight: bold; background-color: #EFEFEF; border-top:1px solid #BFBFBF;} .lev3 {height:10px;} .nawA {height:21px; width:260px; padding-left:5px; white-space:nowrap; font-size:12px;} .lev4A {text-align:center;} .lev5A {width:30px;} .lev10 {background-image: url('images/tabeltitel2.jpg'); width:100%; height:25px; padding-left:5px; font-weight: bold;} .lev11 {width:100%; padding-left:5px; background-color: #EFEFEF;} .lev11A {width:250px;} .lev12 {padding: 5px;} .lev12A {width:100px; padding:1px;} .lev12B {width:150px; padding:1px;} .lev13 {padding:5px;} .lev13A {vertical-align:top;} .lev13B {height:20px; text-align:left;} #vwShow {background-color: #fefefe; border: 1px solid #ccc; border-radius: 0; height: 200px; overflow: auto; padding: 10px;} #vwShow:hover {background-color:#F2F2F2; overflow:auto;} /* Artikel tabsV2 */ .tabsV2 {clear:both;} .tabsV2 .titels {display:flex; padding:0;} .tabsV2 .titels > div {top:1px; font-weight: bold; border-top:3px solid #fff; padding: 10px 20px; border-bottom:0; cursor: pointer; text-align: center; position: relative; background:#f5f5f5; margin-right: 1px;} .tabsV2 .titels > div.actief {background-color: #fff; border: 1px solid #eee; border-bottom:1px solid #fff; border-top:3px solid #4bace0; color: #000; z-index:1;} .tabsV2 .titels > div:hover {color: #000;} .tabsV2 .inhoud {clear:both; border:1px solid #eee; padding:20px; box-sizing: border-box; background: #fff; position: relative;} .tabsV2 .inhoud > div {display:none;} .tabsV2 .inhoud > div.actief {display:block;} .tabsV2 .inhoud > div {display:none;} /* Einde artikel tabsV2 */ /* Menu style ------------- */ .catMenu0ul,.catMenu1ul,.catMenu2ul,.catMenu3ul {margin: 0 !important; list-style:none; padding:0 !important;} .catMenuLink0li, .catMenuLink0liSel { background: rgba(0, 0, 0, 0) url("images/pijl_blauw.png") no-repeat scroll right 0 top 50%; border-bottom: 1px solid #d2d2d2; color: #777 !important; display: block; font-family: "Ubuntu",Helvetica Neue,Helvetica Neue,Helvetica,sans-serif !important; font-size: 15px; font-weight: 500; line-height: 1.75em; margin: 0; padding: 4px 0; text-decoration: none !important; } .catMenuLink0liSel {color: #000 !important;} .CMSMenu1ul > li:last-child a {border: none;} .catMenuLink1li, .catMenuLink1liSel { color: #777 !important; display: inline-block; font-family: "Ubuntu", Helvetica Neue,Helvetica Neue,Helvetica,Sans-Serif !important; font-size: 13px; line-height: 1.75em; text-decoration: none !important; font-weight: normal; margin:2px 0; } .catMenuLink1liSel {color: #000 !important;} .catMenuLink2li, .catMenuLink2liSel { color: #777 !important; display: inline-block; font-family: "Ubuntu", Helvetica Neue,Helvetica Neue,Helvetica,Sans-Serif !important; font-size: 13px; line-height: 1.75em; text-decoration: none !important; font-weight: normal; margin:2px 0; margin-left: 10px; } .catMenuLink2liSel {color: #000 !important;} .catMenuLink3li, .catMenuLink3liSel { color: #777 !important; display: inline-block; font-family: "Ubuntu", Helvetica Neue,Helvetica Neue,Helvetica,Sans-Serif !important; font-size: 13px; line-height: 1.75em; text-decoration: none !important; font-weight: normal; margin:2px 0; margin-left: 20px; } .catMenuLink3liSel {color: #000 !important;} .catMenu2li > a:hover, .catMenu3li > a:hover, .catMenu4li > a:hover {text-decoration: underline !important;} .catMenu2liSel > a:hover, .catMenu3liSel > a:hover, .catMenu4liSel > a:hover {text-decoration: underline !important;} /* Einde Menu */ .artAfb_1, .artAfb_2 { height: auto !important; width: auto !important; max-width: 100%; } .dochterArtikel {height: auto; width: 110px; display: inline-block;} .artAfb_ { height: auto !important; width: auto !important; max-width: 100%; } #voorraadTT a, #voorraadTT a:link, #voorraadTT a:visited {text-decoration:none; cursor: pointer;} #voorraadTX {font-size:11px;white-space:nowrap;float:left; line-height: 91%;} .voorraadTT {white-space:nowrap;float:left; font-size:11px;} .voorraadTT a, .voorraadTT a:link, .voorraadTT a:visited {text-decoration:none; cursor: pointer;} .voorraadTX {font-size:11px;white-space:nowrap;float:left; line-height: 91%;} #lijst3TT {width: 7em;white-space:nowrap;} #lijst3TT a, #lijst3TT a:link, #lijst3TT a:visited {text-decoration:none; cursor: pointer;} .tooltip {position: relative; display: inline-block; cursor: pointer;} .tooltip .titel {padding:5px 10px; margin:0.5em 0; background-color: #eee; border-radius:5px;} .tooltip .omschrijving {background: #FFF; box-shadow:1px 1px 3px #ccc; border-radius: 5px; top: 125%; color: inherit; border: 1px solid #ccc; padding: 10px; position: absolute; transition: .3s all ease; left: 50%; font-size: inherit; transform: translateX(-50%); opacity: 0; pointer-events: none; width: 400px; z-index: 40; line-height: 1.5em;} .tooltip:hover .omschrijving {opacity: 1;} .tooltip::before {content: "\f059"; font-family: "Font Awesome 5 Pro"; font-weight: bold; color: #365376; display: none;} .WB-knop-Div {display:block;} .WB-knop {background:url("images/menuActive.png") repeat scroll -2px -2px transparent; height:23px;} .WB-knop:hover {background:#333333; height:23px;} .WB-knop-a {color: #fff !important; display: block; line-height: 1.2em; padding: 5px 10px; text-decoration: none !important; text-shadow: 0 1px 1px #000;} .WB-knop-a:hover {color: #fff !important; text-decoration: none !important; text-shadow: 1px 1px 2px #000;} #adressenlijst .adres {margin-bottom: 10px; padding: 0 0 10px; border-bottom:1px solid #eee;} #adressenlijst .adres .beschrijving {width:215px;} .account_holder .beschrijving {width:215px;} #adressenlijst .laatsteArtikel {border-bottom:0px; margin-bottom:0px; padding-bottom:0;} .kopFactuuradres, .kopAfleveradres {background-image: url('images/tabeltitel2.jpg'); height:25px; padding-left:5px; font-weight: bold;} .kopieer {float: right;padding-right:5px;} .fac2, .afl2 {padding:2px;border-top:1px solid #BFBFBF;} .nawFac, .nawAfl {height:21px; width:230px; padding-left:5px;} .nawFac2, .nawAfl2 {width:30px; vertical-align:top; padding-top:6px;} .nawFac3, .nawAfl3 {padding-left:5px;} .nawA2 {height:5px;} /* Account wijzigen 3.0 */ .blokholder.accountWijzigen .titel {color: #365376; font-size: 16px; font-weight: bold; margin: 20px 0 0; background: #eee; padding: 10px 15px; border-radius: 2px;} .blokholder.accountWijzigen .content {padding:15px;} .accountMelding {background: #eabdbc40; color: #ef6868; padding: 14px; text-align: center; border-radius: 3px; font-style: italic; font-weight: bold; border: 2px solid #fdc8c8;} .clearTabel {width: 100%; padding: 0; border-spacing: 0; margin: 0 0 10px;} .clearTabel td {padding: 0;} .clearTabel .beschrijving {vertical-align: middle; padding:5px 0;} .clearTabel .invoer {vertical-align: middle; padding:5px 0;} .accountWijzigen input[type="text"], .accountWijzigen input[type="password"], .accountWijzigen input[type="email"], .accountWijzigen input[type="tel"], .accountWijzigen textarea {margin:0; width:100%; box-sizing: border-box;} .accountWijzigen textarea {height:80px;} .accountWijzigen select {width:100%;} .typeKlant div, .geslacht div {display:inline-block; margin-right:5px; position: relative;} .typeKlant input[type="radio"], .geslacht input[type="radio"] {display: none;} .typeKlant label, .geslacht label {display: inline-block; background: #fff; padding: 7px 15px; padding-left:35px; cursor: pointer; transition: all .3s ease; border:1px solid #ccc; border-radius:3px; text-transform: capitalize;} .typeKlant input[type="radio"]+label:hover, .geslacht input[type="radio"]+label:hover {border-color:#41ae28;} .typeKlant input[type="radio"]:checked+label, .geslacht input[type="radio"]:checked+label {border-color:#41ae28; color:#000;} .typeKlant input[type="radio"]+label::before, .geslacht input[type="radio"]+label::before {content: "\f0c8"; font-size: 15px; font-family: "Font Awesome 5 Pro"; font-weight: bold; line-height: 1em; color:#ccc; position: absolute; top:13px; left:13px; transition: all .3s ease; } .typeKlant input[type="radio"]:checked+label::before, .geslacht input[type="radio"]:checked+label::before {content: "\f14a"; color: #41ae28;} .nawVeld {position: relative; margin: 0 0 8px 0;} .nawVeld.labelBinnenkant input {padding: 12px 10px;} .nawVeld.labelBinnenkant textarea {padding: 12px 10px;} .nawVeld.labelBinnenkant label {box-sizing: border-box; display: block; font-size: 10px; line-height: 1; opacity: 0; overflow: hidden; padding: 7px 10px; pointer-events: none; position: absolute; text-overflow: ellipsis; top: 0; text-align: left; transform: translateY(3px); transition: all .2s ease-out; user-select: none; white-space: nowrap; width: 100%; z-index: 1;} .nawVeld.labelBinnenkant.nawVeldGevuld label {opacity: 1; transform: none;} .nawVeld.labelBinnenkant.selectieVeld label {opacity: 1;} .nawVeld.labelBinnenkant.nawVeldGevuld input {padding-top: 18px; padding-bottom:6px;} .nawVeld.labelBinnenkant.nawVeldGevuld textarea {padding-top: 18px; padding-bottom:6px;} .bedrijfsGegevens {transition: all .3s ease; max-height:0px; overflow: hidden; opacity: 0;} .bedrijfsGegevens.zakelijkTonen {max-height: 300px; display: block; opacity: 1} .btwcontrole {padding: 5px; line-height: 1; background: #eee; border-radius: 3px; margin: 5px 0 0 10px; display: inline-block; font-size: 11px;} .btwcontrole:empty {display: none;} .btwcontrole.goed {background: #41ae28; color: #fff;} .btwcontrole.fout {background: #d55929; color: #fff;} .vatGegevens .btwGegevens {padding: 10px; line-height: 1.25em; background: #fff; border-radius: 3px; margin: 5px 0 0 10px; font-size: 12px; display: block;border: 1px solid #ccc; color: #000;} .accountWijzigen .contactpersoon {display:flex;} .accountWijzigen .contactpersoon .voornaam {width:39%; margin-right:10px;} .accountWijzigen .contactpersoon .tussenvoegsel {width:22%; margin-right:10px;} .accountWijzigen .contactpersoon .achternaam {width:39%;} .accountWijzigen .telefoon {display: flex;} .accountWijzigen .telefoon .vast {width:50%; margin-right:10px;} .accountWijzigen .telefoon .mobiel {width:50%;} .postPlaats {display: flex;} .postPlaats .postcode {width:30%; margin-right:10px;} .postPlaats .plaats {width:70%;} .straat {display: flex;} .straat .straatnaam {width:70%; margin-right:10px;} .straat .huisnummer {width:30%;} .adresHolder {display: block; width: 100%; border-top: 1px solid #eee; padding: 10px 0;} .adresHolder:first-child {border: 0;} .adresHolder .kop {font-size: 16px; font-family: "Open Sans", Helvetica, Arial, Sans-Serif; font-weight: bold; margin: 0px 0 10px;} .adresHolder .adressen {display: flex; flex-wrap: wrap;} .adresHolder .adressen .item {padding: 10px; margin: 0 10px 10px 0; border: 2px solid #ccc; border-radius: 3px; position: relative; flex-basis: calc(33.333% - 10px); box-sizing: border-box; display: flex; flex-direction: column-reverse;} .adresHolder .adressen .item.default {border: 2px solid #41ae28 !important;} .adresHolder .adressen .item.default:before {background: #41ae28;opacity: 1;} .adresHolder .adressen .item.default .defaultTekst {position: absolute; right: 0; top: 0; padding: 4px 6px; font-size: 12px; line-height: 1; border-bottom-left-radius: 3px; transition: all .3s ease; background: #41ae28; color: #fff;} .adresHolder .adressen .item .adresRow .bedrijfsnaam {font-weight: bold;} .adresHolder .adressen .item .adresRow .knoppen {margin: 5px 0 0;} .adresHolder .adressen .item .adresRow .knoppen a {padding: 8px; text-decoration: none; margin-right: 5px; color: #606060; background: #eee; line-height: 1; display: inline-block; border-radius: 3px;} .adresHolder .adressen .item .adresRow .knoppen a i {margin-right: 5px;} .adresHolder .adressen .item .adresFormulier.open td {display: block;} .adresHolder .adressen .item .adresFormulier.open .beschrijving {padding: 0;} .adresHolder .adressen .item .adresFormulier.open td.invoer {padding: 0px 0 10px;} .adresHolder .adressen .item .adresRow.open {display: none;} .adresHolder .adressen .item.open {position: absolute; left: 20px; right: 20px; bottom: 20px; z-index: 100; background: #fff; box-shadow: 0 0px 50px -8px rgba(0,0,0,.25); padding: 35px;} #adressenlijst {position: relative;} #adressenlijst .adresHolder {display: block; width: 100%;} #adressenlijst .adresHolder .adresFormulier {display: none;} #adressenlijst .adresHolder .adresFormulier.open {display: block;} .adresToevoegenFormulier {display: none;} .adresToevoegenFormulier.open {display: block; background: #eee; padding: 30px; margin: 20px 0 0;} .adresToevoegenFormulier.open select {background-color: #fff;} /* Zoekveld Orders */ .zoekenOrders {display: table; position: relative; z-index: 13; margin: 0 0 15px; border: 1px solid #c4c4c4;} .zoekenOrders.open {z-index: 20;} .zoekenOrders .veld {display: table-cell; z-index: 10; position: relative; overflow: hidden; border-radius: 3px 0 0 3px;} .zoekenOrders .veld input {border: 0; box-shadow: none; padding: 10px; font-size: 14px; font-style: italic; border-radius: 0px; margin: 0; width: 150px; transition: all .3s ease; line-height: 1.1em;} .zoekenOrders .knop {display: table-cell; color:#999; position: relative; padding: 5px 12px; transition: all .3s ease; cursor: pointer; z-index: 10; background-color: #fff;} /* Einde Zoekveld Orders */ /* Order status */ .account_txtBlok {margin-bottom:15px;} .account_txtBlok:after {content: " "; visibility: hidden; display: block; height: 0; clear: both;} /* Einde order status */ .mijnAccountSortOptie {display: flex; align-items: center; margin: 0 0 15px;} .mijnAccountSortOptie .zoekenOrders {margin: 0;} .mijnAccountSortOptie #statusLijst {margin-left: auto;} .mijnAccountAlleFacturenDetailHolder h1, .mijnAccountAlleOrdersDetailHolder h1 {margin: 10px 0;} .detailOrderHolder {display: flex; flex-wrap: wrap; margin: 15px -10px 15px; align-items: flex-start;} .detailOrderHolder .detailOrderBlok {width: calc(50% - 20px); font-size: 13px; border: 1px solid #eee; box-sizing: border-box; margin: 10px; border-radius: 3px;} .detailOrderHolder .detailOrderBlok table.lijst {margin: 0;} .detailOrderHolder .detailOrderBlok table.lijst td {padding: 5px 10px} .detailOrderHolder .detailOrderBlok table.lijst tr:last-child td {border-bottom: 0;} .detailOrderHolder .detailOrderBlok .titel {font-weight: bold; color: #666; text-transform: uppercase;} /* Einde Account wijzigen 3.0 */ /* Winkelmandje opslaan */ .mijnAccountOrderHolder .item {position: relative; background-color: #fff; border: 1px solid #dfdfdf; border-radius: 3px; display: flex; margin-bottom: 10px;} .mijnAccountOrderHolder .item a.link {display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1;} .mijnAccountOrderHolder .item .inhoud {display: flex; flex-direction: column; padding: 15px; border-right: 1px dashed #dfdfdf; flex: 1;} .mijnAccountOrderHolder .item .inhoud .omschrijving {color: #000; font-family: "Open Sans", Helvetica, Arial, Sans-Serif; font-style: normal; font-weight: bold; line-height: 1.25em; font-size: 14px; overflow: hidden; display: block; margin: 0; hyphens: auto; -webkit-hyphens: auto;} .mijnAccountOrderHolder .knoppen {margin-top: auto;} .mijnAccountOrderHolder .knoppen a {background-color: rgba(54, 82, 95, .1); color: #365276; border-radius: 3px; display: inline-block; font-size: 12px; padding: 5px 8px; position: relative; z-index: 2; text-decoration: none; transition: all 0.3s ease 0s; line-height: normal; margin: 5px 5px 0 0;} .mijnAccountOrderHolder .knoppen a i {margin-right: 5px;} .mijnAccountOrderHolder .knoppen a.activeren {background-color: #365276; color: #fff;} .mijnAccountOrderHolder .knoppen a.verwijderen:hover {background-color: rgba(239, 104, 104, .1); color: #ef6868;} .mijnAccountOrderHolder .subtotaal {line-height: 1.5em;} .mijnAccountOrderHolder .subtotaal .prijs {display: block; font-weight: bold; font-size: 17px; color: #000;} .mijnAccountOrderHolder .item .artikelen {display: inline-flex; width: 330px; margin: auto 0 auto auto; padding: 10px;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder {position: relative; width: calc(33.333% - 10px); margin: 5px; border: 1px solid #dfdfdf; border-radius: 3px; overflow: hidden; box-sizing: border-box;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder img {position: absolute; top: 0; right: 0; left: 0;bottom:0; max-height: 100%; max-width: 100%; margin: auto; height: auto !important; width: auto !important;padding: 5px; box-sizing: border-box;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder .verhouding {display: block; padding-bottom: 100%;} /* fancy */ .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder:nth-child(1)::before {transition: .3s all ease .1s;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder:nth-child(2)::before {transition: .3s all ease .2s;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder:nth-child(3)::before {transition: .3s all ease .3s;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder:before {content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; pointer-events: none;} .mijnAccountOrderHolder .item:hover .artikelen .afbeeldingHouder:before {background: rgba(54, 82, 95, .06);} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder.plusje {display: flex; border: 1px dashed #dfdfdf;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder.plusje .plus {margin: auto; font-size: 20px; color: #aaa;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder.plusje .meeraantal {position: absolute; top: 0; right: 0; background: #365276; line-height: 1; padding: 5px 8px; color: #fff; border-radius: 0 3px 0px 3px; font-size: 13px; vertical-align: baseline; font-weight: bold;} .mijnAccountOrderHolder .item .artikelen .afbeeldingHouder.plusje .meeraantal span {font-weight: normal; margin-left: 2px;} .mijnAccountOrderHolder .item .pijl {display: flex; font-size: 20px; color: #aaa; padding: 15px 15px 15px 0;} .mijnAccountOrderHolder .item .pijl i {margin: auto; font-weight: bold;} .mijnAccountOrderHolder.detail .omschrijving {display: flex; margin: 0 0 10px; background: #fff; border: 1px solid #dfdfdf; border-radius: 3px; padding: 10px 15px;} .mijnAccountOrderHolder.detail .omschrijving .titel {color: #365376; font-size: 16px; font-weight: bold; margin: auto; margin-left: 0; line-height: 1.25em;} .mijnAccountOrderHolder.detail .omschrijving .titel .datum {color: #666; font-size: 13px; font-weight: normal;} .mijnAccountOrderHolder.detail .omschrijving .knoppen {margin: auto; margin-right: 0;} .mijnAccountOrderHolder.detail .omschrijving .knoppen a {margin: 0 0 0 5px;} .mijnAccountOrderHolder.detail table {width: 100%; margin: 0 0 10px; background: #fff; border: 1px solid #dfdfdf; border-radius: 3px; padding: 10px 15px;} .mijnAccountOrderHolder.detail .onderkant {display: flex; margin: 0 0 10px; background: #fff; border: 1px solid #dfdfdf; border-radius: 3px; padding: 10px 15px; } .mijnAccountOrderHolder.detail .onderkant .formulier {margin: 0;} .mijnAccountOrderHolder.detail .onderkant .formulier form {display: flex;} .mijnAccountOrderHolder.detail .onderkant .formulier form .nawVeld {margin: 0 5px 0 0;} .mijnAccountOrderHolder.detail .onderkant .subtotaal {line-height: 1.5em; text-align: right; margin: auto; margin-right: 0;} /* Einde winkelmandje opslaan */ .shopLijst3LabelNieuw3A {position: absolute;z-index: 5;margin-top:3px;margin-left:2px;} .shopLijst3LabelAanbieding3A {position: absolute;z-index: 5;margin-top:3px;margin-left:2px;} .praT {width:100%;} .prAanb1, .prAanb3{ font-size: 11px; font-weight: normal; position: absolute; text-transform: lowercase; visibility: hidden;} .prAanb2{text-decoration:line-through; font-size:13px;} .prAanb4{color: #4bace0; position:relative; left:7px;} /* Tell A friend */ .tafT {border-spacing:3px;} .taf1 {width:150px;} #taf10 {width:250px;height:50px;} /* Einde Tell A friend */ /* Prijsafspraken en kortingstabellen */ .kortTab1 {width:100%;} .kortTab2 {font-weight: bold; border-bottom:1px solid #BFBFBF;} .kortTab1 .prijsNaKorting {font-weight: bold;} .houdMeOpHoogteVoorraad {background: #eee; padding: 20px; margin-bottom: 15px;} .houdMeOpHoogteVoorraad input#houdOphoogteEmail {margin-bottom: 20px;} .prijsafspraakLos .kortTab1 .toelichting {display:none;} .prijsafspraakLos .kortTab1 .toelichting span {display:none;} .prijsafspraakLos .kortTab1 {width:auto;} .prijsafspraakInLijst .kortTab1 .toelichting {display:none;} .prijsafspraakInLijst .kortTab1 .toelichting span {display:none;} .prijsafspraakInLijst .kortTab1 {width:auto;} /* Einde prijsafspraken en kortingstabellen */ /* Rechterkant artikelen */ .artRechtsAfb1 {float:left; height:96px;width:96px;border:1px solid #BFBFBF;text-align:center;vertical-align: middle;} .artRechtsAfb2 {height:96px;width:96px;text-align:center;vertical-align: middle; } .artRechtsOmsc1 {width: 106px;float:left;height:110px;padding-left:10px;} .artRechtsOmsc2 {max-height:72px;overflow:hidden;} .artRechtsOmsc3 {font-size: 15px; font-weight: bold;} /* Up-Selling */ .UPScatHeader {height:52px; vertical-align:middle;} .UPScontainer {width: 100%; margin: 0 auto;} .UPScatPlaatje {padding: 0 0 0 12px; width:90px;} .UPSacc_trigger {padding: 0; background-color: #fff; height: 52px; line-height: 34px; width: 100%; font-weight: bold; float: left; box-shadow: 0 1px 4px rgba(0,0,0,.1); margin:10px 0;} .UPSacc_trigger a {text-decoration: none; display: block; padding: 0 0 0 1px;} .UPSactive {background-position: left bottom;} .UPSacc_container {overflow: hidden; clear: both;} .UPScontainer .active {box-shadow: 0 1px 4px rgba(0,0,0,.3);} /* Einde Up-Selling */ /* Serieartikelen */ .SERIEcatHeader {height:52px; vertical-align:middle;} .SERIEcontainer {width: 100%; margin: 0 auto;} .SERIEcatPlaatje {padding: 0 0 0 12px; width:90px;} .SERIEacc_trigger {padding: 0; margin: 0; background-color: #CFCFCF; height: 52px; line-height: 34px; width: 100%; font-weight: bold; float: left;} .SERIEacc_trigger a {text-decoration: none; display: block; padding: 0 0 0 1px;} .SERIEactive {background-position: left bottom;} .SERIEacc_container {overflow: hidden; clear: both;} /* Einde Serieartikelen */ /* Kortingsboncode */ .kbcode {width:100%; padding:5px; background-color: #EFEFEF;} .kbcode3 {font-weight: bold; text-align:right; padding-right:10px;} /* Paneelopties */ .PaneelHolder {width: 100%; float:left;} .PaneelUser {display: block; float: right; font-size: 10px; font-style: italic; line-height: 1em; padding: 5px 0;} /* Paneel Zoekveld */ .zoekVeld0A {float: left; width: 198px;} .zoekVeld0B {height: 16px; padding-top: 7px; position: absolute; right: 12px; width: 16px;} #zoekWoordID { line-height: 26px; padding-left: 5px;} /* Wachtwoord en registreren */ .inloggen3 {float:left;} .PaneelKnop1, .PaneelKnop2 {float: left; font-size: 10px; line-height: 12px; text-indent: 5px;} .PaneelKnopLink1, .PaneelKnopLink2 {text-decoration: none!important;} .PaneelTextField {width: 167px; height: 26px; line-height: 26px; padding-left:5px;} /* Einde wachtwoord en registeren */ /* Andere paneelknoppen */ .PaneelKnop3, .PaneelKnop4, .PaneelKnop5, .PaneelKnop6 {float:left; line-height:30px; padding:0; position:relative; width:100%;} .PaneelKnopLink3, .PaneelKnopLink4, .PaneelKnopLink5, .PaneelKnopLink6 {text-decoration: none!important; font-weight: bold!important; display: block;} .PaneelKnopImg3, .PaneelKnopImg4, .PaneelKnopImg5, .PaneelKnopImg6 {padding:6px 6px 6px 0px; float: left;} /* Einde Andere paneelknoppen */ .offertePR0 {width:260px;} .offertePR1 {width:260px;} .offertePR2, .offertePR2 a:link, .offertePR2 a:visited {float:left; text-decoration:none !important; position:relative; top:-10px;} .offertePR3 {padding-right:5px; } /* Variatie invulvelden */ .VOVIP {border:1px dashed #BFBFBF; color:#555555;width:202px;} .VOVTA {border:1px dashed #BFBFBF; height:40px; color:#555555; width:202px;} /* Vrije Veld Holder */ .vrijveldVeldA {width: 202px;} .vrijveldVeldB {width: 202px;} /* Winkelmandje compact weergave en afrekenscherm */ .wCVarLink {display:block} .wVarTitle, .wCVarTitle {display: block;} .wVarText, .wCVarText {display: block;} .wVarCustom, .wCVarCustom {background:#fff; display:block; font-style:italic;} /* Opmerkingen bij artikel */ .opmerkingVeld {width: 240px; font-size:11px; border:1px solid #BFBFBF;} /* Afrekenen afbeeldingen */ .levAfbeelding1, .betAfbeelding1 {float: left; margin-right: 10px;} /* Moederartikel */ #mArt_titel {display:block; padding:0;} #mArt_holder {text-decoration:none; margin-bottom:0.5em;} .mArt_tabel1_td {border:1px solid #ccc; background-color:#fff;} .mArt_tabel1_td:hover {border:1px solid #000;} /* Upload preview */ .upPreHolder {width: 400px; height: 400px; background:#ddd; overflow: hidden;} .upPrePNG {position: absolute; width:400px; height: 400px; z-index: 1;} .upPreImage {height: 400px; overflow: hidden; position: absolute; width: 400px;} .upPreImage2 {width:2000px; height: 2000px; position: absolute; top:-800px; left: -800px;} #pdf2 {width:350px; height: 180px; position: absolute; top:100px; left: 100px; background:#ddd; overflow: hidden; visibility: hidden; z-index: 9991; margin: 15px; padding: 15px; border:1px solid #ccc; background-color: #fff; box-shadow: 0px 0px 15px #000;} .pdf3 {margin:0px; padding: 0px; border:0;} /* Cadeaubon */ .cadeauHolder {background: #eee; border: 1px solid #ccc; padding: 15px; position: relative; } .cadeauHolder .cadeauAfbeeldingHolder img {border: 1px solid #ccc;} .cadeauHolder h2 {border-bottom: 1px solid #ccc; margin: 10px 0 20px; padding: 0 0 10px;} .cadeauHolder .cadeauTextField, .cadeauHolder .cadeauTextArea {display: block; width: 240px; margin: 0 0 5px;} .cadeauHolder .cadeauTextArea {height: 90px;} .cadeauHolder .cadeauBedrag span {font-size: 25px; margin-right: 10px;} .cadeauHolder .cadeauBedrag .cadeauTextField {display: inline-block; font-size: 23px; padding: 5px; width: 216px;} .cadeauHolder .cadeauGeldig {font-size: 11px;} .cadeauHolderOpties {padding: 10px 0;} .cadeauHolderOpties .cadeauKnop {float: right;} .cadeauHolderOpties .cadeauDirectA {float: left;} /* Einde cadeaubon */ #mollieKnop {background-color: #cfc; padding: 5px; font-weight: bold;} /* Afrekenscherm v4.0 */ .shopLijst2ContentPrijs .vanaf, .shopLijst1Prijs1_1 .vanaf, .shopLijst1Prijs1_2 .vanaf { font-size: 10px; font-weight: normal;} .shopCategorieHolder ol, .shopCategorieHolder ul {list-style-type: none; margin: 0;} .shopCategorieHolder a:link, .shopCategorieHolder a:visited {text-decoration:none;} .shopCategorieLijst2 .kolomA {float:left; width:40%; margin-right: 10px;} .shopCategorieLijst2 .kolomB {float:left; width:40%;} .shopCategorieLijst3 .kolomA {float:left; width:30%; margin-right: 10px;} .shopCategorieLijst3 .kolomB {float:left; width:30%; margin-right: 10px;} .shopCategorieLijst3 .kolomC {float:left; width:30%;} .shopCategorieLijstDiep ul {padding-left:0;} .shopCategorieLijstDiep .ankers {display:none;} .shopCategorieLijstDiep .titel {margin:5px;} .shopCategorieLijstDiep .titelMet {font-weight:bold; margin:5px;} .shopCategorieLijstDiep .inhoud {background: none repeat scroll 0 0 #fff; border-radius: 5px 5px 5px 5px; padding: 10px 15px; border: 1px solid #CACACA;} .shopCategorieLijstDiep .kolomA {float:left; width:30%; margin-right: 10px;} .shopCategorieLijstDiep .kolomB {float:left; width:30%; margin-right: 10px;} .shopCategorieLijstDiep .kolomC {float:left; width:30%;} .btwNummer {text-transform:uppercase;} /* Orderproces volledig */ /* Stappenbalk orderproces Type 1 */ .stappenbalk {margin-bottom:30px;} .stappenbalk::after {content:""; display:table; clear:both;} .stappenbalk ul {list-style-type: none; padding: 0; margin: 0; } .stappenbalk li {display: block; float:left; box-sizing: border-box; width:25%; text-align: center; font-size:10px; line-height:1.25em; text-transform: uppercase; position:relative;} .stappenbalk li::before {background-color: #ddd; border-radius: 100px; color: #fff; content: ""; display: block; font-size: 13px; font-weight: bold; height: 25px; line-height: 25px; position: relative; text-align: center; width: 25px; margin:0 auto 5px;} .stappenbalk li::after {content:""; border-top:2px solid #ddd; width:100%; position: absolute; top:12px; left:50%; z-index: -1;} .stappenbalk li:last-child::after {display: none;} .stappenbalk .stap1:before {content: "1";} .stappenbalk .stap2:before {content: "2";} .stappenbalk .stap3:before {content: "3";} .stappenbalk .stap4:before {content: "4";} .stappenbalk .bezig .naam {color: #000; font-weight: bold;} .stappenbalk .bezig::before {background-color: #000;} .stappenbalk .klaar::before {display: none;} .stappenbalk .klaar::after {border-color:#41ae28;} .stappenbalk .klaar a {color: inherit; text-decoration: none; display: block;} .stappenbalk .klaar a::before {border-radius: 100px; display: block; font-size: 13px; font-weight: bold; height: 25px; line-height: 25px; position: relative; text-align: center; width: 25px; background-color: #41ae28; color: #fff; content: ""; font-family: "Font Awesome 5 Pro"; margin:0 auto 5px;} /* Einde stappenbalk Type 1 */ /* Losse orderproces elementen */ .valuta {margin-right:0.25em;} .stappenKnop {margin-top:10px;} .stappenKnop a.volgendeStap {width:100%; display:block; text-align: center; padding:10px; box-sizing: border-box; font-size:15px; font-weight: bold;} .volgendeStap.disabled {opacity:.5; pointer-events: none;} .pdfKnop {float:left;} a.wButControleer, a.wButControleerBTW, a.wButVoorwaarden {margin-top: 5px;} .offertePdf {bottom: 15px; left: 20px; position: absolute;} /* Einde Losse orderproces elementen */ /* Orderproces Stap 1 */ .stap .blokholder {margin-bottom: 20px;} .stap .blokholder > .titel {color: #000; font-size: 16px; font-weight: bold; background: #eee; padding: 10px 15px; border-radius: 5px 5px 0 0;} .stap .blokholder > .content {padding:15px; background:#f5f5f5; border-radius:0 0 5px 5px;} .stap .kassaArtikelen {margin-bottom:20px; border-bottom:2px solid #ddd;} .kassaArtikelen table {width:100%;} .kassaArtikelen th {text-align: left; font-size:90%; text-transform:uppercase; *color: #000; padding-bottom:10px; border-bottom:2px solid #ddd; line-height:1.25em; vertical-align: bottom; white-space: nowrap;} .kassaArtikelen .aantallen {text-align: center;} .kassaArtikelen .regelStuk {text-align: center;} .kassaArtikelen .regelTotaal {text-align: right;} .kassaArtikel td {border-bottom: 1px solid #eee; padding: 10px 0;} .kassaArtikel:last-child td {border-bottom:0;} .kassaArtikel .regelTotaal {text-align: right; max-width: 100px; white-space: nowrap;} .kassaArtikel .regelTotaal .prijs {font-weight: bold; font-size: 14px; color: #000; line-height: 1.4em;} .kassaArtikel .aantallen {text-align: center; padding-left: 10px; padding-right: 10px;} .kassaArtikel .aantallen input {width: 54px; text-align: center;} .kassaArtikel .aantallen .eenheid {display: block; margin: 0 0 5px;} .kassaArtikel .aantallen .verwijderen:hover a {color: #666;} .kassaArtikel .artikelPrijsEenheid {display: block;} .kassaArtikel .tekst {vertical-align:middle; hyphens: auto;} .kassaArtikel .tekst a.kassaArtikelTitel {font-weight: bold; text-decoration: none; color: #000; font-size: 110%; display: block; line-height: 1.25em;} .kassaArtikel .tekst .artikelnr {text-transform: uppercase;} .kassaArtikel .tekst .artikelnr .titel {display: none;} .kassaArtikel .verwijderKnop {padding-left:10px;} .kassaArtikel.gratis {color:#41ae28;} .kassaArtikel.gratis input {border:0;} .kassaArtikel.gratis a.kassaArtikelTitel {color:#41ae28;} .kassaArtikel .kassaArtikelAfbeeldingHolder {vertical-align: middle; width: 100px; text-align: center; padding-right: 20px;} .kassaArtikel .kassaArtikelAfbeeldingHolder .afbeeldingHouder img {width: auto !important; height:auto!important; max-width: 100%;} .kassaArtikel .tekst .voorraad .opVoorraad {margin-left: .25em;} .kassaArtikel .tekst .opmerkingHolder {margin: 5px 0;} .kassaArtikel .tekst .variatie {line-height: 1.5em; font-size: 12px; margin: 10px 0px; background: #eee; display: inline-block; padding: 15px; border-radius: 3px; min-width: 150px;} .kassaArtikel .tekst .variatie .titel {font-weight: bold; color:#000; display: block;} .kassaArtikel .tekst .variatie .eenheid {display: block; margin: 0 0 5px;} .kassaArtikel .tekst .variatie .eenheid:last-child {margin: 0;} .kassaArtikel .kortingsbon .titel {margin-top:7px; display: inline-block;} .kassaArtikelen .kassaArtikel .regelVolgorde input {width: 54px; text-align: center;} .kassaArtikelen .kassaArtikel .regelVolgorde .eenheid {display: block; margin: 0 0 5px;} .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde {display: flex; background: #ddd; width: 90px; margin: 0 auto;} .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde > * {width: 33.333% !important; padding: 5px !important; box-sizing: border-box !important; margin: 0 !important; line-height: 1; display: flex; border-radius: 0 !important; transition: .3s all ease; color: #000; border-color: #ddd !important;} .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde .down:hover, .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde .up:hover {cursor: pointer; background: #d0d0d0;} .kassaArtikelen .kassaArtikel .regelVolgorde .aantalVolgorde > * > i {margin: auto;} .kortingsbonCode {display: inline-block; border: 1px solid #00bb00; border-radius: 5px; font-size: 10px; text-transform: uppercase; color: #00bb00; line-height: 1.75em; font-weight: bold; overflow: hidden; vertical-align: middle; white-space: nowrap;} .kortingsbonCode .valuta {margin-left:5px;} .kortingsbonCodeCode {margin-right:5px;} .kortingsbonCode a {color: #fff; background: #00bb00; padding: 3px 6px;} .winkelmandDelen .formulier {display: flex;} .winkelmandDelen .formulier .nawVeld {margin: 0; flex: 1;} .winkelmandDelen .formulier .nawVeld input {width: 100%; border-radius: 3px 0 0 3px;} .winkelmandDelen .formulier .button {border-radius: 0 3px 3px 0; padding: 14px 12px; text-align: center; min-width: 60px;} .stap .totalen {background:#eee; width: 48%; float: right; z-index: 1; padding:30px; box-sizing: border-box; border-radius: 5px;} .stap .totalen table {width:100%;} .stap .gewicht {padding-left:5px; color:#aaa; font-size:11px; line-height:1em;} .stap .totalen .bedrag {text-align: right; white-space: nowrap;} .stap .totalen .bedragExclusiefRelatie {text-align: right;} .stap .totalen .negatief {color:#00bb00;} .totaalExclBtw td {border-top: 1px solid #ccc; color: #000; font-weight: bold; padding: 5px 0;} .stap .totalen .totaalTeBetalen td {border-top: 1px solid #ccc; color: #000; font-weight: bold; padding: 5px 0; font-size: 130%;} .stap .totalen .totaalSubtotaal td {border-top: 1px solid #ccc;} .stap .totalen .typeBtw {display: inline-block; vertical-align: middle; border: 1px solid #00bb00; border-radius: 5px; padding: 3px 7px; font-size: 10px; text-transform: uppercase; color: #00bb00; line-height: 1.25em; font-weight: bold; margin-left: .75em;} .stap .totalen .totaalCadeaubon {width: 50%; padding: 20px; background: #eee; border-radius: 3px; float: right; clear: both;} .stap .totalen .totaalCadeaubon .restantRegel {font-weight: bold; color: #000; font-size: 120%; line-height: 1.85em;} .stap .totalen .stappenKnop {padding:0px; background:transparent; border:0;} .stap .totalen .stappenKnop a {display: block; text-align: center;} .totaalTeBetalenSpacing td {padding-top: 5px;} .cadeaubonRegel .cadeaubonCode {display: inline-block; border: 1px solid #00bb00; border-radius: 5px; font-size: 10px; padding:0 0 0 5px; text-transform: uppercase; color: #00bb00; line-height: 1.75em; font-weight: bold; overflow: hidden; vertical-align: middle; white-space: nowrap;} .cadeaubonRegel .cadeaubonCode .cadeaubonCodeCode {margin-right:5px;} .cadeaubonRegel .cadeaubonCode a {color: #fff; background: #00bb00; padding: 3px 6px; } .totaalKortingsBon .kortingsbonCode .kortingsbonCodeCode {padding-left:5px;} .stap .couponcode {display: inline-table; width:100%; margin:10px 0; background:#f5f5f5; box-sizing:border-box;} .stap .couponcode #CouponCodeV {display: table-cell; vertical-align: middle; margin: 0; border-radius: 3px 0 0 3px; text-transform:uppercase} .stap .couponcode #CouponCodeV::placeholder {text-transform: none;} .stap .couponcode a.wButControleer {display: table-cell; vertical-align: middle; border-radius: 0 3px 3px 0; padding: 5px 12px; line-height: 1em; text-align: center} /* Einde Orderproces Stap 1 */ /* Orderproces Stap 2 */ .stap.twee .stap2_bestaandeKlant {background-color: #f5f5f5; border-radius: 3px; margin-bottom: 10px; margin-top: 10px; float:none !important; width:100%!important;} .stap.twee .stap2_bestaandeKlant .content {padding: 15px;} .stap.twee .stap2_bestaandeKlant .inloggen, .stap.twee .stap2_bestaandeKlant .uitleg {float: left; width: 47%; position: relative; margin-right:6%;} .stap.twee .stap2_bestaandeKlant .uitleg {padding-top:10px; margin-right:0;} .stap.twee input[type="text"], .stap.twee input[type="password"], .stap.twee input[type="email"], .stap.twee input[type="tel"], .stap.twee textarea {margin:0; width:100%; box-sizing: border-box;} .stap.twee textarea {height:80px;} .stap.twee select {width:100%;} .stap.twee .contactpersoon {display:flex;} .stap.twee .contactpersoon .voornaam {width:39%; margin-right:10px;} .stap.twee .contactpersoon .tussenvoegsel {width:22%; margin-right:10px;} .stap.twee .contactpersoon .achternaam {width:39%;} .stap.twee .telefoon {display: flex;} .stap.twee .telefoon .vast {width:50%; margin-right:10px;} .stap.twee .telefoon .mobiel {width:50%;} .stap.twee .geboortedatum {display:flex;} .stap.twee .geboortedatum .geboorteDag, .stap.twee .geboortedatum .geboorteMaand, .stap.twee .geboortedatum .geboorteJaar {width: 33%;} .stap.twee .geboortedatum .geboorteMaand {margin: 0 10px;} .nieuwAdres {position: relative;} .stap.twee #adressenlijst .adres {background:#f5f5f5; padding:15px; border-radius: 3px;} .stap.twee .stap2_naw .keuze {display: none;} .stap.twee #factuuradresGelijk {border: 0; margin-bottom: 5px;} .stap.twee #stap2_factuuradres {position: relative; display:none;} .stap.twee #stap2_bewaaraccountB {line-height: 2em;} .stap.twee .bestaandAdres {background-color: #fff; border:2px solid #ccc; padding: 10px 15px; border-radius: 5px; transition: all .3s ease; cursor: pointer; position: relative; margin-bottom:10px;} .stap.twee .bestaandAdres:hover {border:2px solid #aaa;} .stap.twee .bestaandAdres .bedrijfsnaam {font-weight: bold;} .stap.twee .adres {max-height:950px; transition:all .3s ease; opacity:1; border-radius: 3px; position: relative;} .stap.twee .adres input[type="radio"] {display: none;} .stap.twee .adres.ingeklapt {max-height:0px; overflow:hidden; opacity:0; border:2px solid transparent;} .stap.twee .adres .geselecteerd {opacity:1; border:2px solid #41ae28 !important; padding: 15px; border-radius:3px; background:#fff;} .stap.twee .tekstNieuwAdres {padding:5px; position:relative; z-index:1;} .stap.twee .bestaandAdres.geselecteerd {position: relative; *background: #f5f5f5; padding:10px 15px;} .stap.twee .bestaandAdres:before, .stap.twee .nieuwAdres:before {content:"\f00c"; position: absolute; right:0; top:0; padding:4px; font-size:12px; background:rgba(255,255,255,0); color:rgba(255,255,255,0); font-family: "Font Awesome 5 Pro"; line-height: 1em; border-bottom-left-radius: 3px; transition: all .3s ease;} .stap.twee .nieuwAdres.geselecteerd:before, .stap.twee .bestaandAdres.geselecteerd:before {background:#41ae28; color:rgba(255,255,255,1);} .stap.twee #stap2_factuuruitklap, .stap.twee #stap2_bewaaraccount {padding:3px 5px; cursor:pointer; box-sizing: border-box;} /* Postcode check */ .nieuwAdres.postcodechecker .postPlaats .postcode, .nieuwAdres.postcodechecker .postPlaats .huisnummer {width: 50%;} .nieuwAdres.postcodechecker .straat .straatnaam {width: 100%; margin: 0 0 8px 0;} #afleverAdresStraat:disabled, #afleverAdresPlaats:disabled, #factuurAdresStraat:disabled, #factuurAdresPlaats:disabled {background:#eee; border-color: #ccc;} /* Einde Postcode check */ /* Stap 2 en 3 naast elkaar */ .stap.twee > .blokholder.algemeneGegevens {float:left;} .stap.twee > .blokholder, #stap2_factuuruitklap, #stap2_bewaaraccount {float:right; width:48%; clear:right;} .stap.drie .blokholder {width:48%; float:right;} .stap.drie .blokholder:first-of-type {float:left;} /* Einde stap 2 naast elkaar */ /* Einde Orderproces Stap 2 */ /* Orderproces Stap 3 */ .stap.drie .regel .select {display: none !important;} .stap.drie .regel {margin-bottom: 5px; cursor:pointer; background:#fff; border: 2px solid #ccc; border-radius: 3px; transition: all .3s ease; padding:10px 15px; position: relative;} .stap.drie .regel:hover {border: 2px solid #aaa;} .stap.drie .regel.actief {position: relative; border:2px solid #41ae28; cursor: default;} .stap.drie .regel:before {opacity:0; content:"\f00c"; position: absolute; right:0; top:0; padding:4px; font-size:12px; background:#41ae28; color:#fff; font-family: "Font Awesome 5 Pro"; line-height: 1em; border-bottom-left-radius: 3px;} .stap.drie .regel.actief:before {opacity:1;} .stap.drie .regel .label {float: right; padding:10px;} .stap.drie .regel > .omschrijving {font-weight: bold;} .stap.drie input.betaalExtraInfo {width:100%;} .stap.drie .currencyNietActief {background-color:#ff00001f;} .stap.drie .dealerHolder {clear: both;} .stap.drie .dealerHolder .omschrijving {display: none;} .stap.drie .dropdown.dealerHolder .plaats {float:right; text-transform: capitalize; margin-right:5px;} .stap.drie .dropdown.dealerHolder .km {float:right; font-weight: bold; padding-left:10px;} .stap.drie .dropdown.dealerHolder .keuze .km {padding-right:10px;} .stap.drie .sendcloudResultaat.actief {padding: 20px; box-sizing: border-box; margin: 20px 0; background: #eee; border: 1px solid #e6e7e8; border-radius: 3px; max-width: 400px;} .stap.drie .sendcloudResultaat.actief .openingsTijden {margin-left: auto;} .stap.drie .sendcloudResultaat.actief .adresInfoHouder {display: flex;} /* Einde Orderproces Stap 3 */ /* Orderproces Stap 4 */ .stap.vier .dealerGegevens {margin: 0 0 15px; border-left: 4px solid #ddd; padding-left: 10px;} .stap.vier .dealerGegevens .toelichting {font-weight: bold; color:#000;} .stap.vier .gegevens {background: #eee; padding: 20px; border-radius: 3px;} .stap.vier .gegevens .algemeen {margin: 0 0 15px; border-left: 4px solid #ddd; padding-left: 10px;} .stap.vier .factuurAfleverHouder {width:100%;} .stap.vier .factuurAfleverHouder td {vertical-align:top;} .stap.vier .factuurAfleverHouder .links, .stap.vier .factuurAfleverHouder .rechts {width: 47%; box-shadow: 0 3px 3px rgba(0,0,0,.1); padding: 15px; border-radius: 3px; background: #fff; box-sizing: border-box;} .stap.vier .factuurAfleverHouder .midden {width:6%;} .stap.vier .factuurAfleverHouder h3 {margin: 0 0 5px; font-size: 15px;} .stap.vier .factuurAfleverHouder h3 a {float: right; color: #aaa; opacity: 0; transition: .3s all ease;} .stap.vier .factuurAfleverHouder h3 a:hover {color: #666;} .stap.vier .factuurAfleverHouder .links:hover h3 a, .stap.vier .factuurAfleverHouder .rechts:hover h3 a {opacity: 1;} .stap.vier .btwNummer {text-transform: uppercase;} .stap.vier .vwHolder {margin-top: 10px; line-height: 1.5em; position: relative; padding-left: 30px; } .stap.vier .vwHolder input#algemeneVoorwaarden {position: absolute; left: 0; top: 4px;} /* Einde Orderproces Stap 4 */ /* Einde Orderproces volledig */ /*Verlanglijstje */ .shopVerlanglijstTekst {border: 1px solid #ccc; background-color: #fefefe; margin-bottom: 10px; border-radius:5px; overflow: hidden;} .shopVerlanglijstTekst .titel {color: #000; font-weight: bold; border-bottom: 1px solid #ccc; padding: 5px 10px; background: #eeeeee;} .shopVerlanglijstTekst .content {padding: 10px;} .shopVerlanglijstEmailAdd .titel span, .shopVerlanglijstTekst .titel span {font-size:16px; color: #999; font-weight:bold; padding-right: 3px;} .shopVerlanglijstEmailAdd {border: 1px solid #ccc; background-color: #fefefe; margin-bottom: 10px; border-radius:5px; overflow: hidden;} .shopVerlanglijstEmailAdd .titel {color: #000; font-weight: bold; border-bottom: 1px solid #ccc; padding: 5px 10px; background: #eeeeee;} .shopVerlanglijstEmailAdd .content {padding: 10px;} .shopVerlanglijstEmailAdd .lijst {width: 55%; float: left; margin-right: 15px; border-right:1px solid #ccc; min-height:163px;} .shopVerlanglijstEmailAdd .toevoegen {width: 40%; float: left;} .shopVerlanglijstEmailAdd span {font-weight:bold;} .shopVerlanglijstEmailAdd .melding {font-style:italic; font-weight:normal;} .shopVerlanglijstTekst textarea, .shopVerlanglijstEmailAdd textarea {display: block; font-family: Arial,Helvetica,sans-serif; font-size: 13px; height: 100px; padding: 5px; text-indent: 0; width: 97%;} .shopVerlanglijstEmailAdd ul {list-style: none outside none; margin:5px; padding: 0;} .shopVerlanglijstEmailAdd ul img {margin-left: 5px;} .verlanglijstVerkocht {opacity:0.5;} .verlangStatus {background: url("images/slash.png") no-repeat scroll center center transparent; border-radius: 10px 10px 10px 10px; box-shadow: 1px 1px 4px #ccc; float: right; font-size: 10px; margin-top: 10px; padding: 15px; width: 115px;} .verlangGewenst {float: right; width:50px;} .verlangBesteld {float: left; width:50px;} .verlangStatus .beschrijving { color: #000; display: block; font-size: 10px; text-align: center;line-height: 1em;} .verlangStatus .aantal {color: #000; display: block; font-size: 30px; text-align: center;line-height: 1em;} .widgetInloggen {display: block; padding: 0px; width: 95%;} .widgetInloggen .inloggen {float:left;} .widgetInloggen .registreer {display: none;} .widgetInloggen .vergeten {float: left;font-size: 11px; line-height: 22px; text-indent: 5px;} .widgetInloggen .vergeten a:link, .widgetInloggen .vergeten a:visited {color:#fff;} #verlangLijstID{height: 26px; line-height: 26px; padding-left: 5px;} #verlangLijstID,#zoekWoordID {width:167px;} /* Einde verlanglijstje */ /* Barcode */ .EANbarcode {margin-top: 10px; display: inline-block; padding-bottom:0px;} /* Einde Barcode */ /* Print functie */ .printHolder {margin:25px; color:#666;} .printHolder h2 {margin-bottom: 15px; padding-bottom: 5px; border-bottom:1px solid #ccc;} .printTabel {table-layout:fixed;} .printTabel td {vertical-align:top; text-align:left; padding:10px;} .printKnop {margin-top:5px; padding-top:5px;text-align:center;border-top:1px solid #ccc;} .printNormaal, .printTechnisch {border-radius:5px; height:240px; box-shadow:0 1px 3px #ddd;} .printTussen {padding:0; width:20px;} .printNormaal:hover, .printTechnisch:hover {box-shadow:0 2px 5px #bbb;} .printHolder img {margin:8px; text-align:center;} .printOptie {padding-left:5px;} .printOpties {height:70px;} .printOptieCheck {border:0; margin-right:5px;} /* Einde print functie */ /*Product carousel */ .productCarrousselHolder {position: relative; margin-top: 20px; text-align: left;} .jcarousel-container {border-width: 0px !important; border-radius:5px;} .jcarousel-container a, .productCarrousselHolder .jcarousel-container-horizontal {width:100%; padding:0;} .productCarrousselHolder .jcarousel-clip-horizontal {width:96%; margin-left:2%;} .productCarrousel li {height: auto; position:relative; line-height: 1em;} .productCarrousselP {margin-right:14px !important; width: 195px;} .jcarousel-container a, .jcarousel-container a:link, .jcarousel-container a:visited {text-decoration: none;} .jcarousel-prev.jcarousel-prev-horizontal, .jcarousel-next.jcarousel-next-horizontal {background-color: #fff;} .jcarousel-prev-horizontal {left: 0px !important;} .jcarousel-next-horizontal {right: 0px !important;} .jcarousel-clip-horizontal { max-width: 195px; margin: 0 30px !important; } .productCarrousselHolder.shopTegel .artikel {width: 100%; clear: none;} .productCarrousselHolder.shopTegel .artikel a.detailKnop {display: none;} /*Einde Product carousel */ /* Affiliatie pagina */ .affiliateInstelling {padding:15px 20px; border:1px solid #ccc; color:#000; background:#fff; border-radius:5px; margin-bottom:20px;} .affiliateHolder {background: #fff; border: 1px solid #CCC; border-radius: 5px; margin-bottom: 10px; overflow:hidden;} .affiliateHolder .titel {color: #000; font-weight: bold; border-bottom: 1px solid #ccc; padding: 5px 10px; background: #eeeeee;} .affiliateHolder .content {padding: 5px;} .affiliateKopRow {width:100%; border-spacing:0; border-collapse:collapse; padding:0;} .affiliateKopDatum, .affliateKopOrder, .affiliateKopCommissie {overflow: hidden; white-space: nowrap; padding: 0;} .affiliateKopDatum {width: 86px;} .affiliateKopCommissie {width:120px; padding-right:5px; text-align:right;} .affiliateRow {width:100%; border-spacing:0px; border-collapse:collapse; padding:0px;} .affiliateRow tr:hover td {background-color:#fcfcfc; } .affiliateDatum, .affiliateOrder, .affiliateCommissie {font-size:12px; overflow: hidden; white-space: nowrap; padding: 3px 5px;} .affiliateDatum {width:82px; color: #bbb;} .affiliateOrder {font-weight:bold; color:#000;} .affiliateCommissie {width:120px; padding-right:10px; text-align:right;} .affiliateTotaal {text-align: right; padding-right:15px !important} /* Einde Affiliatie pagina */ /* Account 2.0 */ button.inloggenKnop, button.mijnAccountKnop, button.wachtwoordKwijtKnop { margin:0; padding:0; border:none; outline:none; background-color:#ffffff00!important; color:#fff; font:inherit; cursor:pointer; text-decoration:none} button.inloggenKnop:hover, button.mijnAccountKnop:hover {text-decoration:none; background-color:#fff0; color:#fff!important; text-shadow:none!important} .accountHouder {display:block; width:100%; background-image: url('images/zwart/60.png'); background-repeat: repeat; height:30px; z-index:12; position:absolute; font-family: "Ubuntu"; color: #fff;} .accountHouder2 {max-width: 1200px; margin:0 auto; position:relative; padding: 0 20px; box-sizing: border-box;} .account {display:block; ; right:0; z-index:50; position:absolute; line-height: 30px; margin:0; top: 0px;} .account .inloggen, .account .favorieten, .account .mijnAccount {float:left; margin:0 0px; padding:0 7px; position:relative;} .account .seperator {border-right: 1px solid #ccc; height: 16px; position: relative; top: 8px; width: 0; padding:0;} .account .houder {max-height:0; overflow:hidden; position:absolute; right:0; background:#fff; box-shadow:0 4px 4px rgba(0,0,0,.2); top:20px; width:300px; transition: all 0.3s ease 0s; opacity:0; z-index: 20;} .account .h3, .account .accountKop {font-size: 17px; border-bottom: 1px solid #ccc; margin-bottom:10px; padding-bottom:5px;} .account .welkom {color: #fff; font-weight: normal; float: left} .account .welkom .bericht {padding-right:5px; font-weight:normal;} .account .onderdrukken {opacity:0.1; position:absolute; } .account .openGeklapt .houder {max-height:500px; opacity:1; top:30px;} .account .inloggenKnop, .account .favorietenKnop, .account .verlanglijstKnop, .account .mijnAccountKnop {cursor:pointer;} .account .openGeklapt .inloggenKnop, .account .openGeklapt .favorietenKnop, .account .openGeklapt .verlanglijstKnop, .account .openGeklapt .mijnAccountKnop {cursor:pointer; text-decoration: underline;} .account .inloggenKnop:hover, .account .favorietenKnop:hover, .account .verlanglijstKnop:hover, .account .mijnAccountKnop:hover {text-decoration:underline;} .account .content, .account .houder1, .account .houder2 {padding:15px 25px; color: #666;} .account .houder2 {background:#f5f5f5; border-top:1px solid #ddd; font-size: 13px} .account .inloggenKnop {padding-left: 23px;} .account .inloggen .email input, .account .inloggen .wachtwoord input, .account .inloggen .wachtwoord2 input {width: 100%;} .account .inloggen .inloggenKnopActie {padding-top:3px;} .account .inloggen .wachtwoordKwijt {float:right;} .account .verlanglijst .code input {width:230px !important; padding:5px 10px !important; font-size:13px !important;} .account .verlanglijst .code2 {padding-top:3px;} .account .verlanglijst .mijnverlanglijst2 {border-top: 1px dashed #ccc; line-height: 20px; margin: 15px 0 0; padding: 10px 0 0;} .account .mijnAccount .houder {width:220px;} .account .wachtwoordKwijtKnop {color: #4bace0;} .inloggenBg, .mijnAccountBg, .verlanglijstBg, .winkelwagenHouderBg, .speedsearchResultBg { z-index: 15; opacity: 0; position: fixed; left: 0; top: 0; right: 0; background-image: url('images/zwart/20.png'); background-repeat: repeat; transition: opacity 0.3s ease 0s;} .inloggenBg.open, .mijnAccountBg.open, .verlanglijstBg.open, .winkelwagenHouderBg.open, .speedsearchResultBg.open {opacity: 1; bottom: 0;} /* Einde Account 2.0 */ /* Winkelmandje 2.0 */ .winkelwagenHouder {display: inline; position: relative;} /* Winkelmandje knop */ .winkelwagenHouder .winkelknop {display: block; position: relative; background-image: url('images/zwart/75.png'); background-repeat: repeat; border-left: 1px solid rgba(250, 250, 250, .45); border-bottom: 2px solid #4bace0; float: left;cursor:pointer; padding: 12.5px 15px;} .winkelwagenHouder .winkelknop:hover {background: rgba(0,0,0,.8);} .winkelwagenHouder .winkelknop:hover .bedrag {color: #4bace0;} .winkelwagenHouder .winkelknop .titel {color: #fff; font-size: 15px; font-weight: normal; margin-bottom: 5px; padding: 0; text-align: left; line-height: 1em;} .winkelwagenHouder .winkelknop .bedrag {color: #898989; font-size: 15px; font-weight: normal; padding: 0px; text-align: left; line-height:1em; transition: .3s ease .0s;} .winkelwagenHouder .winkelknop .bedrag .relatieBtwTotaalPrijs {display: none;} .winkelwagenHouder .winkelknop .icoon {background: #4bace0 url("images/winkelwagen.png") no-repeat scroll center center; border-radius: 50px; height: 46px; left: 0; opacity: 0; position: absolute; visibility: hidden; width: 46px;} .winkelwagenHouder .winkelknop .icoon:before {content:"\f07a"; font-family: "Font Awesome 5 Pro"; font-size:26px;} .winkelwagenHouder .winkelknop .aantal {background: #fff; border-radius: 50px; box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); color: #000; font-size: 12px; font-weight: bold; height: 22px; line-height: 22px; min-width: 12px; padding: 0 5px; position: absolute; right: 37px; text-align: center; top: 3px;} .winkelwagenHouder .winkelknop .relatieBtwTotaalPrijs {display: none;} /* Winkelmandje Inhoud */ .winkelwagenHouder .winkelwagen {position: absolute; top: 36px; width: 700px; border-radius: 3px; opacity: 0; pointer-events: none; transition: all .3s ease; padding: 0px; background-color: #eee; box-shadow: 0 0px 50px -8px rgba(0,0,0,.25); overflow: hidden; right: 5px;} .winkelwagenHouder.openGeklapt .winkelwagen {height: auto; opacity:1; top: 46px; z-index: 20; pointer-events: all;} .winkelwagenHouder .winkelwagen .kassaknop {position: relative;} .winkelwagenHouder .winkelwagen .offerteknopExtra {position: relative;} .winkelwagenHouder .winkelwagen .inhoud {padding: 20px;} .winkelwagenHouder .winkelwagen .inhoud.artikelen {background-color: #fff;} .winkelwagenHouder .winkelwagen .inhoud.artikelen .winkelTitel {font-size: 17px; font-weight: bold; margin: 0 0 15px; color: #000;} .winkelwagenHouder .winkelwagen .inhoud.artikelen {max-height: 300px; max-height: calc(100vh - 300px); overflow-y: auto;} .winkelwagenHouder .winkelwagen .inhoud .prijs {float: right; font-weight: bold; font-size: 16px; padding: 10px; color: #000; text-align: right; line-height: 1em; } .winkelwagenHouder .kassaArtikel .kassaArtikelAfbeeldingHolder {width: 50px; padding-right: 10px;} .winkelwagenHouder .kassaArtikel .regelStuk {display: none;} .winkelmandjeKnoppen {display:inline-block;} .winkelmandjeKnoppen a {margin-right:10px;} .winkelmandjeLeeg {padding: 20px; background-color: #fff; border-bottom: 1px solid #ccc;} /* Einde winkelmandje 2.0 */ /* Zoekveld 2.0 */ .zoeken {display: table; position: relative; width: 100%;} .zoeken.open {z-index: 20;} .zoeken .veld {display: table-cell; vertical-align: middle;} .zoeken .veld #zoekWoordID {border: 1px solid #ccc; box-shadow: none; padding: 5px 10px; font-size:14px; font-style:italic; border-radius:2px 0 0 2px; margin:0; width:100%; transition: all .3s ease; height: 38px;} .zoeken .knop {display: table-cell; vertical-align: middle;} .zoeken .knop {display:block; width:42px; padding:0; height:38px; background:url("images/iconZoeken-20.png") no-repeat center center #4bace0; border-radius: 0 2px 2px 0; transition: all .3s ease; cursor:pointer} .zoeken .knop:hover {background-color:#aaa; padding: 0;} .zoeken .knop img {display:none;} /* Einde Zoekveld 2.0 */ /* Merken */ .merkUl {list-style:none; margin:0; padding:0;} .merkUl li {margin:0; padding:0;} .merkUl .merkCheck {margin:0 5px 0 0; padding:0;} /* Einde Merken */ /* Filter en kenmerken */ .filters {padding:10px 5px; background:#F1F1F1; display:block; position:relative; margin:10px 0; border:1px solid #ccc; -webkit-user-select: none;} .filters .kenmerkgroepHouder {margin:0; padding:0; list-style:none;} .filters .kenmerkgroep {position:relative; padding:0; list-style:none; float:left; margin: 5px; height: 32px;} .filters .kenmerkgroep a.titel {background-color: #e4e4e4; border: 1px solid #ccc; border-radius: 0; color: #606060; display: inline-block; font-family: "Open Sans"; font-size: 13px; font-style: normal; font-weight: normal; line-height: 1.65em; padding: 5px 10px; text-decoration: none; transition: all 0.2s ease 0s;} .filters .kenmerkgroep a.titel img{position:relative; top:3px; margin-right:3px; opacity:.5;} .filters .kenmerkgroep .kenmerken {max-height:0; transition: all .2s ease; padding:0 10px; overflow-y: scroll; background:#fff; position:absolute; min-width:250px; margin-top:0px; box-shadow:0 1px 5px rgba(0,0,0,.0); z-index:15;} .filters .kenmerkgroep:hover .kenmerken {max-height:500px; padding: 10px; border-top:0; box-shadow:0 3px 3px rgba(0,0,0,.2);} .filters ul.kenmerken {padding:0; margin:0; list-style:none;} .filters ul.kenmerken .kenmerk {padding: 0 0 0 20px; position: relative; font-size: 13px;} .filters .filterCheck label {padding:2px; display:block;} .filters .filterCheck label .aantal {background-color: #e9e7e8; border-radius: 50px; display: inline-block; font-size: 10px; font-weight: bold; line-height: 1; margin-left: 5px; margin-top: 2px; padding: 3px 6px; text-align: center; vertical-align: baseline; white-space: nowrap;} .filters .nietBeschikbaar {opacity:.5; pointer-events: none;} .filters .nietBeschikbaar .aantal {display:none !important;} .filters .toelichting {float:left; margin-left:5px;} .filters .toelichting h2 {font-size:15px;} .filters .beschikbaar {position: relative;} .filters .beschikbaar .aantal {font-weight:bold;} .filters a.wButFilter {position:relative; float:right; font-weight:bold; padding:5px 10px; border-radius:6px; background:#fff; border:0px solid #ccc; box-shadow:0 1px 5px rgba(0,0,0,.0); transition: all .2s ease; margin: 5px; text-decoration:none; background:#4bace0; color:#fff;} .filters a.wButFilter:hover {background-color:#4bace0; box-shadow:0 1px 5px rgba(0,0,0,.3);} .filters a.wButFilter:active {top:1px; box-shadow: inset 0 1px 5px rgba(0,0,0,.3);} .filters .glow {animation:glow 0.4s alternate; animation-iteration-count: 2; -webkit-animation:glow 0.4s alternate; -webkit-animation-iteration-count: 2;} @keyframes glow {from { box-shadow:0px 0px 10px rgba(255,255,255,.0); transform:scale(1) } to { box-shadow:0px 0px 4px 1px #fff, 0px 0px 23px 7px rgba(102, 175, 233, 0.9); transform:scale(1.15);}} @-webkit-keyframes glow {from { box-shadow:0px 0px 10px rgba(255,255,255,.0); -webkit-transform:scale(1) } to { box-shadow:0px 0px 4px 1px #fff, 0px 0px 23px 7px rgba(102, 175, 233, 0.9); -webkit-transform:scale(1.15);}} .filters #actieveKenmerken {clear:both;} .filters .actieveKenmerkenLijst {list-style:none; padding:0 5px; margin:0;} .filters .actiefKenmerk {background:#fff; padding:3px 8px; float:left; margin-top:5px; margin-right:10px; border-radius:4px;} .filters .actiefKenmerk img {position:relative; top:3px; margin-right:3px;} .filters .kenmerkAfbeelding {position:relative; top:3px; margin-right:3px; opacity:.5;} .filters input[type=checkbox] { display:none; } .filters input[type=checkbox] + .omschrijving:before { font-family: "Font Awesome 5 Pro"; display: inline-block; font-size:16px; position: absolute; left:0; width:20px; transition: all .3s ease; } .filters input[type=checkbox] + .omschrijving:before {content: "\f10c"; color:#888;} .filters input[type=checkbox] + .omschrijving:hover:before {color:#4bace0;} .filters input[type=checkbox]:checked + .omschrijving:before {content: "\f058"; color:#4bace0;} .filters .omschrijving {padding: 0;} /* Als kenmerken algemeen */ .shopDetailTabKenmerken, .shopDetailModernKenmerken { border: 1px solid #e9e7e8; border-spacing: 0; display: table; font-size: 14px; width: 100%; margin: 0 0 20px; } .kenmerkArt, .artikelGewicht {padding: 5px; width: 100%; box-sizing: border-box; transition: all .3s ease; border-bottom: 1px solid #eee; display: grid; grid-template-columns: minmax(150px, 25%) 1fr;} .kenmerkArt:nth-child(2n) {background: #e9e7e8;} .kenmerkArt .groep, .artikelGewicht .titel {color: #000; font-weight: 700; padding-right: 10px;} .kenmerkArt .kenmerken .kenmerk {display: inline-block;} .kenmerkArt .kenmerken .kenmerk::after {content:", "; margin-right: .25em;} .kenmerkArt .kenmerken .kenmerk:last-child::after {display: none;} .kenmerkArt .kenmerken .kenmerk .toevoeging {color: #aaa;} .kenmerkArt .kenmerken .kenmerk .toevoeging:empty {display: none;} .kenmerkArt .kenmerken .kenmerk .toevoeging::before {content: " (";} .kenmerkArt .kenmerken .kenmerk .toevoeging::after {content: ")";} /* Aanpassingen voor gebruik aan linkerkant */ .filtersLinks .kenmerkgroep {display: block; float: none;} .filtersLinks .kenmerkgroep a.titel {display: block;} .filtersLinks .kenmerkgroep .kenmerken {border-radius: 0 0 5px 5px; max-width:400px; width:168px;} /* Einde Filters */ /* PrijsFilter */ .prijsFilterHolder .prijsfilterVelden {display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;} .prijsFilterHolder .prijsfilterInput {background: #eee;} .prijsFilterHolder .prijsfilterVelden input {width: 70px; height: 35px; text-align: center; font-size: inherit; border: 0; outline: none; background: #eee;} .prijsFilterHolder .prijsfilterVelden .valuta {color: #a7a7a7; margin-left: 10px;} .prijsFilterHolder .prijsfilterKnop {background: #365376; padding: 6px 18px; cursor: pointer; color: #FFF; font-size: 21px;} .prijsFilterHolder .noUi-target {background: #eee; border-radius: 2px; margin-top: 15px; height: 4px; position: relative; direction: ltr; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; -ms-touch-action: none; touch-action: none; -ms-user-select: none; -moz-user-select: none; user-select: none; -moz-box-sizing: border-box; box-sizing: border-box;} .prijsFilterHolder .noUi-target .noUi-base {width: 100%; height: 100%; position: relative; z-index: 1;} .prijsFilterHolder .noUi-target .noUi-base .noUi-connect, .prijsFilterHolder .noUi-target .noUi-base .noUi-origin {will-change: transform; position: absolute; z-index: 1; top: 0; left: 0; -ms-transform-origin: 0 0; -webkit-transform-origin: 0 0; -webkit-transform-style: preserve-3d; transform-origin: 0 0; transform-style: flat;} .prijsFilterHolder .noUi-target .noUi-base .noUi-connect {background: #365376; height: 100%; width: 100%;} .prijsFilterHolder .noUi-target .noUi-base .noUi-origin {width: 10%; height: 0; left: auto; right: 0;} .prijsFilterHolder .noUi-target .noUi-base .noUi-origin .noUi-handle {width: 16px; height: 16px; left: -9px; top: -7px; outline: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; border: 1px solid #D9D9D9; border-radius: 50%; background: #FFF; cursor: ew-resize; right: -9px; left: auto;} .prijsFilterHolder .noUi-target .noUi-base .noUi-origin .noUi-handle .noUi-touch-area {height: 100%; width: 100%;} /* Einde prijsFilter */ /* Dropdown menu ipv selectboxes */ .dropdown {position:relative; cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .dropdown .keuze {color:#4bace0; display:block; background:#fff; padding:6px 12px; box-shadow:0 1px 3px rgba(0,0,0,.1); border-radius:3px; font-weight: bold; transition: all .3s ease;} .dropdown .keuze:before {content:""; font-family: "Font Awesome 5 Pro"; font-weight: normal; float:right; transition: all .3s ease;} .dropdown:hover .keuze {box-shadow:0 1px 5px rgba(0,0,0,.2); border-radius:3px 3px 0 0; } .dropdown .keuze:hover:before {color:#4bace0;} .dropdown ul {list-style: none; padding:0; margin:0; max-height:0em; overflow:hidden; transition:all .3s ease; z-index:100; box-shadow:0 1px 3px rgba(0,0,0,.2); width:100%; border-radius: 0 0 3px 3px;} .dropdown.openGeklapt ul {display: block; max-height: 50em; margin-bottom: 1em;} .dropdown ul li {list-style: none; padding:0; margin:0; border-bottom: 1px solid #eee;} .dropdown ul li a {text-decoration: none; display: block; transition:all .3s ease; background:#fff; padding:4px 12px; clear:both;} .dropdown ul li a:hover {background:#eee;} .dropdown ul li.active a {background-color:#4bace0; color:#fff; font-weight:bold;} /* Einde Dropdown menu ipv selectboxes */ /* Dropdown naar Blokjes bij moederartikel #mArt_holder .dropdown .keuze {display: none;} #mArt_holder .dropdown .keuze:before {display:none;} #mArt_holder .dropdown ul {display: block; max-height:none; list-style: none; padding:0; margin:0; position:relative; box-shadow:none; overflow: visible;} #mArt_holder .dropdown.openGeklapt ul {display: block; max-height:none; margin:0; overflow: visible; padding:0;} #mArt_holder .dropdown ul li {display:inline-block; border:0; width:22%; margin: 5px 10px 5px 0;} #mArt_holder .dropdown ul li a {border:2px solid #ddd; padding:5px 12px; text-align: center; border-radius:5px; font-weight: bold;} #mArt_holder .dropdown ul li a:hover {border:2px solid #4bace0; background:#fff;} #mArt_holder .dropdown ul li.active a {background-color:#fff; border:2px solid #4bace0; color:#4bace0;} /* Einde Dropdown naar Blokjes bij moederartikel */ /* Abonnementen */ .aboHolder .abonnement {border:1px solid #eee; margin-bottom:30px; padding:20px;} .abonnement .links {display: block; float:left; width:40%; } .abonnement .rechts {display: block; float:right; width:55%;} .abonnement .links .abonnementnummer .nummer {padding-left:0.25em;} .abonnement .links .afbeelding img.afbeelding {width:100%; height:auto;} .abonnement .rechts .leverdagSelectie {margin-top:40px;} .abonnement .rechts .kalender {margin-top:20px;} .abonnement .agenda {width:100%;} .focus {box-shadow: 0 1px 7px 2px rgba(200,0,0,.3);} .agenda .gepauzeerd {text-decoration: line-through; opacity:.8;} .leverdagSelectie .dropdown .keuze {display: none;} .leverdagSelectie .dropdown .keuze:before {display:none;} .leverdagSelectie .dropdown ul {display: block; max-height:none; list-style: none; padding:0; margin:0; position:relative; box-shadow:none; overflow: visible;} .leverdagSelectie .dropdown.openGeklapt ul {display: block; max-height:none; margin:0; overflow: visible; padding:0;} .leverdagSelectie .dropdown ul li {display:inline-block; border:0; width:22%; margin: 5px 10px 5px 0;} .leverdagSelectie .dropdown ul li a {border:2px solid #ddd; padding:5px 12px; text-align: center; border-radius:5px; font-weight: bold;} .leverdagSelectie .dropdown ul li a:hover {border:2px solid #4bace0; background:#fff;} .leverdagSelectie .dropdown ul li.active a {background-color:#fff; border:2px solid #4bace0; color:#4bace0;} .leverdagBox {padding:10px 15px; background:#eee; border-radius:5px;} .leverdagBox a.pauzeerLevering {display: block; text-align: center; } .leverdagBox a.hervatLevering {display: block; text-align: center; } /* Einde Abonnementen */ /* PDF keuze holder */ .pdfkeuzeholder .beschrijving {margin: 0 0 15px;} .pdfkeuzeholder .beschrijving p:last-child {margin: 0;} .pdfkeuzeholder .pdfkeuze {border: 1px solid #ddd; margin: 0 0 10px; padding: 10px; position: relative; transition: .3s all ease;} .pdfkeuzeholder .pdfkeuze:hover {box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);} .pdfkeuzeholder .pdfkeuze:last-child {margin: 0;} .pdfkeuzeholder .pdfkeuze .inner {display: table; width: 100%;} .pdfkeuzeholder .pdfkeuze .inner .col1 {display: table-cell; vertical-align: middle; width: 90px;} .pdfkeuzeholder .pdfkeuze .inner .col2 {display: table-cell; vertical-align: top; width: auto; padding: 0 15px;} .pdfkeuzeholder .pdfkeuze .inner .col3 {display: table-cell; vertical-align: middle; width: 125px;} .pdfkeuzeholder .pdfkeuze .inner .titel {margin: 0 0 15px;} .pdfkeuzeholder .pdfkeuze .inner .titel h3 {color: #666;} .pdfkeuzeholder .pdfkeuze .inner .button {box-sizing: border-box; margin: 0 0 5px; padding: 8px 2px !important; text-align: center; width: calc(50% - 2px);} .pdfkeuzeholder .pdfkeuze .inner .button.download {border: medium none;} .pdfkeuzeholder .pdfkeuze .inner .button.printen {background-color: #dbdbdb; border: medium none; color: #565656;} /* Einde PDF keuze holder */ .meldingBg {background: url("images/zwart/40.png"); background-repeat: repeat; position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 30;} /* Zoekresultaten */ #speedsearchResult {clear:both; top:100%; position:absolute; left: 0; z-index: 20; width: 550px;} #speedsearchResult .houder {background-color: #fff; border: 1px solid #ddd; border-radius: 3px; box-shadow: 0 50px 50px rgba(0, 0, 0, 0.4); overflow: hidden; padding: 0;} .speedSearch {padding: 0px;} .speedSearch ul {list-style: none; z-index:100; padding: 20px; margin:0;} .speedSearch.artikelen {border-top: 1px solid #dfdfdf;} .speedSearch.artikelen ul {max-height: 500px; overflow-y: auto;} .speedSearch > ul > li {padding:0; margin:0; color:#666; border-bottom: 1px solid #ddd;position: relative;} .speedSearch > ul > li a {text-decoration:none; color: inherit; display: block; transition: all .2s ease;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding:5px 10px;} .speedSearch ul li:hover {background-color:#f5f5f5;} .speedSearch ul li:last-child {border-bottom: 0;} .speedSearch ul li a strong {color:#4bace0;} .speedSearch ul li .thumbnail {float: right; height: 50px; width: 50px; margin-left: 10px; text-align: center; overflow: hidden; position: relative;} .speedSearch ul li .thumbnail img {width: 50px; height: auto; border-radius: 3px; position: absolute; bottom: -50%; top: -50%; margin: auto; left: -50%; right: -50%;} .speedSearch ul li .omschrijving {font-size:15px; font-weight: bold;} .speedSearch ul li .artikelNr {font-size:12px; line-height: 1.5em;} .speedSearch ul li .artikelNr .titel {margin-right:5px;} .speedSearch .resultaat {background-color: #eee; border-bottom: 1px solid #dfdfdf; color: #494949; font-size: 17px; font-weight: bold; margin: 0; padding: 15px 20px; position: relative;} .speedSearch .resultaat a.knopAlles {background-color: #4bace0; color: #fff; border-radius: 3px; bottom: 12px; text-decoration: none; font-size: 12px; font-weight: normal; padding: 3px 10px; position: absolute; right: 10px; } .speedSearch .categorie {color:#aaa; font-style: italic; line-height: 1.5em;} .speedSearch .categorie .titel {float:left; margin-right:5px;} .speedSearch .categorie ul {margin: 0; padding: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .speedSearch .categorie ul li {display: inline-block; margin: 0 0.5em 0 0;} .speedSearch .categorie ul li::after {content: ", ";} .speedSearch .categorie ul li:last-child::after {content: "";} .speedsearchLoader {position: absolute; right: 1px; top: 6.5px;} .speedsearchLoader i {color:#4bace0; font-size:16px;} .knopAllesOnder a {background-color: #f5f5f5; border-radius: 0; border-top: 1px solid #ddd; display: block; font-weight: bold; margin: 0; padding: 10px; text-align: center; text-decoration: none;} .knopAllesOnder a:hover {background-color: #e5e5e5;} .speedsearchSluiten {display:none;} /* Einde zoekresultaten */ /* Social media knoppen */ .shareKnoppen {position: relative;} .shareKnoppen a.deelKnopje {display: inline-block; position: relative; margin: 5px 2px 0 0; text-decoration: none; padding: 8px; background: #eee; border-radius: 3px; line-height: 1;} .shareKnoppen a.deelKnopje:hover {background: #ddd;} .shareKnoppen a.deelKnopje i {margin-right: 5px; width: 15px; text-align: center;} /* Einde Social media knoppen */ /* Snelbestellen */ .snelbestellenHolder {background-color: #eee; border-radius: 3px; padding: 15px 20px; margin-bottom: 10px;} .snelbestellenHolder .hidden {display: none;} .snelbestellenHolder .titel {display: inline-block; padding-right: 15px; font-weight: bold; font-size:16px; color:#4bace0; width:60px;} .snelbestellenHolder .invoer {display: table; position: relative; width:100%; table-layout: fixed;} .snelbestellenHolder .invoer .inputArtikelnr {display: table-cell; width:150px; padding-right:10px;} .snelbestellenHolder .invoer .inputAantal {display: table-cell; width:70px; padding-right:10px;} .snelbestellenHolder .invoer input {width:100%;} #snelbestellenArtikelomschrijving {display: table-cell; white-space: nowrap; max-width:0; text-overflow: ellipsis; overflow:hidden; width:35%} #snelbestellenPrijs {display: table-cell; padding-left:10px; padding-right: 10px; font-weight: bold; white-space: nowrap; width: 75px; text-align: right;} .snelbestellenHolder .snelbestellenKnop, .snelbestellenHolder .snelBestellenUpload {display: table-cell; text-align: right; transition: all .3s ease; opacity:1; width:90px;} .snelbestellenKnop.verborgen {opacity:.3;} .snelbestellenKnop.verborgen a {cursor: not-allowed;} .autocomplete-selected {background:#eee;} .snelbestellenHolder .autocomplete-suggestions {position: absolute !important; top: auto !important; background: #fff; width: 100% !important; padding: 0; box-sizing: border-box; border: 1px solid #ddd; border-radius: 3px; box-shadow: 0 50px 50px rgba(0, 0, 0, 0.4); max-height: 470px !important; overflow-y: auto;} .snelbestellenHolder .autocomplete-suggestions .autocomplete-suggestion {padding: 5px 10px; border-bottom: 1px solid #ddd; cursor: pointer;} .snelbestellenHolder .autocomplete-suggestions .autocomplete-suggestion:hover {background-color: #eee;} .snelbestellenHolder .autocomplete-suggestions .autocomplete-suggestion strong {color:#4bace0;} .snelbestellenHolder .omschrijving {width: 150px; display: inline-block;} .snelbestellenHolder .snelBestellenUpload {position: relative; overflow: hidden; display: table-cell; padding: 0 10px; width: 150px;} .snelbestellenHolder .snelBestellenUpload .uploadButton {width: 100%;} .snelbestellenHolder .snelBestellenUpload input[type=file] {position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer; font-size: 100px;} .snelbestellenHolder .tooltip.sbUpload {display: table-cell; padding-left: 10px;} .snelbestellenHolder .tooltip.sbUpload::before {display: block;} /* Einde Snelbestellen */ /* Instellingen scherm */ table.instellingen {width: 100%; border:0; border-spacing: 0; table-layout: fixed;} table.instellingen tr td {vertical-align: middle;} table.instellingen .beschrijving {width:200px;} table.instellingen tr td input {width:100%; box-sizing: border-box;} /* Einde instellingen scherm */ /* Nieuwe lijsten */ /* Lijsten */ .lijstOpties {margin-bottom: 20px;} .lijstOpties .knoppen {float:right;} .lijstOpties .knoppen a.knop {margin-right:0;} /* Lijstzoeken */ .lijstOpties .zoek {display: inline-table; position: relative;} .lijstOpties .zoek .veld {display: table-cell; z-index: 10; position: relative; overflow: hidden; border-radius: 3px 0 0 3px; background:#eee;} .lijstOpties .zoek .veld input {margin:0; border-right:0; border-top-right-radius: 0; border-bottom-right-radius: 0; background:#fff;} .lijstOpties .zoek .knop {border:1px solid #ccc; display: table-cell; color:#999; position: relative; padding:0 8px; transition: all .3s ease; cursor: pointer; z-index: 1; border-radius: 0 3px 3px 0; vertical-align: middle; background:#eee; line-height: 0;} .lijstOpties .zoek .knop:hover {color:#4bace0;} .lijstOpties .zoek a.toonAlles {border-left: 1px solid #ccc; padding-left: 20px; margin-left: 20px;} table.lijst {width:100%; border-spacing: 0; table-layout: auto; margin: 0 0 20px;} table.lijst th {text-align: left; border-bottom: 1px solid #eee; padding: 5px 10px; text-transform: uppercase; font-size: 12px; font-weight: bold; color: #888;} table.lijst tr.inactief td, .lijst tr.inactief td a {color:#aaa;} table.lijst tr.inactief td.omschrijving {text-decoration: line-through; color:#f00;} table.lijst td {border-bottom: 1px solid #eee; padding: 10px 10px; background:#fff; transition: all .3 ease; white-space: nowrap;} table.lijst td > .titel {font-weight: bold;} table.lijst td > .subtitel {color:#aaa;} table.lijst .bedrag {text-align: right; padding-right:30px;} table.lijst tr:hover td {background:#fafafa;} table.lijst tr.inactief:hover td {background:#f1f1f1;} table.lijst td.id {width: 30px;} table.lijst td.knoppenHouder {font-size:16px; line-height: 0; vertical-align: middle;} table.lijst td.knoppenHouder a {font-size: inherit; padding: 0 5px; position: relative;} table.lijst td.knoppenHouder a .tekst {background: #415e81; border-radius: 3px; top: -125%; color: #fff; line-height: 1.25em; white-space: nowrap; padding: 5px 9px; position: absolute; transition: .3s all ease; left: 50%; font-size: 11px; transform: translateX(-50%); opacity: 0; pointer-events: none; font-weight: normal;} table.lijst td.knoppenHouder a .tekst::before {border: solid; border-color: #415e81 transparent; border-width: 6px 6px 0px 6px; bottom: -4px; content: ""; position: absolute; transition: .3s all ease; left: 50%; transform: translateX(-50%);} table.lijst td.knoppenHouder a:hover .tekst {opacity: 1; pointer-events: all;} /* Einde nieuwe lijsten */ /* Groothandel en dealers */ .dealerAanmakenVeld {padding:0 30px; background:#eee; overflow:hidden; max-height: 0; transition: all .3s ease; opacity:0; margin-bottom:20px; border-radius: 4px;} .dealerAanmakenVeld.open {padding:30px; max-height:999px; opacity: 1;} .dealerImportVeld {padding:0 30px; background:#eee; overflow:hidden; max-height: 0; transition: all .3s ease; opacity:0; margin-bottom:20px; border-radius: 4px;} .dealerImportVeld.open {padding:30px; max-height:999px; opacity: 1;} .dealerImportVeld input[type="file"] {width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1;} .dealerImportVeld input[type="file"] + label {font-size:inherit; color: #fff; background-color: #4bace0; display: inline-block; cursor: pointer; padding:5px 10px;} .dealerImportVeld input[type="file"]:focus + label, .dealerImportVeld input[type="file"] + label:hover {background-color:#4bace0;} .dealerOrdersTonen {background:#fff;} .dealerOrders {padding:0 30px; background:#eee; overflow:hidden; height:0; transition: all .3s ease; opacity:0; margin-bottom:20px; border-radius: 4px;} .dealerOrders.open {padding:30px; height:auto; opacity: 1;} .mijnDealersOrdersSluiten {float:right;} .stap.twee .groothandelSelectie ul {list-style: none; padding:0; margin:0;} .stap.vier .groothandelSelectie {margin-bottom:10px;} /* Einde Groothandel en dealers */ /* Barcodescanner */ a.barcodescannerLink {text-decoration: none; position: absolute;} a.barcodescannerLink img {width:40px; height:auto;} a.barcodescannerSluiten {position: absolute; top: 0; right:0; background:#d55929; color:#fff; padding:10px 15px; text-decoration: none; border-radius: 0 0 0 5px;} .barcodescannerHouder {display: none;} .barcodescannerHouder.open {display: block; padding:30px; background:#fff; border-radius:5px; overflow:hidden; position: fixed; top:10%; left:50%; width:700px; margin-left:-350px; z-index:500; box-shadow: 0 10px 50px rgba(0,0,0,.3); box-sizing: border-box;} .barcodescannerHouder ::before {bottom:auto; transition: all .3s ease;} .barcodescannerHouderBg {display: none;} .barcodescannerHouderBg.open {display: block; position: fixed; top:0%; bottom:0; left:0; right:0; z-index:499; content:" "; background: rgba(255,255,255,.7)} #barcodeScannerCamera {position: relative; min-height:200px; background:url(images/loader.gif) no-repeat center center;} #barcodeScannerCamera video {position: relative; border-radius: 5px;} #barcodeScannerCamera canvas {top:0; left:0; position: absolute; z-index: 1; width:100%; height:auto;} #barcodeScannerCamera::before {display: block; position: absolute; top: 50%; left: -10px; right: -10px; border-bottom: 4px solid #d55929; content: ""; height: 0; z-index: 1; border-radius: 5px; animation: MoveUpDown 2s ease infinite;} @keyframes MoveUpDown {0% {top: 30%; opacity: .3; } 70% {top: 70%; opacity: .8; } 100% {top: 30%; opacity: .3; }} /* Einde Barcodescanner */ /* Valuta's */ .accountHouder .valuta {max-height: 30px; overflow: hidden; position: relative; top: 0; background:rgba(255,255,255,0); z-index: 5; transition: .3s all ease; display: block; float: right; cursor:pointer;} .accountHouder .valuta:hover {max-height: 150px; box-shadow: 0 0px 50px -8px rgba(0,0,0,.25); border-radius: 0 0 3px 3px; background:rgba(255,255,255,1);} .accountHouder .valuta .titel {display: none;} .accountHouder .valuta ul {margin: 0; padding: 0; list-style: none;} .accountHouder .valuta ul li {padding: 0 8px; line-height: 30px;} .accountHouder .valuta ul li:last-child {border: 0;} .accountHouder .valuta ul li a {color: inherit; text-decoration: none;} .accountHouder .valuta ul li .symbool {font-weight: bold; float: right; margin-left: 5px; padding-left: 5px;} /* Einde valuta's */ /* Maatwerk */ .wButStap1, .wButStap2, .wButStap3, .wButStap4 {background-color:#4bace0 !important; border-color:#4bace0 !important} .shopArtikel .shopLijst1Bestel_1, .shopArtikel .shopLijst1Bestel_2 {background:#eee; margin:15px; margin-right:0; margin-top:30px; padding:10px; border-radius:5px;} .shopArtikel .wButBestel {background: none repeat scroll 0 0 #4bace0; border: 0 none; border-radius: 4px !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); font-size: 14px; padding: 7px 35px !important; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);} .shopArtikel .shopLijst1Aantal {font-size: 14px; font-weight: normal; height: 28px; margin: 0; padding: 0 5px; width: 32px;} .mArt_holder {margin: 0 0 5px;} .art-Block.winkel {z-index: 1;}