/*
Theme Name: Aime theme 1.1
Description: Thema voor Snack Aimé
Author: ZZ
Text Domain: zz
*/


/*
Theme colors:
#013E2F = donkergroen
#CC9356 = kraft bruin
#BFD730 = lichtgroen
#CDAAD3 = lila
#F1EBDC = zachtgrijs
*/


/* --------------------------------------------------------
   0. RESET
   -------------------------------------------------------- */

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
 	margin: 0;
 	padding: 0;
 	border: 0;
 	font-size: 100%;
 	font-weight: 500;
 	vertical-align: baseline;
 	background: transparent;
}

article, aside, details, figcaption, figure, footer, header,
main, menu, nav, section, summary {display: block;}

* {
 	box-sizing: border-box;
 	-moz-box-sizing: border-box;
 	-webkit-box-sizing: border-box;
}

/* Responsive images and other embedded objects.
   Note:'img' will cause problems with foreground images, i.e. sprites.
   If so, replace it with .responsive for each responsive image.
   */
img,
object,
embed {
 	max-width: 100%;
 	height: auto;
}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; outline:none;}

ol, ul {list-style:none; margin: 0;}
li > ul, li > ol { margin-bottom: 0; margin-left: 0em; }


blockquote:before, blockquote:after {content:""; content: none;}
del {text-decoration: line-through;}
abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

table {border-collapse:collapse; border-spacing:0; font-size: inherit; font: 100%;}
th, td {font-weight: normal; vertical-align: bottom; padding: 0;}
td {font-weight: normal; vertical-align: top;}
td, td img {vertical-align: top;}
/* Prevent sup and sub mess up line-height: http://gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}



input, textarea { -webkit-font-smoothing: antialiased; }
input, select {vertical-align: middle;}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom;}
.ie7 input[type="checkbox"] {vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

input[type="search"] {-webkit-appearance: textfield; box-sizing: content-box;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
 	-webkit-appearance: none;}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
   display: none;
}

pre {overflow: auto;}
/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {padding: 0; margin: 0; border: 0;}
/* make buttons play nice in IE */
button,
input[type=button] {width: auto; overflow: visible;}

img {border: 0;}
svg:not(:root) {overflow: hidden;}
/* prevent browser adding extra margin */
figure {line-height: 0;}

audio, canvas, progress, video {display: inline-block; vertical-align: baseline;}
audio:not([controls]) {display: none; height: 0;}

fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}


/* clearfix */
.clear:after {clear: both;}
.clear:before, .clear:after {content: ""; display: table;}


html {
  scroll-behavior: smooth;
}



/* --------------------------------------------------------
   0. BASICS
   -------------------------------------------------------- */

@font-face {
    font-family:'font-sans';
     src: url("_fonts/PlusJakartaSans-Medium.woff2") format('woff2');
     font-weight: normal;
     font-style: normal;
 }

 @font-face {
    font-family:'font-sans-bold';
     src: url("_fonts/PlusJakartaSans-Bold.woff2") format('woff2');
     font-weight: normal;
     font-style: normal;
 }

 @font-face {
  font-family:'Pramukh';
   src: url("_fonts/PramukhRounded-Extrabold.woff2") format('woff2');
   font-weight: normal;
   font-style: normal;
}

@font-face {
  font-family:'Pramukh-Reg';
   src: url("_fonts/PramukhRounded-Regular.woff2") format('woff2');
   font-weight: normal;
   font-style: normal;
}


body, button, input, select, textarea {
	margin: 0;
	padding: 0;
	border: none;
	color: #013E2F;
	background: #ffffff;
	font-family: 'font-sans', ui-sans-serif, -apple-system, BlinkMacSystemFont, Roboto, Helvetica, sans-serif;
	font-size: 15px;
  line-height:1.5em;  /* 27px */
  -webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}
@media only screen and (min-width: 500px) { body, button, input, select, textarea {font-size: 16px;} }
@media only screen and (min-width: 900px) { body, button, input, select, textarea {font-size: 20px;} }

/* Footer sticks to bottom of page */
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: #fff;

}



/* Colors
 * -------------------------------------------------------- */

.bg-donkergroen {background-color: #013E2F;}
.bg-kraft       {background-color: #CC9356;}
.bg-lichtgroen  {background-color: #BFD730;}
.bg-lila        {background-color: #CDAAD3;}
.bg-grijs  {background-color: #F1EBDC;}

.color-donkergroen {color: #013E2F;}
.color-kraft       {color: #CC9356;}
.color-lichtgroen  {color: #BFD730;}
.color-lila        {color: #CDAAD3;}
.color-grijs  {color: #F1EBDC;}

/* Gutenberg */
.has-donkergroen-color  {color: #013E2F;}
.has-kraft-color        {color: #CC9356;}
.has-lichtgroen-color   {color: #BFD730;}
.has-lila-color         {color: #CDAAD3;}
.has-grijs-color        {color: #F1EBDC;}

.has-donkergroen-background-color  {background-color: #013E2F!important;;}
.has-kraft-background-color        {background-color: #CC9356!important;;}
.has-lichtgroen-background-color   {background-color: #BFD730!important;}
.has-lila-background-color         {background-color: #CDAAD3!important;;}
.has-grijs-background-color        {background-color: #F1EBDC!important;;}


.bg-gradient {
  width: 100%;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(240, 230, 220, 0.7) 100%);
}



/* Boxes
 * -------------------------------------------------------- */

.content-box {
  display: block;
	width: calc(100% - 3em);
  max-width: 1400px;
	margin-left: auto;
  margin-right: auto;
}
@media only screen and (min-width: 780px) {
  .content-box{width: calc(100% - 4em);}
}
@media only screen and (min-width: 1000px) {
  .content-box{width: calc(100% - 6em);}
}
@media only screen and (min-width: 1460px) {
  .content-box {width: 100%;}
}

.content-box.box-narrow,
.content-box .box-narrow {max-width: 650px;}

.content-box.box-medium,
.content-box .box-medium {max-width: 850px;}

.extra-wide {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}
.normal-wide {
  max-width: 1400px;
  width: calc(100% - 6em);
  margin-left: auto;
  margin-right: auto;
}


/* Grids
 * -------------------------------------------------------- */

.grid-four,
.grid-three,
.grid-two {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content:space-between;
  align-content: flex-start;
  column-gap: 2.6%;
}
.grid-col {
	width: 100%;
	margin-bottom: 2em;
}

@media only screen and (min-width: 680px) {
	.grid-four   .grid-col {width: 49%;}
	.grid-three  .grid-col {width: 48%;}
  .grid-two    .grid-col {width: 48.2%;}
}
@media only screen and (min-width: 800px) {
	.grid-four   .grid-col {width: 23%;}
  .grid-three  .grid-col {width: 31%;}
  .grid-three  .grid-col-twothird {width: 64%;}
}


/* --------------------------------------------------------
   0. TYPOGRAPHY
   -------------------------------------------------------- */

h2, h3, h4, h5, h6 {
  padding-bottom: 0.5em;
}
h1, h2, h3, h4 {font-family:'Pramukh';}

h1 {
  font-size: 3em;
  line-height: 0.85em;
  text-transform: uppercase;
  text-align: center;
}
@media only screen and (min-width: 450px) { h1 {font-size: 4.5em;} }
@media only screen and (min-width: 800px) { h1 {font-size: 6.5em;} }
@media only screen and (min-width: 1200px) { h1 {font-size: 7.5em;} }

h2 {
  font-size: 2.5em;
  line-height: 1em;
}
@media only screen and (min-width: 500px) { h2 {font-size: 3em;} }
@media only screen and (min-width: 1000px) { h2 {font-size: 3.5em;} }

h3 {
  font-size: 2em;
  line-height: 1.2em;
}

h4 {
  font-size: 1.6em;
  line-height: 1.2em;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

h5,
h6 {
  font-family:'font-sans-bold';
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding-bottom: 0;
}

/*later*/
b, strong  {font-family: 'font-sans-bold'; font-weight:900;}
.font-bold {font-family: 'font-sans-bold'; font-weight:900;}
em         {font-family: 'font-sans-bold'; font-weight:900; }
.italic    {font-family: 'font-sans-bold'; font-style: italic;}

.font-reg  {font-family: 'font-sans'; font-weight: normal;}

small      {font-size: 80%;}
big        {font-size: 125%;}
p.mini     {font-size: 12px; line-height: 1.25em;}

.text-alignleft, has-text-align-left {text-align: left;}
.text-alignright, has-text-align-right {text-align: right;}
.text-aligncenter, has-text-align-center {text-align: center;}

dfn { font-family: 'font-sans', sans-serif; font-style:  italic;}
mark { background: #ffff71; color: #111;}

hr {
  display: block;
  height: 3px !important;
  border: 0;
  border-top: 1px solid #111;
  margin: 1em 0;
  padding: 0;
  box-sizing: content-box;
  width: 150px;
}


/* --------------------------------------------------------
   0. LINKS
   -------------------------------------------------------- */
a,
a:link,
a:visited {
  color: #013E2F;
  border-bottom: 1px solid #013E2F;
 	text-decoration: none;
  padding-bottom: 3px;
  transition: all .2s ease;
 }
a:hover   {
  color: #CC9356;
  border-bottom: 1px solid #CC9356;
  text-decoration: none;
  transition: all .2s ease;
 }
a:active  {
 	border-bottom: 1px solid #CC9356;
  text-decoration: none;
  transition: all .2s ease;
 }

 ::selection {
 	background: #F1EBDC;
 }



/* Screenreaders
 * -----------------------------
 * Meant for screen readers only
 * Makes 'skip to content' link invisible on regular screens */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}
/* Don't show outline on skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}



/* --------------------------------------------------------
   0. MAIN NAVIGATION
   -------------------------------------------------------- */



/* Site Header
 * -------------------------------------------------------- */

/* Header bar */
.site-header {
    display: block;
    margin: 1.2em auto 0;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-color: #fff;
    overflow: hidden;
    z-index: 10;
}

.site-header a {
  font-family: Pramukh-Reg;
  font-size: 1.8em;
  text-transform: capitalize;
  border-bottom: 0px;
  letter-spacing: 0.1px;
}

.header-cols {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
li.header-col:first-of-type {
  width: 200px;
}

.site-navigation.nav-desktop ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  column-gap: 16px;
}
.site-navigation.nav-desktop ul li {
  align-self: flex-end;
}


/* Logo */
a.site-title {
	display: block;
  font-size: 0px;
	padding: 0;
}

/* Slide-in */
#sidebarMenu {
  height: 100%;
  position: fixed;
  right: 0;
  width: 100%;
  margin-top: 0px;
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
  background: #013E2F;
  z-index: 10;
}
.sidebarMenuInner {
  margin:0;
  padding:0;
  border-top: 1px solid rgba(255, 255, 255, 0.10);
  padding-top: 5%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height:100vh;
}
.sidebarMenuInner li {
  list-style: none;
  color: #fff;
  font-size: 1.2em;
  padding: 6px;
  cursor: pointer;
  text-align: center;
}
.sidebarMenuInner li a {
  font-family: Pramukh-Reg;
  font-size: 1.5em;
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  border-bottom: 0px;
  transition: 0.3s ease;
}
.sidebarMenu a:hover,
.sidebarMenuInner li a:hover {
  color:#BFD730;
  transition: 0.3s ease;
}


/* Menu icon + animation */
input[type="checkbox"]:checked ~ #sidebarMenu {
    transform: translateX(0);
}

input[type=checkbox] {
    transition: all 0.3s;
    box-sizing: border-box;
    display: none;
}
.sidebarIconToggle {
    transition: all 0.3s;
    box-sizing: border-box;
    cursor: pointer;
    position: absolute;
    z-index: 99;
    height: 100%;
    width: 100%;
    top: 32px;
    right: 1em;
    height: 26px;
    width: 30px;
    position: fixed;
}
.spinner {
    transition: all 0.2s;
    box-sizing: border-box;
    position: absolute;
    height: 2px;
    width: 100%;
    background-color: #013E2F;
}
.horizontal {
    transition: all 0.2s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 6px;
}
.diagonal.part-1 {
    position: relative;
    transition: all 0.2s;
    box-sizing: border-box;
    float: left;
}
.diagonal.part-2 {
    transition: all 0.2s;
    box-sizing: border-box;
    position: relative;
    float: left;
    margin-top: 6px;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
    transition: all 0.2s;
    box-sizing: border-box;
    opacity: 0;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
    transition: all 0.2s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 7px;
    background-color: #BFD730;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
    transition: all 0.2s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -10px;
    background-color: #BFD730;
}

/* Navmenu logo */
.sidebarMenuInner .nav-logo {
  background-image: url("_img/aime-logo-wit.svg");
  display: inline-flex;
  width: 120px; height: 80px;
 	background-size: 120px auto;
  text-indent: -9999px;
	background-repeat: no-repeat;
  transition: 0.3s ease;
}

/* Navigation Submenu desktop */
.menu-item-has-children a {
  position: relative;
}

/*
.menu-item-has-children > a::after {
  font-family: font-sans ;
  font-size: 16px;
  content: ">";
  display: inline-block;
  transform: rotate(90deg);
  margin-left: 4px;
}
*/
.menu-item-has-children > ul {
  display: none !important;
}
.menu-item-has-children:hover > ul {
  display: block!important;
  position: absolute;
  top: 70px;
  background-color: #fff;
  padding: 24px 16px 8px 16px;
  margin-left: -16px;
  border-radius:  0 0 5px 5px;
}
.menu-item-has-children > ul .menu-item a {
  display: block;
  margin-bottom: 10px;
  background: #CC9356;
  color: #fff;
  padding: 7px 20px;
  border-radius: 50px;
  font-size: 1.6em;
  text-transform: capitalize;
  text-align: center;
}
.menu-item-has-children > ul .menu-item:first-child a {background: #013E2F;}

.menu-item-has-children > ul .menu-item a:hover,
.menu-item-has-children > ul .menu-item:first-child a:hover {background: #CDAAD3;}


/* Navmenu mobile */
.sidebarMenuInner .nav-logo {
    width: 150px; height: 75px;
 	  background-size: 150px auto;
    transition: 0.3s ease;
    margin-bottom: 2.5em;
  }
@media only screen and (max-width: 900px) {
  .sidebarMenuInner li {
    font-size: 1.5em;
    padding: 15px 6px;
  }
  .sidebarMenuInner li.bestel-mobiel {

    border: 2px solid #fff;
    background-color: #fff;
    padding: 12px 24px;
    border-radius: 50px;
    margin: 20px 0;
    font-size: 1.4em;
  }
  .sidebarMenuInner li.bestel-mobiel a{
    color: #013E2F;
  }
  .sidebarMenuInner li.bestel-mobiel:hover {
    background-color: #BFD730;
    border: 2px solid #BFD730;
    transition: 0.3s ease;
  }

}


/* Language switcher */
.wpml-ls-item {
  display: inline-flex;
}
.wpml-ls-item a {
  font-size: 20px;
  width: 24px;
  height: 26px;
  color:#013E2F;
  border: 1px solid #013E2F;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  padding-top: 2px;
  margin-left: -5px;
  margin-right: -5px;
}
.wpml-ls-item a:hover {
  color:#CC9356;
  border-color:#CC9356;
}
.wpml-ls-current-language,
.wpml-ls-current-language a,
.wpml-ls-current-language a span {
  color:#CC9356;
  border-color:#CC9356;
}
@media only screen and (max-width: 900px) {
  .sidebarMenuInner li.wpml-ls-item a {
    font-size: 24px;
    border: 0px;
  }
  .sidebarMenuInner li.wpml-ls-item a:hover {
    color: #013E2F;
    background: #fff;
  }
}

@media only screen and (min-width: 900px) {
  .site-navigation.nav-desktop ul li.wpml-ls-item {
    align-self: center;
  }
  #menu-item-wpml-ls-2-nl {margin-left:20px;}
}


/* Switch between desktop and mobile nav */
@media only screen and (min-width: 900px) {
  #sidebarMenu {display: none;}
  .sidebarIconToggle {display: none;}
  #sidebarMenu {height: 0%; width: 0%;}
  .nav-item-mobile {display: none;}
}
@media only screen and (max-width: 900px) {
  .nav-desktop {display: none;}
  .nav-item-desktop {display: none;}
}


/* Current item */
li.current-menu-item a,
.current-page-item a,
li.current-menu-item a:hover {
  color: #CC9356;
}


/* --------------------------------------------------------
   0. ELEMENTS
   -------------------------------------------------------- */

section.with-margin {
  margin-top: 4em;
  margin-bottom: 6em;
}

section.with-margin-top {margin-top: 4em;}


/* All images border-radius
 * -------------------------------------------------------- */
img {
  border-radius: 10px;
}


/* Labels - round seals on pages
 * -------------------------------------------------------- */
.label-one, .label-two, .label-three {
  background-image: url("_img/label-daily-green.svg");
  width: 122px; height: 120px;
 	background-size: 120px auto;
  background-repeat: no-repeat;
 }
.label-two    {background-image: url("_img/label-aime.svg");}
.label-three  {background-image: url("_img/label-local.svg");}

@media only screen and (max-width: 500px) {
  .label-one, .label-two, .label-three {
    width: 80px; height: 80px;
 	  background-size: 80px auto;
  }
}

.label-two {
  animation: animName 7s linear infinite;
}
@keyframes animName {
 0%{
    transform: rotate(0deg);
   }
100%{
    transform: rotate(360deg);
   }
}


/* Page intro with image
 * -------------------------------------------------------- */

#intro {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  margin-top: 20px;
  border-radius: 10px;
  max-height: 850px;
  overflow: hidden;
}

#intro img {
  align-self: flex-end;
  border-radius: 10px;
  z-index: 0;
  line-height: 0;
}

/* gradient over intro images */
#intro::after {
  content: "";
   position: absolute;
   top:0px;
   left: 0;
   width: 100%;
   height: 7%;
   background: linear-gradient(0deg, rgba(191, 215, 48, 0.0) 0%, rgba(191, 215, 48, 0.7) 100%);
   opacity: .7;
   z-index: 1;
   border-radius: 10px;
}

#intro h1 {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 100%;
  padding: 2em 0.5em 0;
  left: 50%; transform: translateX(-50%);
  z-index: 2;
  color: #fff;
  text-shadow: 3px 5px 5px rgba(0,0,0,0.6);
}

#intro .label-one {
  position: absolute;
  top: 30px;
  right: 2em;
  animation: animName 7s linear infinite;
  z-index: 3;
}
@media only screen and (max-width: 700px) {
  #intro .label-one {top: 12px; right: 12px; width: 90px; height: 89px; background-size: 90px auto;}
}

/* Page intro without image
 * -------------------------------------------------------- */

.top-gradient {
  display: flex;
  margin-top: 20px;
  margin-bottom: 2em;
  border-radius: 10px;
  height: 70px;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(240, 230, 220, 0.7) 100%);
}



/* Postgrid
 * -------------------------------------------------------- */

.postgrid li {
  position: relative;
  height: auto;
  margin-bottom: 2em;
}
@media only screen and (max-width: 600px) {
  .postgrid li {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3em;
  }
}
@media only screen and (min-width: 900px) {
  .postgrid li {margin-bottom: 4em;}
}

.postgrid li img {
  border-radius: 4px;
}

.postgrid a,
.postgrid a:hover,
.postgrid a img,
.postgrid a:hover img {
  transition: all 0.3s ease-out;
}
.postgrid a:hover {
  opacity: 0.7;
}
.postgrid a:hover img {
  filter: grayscale(100%);
}




/* Buttons
 * -------------------------------------------------------- */

a.btn,
.wp-block-button a,
a.wp-block-read-more {
  display: block;
  width: 200px!important;
  height: auto;
  padding: 6px 10px;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-family: Pramukh-Reg;
  font-size: 1.8em;
  text-align: center;
  font-weight: normal;
  line-height: 1.2em;
  text-decoration: none;
  color: #fff;
  background: #013E2F;
  border: 0px;
  border-radius: 50px;
}
a:hover.btn {
	background-color: #CDAAD3;
  border-bottom: 0px;
}



a.btn.btn-big {
  padding: 10px 10px;
  width: 240px!important;
  font-size: 2em;
}
a.btn.btn-big.btn-bedrijf {background: #CC9356;}
a:hover.btn.btn-big.btn-bedrijf {background-color: #CDAAD3;}

@media only screen and (min-width: 1000px) {
  a.btn {width: 280px!important;}
  a.btn.btn-big {width: 280px!important; font-size: 2em;}
}
@media only screen and (min-width: 1200px) {a.btn.btn-big {width: 350px!important; } }
@media only screen and (min-width: 1300px) {a.btn.btn-big {width: 400px!important; } }


/* Navmenu buttons Bestellen — add to WP > Menu > Menu-item
 * --------------------------- */
.nav-link-bestellen {
  padding: 10px;
  border: 1px solid #013E2F;
  border-radius: 40px;
}


/* Gutenberg buttons
 * --------------------------- */
.wp-block-button a:hover,
a:hover.wp-block-read-more {
  color: #fff;
  background-color: #CDAAD3;
  transition: all .2s;
}


/* Bestellingen buttons
 * --------------------------- */
.button-bestellen {
  width: 240px!important;
  height: auto;
  padding: 13px 10px;
  margin-bottom: 15px;
  font-family: Pramukh-Reg;
  font-size: 1em;
  text-align: center;
  font-weight: normal;
  line-height: 1.2em;
  text-decoration: none;
  color: #fff;
  background: #013E2F;
  border-radius: 50px;
}


/* Spacers
 * -------------------------------------------------------- */
.spacer,
.spacer-big {
  display: block;
}
.spacer     {height: 2em;}
.spacer-big {height: 4em;}

.no-margin {margin: 0 !important;}
.no-margin-top {margin-top: 0 !important;}
.no-margin-bottom {margin-bottom: 0 !important;}

.has-padding {padding-top: 6em; padding-bottom: 6em;}
.no-padding {padding: 0 !important;}


/* Call to action
 * -------------------------------------------------------- */
.call-out {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  width: 100%;
  padding: 5em 2em 6em;
  background-color: #FFFF71;
  border-radius: 4px;
}
.call-out h2 {
  margin-bottom: 0.25em;
}
.call-out p {
  max-width: 650px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.75em;
}
.call-out .btn {
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 900px) {
  .call-out p {max-width: 80%;}
}

/* Positioning
 * -------------------------------------------------------- */

.item-center {
  left: 50%;
  transform: translateX(-50%);
  position: relative;
}

/* Social icons
 * -------------------------------------------------------- */



/* Grid-box
 * -------------------------------------------------------- */






/* Site Header
 * -------------------------------------------------------- */

 .grid-header {
  display: flex;
	flex-direction: row;
  margin: 30px 0 30px;
}
.grid-header-col {width: 48%;}
.grid-header-col-center {width: 2%;}

@media only screen and (min-width: 500px) {
  .grid-header-col {calc(48% - 40px);}
  .grid-header-col-center {width: 60px;}
}

.grid-header a {
  border-bottom: 0;
}



/* Site Footer
 * -------------------------------------------------------- */


 footer {
  width: 100%;
  padding-top: 8em;
  padding-bottom: 2em;
 }

.labels-row {
  display: flex;
  justify-content: center;
  column-gap: 30px;
 }
 @media only screen and (min-width: 500px) {
  .labels-row {column-gap: 45px;}
 }

.footernav {
  display: flex;
  justify-content: center;
  font-size: 14px;

}
a.footernav  {border-bottom: 0;}

/* Logo
 * --------------------------- */

.logo {
	background-image: url("_img/aime-logo.svg");
  width: 130px; height: 65px;
 	background-size: 130px auto;
  text-indent: -9999px;
	background-repeat: no-repeat;
  margin: 0;
}

.logo.footer-logo {
  margin-left: auto;
  margin-right: auto;
}
 @media only screen and (min-width: 500px) {
  .logo.footer-logo {width: 180px;height: 95px; background-size: 180px auto;}
 }


/* Post navigation
 * -------------------------------------------------------- */

/* Post grid navigation
 * --------------------------- */


/* Single post navigation
 * --------------------------- */

 .postnav {
  display: flex;
  justify-content: center;

 }


/* --------------------------------------------------------
   0. PAGES
   -------------------------------------------------------- */




/* Homepage
 * -------------------------------------------------------- */



/* Page Info
 * -------------------------------------------------------- */
 .page-info img {
    border-radius: 3px;
 }

 /* Page Over Aimé
 * -------------------------------------------------------- */
 .pull-up img {
    display: block;
    margin-top: -15%;
    margin-bottom: 2em;
    border-radius: 10px;
}

/* Blog
 * -------------------------------------------------------- */

.page-blog #blog-intro,
.page-blog #blog-intro.blog-two  {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 20px;
  margin-bottom: 2em;
  border-radius: 10px;
  height: 300px;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(240, 230, 220, 0.7) 100%);
}
.page-blog #blog-intro h1,
.page-blog #blog-intro h4 {
  margin-bottom: 0;
}
.page-blog #blog-intro h4.about,
.single h4.about {
  display: flex;
  justify-content: center;
  font-family: Pramukh-Reg;
  text-transform: capitalize;
 }
.single h4.about {margin-bottom: 0.75em;}


/* Blog 2 layout with green box on top */
.page-blog #blog-intro.blog-two {background: #013E2F}
.page-blog #blog-intro.blog-two h1 {color: #fff;}
.page-blog #blog-intro.blog-two h4 {color: #BFD730;}


/* Blog post grid */
.news-post {
  width: 100%;
  max-width: 400px;
  height: auto;
  min-height: 300px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 3em;
  padding-top: 20px;
  background: #fff;
  border-radius: 10px;
  line-height: 0;
  box-shadow: 0 1px 5px rgba(2, 0, 36, 0.25);
}
.post-titel h3 {
  padding: 0 20px 20px 20px;
  line-height: 1em;
  height: 150px;
}
.news-post-img img {
  border-radius: 0 0 10px 10px;
  line-height: 0;
}



/* Captions inside image
 * --------------------------- */



/* Single
 * -------------------------------------------------------- */




/* Page Soon
 * -------------------------------------------------------- */


.page-soon #content {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(100vh - 160px);
}



/* --------------------------------------------------------
   0. GUTENBERG EDITOR STYLES
   -------------------------------------------------------- */

/* Fix for uneven spacing between stacked columns
 * --------------------------- */
.wp-block-columns {
  row-gap: 0 !important;
}


/* Gutenberg editor font sizes
 * see functions.php
 * --------------------------- */
p, p.has-normal-font-size {
  font-family: 'font-sans', Helvetica, Arial, sans-serif; font-size: 1em;}
p.big, p.has-big-font-size {
  font-size: 1.333em !important; line-height: 1.5em;} /*24px*/
p.small, p.has-small-font-size {
  font-size: 0.778em !important; line-height: 1.5em;} /*14px*/


p.has-large-font-size {
  font-size: 1.2em !important;
  line-height: 1.5em;
}
p.has-xlarge-font-size {
  font-size: 1.3em !important;
  line-height: 1.25em;
}
@media screen and (min-width: 600px) {
  p.small, p.has-small-font-size {font-size: 0.7em !important;}
  p.has-large-font-size   {font-size: 1.5em !important;}
  p.has-xlarge-font-size  {font-size: 2em !important;}
}

p.has-large-font-size + hr {
  margin-top: -5px;
}

p.intro {
  max-width: 750px;
}

h2.has-xlarge-font-size {
  font-size: 7.5em;
  text-transform: uppercase;
}
@media only screen and (max-width: 900px) { h2.has-xlarge-font-size {font-size: 5em;} }
@media only screen and (max-width: 500px) { h2.has-xlarge-font-size {font-size: 3.5em;} }

/* Gutenberg Colors
 * --------------------------- */
/* See: Colors */



/* Gutenberg editor styles
 * --------------------------- */
.content-box h1 {margin-bottom: 0.25em;}
.content-box h2,
.content-box h3,
.content-box h4 {padding-bottom: 0.25em;}
.content-box p  {padding: 0 0 1em 0;}


/* List style
 * --------------------------- */
.entry-content ul   {padding: 0 0 1em;}
.entry-content ol   {padding: 0 0 1em;}
.entry-content li   {padding: 0 0 0.25em;}

.entry-content ul li {
  list-style: disc;
  list-style-position: outslide;
}
.entry-content ol li {
  list-style: decimal;
  list-style-position: outslide;
}

.entry-content ul li .grid-box,
.entry-content ul li.type-case,
.entry-content ul li.type-post {
  list-style: none !important;
}


/* Images blocks
 * --------------------------- */
figure.wp-block-image,
.wp-block-image figure img {
  margin: 1em 0;
  border-radius: 10px;
}
@media screen and (min-width: 600px) {
  figure.wp-block-image,
  .wp-block-image figure img {margin: 1.5em 0;}
}

/* WP core override */
.wp-block-image .alignleft,
.wp-block-image .alignright {
  margin-top: 0 !important;
  margin-bottom: 0 !important
}

/* add class for round images */
/* and select Square in Gutenberg editor */
.img-rounded img {border-radius: 50% !important;}


/* Images captions
 * --------------------------- */
.thumbnail_caption,
figcaption {
  margin-top: 6px;
  margin-bottom: 10px;
  font-size: 0.875em;
  font-size: 12px;
  line-height: 1.33em;
  background: none;
}


/* Spacer block
 * --------------------------- */
@media screen and (max-width: 600px) {
  .wp-block-spacer {height: 40px !important;}
}

/* Separator block
 * --------------------------- */
.wp-block-separator {
  display: block;
  height: 1px;
  border: 0;
  border-top: 0px solid #111;
  margin: 1em 0;
  padding: 0;
  box-sizing: content-box;
}

/* Quote block
 * --------------------------- */
.wp-block-quote,
.wp-block-pullquote  {
  width: 90%;
  max-width: 1000px;
  padding-top: 3em;
  padding-bottom: 1.5em;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.wp-block-quote p,
.wp-block-pullquote p {
  font-family: Pramukh;
  font-size: 3em;
  line-height: 1em;
}
.wp-block-pullquote p {
  font-size: 2em;
  color: #CC9356;
  padding-bottom: 0.25em;
}
.wp-block-pullquote cite {
  font-family: Pramukh-Reg;
  font-style: normal;
  font-size: 1.5em;
}

@media screen and (min-width: 800px) {
  .wp-block-quote p {font-size: 3.5em;}
  .wp-block-pullquote p {font-size: 2.5em;}
}
@media screen and (min-width: 1200px) {
  .wp-block-quote p {font-size: 4em;}
  .wp-block-pullquote p {font-size: 3em;}
}




/* Extra classes in WP editor */

.column-smaller {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}


/* Extras
 * -------------------------------------------------------- */

/* Contact form / Happy Forms */
.happyforms-flex {
  padding-left: 1em;
  padding-right: 1em;
  font-family: Pramukh;
  text-transform: uppercase;
  color: #013E2F;
}

.happyforms-styles .happyforms-part__label .happyforms-optional,
.happyforms-styles .happyforms-part__label .label {
  font-size: 22px!important;
  letter-spacing: 0.06em;
  font-weight: normal;
}

.happyforms-form .option-label {
  font-family: font-sans;
  text-transform: none;
}
.happyforms-form .option-label .label {
  font-size: 13px!important;
  line-height:16px!important;
}

.happyforms-submit {
  font-family: Pramukh-Reg;
  font-size: 30px!important;
  padding: 6px 10px!important;
  width: 200px;
}
@media screen and (min-width: 800px) { .happyforms-submit {font-size: 32px!important;} }


/* Modula Gallery / homepage */
.modula-item {border-radius: 10px;}
.modula-item a {border-bottom:0px;}



/* Text_revolve - page Aimé */
.revolving-text {
  margin-top: 100px;
  font-size: 4em;
  line-height: 0.9em;
  text-transform: uppercase;
  color: #CC9356;
}
@media screen and (min-width: 800px) {.revolving-text {font-size: 6em;} }
@media screen and (min-width: 1000px) {.revolving-text {font-size: 8em;} }

#change {color: #013E2F;}