:root {
    --color-primary: 51 63 76;
    --color-secondary: 203 160 88;
}

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

body {
    font-family: Work Sans;
}

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

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

.font-body {
    font-family: Work Sans;
}

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

.cta-popup {
    background-color: rgb(203 160 88 / 90%);
}

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

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

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

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

.menu-toggle svg {
    fill: #333f4c;
}

/**
 * Footer 
 */
footer#footer,
.website-by * {
    background-color: #cba058;
    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: #cba058;
    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: #333f4c;
}