#page-header {
	margin-top: 0;
	margin: auto;
	margin-bottom: 0;
	background: #252525;
	color: #CCC;
	align-items: center;
	justify-content: center;
	background-color: #333333;
}

/* masthead style */

.masthead-bg {
	width: 100%;
    height: 100%; 
    background-image:url('../banners/01-background.jpg');       
	background-size: cover;
	background-repeat: no-repeat;
	
  }

.masthead-style {
	width: 100%;
    height: 100%;        
	background-size: cover;
	background-repeat: no-repeat;	   
	background-position: left center;
	 -webkit-box-shadow: 0 8px 16px -8px black;
	   -moz-box-shadow: 0 8px 16px -8px black;
	        box-shadow: 0 8px 16px -8px black;	
		
	/* font style */
	color: #fff;
	padding-left: 9%;
	padding-top: 8%;
	padding-bottom: 8%;
	 -webkit-animation: myfirst 2s ; /* Chrome, Safari, Opera */
    animation: myfirst 2s ;
  }

  /* Chrome, Safari, Opera */
  @-webkit-keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }

  /* Standard syntax */
  @keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }	



H1 {
	font-family: Arial, sans-serif;	
	margin-bottom: 19px;
}

@media all and (max-width:320px) {
	H1 {
		font-size: 75%;
	}
.masthead-style {
		padding-top: 5.5%;
		padding-bottom: 0.1%;
		padding-left: 3%;
	}	
}

@media all and (min-width:321px) and (max-width: 480px) {
	H1 {
		font-size: 80%;
	}
.masthead-style {
		padding-top: 6%;
		padding-bottom: 1%;
		padding-left: 4%;
	}	
}

@media all and (min-width:481px) and (max-width: 640px) {
	H1 {
		font-size: 107%;
	}
.masthead-style {
		padding-top: 7%;
		padding-bottom: 3%;
		padding-left: 6%;
	}	
}

@media all and (min-width:641px) and (max-width: 960px) {
	H1 {
		font-size: 145%;
	}
	.masthead-style {
		padding-top: 7%;
		padding-bottom: 4%;
		padding-left: 7%;		
	}		
}

@media all and (min-width:961px) and (max-width: 1200px) {
	H1 {
		font-size: 200%;
	}
	.masthead-style {
		padding-top: 7.5%;
		padding-bottom: 6%;
	}	

}

@media all and (min-width:1201px) and (max-width: 1590px){
	H1 {
		font-size: 250%;
	}
	.masthead-style {
		padding-top: 8%;
		padding-bottom: 6%;
	}	
}

@media all and (min-width:1591px) and (max-width: 1750px){
	H1 {
		font-size: 320%;
	}
	.masthead-style {
		padding-top: 8%;
		padding-bottom: 6.5%;
	}	
}

@media all and (min-width:1751px) and (max-width: 2400px){
	H1 {
		font-size: 380%;
	}
	.masthead-style {
		padding-top: 7.5%;
		padding-bottom: 6.5%;
	}	
}


@media all and (min-width:2401px){
	H1 {
		font-size: 420%;
	}
	.masthead-style {
		padding-top: 8.8%;
		padding-bottom: 7.8%;
	}	
}



/* contains the menu */

#nav {
	height: 50px;
	min-width: 1000px;
}

/* contains the corporate logo */

#logo-row {
	height: 100px;
	width: 100%;
	border-top: 1px solid #545454;
	background-color: #333333;
}
@media only screen and (max-width: 660px) {
	/* DELETE THIS */
	#row-2 {
		padding-top: 15px;
	}
}

}
div.topbar {
	width: auto;
	min-width: 1000px;
	overflow: hidden;
	margin: auto;
	background: #181C1F;
}
a.topbar {
	text-decoration: none;
	border: 0px;
}

/* logo swap */
.image-1 {
	border-width: 0px;
	width: 362px;
	margin-top: 26px;
	margin-left: 25px;
}
.image-2 {
	border-width: 0px;
	width: 250px;
	float: right;
	margin-top: 26px;
	margin-right: 25px;
}
.image-3 {
	width: 362px;
	display: none;
}
@media screen and (max-width: 1000px) {
	.image-1 {
		width: 300px;
		margin-top: 31px;
	}
	.image-2 {
		max-width: 210px;
		margin-top: 29px;
	}
}
@media screen and (max-width: 620px) {
	.image-1 {
		display: none;
	}
	.image-2 {
		display: none;
	}
	.image-3 {
		padding-top: 22px;
		width: 240px;
		display: block;
		margin: auto;
	}
}