/*	styles.css
	================================================ */

/*	Variables
	================================================ */

	html {
		color: #666;
		color: rgb(22, 53, 50);

		--blackish: #666;
		--greenish: rgb(68, 72, 71);
		--greenisha: rgba(68, 72, 71,.5);
	}

/*	Basic
	================================================ */

	html {
		font-family: "Open Sans", "Source Sans Pro", sans-serif;
		font-size: 87.5%;
		color: var(--blackish);
	}
	body {
		background:#fafafa;
		background: white;
		box-shadow: 0px 0px 96px 0px rgba(0,0,0,0.75);
	}
	article, aside {
		padding: .5em 2em ;
	}

	body>nav {
		background-color: var(--greenish);
	}

	h1, h2 {
		margin: 0;
	}

	h1 {
		font-size: 4em;
	}

	h2 {
		color: var(--greenish);
	}
	p {
		line-height: 1.6;
		margin: .5em 0;
	}

/*	Header
	================================================ */

	header {
		background-color: var(--greenish);
		color: white;
		color: var(--greenish);
		background-color: white;
		background-color: #f8f8f8;

		background-image: linear-gradient(to bottom, #f8f8f8, #f0f0f0);
		background-image:
			linear-gradient(to right,rgba(51,51,51,.7),rgba(51,51,51,0)),
			url("blossoms-small.jpg");
		background-size: 100% auto;

		filter: none;
	}


	header>p#banner, header>h1 {
		margin: 0 1.5rem 0;
		line-height: 1;
		text-shadow: 0 1px 0 white;
		color: #f0f0f0;
		font-size: 10vw;
		font-weight: bold;
		padding: 0;
	}
	header>p {
		font-size: 2vw;
		margin: 0;
		line-height: 1;
		color: #f0f0f0;
		color: white;
		padding: .5rem 1.5rem .5rem;
	}

	@media (min-width: 800px) {
		header>h1 {
			font-size: 6rem;
		}
		header>p {
			font-size: 1.2rem;
		}
	}

/*	Footer
	================================================ */

	footer {
		background-color: var(--greenish);
		color: white;
		color: var(--greenish);
		background-color: white;
		border-top: thin solid var(--greenish);

		padding: .5em 2em;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	footer>* {
		qborder: thin solid red;
		margin: 0 !important;
	}
	footer h2 {
		font-size: 1em;
		margin: 0 0 .5em;
	}
	footer>ul, footer>p {

	}

	footer>ul.menu {
		display: flex;
		margin: 0;
		padding: 0;
		list-style: none;
		justify-content: space-between;
	}
	footer>ul.menu>li {
		margin-bottom: .25em;
	}
	footer>ul.menu a {
		color: var(--greenisha);
		padding: .125em 0 .0625em;
		margin: 0 .5em;
		text-decoration: none;
		border-bottom: thin solid var(--greenisha);
	}
	footer>ul.menu a:hover {
		qtext-decoration: underline;
		color: var(--greenish);
		border-color: var(--greenish);
	}

/*	Greeking
	================================================ */

	article>p,aside>p {
		font-size: .6rem;
		font-size: 1rem;
		text-shadow: 0 0 5px rgba(0,0,0,0.5);
		color: #ccc;
		/* color: transparent; */
		text-shadow: 0 0 5px #666;
	}
	aside>p {
		font-size: .9rem;
	}