/* CSS for JM Seeds */

html, body {
	margin: 0px;
	padding: 0px;
	font-size: 0px; /* collapse spacing */
	height: 100%;
}

body {
	background-image: url('/assets/images/beans-background.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: center;
}

#stock-attribution {
	display: inline-block;
	position: fixed;
	right: 15px;
	top: 15px;
	z-index: 99;
	
	font-size: 15px;
	color: rgba(255,255,255,.25);
	cursor: pointer;
}

div#container {
	max-width: 650px;
	height: 100%;
	padding: 35px;
}

@media screen AND (min-width: 1451px) {
	div#container {
		margin-left: calc( ( 45vw / 2 ) - ( 650px / 2 ) );
	}
}

@media screen AND (max-width: 1450px) {
	div#container {
		background: rgba(255,255,255,.75);
		box-shadow: 30px 0px 100px black, 0px 0px 200px rgba(0,0,0,.2) inset;
	}
}

header, main, footer {
	display: block;
	margin: 0px;
}

	header > ul#seed-types {
		display: block;
		/* margin-top: 35px; */
		text-align: center;
		line-height: 1.5;
	}
		header > ul#seed-types > li {
			display: inline-block;
			font-family: 'Bahnschrift';
			font-size: 17px;
			color: rgb(168,64,64);
			font-weight: lighter;
			letter-spacing: -1px;
		}
	
		header > ul#seed-types > li:first-of-type:before {
			display: none;
		}
		header > ul#seed-types > li::before {
			font-family: 'FontAwesome';
			content: "\f111";
			font-size: 5px;
			display: inline-block;
			text-align: center;
			margin: auto 7px 0px 7px;
			color: rgb(168,64,64);
			transform: scale(50%);
			line-height: 1;
		}
			@media screen AND (max-width: 650px) {
				header > ul#seed-types > li {
					text-align: center;
					margin: auto 10px auto 10px;
				}
				
				header > ul#seed-types > li::before {
					display: none;
				}
			}
		
		header > img#logo {
			display: block;
			margin: 35px auto 35px auto;
			max-width: 400px;
			height: auto;
		}
		
			@media screen AND (max-width: 500px) {
				header > img#logo {
					position: relative;
					max-width: 100%;
				}
			}
		
		header > article#intro {
			display: block;
			text-align: center;
		}
			header > article#intro > p {
				font-family: 'Bahnschrift';
				font-size: 22px;
				font-weight: bold;
				line-height: 1.35;
			}
				header > article#intro > p > .special {
					color: rgb(125,50,50);
					font-weight: bolder;
				}
				
main {
	text-align: center;
	font-size: 0px; /* collapse spacing */
	margin-top: 35px;
}
	main > address {
		display: inline-block;
		position: relative;
		width: 45%;
		text-align: center;
		font-size: 0px; /* collapse spacing */
	}
		main > address:first-of-type {
			padding-left: 5%;
			text-align: left;
		}
		main > address:last-of-type {
			padding-right: 5%;
			text-align: right;
		}
		
		@media screen AND (max-width: 650px) {
			main > address,
			main > address:first-of-type,
			main > address:last-of-type {
				display: block;
				width: auto;
				text-align: center;
				padding: 15px;
				margin: auto;
			}
		}
		
		main > address > a {
			font-family: 'Bahnschrift';
			font-size: 35px;
			color: rgb(168,64,64);
			font-weight: lighter;
			text-decoration: none;
		}
			main > address > a:hover {
				border-bottom: 1px solid rgb(168,64,64);
			}
			
		main > iframe#gmap {
			display: block;
			margin-top: 35px;
			position: relative;
			width: 100%;
			height: 400px;
		}
		
		footer {
			padding: 20px;
			text-align: center;
			font-size: 14px;
		}
		
			footer > a#pdc,
			footer > a#pdc:hover {
				color: rgba(0,0,0,.35);
				font-family: 'cityofregular';
				text-decoration: none;
			}