/*
* Theme Name: Food Forest
* Template: ousia
* Author: Lasse Jellum
* Author URI: https://foodforest.no
* Version: 1.0.2
*/

@font-face {
    font-family: 'Amatica SC';
    font-style: normal;
    font-weight: 400;
    src: url(https://foodforest.no/wp-content/themes/foodforest/fonts/amatica-sc.woff2) format('woff2');
}

@font-face {
    font-family: 'Alegreya';
    font-style: normal;
    font-weight: 400;
    src: url(https://foodforest.no/wp-content/themes/foodforest/fonts/alegreya.woff) format('woff2');
}

body {
    --header-height: 4em;
    --max-width: calc(var(--font-size)*33);
    --text-color: #000;
    --link-color: #dd9933;
    --accent-color: #758d2d;
    --bg-color: #fff;
    --shadow-color: rgba(0, 0, 0, 0.1);
    font-family: Alegreya;
}

main a,
.product a {
    color: var(--link-color);
}

h1,
h2,
h3,
h4,
h5,
#menu a {
    font-family: Amatica SC;
}

h1 {
    font-size: 2.5em;
}

#menu-main-menu {
    font-size: 1.3em;
}

.border-1 {
    border: 8px dotted rgb(198, 155, 110);
    padding: 1.5em;
}

.border-2 {
    border: 8px dotted #695c41;
    padding: 1.5em;
}

.border-3 {
    border: 8px dotted #d08f44;
    padding: 1.5em;
}

.border-4 {
    border: 8px dotted #a92c24;
    padding: 1.5em;
}

@media (min-width: 768px) and (max-width: 2000px) {
    .alignwide .border-1,
    .alignwide .border-2,
    .alignwide .border-3,
    .alignwide .border-4 {
        margin-left: 1em;
    }
}

#header>div .logo {
    height: 85%;
}

#header svg {
    width: 1.5em;
    height: max-height: 85%;
}

.wc-block-grid__products .wc-block-grid__product-image img {
    height: auto;
}

@media (max-width: 707px) {
    .wp-block-cover {
        margin-left: 0;
        margin-right: 0;
    }
}

@media (max-width: 768px) {

    nav#menu {
        flex-direction: row-reverse;
    }

    #menu > a {
        margin-right: 1em;
    }
}

.wp-block-cover {
    margin-bottom: 1.75em;
}

.no-margin {
    margin: 0;
}


.references {
    font-size: 0.5em;
    color: grey;
    border: 3px dotted gray;
    padding: 3em 6em 3em 2em;
    line-height: 1.2em
}

.references h2 {
    padding-left: 1em;
}

.wp-block-columns,
.wp-block-cover,
article>.wp-block-group {
    margin-bottom: 3em;
    margin-top: 2em;
}

#header nav#menu>div a {
    text-transform: uppercase;
}
/*
@media (min-width: 768px) {
    .hero {
        max-width: 23em;
        margin: 0 auto;
        min-width: unset;
    }
}*/

.none {
    display: none;
}

.size-woocommerce_thumbnail {
    max-width: 100%;
    height: auto;
}


