@import url('https://fonts.googleapis.com/css2?family=Caveat&family=Oswald:wght@300;500;700&display=swap');

@font-face {
    font-family: 'BorisBlackBloxx';
    src:  url('../Images/BorisBlackBloxx.ttf.woff') format('woff'),
    url('../Images/BorisBlackBloxx.ttf.svg#BorisBlackBloxx') format('svg'),
    url('../Images/BorisBlackBloxx.ttf.eot'),
    url('../Images/BorisBlackBloxx.eot?#iefix') format('embedded-opentype'); 
}
body {
    left: 0;
    overflow: visible;
    position: relative;
    -webkit-transition: left 0.5s ease-out;
    -moz-transition: left 0.5s ease-out;
    -o-transition: left 0.5s ease-out;
    transition: left 0.5s ease-out;
}
a, button {
    outline: 0;
}
/* Swiper slider */
.swiper-pagination-bullet-active{
    background: #fff !important;
}
.swiper-horizontal{
    margin-bottom: -5px !important;
}
.websiteheader, .header-line img, .menucontainer {
    width: 100%;
    padding: 0px;
    margin: 0px;
    display: block;
}

.header-logo img {
    padding: 0px;
    margin: 0px;
    display: block;
}

.headerlive {
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    right: 0;
    background: rgba(255,255,255,0.6);
    
    -webkit-transition: height 0.5s ease-out, background 0.5s ease-out;
    -moz-transition: height 0.5s ease-out, background 0.5s ease-out;
    -o-transition: height 0.5s ease-out, background 0.5s ease-out;
    transition: height 0.5s ease-out, background 0.5s ease-out;
}

.header-line {
    display: none;
}
.menucontainer {
    width:95%;
    max-width: 1200px;
    margin: 0px auto;
}

.menucontainer:after {
    clear:both;
    content: '';
    display: block;
}

.header-logo img{
    height: 140px;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.header-logo {
    width: 30%;
    float: left;
}

.header-menu {
    float: right;
    width: 60%;
}

.menu {
    padding: 0px;
    margin: 0px;
    font-size: 0px;
    text-align: right;
}

.menu li {
    display: inline-block;
}

.menu li a {
    display: block;
    text-decoration: none;
    font-family: 'BorisBlackBloxx';
    color: #951b81;
    font-size: 20px;
    margin-left: 20px;
    line-height: 145px;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.menu li a:hover {
    color: #f7941d;
}

.contentcontainer {
    width: 95%;
    max-width: 1200px;
    margin: 0px auto;
}

.smallcontentcontainer  {
    max-width: 650px;
}

.paddingbox {
    box-sizing: border-box;
    padding: 4% 0;
}
.contactformpaddingbox {
     box-sizing: border-box;
    padding: 2% 0;
}
.paddingboxfooter {
    box-sizing: border-box;
    padding: 2% 0; 
}
.textpaddingbox {
    box-sizing: border-box;
    padding: 15px;
}
.backgroundorange {
    background: #f7941d;
}
.backgroundpurple {
    background: #6d2c90;
}

/* Standaard teksten style */

.kop {
    font-family: 'BorisBlackBloxx';
    font-size: 30px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}
.kopwit {
    font-family: 'BorisBlackBloxx';
    font-size: 30px;
    color: #fff;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}
.tekst, .recept-product-description, .recept-description, .recept-text, .recept-product-recipe-time, .recept-product-text {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
}

.recept-product-text {
    margin: 0px;
    font-style: italic;
    font-size: 16px;
    padding-bottom: 0.3em;
}
.tekstwit {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #fff;
    margin: 0;
}

.link, .qs_cookie_linkbtn {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    text-decoration: none;
    color: inherit;
}
.link:hover, .qs_cookie_linkbtn:hover {
    text-decoration: underline;
}
.qs_cookie_linkbtn {
    font-family: 'Oswald', sans-serif !important;
    color: #fff !important;
}


.recept-productdescription {
    font-size: 18px;
    text-align: center;
}

.subkop, .recept-product-subkop {
    font-family: 'BorisBlackBloxx';
    font-size: 30px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}


/* Recepten module Css */

.recept-product-head, .recept-tile-head, .recept-head {
    font-family: 'BorisBlackBloxx';
    font-size: 35px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0;
}
.recept-tile-head {
    text-align: center;
}

.recept-button {
    font-family: 'Oswald', sans-serif;
}
.receptmainwrap {
    box-sizing: border-box !important;
    padding: 3% 0;
    margin-top: 125px !important;
}

.qs_cookie_page_wrap {
    margin-top: 125px !important;
}

.recept-product-table, .recept-product-table-cell {
    border: none !important;
}

.recept-product-table-cell {
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
    padding: 3px !important;
}

.readmore-button {
    border: none !important;
    background: none !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 16px !important;
}

.productitem {
    border: none !important;
    float: none !important;
}
.recipeitem {
    float: left !important;
}

.productflexbox {
    display: flex;
    justify-content: space-evenly;
}

.productitem:hover, .recept-category-tile:hover {
    box-shadow: none !important;
}

.productitemimage {
    overflow: visible !important;   
}

.recept-product-top-wrap {
    box-sizing: border-box;
    padding: 5% 0 0;
}
.recept-product-middle-wrap {
    box-sizing: border-box;
    padding: 2.5% 0;
}

.recept-text {
    margin: 10px 0 !important;
    min-height: 110px;
}

/* BX slider */

.sliderwrapper {
    visibility: hidden;
}

.bxslider, .bxslidersingle {
    padding: 0px;
    margin: 0;
}

.bx-wrapper {
    margin: 0px !important;
    width: 100% !important;
    margin: auto !important;
    border: none !important;
    box-shadow: none !important;
}

.bx-wrapper img {
    min-width: 100%;
}

.bx-wrapper .bx-viewport {
    border: none !important;
    left: 0 !important;
    box-shadow: none !important;
}

/* buttons */
.websitebutton, .qs_cookiepage_acceptbtn, .qs_cookie_refusebtn {
    cursor: pointer;
    border: none;
    box-sizing: border-box;
    padding: 10px 15px;
    font-family: 'BorisBlackBloxx';
    font-size: 20px;
    background: #f7941d !important;
    color: #fff !important;
    margin: 40px auto 0;
    display: block;
    opacity: 1;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.qs_cookie_refusebtn{
    display: inline-block;
    margin: 0px 0px 0px 10px;
}

.websitebutton:hover, .qs_cookiepage_acceptbtn:hover {
    background: #6d2c90 !important;
    opacity: 0.8 !important;
}

.backtolist-button {
    border: none !important;
    border-radius: 20px;
    font-family: 'BorisBlackBloxx' !important;
    color: #951b81 !important;
}

.menufixed {
    background: #fff;
}

.menufixed .menu li a {
    line-height: 75px;
}

.menufixed .header-logo img {
    height: 75px;
}

/* Footer */
.footerbackground {
    background: #6d2c90;
}
.footerrowwhite {
    background: #fff;
}
.footerkop {
    font-family: 'BorisBlackBloxx';
    font-size: 24px;
    color: #fff;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}

.footertekst {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #fff;
    margin: 0px;
}

.footerlink {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    color: #fff;
    text-decoration: none;
}

.footerlink:hover {
    text-decoration: underline;
}

.footerlegal {
    font-family: 'Oswald', sans-serif !important;
    font-size: 16px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
    margin: 5px 0px;
}

.footerlegallink {
    color: inherit;
    text-decoration: none;
}

/* artikel relaties */
.productitemimageplaceholder {
    min-height: 250px;
}
.productitemimagewrap {
    margin-bottom: 0px !important;
}
.recept-related-product {
    border: none !important;
}
.item-type-product {
    width: 31%;
    display: table;
}
.item-type-product .productitemimagewrap, .item-type-product .recept-related-product-information  {
    display: table-cell;
    width: 50%;
    vertical-align: middle;
}

.item-type-recipe {
    width: 24%;
}

.item-type-recipe .recept-product-tile-image {
    max-height: 100% !important;
}
.item-type-recipe .recept-product-tile-image {
    border-radius: 5px;    
}

.recept-related-product-image, .recept-related-product-information, .recept-related-product-price-amount, .recept-related-product-button {
    padding: 0px !important;
}

.recept-relation-head {
    font-family: 'Oswald', sans-serif !important;
    font-size: 24px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}

.recept-relation-link {
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
    text-decoration: none;
}
.recept-relation-link:hover {
    text-decoration: underline;
}

.overpaginaafbeelding {
    width: 80% !important;
    border-radius: 5px;
    display: block !important;
    margin: 0px auto !important;
}

/*  contactformulier  */
.qscontactform-label, .qscontactform-div .form-control {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
    box-sizing: border-box;
}

.qscontactform-btn {
    cursor: pointer;
    border: none;
    box-sizing: border-box;
    padding: 10px 15px;
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    background: #f7941d;
    color: #fff;
    margin: 20px auto 0;
    display: block;
}
.qscontactform-btn:hover {
    opacity: 0.8;
    background: #f7941d !important;
}

[id^="error-message"] {
    font-family: 'Oswald', sans-serif !important;
}

/* Mobiel menu */

.mobilemenu {
    display: none;
    z-index: 1000000;
}

.mobilemenucontainer {
    position: fixed;
    top: 0px;
    bottom:0px;
    background: #951b81;
    z-index: 100000;
    left: -260px;
    width: 260px;
    -webkit-transition: left 0.5s ease-out;
    -moz-transition: left 0.5s ease-out;
    -o-transition: left 0.5s ease-out;
    transition: left 0.5s ease-out;
}

.mobilemenubar {
    height: 100px;
    position: relative;
}

.mobilelogo {
    height: 100px;
}
.mobilelogo img {
    display: block;
    height: 100%;
    margin: 0px auto;
}

.menuicon {
    position: absolute;
    top:0;
    left:0;
    bottom: 0;
    line-height: 100px;
    width: 50px;
    text-align:center;
    color: #f7941d;
    font-size: 30px;
    cursor: pointer;
}

.barsicon, .timesicon {
    position: absolute;
    -webkit-transition: opacity 0.5s ease-out;
    -moz-transition: opacity 0.5s ease-out;
    -o-transition: opacity 0.5s ease-out;
    transition: opacity 0.5s ease-out;
}

.barsicon {
    opacity: 1;
}
.timesicon {
    opacity: 0;
}

.menuopen .barsicon {
    opacity: 0;
}
.menuopen .timesicon {
    opacity: 1;
}

.showmobilemenu {
    left: 0px;
}

.menumobile {
    padding: 100px 0 0 0;
    margin: 0;
}

.menumobile li {
    display: block;
}

.menumobile li a {
    display: block;
    text-decoration: none;
    font-family: 'BorisBlackBloxx';
    color: #fff;
    font-size: 20px;
    box-sizing: border-box;
    padding: 5px 20px;
    line-height: 200%;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.disablebodyscroll {
    position: absolute;
    left: 260px;
    overflow: hidden;
}

.disablebodyscroll .menufixed {
    left: 260px !important;
    right: -260px !important;
}


/* recepten pagina */

.recept-filter-wrap, .recept-filter-wrap label {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
}

.recept-product-tile-image {
    max-height: 100% !important;
    border-radius: 5px;
}

.recept-category-tile {
    text-align: left !important;
}

.pagebanner {
    width: 100%;
    position: relative;
}

.bannercontent {
    position: absolute;
    top: 0;
    right:0;
    bottom: 0;
    left:0;
    height: 100%;
}

.bannercontent .contentcontainer{
    height: 100%;
}

.homepaginabanner:after, .pagebanner:after {
    clear: both;
    content: '';
    display: block;
}

.leftpart, .rightpart {
    width: 50%;
}
.leftpart{
    float: left;

}
.rightpart {
    float: right;
}

.bannertable {
    height: 100%;
    table-layout: fixed;
    width: 100%;
}

.bannertable tr td {
    position: relative;
}

.homeCelltext {
    background: #1a365c;
    position: absolute;
    bottom: -2px;
    left: -1px;
    box-sizing: border-box;
    padding: 20px;
    width: 100%;
    max-width: 300px;
}
.tableCellPadding{
    padding: 30px 90px;
}

.homebannerimageitem {
    width: 100%;
    display: block;
}

#homerecipepart, #homeproductpart, #overrositaspart {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 550px;
}

#homerecipepart {
    background-image: url("../Images/home-pagina-recepten-afbeelding.jpg");
}

#homeproductpart {
    background-image: url("../Images/home-pagina-producten-afbeelding.jpg");
}
#overrositaspart {
    background-image: url("../Images/Pagina-afbeelding-over-rositas.jpg");
}

.centertekst {
    text-align: center;
}

.winkelswrap {
    margin: 20px 0;
    display: flex;
    justify-content: space-evenly;
}

.winkelswrap img {
    max-width: 75px;
    width: 100%;
}

.winkelskop {
    background:#f7941d;
    text-align: center;
    box-sizing: border-box;
    padding: 2%;
    
    font-family: 'BorisBlackBloxx';
    font-size: 30px;
    color: #fff;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}

.recept-product-table-cell-right {
    text-align: right;
}

.recept-product-table-row {
    border-bottom: 1px dotted;
}


/* Cookie pagina */

.qs_cookiepage_head {
    font-family: 'BorisBlackBloxx' !important;
    font-size: 30px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}

.qs_cookie_table_head {
    font-family: 'BorisBlackBloxx' !important;
    font-size: 22px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
}
.qs_cookiepage_subhead {
    font-family: 'BorisBlackBloxx' !important;
    font-size: 25px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    
}
.qs_cookie_table_text, .qs_cookiepage_text {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
}

.qs_cookie_table {
    table-layout: fixed;
}

.qs_cookie_table td {
    vertical-align: top;
}

.qs_cookie_popup {
    background: #6d2c90 !important;
  
}
.qs_cookie_title {
    font-family: 'BorisBlackBloxx' !important;
    font-size: 22px !important;
    color: #fff !important;
    line-height: 170% !important;
    font-weight: 500 !important;
    margin: 0px !important;
}

.qs_cookie_text, .qs_cookie_link {
    font-family: 'Oswald', sans-serif !important;
    font-size: 17px !important;
    font-weight: 300 !important;
    line-height: 180% !important;
    color: #fff !important;
    margin: 0 !important;
}

.qs_cookie_acceptbtn, .qs_cookie_refusebtn, .qs_cookie_acceptbtnsmall {
    background: #f7941d !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 17px !important;
    font-weight: 300 !important;
}

.qs_cookie_acceptbtn:hover, .qs_cookie_refusebtn:hover, .qs_cookie_acceptbtnsmall:hover { 
    color: #fff !important;
}


/* Fallback css voor recepten / producten als er niet wordt gewerkt met classes in de editor: */

.recept-product-extra-left p, .recept-product-extra-left span, .recept-product-extra-left td, .recept-product-extra-left a, .recept-product-extra-right p, .recept-product-extra-right span, .recept-product-extra-right a {
    font-family: 'Oswald', sans-serif !important;
    font-size: 20px;
    font-weight: 300;
    line-height: 180%;
    color: #522b1c;
}

.recept-product-extra-left a, .recept-product-extra-right a {
    text-decoration: none;
}
.recept-product-extra-left a:hover, .recept-product-extra-right a:hover {
    text-decoration: underline;
}

.recept-product-extra-left h1, .recept-product-extra-left h2, .recept-product-extra-left h3, .recept-product-extra-left h4, .recept-product-extra-left h5, .recept-product-extra-right h1, .recept-product-extra-right h2, .recept-product-extra-right h3, .recept-product-extra-right h4, .recept-product-extra-right h5 {
    font-family: 'BorisBlackBloxx';
    font-size: 30px;
    color: #951b81;
    line-height: 170%;
    font-weight: 500;
    margin: 0px;
} 


@media only screen and (max-width: 1200px) { 
    .tableCellPadding {
        padding: 30px 20px;
    }
}

@media only screen and (max-width: 1100px) { 
    .menu li a {
        font-size: 18px;
        margin-left: 18px;
    }
}


@media only screen and (max-width: 991px) { 
    .mobilemenu {
        display: block;
    }
    
    .desktopmenu {
        display: none;
    }
    
    .menufixed {
        position:fixed;
        left:0;
        right:0;
        top:0;
        -webkit-transition: left 0.5s ease-out, right 0.5s ease-out;
        -moz-transition: left 0.5s ease-out, right 0.5s ease-out;
        -o-transition: left 0.5s ease-out, right 0.5s ease-out;
        transition: left 0.5s ease-out, right 0.5s ease-out;
    }
    
    .cleartop {
        margin-top: 100px;
    }
    
    .receptmainwrap {
        margin-top: 0px !important;
    }
    
    /* Recepten module */
    .productitem-col-4, .item-type-recipe, .item-type-product {
        width: 31% !important;
    }
}

@media only screen and (max-width: 767px) { 
    .leftpart, .rightpart {
        float: none;
        width: 100%;
    }
    .bannercontent {
        position: static;
    }
    .bannertable {
        table-layout: auto;
        padding: 20px;
    }
    #homerecipepart, #homeproductpart {
        min-height: 360px;
    }
    .tableCellPadding {
        padding: 0px;
    }
    .productitem-col-4, .item-type-recipe, .item-type-product {
        width: 48% !important;
    }
    
    .productflexbox {
        display: block;
    }
    .productitem {
        float: left !important;
    }
}

@media only screen and (max-width: 580px) { 
    .winkelswrap {
       display: block;
    }
    .winkelswrap:after{
        clear: both;
        content: '';
        display: block;
    }
    
    .winkelswrap img {
        max-width: 75px;
        width: 24%;
        margin: 1%;
        float: left;
    }
    
    .item-type-product {
        width: 100% !important;
        float: none;
    }
}

@media only screen and (max-width: 580px) { 
    .mobilelogo {
        padding-top: 10px;
    }
    
    .mobilelogo img {
        height: 80%;
    }
    
}