/* MINOCQUA */

:root {
	--brown:#c06f5b;
	--butter:#f8e8c2;
	--cloud:#e2e3e4;
	--darkGray:#bfc1c3;
	--darkGreen: #313a3f;
	--darkGreenRGB: 49,58,63;
	--grayRGB: 226,227,228;
	--green: #99ad80;
	--lightGreen: #d2d9c3;
	--offWhite: #f7f8ef;
	--offWhiteRGB: 247,248,239;
	--sage:#737c6d;
	--tan:#e6dbcc;
	--white:#ffffff;
}




body {
	overflow-x:hidden;
}

img {
	display:block;
	max-width:100%;
	height:auto;
}

body, p, li {
	font-family: poppins, sans-serif;
	font-weight: 400;
	font-style: normal;
	color:var(--darkGreen);
	font-size:16px;
	line-height:1.6;
}
h1 {
	font-family:Knockout, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 2%;
}
h2, .blogPost h3, .page-template-whereabouts-intro h3 {
	font-family:Woodrow, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 5%;
}
h3, .blogPost h2, .page-template-whereabouts-intro h2 {
	font-family:Knockout, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 2%;
}
h4 {
	font-family:Knockout, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 2%;
}
h5 {
	font-family:Knockout, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 2%;
}
h6 {
	font-family:Knockout, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	letter-spacing: 2%;
}
h1 {font-size:80px;}
h2, .blogPost h3, .page-template-whereabouts-intro h3 {font-size:20px;}
h3, .blogPost h2, .page-template-whereabouts-intro h2 {font-size:48px;}
h4 {font-size:30px;}
h5 {font-size:24px;}
h6 {font-size:18px;}
@media(max-width:1199px) {
	h1 {font-size:65px;}
	h2, .blogPost h3, .page-template-whereabouts-intro h3 {font-size:20px;}
	h3, .blogPost h2, .page-template-whereabouts-intro h2 {font-size:40px;}
	h4 {font-size:24px;}
	h5 {font-size:20px;}
	h6 {font-size:16px;}	
}
@media(max-width:991px) {
	h1 {font-size:50px;}
	h2, .blogPost h3, .page-template-whereabouts-intro h2 {font-size:20px;}
	h3, .blogPost h2, .page-template-whereabouts-intro h3 {font-size:36px;}
	h4 {font-size:20px;}
	h5 {font-size:18px;}
	h6 {font-size:16px;}	
}
@media(max-width:767px) {
	h1 {font-size:6.3vw;}
	h2, .blogPost h3, .page-template-whereabouts-intro h3 {font-size:3.5vw;}
	h3, .blogPost h2, .page-template-whereabouts-intro h2 {font-size:6.3vw;}
	h4 {font-size:4.0vw;}
	h5 {font-size:3.5vw;}
	h6 {font-size:3.0vw;}	
}
h2 {
	margin-bottom:10px;
}
h3 {
	margin-top:0;
}
main a {
	color:var(--darkGreen);
	text-decoration: underline;
}

.dark, .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6, .dark p, .dark li, .dark a {
	color:var(--offWhite);
}

.button {
	display:inline-block;
	color:var(--darkGreen) !important;
	background-image:url(/img/button-arrow.png);
	background-size:100% 100%;
	font-family:Woodrow, sans-serif;
	font-weight:400;
	font-style: normal;
	color:var(--darkGreen);
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 10%;
	font-size:14px;
	padding:10px 40px 6px;
	transition:.2s ease all;
}
.button:hover {
	cursor: pointer;
	color:var(--darkGreen);
	text-decoration: none;
	transform: rotate(-7deg);
}
.button > * {
	font-weight: inherit;
	display:inline;
	background-color:var(--offWhite);
}
.shadow {
	box-shadow:7px 6px 11px rgba(0,0,0,.25);
}
.noBreak {
	white-space: nowrap;
}
.verticalCenter {
	display:flex;
	align-items: center;
}
@media(max-width:767px) {
	.verticalCenter {
		flex-direction:column;
	}
}
iframe {
	border:none;
}

/* Mobile layout that Bootstrap also provides. Bootstrap's stylesheet loads
   after first paint, and these rules match it below 768px so the hero does not jump. */
html {
	box-sizing:border-box;
}
*, *:before, *:after {
	box-sizing:inherit;
}
.container {
	margin-right:auto;
	margin-left:auto;
	padding-left:15px;
	padding-right:15px;
}
.row {
	margin-left:-15px;
	margin-right:-15px;
}
.row:before,
.row:after {
	display:table;
	content:" ";
}
.row:after {
	clear:both;
}
[class*="col-"] {
	position:relative;
	min-height:1px;
	padding-left:15px;
	padding-right:15px;
}