* ── LIVE WELL SURREY — Custom CSS for Squarespace ── */ /* Colour Variables */ :root { --cream: #F7F3EE; --sage: #8A9E8C; --sage-dark: #5C7260; --terracotta: #C4896A; --gold: #B8986A; --deep: #2C2C2A; --mid: #6B6560; } /* Background */ body, .site-wrapper { background-color: #F7F3EE !important; } /* Headings */ h1, h2, h3, h4 { color: #2C2C2A !important; font-weight: 300 !important; } /* Body text */ p, li, blockquote { color: #6B6560 !important; } /* Links */ a { color: #5C7260 !important; } a:hover { color: #C4896A !important; } /* Buttons — primary */ .sqs-block-button-element--medium, .sqs-block-button-element--large { background-color: #5C7260 !important; border-color: #5C7260 !important; color: #F7F3EE !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; border-radius: 0 !important; } .sqs-block-button-element--medium:hover, .sqs-block-button-element--large:hover { background-color: #2C2C2A !important; border-color: #2C2C2A !important; } /* Navigation */ .header-nav a, .Header-nav a { color: #6B6560 !important; letter-spacing: 0.15em !important; text-transform: uppercase !important; font-size: 0.78rem !important; } .header-nav a:hover, .Header-nav a:hover { color: #5C7260 !important; } /* Nav background */ .header-inner, .Header-inner { background-color: rgba(247,243,238,0.96) !important; } /* Section backgrounds — alternating */ .page-section:nth-child(even) { background-color: #FDFAF6 !important; } /* Horizontal rules / dividers */ hr { border-color: #B8986A !important; opacity: 0.4; } /* Blockquotes / testimonials */ blockquote { border-left: 3px solid #B8986A !important; font-style: italic !important; color: #6B6560 !important; } /* Form fields */ input, textarea, select { border-color: #C4D1C5 !important; background-color: #FDFAF6 !important; color: #2C2C2A !important; } input:focus, textarea:focus { border-color: #5C7260 !important; outline: none !important; } /* Footer */ .footer-inner, .site-footer { background-color: #2C2C2A !important; color: rgba(247,243,238,0.6) !important; } .footer-inner a, .site-footer a { color: rgba(247,243,238,0.6) !important; } .footer-inner a:hover, .site-footer a:hover { color: #F7F3EE !important; }