:root {
    --color-primary: 161 98 56;
    --color-secondary: 222 169 32;
}

html {
    font-size: 18px;
    font-weight: 400;
}

body {
    font-family: freight-sans-pro;
}

h1, h2, h3, h4, h5 {
    font-family: merriweather;
    font-weight: 300;
}

.font-serif {
    font-family: merriweather;
}

.font-body {
    font-family: freight-sans-pro;
}

.cta-button,
.btn.btn-cta {
    background-color: #a16238;
}

.cta-popup {
    background-color: rgb(161 98 56 / 90%);
}

/**
 * Header 
 */
header#header {
    background-color: #ffffff;
}

.menu-wrapper .menu li a {
    color: #565656;
}

.menu-wrapper .menu li a:hover {
    color: #a16238;
}

.scrolling-header {
    background-color: #ffffff;
}

.menu-toggle svg {
    fill: #565656;
}

/**
 * Footer 
 */
footer#footer,
.website-by * {
    background-color: #2c6172;
    color: #ffffff;
}

.footer-right {
    border-color: #ffffff;
}

footer #phone-square-svg {
    fill: #ffffff;
}

footer #phone-square-svg #phone-square-outer-border {
    stroke: #ffffff;
}

.mobile-menu { 
    background-color: #2c6172;
    color: #ffffff;
}

.mobile-menu-left {
    border-color: #ffffff;
}

ul.mobile-menu li a {
    color: #ffffff;
}

ul.mobile-menu li a:hover,
.mobile-menu ul.social-media-links li a:hover {
    color: #473e54;
}