/*** 
	VERY IMPORTANT screens.css NOTE ABOUT OVERRIDE ORDER
	Selector must match flexbox.css exactly
	i.e. If flexbox.css has header div#navitems, screens.css needs to have header div#navitems as JUST #navitems will not override it
***/

/* Small screen, non-retina */
@media only screen and (min-width: 320px) {
	
}

/* Small screen, retina, stuff to override above media query */
@media
	only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 320px),
	only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 320px),
	only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 320px),
	only screen and (        min-device-pixel-ratio: 2)      and (min-width: 320px),
	only screen and (                min-resolution: 192dpi) and (min-width: 320px),
	only screen and (                min-resolution: 2dppx)  and (min-width: 320px) 
{ 
	
}

/* Medium screen, non-retina */
@media only screen and (min-width: 700px) {
	
}

/* Medium screen, retina, stuff to override above media query */
@media
	only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 700px),
	only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 700px),
	only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 700px),
	only screen and (        min-device-pixel-ratio: 2)      and (min-width: 700px),
	only screen and (                min-resolution: 192dpi) and (min-width: 700px),
	only screen and (                min-resolution: 2dppx)  and (min-width: 700px) 
{ 
	
}

/* Under Large Screen */
@media only screen and (max-width: 959px) {
	iframe#Map {
		width: calc(100% - 10px);

	}
}

/* Large screen, non-retina */
@media only screen and (min-width: 960px) {
	.flex-container {
		display: flex;
		flex-wrap: wrap;
	}

	section.feature {
		padding: 20px;
	}

	section.action { 
		padding: 20px;
		margin-bottom: 300px;
	}

	header div#NavItems { display: block; }
	header div#Mobile-NavItems { display: none }

	footer { 
		font-size: .75em; 
	}

	section.contact { padding-top: 50px; }

	.book-thumbnail img { max-width: inherit; }

	a.buy-now-small { font-size: 1.5em; }
}

/* Large screen, retina, stuff to override above media query */
@media
	only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 960px),
	only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 960px),
	only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 960px),
	only screen and (        min-device-pixel-ratio: 2)      and (min-width: 960px),
	only screen and (                min-resolution: 192dpi) and (min-width: 960px),
	only screen and (                min-resolution: 2dppx)  and (min-width: 960px) 
{ 
	.flex-container {
		display: flex;
		flex-wrap: wrap;
	}

	section.action { 
		padding: 20px;
		margin-bottom: 300px;
	}

	header div#NavItems { display: block; }
	header div#Mobile-NavItems { display: none; }

	footer { 
		font-size: .75em; 
	}

	section.contact { padding-top: 50px; }

	.book-thumbnail img { max-width: inherit; }

	a.buy-now-small { font-size: 1.5em; }

}