te gebruiken op de manier opgelost
of font-family: "Font Awesome 5 Free"; gebuiken
kan geen fa gebruiken voor menu want dan heeft ook invloed op op de a link tekst**/
/*
}.fa-home::before,
.fa-envelope::before,
.fa-picture-o::before,
.fa-image::before,
.fa-chevron-circle-right::before,
.fa-chevron-right::before,
.fa-chevron-up::before,
.fa-chevron-left::before,
.fa-chevron-down::before,
.fa-video::before,.fa-images::before{
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
h3.page-header.item-title::before,
.com-content-blog__link::before{
font-family: "Font Awesome 5 Free";
font-weight: 900;
padding-right: 1vw;
content: "\f054";
}*/
/*******************************************/
.fa-file-pdf::before{
margin-right: 0.5rem;
}.fa.fa-search,
.icon-white{
color: #373535 !important;
}.fa.fa-search:hover,
.icon-white:hover,
.icon-search-plus:hover{
color: #665E5E !important;
}.display992 .fa-search{
}.display992 .fa-search:hover,
.display992 .fa-search:focus{
color: #FFF8F0 !important;
}.fa:hover,
.fab:hover,
.fa:focus,
.fab:focus{
text-decoration: none;
color: #fff8f0;
}.icon-search-plus{
color: #373535!important;
}.fa-facebook-square:hover {
color: #665E5E;
}.fa-facebook:hover {
color: #0866ff!important;
}
a.fa-twitter:hover {
background: #55ACEE;
color: #FFF8F0;
}
a.fa-youtube:hover {
background: #c4302b;
color: #FFF8F0;
}
.fa-instagram {
color: #373535;
background: none;
}
.fa-instagram:hover {
color: black; /* Standaardkleur */
background: radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
-webkit-background-clip: text; /* Tekst als masker voor de achtergrond (Chrome, Safari, Opera) */
-webkit-text-fill-color: transparent; /* Tekstkleur transparant maken (Chrome, Safari, Opera) */
-moz-background-clip: text; /* Tekst als masker voor de achtergrond (Firefox) */
-moz-text-fill-color: transparent; /* Tekstkleur transparant maken (Firefox) */
background-clip: text; /* Tekst als masker voor de achtergrond (Standaard) */
-webkit-text-fill-color: transparent; /* Tekstkleur transparant maken (Standaard) */
transition: color 0.3s, background 0.3s; /* Vloeiende overgang voor kleurverandering */
}
.cbw.licht img{
filter: none;
}
.cbw.licht img:hover{
opacity: 0.8;
}
.cbw a img{
filter: grayscale(90%) sepia(100%) brightness(31%);
}
.cbw a:hover img{
filter: none;
/*******************************************display**********************************/
}
.display767{
display: none !important;
}.displaynone767{
display: flex !important;
}.display992{
display: none !important;
}.displaynone992{
display: flex !important;
}.display1200{
display: none !important;
}.displaynone1200{
display: flex !important;
}
@media only screen and (max-width:1199px){
.display1200{
display: flex !important;
}.displaynone1200{
display: none !important;
}
}
@media only screen and (max-width:992px){
.display992{
display: flex !important;
}.displaynone992{
display: none !important;
}
}
@media only screen and (max-width:767px){
.display767{
display: flex !important;
}.displaynone767{
display: none !important;
}
}
/********************************heading***/
h1,h2,h3{
/*display: inline-block;
width: 100%;*/
display: block;
}
h1,
[class*="moduletable"] h3{
/*font-size:3rem;*/
font-weight:200;
line-height: normal;
/*padding: 0 0 2vw 0;
margin: 0 0 1vw 0;*/
color: #FFF8F0;
text-transform: uppercase;
/*letter-spacing: 2px;*/
font-size: var(--font-size-xl);
}
.headerblok-links h1{
font-size: var(--font-size-xxxl);
}
.download-pagina h1{
margin: 2vw 0 3vw 0;
}.downloads-overzicht h1{
font-family: 'Sacramento', cursive;
text-transform: none;
font-size: var(--font-size-xxxl);
}h2{
font-weight:200;
margin: 1% 0;
color: #fff8f0;
line-height: normal;
/*text-transform: uppercase;*/
}
h3{
font-weight:400;
padding: 0;
color: #fff8f0;
line-height: normal;
}
.downloads-overzicht .com-content-category__children h3,
.blog li.com-content-blog__link a{
border: solid 1px #fff;
}
.blog h3.page-header a,.blog h3.page-header a::before,
.blog li.com-content-blog__link a{
text-decoration: none;
display: inline-flex;
padding: 1rem;
}
.blog li.com-content-blog__link a{
width: 100%;
}
.blog ol.com-content-blog__links{
padding-left: 0;
margin-left: 0;
}
.blog h3.page-header:hover,
.blog li.com-content-blog__link a:hover{
background: rgba(255,255,255,0.3)
}
.contenttopmodule h1,
.contenttopmodule h2,
.contenttopmodule h3,
.contentbodemmodule h1,
.contentbodemmodule h2,
.contentbodemmodule h3,
.bodemmodule h1,
.bodemmodule h2,
.bodemmodule h3{
text-align: center;
margin: 1vw 0 2vw 0;
}
.contenttopmodule .keukenslider h3,
.contentbodemmodule .keukenslider h3{
margin: 0 ;
padding: 1vw 0;
background: #464444;
}
strong{
font-weight: 700;
}
form{
margin: 0 !important;
}
/********mo fa module ***/
.bloktekst h4{
font-weight:400;
line-height: normal;
color: #FFF8F0;
text-transform: uppercase;
letter-spacing: 2px;/**/
font-size: var(--font-size-xxl);
margin-bottom: 2vw;
}
@media only screen and (max-width: 2000px) {
.headerblok-links h1{
font-size: var(--font-size-xl);
}
}
/************************ standaard element*/
img.svg{
width: 100vw;
}
img{
/*width: 100%;*/
height: auto;
max-width: 100%;
}
p{
margin-bottom: calc(1.1rem + 0.39vw); /***ook bij ul veranderen hieronder**/
width: 100%;
}[class*="span"]{
min-height:0px;
}article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
padding: 0;
margin:0;
}
/***********************lijst*******/
ul.numeric-decimals {
counter-reset:section;
list-style-type:none;
}ul.numeric-decimals li {
list-style-type:none;
}ul.numeric-decimals li ul {
counter-reset:subsection;
}ul.numeric-decimals li:before{
counter-increment:section;
content:counter(section) ". ";
/*content:"Section " counter(section) ". ";*/
}
ul.numeric-decimals li ul li:before {
counter-increment:subsection;
content:counter(section) "." counter(subsection) " ";
}ul,
ol {
margin-bottom: calc(1.1rem + 0.39vw);/***ook bij p veranderen hierboven**/
list-style-position:outside;
}ol.com-content-blog__links{
list-style: none;
}
/************************modal*************************************************************/
.modal-content{
background-color: #373535;
}
.modal-content h3{
color: #FFF8F0;
}
.modal-header,
.modal-footer{
border: none;
}
.modal-backdrop{
background-color: #000000;
}.modal-backdrop {
opacity: 0.8 !important;
/***}
@media (min-width: 576px) {
.homekeukenmerken .modal-dialog {
max-width: 50vw!important;*/
}
.modal-dialog li{
text-align: center;
}
/************************************scroll header praralax met clipp path en geen backgroundimg met tekst**/
#headerstartpagina{
position: relative;
height: 36vw;/**/
}
#headerons-bedrijf,
#headerdownload,
#headeronline-brochures-merken,
#headerlevering-van-keukens-naar-aruba-bonaire-en-curacao,
#headerde-partners{
position: relative;
height: 28vw;
}
#headerstartpagina .mod-custom,
#headerons-bedrijf .mod-custom,
#headerdownload .mod-custom,
#headeronline-brochures-merken .mod-custom,
#headerlevering-van-keukens-naar-aruba-bonaire-en-curacao .mod-custom,
#headerde-partners .mod-custom{
display: block;
}
#headerstartpagina .image-container{
position: relative;
height: 36vw;
clip-path: inset(0);
}
#headerons-bedrijf .image-container,
#headerdownload .image-container,
#headeronline-brochures-merken .image-container,
#headerlevering-van-keukens-naar-aruba-bonaire-en-curacao .image-container,
#headerde-partners .image-container{
position: relative;
height: 28vw;
clip-path: inset(0);
}
#headerstartpagina .image-container img{
object-fit: cover;
position: fixed;
width: 100%;
}
#headerons-bedrijf .image-container img,
#headerdownload .image-container img,
#headeronline-brochures-merken .image-container img,
#headerlevering-van-keukens-naar-aruba-bonaire-en-curacao .image-container img,
#headerde-partners .image-container img{
object-fit: cover;
position: fixed;
width: 100%;
}
#headertext div.custom{
color: #373535;
align-self: center;
text-transform: uppercase;
letter-spacing: 1px;
font-size: var(--font-size-lg);
}
#headertext p{
margin: 0!important;
}
#headertext{
background-color: rgba(255,248,240,0.3);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
height: calc(3rem + 1vw);
align-items: stretch;
justify-content: center;
position: absolute;
bottom: 0;
width: 100%;
}
@media only screen and (max-width: 1199px) {
#headertext div.custom{
font-size: var(--font-size-md);
}#headerstartpagina #headertext {
background-color: rgba(255,248,240,0.7);
}
#headerstartpagina .image-container,
#headerstartpagina{
height: 43vw;
}
#headerlevering-van-keukens-naar-aruba-bonaire-en-curacao #headertext{
display: none!important;
}
}
@media only screen and (max-width: 767px) {
#headertext div.custom{
font-size: var(--font-size-m);
}
#headerstartpagina .image-container,
#headerstartpagina{
height: 46vw;
}
}
/**** end scroll header**/
a {
color: inherit;
text-decoration:underline;
}a:hover,
a:focus{
text-decoration: none;
}
.result__title-url,
.result__date{
color: #fff8f0;
}
/***********************************************velden logo ect**/
ul.fields-container{
margin-left:0;
padding-left:0;
list-style: none;
text-align: center;
margin-bottom: 1rem;
}.modal ul.fields-container{
margin-bottom: 1rem !important;
}
.downloads-velden-custom ul.fields-container{
text-align: left;
}
.downloads-velden-custom ul.fields-container span.download-uitvoer{
font-family: 'Mulish',"Open Sans",sans-serif;
font-size: var(--font-size-base);
font-weight: 300;
}
.downloads-velden-custom ul.fields-container span.download-uitvoer a{
line-height: 1.2rem;
}
.downloads-velden-custom ul.fields-container li{
display: block!important;
padding: 1.8rem;
}
/*****************folders van der velden**/
.folders-image img{
width: 100%;
}
.folder-blog .item-page.download-pagina img{
background: #fff;
}
/***1ste logo is lichte logo**/
/***2de logo is donkere logo**/
/*header merken pagina opmaak*/
/**let op alles beginnende met sk_ is afhankelijk van de titel wat je invult in Joomla, verander je de titel dan moet dit ook veranderen, zie class body**/
.headerblok-logomerken h1,
.item-page.download-pagina h1,
.com-content-category-blog.font h1{
font-family: 'Sacramento', cursive;
text-transform: none;
font-size: var(--font-size-xxxl);
line-height: 1;
}
@media only screen and (max-width: 767px) {
.headerblok-logomerken h1,
.item-page.download-pagina h1,
.com-content-category-blog.font h1{
font-size: var(--font-size-xl);
}
}
.keukenmerken h1,
.keukenapparatuur h1{ /**menu > pagina class aan te passen**/
font-weight:200;
line-height: normal;
color: #FFF8F0;
text-transform: uppercase;
font-size: var(--font-size-xxxl);
font-family: 'Mulish',"Open Sans",sans-serif;
}
.logo.hoofdlogo{
padding: 1rem 0;
}
.logo.hoofdlogo img{
width: 15vw;
}
.startpagina .tweede-logo.verberg,
.keukenmerken .tweede-logo.verberg,
.keukenapparatuur .tweede-logo.verberg,
.onze-merken .tweede-logo.verberg{
display: none;
}
.onze-merken .modal .eerste-logo{ /*modal*/
display: flex;
}
.onze-merken .modal .tweede-logo.verberg, /*modal*/
.item-page .tweede-logo{
display: none;
}
.keukenmerken .afbeeldingmerken,
.keukenapparatuur .afbeeldingmerken {
display: none;
}
.achtergrond.achtergrond-merkenlogo,
.keukens .modal .achtergrond.achtergrond-merkenlogo{/***verberg achtergrond dat gebruikt wordt bij keukens overzicht**/
display: none;
}
.keukens .achtergrond.achtergrond-merkenlogo{
display: block;
grid-column: 1 / 3;
grid-row: 1;
z-index: 5;
}
.modal .logo img{
width: 15vw !important;
}
.modal li{
justify-content: center;
}
@media only screen and (max-width: 2000px) {
.keukenmerken h1,
.keukenapparatuur h1{
font-size: var(--font-size-xl);
}
}
@media only screen and (max-width: 1399px) {
.logo.hoofdlogo img{
width: 25vw;
}
.modal .logo img{
width: 20vw !important;
}
}
@media only screen and (max-width: 1000px) {
.logo.hoofdlogo img{
width: 30vw;
}
.modal .logo img{
width: 25vw !important;
}
}
@media only screen and (max-width: 767px) {
.logo.hoofdlogo img{
width: 100%;
}
.hoofdlogo{
width: 50%;
}
#hoofdmenu .logo{
padding: 0.5rem 0;
}
.modal .logo img{
width: 35vw !important;
}
}
/********end velden logo**/
.zoek-afspraak{
margin: 0 2rem 0 0;
}
@media only screen and (max-width: 475px) {
.zoek-afspraak{
margin: 0;
}
}
.afspraak .btn{
font-size: var(--font-size-base);
border: 1px solid #373535 !important;
border-radius: 0 !important;
display: flex;
align-items: center;
background: transparent;
}
.bloktekst .afspraak .btn{
font-size: var(--font-size-base);
border: 1px solid #FFF8F0 !important;
border-radius: 0 !important;
}
.bloktekst .afspraak a.btn{
color: #FFF8F0;
}
.afspraak .btn:focus{
background: transparent!important;
}
#content{
min-height: 10vw;
}
#informatie{
background-color:#373535;
}.show-desktop{
display: flex;
}
.hidden-desktop{
display: none;
}
.show-smallmobiel{
display: none;
}
@media only screen and (max-width:1399px){
.show-mobiel{
display: flex;
}.hidden-mobiel{
display: none;
}
}
@media only screen and (max-width:700px){
.show-smallmobiel{
display: flex;
}.hidden-smallmobiel,
.hidden-desktop{
display: none;
}
}
/*******************footermenu******************************/
#footermenu ul.nav{
padding-left: 0;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
text-align: center;
}
@media only screen and (max-width: 767px) {
#footermenu ul.nav li{
text-align: center!important;
}#footerinfo .moduletable,
#footerinfo .custom{
padding-left:0;
padding-top:0;
padding-bottom: 0;
padding-right:0;
width:100%;
}#footerinfo{
text-align:center;
width:100%;
line-height: normal;
padding-top: 2rem;
padding-bottom: 0.5rem;
font-size: var(--font-size-s);
}#copyright{
width:100%;
}#footerinfo a{
font-size:12px;
text-decoration:underline;
}#footermenu{
width:100%;
padding: 25px 0 0 0;
}
}
/************************************************ footers******** */
.achtergrond-footer{
background-color: transparent;
}
.achtergrondfooterinfo{
background-color: transparent;
}
footer #footercontainer .mod-custom{
display: block;
}
footer #footercontainer,
footer #footercontainer h3{
/*min-height: 10vw;*/
color: #373535;
background-color: #FFF8F0;
}footer #footercontainer h3{
font-size: var(--font-size-m);
letter-spacing: 0;
text-align: center;
margin-bottom: 1rem;
/*}
footer #footercontainer div{
align-self: center;*/
}
#footercontainer a{
text-decoration: none
}
#footercontainer a:hover,
#footercontainer a:focus{
color: #c36d15;
text-decoration: underline;
}#footercontainer .btn,
#footercontainer .btn-primary{
background-color: #FFF8F0;
margin: 5px;
}#footercontainer .fas.icon-phone,
#footercontainer .fas.icon-mail{
color: #FFF8F0;
padding-right: 5px;
}#footercontainer .btn:hover,
#footercontainer .btn-primary:hover,
#footercontainer a:hover .fas.icon-phone,
#footercontainer a:hover .fas.icon-mail{
text-decoration: none;
}
#footeradres p,
#footerinfo p,
#footerdivers p{
padding: 0;
margin: 0;
text-align: center;
}
#footersocials .custom{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
justify-content: center;
}
#footersocials p{
width: auto;
padding: 0;
margin: 0;
text-align: center;
}
#footersocials img{
/*width: 5vw;*/
}
#footersocial p{
text-align: center;
width: 100%;
}
#footerdivers{
text-align: center;
font-weight: 500;
}
#footerdivers img{
width: 200px;
}#footerinfo{
font-size: 0.7rem;
padding: 5vw 0 0.5vw 0;
color:rgba(255,248,240,0.4);
}#footerinfo .custom{
}#footeradres{
line-height: 2rem;
text-align: center;
}#footermenu .nav{
margin: 0;
}
@media only screen and (max-width:979px){
footer #footercontainer{
padding: 2rem 0;
}
#footersocial img{
width: 10vw;
}
}
@media only screen and (max-width: 767px) {
#footeradres,
#footermenu,
#footerdivers,
#footersocials{
padding: 5% 0 !important;
}#footercontainer h3{
font-size: 1rem;
margin: 0;
}
.achtergrond-footer{
padding-left: 5vw;
padding-right: 5vw;
}
}
@media only screen and (max-width: 576px) {
footer #footercontainer {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0;
}
footer #footercontainer div:last-of-type{
border-bottom: none;
}
#footersocial img{
width: 20vw;
}
}
/*****************************************module algemeen**/
.mod-custom{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
flex-direction: column;
}/*
*/
[class*="moduletable"],
.item-page{
display: block;
width: 100%;
/*padding-bottom: 6vw;*/
}
[class*="moduletable"] a:hover,
[class*="moduletable"] a:focus{
color:inherit;
}
/**********************************contentbodemmodule * contenttopmodule bodemmodule******/
.contenttopmodule .moduletable {
margin: 3vw 0;
}
.contentbodemmodule .moduletable{
margin: 3vw 0;
}
.bodemmodule .moduletable{
margin: 3vw 0;
}
.bodemmodule a img{
transition: all .5s ease-in-out;
}
.bodemmodule a:hover img{
/*filter: grayscale(100%) sepia(40%);*/
transform: scale(1.2);
transition: all .5s ease-in-out;
}
/******************************************news flash******************/
.newsflash-title{
/*text-align: center;*/
}
.newsflash{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.mod-articlesnews__item {
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
position: relative; /***ivm news flash geen klikbare afbeelding**/
/***overflow: hidden; ivm news flash geen klikbare afbeelding**/
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
/*margin: 0 1vw 3vw 1vw;*/
}
.mod-articlesnews__item img{
/*border-radius: 5%;
border: solid 3px #FFF8F0;*/
}
figure.newsflash-image{
text-align: center;
}
.mod-articlesnews__item h3{
position: absolute; /***ivm news flash geen klikbare afbeelding**/
bottom: 0; /***ivm news flash geen klikbare afbeelding**/
/***height: 100%; ivm news flash geen klikbare afbeelding**/
/***width: 100%;ivm news flash geen klikbare afbeelding**/
/***opacity: 0; ivm news flash geen klikbare afbeelding**/
background-color: transparent;
display: flex;
text-transform: uppercase;
letter-spacing: 4px;
}
.mod-articlesnews__item h3{
}
.mod-articlesnews__item .readmore a.btn,
.mod-articlesnews__item .readmore a{
border: none!important;
border-radius: 0;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.mod-articlesnews__item .readmore a.btn:hover,
.mod-articlesnews__item .readmore a:hover{
color: #373535;
}
.mod-articlesnews__item p.readmore{
margin: 0;/***ivm news flash geen klikbare afbeelding**/
padding: 0;/***ivm news flash geen klikbare afbeelding**/
}
@media only screen and (max-width:767px){
.newsflash{
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.mod-articlesnews__item{
-webkit-flex: 0 0 95% !important;
-ms-flex: 0 0 95% !important;
flex: 0 0 95% !important;
margin: 5vw !important;
}
}
/*****************************acties artikel****/
.acties-item-page .item-image{
display: flex;
justify-content: center;
flex-grow: 1;
}
.acties-item-page .item-image img{
flex-grow: 1;
/***uitverkoop**/
/*****responsive tabel om de table hee heb ik nu class overflowx gegeven***/
}div.overflow-x{
overflow-x: auto;
}
table.responsivetable{
border-collapse: collapse;
border-spacing: 0;
width: 100%;
border: 1px solid #ddd;
}
table.responsivetable th,
table.responsivetable td {
text-align: left;
padding: 8px;
}
table.responsivetable th{
border-bottom: 1px solid #373535;
border-top: 1px solid #373535;
}
table.responsivetable td {
border-bottom: none;
}
tr:nth-child(odd){
background-color: rgba(255,248,240,0.95);
color: #373535;
}
tr:nth-child(even){
background-color: #fff8f0;
color: #373535;
}
@media (max-width:979px){
td{
width: 2%;
}table{
min-width:767px;
}
#tabel-responsive{
-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.6);
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.6);
box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.6);
}table.responsivetable{
min-width: auto;
}
}
/*****************************************************************text columns***tekst kolommen***/
.acties-item-page .com-content-article__body,
.acties .com-content-article__body{
-webkit-columns: 3 600px;
-moz-columns: 3 600px;
columns: 3 600px; /*let op, breedtte altijd aangeven in px zodat het op kleiner scherm automatisch breekt in 1 column*/
-webkit-column-gap: 9rem;
-moz-column-gap: 9rem;
column-gap: 9rem;
/*column-rule: dotted 1px rgba(255,248,240,0.3);*/
}.acties-item-page .com-content-article__body .page-header{
-webkit-column-span: all;
-moz-column-span: all;
column-span: all;
}.openingstijden .com-content-article__body ul{
}li, ol{
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
text-align: left;
}
.items-leading .item-content p,
.category-desc p{
margin: 0 0 1rem 0; /****anders heb je als het met een paragraph begint heb je een lege ruimte erboven bij gebrui8k van column count**/
/***eind text column**/
/******************************************news flash custom override acties******************/
}
.mod-acties h4{
padding: 1.5rem;
}
.mod-acties h4::after{
font-family: "Font Awesome 6 Free";
content: "\f054";
font-weight: 900;
text-decoration: none !important;
position: absolute;
right: 1.5rem;
top: 1.5rem;
}
.mod-acties a{
text-decoration: none;
display: flex;
width: 100%;
flex-wrap: wrap;
height: 100%;
background: #464444;
}
.mod-acties figure,
.mod-acties h4{
flex: 0 0 100%;
align-self: flex-start;
}
.mod-acties h4{
position: relative;
margin-bottom: 0;
font-size: 1.1rem;
padding: 1rem 3rem 1rem 1.5rem;
}
.mod-acties-item figure{
overflow: hidden;
}
.mod-acties-item a img{
transition: all 1s ease-in-out;
}
.mod-acties-item a:hover img{
/*filter: saturate(0) sepia(0.22) blur(3.9px);*/
transform: scale(1.1);
opacity: 1;
transition: all 1s ease-in-out;
}
.mod-acties-item a:hover h4{
opacity: 0.5;
/***************************home acties***********************************************/
}
.mod-articlesnews-horizontal.actieshome{
grid-template-columns: repeat(auto-fit,minmax(400px,1fr));
/******************************************news flash custom override ******************/
}
.keukenmerkenhome {
margin-bottom: 3vw;
}.keukenmodal a img:hover{
filter: saturate(0) sepia(0.22) blur(3.9px);
}
.mod-articlesnews-horizontal{
margin: 0;
justify-content: center;
grid-gap: 2vw;
}
.keukenmerken-home h2,
.merken-home h2{
text-transform: uppercase;
letter-spacing: 2px;
font-size: var(--font-size-xxxl);
text-align: center;
padding: 0 2vw 0 ;
margin-top: 3vw;
}
.keukenmerken-home{
/*margin-right: 5vw;
margin-left: 5vw;*/
}
.homekeukenmerken .keukenmodal{
text-align: center;
}
.keukenmodal .newsflash-title{
z-index: 1;
display: inline-block;
width: 100%;
left: 0;
text-align: center;
}
.keukenmodal h3{
font-size: var(--font-size-xxxl);
font-weight: 400;
letter-spacing: 1px;
margin-bottom: 0;
display: inline-block;
transition: .5s ease-in-out;
}
.keukenmodal a:hover h3,
.keukenmodal a:hover h3 i{
transition: .5s ease-in-out;
}.keukenmodal a h3 i{
transition: .5s ease-in-out;
}.keukenmodal a:hover h3 i{
transform: rotate(-90deg);
}
.modal-content .icon-chevron-right{
color: #fff8f0;
/***************************************home newsflash blokken diverse merken vertikaal override**/
}
.merkenmodal a img:hover{
filter: saturate(0) sepia(0.22) blur(3.9px);
}ul.mod-articlesnews-vertical{
margin: 0;
}
.merkenmodal a{
text-decoration: none;
}
.merkenmodal h3{
font-size: var(--font-size-xxxxl);
font-weight: 400;
letter-spacing: 1px;
width: auto;
margin: 0;
background: #464444;
color: #FFF8F0;
align-items: center;
justify-content: center;
display: flex;
/*margin-bottom: 0;
display: inline-block;
transition: .5s ease-in-out;*/
}.merkenmodal a h3 i{
/*transition: .5s ease-in-out; */
align-self: center;
font-size: var(--font-size-xxxl);
transition: .5s ease-in-out;
}.merkenmodal a:hover h3 i{
color: #373535;
transform: rotate(-180deg);
transition: .5s ease-in-out; /**/
}
.merkenmodal .merkencontent{
grid-auto-flow: column;
grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
grid-column-gap: 0;
grid-row-gap: 0;
}
li.merkenlijst:nth-child(odd) h3{
background: #464444;
color: #FFF8F0;
grid-row-start: 1;
grid-row-end: 3;
grid-column-start: 2;
grid-column-end: 3;
}
.merkenicon-linksrechts{
display: flex;
}
li.merkenlijst:nth-child(even) .merkenicon-linksrechts{
justify-content: flex-end;
}
li.merkenlijst:nth-child(odd) h3 .merkennaam {
order: 2 !important;
}
li.merkenlijst:nth-child(odd) h3 i {
order: 1;
margin-left: 1vw;
margin-right: 2vw;
}li.merkenlijst:nth-child(even) h3 i{
transform: rotate(180deg);
margin-left: 2vw;
margin-right: 1vw;
}li.merkenlijst:nth-child(even) a:hover h3 i{
transform: rotate(0deg);
}
/**************************************************************newsflash onze-merken logo pagina override**/
.onze-merken h3{
/*border-bottom: solid 1px #FFF8F0;*/
}
.onze-merken .mod-articlesnews-horizontal{
grid-gap: 0;
}
.onze-merken .contenttopmodule .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat( 2 , 1fr );
}
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat( 6 , 1fr );
}
.onze-merken .contenttopmodule .mod-articlesnews-horizontal.merken li{
padding: 5% 0;
}
.onze-merken .contenttopmodule .mod-articlesnews-horizontal.merken .modal li,
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken .modal li{
padding: 0;
}
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken li{
padding: 3% 10%;
}
.modal-body.merken ul li img{
padding: 0;
}
ul.merken li img{
/*padding: 2vw 2vw;*/
transition: .5s ease-in-out;
}
.onze-merken .keukenmodal a li span img{
-webkit-filter: none;
-moz-filter: none;
filter: none;
}
.onze-merken .keukenmodal a:hover li span img{
filter: drop-shadow(0px 2px 2px #373535) sepia(100%);
transform: scale(1.05) ;
transition: .5s ease;
}
.onze-merken .keukenmodal a li span img:hover{
}
ul.merken ul{
margin-bottom: 0;
}
ul.merken li{
/*display: inline-block;*/
background: #464444;
justify-content: center;/*hierdoor ging alles ongelijk staan*/
align-content: center;
flex-direction: row;/**/
border: solid 0.1rem #373535;
}
div.merken.logo li{
border: none;
grid-column: 1;
grid-row: 1;
z-index: 10;
}
ul.merken .modal li{
background: none;
}
ul.merken li a{
display: flex;
align-items: center;
height: 100%;
justify-content: center;
}
ul.merken .min-height{
/*min-height: 355px;*/
}.keukenapparatuur .mod-articlesnews-horizontal.merken{
margin: 0;
justify-content: center;
grid-gap: 0;
grid-template-columns: repeat(4, 1fr);
}.keukenapparatuur ul.merken li.field-entry.logo img{
width: 50%;
padding: 0;
}
.keukenapparatuur .achtergrond-merkenlogo img,
.keukenmerken .achtergrond-merkenlogo img
{
width: 100%;
}
.merken.logo .logo span{
display: flex;
align-items: center;
justify-content: center;
}
.keukenmerken ul.merken li.field-entry.logo img,
.onze-merken .contenttopmodule ul.merken li.field-entry.logo img {
width: 15vw;
}
/********************************************keuken merken***/
.keukens div.merken{
width: 100%;
}
.keukens ul.merken ul{
position: relative;
display: grid;
grid-auto-flow: column;
grid-template-columns: 1fr;
grid-column-gap: 0;
grid-row-gap: 0;
}
.keukens ul.merken li img{
padding: 0;
/*
}.keukens ul.merken li .modal img{
padding: 2vw 0;*/
}
.keukens ul.merken li img
.keukens ul.merken li {
border: none;
}
.keukens ul.merken li{
background: transparent;
overflow: hidden;
border: none;
}
.keukens ul.merken li.field-entry.achtergrond-merkenlogo img{
width: 100%;
/*position: absolute;*/
left: 0;
bottom: 0;
z-index: -1;
}
.keukens ul.merken li a{
display: flex;
align-items: flex-end;
height: 100%;
justify-content: center;
}
.keukens .keukenmodal a:hover li.achtergrond span img{
filter: none;
transform: scale(1.1) ;
}
.keukens .keukenmodal a:hover li.logo span img{
transform: scale(0.5) ;
opacity: 0.5;
filter: none;
/****************************************************/
}
@media only screen and (max-width:1790px){
.keukenmodal h3,
.keukenmodal a h3 i{
font-size: var(--font-size-lg);
letter-spacing: 0;
}
.keukenmodal a:hover h3,
.keukenmodal a:hover h3 i{
transition: .5s ease-in-out;
}
}
@media only screen and (max-width:1500px){
.keukenmerken-home{
margin: 0;
}
.keukenmerken-home h2,
.merken-home h2{
font-size: var(--font-size-xxxl);
}
.merkenmodal h3,
.merkenmodal a h3 i{
font-size: var(--font-size-xxxl);
}
}
@media only screen and (max-width:1399px){
.keukenapparatuur .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat(3, 1fr);
}
}
@media only screen and (max-width:1200px){
.merkenmodal h3,
.merkenmodal a h3 i{
font-size: var(--font-size-xl);
}
.container-xl{
--bs-gutter-x:0 !important;
}
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat( 4 , 1fr );
grid-auto-rows: minmax(100px, auto);
}
}
@media only screen and (max-width:997px){
.keukenapparatuur .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat(2, 1fr);
}
.keukenmerken-home h2,
.merken-home h2{
font-size: var(--font-size-xxl);
}
.merkenmodal h3,
.merkenmodal a h3 i{
font-size: var(--font-size-lg);
}
.keukenmodal h3,
.keukenmodal a h3 i{
font-size: var(--font-size-md);
}
.keukenmerken ul.merken li.field-entry.logo img,
.onze-merken .contenttopmodule ul.merken li.field-entry.logo img,
.onze-merken .contentbodemmodule ul.merken li.field-entry.logo img{
width: 20vw;
}
}
@media only screen and (max-width: 767px) {
.keukens .logo{
width: auto;
}
}
@media only screen and (max-width:750px){
.onze-merken .keukenmodal a:hover li span img{
filter: none;
transform: none;
opacity: 0.7;
}
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat( 3 , 1fr );
}
}
@media only screen and (max-width:700px){
.merkenmodal h3,
.merkenmodal a h3 i{
font-size: var(--font-size-md);
}
}
@media only screen and (max-width:600px){
.keukenapparatuur .mod-articlesnews-horizontal.merken,
.keukenmerken .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat(1,1fr);
}
.keukenmerken ul.merken li.field-entry.logo img,
.onze-merken .contenttopmodule ul.merken li.field-entry.logo img,
.onze-merken .contentbodemmodule ul.merken li.field-entry.logo img{
width: 35vw;
}
.onze-merken .contentbodemmodule .mod-articlesnews-horizontal.merken{
grid-template-columns: repeat( 2 , 1fr );
}
}
@media only screen and (max-width:500px){
.merkenmodal h3,
.merkenmodal a h3 i{
font-size: var(--font-size-base);
}
}
/************************************************kruimelpad*/
/* De home icon aan het begin van de breadcrumb
}.breadcrumb li.active span.icon-location {
background-position: 0 -24px;
margin-left: 0;*/
.breadcrumb-item + .breadcrumb-item::before{
color: #fff8f0;
}.breadcrumb{
background-color: transparent;
border-radius: 0;
margin-bottom: 0;
}.breadcrumb > li{
text-shadow: none;
margin: 0.3vw;
}ul.breadcrumb ,
ol.breadcrumb {
margin-left: 0 !important;
padding-left: 0 !important;
}#pathway{
display:block;
font-size: var(--font-size-base);
}a.pathway,
.breadcrumb > li > .divider{
color: #fff8f0;
}.breadcrumb > .active {
color: #fff8f0;
font-weight:600;
}
@media only screen and (max-width:455px){
.breadcrumb{
display: none;
}
}
/**********************************contact***/
.com-contact legend{
font-size: 1.5rem;
margin-bottom: 1rem;
}
.form .area_container31,
.form .privacyverklaring{
margin: 1rem 0;
}
.nui.red{
color: #fff8f0!important;
}
[title="Ga akkoord met ons privacybeleid."]{
margin-bottom: 1rem;
}
.control-label a label{
cursor: pointer;
}
.optional{
font-size: 0.7em;
font-style: oblique;
font-style: italic;
}dt{
font-weight: 600;
}
#jform_contact_email_copy-lbl{
float: left;
margin-right: 1rem;
}
.form-control-feedback{
color: #dc3545;
font-size: 0.8rem;
font-weight: 600;
margin-left: 0.8rem;
}
.control-label{
margin-top: 1vw;
}input[type=checkbox],
input#gdpr_privacy_policy_checkbox{
width: 1.4em;
height: 1.4em;
margin-top: 0.25em;
vertical-align: top;
background-color: #f8f9fa;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
border: 1px solid rgba(0, 0, 0, 0.25);
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-print-color-adjust: exact;
color-adjust: exact;
print-color-adjust: exact;
border-radius: 0.25em;
}input[type=checkbox]:checked,
input#gdpr_privacy_policy_checkbox:checked{
background-color: #8EE48E;
border-color: #8EE48E;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFF8F0' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}input[type=checkbox]:focus,
input#gdpr_privacy_policy_checkbox:focus{
border-color: #8EE48E;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(142,228,142,0.25);
}
.form-search textarea,
.form-inline textarea,
.form-horizontal textarea,
.form-search select,
.form-inline select,
.form-horizontal select,
.form-search .help-inline,
.form-inline .help-inline,
.form-horizontal .help-inline,
.form-search .uneditable-input,
.form-inline .uneditable-input,
.form-horizontal .uneditable-input,
.form-search .input-prepend,
.form-inline .input-prepend,
.form-horizontal .input-prepend,
.form-search .input-append,
.form-inline .input-append,
.form-horizontal .input-appen,
#contact-form #jform_contact_name,
#contact-form #jform_contact_email,
#contact-form #jform_contact_emailmsg,
[id*="mod-search-searchword"],
#mod-finder-searchword103,
#jform_contact_message,
input.search-query{
border: 1px solid #F0EFED !important;
box-shadow: none;
outline: none;
}
.contact-form legend{
font-weight: 500;
}
.dl-horizontal{
display: grid;
grid-template-columns: auto 1fr;
grid-column-gap: 5%;
}
.com-contact h3{
display: none; /**ivm met als het contactformulier uitgezet wordt en om een override te voorkomen want h3 heeft geen class om apart te selecteren voor een column plek bij deactiveren formulier***/
}
.com-contact,
.contactformulier_chrono {
display: grid;
grid-template-columns: 1fr 1fr;
grid-auto-rows: fit-content(0); /***kan ook gebruikt worden: grid-auto-rows: minmax(min-content, max-content); verschil: de minmax() neemt eerder de maximaal toegestane ruimte in beslag, terwijl de fit-inhoud niet meer ruimte inneemt dan nodig is. ***/
grid-column-gap:5vw;
flex: 0 0 55vw;
}
.com-contact.contact h2{
display: none;
}
.com-contact .page-header {
grid-column: 1 / 2;
}
.contactformulier_chrono .page-header {
grid-column: 2 / 3;
grid-row: 1 / 2;
}.contactformulier_chrono figure.item-image{
grid-column: 1 / 2;
grid-row: 2 / 4;
}
.contactformulier_chrono .com-content-article__body{
grid-column: 2 / 3;
grid-row: 2 / 3;
}
/*************************contactform joomla**/
.com-contact .com-contact__container{
/*contact form rechts en info links****
grid-column: 1;
grid-row: 2 / 4;*/
grid-column: 2;
grid-row: 2 / 4;
}
.com-contact .com-contact__miscinfo {
/*contact form rechts en info links****
grid-column: 1;
grid-row: 4 ; */
grid-column: 2;
grid-row: 4 ;
}
.com-contact .com-contact__form{
/*contact form rechts en info links****
grid-column: 2;
grid-row: 2 / 6;*/
grid-column: 1;
grid-row: 2 / 6;
}@media only screen and (max-width:1300px){
.com-contact,
.contactformulier_chrono {
-webkit-flex: 0 0 85vw;
-ms-flex: 0 0 85vw;
flex: 0 0 85vw;
grid-column-gap:3vw;
}
}
@media only screen and (max-width:1120px){
.contactformulier_chrono {
grid-template-columns: 1fr;
}
.contactformulier_chrono .page-header {
grid-column: 1 / 1;
grid-row: 1 / 1;
}.contactformulier_chrono figure.item-image{
grid-column: 1 / 1;
grid-row: 3 / 4;
}
.contactformulier_chrono .com-content-article__body{
grid-column: 1 / 1;
grid-row: 2 / 3;
}
}
@media only screen and (max-width:995px){
.com-contact {
-webkit-flex: 0 0 90vw;
-ms-flex: 0 0 90vw;
flex: 0 0 90vw;
}
}
@media only screen and (max-width:767px){
.com-contact {
grid-template-columns: 1fr;
grid-row-gap: 5vw;
/*padding: 0 5vw;*/
}.com-contact .page-header{
grid-column: 1;
grid-row: 1;
}
.com-contact .com-contact__container{
grid-column: 1;
grid-row: 2 ;
}
.com-contact .com-contact__miscinfo {
grid-column: 1;
grid-row: 4 ;
}
.com-contact .com-contact__form{
grid-column: 1;
grid-row: 3;
}
}
/*****************btn opmaak icon-chevron*/
/***********************************************zoek*/
.awesomplete{
width: 100%;
margin-bottom: 3rem;
}
.input-group .btn-primary{
border-top-left-radius: 5px !important;
border-bottom-left-radius: 5px !important;
}
/********eind zoeken************/
.btn,
.btn-primary{
border: 1px solid #FFF8F0;
}.btn-outline-primary{
color: #FFF8F0;
}.btn-primary,
a.btn[title="Annuleren"],
.btn-secondary{
background-color:#FFF8F0;
background-image:none;
color: #373535;
display: inline-block;
margin: 3px;
}.pagination .icon-chevron-left,
.pagination .icon-chevron-right{
color: #665E5E;
}
.control-group{
margin: 1.5rem 0;
}.btn-group{
margin: 0 0 15px 15px;
}.btn-group:first-child {
}.btn-group a{
text-decoration:none !important;
color: #665E5E!important;
}
.btn-check:focus + .btn-primary,
.btn-primary:focus {
color: #665E5E;
background-color: none!important;
border-color: none !important;
box-shadow: none !important;
}.btn:hover,
.btn:focus,
.btn-primary:hover{
text-shadow:none;
background-position:0 -30px;
transition: none;
background: rgba(255,248,240,0.5);
color: #665E5E;
}.btn-outline-primary:hover {
color: #665E5E;
background-color: #fff8f0 !important;
border-color: #fff8f0 !important;
}
#footeradres .btn:hover,
#footeradres .btn:focus,
#footeradres .btn-primary:hover,
#footeradres .btn-outline-primary:hover{
}.moduletable.home .btn-close{
opacity: 0.8;
/*
}.pagenav a:hover .fa.fa-chevron-left,
.pagenav a:hover .fa.fa-chevron-right,s
.readmore a:hover .fa.fa-chevron-left,
.readmore a:hover .fa.fa-chevron-right{
color: #FFF8F0;*/
/*********************lees meer**/
}
.leesmeer{
margin: 1vw 1vw 1vw 0;
}
p.readmore{
margin: 2vw 0 0 0;
padding: 0;
min-width: 20%;
}
.readmore .icon-chevron-right{
order: 2;
color: #FFF8F0;
}.readmore{
display: flex;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
width: 100%;
}.readmore a.btn,
.readmore a{
margin:0;
font-size: var(--font-size-base);
background-color:transparent;
padding:2% auto;
text-decoration:none !important;
background-image:none;
box-shadow: none;
text-shadow:none;
border-radius: 0;
color: inherit;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}.readmore a.btn:hover,
.readmore a:hover{
text-decoration:none !important;
color: #FFF8F0;
opacity: 0.5;
outline: solid 2px #FFF8F0;
/****************************************login form module**/
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
border: 0;
}
/******************************headerblok artikel override en headerblok merken logo****/
/*ul.merken{
box-shadow: 0 0 0 3px #373535, 0 0 0 6px #ffead2;
}*/
.logomerken ul.fields-container {
text-align: left;
margin-bottom: 0;
/*margin-top: 5vw;*/
}
.afbeeldingmerken {
margin-bottom: 1.5vw;
}
.logomerken img{
width: auto;
}
.headerblok-logomerken .logomerken{
flex-basis: 40%;
}
.headerblok-logomerken .com-content-article__body{
flex-basis:auto
}
.logomerken li{
margin-bottom: 2vw;
}
@media only screen and (max-width: 1199px) {
.headerblok-logomerken .logomerken{
flex-basis: auto;
}
.headerblok-logomerken .logomerken h1{
letter-spacing: 0;
line-height: normal;
}
}
/***********************************************blog en artikel opmaak*******/
figcaption.caption{
font-size: 0.8rem;
color: #b4b4b4;
font-style: oblique;
font-style: italic;
line-height: normal;
}
.blog-featured{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
/*-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap; ***weggehaald omdat de footer niet meer naar bodem zakte hierdoor*******/
}
.blog-items .blog-item{
display: flex;
/* flex-direction: column;****moet weg anders werkt align-items stretch niet**/
align-items: stretch;
flex-wrap: nowrap;
margin: 2vw 0;
}
.blog-item,
.item-content{
width: 100%;
}
.com-content-article .left.item-image{
width: 25vw;
float: left;
display: inline-block;/**/
margin: 0 8vw 8vw 0;
}
/********************************************img effect blog***/
.downloads-brochures figure.item-image{
align-self: center;
}
.downloads-brochures figure.item-image img {
align-self: center;
cursor: pointer;
opacity: 1;
transition: .3s ease-in-out;
}
.downloads-brochures figure.item-image img:hover{
opacity: 0.3;
transition: .3s ease-in-out;
-moz-transform: scale(0.7);
-webkit-transform: scale(0.7);
-o-transform: scale(0.7);
-ms-transform: scale(0.7);
transform: scale(0.7);
}
@media only screen and (max-width:950px){
.blog .item-content{
display: block;
width: 100%;
}
.com-content-article .left.item-image{
width: 100%;
margin: 0 0 15px 0;
}
}
.blog-item .item-image img{
width: 100%;
}
.blog-item .left.item-image{
/**/ -webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
margin: 0 1.5vw 1.5vw 0
}
.blog-item .right.item-image{
}
.blog-item .item-content{
/* -webkit-flex: 0 0 50vw;
-ms-flex: 0 0 50vw;
flex: 0 0 50vw; */
}
.com-content-article__body img{
margin-bottom: 1vw 0;
}.items-leading .blog-item .item-content{
/*-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;*/
}
.category-desc{
margin-bottom: 0.5vw;
}
.parent-category-name{
color: #fff8f0;
font-weight: 600;
}.blog-items.items-leading{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}.items-leading .blog-item{
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
/*grid-column: 1 / 3;******uitgezet geen idee meer waarvoor ik dit hier heb neergezet, uitzoeken*/
margin:0 0 4vw 0;
width: 100%;
}.items-leading.downloads .blog-item{
margin:0 0 1rem 0;
}
@media only screen and (max-width:850px){
.blog-items .blog-item{
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.blog-item .left.item-image{
/* -webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
margin: 1.5vw 0;*/
}.items-leading .blog-item .item-content{
/*-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;*/
}
.blog-item .item-content{
/* -webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;*/
}
}
/*******************************blog colums
}***/
.blog-items.masonry-2 .blog-item .item-content,
.blog-items.columns-2 .blog-item .item-content,
.blog-items.masonry-3 .blog-item .item-content,
.blog-items.columns-3 .blog-item .item-content{
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.blog-items.downloads-brochures[class*="masonry-"] .item-content ,
.blog-items.downloads-brochures[class*="columns-"] .item-content {
display: none;
}
.blog-items{
display: grid;
grid-template-columns: repeat(1, 1fr);
grid-row-gap: 2rem;
}
.blog-items.masonry-2 ,
.blog-items.columns-2 {
grid-template-columns: repeat(2, 1fr);
grid-column-gap: 2rem;
}
.blog-items.masonry-3 ,
.blog-items.columns-3 {
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 2rem;
}
.blog-items.downloads-brochures[class*="masonry-"] ,
.blog-items.downloads-brochures[class*="columns-"] {
grid-gap: 2vw 10vw;
}
.blog-items.masonry-4 ,
.blog-items.columns-4 {
grid-template-columns: repeat(4, 1fr);
grid-column-gap: 2rem;
}
@media only screen and (max-width:1200px){
.blog-items[class*="masonry-"] ,
.blog-items[class*="columns-"] {
grid-template-columns: repeat(1, 1fr);
}
.blog-items.downloads-brochures[class*="masonry-"] ,
.blog-items.downloads-brochures[class*="columns-"] {
grid-template-columns: repeat(2, 1fr);
}
}
/****************************************************/
div[itemprop="articleBody"] {
width:auto;
}
[class^="span"] {
display: block;
}
.pagenavigation{
flex: 1 0 100%;
margin-top: 5vw;
display: block;
}
.download-pagina .pagenavigation{
margin-top: 15vw;
}
.pagenavigation .pagination{
justify-content: space-between;
}.pagination a{
margin: 0;
font-size: var(--font-size-base);
background-color: transparent;
padding: 2% auto;
text-decoration: none !important;
background-image: none;
box-shadow: none;
text-shadow: none;
border-radius: 0;
color: inherit;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}.pagination a:hover{
background-color: transparent;
opacity: 0.5;
color: #FFF8F0;
outline: solid 2px #FFF8F0;
}
.pagination .icon-chevron-right,
.pagination .icon-chevron-left{
color: #FFF8F0;
}
.pagination a.next{
margin-left: auto !important;
}.page-link{
color:#FFF8F0;
background-color: #373535;
border:none;
}.page-link [class*="icon-"] {
color:#FFF8F0;
}
.page-link:hover{
background-color: #fff8f0;
color: #FFF8F0;
}.result__title-text{
font-weight: 600;
/**************chronoforms**/
}div.chronoform,
.chrono_credits,
.chronocredits{
display: none;
}.cfdiv_checkbox label{
font-weight:bold;
}.ccms_form_element input[type="checkbox"],
.ccms_form_element input[type="radio"] {
clear:both !important;
}
.nui.form .field input[type="date"],
.nui.form .field input[type="datetime-local"],
.nui.form .field input[type="email"],
.nui.form .field input[type="month"],
.nui.form .field input[type="number"],
.nui.form .field input[type="password"],
.nui.form .field input[type="text"],
.nui.form .field input[type="time"],
.nui.form .field input[type="week"],
.nui.form .field textarea,
.nui.select,
input.check-selector,
.nui.select > .menu{
background: #FFF8F0 !important;
color: #373535 !important;
}
button#versturen{
background: #fff8f0;
}
.nui.button.iconed > svg.icon{
background-color: transparent!important;
color: #6c757d;
}
button#versturen:hover{
opacity: 0.5;
}
.nui.segment{
color: #373535 !important;
}
/*******************************************JCE*****/
.wf_caption{
text-align: center;
background-color: rgba(247, 245, 245,1);
padding: 5px;
margin-top: 5px;
font-style: italic;
color: #ababab;
max-width: 100% !important;
width: 100% !important;
font-size: 0.8rem;
}
.wf-zoom-image{
width: 100%;
}
a span.wf_file_size,
span.wf_file_date{
font-size: 10px;
font-style: italic;
}
/***jce pdf afbeelding**/
img[alt="pdf"]{
border:none !important;
width: 20px!important;
/********************************ck slider***/
/****home acties***/
}
#sliderck142 .swiper-slide .swiper-img-cont{
transition: all 0.3s ease-in-out;
}
#sliderck142 .swiper-slide:hover .swiper-img-cont{
transform: scale(1.1);
/*filter: grayscale(100%) sepia(40%);*/
transition: all 0.3s ease-in-out;
}
.swiper-slide .swiper-slide-shadow-left{
filter: grayscale(100%) sepia(40%);
/****werkwijze***/
}
.swiper-caption .swiper-title{
font-size: var(--font-size-lg);
}
.swiper-caption .swiper-desc{
font-size: var(--font-size-base);
line-height: normal;
}.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets{
display: flex;
justify-content: center;
margin-top: 0.5rem;
}.swiper-pagination{
position: static!important;
}
.swiper-button-prev,
.swiper-button-next{
margin-top: -80px!important;
}.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled{
opacity: 0!important;
}
@media only screen and (max-width:1200px){
.swiper-button-prev,
.swiper-button-next{
display: none;
}
/*********************************ck slideshow*****************/
}
.camera_prevThumbs, .camera_nextThumbs, .camera_prev, .camera_next, .camera_commands, .camera_thumbs_cont{
background: transparent !important;
}
.camera_caption > div{
background: rgba(0,0,0,0.0) !important;
margin: 0 auto;
text-align: center;
}.camera_target .cameraCont img{
margin-top: 0 !important;
}
.camera_caption_title{
font-weight: 300 !important;
/**/text-transform: uppercase;
text-align: right;
background: none !important;
}
.camera_caption_desc{
text-align: right;
}[id*="camera_wrap"]{
margin-bottom:0 !important;
}
.camera_pag{
position: absolute;
width:auto;
right:0;
top:0;
}
.camera_wrap .camera_pag .camera_pag_ul li{
background-color:#FFF8F0 !important;
/*******************ons bedrijf werkwijze slider ck en module****************************************/
}
.moduletable.werkwijze .swiper-img-cont img{
-webkit-filter: grayscale(100%) sepia(30%);
-moz-filter: grayscale(100%) sepia(30%);
filter: grayscale(100%) sepia(30%);
cursor: pointer;
}
.moduletable.werkwijze .swiper-img-cont:hover img {
filter: none;
}
.moduletable.werkwijze .swiper-img-cont img{
visibility: visible!important;
width: 100%;
}
.moduletable.werkwijze{
text-align: center;
}
.moduletable.werkwijze #sliderck111 .swiper-img-cont{
background-image: none!important;
/************************************************CK image effect**/
}figure[class*="effectck"] {
margin: 0!important;
cursor: pointer;
}
figure.effectck-ruby,
figure.effectck-chico,
figure.effectck-lily{
background: transparent!important;
}
figure[class*="effectck"] figcaption [class*="title"]{
font-size: var(--font-size-m)!important;
font-family: 'Mulish',"Open Sans",sans-serif !important;
color: #FFF8F0!important;
word-spacing: 0!important;
line-height: normal!important;
padding-bottom: 1vw;
}
figure.effectck-lily figcaption [class*="desc"]{
font-size: var(--font-size-sm)!important;
line-height: normal!important;
font-family: 'Mulish',"Open Sans",sans-serif !important;
letter-spacing: 0!important;
text-transform: none!important;
color: #FFF8F0!important;
}
@media only screen and (max-width: 1700px) {
.camera_caption_title {
font-size: 1.3rem !important;
}
}
@media only screen and (max-width: 1125px) {
.camera_caption_title {
font-size:1rem !important;
/**************************module ons team ****************/
}
}
.moduletable.ons-team .mod-custom{
flex-wrap: wrap;
display: flex !important;
flex-direction: row;
}.moduletable.ons-team figure[class*="effectck"] figcaption{
color: #FFF8F0!important;
}
figure.effectck-lily img{
-webkit-filter: grayscale(100%) sepia(40%);
-moz-filter: grayscale(100%) sepia(40%);
filter: grayscale(100%) sepia(40%);
}
figure.effectck-lily:hover img {
filter: none;
}
.moduletable.ons-team figure[class*="effectck"]{
flex: 1 1 25%;
}.moduletable.ons-team figure.effectck-lily figcaption > div {
/*height: 60%!important;*/
padding: 3vw !important;
}
figure.effectck-lily:hover figcaption > div {
background-color: rgba(55,53,53,0.2);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
/**#373535 rgba(255,248,240,0.3); **/
}
@media only screen and (max-width: 1055px) {
.moduletable.ons-team figure[class*="effectck"]{
flex: 1 1 50%;
} .moduletable.ons-team figure.effectck-lily figcaption > div {
padding: 1vw !important;
}
/**********************************re-captcha 2***/
}
@media only screen and (max-width: 480px) {
#jform_captcha,
#rc-imageselect
.g-recaptcha {
-webkit-transform:scale(0.77);
-webkit-transform-origin:0 0;
transform-origin:0 0;
transform:scale(0.77);
}
}
/* The progress container*/
.progress-container {
width: 100%;
background-color: #FFF8F0;
}
/* The progress bar (scroll indicator) */
.progress-bar {
min-height: 3px;
width: 0%;
background-color: #c36d15;
}
/**messenger chat gratis EB Messenger facebook en EB whatsapp*/
.messengerchat img.img_icon{
width: auto;
}
.messengerchat .message .name{
color: #373535;
}
.whatsappchat .popup-section .message p{
color: #FFF8F0;
}
.whatsappchat .image{
display: none;
}
.whatsappchat .popup-section .popup .popuptext .popup-box .popup-top .content .label{
background-color: #464444 !important;
color: #FFF8F0 !important;
}
.whatsappchat .popup-section .popup .popuptext .popup-box{
background-color: #FFF8F0 !important;
}
.whatsappchat .popup-section .popup .popuptext .popup-box .response input{
background-color: #FFF8F0 !important;
}
.whatsappchat .popup-section .popup .popuptext .popup-box{
border-radius: 15px!important;
}
.whatsappchat .popup-section .popup .popuptext .popup-box .chat-content .message::before,
.whatsappchat .popup-section .popup .popuptext .popup-box .chat-content .message{
background-color: #464444!important;
}
.whatsappchat .popup-section .popup .popuptext .popup-box .popup-top .close_pop_wtc svg{
background-color: #FFF8F0!important;
}
/*******************************************************************************************************/
.lichtbruin{
background-color: #464444;
}