.example {
    display: flex;
    transition: all .5s;
    user-select: none;
    background: linear-gradient(to bottom, white, black);
}

.loader {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-top: -1.25em;
  margin-left: -1.25em;
    border: 0.15em solid #1A1919; /* Light grey */
    border-top: 0.15em solid #CDBC9B; /* Blue */
    border-radius: 50%;
    width: 2.5em;
    height: 2.5em;
    -webkit-animation: spin 0.4s linear infinite;
            animation: spin 0.4s linear infinite;

}

* {
  -webkit-tap-highlight-color: transparent; /* of rgba(0,0,0,0) */
}

/* 4) Zorg dat :active geen ongewenste achtergrond geeft */
a, button {
  -webkit-tap-highlight-color: transparent;
}
a:active, button:active {
  background-color: inherit; /* of je eigen kleur */
}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

@keyframes spin {
    0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}


@font-face {
  font-family: 'B';
  src:  url('../fonts/B/B.eot');
  src:  url('../fonts/B/B.eot#iefix') format('embedded-opentype'),
    url('../fonts/B/B.ttf') format('truetype'),
    url('../fonts/B/B.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'harrys';
  src:  url('../fonts/H/harrys.eot');
  src:  url('../fonts/H/harrys.eot#iefix') format('embedded-opentype'),
    url('../fonts/H/harrys.ttf') format('truetype'),
    url('../fonts/H/harrys.woff') format('woff'),
    url('../fonts/H/harrys.svg#harrys') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'MB';
    src: url('../fonts/MB/MB.woff2') format('woff2'),
         url('../fonts/MB/MB.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MBB';
    src: url('../fonts/MB/MB_bold.woff2') format('woff2'),
         url('../fonts/MB/MB_bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MAJ';
    src: url('../fonts/MAJ.eot');
    src: url('../fonts/MAJ/MAJ.eot?#iefix') format('embedded-opentype'),
         url('../fonts/MAJ/MAJ.woff2') format('woff2'),
         url('../fonts/MAJ/MAJ.woff') format('woff'),
         url('../fonts/MAJ/MAJ.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;


}


@font-face {
    font-family: 'mars-extendedregular';
    src: 
        url('../fonts/marsextendedweb-regular.woff2') format('woff2'),
        url('../fonts/marsextendedweb-regular.woff') format('woff');
}




i {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'harrys' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.harry-leaf:before {
  content: "\e90b";
}

.harry-arrows:before {
  content: "\e90a";
}

.harry-beeldmerk_harry:before {
  content: "\e900";
}
.harry-facebook:before {
  content: "\e901";
}
.harry-iens:before {
  content: "\e902";
}
.harry-intagram:before {
  content: "\e903";
}
.harry-kruisje:before {
  content: "\e904";
}
.harry-tripadvisor:before {
  content: "\e905";
}
.harry-twinpeaks:before {
  content: "\e906";
}
.harry-zeshoek:before {
  content: "\e907";
}
.harry-logo_harry:before {
  content: "\e908";
}
.harry-since:before {
  content: "\e909";
}


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike,  sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0px;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-family: inherit;
  vertical-align: baseline;
  list-style:none;

}

body {
 
  font-family: "mars-extendedregular", Arial, Helvetica;
  font-size:14px;
  line-height:1.6em;
  color:#1A1919;
  letter-spacing: 0;
  font-weight: 400;
  background-color: #1A1112;
  overflow-y: scroll; /* has to be scroll, not auto */
  overflow-x: hidden; 
  
  -webkit-overflow-scrolling: touch;
  
}



input, textarea{font-family: "HelveticaNeueLTPro-Lt", Arial, Helvetica; font-size: 1em;}
input[type=text]:focus, textarea:focus {
  box-shadow:none;
  outline: none;
}

a{text-decoration: none; color: #1A1112;}
p a{color: #1A1112; text-decoration: none; text-decoration:underline; }
.invertedcolor p a{color: #fff; }
footer a {color: inherit; text-decoration: none;}
i, cite, em, var, dfn {
    font-style:normal;
}
b, strong {font-weight: 600; font-family: "mars-extendedregular", Arial, Helvetica;}

p{position:relative; width: 100%; display: block; float: left; margin-bottom: 1em; font-family: "mars-extendedregular", arial; }
p:last-child{margin-bottom: 0;}

ul, li{position: relative;  display: inline-block;}

article ul{position:relative; width: 100%; display: block; float: left; margin-bottom: 1em; font-family: "mars-extendedregular", arial; }
article ul li{position: relative; float: left; width: 100%; display: block; margin-bottom: 0.2em; box-sizing: border-box; padding-left: 1.7em; text-align: left;}
article ul li::before{position: absolute; left: 0; top:0.25em; content: ""; width: 1em; height: 1em; background-image: url("../img/elements/dot.svg"); background-size: 100% auto; background-position: left top; background-repeat: no-repeat;}


img{position: relative; float: left; width: 100%; display: block; height: auto;}

section, header, main, footer{position: relative; float: left; width: 100%; display: block; }

/* basics */

h1, h2, h3, h4, h5, h6{ position: relative; float: left; width: 100%; font-weight:400; letter-spacing: -0.09em; line-height: 1.1em; font-family: 'Shippori Mincho B1', serif;  }
h1{font-size:3.2em; margin-bottom: 0.7em;}
h2{font-size:3em;  margin-bottom: 0.7em;  }
h3{font-size:2em; line-height: 1em; margin-bottom: 0.1em; }
h4{font-size:1.4em;}


.detailarticle h3{font-size:1.2em; margin-top: -1em; margin-bottom: 2em; text-transform: uppercase;}

/* blocks*/
.reserve{position: fixed; width: 100%; overflow: hidden; background-color: #1A1112; height: 100%;  top:0;-webkit-transform:translateY(-100%);transform:translateY(-100%); z-index: 51; -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.1s; transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.1s; transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.1s; transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.1s, -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1) 0.1s;}
.container{-webkit-transition: -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1);transition: -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1);transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1);transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1); opacity: 0; background-color: #fff; overflow: hidden; }
.animate .container{opacity: 1; -webkit-transition: opacity 1s ease ; transition:opacity 1s ease ;}
.animate .loader{opacity: 0;-webkit-transition: opacity 0.4s ease;transition:opacity 0.4s ease;}
  
header{height: 4em; overflow: hidden; position: relative; z-index: 10; background-size: cover; background-position: center;}

header .reserveren{background-color: #C5E4EC; color: #1A1919;}



 .open .reserve{-webkit-transform:translateY(0);transform:translateY(0); -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1); transition: -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1); transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1); transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);}
.open .container{overflow: hidden; opacity: 0;-webkit-transition: opacity 0s linear 0.5s;transition: opacity 0s linear 0.5s;}
.menuopen .container{overflow: hidden; opacity: 0;-webkit-transition: opacity 0s linear 0.5s;transition: opacity 0s linear 0.5s;}


.middle{left:50%; top: 50%; -webkit-transform:translateY(-50%) translateX(-50%); transform:translateY(-50%) translateX(-50%);}
.acenter{text-align: center;}


.block25{width: 25%;}
.block75{width: 75%; box-sizing:border-box; padding-right: 2em;}
.block50{width: 50%;}
.block30{width: 30%;}
.block35{width: 35%;}
.block33{width: 33.33%;}
.block66{width: 66.66%;}
.block100{width: 100%;}

.logo{position: absolute; width: 12em; height: 11em; display: block; margin-top: 8em; top:10%; }
.harrys{position: relative; float:left; display: block; width: 100%; height: 100%; background-image: url("../img/elements/founders_bar2.svg"); background-size: 100%; background-repeat: no-repeat;}

.reserveren{
  position: absolute; width: auto; display: block; top:78%; cursor: pointer;
  font-family: 'mars-extendedregular', Arial, Helvetica; 
  white-space: nowrap;
  background-color: #C5E4EC; color: #1A1919;  padding: 0 3.5em; line-height: 2.9em; text-transform: uppercase; font-size: 1em; letter-spacing: -0.02em;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  user-select: none;
 }

.reserveren:hover{background-color: #C5E4EC; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease;}

.giftcardbtnhome{ position: absolute; top:78%; margin-top: 3.6em; font-size: 0.9em; line-height: 2em; z-index: 11; padding: 0 0em; text-align: center;  color: #fff; }
.giftcardbtnhome a{padding: 0.5em 0; margin-left: 0.5em;}
.giftcardbtnhome span{color: #fff;}
.giftcardbtnhome a{color: #fff; display: inline-block;
  font-family: 'mars-extendedregular', Arial, Helvetica; 
  color: inherit;
  text-decoration: none;
  min-width: auto !important;
  padding: 0 0em;
  cursor: pointer;
  line-height: 2em;
  text-transform: none;
  font-size: 1.1em;
  letter-spacing: -0.02em;
  border-bottom: 1px solid;}

.giftcardbtnheader{
   position: absolute; right:18em; top:0.5rem;
  font-family: 'mars-extendedregular', Arial, Helvetica; 
  color: inherit;
  text-decoration: none;
  min-width: auto !important;
  padding: 0 0em;
  cursor: pointer;
  line-height: 2em;
  text-transform: none;
  font-size: 0.9em;
  letter-spacing: -0.02em;
  border-bottom: 1px solid;
}

.topmenu{position:absolute; top: 2.9em; width: 100%; text-align: center; letter-spacing: -0.02em; font-size: 1.1em; font-family: 'mars-extendedregular', Arial, Helvetica; color: #1A1919; user-select: none;}
.topmenu li{margin: 0 1.1em; cursor: pointer;margin-bottom: 0.3em; line-height: 2em;  color: #fff;}
.topmenu li:hover{border-bottom: 1px solid;margin-bottom: 0px; }
.topmenu li a{border-bottom: 0; color: inherit; font-family: inherit; }

.topmenu2{position:absolute; top: 2.9em; width: 100%; text-align: center; font-size: 1em; border-top: 1px solid #333; margin-top: 0.5em; padding-top: 0.3em; letter-spacing: -0.02em;
  font-size: 1em;
  font-family: 'mars-extendedregular', Arial, Helvetica; color: #1A1919; user-select: none;}
.topmenu2 li{margin: 0.2em 1.1em 0.5em; cursor: pointer;margin-bottom: 0.5em; line-height: 1.6em;  color: #fff;}
.no-touch .topmenu2 li:hover, .no-touch .topmenu2 li.active{border-bottom: 1px solid #C5E4EC;margin-bottom: 0px; }
 .topmenu2 li a{border-bottom: 0; color: inherit; font-family: inherit;}

.mainmenu{position:absolute; right: 2%; user-select: none; z-index: 5; top:-200%;  box-sizing: border-box; width: 12em; margin:5em 0; text-align: left; font-weight: 400;  -webkit-transition: color 0.3s ease;  transition:color 0.3s ease; color: #1A1919; }
.mainmenu li{position: relative; float: left; clear: both; margin: 0.65em 0; cursor: pointer; }

.mainmenu .harry-beeldmerk_harry{position: absolute; width: 5em; bottom: -1.3em; font-size: 2.7em; left: 0; cursor: pointer;}
.mainmenu li a{border-bottom: 0; color: inherit; font-family: inherit;}

.mainmenu .talen{  left:0em!important; transform:translateX(0)!important; top:auto; bottom: 1.5em; z-index: 99; margin: 0;  }
.touch .mainmenu .talen{bottom:5.5em;}
.inner{position: absolute;padding: 2em 3em; top:0; width: 100%; box-sizing: border-box; }
.inner2{position: relative; float: left; width: 100%;}


.bottombalk{position: fixed; bottom:0; margin-top: 0; top: auto; height: 0em; pointer-events: none; z-index: 11;}
.bottombalk .foundersbarlogo{position: absolute; right: -0.5em; top: auto; bottom: 0em; width:8em; border: 0; pointer-events: auto; transform:translateY(0); transition: transform 0.3s ease;}

.bottombalk .talen{pointer-events: auto;}

.mainmenu2{position:absolute; right: 2%; user-select: none; z-index: 5; top:-200%; width: 12em; margin:5em 0; text-align: left; font-size: 0.85em; letter-spacing: 0.15em; text-transform: uppercase;  -webkit-transition: color 0.3s ease;  transition:color 0.3s ease; color: #1A1919; }
.mainmenu2 li{position: relative; float: left; clear: both; margin: 0.65em 0; cursor: pointer;}
.mainmenu2 li:hover:before{position: absolute; left: -1.5em; width: 1em; height: 1em; border-radius:50%; content: "•"}
.mainmenu2 li.active:before{position: absolute; left: -1.5em; width: 1em; height: 1em; border-radius:50%; content: "•"}
.mainmenu2.harry-beeldmerk_harry{position: absolute; width: 5em; bottom: -1.3em; font-size: 2.7em; left: 0; cursor: pointer;}
.mainmenu2 li a{border-bottom: 0; color: inherit; font-family: inherit;}


/* kleuren vlakken*/
.z{z-index:6;}
.red{     background-color: #C5000C;}
.yellow{  background-color: #FFC710;}
.green{   background-color: #A7D1C2;}
.blue{    background-color: #1a1919;}
.zwart{   background-color: #1A1112;}
.white{   background:none; }
.grey{ background-color: #F8F8F8;}
footer{background-color: #1A1112; color: #fff; box-sizing:border-box; padding:4% 5% 4% 5%; margin-top: -2px;}
footer::before{position:relative; float:left; content: ""; width: 100%; height: 1px; background-color: #333; margin-bottom: 2.5em;}
footer::after{position:relative; float:left; content: ""; width: 100%; height: 1px; background-color: #333;margin-top: 2.5em;}



.kaart{  background-size: 100% auto; background-position: center top; background-repeat: no-repeat; margin-bottom: 2em;}
/* background-image: url("../img/elements/intro.png"); min-height: 10em;*/
.intro{height: auto; background-color: #000!important; }

.intro .breed{margin:5em auto 2.5em!important;}

.intro h2{margin-top: 1em; }

/* kleuren balk*/
.color0{background:none; color: #CDBC9B; }
.color1{background:none; color: #1A1919; -webkit-transition: color 1s ease; transition:color 1s ease;}
.color2{background:none; color: #1A1919; }
.color3{background:none; color: #1A1919; }
.color4{background:none; color: #1A1919; }
.color5{background:none; color: #1A1919; }
.color6{background:none; color: #1A1919; }  
.color7{background:none; color: #1A1919; }
.color8{background:none; color: #1A1919; }
.color9{background:none; color: #1A1919; }
.color10{background:none; color: #1A1919; }
.color11{background:none; color: #fff; }
.detail.white {border:4em solid #03323B;}




ul.submenu{position: relative; float: left; width: 100%; min-height: 2em; line-height: 2em; padding: 1.6em 0; text-align: center; overflow: hidden; border: 1px solid #eee; border-left: none; border-right: none; margin-bottom: 2em; user-select: none;}
ul.submenu li {position: relative; float: none; text-decoration: none; width: auto; display: inline-block; height: auto;  cursor: pointer;padding: 0; }
ul.submenu li a {position: relative; float: none; text-decoration: none; border-bottom: 0; text-transform: uppercase; width: auto; display: inline-block; letter-spacing: 0.05em; min-height: 1.4em; padding:0.5em; line-height: 1.5em; cursor: pointer;padding: 0 1.8em; -webkit-transition: color 0.2s ease; transition: color 0.2s ease; font-size: 0.9em;}
ul.submenu li a.active {font-family: "MBB", Arial;}
ul.submenu a:hover{}


.breed{position: relative; float: none; width: 50em; margin:5em auto 0;}
.breed2{position: relative; float: none; width: 100%; max-width:60em; padding: 0 4em; box-sizing: border-box; margin:0em auto 0;}

#tabsall article{
  opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

#tabsall img{
  opacity: 1;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

#tabsall .go section article{
  opacity: 1;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
  }

#tabsall .go section img{
  opacity: 1;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
  }

.courses{ }
.menus{position: relative;float: left; width: 100%; padding-bottom: 2em;  }
.menus li{position: relative; float: left; width: 100%; height: 2em; padding-left: 0; line-height: 2em; background-color: #fff;}
.menus li::before{content:"";position: absolute;width: 100%; height: 1px;height: 1px; background-color: #eee; top:50%; left: 0;}
.menus li span{position: relative; float: left; padding-right: 0.5em; background-color: #fff;}
.menus li .floatleft, .menus li .floatright {position: absolute; left:0; top:0;}
.menus li .floatright{left:auto; right: 0; padding-left: 0.5em; background-color: #fff;}
.menus .dish{text-transform: uppercase;font-family: "Shippori Mincho B1", Arial, Helvetica; letter-spacing: 0.06em; }
.menus .gram{text-transform: uppercase; font-family: ; font-size: 0.9em; }
.menus .vegi{float: none; display: inline-block;}
.menus .vegi::after{width: 1em; text-align: right;  content: "(V)"; width: 2em; height: 2em; display: block; color: #1A1112; background-color: #fff;}
.menus .pricelabel{text-transform: uppercase; font-size: 0.9em;}
.menus .price{text-transform: uppercase;font-family: "MB", Arial;}
.menus .descrip{font-size: 0.9em; font-family: "MAJ", "MB", Arial;text-overflow: ellipsis;}
.menus li .floatright span:last-child{padding-right: 0;}
.downloads{padding: 1em 0 1em; text-align: center; user-select: none;}
.download{ position: relative; margin: 0 0.8em 1.7em; border: 0; display:inline-block; cursor: pointer;
  font-family: 'mars-extendedregular', Arial, Helvetica;
  white-space: nowrap;
  background-color: #1A1919;
  color: #fff;
  padding: 0 3.5em;
  line-height: 2.9em;
  text-transform: uppercase;
  font-size: 0.9em;
  letter-spacing: -0.02em;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  user-select: none;}
.url{ position: relative; margin: 0 0.8em 1.7em; border: 0; display:inline-block; font-family: 'MBB', Arial, Helvetica; color: #fff; text-decoration: none; 
  background-color: #1A1112;  padding: 0 1.8em; cursor: pointer; line-height: 2.9em; text-transform: uppercase; font-size: 0.8em; letter-spacing: 0.23em;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease; user-select: none; }


.btnline{ position: relative; margin: 0 0.8em 1.7em; border: 0; display:inline-block; font-family: 'MBB', Arial, Helvetica; color: #CDBC9B; text-decoration: none; 
  background-color: #1A1112;  padding: 0 1.8em; cursor: pointer; line-height: 2.9em; text-transform: uppercase; font-size: 0.8em; letter-spacing: 0.23em; border: 1px solid #CDBC9B;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease; user-select: none; }

.btnlinecompact{ position: relative; margin: 0 0.8em 1.7em; border: 0; display:inline-block; font-family: 'MBB', Arial, Helvetica; color: inherit; text-decoration: none; min-width: auto!important; padding: 0 0em; cursor: pointer; line-height: 2em; text-transform: uppercase; font-size: 0.8em; letter-spacing: 0.23em; border-bottom: 1px solid;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease; user-select: none; }

.menus .column{position: relative; float: left; width: 50%; display: block;}

.download.invert{background-color: #CDBC9B; color: #1A1919!important; border: 0;}
 



.downloads a, .privatedining .download, .foundersbarblock .download{ min-width: 15em;}
.downloads .download{padding-left: 3.4em;}


.download:hover{background-color: #C5E4EC; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease;}
.download.invert:hover{background-color: #1A1919; color: #CDBC9B!important; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease;}

.download.invert:hover::before{border:1px solid #1A1919; -webkit-transition: border 0.3s ease; transition: border 0.3s ease;}

.holidaycard .downloads a::after {background-image: url("../img/elements/pdfbestand2.png");}

.downloads a.download.invert::after {background-image: url("../img/elements/link.png");}


.talen{position: absolute; top:4em; right: 3em;  border: 1px solid #1A1919; height: 2.6em; width: 6em; padding: 0; border-radius: 5px; overflow: hidden;}
.talen a{border-bottom: none; position: absolute; width: 2.8em; font-family: "MBB"; text-align: center; height: 2.6em; padding-left: 0.2em; line-height: 2.6em; right: 0;   background-color: #1A1112; color: #fff; }
.talen a:first-child{left:0; right: auto;}
.talen a.actief{background-color: #F8F8F8; color: #1A1919;}

.holidaycard .download{background-color: #CDBC9B; color: #1A1919;}
.holidaycard .download::before{border:1px solid #CDBC9B;}
.holidaycard img{margin-bottom: 4em;}
.holidaycard .makeres{background-color: #fff;}
.holidaycard .makeres:before{border-color: #fff;}

.promos{margin-top: 2em; margin-bottom: 1em;}
.promo{height: auto; margin:-1px auto; background-color: #fff; color: #1A1919; box-sizing: border-box; padding: 0 1em;}
.promo h5{font-size: 0.9em; letter-spacing: 0;
font-family: "MAJ", "MB", Arial; text-transform: none; line-height: 1.5em; margin-bottom: 0.6em;}
.b50:nth-child(2) .promo{background-color: #fff}
.promo h4{margin-bottom: 0.8em;}

.promo p{line-height: 1.5em; font-size: 0.9em; margin-top: 0.4em;}
.promo .acenter{margin:2.4em 0 0.2em;}


.slider h2{position: absolute; top:50%; height: 3em; margin-top:-1.5em; left:10%;}
.slickie-prev{position: absolute; content: ""; cursor: pointer; top:50%; left: -14%; height: 50px; width: 50px; margin-top: -25px; background-image: url('../img/arrowleft.png');background-size: 100%; }
.slickie-next{position: absolute; content: ""; cursor: pointer; top:50%; right: -14%; height: 50px; width: 50px; margin-top: -25px; background-image: url('../img/arrowright.png');background-size: 100%; }
.giftcard .breed{ margin: 0em auto;}
.giftcard .breed .innerbinner{padding: 5em 0 6em;}
.giftcard{max-height:0em; height:auto; margin-top: -1px; z-index: 3;  transition:max-height 0.4s ease, padding 0.4s ease;  background-color: #CDBC9B; text-align: left; margin-bottom: 0em; }
.ope .giftcard{max-height:50em; margin-bottom: 5em; height: auto; transition:max-height 0.4s ease; }
.giftcard .breed{padding:0; opacity: 0;-webkit-transition: opacity 0.4s linear 0.15s;transition:opacity 0.4s linear 0s;}
.ope .giftcard .breed{padding:0; opacity: 1;-webkit-transition: opacity 0.4s linear 0s;transition:opacity 0.4s linear 0.2s;}

.giftcard h2{margin-bottom: 1em; margin-top: 0.7em;  text-align: left;}
.giftcard a{ color: #1A1112; letter-spacing: 0.1em; text-decoration: none; border-bottom: 1px solid;}
.zeshoek{position: absolute; cursor: pointer; top:-8.9em; margin-top: 0; font-size: 1em; user-select: none; left:-13.6em; -webkit-transform:translateX(0); transform:translateX(0); line-height: 1.2em; letter-spacing: 0.12em; width: 10em; height:10em; color: #fff;  }
 

.zeshoek::before{position: absolute; content: ""; left: 0; top:0; width: 10em; height: 10em; background-color: #CDBC9B; transition:transform 0.6s ease; transform:rotate(45deg); transform-origin:center;}
.zeshoek:hover::before, .ope .zeshoek::before{background-color:#1A1112; transform:rotate(135deg);}
.zeshoek:hover span, .ope .zeshoek span{color: #fff;}
.zeshoek span{position: absolute; text-transform: uppercase; width: 80%; padding: 0 10%; text-align: center; color: #1A1112; font-family: "Shippori Mincho B1";}
.zeshoekharry{overflow:visible; z-index: 10;}
.zeshoekharry .breed{margin: 0 auto; overflow:visible;}



.holidaycard{height:0; -webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); transition:all 0.4s cubic-bezier(0.77, 0, 0.175, 1); background-color: #1a1919; text-align: left;  }
.opeee .holidaycard{height:40em;-webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1);transition:all 0.4s cubic-bezier(0.77, 0, 0.175, 1);  padding-bottom: 1em;}
.holidaycard .breed{padding:0; opacity: 0;-webkit-transition: opacity 0.4s linear 0.15s;transition:opacity 0.4s linear 0.15s;}
.opeee .holidaycard .breed{padding:0; opacity: 1;-webkit-transition: opacity 0.4s linear 0.15s;transition:opacity 0.4s linear 0.15s;}

.holidaycard h2{margin-bottom: 1em;  font-size: 2em; line-height: 1.4em; text-align: left;}
.holidaycard h4{font-size: 1.1em;font-family: "MB", Arial;line-height: 1.8em; color: #fff; margin-bottom: 0.5em; color: #CDBC9B;}
.holidaycard p{ color: #fff;}
.holidaycard a{ color: #cdbc9b; letter-spacing: 0.1em; text-decoration: none; border-bottom: 1px solid;}

.holidaybtn{position: absolute; cursor: pointer; top:1.9em; left:-15.8em; z-index: 99; margin-top:2.8em;font-size: 0.9em; line-height: 1.2em; letter-spacing: 0.12em; width: 10em; height:10em; color: #fff;-webkit-transition: top 0.3s ease;transition: top 0.3s ease; user-select: none; }
.holidaybtn span{position: absolute; text-transform: uppercase; width: 80%; padding: 0 10%; margin-top: 0.4em; text-align: center; font-family: "Shippori Mincho B1"; color: #1a1919; }
.holidaybtn::before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 10em;
    height: 10em;
    background-color: #fff;
    border: 1px solid #1A1919;
    transition: transform 0.6s ease;
    transform: rotate(45deg);
    transform-origin: center;
}

.holidaybtn:hover::before, .opeee .holidaybtn::before{background-color:#FF5360; transform: rotate(135deg);}
  .zeshoekholiday{overflow:visible; z-index: 10;}
  .zeshoekholiday .breed{margin: 0 auto; overflow:visible;}
.b60{margin-bottom: 3em; width: 55%; margin-right: 5%;}



.extrasmall{font-size: 0.7em; float: right;}
.privatedining{text-align: center; padding-bottom: 7em; padding-top:1em; z-index: 4;}
.privatedining .b100{ margin-bottom: 3em; width: 70%; margin-left: 15%;}
.privatedining .b100 h3{
    border:0;
    font-size: 2.8em;
    line-height: 2.6em;
    margin: 0.4em auto 0;
}
.privatedining .b100 article {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0em 2em;
}
.privatedining .b100 p {
    margin-bottom: 2em;
}
.privatedining .b100 article {
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0em 2em;
}
.privatedining .b100 p {
    margin-bottom: 2em;
}

.restaurantbar{padding-bottom: 0em; margin-bottom: 2em; z-index: 4;}
.restaurantbar .b50{text-align: left;}
.restaurantbar .b100{ text-align: center;  margin-bottom: 0em; width: 100%; margin-left: 0%;}
.restaurantbar .b100 h3{
    border:0;
    font-size: 2.1em;
    line-height: 1.4em;
    margin: 0.2em auto 0.6em;
}
.restaurantbar .b100 article {
    position: relative;
    float: left; 
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    background-color: #EDE8E2;
    padding: 4.5em 3em 5em;
}
.restaurantbar .b100 p {
    margin-bottom: 2em;
}

.restaurantbar .download {
  min-width: 15em;
  margin: 0;
  text-align: center;
}

.sliderblock{z-index: 5;}
.sliderblock .slideimg .thumb{position: relative; float: left; width: 100%; padding-bottom: 140%; }
.sliderblock .slideimg img{position: absolute; left: 0; top:0; width: 100%; height: 100%; object-fit: cover; overflow: hidden;}
.sliderblock .slick-dots{bottom:-2.5em;}
.sliderblock .slick-dots li button::before{color: #1A1919;}
.sliderblock .slick-dots li.slick-active button::before{color: #1A1919;}

article .breed{margin-top: 1em;}
.b100{margin-bottom: 2em;}
.b50{margin-bottom: 2em; width: 47%; margin-right: 5%;}
.b33{margin-bottom: 2em; width: 33%;}
.b50:nth-child(2n){margin-right: 0;}


.spacing a{letter-spacing: 0.1em; margin:0 1em; text-transform: uppercase; font-family: 'MB', Arial, Helvetica;  text-decoration:none; border-bottom: 1px solid;}
.video{width: 90%; margin: 5% 5%;}
video{position: relative; float: left; width: 100%;}
video::-webkit-media-controls {
  display: none;
}
.video::after{content:""; position:absolute; border:1px solid #999; left:-1em; top: -1em; right: -1em; bottom: -1em;box-sizing:border-box; }
.video::before{content:""; position:absolute; border:1px solid #999; left:-1.2em; top: -1.2em; right: -1.2em; bottom: -1.2em;box-sizing:border-box; background-color: #fff; }
.theteam{ text-align: center; padding-bottom: 15em;}
.theteam h3, .generalinfo h3, .foundersbarblock h3{border: 0; margin-bottom: 0; font-size: 2.8em; line-height: 1.2em; margin-bottom: 1.3em; margin-top: 2.8em;}
.theteam div h3{font-size: 1em; margin-bottom: 0.5em; font-family: "mars-extendedregular"; letter-spacing: 0;}
.theteam p{margin-bottom: 3em; font-size: 1.3em; line-height: 1.6em; font-family: "MB", Arial; text-transform: uppercase; letter-spacing: 0.15em;}
.team{position: relative; float: none; max-width: 60em; width: 100%; margin:0px auto; text-align: center;}
.team .teamlid{position:relative; float: left; display: block; width: 30%;   box-sizing: border-box;}

.team .teamlid .innerteamlid{position: relative; float: left; width: 100%; box-sizing: border-box; display: block; padding:0 8% 20%;}
.team h3{font-size: 1em;line-height: 1.4em;}
.team h4{font-size: 1.6em;  margin-top: 0.15em; margin-bottom: 2em;}
.team .slick-dots{bottom:1em; left: 0;}
.team .slick-dots li button::before{color: #1A1919;}
.team .slick-dots li.slick-active button::before{color: #1A1919;}

.teamcard{height:0; -webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1); transition:all 0.4s cubic-bezier(0.77, 0, 0.175, 1); background-color: #eee; text-align: left; top:0em;  z-index: 2;}
.opee .teamcard{height:50em;-webkit-transition: all 0.4s cubic-bezier(0.77, 0, 0.175, 1);transition:all 0.4s cubic-bezier(0.77, 0, 0.175, 1);  padding-bottom: 1em;}
.teamcard .breed{padding:0; opacity: 0;-webkit-transition: opacity 0.4s linear 0.15s;transition:opacity 0.4s linear 0.15s;}
.opee .teamcard .breed{padding:0; opacity: 1;-webkit-transition: opacity 0.4s linear 0s;transition:opacity 0.4s linear 0s;}

.teamcard h2{margin-bottom: 1em; margin-top: 0.7em; font-size: 2em; line-height: 1.4em; text-align: left; color: #1A1919;}

.teamcard p{ color: #1A1919;}
.teamcard a{ color: #1A1112; letter-spacing: 0.1em; text-decoration: none; border-bottom: 1px solid;}
.teamcard h5{position: relative; float: left; font-size: 1.4em; font-family: "MBB"; margin-bottom: 0.7em; margin-top: 0.3em; width: 100%; text-align: left; color: #1A1919;}


.teambtn{position: absolute; cursor: pointer; top:-15.9em; left:50%; margin-top:3em; user-select: none; -webkit-transform:translateX(-50%);transform:translateX(-50%);font-size: 1em; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition:transform 0.3s ease, -webkit-transform 0.3s ease; line-height: 1.05em; letter-spacing: 0.15em; width: 7em; height:7em; color: #1a1919;  }
.teambtn::before{position: absolute; content: ""; left: 0; top:0; width: 7em; height: 7em; background-color: #fff; border: 1px solid #1A1919;  transition:transform 0.6s ease; transform:rotate(45deg); transform-origin:center;}
.teambtn span{position: absolute; text-transform: uppercase; text-align: center; font-family: "MBB";  }
.teambtn:hover::before, .opee .teambtn::before{background-color:#E6BF34; transform:rotate(135deg);}
.opee .teambtn{ -webkit-transform: translate(-50%, 6.6em); transform: translate(-50%, 6.6em); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition:transform 0.3s ease, -webkit-transform 0.3s ease;}

.teambtnall{overflow:visible; z-index: 3; text-align: center; height: 0;}
.teambtnall .breed{margin: 0 auto; overflow:visible;}
.teamcard .downloads{margin-top: 1.5em;}
.teamcard .downloads a{color: #fff;}
.teamcard .downloads a:hover{color: #fff;}

footer *{color: #fff;}
footer h5{font-size: 1.6em; margin-bottom: 1em; }
footer a{border-bottom: 0; letter-spacing: 0; font-family:"mars-extendedregular",arial;}
footer .makeres{margin-top: 1em;}
footer p{line-height: 1.6em; font-size: 0.9em;}
footer .download{background-color: #C5E4EC; color: #1A1919; font-size: 0.8em; margin: 0 1em 1.7em 0;}
.footersocial{border-top: 1px solid #333; margin-top: 3em; min-height: 2em; line-height: 2em;}
footer .harry-beeldmerk_harry {
    position: absolute;
    margin-top: -0.15em;
    cursor: pointer;
    height: 2em;
    line-height: 2em;
    font-size: 2.6em;
    left: 50%;
    -webkit-transform:translateX(-50%);
            transform:translateX(-50%);
    position: absolute;
    width: 3em;
    top:2em;
}
.footerleft{
  position: absolute;
  left:0;
  height: 2em;
  top:0;
}
.footerright{
  position: absolute;
  right:0;
  height: 2em;
  top:0;
}

.footerleft a, .footerright a{ font-size: 2.6em; position: relative; float: right; height: 2em; line-height: 2em; margin:0 0.3em; }
.footerleft a, .twin, .footerleft span{font-size: 0.8em; cursor: pointer; position: relative; float: left; height:5.4em; letter-spacing: 0.em;  font-family: 'mars-extendedregular', Arial, Helvetica; line-height: 5.4em; margin:0 1em; text-transform: none;}

.footerright a img{position: relative; float: left; width: 0.8em; margin-top: 0.3em;}

.rij1 section, .rij2 section, .rij1 img, .rij2 img{position: relative; float: left; width: 100%; height: auto; display: block; box-sizing:border-box;}
.rij1{position: relative; padding: 2.8% 0 0; }
 .rij2 section{float: right;}
  .rij1 section:first-child{width: 50%;padding-right: 2.8%; margin-top: 4.7%;}
   .rij1 section:last-child{ width: 24.26%;}
.rij2{position: relative; padding: 1.6em 0 0; }
  .rij2 section:first-child{ width: 30.26%; padding-right: 0%;}
  .rij2 section:last-child{width: 55%;padding-right: 2.8%;}

.acolades{text-align: left; margin: 1em 0 2em;}
.acolades img{height: 2.5em; width: auto; object-fit: contain; display: inline-block; margin-right: 1em;}

.acolades a.tripp img{width: 3.8em; top: 0.5em;}
.acolades a{display: inline-block; margin-bottom:0.8em; }

b{font-size: 1.2em; font-weight: 400; font-family: "M";}


table {
  font-size: 1em;
}

.ui-draggable, .ui-droppable {
  background-position: top;
}



.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */

  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.newsletter{
  position: absolute; width: auto; display: block; top:50%; right: 0em; cursor: pointer;
  font-family: 'MBB', Arial, Helvetica; 
  background-color: #CDBC9B; color: #1A1919; font-size: 1.1em;  padding: 0 1.8em; line-height: 2.9em; text-transform: uppercase;  letter-spacing: 0.23em;
  -webkit-transition: background-color 0.3s ease; text-decoration: none!important; border: 0;
  transition: background-color 0.3s ease;
  transform:rotate(-90deg) translateX(75%);
  transform-origin: 100% 100%;
border-color: #1A1919;
border-style: solid;
border-width: 1px 1px 0px 1px;

 }



.newsletter:hover{background-color: #CDBC9B; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease;}




label {display:inline-block; width:100%; position: relative; float: left; text-align: left; text-transform: uppercase; font-size: 0.8em; margin-bottom: 0.5em;}
label.required:after { content:" *"; }
fieldset {width:500px; padding:1em; border:3px solid #CCC;}
input {margin: 0px 0px 1em 0; width:100%; box-sizing:border-box; padding: 0.5em; border:1px solid #1A1112;}

div.clear .button {margin-top: 1em; text-align: center; }
div.clear .button{
  overflow: visible;
  position: relative; float: left; width: auto; display: block; top:68%; cursor: pointer;
  font-family: 'MBB', Arial, Helvetica; 
  border:none;
  background-color: #1A1919; color: #fff;  padding: 0 1.8em; line-height: 2.9em; text-transform: uppercase; font-size: 0.9em; letter-spacing: 0.23em;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
 }

div.clear .button::before {
    border: 1px solid #1A1919;
    bottom: -4px;
    content: "";
    left: -4px;
    position: absolute;
    right: -4px;
    top: -4px; 
    -webkit-transition: border 0.5s ease; 
    transition: border 0.5s ease;
}


div.clear .button:hover{background-color: #CDBC9B; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease;}


.newslettersignup p{text-align: left;}

.smallerr{font-size: 0.8em; margin-bottom: 4em; }
.newslettersignup{position: relative; float: none; margin: 2em auto; width: 30em;}
.newslettersignup h1, h2{margin-bottom: 1em;}
.newslettersignup h1 {font-size: 1.8em;margin: 0.8em 0 1em; color: #1A1112;}
.newslettersignup h2{color: #1A1112; font-size: 1.2em; text-align: left; margin-top: 1.8em;}
.newslettersignup{position: relative; float: none; margin: 2em auto; width: 30em;box-sizing:border-box; }
.newslettersignup p{text-align: left;}
.newslettersignup .agree{box-sizing:border-box; padding: 1em 0 1em 1.5em;}

.newslettersignup .checkbox_check{position: absolute; left:0; margin-top: 0.2em; width: 1em; height: 1em;}
.newslettersignup form{position: relative; float: left; width: 100%; margin: 1em auto; }


.newslettersignup input {
    -webkit-appearance: none;
    border-radius:0;
}

.newslettersignup input[type=checkbox] {
   -webkit-appearance: checkbox;
}

.newslettersignup .reserveren{position: relative; float: left; top: auto; left: auto; margin-bottom: 2em; font-size: 0.8em; margin-right: 2em;}
.smallerr{font-size: 0.8em; margin-bottom: 4em; }

.successkeblok{max-height:0;overflow: hidden; transition:max-height 0.3s ease; color: #fff!important; background-color: #1A2333; box-sizing:border-box; padding: 0 2em;}
.newslettersignup .successkeblok p{ position: relative; float: left; width: 100%; margin-bottom: 2em;}
.newslettersignup .successkeblok h2 {
    color: #fff;
    font-size: 1.6em;
    margin: 1.2em 0 0.6em;
    }
.successke .successkeblok{display: block; max-height: 30em;transition:max-height 1s ease;}
.successke .button{opacity: 0; transition:opacity 0.2s ease;}


/*ACCORDION */

.accordion {
  position: relative; float: left; width: 100%;
  margin-bottom: 1.5em;
   -webkit-user-select: none; /* Safari */ /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.accordion dt, .accordion dd {
  
   box-sizing:border-box;
  position: relative; float: left; width: 100%;
  
}
.accordion dt{font-size: 1.1em;}
.accordion dd {
  border-top: 0;
  font-size: 1em;
  margin-top: -0.5em;
  margin-bottom: 0;
  margin-left: 0.2em;
   padding: 0.8em 0em 0.8em 0em;
}

.accordion dd div{position: relative; float: left;width: 100%; box-sizing:border-box; padding: 2em 2em; margin-bottom: 2em;  background-color: #F4E8DE;}
.accordion dd div a{text-decoration: underline; text-decoration: none;}
.accordion dd h3{text-transform: none; font-size: 1em; font-weight: 400; margin-bottom: 1.2em; text-align: left;}
.accordion dd ul{position: relative; float: left; width: 100%; margin-bottom: 2em;}
.accordion dd ul li{position: relative; float: left; width: 100%; box-sizing:border-box; padding-left: 1.2em;}
.accordion dd ul li::before{position: absolute; left:0; content: "•";}
.accordion dt span {
  display: block;
  cursor: pointer;
  
  box-sizing:border-box; 
  font-size: 1em;
  overflow: hidden;
  
  letter-spacing: 0.0em;
  position: relative; float: left; width: 100%;
   padding: 0.6em 2em 0.6em 3.2em;
}

.accordion dt span:hover{}
.accordion dt span img{
  
  padding: 0;
  font-size: 1em;
  font-weight: 100;
  border-radius: 2px;
  width: 3.6em; height: 3.6em; line-height: 3.6em;
  text-align: center;
  color: #fff;
  position: absolute; left: -0.7em; 
  margin-top: -1.1em;
}


.accordion dd:last-of-type {
  
  position: relative;
  top: -1px;
}
.accordion dt.inspring, .accordion dd.inspring {padding: 0.3em 2em 0.3em 3.6em;}
.accordion dt.inspring span::before{left: 1.6em; }



.infocontainer{padding:0 0 1em 0; float: left; z-index: 3;}



.infocontainer ul li{font-family: "MAJ", arial;}

.generalinfo{width: 40em;margin: 0em auto; background-color: #fff; }

.generalinfo .accordion{margin-bottom: 2.6em; position: relative; margin-top: 0.5em; float: left;width: 100%;}
.generalinfo .b50{width: 100%; padding-left: 0;}

.generalinfo p:last-child {margin-bottom: 0;}


.newsletter{display: none!important;}


.basicpage .paperke{position: relative; float: none; width: 100%; max-width: 40em; margin: 0 auto;}

.basicpage .paperke article{position: relative; float: left; width: 100%; margin-bottom: 5em; padding: 2em; box-sizing:border-box;}


.flyercontainer{display: none; height: 0; overflow: hidden;}
.flyeropen .flyercontainer{display: block;height: 0; overflow: hidden;}

.absoluto{position: fixed; left: 0; top:6em;} 

article p strong, article p b{font-family: inherit; font-weight: 800;}
article p a{font-family: inherit; text-decoration: underline; border-bottom: 0; font-weight: inherit; font-size: inherit;}

.flyeropen .slick-lightbox .slick-lightbox-slick-item-inner{cursor: pointer;}

.flyeropen .slick-lightbox-slick-img {width: auto;}

.subtitelcontainer{padding: 4em 0 3em;}
.kaart .subtitelcontainer{}
.subtitel{position: relative; float: none; width:10em; height: 3em; margin: 0 auto; display: block; }
.subtitel img{position: relative; display:inline-block;float: left; width: 100%;}
#sub1{width: 13em; height: 6.5em;}
#sub2{width: 14em; height: 7em;}
#sub3{width: 12em; height: 6em;}
#sub4{width: 14em; height: 7em; margin-bottom: 1em;}

#sub6{width: 5.7em; height: 4.5em; margin-bottom: 0.5em; margin-top: 1em}
#sub7{width: 6.7em; height: 5em; margin-bottom: 0.5em; margin-top: 0.5em}
#sub9{width: 20em; height: 8.5em; }

.thefarm{background-color: #EDE8E2; padding-bottom: 5em;}
.allfarm .farm1{padding: 0 0; box-sizing:border-box;}
.allfarm .farm1 .slider .slick-list,  .allfarm .farm1 .slider .slick-track{height: 100%!important;}
.allfarm .farm1 .slider{width: 100%!important; height: 100%!important; object-fit: cover;}
.allfarm .farm1 img{object-fit:cover;}
.allfarm .farm2{padding: 0 3em; box-sizing:border-box;}
.allfarm .farm2 .slider{top:50%; transform:translateY(-35%)!important; }

.allfarm .farm3{padding: 0 0; box-sizing:border-box;}
.allfarm .farm3 p{width: calc(100% - 14em); margin-bottom: 2em;}

.thefarm .thumb img{position: absolute; left: 0; top:0; width: 100%; height: 100%; object-fit: cover; overflow: hidden;}
.thefarm .thumb{position:relative; float: left; width: 100%; display: block;}

.thefarm #slider3-1 .thumb{padding-bottom: 160%;}
.thefarm #slider3-2 .thumb{padding-bottom: 140%;}
.thefarm #slider3-3 .thumb{padding-bottom: 100%;}

.menubtns{position: absolute; top:71%; width: 100%; left: 0; text-align: center; display: none;}
.menubtns a{text-align: center; display: inline-block; text-transform: uppercase; font-family: 'MBB'; letter-spacing: 0.07em;}


.kaart .breed{margin-top: 0;}


.bestelbutton{

    position: relative;
    width: auto;
    display: block;
    float: left;
    left: 50%; transform:translateX(-50%);
    text-decoration: none;
    border:0;
    cursor: pointer;
    font-family: 'MBB', Arial, Helvetica;
    background-color: #EEBC30;
    color: #1A1112;
    padding: 0 3.5em;
    line-height: 2.9em;
    text-transform: uppercase;
    font-size: 0.9em;
    margin: 4em 0 2em;
    letter-spacing: 0.23em;
    -webkit-transition: background-color 0.3s ease;
    transition: background-color 0.3s ease;

}

.bestelmenuheader{height: 18em; margin-bottom: 2em; background-color: #1A1112; position: relative; float: left; width: 100%; display: block; background-repeat: no-repeat; background-image: url(../img/elements/harrys_athome_logos.png); background-size: 13em auto; background-position: center 4em; }

.bestelmenuheader .bestelbutton{position: absolute; bottom:2em; left:50%;}

.bestelshit h3{margin-top: 0.7em; font-size: 1.4em; line-height: 1.6em; margin-bottom: 1.4em; padding-bottom: 0.7em;}
.bestelshit h2{text-align: left; font-size: 1.2em; color: #1A1112; margin-bottom: 0.2em; margin-top: 0.4em;}
.bestelshit2 iframe{ margin-top: -7.7em; margin-bottom: 7em;}

.bestelshit .graphic1{position: relative; float: left; display: block;  width: 100%; height: 7em; margin-bottom: 2em; background-repeat: no-repeat; background-image: url(../img/elements/athome.png); background-size: 13em auto; background-position: center center; }

.bestelbuttons{position: relative; float: left; width: 100%; text-align: center; margin-top: 12em; margin-bottom: 2em;}
.bestelbutton1, .bestelbutton2{
    
    position: relative;
    width: auto;
    display: inline-block;
    
    text-decoration: none;
    border:0;
    cursor: pointer;
    font-family: 'MBB', Arial, Helvetica;
    background-color: #EEBC30;
    color: #1A1112;
    padding: 0.7em 2em;
    line-height: 1.6em;
    text-align: center; min-width: 18em;
    text-transform: uppercase;
    font-size: 0.9em;
    margin: 0em 1em 2em;
    letter-spacing: 0.23em;
    -webkit-transition: background-color 0.3s ease;
    transition: background-color 0.3s ease;

}

p em{font-style: italic;}

.formitable .bestelshit .bestelmenuheader{height: auto;}
.formitable .b50{width: 50%; margin-right: 0; margin-bottom: 0;}
.formitable .b50:nth-child(2) img{position: absolute; width: 100%; height: 100%; object-fit:cover; }



.aantalgerechten{text-align: center; margin-bottom: 1em;}

.aantalitem{position: relative; display: inline-block; width: auto; text-align: center; margin: 0 1em 1em; font-family: "MAJ", "MB", Arial; font-size: 1em;} 
.aantalitem span{position: relative; float: left; width: 100%; clear: both;}
.aantalitem .aantalprijs{font-family: "MB", Arial;}

.onderzin{position: relative; float: left; margin-bottom: 2em; text-align: center; width: 100%;}
.onderzin span{position: relative; float: left; display: inline-block; float: none; width:  auto; font-family: "MAJ", "MB", Arial; font-size: 0.9em;}

.aantalgerechtenactive .menus li{height: auto; margin-bottom: 0.7em;}
.aantalgerechtenactive .menus li::before{ height: 0px; display: none;}
.aantalgerechtenactive .menus .descrip{top: -0.7em!important;}
.aantalgerechtenactive .menus li .dish, .aantalgerechtenactive .menus .descrip, .aantalgerechtenactive .menus .gram{position: relative; float: none; width: auto; display: inline-block; top: auto; text-align: center; margin: 0; padding: 0 0em;}
.aantalgerechtenactive .menus .gram{padding-left: 1em;}
.aantalgerechtenactive .menus .descrip{text-align: center; width: 100%;}
.aantalgerechtenactive .menus li .floatleft, .aantalgerechtenactive .menus li .floatright{position: relative; left: auto; right: auto; float: left; width: 100%; text-align: center;}
.aantalgerechtenactive .menus li .floatright{text-align: center; top: -1em; padding-left: 0;}
.aantalgerechtenactive .menus li .floatright span{float: none; display: inline-block;}

.aantalgerechtenactive .menus .pricelabel, .aantalgerechtenactive .menus .price{font-weight: 400; font-size: 0.85em; padding: 0 0.2em!important;}

.infocontainer .generalinfo .b50 p{margin-bottom: 1em;}
.infocontainer .generalinfo .b50 p a{text-decoration: underline;}
.infocontainer .generalinfo .b50 p:last-child{margin-bottom: 0;}
.breakie{position: absolute;left: -14em; top: 4.5em; background-image: url('../img/elements/breakie.png'); background-size: 100% auto; background-position: center; background-repeat: no-repeat; width: 16em; height: 10em; display:none; }

.aboutustekst{position: relative; float: none; margin: 0 auto; max-width: 60em;  box-sizing: border-box;}
.aboutustekst article{position: relative; float: left; width: 100%; padding: 7em 5em 3em; ; line-height: 1.8em; text-align: center; box-sizing: border-box;}
.aboutustekst p{font-family: "mars-extendedregular"; font-size: 1.1em; line-height:1.6em; color:#F4E8DE; }
.holidaycard .download{min-width: 15em;}
.thefarm .download{min-width: 15em; margin: 0; text-align: center;}

.pusher{position: relative; float: left; width: 100%; height: 6.8em;}

.stickybar{ transform: translateY(-101%); transition: transform 0.3s ease; min-height: 6.8em;}
.stickyon .stickybar, .menuon .stickybar{transform: translateY(0);}

.stickybar .inner3, .stickybar .outer{position: relative; float: left; width: 100%;}
.stickybar{position: fixed; box-sizing: border-box; padding: 0.7em 3em; width: 100%; z-index: 50; background-color: #1A1112; color: #fff; text-align: center; }
.stickybar .logodesktop, .stickybar .logomobile { position: absolute; left: 50%; transform: translateX(-50%); top:-0.15em; color: #fff; width: 2em; height: 3em; text-decoration: none; border-bottom: 0;}
.stickybar .logodesktop::after{content: ""; position: absolute; width: 100%; height: 100%; left: 0; background-image: url('../img/elements/fb2.svg'); object-fit: cover; color: #fff; background-size: 100% auto; background-position: center; background-repeat: no-repeat;  }

.stickybar .logodesktop{display: block;}
.stickybar .logomobile{display: none;}
.stickybar .logomobile::after{content: ""; position: absolute; width: 100%; height: 100%; left: 0; background-image: url('../img/elements/fb2.svg'); object-fit: cover; color: #fff; background-size: 100% auto; background-position: center; background-repeat: no-repeat;  }

.stickybar .download{position: absolute;  top:0.2em; margin: 0; right: 0em; min-width: 9.6em; padding: 0 3em; background-color: #C5E4EC; color: #1A1919;}
.stickybar .hamburger{position: absolute; left: 0; top: 0.7em; cursor: pointer; width: 2.6em; height: 1.6em; }
.hamburger span{position: relative; float: left; margin: 0.18em 0; width: 100%; height: 1px; background-color: #fff;transition: opacity 0.3s ease, transform 0.3s ease;}
.stickybar i::before{top: 0.07em;position: relative;}

.topper .hamburger{position: absolute; left: 3em; top: 3.8em; cursor: pointer; width: 2.6em; height: 1.6em; }
.topper .hamburger span{position: relative; float: left; margin: 0.18em 0; width: 100%; height: 1px; background-color: #fff; opacity: 1; transition: opacity 0.3s ease, transform 0.3s ease;}
.topmenu2{opacity:1; transition: opacity 0.1s ease 0.3s;}
.stickyon .topmenu2{opacity:1; transition: opacity 0.3s ease 0s;}

.menuon .hamburger span:nth-child(1){opacity: 0; }
.menuon .hamburger span:nth-child(3){opacity: 0;  }
.menuon .topmenu2{opacity:0; transition: opacity 0s ease;}
.stickyon.menuon .topmenu2{opacity:0; transition: opacity 0.6s ease;}

.extrazin, .onderzin2 {font-family: "MAJ", "MB", Arial;}
.onderzin2{text-align: center; margin-bottom: 2em; margin-top: 1em; font-size: 0.9em; position: relative; display: inline-block; width: 100%;}

.foundersbarblock .contentfounders{position: absolute; left: 50%; top: 50%; width: 100%; padding: 0 2em; box-sizing: border-box; max-width: 36em; transform: translate(-50%,-50%); color: #fff; text-align: center;}
.foundersbarblock .thumb img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.foundersbarblock .thumb{padding-bottom: 50%;}

.black{background-color: #1A1112 !important; color: #fff;}

.video-container {
    position: relative; float: none; display: block; margin: 0 auto; width:100%; max-width: 80em;
}

.play-button, .video-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.video-overlay {
    width: 100%;
    height: 100%;
    background: transparent;
    cursor: pointer;
    z-index: 1;
}
.blockvideo{overflow: hidden; padding-bottom: 4em;}                                
.blockvideo .video-container video{position: relative; float: left; display: block; cursor: pointer; user-select:none; width: 100%; height: auto;}
.blockvideo .play-button {width: 6em; height: 6em; padding: 0; margin: 0; background:none; border:0; cursor:pointer; background-image: url("../img/elements/play.svg"); background-size:contain;}
.blockvideo .unmute-button{position: absolute; right: 3em; bottom: 3em; z-index: 3; width: 3.4em; height: 3.4em; padding: 0; margin: 0; background:none; border:0; cursor:pointer; background-image: url("../img/elements/unmute.svg"); background-size:contain;}
.blockvideo .play-button::after{position: absolute; left: 0; top:0 ;width: 100%; height: 100%; text-align: center; top:0; }
.no-touch .blockvideo .video-container .play-button:hover::after{color: #A9411E;}
.blockvideo .videoWrapper{padding-bottom: 56.25%;}

 .mainmenu {
    position: fixed!important;
    right: 0;
    z-index: 49;
    top: 0!important;
    width: 100%;
    display: block!important;
    height: 100vh; 
    background-color: #1A1112;
    margin: 0 0;
    text-align: center;
    text-transform: ;
    font-weight: 300;
    letter-spacing: -0.02em;
  font-size: 1.3em;
  font-family: 'mars-extendedregular', Arial, Helvetica;
    -webkit-transition: color 0.3s ease;
    transition: color 0.3s ease;
    color: #CDBC9B;
    transform: translateY(-110%)!important;
    opacity: 0;
    transition: opacity 0.6s ease, transform 0s 0.6s!important;
  }

  .menuon .mainmenu{
     transform: translateY(0)!important;
     opacity: 1;
      transition: opacity 0.6s ease, transform 0s 0s!important;
  }
  .mainmenu ul{position: absolute; text-align: center; width: 100%; left:0; top: 50%; transform: translateY(-50%);}
  .mainmenu ul li{position: relative; float: left; font-size: 1.1em; letter-spacing: -0.02em;
  font-family: 'mars-extendedregular', Arial, Helvetica; color: #fff; width: 100%; text-align: center;}
   .mainmenu ul a{position: relative; float: left; font-size: 1.1em; color: #fff; width: 100%; text-align: center;clear: both; border: 0; margin: 0.5em 0;}
  .mainmenu .harry-beeldmerk_harry{display: none;}


.basicpage .widthlarge{position: relative; float: none; width: 100%; max-width: 110em; margin: 0 auto;}

.basicpage .widthlarge .block{position: relative; float: left; width: 100%; text-align: center;  box-sizing:border-box;  }
.basicpage .blockintro{padding: 5em 2em 5em; box-sizing: border-box;}
.basicpage .blockintro p {
  font-family: "Shippori Mincho B1";
  font-size: 1em;
  line-height: 2.2em;
}
.basicpage h1{
  border: 0;
  font-size: 2.8em;
  line-height: 1.4em;
  margin: 0.4em auto 0.6em;
  text-transform: none;
}
.basicpage h1:last-child{margin-bottom:0!important}

.backcontainer{padding: 2em 5% 1em;}
.backcontainer a{letter-spacing: 0.05em; font-family: "Shippori Mincho B1", Arial, Helvetica; font-size: 1em; text-transform: uppercase; border-bottom: 0;}
.backcontainer a::before{position: relative; display: inline-block; content: ""; width: 1.6em; height: 0.8em; line-height: 1.6em; margin-right: 1em; background-image: url("../img/elements/backbtn.svg"); background-size: cover; background-position: center; background-repeat: no-repeat;}
.maxw1{width: 100%; max-width: 40em; position: relative; float: none; display: inline-block;}
.maxw2{width: 100%; max-width: 54em; position: relative; float: none; display: inline-block;}

.flex{ display: -ms-flex; display: -webkit-box; display: -ms-flexbox; display: flex; }
.flexchild{-webkit-box-flex:1;-ms-flex:1;flex:1;  }
.flex .b50{min-height: 43vw; width: 50%; margin-right:0;}
.flex .b50 article{position: relative; top: 50%; transform: translateY(-50%);}


.basicpage .block5050 article{padding:5em 14%; }

.basicpage article h2{
  font-family: "Shippori Mincho B1", Arial, Helvetica;
  color: inherit;
  font-size: 2.8em;
  line-height: 1.2em;
  margin-bottom: 0.8em;
}

 .basicpage article h2 strong{
  font-family: "Shippori Mincho B1", Arial, Helvetica;
  font-weight: 400;
}

.basicpage .block{position: relative; float: left; clear: both; width: 100%; margin-top: -1px;}
.basicpage article p{ float: none; display: inline-block;}
.basicpage article h2, .basicpage article h3,  .basicpage article ul{ float: none; display: inline-block;}
.basicpage article ul:last-child{margin-bottom: 0;}
.coverslider{position: absolute!important; left: 0; top: 0; width: 100%; height: 100%; max-height: 60em; display: block!important;}
.coverslider img{position: absolute!important; left: 0!important; top: 0!important; width: 100%; height: 100%!important; display: block!important; object-fit: cover;}
.coverslider .slick-list, .coverslider .slick-track{height: 100%!important; }
.viceversa .b50:first-child{-webkit-box-ordinal-group: 3;-ms-flex-order: 2;order: 2;}
.viceversa .b50:last-child{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;}

.basicpage .block{margin-bottom: 0em;}
.block5050 .b50{margin-bottom: 0; text-align: center;}
.basicpage .blocktexttext .downloads{text-align: left; float: none; display: inline-block;}
.basicpage .blocktexttext .downloads a {text-align: center; margin: 0 1.6em 1.7em 0;}
.btngroup{float: none; display: inline-block; margin-top: 1em;}
.btngroup a {text-align: center; margin: 0 0.8em 1.7em 0.8em; min-width: 15em;}
.basicpage .block5050 .downloads{float: none; display: inline-block;}
.basicpage .block5050 .downloads a {text-align: center; margin: 0 0.8em 1.7em 0.8em; }
.basicpage .block100 .downloads{text-align: left; float: none; display: inline-block;}
.basicpage .block100 .downloads a {text-align: center; margin: 0 1.6em 1.7em 0;}
.basicpage .block100.blockcentreer .downloads{text-align: center; float: none; display: inline-block;}
.basicpage .block100.blockcentreer .downloads a {text-align: center; margin: 0 0.8em 1.7em 0.8em;}
.basicpage .blockcentreer .downloads{float: none; display: inline-block;}

.basicpage article p + h2{margin-top: 1em;}
.basicpage article ul + h2{margin-top: 1em;}
.basicpage .blockcentreer{text-align: center;}
.basicpage .blockcentreer h2, .basicpage .blockcentreer p, .basicpage .blockcentreer h3 { text-align:center; }

.logofounders{position: relative; display: inline-block; float: none; width: 100%; box-sizing: border-box; padding: 0 2em 1em; max-width: 14em; height: 9em; }
.logofounders img{position: relative; float: left;width: 100%; }


.blockphoto .b100{margin-bottom: 0;}
.blockphoto .b100{margin-bottom: 0;}
.blockphoto .fullphoto img{max-height: 50vw; object-fit: cover;}

.block5050 .innerbinner{position: relative; left: 0: top:0; width: 100%; height: 100%;}
.block5050compact{margin: 0em 0 4em!important;}
.block5050compact .widthlarge{max-width: 70em; margin: 0 auto;}
.block5050compact .coverslider img{height:auto!important; width: 100%!important; max-height: 60em;}
.block5050compact .flex{flex-flow: row nowrap; align-items: center;}
.block5050compact .flex .b50{min-height: auto; z-index: 1;}
.block5050compact .flex .b50.cover{z-index: 0;}
.block5050compact .flex .b50 .thumb{position: relative; float: left; width: 100%; display: block;}
.block5050compact .flex .b50 .thumb img{position: relative!important; float: left!important; height: auto!important; width: 100%!important}
.block5050compact .flex .coverslider{position: relative!important; float: left!important;}
.block5050compact .flex .b50{margin-bottom: 0;}
.block5050compact .flex .b50 .innerbinner{padding: 5em 5em; position: relative; float: left; width: 100%; box-sizing: border-box;}
.block5050compact .flex .b50 .innerbinner{margin-left: -3em;}
.block5050compact .viceversa .b50 .innerbinner{margin-left: 3em;}
.block5050compact .coverslider{max-height: none; margin-left: 3em;}
.block5050compact .viceversa .coverslider{margin-left: -3em;}
.block5050compact .flex .b50 article{top: auto; transform: translateY(0); text-align: center; position: relative; float: left; width: 100%; padding: 0!important;}
.block5050compact .flex .b50 article .downloads{position: relative; float: left; width: 100%; margin-bottom: -2.2em;}
.block5050compact .flex .b50 article .btngroup{position: relative; float: left; width: 100%; margin-top: 1em; margin-bottom: -2.2em;}

.block5050compact2{padding: 5em 0;}

.block5050compact2 .widthlarge{max-width: 70em; margin: 0 auto;}
.block5050compact2 .coverslider img{height:auto!important; width: 100%!important; max-height: 60em;}
.block5050compact2 .flex{flex-flow: row nowrap; align-items: center;}
.block5050compact2 .flex .b50{min-height: auto; z-index: 1;}
.block5050compact2 .flex .b50.cover{z-index: 0;}
.block5050compact2 .flex .b50 .thumb{position: relative; float: left; width: 100%; display: block;}
.block5050compact2 .flex .b50 .thumb img{position: relative!important; float: left!important; height: auto!important; width: 100%!important}
.block5050compact2 .flex .coverslider{position: relative!important; float: left!important;}
.block5050compact2 .flex .b50{margin-bottom: 0;}
.block5050compact2 .flex .b50 .innerbinner{padding: 5em 5em; position: relative; float: left; width: 100%; box-sizing: border-box;}
.block5050compact2 .flex .b50 .innerbinner{margin-left: 0;}
.block5050compact2 .viceversa .b50 .innerbinner{margin-left: 0em;}
.block5050compact2 .coverslider{max-height: none; margin-left: 0em;}
.block5050compact2 .viceversa .coverslider{margin-left: 0em;}
.block5050compact2 .flex .b50 article{top: auto; transform: translateY(0); text-align: center; position: relative; float: left; width: 100%; padding: 0!important;}
.block5050compact2 .flex .b50 article .downloads{position: relative; float: left; width: 100%; margin-bottom: -2.2em;}
.block5050compact2 .subtitelcontainer{padding:1em 0 1em; }

.invertedcolor{color: #fff!important}
.invertedcolor article ul li::before{background-image: url("../img/elements/dot2.svg");}
.invertedcolor .download{ border: 1px solid #fff; background: none; color:#fff;}

.introphoto img{object-fit: cover; max-height: 50em; min-height: 30em;}
.blocktext article{padding: 4em 3em;}
.blocktexttext article{padding: 4em 3em;}
.block5050compact2 + .block5050compact2{margin-top: -4em!important;}
.blockmenuitems{margin-bottom: 4em; margin-top: -2em;}

.languages{font-size: 1em; user-select: none; position: absolute; right:4em; top:3.6em; margin-top:0em; color: #fff; font-family: 'MBB', Arial, Helvetica; }
.languages ul{ background-color: #fff; padding: 0.65em 1.2em 0.65em 1.2em; position: absolute; z-index: 99; pointer-events: none; top: 2.1em; opacity: 0; clear: both; right: -0.1em; width: 9.2em; text-align: right; transform: translateY(-2em); transition: z-index 0s ease 1s, opacity 0.2s ease, transform 0.2s ease; }
.languages ul li{float: left; clear: both; display: block; text-align: left; width: 100%;  }
.languages ul li a{text-transform: uppercase; letter-spacing:0.1em; font-size: 0.8em; font-family: 'MBB', Arial, Helvetica; text-decoration: none; border:0; }
.languages ul li.active::after{position: absolute; right: -0.2em; top: -0.07em; display: inline-block; font-family: 'Helvetica Neue'!important; content: "\2713"; color:#C5E4EC; font-size: 1.3em;}
.languages .activelang{text-decoration: underline; white-space: nowrap; cursor: pointer; font-size: 1em; letter-spacing: 0.1em; text-transform: uppercase; position: relative; float: right; padding: 0em 0 0em;}
.languages .activelang .fullname{display: none;}
.languages .activelang .codename{display: block;}
.languages .activelang span{position: relative; float: left;}
.langopen .languages ul{display: block;  pointer-events:auto; opacity: 1; transform: translateY(0); transition: z-index 0s ease, opacity 0.3s ease, transform 0.3s ease;}

.languages .arrowd {
  position: relative;
  display: inline-block; float: right; margin-left: 0.6em; top: 0.3em;
  width: 0em; height: 0em;
  border: solid #C5E4EC;
  border-width: 0 1px 1px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}

.stickybar .languages{top:0.6em; right: auto; left:4em; opacity:0; transition: opacity 0.3s ease;}
.stickybar .languages ul{left: auto; left: -0.1em; right: auto;}
.stickyon .stickybar .languages{opacity:1; }

.stickybottom{display: none; position: fixed; text-align: center; box-sizing: border-box; padding:1em 0.5em; box-sizing: border-box; bottom:0; left:0; width:100%; background-color:#1A1112; z-index: 50; transform:translateY(100%); transition: transform 0.3s ease;}
.stickybottom .download{font-size: 0.9em; line-height:3em; background-color: #C5E4EC; box-sizing: border-box; float: none; display: inline-block; color: #1A1919; padding: 0 1em; margin: 0; width: 100%; text-align: center}
.stickyon .stickybottom{transform:translateY(0); transition: transform 0.3s ease;}
.stickybottom .giftcardbtn2{background-color: #F4E8DE; color: inherit;}

.stickybottom .flexy{text-align: center;}
.stickybottom .flexy .outer{width: 50%; position: relative; float: left; padding: 0 0.5em; box-sizing: border-box;}


.giftcardbtn{color: #fff!important; background-color: #1A1919; padding: 0 3em; font-size: 0.9em; display: inline-block; font-family: 'MBB', Arial, Helvetica; text-decoration: none; cursor: pointer; line-height: 2.9em; text-transform: uppercase; letter-spacing: 0.23em; border-bottom: 0!important; margin: 1em 0 1em;}

.close {
  position: absolute;
  right: 2.6em;
  top: 2.6em;
  width: 1em;
  height: 1em;
}

@media screen and (min-width: 700px) {
  
  .stickybar .logodesktop{left: 50%; transform: translate(-50%);}
  .stickybar .download{padding: 0 3em; font-size: 0.9em; top:0.05em;}
  .block5050compact2 + .block5050compact{margin-top: 4em!important;}
}

@media screen and (min-width: 1000px) {

  .generalinfo{width: 60em;}
  .generalinfo h1{text-align: center;}
  .generalinfo .b50{width: 50%; padding-left: 3em;  margin-right: 0;  box-sizing: border-box;}

}

@media screen and (min-width: 1200px) {
  .logofounders{max-width: 16em; height: 11.4em;}
  ul.submenu{position: absolute; width: 12em; left:-16em; top:0.5em; height: auto; line-height: auto; padding: 0; }
  ul.submenu li {position: relative; float: left; clear: both; width: 100%; height: auto; padding: 0.7em 0;  border-bottom: 1px solid #eee;}
  ul.submenu li:last-child{border: none;}
  ul.submenu li a{ width: 100%; padding:0; line-height: 1.6em; padding:0.5em 0; min-height: 1.6em;}
 
  .giftcard h2{margin-top: 0em;}

}


@media screen and (min-width: 1350px) {

  body{font-size: 16px;}
  
}

@media screen and (min-width: 1450px) {
  .topmenu{font-size: 19px;}
  body{font-size: 17px;}

}

@media screen and (min-width: 1600px) {

  body{font-size: 18px;}

}

@media screen and (min-width: 2100px) {
.topmenu{font-size: 20px;}
  body{font-size: 20px;}

}

@media screen and (max-width: 1124px) {

  body{font-size: 14px;}
  .stickybar{display: block;}
  .holidaybtn{ top:5.5em; left:-4.8em;}
  .opeee .holidaycard{padding-top: 14em;}
  .allfarm .farm3 p{width: calc(100% - 2em); margin-bottom: 2em;}
  .breakie{position: absolute;left: 50%; top: 2em; margin-left: -8em; width: 16em; height: 10em;  background-image: url('../img/elements/breakie2.png'); }
  .kaart .downloads{padding-top: 3.5em;}
  .topmenu{display: none;}
  .zeshoek{ left:9em;  font-size: 0.9em; }

}

@media screen and (max-width: 952px) {

  .team{width: 90%; padding: 0 5%;}
  .newsletter{font-size: 0.9em;}
  .blockphoto .fullphoto img{max-height: 70vw; object-fit: cover;}  
  .giftcardbtnheader{display: none;}
}

@media screen and (max-width: 850px) {


  .block50{width: 100%;} 
  .block50 .block50{width: 50%;} 
  .holifoto{display: none;}
  .rij1 section:first-child{ width: 70%;}
  .rij1 section:last-child{width: 30%;}
  .rij1 section:first-child { margin-top: 0%;}
  .rij2 section{float: left;}
  .rij2 section:first-child{ width: 30%; }
  .rij2 section:last-child{width: 70%; padding-left: 2.8%;padding-right: 0;}
  .videoall{display: none;}
  .notlogged .openingsoon span{font-size: 4em;}
  .allfarm .farm2{display: none;}
  .allfarm .farm1{width: 50%; padding-right: 1em;}
  .allfarm .farm3{width: 50%; padding-left: 1em;}
  .promos .b33{width: 100%;margin-bottom: 1em;}
  .foundersbarblock .thumb{padding-bottom: 80%;}
  .stickybar .topmenu2{display: none;}
  .stickybar{min-height: 4em;}
  .pusher{height: 4em;}

  .stickybar .makeres{display:none;}
  .stickybottom{display: block;}
  .stickyon .bottombalk .foundersbarlogo{transform: translateY(-4.5em);}
  .stickybar .languages{top:0.6em; left: auto; right: 0em;}
  .stickybar .languages ul{left: auto; right: -0.1em;}
}

@media screen and (max-width: 810px) {
  /*.header1 header{ position: relative; z-index: 10; background-image: url("../img/header2020/header1_m.jpg");}*/
  
  .backcontainer a{display: none;}
  .breed{width: 90%; padding: 0 5%;}
  .intro .breed {margin: 8em auto 5.5em !important;}
  .holidaybtn{ top:0em; left:50%; margin-left: -5.2em; font-size: 0.7em; }
  .holidaybtn{ position: absolute; top:3.4em; left:50%; margin-left: -5.2em;  font-size: 0.7em; }
  .rij1{margin-top: 2em;}
  .opeee .holidaybtn{top:5em; -webkit-transition: top 0.3s ease; transition: top 0.3s ease;}
  .footersocial{height:auto; text-align: center;}
  .footerright{position:relative; float: left; width: 100%; height: 4em; line-height: 4em; margin-top: -2em; margin-bottom: 3em; text-align: center;}
  .footerleft{position:relative; width: 100%; height: auto; line-height: 1.2em; margin-top: 1em;}
  .footerright a, .footerleft a{float: none; display: inline-block; line-height: 3em!important;}
  .footerright a img {
    position: relative;
    float: left;
    width: 0.8em;
    margin-top: 1.05em;}
  footer .harry-beeldmerk_harry {position: relative; float: none; left:auto; top:auto; margin:1em auto 0; top:1em;}
 
 
  .giftcard *, .giftcard, .teamcard *{text-align: center!important;}
  .giftcard a{float: none;}
  .opee .teamcard{height: 68em;}
  footer{padding: 4% 5%;}
  .privatedining{padding-bottom: 5em;}

}

@media screen and (max-width: 700px) {

  .intro h2{font-size: 1.4em;}
  .block75{width: 100%; padding-right: 0;}
  .weg{display: none;}

   p{font-size: 1em;}
   .flex {
    display: block;
  }

  .flex .b50 {
    min-height: 0;
  }
  .flex .b50{ width: 100%; padding: 0; margin: 0;}
  
  .flex .cover {min-height: 100vw!important;}
  .flexchild {
    min-height: 20em!important;
    width: 100%;
    float: left;
  }

  .flex .b50 article {
    top: auto;
    transform: translateY(0);
  }

  .formitable .b50 {
    width: 100%;
    margin:0;
  }
  
  .formitable .b50:nth-child(2){min-height: 80vw;}
  .generalinfo .b50{width: 100%; margin: 0;}
  .opeee .holidaycard{height: 65em;}
  .opeee .holidaybtn{-webkit-transition: top 0.3s ease; transition: top 0.3s ease;}
  .intro .breed {margin: 8em auto 5.5em !important;}
  .privatedining .b100{width: 100%; margin-left: 0;}
  .menus .column{width: 100%;}
  .basicpage .b100, .basicpage .block, .basicpage .b50{margin-bottom: 0; position: relative; float: left; display: block; width: 100%;}
 
  .basicpage .blocktexttext .b50:first-child article{padding-bottom: 0;}
  .basicpage .blocktexttext .b50{background: none!important;}
  .pusher2{display: none;}
  .kaart .breed{width: 100%; box-sizing:border-box; padding: 0 1.3em;}
  ul.submenu li{float: none; display: inline-block; white-space: nowrap; padding: 0em 1.3em;}
  ul.submenu li a{font-size: 1em;}
   ul.submenu  { 
    position: relative; float: left;
    white-space: nowrap; margin-bottom: 1em; width: calc(100% + 2.6em); left: -1.3em;
    margin-bottom: 3em;
    overflow-y:hidden;
    overflow-x:scroll;
    border: 1px solid #1A1112;
    
  border-left: none;
  border-right: none;
  }

  .scroll::-webkit-scrollbar {
    display: none;
 }
  .scroll {
    white-space: nowrap; 
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch; 
    -ms-overflow-style: -ms-autohiding-scrollbar; 
  }
  .blockphoto .fullphoto img{max-height: 90vw; height: 90vw; object-fit: cover;} 
  .block5050compact .flex .b50 .innerbinner{margin-left: 0em;}
  .block5050compact .viceversa .b50 .innerbinner{margin-left: 0em;}
  .block5050compact .coverslider{max-height: none; margin-left: 0em;}
  .block5050compact .viceversa .coverslider{margin-left: 0em;}
  .block5050compact{margin: 0em 0 0em!important;}
  .block5050compact .coverslider img{ max-height: 130vw;}
  .block5050compact2 .coverslider img{ max-height: 130vw;}
  .block5050compact2 {padding: 0em 0;}
  .block5050compact2{margin-bottom: 0!important;}
  .aboutustekst p { font-size: 1em; line-height:1.6em;}
  .basicpage .blockintro p{font-size: 0.9em; line-height: 2.1em;}
  .giftcard{margin-bottom: 0;}
  .zeshoek{left:4em; top:4em; font-size: 0.9em;}
  .ope .zeshoek{opacity: 0; transition: opacity 0.5s ease;}
  .nomobile{display: none!important;}
  .allfarm .farm3{text-align: center;}
  .blockphoto + .block5050compact2{padding-top:6em;}
}

@media screen and (max-width: 600px) {
 
  .intro h2{font-size: 1.2em;}

  ul.submenu li a { padding: 0 0.7em;}

  .zeshoekharry{margin-top:0em;}
  .rij1 section:first-child{ width: 100%; padding-right: 0}
  .rij1 section:last-child{display: none;}
  .rij2 section:first-child{ display: none; }
  .rij2 section:last-child{width: 100%; padding-left: 0;}
  .reserve p a:last-child{display: none!important;}
  .holidaycard *{text-align: center!important;}
  .b50{width: 100%; margin:0 0 2em;}
 
  .newsletter{top: 0em; font-size: 0.7em;   transform:rotate(0) translateX(50%); right: 50%; border-width: 0px 1px 1px 1px;}  
  .newslettersignup {width: 100%; padding: 0 2em; box-sizing:border-box;}
  .topper .hamburger{display: block; }
  .foundersbarblock .thumb{padding-bottom: 120%;}
   .logofounders{max-width: 14em; height: 10.6em;}
   .talen{top: 1.5em; right: 0.8em;}
  .topper .hamburger{top: 1.3em; left: 1.3em;}
    .stickybar .logodesktop{display: none;}
  .stickybar .logomobile{display: block;}
  .stickybar{padding: 0.7em 1.3em;}
  .inner{padding: 1.6em 1.3em;}
  .basicpage article{padding: 5em 2em;}
  .bottombalk .foundersbarlogo{position: absolute; right: -0em; width:5em; border: 0; pointer-events: auto;}
  .languages{top:1.35em; right:0.8em;}
}
@media screen and (max-width: 530px){
  
  .menus .dish, .menus .price{font-size: 0.9em;}
  .acolades{text-align: center;}
  .block50 .block50{width: 100%;position: relative; float: left; text-align: center; margin-bottom: 4em;}
  .block50 .block50 *{text-align: center;}
  .footer .block50 p{text-align: center; width: 100%; position: relative; float: left;}
  .footer .download{float: none!important; display: inline-block; margin:0px auto 3em;}
  .menus .descrip{display: none;}
  .theteam h3, .generalinfo h3, .privatedining .b100 h3, h3, h2, h1{font-size: 2.4em;}

  .allfarm .farm1{width: 100%; padding-right: 0em; padding-bottom: 2em;}
  .allfarm .farm3{width: 100%; padding-left: 0em;}
  .allfarm .farm3 p{width: 100%; padding: 0 2em; box-sizing:border-box;}
  .thefarm{padding-bottom: 0;}
  .bestelbutton1, .bestelbutton2{max-width: 14em;}
  .team { width: 100%; padding: 0;}
  
  .stickybar .download{letter-spacing: 0.1em; padding: 0 1.3em; right: -0.7em; line-height: 2.7em;}
  .stickybar i::before {
  top: 0.03em;}
  .logo {font-size: 0.95em;}
  .mainmenu .foundersbarlogo{right: 1em;}

  .basicpage article h2{font-size: 2.4em; margin-bottom: 0.7em;}
   .topper .foundersbarlogo{font-size: 0.7em}
   .basicpage h1{ margin: 0.6em auto 0.6em; font-size:2.4em}
   .block5050compact .flex .b50 .innerbinner{padding: 5em 2em;}
   .block5050compact2 .flex .b50 .innerbinner{padding: 5em 2em;}
   #sub9{width: 18em; height: 6.5em; }
}

@media screen and (max-width: 430px){

  .foundersbarblock p{max-width: 18em; float: none; display: inline-block;}
   .foundersbarblock .thumb { padding-bottom: 130%;}
}

@media screen and (min-width:1000px) and (max-height: 600px){

  .mainmenu ul{font-size: 0.9em; margin-top:2em; }
  .mainmenu ul a{margin: 0.4em 0}

}

@media screen and (min-width:1000px) and (max-height: 550px){

  .mainmenu ul a{margin: 0.3em 0}

}

@media screen and (max-width:1000px) and (max-height: 520px){
  .mainmenu ul{font-size: 0.9em; margin-top:2em; }
  .mainmenu ul a{margin: 0.3em 0}

}