:root {
    --h1: 120px;
    --h2: 80px;
    --h3: ;
    --h4: ;
    --h5: ;
    --h6: ;
    --body: 20px;
    --font-16: 16px;
    --font-btn: 18px; 
    --orange: #DE693E;
    --brown: #5A5249;
    --darkbrown: #3E3932;

    --container-padding: 80px;
}

.merriweather {
  font-family: "Merriweather", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

/* TYPOGRAPHY */
body, html {
    background: #F7F5F4;
    font-family: "Merriweather", serif;
    font-size: var(--body);
    font-weight: 400;
    font-style: Regular;
    leading-trim: NONE;
    line-height: 150%;
    letter-spacing: 2%;
}
h1, .h1 {
    font-size: var(--h1);
    font-weight: 400;
    font-style: Regular;
    leading-trim: NONE;
    line-height: 113.99999999999999% !important;
    letter-spacing: 2%;
}
h2, .h2 {
    font-size: var(--h2);
    font-style: normal;
    font-weight: 400;
    line-height: 124% !important;
    /* or 99px */
    letter-spacing: 0.02em;

}
h3, .h3 {
    font-size: var(--h3);
    line-height: ;
}
h4, .h4 {
    font-size: var(--h4);
    line-height: ;
}
h5, .h5 {
    font-size: var(--h5);
    line-height: ;
}
h6, .h6 {
    font-size: var(--h6);
    line-height: ;
}
small {
    font-size: ;
    line-height: ;
}
.font-16 {
    font-weight: 400;
    font-style: Regular;
    font-size: var(--font-16);
    leading-trim: NONE;
    line-height: 100%;
    letter-spacing: 2%;
}

.elementor-button, .btn.btn-default {
    /* CTA-btns */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px calc(28px + 13px + 13px) 12px 28px;
    gap: 10px;

    background: var(--orange);
    border-radius: 4px;

    /* Button Text */

    font-style: normal;
    font-weight: 700;
    font-size: var(--font-btn);
    line-height: 114%;
    /* identical to box height, or 21px */
    letter-spacing: 0.02em;

    /* NTL 0 (White Txt) */
    color: #FFFFFF;
}
.elementor-button::before {
    content: '';
    background: url('data:image/svg+xml,<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.6276 5.80673C12.9809 6.16007 12.9809 6.73279 12.6276 7.08612L7.08591 12.6278C6.73258 12.9811 6.15985 12.9811 5.80652 12.6278L0.264856 7.08612C-0.0884758 6.73279 -0.0884757 6.16006 0.264856 5.80673C0.618187 5.4534 1.19091 5.4534 1.54425 5.80673L5.54146 9.80394L5.54146 0.904762C5.54146 0.405075 5.94653 -3.03621e-07 6.44622 -2.81779e-07C6.9459 -2.59937e-07 7.35098 0.405075 7.35098 0.904762L7.35098 9.80394L11.3482 5.80673L11.4167 5.74444C11.772 5.45456 12.2963 5.47547 12.6276 5.80673Z" fill="white"/></svg>') no-repeat center center;
    width: 13px;
    height: 13px;
    background-size: contain;
    position: absolute;
    right: 28px;
    top: 50%;
    transform: translateY(-50%);
}
p {
    margin-bottom: 1em;
}
p:last-child {
    margin-bottom: 0;
}
/* END TYPOGRAPHY */

/* LAYOUTS */
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    padding-left: var(--container-padding);
    padding-right: var(--container-padding);
}
 /* Improved Animations Stylesheet from https://element.how/elementor-improve-entrance-animations/ , works for the 'fade' animations */

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0px,100px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp
}

.animated {
    animation-duration: 1.5s;
}

/* END LAYOUTS */

/* HEADER */

.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    font-size: var(--font-16);
    color: var(--brown);
    padding: 8px 0;
    line-height: 1em;
}
.navbar {
    padding: 36px var(--container-padding);
}
.navbar-brand {
    padding: 0;
}
.navbar-nav {
    gap: 46px;
}
.nav-link {
    position: relative;
}
.nav-link::before {
    content: '';
    width: 100%;
    height: 2px;
    background: var(--brown);
    position: absolute;
    bottom: 0px;
    transform: translateY(6px);
    left: 0;
    opacity: 0;
    transition: all .3s ease;
}
.nav-link:hover::before {
    bottom: 0px;
    transform: translateY(3px);
    opacity: 1;
    transition: all .3s ease;
}

/* END HEADER */

/* CONTENT */



/* END CONTENT */

/* FOOTER */



/* END FOOTER */