/*	Prints Main Style Sheet
	================================================

	Layout

		header
		nav
		main
			content
		footer
	================================================ */

	head, body {
		margin: 0;
		padding: 0;
		--transform: scale(.75);
		--transform-origin: center top;
		
		--block-colour: #305050;
		--block-colour-hover: #597d7d;
	}

	body {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		align-items: start;
	}
	main {
		flex: 1;
	}
	header, nav, main, footer {
		box-sizing: border-box;
		width: 100%;
		margin: 0 auto;
	}

	header, nav, footer {
		min-height: 56px;
	}

	@media (min-width: 800px) {
		header, nav, main, footer {
			width: 800px;
		}
	}

/*	Prints Main Style Sheet
	================================================ */

	html {
		font-family: sans-serif;
		font-size: 87.5%;
	}
	body {
		background-color: white;
		background-image: url(trees.png);
		background-repeat: repeat;
		color: #333;
	}
	main {
		padding: 1em 2em;
		background-color: #F1F4F4;
		background-color: white;
		overflow: auto;
	}

	h1 {
		color: white;
		margin: 0;
		padding: 0;
	}
	h2 {
		margin: .25em 0em .25em 0em;
	}
	p, td, th, .clear {
		line-height: 1.5;
		margin: .75em 0;
	}
	a {
		text-decoration: none;
		color: rgb(132, 156, 156);
		color: white;
		color: #333;
		font-weight: bold;
	}
	a:hover {
		color: #305050;
		padding-bottom: .125em;
		border-bottom: solid thin;
	}
	td, th {
		vertical-align: top;
		text-align: left;
	}
	img {
		border: 0;
	}

/*	Paging
	================================================ */

	div#paging {
		width: 22em;
		border: 2px solid #333;
		padding: 0em 1em 0em 1em;
	}
	div#paging span,
	div#paging a {
		display: inline-block;
		width: 5em;
		text-decoration: none;
		font-weight: bold;
		text-align: center;
		padding: .25em;
		background-color: #597d7d;
		color: white;
	}
	div#paging span {
		color: #839b9b;
	}
	div#paging a:hover {
		background-color: #2f4f4f;
	}

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

	header {
		box-sizing: border-box;
		border: 2px solid white;
		border-style: none none solid none;
		padding: .75em 2em;
		background-color: #5B3C28;
	}

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

	footer {
		padding: .75em 2em;
		background-color: #305050;
		color: white;
	}


/*	Nav
	================================================ */

	nav {
		padding: .75em 2em;
		background-color: #305050;
	}

	nav ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	nav ul>li {
		display: inline-block;
		margin: .5em 1em;
	}

	nav ul>li a {
		padding-bottom: .125em;
		border-bottom: thin dotted;
		color: white;
	}
	nav ul>li a:hover {
		border-bottom: thin solid;
		color: yellow;
	}
	nav form#logout-form {
		color: white;
	}

	nav form#logout-form label {

	}

	nav form#logout-form {
		padding: 0;
	}
	nav form#logout-form>p {
		margin: 0;
	}


/*	Catalogue
	================================================ */

	#catalogue {
		float: left;
		width: 50%;
	}
	#content {
		float: right;
		width: 46%;
	}

/*	Shopping Cart
	================================================ */

	#cart {
		border: 1px solid #cccccc;
		padding: 0em .5em;
	}
	#cart form {
		display: inline;
	}
	#cart input.text {
		width: 2em;
		text-align: right;
	}
	#welcome {

	}

	#cart form table {
		border-collapse: collapse;

	}
	#cart form td {
		padding: .25em .5em;
		border: thin;
		border-style: solid none;
	}

	#cart form th:nth-child(3), #cart form td:nth-child(3) {
		width: 24em;
	}

	#cart form th:nth-child(4), #cart form td:nth-child(4) {
		text-align: right;
	}

	#cart form th:nth-child(5), #cart form td:nth-child(5) input {
		text-align: right;
		width: 4em;
	}
	#cart form th:nth-child(6), #cart form td:nth-child(6) input {
		text-align: center;
		width: 4em;
	}

/*	Index Cart
	================================================ */

	div#index-cart td {
		font-size: .8em;
		line-height: 1.2;
	}