* {
	box-sizing: border-box;
}

html {
	margin: 0;
	padding: 0;
	width: 100%;
	min-width: 100%;
	min-height: 100%;
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */

	background: var(--color-acct);
}
body {
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 100%;
	min-width: 100%;
	min-height: 100%;
	overflow: auto;

	overflow-x: hidden;
	background: var(--color-acct);
}

div	{
	display: block;
	position: relative;
	margin: 0;
	padding: 0;

      -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
              box-sizing: border-box;
}

picture, img {
	max-height: 100%;
    max-width: 100%;
}

a:focus {
	outline: none;
}

::selection {
	background: rgba(10, 10, 10, 1);
	color: rgba(255, 255, 255, 1);
}

a, h1, h2, h3, h4 {
	margin: 0;
	padding: 0;
}








/* Base Settings */

:root {
	--color-acct:	rgba(246, 146, 30, 1); 		/* Orange */
	--color-acct-off:rgba(216, 103, 3, 1); 		/* Orange Off */
	--color-1:  	rgba(0, 0, 0, 1);			/* Black */
	--color-2:  	rgba(255, 255, 255, 1);		/* White */
	--color-1-off:  rgba(40, 40, 40, 1);		/* Black Off */
	--color-3:		rgba(107, 84, 152, 1); 		/* Purple */
	--color-4:		rgba(58, 28, 119, 1); 		/* Dark Purple */
	--color-4:		rgba(140, 198, 63, 1); 		/* Green */

	--main-padding: 20px;
	--main-padding-half: 10px;
}








/* Grid */

.box_1, .box_2, .box_3, .box_4, .box_5, .box_6, .box_7, .box_8, .box_9, .box_10, .box_11, .box_12 {
	float: left;
	box-sizing: border-box;
	position: relative;
	width: 100%;
}
.box_padded {
	padding: var(--main-padding);
}
.box_padded_extra {
	padding: 5vw var(--main-padding);
}

.row {
	margin: 0 calc(var(--main-padding)*-1);
    clear: both;
    width: calc(100% + var(--main-padding)*2);
}
section:after, .row:after, .ghost_photo:after {
	content: '';
	display: block;
	clear: both;
}

@media (min-width: 1000px) {
	.box_1, .box_2, .box_3, .box_4, .box_5, .box_6, .box_7, .box_8, .box_9, .box_10, .box_11, .box_12 {
		padding: var(--main-padding-half) var(--main-padding-half) calc(var(--main-padding-half)-1px);
	}
	.box_1 {
		width: 8.333333%;
	}
	.box_2 {
		width: 16.666666%;
	}
	.box_3 {
		width: 25%;
	}
	.box_4 {
		width: 33.333333%;
	}
	.box_5 {
		width: 41.666666%;
	}
	.box_6 {
		width: 50%;
	}
	.box_7 {
		width: 58.333333%;
	}
	.box_8 {
		width: 66.666666%;
	}
	.box_9 {
		width: 75%;
	}
	.box_10 {
		width: 83.333333%;
	}
	.box_11 {
		width: 91.666666%;
	}
	.box_12 {
		width: 100%;
	}
	.scooch_1 {
		margin-left: 8.333333%;
	}
	.scooch_2 {
		margin-left: 16.666666%;
	}
	.scooch_3 {
		margin-left: 25%;
	}
	.box_padded {
		padding: var(--main-padding);
	}
	.box_padded_extra {
		padding: 5vw var(--main-padding);
	}

}











/* Typography */

body, p, button {
	font-family: sweet-sans-pro, sans-serif;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0;
	text-align: left;
	font-size: 16px;
	line-height: 20px;
	-webkit-font-smoothing: antialiased;
	text-transform: none;

	color: var(--color-2);
}
p {
	margin-bottom: .5em;
	max-width: 600px;
}

h1, h2 {
	font-size: 42px;
	line-height: 40px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 .125em -.05em;
	font-family: 'Nunito', sans-serif;
}
h1 span.price {
	font-weight: 400;
}
h3 {
	font-size: 26px;
	line-height: 25px;
	font-weight: 800;
	letter-spacing: -.02em;
}
h4 {
	font-size: 22px;
	line-height: 20px;
	font-weight: 800;
	letter-spacing: .02em;
	text-transform: uppercase;
	margin: 0 0 .5em -.08em;
}

header nav li {
    font-size: 1.6em;
    line-height: 1.2;
}
header nav .location li {
    font-size: 1em;
}

.index_section.section_secondary h4 {
    font-size: 1.6em;
    line-height: 1;
    margin: 0 0 .5em;
}

header .button button, button.button {
	text-transform: uppercase;
	letter-spacing: .1em;

	background: var(--color-acct);
	color: black;
	height: 40px;
	padding: 9px 20px;
	border: none;
	outline: none;
	border-radius: 5px;
	cursor: pointer;

    -webkit-transition: all ease-out 200ms;
       -moz-transition: all ease-out 200ms;
            transition: all ease-out 200ms;
}
header .button button:hover, button.button:hover {
	background: var(--color-acct-off);
}
header .button.black button, button.button.black {
	background: var(--color-1);
	color: var(--color-2);
}
header .button.black button:hover, button.button.black:hover {
	background: var(--color-1-off);
}
button.primary {
	height: 50px;
	padding: 13px 30px;
	margin-top: 10px;
}

ul.checked_list li:before {
	content: '';
	display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 5px -1px -20px;

	background: url(../img/check.svg) no-repeat center;
	background-size: contain;
}
ul.checked_list li {
	margin: 0 0 .5em;
	padding-left: 20px;
}

@media (min-width: 768px) {

	h1, h2 {
		font-size: 68px;
		line-height: 60px;
	}

	header nav li {
	    font-size: 1em;
	    line-height: 1.2;
	}

}











#home {
	height: 100vh;
	width: 100vw;
	padding: 0 var(--main-padding);

    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: flex-start;

	background: var(--color-acct);
}

@media (min-width: 1000px) {
	#home {
		padding: 0;
	}
}