body {
    font-family: 'henriette-compressed', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height:125%;
    background-color: #9ec6cc;
}




main > .container {
    margin-top: 50px;
    padding: 3rem 1rem 2rem 1rem;
}

.footer {
    font-size: small;
}

.footer > .container {
    padding-right: 15px;
    padding-left: 15px;
}

/* Typographie - ACHTUNG: Im Head die richtige Verlinkung zu Stylesheet setzen */

h1 {
    font-family: 'obviously-narrow', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 2.682em;
    line-height: 120%;
    /* or 71px */
    text-align: center;
    font-feature-settings: 'pnum' on, 'onum' on;
    padding-top:50px;
    padding-bottom:75px;
}

h2 { 
    font-size: 2.455em;
    font-weight: bold;
    display: flex;
    align-items: flex-end;
    font-feature-settings: 'pnum' on, 'onum' on, 'salt' on;
    padding-bottom:75px;
}


h2_a { 
    font-size: 2.455em;
    font-weight: bold;
    display: flex;
    align-items: flex-end;
    font-feature-settings: 'pnum' on, 'onum' on, 'salt' on;
    padding-bottom:75px;
        text-decoration-line: underline;
    font-feature-settings: 'pnum' on, 'onum' on;

    /* terracotta */
    color: #C05C46;
}


h3 { 
    font-size: 1.545em;
    font-weight: 700;
    line-height: 120%;
    display: flex;
    align-items: flex-end;
    font-feature-settings: 'pnum' on, 'onum' on, 'salt' on;
}


h3_a { 
    font-size: 1.545em;
    font-weight: 700;
    line-height: 120%;
    display: flex;
    align-items: flex-end;
    letter-spacing: 0.005em;
    text-decoration-line: underline;
    font-feature-settings: 'pnum' on, 'onum' on;

    /* terracotta */
    color: #C05C46;
}



h4 { 
    font-family: obviously-narrow, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 0.955em;
    line-height: 145%;
    /* or 30px */
    letter-spacing: 0.02em;
    font-feature-settings: 'pnum' on, 'onum' on;
}


h5 { 
    font-family: henriette-compressed, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 1em;
    line-height: 125%;

    /* identical to box height, or 27px */
    letter-spacing: 0.005em;
    font-feature-settings: 'pnum' on, 'onum' on;
}

h6 { 
    font-family: obviously-narrow, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 0.955em;
    line-height: 145%;
    /* or 30px */
    letter-spacing: 0.02em;
    font-feature-settings: 'pnum' on, 'onum' on;
}

navi {
    font-family: questa-sans, sans-serif;
font-style: normal;
font-weight: 700;
font-size: 0.773em;
line-height: 120%;

/* or 20px */
letter-spacing: 0.1em;
text-transform: uppercase;
text-decoration-line: none !important;
font-feature-settings: 'pnum' on, 'onum' on;

/* black */
color: #0B0B0B;
}

vortext {
font-family: henriette, sans-serif;
font-style: italic;
font-weight: normal;
font-size: 1.545em;
line-height: 119%;

/* or 40px */
text-align: center;
font-feature-settings: 'pnum' on, 'onum' on;

color: #000000;
    padding-bottom:151px;


    
}

a {
font-family: henriette, sans-serif;
    font-style: italic;
font-weight: bold;
font-size: 1em;
line-height: 125%;

/* identical to box height, or 27px */
letter-spacing: 0.005em;
text-decoration-line: underline;
font-feature-settings: 'pnum' on, 'onum' on;

/* terracotta */
color: #C05C46;
}

hr {
    background: #333; 
    border: none; 
    color: #333; 
    height: 1px; 
    width: 100%;
    margin-bottom:20px;
    margin-top:150px;
}

zutaten {
    font-family: obviously-narrow, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.682em;
    line-height: 145%;

    /* or 30px */
    letter-spacing: 0.02em;
    font-feature-settings: 'pnum' on, 'onum' on;
}

footer {
    font-family: Henriette;
font-style: normal;
font-size: .773em;
line-height: 134%;

/* or 23px */
letter-spacing: 0.01em;
font-feature-settings: 'pnum' on, 'onum' on;

/* black */
color: #000000;
}


/* ELemente */



.linie {
    border-bottom: black 1px solid; 
    margin-bottom:20px;
    margin-left:20px;
    margin-top:25px;
}

.zutaten {
    /*max-width:250px;
    padding-right:30px;*/
    list-style:dots small;
    font-family: obviously-narrow, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.955;
    line-height: 145%;

    /* or 30px */
    letter-spacing: 0.02em;
    font-feature-settings: 'pnum' on, 'onum' on;
}

.zubereitung {
    max-width:600px;
    letter-spacing: 0.02em;
    font-family: henriette, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1;
    line-height: 1.25em;

    /* or 30px */
    letter-spacing: 0.02em;
    font-feature-settings: 'pnum' on, 'onum' on;
}



.table { 
   display: table;
   border-spacing: 0.5em;
}
.table-row {display: table-row; }
.table-cell {display: table-cell; }


/* Slider */
@media (max-width: 575px)
{.slick-slide img 
{
    max-width: 300px;
}
    
.slick-slide {
    opacity: .4;
}

.slick-current {
    opacity:1;
}
    
    
}


    /* Masonry */

* { box-sizing: border-box; }

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

.grid-sizer,
.grid-item {
  width: 33.333%;
    padding:10px;
}
@media (max-width: 575px) {
  .grid-sizer,
  .grid-item {
    width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .grid-sizer,
  .grid-item {
    width: 50%;
  }
}

/* To change the amount of columns on larger devices, uncomment the code below */

 @media (min-width: 768px) and (max-width: 991px) {
  .grid-sizer,
  .grid-item {
    width: 33.333%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .grid-sizer,
  .grid-item {
    width: 25%;
  }
}
@media (min-width: 1200px) {
  .grid-sizer,
  .grid-item {
    width: 25%;
  }
} 

.grid-item {
  float: left;
}

.grid-item img {
  display: block;
  max-width: 100%;
}