/* NAV STYLING */
/* Made by Dynexs.com */

html,
body {
	padding: 0;
	margin: 0;
	font-family: sans-serif;
	overflow-y: auto;
}

body {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.title {
	font-family: 'Comfortaa', sans-serif;
}

.underline {
	text-decoration: underline;
}

.bold {
	font-weight: bold;
}

/* HEADER STYLING */

#header {
	box-shadow: 10px 10px 64px 0px rgba(0, 0, 0, 0.23);
	display: flex;
	justify-content: center;
	width: 100%;
	/* background-color: #f00; */
}
#header-content {
	padding-inline: 4rem;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: 1fr 1fr;
	column-gap: 4rem;
	row-gap: 0;
	/* max-height: 10px; */
	justify-content: center;
	align-items: center;
}
#header-menu {
	grid-area: 1 / 1 / 3 / 2;
}
#header-menu label {
	cursor: pointer;
}
#header-logo {
	grid-area: 1 / 2 / 3 / 3;
}
#header-logo img {
	height: 5em;
	/* position: relative; */
	display: block;
}
#header-title {
	display: block;
	grid-area: 1 / 3 / 2 / 4;
	font-family: 'Comfortaa', sans-serif;
	font-size: 1em;
	font-weight: 700;
	color: #313193;
}
#header-nav {
	grid-area: 2 / 3 / 3 / 4;
}
#header ul {
	padding: 0;
	display: inline;
}
#header li {
	list-style-type: none;
	display: inline;
	margin-right: 2rem;
}
#header a {
	text-decoration: none;
	font-family: 'Comfortaa', sans-serif;
	font-weight: 200;
	color: black;
	font-size: 1.3rem;
}

/* FOOTER STYLING */
#footer {
	margin-top: auto;
	/* position: absolute; */
	/* bottom: 0; */
	/* left: 0; */
	box-shadow: 10px 0px 64px 0px rgba(0, 0, 0, 0.23);
	display: flex;
	justify-content: center;

	z-index: 10;
	width: 100%;
}

#footer-content {
	/* position: relative; */
	/* bottom: 0; */
	left: 0;
	width: 100%;
	/* box-shadow: 10px 10px 64px 0px rgba(0, 0, 0, 0.23); */
	display: inline;
	/* justify-content: center; */
	padding-inline: 4em;
	padding-bottom: 1em;
}

#footer p {
	margin: 0.1em;
}

/* MOBILE MENU */
input[type='checkbox'] {
	display: none;
}
.label {
	/* border: 1px solid #000; */
	display: inline-block;
	padding: 4px;
	background: url('../icons/menu.svg') no-repeat left center;
	padding-left: 2em;
	margin-left: 1em;
}
input[type='checkbox']:checked + .label {
	/* background: #f00; */
	/* color: #fff; */
	background-image: url('../icons/close.svg');
}

.main-content {
	/* display: inline-block; */
	/* overflow: scroll; */
	margin: 4em;
	/* padding-block: 4rem; */
	/* float: inline-start; */
	/* width: 100vh; */
	width: 85vw;
}

form {
	display: flex;
	flex-direction: column;
}

input[type='text'],
input[type='tel'],
textarea {
	padding: 0.5em;
	margin-block: 1em;
	margin-top: 0.5em;
	border: #ccc 1px solid;
	border-radius: 0.25em;
	font-family: sans-serif;
}

textarea {
	resize: vertical;
	height: 7em;
}

button[type='submit'] {
	padding: 1em;
	border-radius: 0.25em;
}

button {
	padding: 0.5em;
	border: #ccc;
	font-weight: bold;
}

form label {
	font-weight: bold;
}

.note {
	font-size: 0.8em;
}

.gallery {
	display: flex;
	flex-wrap: wrap;
	/* margin: 0 4px; */
}
.gallery-column {
	flex: 50%;
	max-width: 49.1%;
	padding: 0 4px;
}

.gallery-column img {
	margin-top: 8px;
	vertical-align: middle;
	width: 100%;
}

form #website {
	display: none;
}

@media (min-width: 320px) and (max-width: 1024px) {
	#header-logo img {
		height: 3em;
		margin-block: 1em;
	}
	#header-content {
		padding-inline: 0em;
		column-gap: 1em;
		grid-template-rows: auto 1fr;
	}
	#header-title {
		font-size: 0.8em;
		grid-area: 1 / 3 / 3 / 4;
	}
	#header-nav {
		display: none;
	}
	#header-nav li {
		display: block;
		margin-block: 0.5em;
	}
	#header {
		display: flex;
		justify-content: left;
	}
	.main-content {
		margin: 1em;
	}
	#footer-content {
		padding-inline: 1em;
	}
	.gallery-column {
		flex: 100%;
		max-width: 100%;
	}
	.title {
		font-size: 1.5em;
	}
}

@media (min-width: 1025px) {
	#header-menu {
		display: none;
	}
	.slim {
		width: 50vw;
	}
	.wide {
		width: 85vw;
	}
}