/* CSS Document for Screens */
/* Google fonts - free fonts (make sure to not choose so many fonts it gets out of the green for website speed) */
/* Also the font import has to be first on the CSS file */



/* ---------------Header-Home-Page------------- */

header {
	background: #FFF url("../images/BG-Show-LG.jpg") no-repeat center top;
	top: 0px; 
	position:relative;
	height: 676px;
}



@media screen and (max-width: 1600px) {
	header { background: #FFF url("../images/BG-Show-MD.jpg") no-repeat center bottom; height: 420px;}
	header div.hero { top: 130px; left: 15%;}
}

@media screen and (max-width: 805px) {
	
	header { font-size: 1em; height: 330px;
	background: #FFF url("../images/BG-Show-SM.jpg") no-repeat center bottom; }
	header div.hero { top: 100px; }
	

}

@media screen and (max-width: 625px) {

	header { height: auto; min-height: 260px;; backgound-postion: left bottom;
	background: #FFF url("../images/BG-Show-SM2.jpg") no-repeat center bottom;}
	header div.hero h1 { margin-bottom: 10px;}
	

}

@media screen and (max-width: 500px) {

	header { height: auto; min-height: 200px;; backgound-postion: left top;
	background: #FFF url("../images/BG-Show-SM3.jpg") no-repeat center bottom;}
	header div.hero h1 { margin-bottom: 10px;}
	header div.hero {left: 9%;}
	

}