/* 
Themanaam: Persoonlijkbiertje2022
Versie: 1 
Autheur: Daan Brandwacht Eshuis Dalfsen
Website: www.persoonlijkbiertje.nl
Datum: 11-4-2022
*/

*{
    font-display: block !;
}

p{
    font-family: 'SourceSansPro' !important;
    
}

p span{

    font-family: 'SourceSansPro' !important;
    font-size: medium !important;
}

h1 span{
    font-family: 'nevis' !important;
}

h2 span{
    font-family: 'nevis' !important;
}

li span{
    font-family: 'SourceSansPro' !important;
}


a{
    color: #ffca3a;
}

h2{
    font-family: 'nevis' !important;
}

.subtitle.is-6{
    font-family: 'SourceSansPro' !important;
}

.summaryShortDescription{
    font-family: 'SourceSansPro' !important;
}

.catfish-button{
    color: #000;
    border: 0;
}

.hbspt-form{
    font-family: 'nevis' !important;
}

.catfish-default-product-box .product-item--image .picture img {
    min-height: 43px;
    width: auto;
    margin: auto;
}

.button{
    border: 0 !important;
    color: #010024;
}

.shoppingcart__wrapper h1{
    margin: 0 !important;
}

.product-sorting{
    display: none !important;
}

/* topbar */

h2{
    font-family: 'nevis' !important;
}

h1{
    font-family: 'nevis';
}

.button{
    font-family: 'nevis';
}

.catfish-button{
font-family: 'nevis';
}

.top-bar-nav{

    width: 100%;
    height: 50px;
    background-color: #010024;
    position: fixed;
    top: 0;

}


.top-bar-nav span{
    font-weight: bold;
    font-family: 'nevis';
}

.top-bar-nav ul:first-child{
    font-weight: 300;
}

#menuitem_1653478250228::after{
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    margin-left: 5px;
    color: #3B3B3B;
}

#menuitem_1653478251187::after{
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    margin-left: 5px;
    color: #3B3B3B;
}

#menuitem_1653478251834::after{
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    margin-left: 5px;
    color: #3B3B3B;
}

#menuitem_1653478253475::after{
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    margin-left: 5px;
    color: #3B3B3B;
}

#menuitem_1669216829437::after{
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    margin-left: 5px;
    color: #3B3B3B;
}



.header_socials{
    font-family: 'nevis' !important;

}
.top-bar-nav ul li{
    float: left;
    line-height: 50px;
    padding-right: 65px;
    padding-left: 30px;
    color: #fff;
}

.top-bar-nav ul li a{
    color: #fff !important;
}



.navbar.is-fixed-top {
    top: 43px !important;
}



/* topbar_end */


/* nav */

.navbar-item img{

    max-height: 3.3em !important;
}

ul.header_socials{
    position: relative;
    float: right;
    
}

 ul.header_socials li {

    float: left;
    padding-right: 25px !important;
    padding-left: 15px;
}

/* nav_end */


/* Header_1 linkercolom */

.header_1{
    height: 30vw;
    color: #fff;
    background-position: revert;
    background-size: auto;
    background-attachment: fixed;
    background-repeat: no-repeat;
    min-height: 70vh;
}

.header_1::before {
    width: 40px;
    height: 40px;
    border-radius: 100px;
    background-color: #fff;
    font-family: "Font Awesome 5 Free";
    content: "\f107";
    font-weight: 900;
    font-size: 17px;
    color: #010024;
    display: block;
    text-align: center;
    line-height: 35px;
    top: 102%;
    transform: translateY(-44%);
    position: relative;
    margin: auto;
    box-shadow: -2px -5px 19px 5px rgb(0 0 0 / 42%);
}

.page-home-index h1 {
    margin: 8rem 7rem 0.6rem 5rem !important;
    font-size: 4rem !important;
}

.header_1 p {
    margin: -1rem 0px 0px 5rem;
    width: 593px;
    font-size: 1.2rem !important;
    font-weight: 300;

}

/* Header_1 linkercolom_end */

/* Header_2 rechtercolom */

.header_2{
    width: 2vw !important;
    margin: auto;
    padding-bottom: 50px;
    min-width: 250px;
    height: auto !important;
    margin-top: 50px;
    transition-duration: 1s;

}

.header_2:hover{
    transform: scale(1.05);
}

.header_buttons{

    text-align: center;

}
.header_buttons li{
    list-style: none;
    padding-bottom: 20px;
    
}
.header_buttons li a{
    border: 0;
    color: #000;

}
.header_buttons li:last-child{
   

        font-family: 'SourceSansPro';
        font-weight: 400;

}

/* Header_2 rechtercolom_end */

/* Header_3 usp*/

.usp_container{

    text-align: center;
}

 .usp_block{
    width: 250px;
    height: 250px;
    background-color: #FCCC00;
    margin: auto;
    border-radius: 6px;

}

.usp_block img{

    top: 50%;
    transform: translateY(50%);
}

.usp_container h2{

    margin-top: 1vw;
    color: #010024;
    font-weight: 200;
    min-height: 60px;
}

.usp_container p{

    margin-top: 0.5vw;
    color: #3B3B3B;
    min-height: 50px;

}

/* Header_3 usp_end */

/* Header_4 */



.image_header_4{

    width: 500px;
    height: 500px;
    background-image: url("/1955667277/Handler/Picture/GU/F/ThemeImages//Fles-bier-met-eigen-etiket.webp");
    background-size: cover;
    background-position: center;
    border-radius: 30px;
    background-repeat: no-repeat;
}


.header_4::before{
    content: "Bieren";
    color:#EBEBEB;
    font-family: 'nevis' !important;
    z-index: -5;
    font-size: 20vw;
    position: absolute;
    margin: -150px -0 0 -20%;
    
    
}

.header_4 h2{
    z-index: 999;
}

.header_4 p{

    font-weight: 200;
    width: 22vw;
    z-index: 999;
}


.header_4 p span{
    font-weight: 900;
}

.header_4 .button{
   left: 40%;
   bottom: 15px;
}

/* Header_4_end */

/* Header_5 */



.header_5::after{
    color:#EBEBEB;
    z-index: -5;
    font-size: 20vw;
    position: absolute;
    margin: -150px -0 0 -20%;
    
    
}

.header_5 h2{
    z-index: 999;
}

.header_5 p{

    font-weight: 200;
    width: 22vw;
    z-index: 999;
}


.header_5 p span{
    font-weight: 900;
}



/* Header_5_end */


/* header_6 */

.header_6{
    width: 100%;
    height: 300px;
    background-color: #010024;
    border-radius: 5px;
    color: #fff;
    margin-bottom: 50px;
}

.header_6 h2{
    margin: 40px 0 0 20px;
    font-size: 2.488em;
}

.header_6 p{
    margin: 0px 0 0 20px;
    font-weight: 200;

}

.header_6 a{
    margin: 40px 0 0 20px;
}

/* header_6_end */

.faq-container{

    margin: auto;
    margin-top: -130px
}

.button_faq{
    left: 87% !important;
    bottom: 72px;
}


.wrapper {
    width: 30%;
    float: left;
  }
  .header_5 .container {
    color: black;
    border-radius: 20px;
    margin: 20px 0;
    min-width: 364px;
  }


  .hidden:hover{
    width: 100vw;
    height: 100vh;
  }
  
  .question {
    font-size: 1.2rem;
    font-weight: 600;
    padding: 20px 80px 20px 20px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  
  .question::after {
    content: "\002B";
    font-size: 2.2rem;
    position: absolute;
    right: 20px;
    transition: 0.2s;
  }
  
  .question.active::after {
    transform: rotate(45deg);
  }
  
  .answercont {
    max-height: 0;
    overflow: hidden;
    transition: 0.3s;
  }
  
  .answer {
    padding: 0 20px 20px;
    line-height: 1.5rem;
    font-family: 'SourceSansPro';

  }
  
  
  

/* header_5_end */


/* Slick slider */

.slider-item{
    width: 300px !important;
    height: 460px !important;
    background-color: #FEFEFE;
    float: left;
    border-radius: 20px;
    text-align: center;
}

.slider-item:hover {
    box-shadow: 4px 4px 13px -4px rgba(0,0,0,0.24);
  }


.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
    height: 553px;
}

.slider-item h2{
    width: 240px;
    margin: 30px auto 0 auto;
    color: #010024;
    font-family: nevis;

}

.slider-item h3{
    margin-top: 10px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-weight: 200;
    color: #00263a !important;


}

    .slider-item img {
        height: 320px;
        margin: 10px auto 0 auto;
        display: flex !important;
        justify-content: space-between;
    }


/* Slicker slider_end */

/* catagory_header */

.catagory_header{
    width: 100%;
    height: 16vw;
    background-image: url('/-119675381/Handler/CSSOverride/GetImage/11/header_image_persoonlijkbiertje.nl_1.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: white;
}

.catagory_header h2 {
    position: absolute;
    font-size: 4vw;
    line-height: 17vw;
    margin-left: 3vw;
  }

.catagory_header p {
    margin: 14vw 0vw 0vw 8vw;
    position: absolute;
    width: 33vw;
}


.navigationmenu ul li{
    font-family: 'nevis';
}

.navigationmenu .expandedListItem{
    font-family: 'SourceSansPro';
}

.navigationmenu ul li.active>a {
    background-color: #010024;
    color: #fff;
    font-family: 'nevis';
}




/* catagory_header_end */

/* footer */


.catfish-footer{
    color: #fff;
    background-color: #010024;
    font-family: 'SourceSansPro';
    font-weight: 200;
}

.catfish-footer::before{
    width: 100vw;
    height: 40px;
    content: "";
    background-color: #EBEBEB;
}

.catfish-footer ul a{
    color: #fff;
}

.catfish-footer ul a:hover{
    color: #EBEBEB;
}

.footercopyright{
    text-align: center;
}

.buttons{
    border-radius: 20px;
}

.footer_text{

    margin: auto;
    width: 400px;
    text-align: center;
    font-style: italic;
    padding-top: 40px;
    padding-bottom: 50px;
}

.footer_text span{
    font-family: 'Nevis';
}

/* footer_end */


/* Responsive 600px */

@media only screen and (max-width: 1024px) {
    .header_4 p{
        width: 70vw;
    }
    .header_4 .button{
        left: 65vw;
     }

    .button_faq{
        left: 65vw !important; 
     }
     .image_header_4 {
        margin: auto;
    }

    .top-bar-nav ul{
        font-size: 1.4vw;
    }
    .top-bar-nav ul li {
        padding-right: 7px;
    }

    .top-bar-nav img{
        width: 15px !important;
    }
    .navbar-brand {
        top: 7px;
    }

    h1{
        font-size: 2rem !important;
    }

    h1 p{
        margin: 0.2rem 0px 0px 5rem;
    }

    ul.header_socials{
        display: none;
    }
  }

/* Responsive 600px_end */


/* Responsive 480px */

@media only screen and (max-width: 480px) {
    
    body{
        width: 100vw;
        overflow-x: hidden;
    }
    
    .header_1 {
        height: 60vh;
    }

    .header_1 h1 {
        margin: 3rem 7rem 0.6rem 2rem !important;
        font-size: 2.5rem !important;
        width: 385px;
  
    }

    .header_1 p {
        margin: 1.3rem 0px 0px 2rem;
        width: 85vw;
        font-size: 1.2rem !important;
        font-weight: 300;
      }

      .header_6 {
        height: 405px;
      }

      .header_6 a {
        margin: -20px 0px 0 20px;}

      .footer_text {
        width: 305px;
      }

      .image_header_4{
          width: 315px;
      }

      .header_5 p{
        width: 80vw;
      }

      .image_header_4{
        background-size: 82vw;
    }
    
}



@media screen and (max-width: 767px){
    .advanced-nav-parentcontainer {
      display: block;
    }
    .advnav_menu_button .advnav_menu_button {
        min-width: 100%;
        display: none;
      }
    
      .advnav_item_title::after {
        content: none;
      }
.navbar-end{
    display: block !important;

}

.searchbox_wrapper {
    margin-top: 150px !important;
    margin-left: 17px;
    width: 284px !important;
  }



.header_1 {
    height: 30vw;
    color: #fff;
    background-position: left;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }

    }

/* Resposive 480px_end */

/* Cookie 18+ */

#agechecker-age-gate #ac-ag-header{
    display: none !important;
}

#agechecker-age-gate .ac-ag-button{
    background: #010024 !important;
}



#ac-ag-logo{
    display: none;
}

#ac-ag-title-text {
	visibility: hidden;
	position: relative;
}
#ac-ag-title-text::after {
	visibility: visible;
	position: absolute;
	top: 0;
	left: 0;
	content: "Leeftijdscontrole";
    text-align: center;
    margin: auto;
    width: 100%;
    font-family: Nevis !important;
}

#ac-ag-body-text {
	visibility: hidden;
	position: relative;
}
#ac-ag-body-text::after {
	visibility: visible;
	position: absolute;
	top: 0;
	left: 0;
	content: "Welkom bij persoonlijkbiertje.nl omdat wij bier verkopen moet je 18+ zijn";
    text-align: center;
}


#ac-ag-accept-button-text {
	visibility: hidden;
	position: relative;
}
#ac-ag-accept-button-text::after {
	visibility: visible;
	position: absolute;
	top: 0;
	left: 0;
	content: "Ik ben 18+";
    text-align: center;
}

.shared__cookie-banner .cookiebanner__message{
    font-family: 'SourceSansPro';
}

.cookiebanner__accept{
    border-radius: 3px;
    border: 0;
    color: #000;

}
/* Cookie 18+_end */


/* Breadcrums */

.breadcrumb li{

    font-family: 'SourceSansPro';
}

.breadcrumb li:first-child{

    font-family: 'Nevis';
    content: "Home" !important;
}

.category-description-wrapper .content{
    font-family: 'SourceSansPro';
}
/* Breadcrums_end */


/* Dropdownmenu */

.navbar-start ul{
    display: none;
    position: absolute;
    z-index: 9999999;
}

/* Display Dropdowns on Hover */
.dropdown_voorwie:checked + .navbar-start {
	display: block !important;

}
.navbar-item:hover > ul{ 
     color: aqua  !important;
     display: block;
}

/* Dropdownmenu_end */


/* Searchbox */

.searchbox_wrapper{
    margin-top: 9px;
    margin-left: 17px;

}


.search-box{
    width: 45% !important;
}
.search-box .searchbox{
    border: 0px;
    border-bottom: 2px solid #3B3B3B;
    box-shadow: none;
}


.searchbox_wrapper input{
    font-family: 'nevis';

}

.awesomplete input{
    font-family: 'SourceSansPro';
}

/* Searchbox_end */


/* Productpagina */

.product-wrapper h1{

    margin: 0 !important;
}

.product-wrapper .breadcrumb-section{

    margin-top: 55px;
}

/* Productpagina_end */


/* Catagory_afters */


.bieren .category-description-wrapper::after {

    content: "Ons aanbod bieren";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}

.momenten .category-description-wrapper::after {

    content: "Momenten";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}

.voor_wie .category-description-wrapper::after {

    content: "Voor wie?";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}

.voor_hem .category-description-wrapper::after {

    content: "Voor hem";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}

.voor_haar .category-description-wrapper::after {

    content: "Voor haar";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}

.voor_haar .category-description-wrapper::after {

    content: "Voor haar";
    color: #EBEBEB;
    z-index: -5;
    font-size: 6vw;
    position: absolute;
    margin: -190px -0 0 -10%;
    font-family: 'nevis';

}




/* Catagory_afters_end */

/* bier_pagina */

.bieren .productlistproductdetailbutton{
    display: none;
}

.bieren .addtocart{
    display: none;
}

.bieren .product-item{
    text-align: center;
    padding: 30px;
    border-radius: 20px;
}

.bieren .description{
    font-weight: 200;
}


.bieren .fake_img img{
    width: auto !important;
    height: 200px;
}



/* bier_pagina_end */


/* Brouwerij pagina */

.Onze_brouwerijen h1{
    
    margin: 0 !important;
}

/* Brouwerij pagina_end */

/* Checkboxen */

.eigen_ontwerp .type_Checkboxes{

    display: none !important;
}

.catfish-select option{
    font-family: 'SourceSansPro' !important;
}

.prices{
    font-family: 'SourceSansPro' !important;
}

.quantity-row{
    font-family: 'SourceSansPro' !important;
}

.attributeTitle{
    margin-top: 20px;
}

.cf_accountlinks_OrderLine{

    display: none;
}

/* Checkboxen_end */


/* Editor */

.loadScreenStepIndicator{
    color: #fff !important;
}

.ME_loading_hints li{
    color: #fff !important;
}

.editorBottom.is-attached-to-editor .priceContainer {
    display: none;
}

.editorTop.pane .headerWrapper .currentCanvasSizeWrapper {
    display: none;
}


/* Editor_end */

 .sub-category-wrapper{
    display: none !important;
}

.bigpicture{
    width: 13rem !important;
    /* max-height: 409px; */
    margin: auto !important;
    padding: 10px !important;
} 


.page-catalog-category .column.is-3-widescreen .product-title {

    font-weight: 200 !important;
    height: 65px;
}

.product-title a{
    color: #002E47 !important;
}

.bieren .product-item:hover {
    box-shadow: 4px 4px 13px -4px rgba(0,0,0,0.24);
  }

  .section{
    padding-bottom: 1rem !important;
  }

  .navigationmenu {
   padding-top: 2rem;
  }

    .breadcrumb-section {
    padding-top: 2rem !important;
}

.navigationmenu h6:not(:last-child) {
    margin-bottom: 2em !important;
  }

  .banner{
    padding-bottom: 2vw;
  }

.is-hidden{
    display: none !important;
  }

  #ftn1{
    display: none;
  }


  @media screen and (min-width: 1280px){
.column.is-3-widescreen {
    flex: none;
}
  }


.inactive .inactive{
    display: none !important;
}

/* Custom header img */

.voor_wie .catagory_header{
    background-image: url(/-1665731968/Handler/Picture/GU/F/ThemeImages//header-eigen-label-bier-1920-x-800.webp) !important;
}


/* Custom header img_end */