/*--------------------------------------------------------------
# Defaults
--------------------------------------------------------------*/

* {
	box-sizing: border-box;
}

:root {
	--wp--custom--base-font-size: 18px;
}

html {
	font-size: var(--wp--custom--base-font-size);
}

body {
	font-family: var(--wp--custom--font-primary);
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 360px) {
	html {
		font-size: calc(var(--wp--custom--base-font-size) * 0.9);
	}
	
}

/*
 * text-underline-offset doesn't work in Chrome at all 👎
 * But looks nice in Safari/Firefox, so let's keep it and
 * maybe Chrome will support it soon.
 */
a {
	cursor: pointer;
	text-underline-offset: 3px;
	text-decoration-skip-ink: all;
}

a:hover {
	text-decoration-style: dotted;
	text-decoration-skip-ink: none;
}

/*
 * Gutenberg remotes this underline, but Twenty Twenty-One uses it. 
 */
.site-header h1.wp-block-site-title a:not(:hover):not(:focus):not(:active) {
	text-decoration: underline;
}

/*
 * Alignment styles.
 * These rules are temporary, and should not be relied on or 
 * modified too heavily by themes or plugins that build on 
 * Twenty Twenty-Two. These are meant to be a precursor to 
 * a global solution provided by the Block Editor. 
 * 
 * Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

.wp-site-blocks,
body > .is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.is-root-container .wp-block[data-align="full"] > .wp-block-group {
	padding-left: var(--wp--custom--spacing--outer);
	padding-right: var(--wp--custom--spacing--outer);
}

.wp-site-blocks .alignfull,
.is-root-container .wp-block[data-align="full"] {
	margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
	margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
	width: unset;
}

/* Blocks inside columns don't have negative margins. */
.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
.is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
/* We also want to avoid stacking negative margins. */
.wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
.is-root-container .wp-block[data-align="full"] > *:not(.wp-block-group) .wp-block[data-align="full"] {
	margin-left: auto !important;
	margin-right: auto !important;
	width: inherit;
}

body {
	--wp--style--block-gap: 0px;
}

.site-header .wp-block-drinkteaeatbiscuits-fixed-header {
	z-index: 99;
}


.navigation svg rect {
	transition: 0.25s ease;
}

.navigation .background--dark svg rect {
	fill: #fff;
}

.navigation .dark-behind svg rect {
	fill: #fff;
}

.navigation .background--light svg rect {
	fill: #000;
}

.navigation .light-behind svg rect {
	fill: #000;
}

.site-logo.dark-behind svg path,
.site-logo.background--dark svg path {
	fill: #fff;
}

.site-logo.light-behind svg path,
.site-logo.background--light svg path {
	fill: #000;
}

.wp-block-navigation a {
	font-size: inherit;
}

.wp-block-navigation .wp-block-navigation-item__content {
	padding: 8px 12px;
}

.site-footer a {
	font-size: inherit;
}

input.wpcf7-form-control.wpcf7-submit {
    border-radius: 4px;
    background-color: rgb(58, 170, 53);
    color: rgb(244, 244, 244);
    white-space: pre-wrap;
    min-width: 1px;
    border: 0;
    font-size: 1rem;
    font-family: "proxima-nova";
}