* {
    box-sizing: border-box;
}

a, a:hover, a:active {
	text-decoration:underline;
	color:#660000;
	font-weight:bold;
}

body {
	margin: 0;
	font-family: Verdana, Arial;
	font-size: 14px;
	background: #000000;
	width:100%;
	line-height:1.5;
}

.page {
	padding: 0px;
	margin: 0px;
	width: 100%;
}

.header {
	background-image:url('../media/images/cfbg_powerhammer_head.jpg');
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: 0px 0px; 
	border: none;
	width: 100%;
	height: 250px;
	max-height: 250px;
	padding: 0px;
	z-index:10;
	margin:0px 0px 0px 0px;
	text-align:center;
	color:#ffffff;
} 

.headerText {
	position:absolute;
	color:#ffffff;
	font-family:Garamond;
	font-size:20px;
	z-index:99;
	width:100%;
	height:250px;
	background-color: rgba(0,0,0,0.3);
}
	.headerTextTop {
		position:absolute;
		font-family:Chelsea, "Times New Roman", Times, serif;
		font-weight:bold;
		top:55px;
		left:200px;
		font-size:20px;
		z-index:99;

	}
	.headerTextMid {
		position:absolute;
		font-family:Chelsea, "Times New Roman", Times, serif;
		font-size:60px;
		font-weight:bold;
		top:60px;
		left:100px;
		z-index:99;
		min-width:350px;
		text-align:left;
	}
	.headerTextBot {
		position:absolute;
		font-family:Chelsea, "Times New Roman", Times, serif;
		font-size:50px;
		font-weight:bold;
		top:120px;
		left:100px;
		z-index:99;
		padding:0px 0px 0px 2px;
		text-align:left;
	}

.headerBackground {
	position:absolute;
	width: 1800px;
	height: 250px;
	z-index:1;
}

.headerBackground img {
	overflow:hidden;
	width: 1800px;
	height: 250px;
	margin-left:-300px;
}

#headerVideo {
	position: fixed;
	min-width: 100%; 
	overflow:hidden;
	z-index:5;
}

.headerLogo, .headerLogo a, .headerLogo a:hover {
	padding:0px !important;
	margin:0px !important;
	float:left;
}

.content {
    bottom: 0;
    background: none;
    color: #010101;
	min-height: 500px;
    padding: 0px;
	margin:0px 0px 0px 0px;
	/*margin:20px 30px 0px 30px;*/
	z-index:90;
}

.contentSection {
	min-height:150px;
	width:100%;
	padding:20px 20px 20px 20px;
	background-image:url('../media/images/wallpaper_offwhite.jpg');
	background-repeat: repeat;
	background-attachment: fixed;
	background-position: 0px 0px; 
	background-size:auto;
}

	#contentSection1 {
		color: #010101;
		font-size:16px; 
		padding:50px 20px 150px 20px;
	}
	#contentSection1 img {
		align:right;
		padding:20px;
	}
	#contentSection2 {
		color: #010101;
		font-size:24px; 
		text-align:center;
		padding:50px 20px 50px 20px;
		font-family:"Times New Roman", Times, serif;
		font-weight:normal;
	}
	.contentSection2a {
		color: #010101;
		font-size:20px; 
	}

	#contentSection3 {
		background:#210000; 		
		/*background-image:url('../media/images/red_fire_bg.jpg');
		background-repeat: repeat;
		background-attachment: fixed;
		background-position: 0px 0px; 
		background-size:auto;*/
		font-size:20px;
		color: #eeeeee;
		padding:150px 30px 150px 30px;
	}
	#contentSection3 a {
		font-size:16px;
		color:#ffff00;
		font-weight:bold;
		text-decoration:none;
	}

	#contentSection3 a:hover {
		color:#cccc00;
		font-weight:bold;
		text-decoration:none;
	}
	#contentSection4 {
		color: #010101;
		font-size:24px; 
		text-align:center;
		padding:150px 20px 150px 20px;
		font-family:"Times New Roman", Times, serif;
		font-weight:normal;
	}

.logoImage {
	position:absolute;
	width:100px;
}

.logoImage img {
	width:150px;
} 

.annotation {
	font-size:12px;
	color:#111111;
}

.directionsMap {
	min-width:300px;
	max-width:600px;
}
/*
.directionsTextDiv {
	float: left; 
	margin: 0px 0px 15px 15px;
	width:auto;
}

.blacksmithMapDiv {
	float: right; 
	margin: 0px 0px 15px 15px;
	width:auto;
}
*/
.blacksmithMap {
	min-width:250px;
	max-width:100%;
	height:auto;
}

.googleMapsButton {
	position:absolute;
	margin:10px 0px 0px 10px;
	width:50px;
	height:50px;
}

.wrapper { 
  border : none; 
  overflow:hidden;
}

.wrapper div {
   padding: 10px;
}
#directionsTextDiv {
  float:left; 
  margin-right:20px;
  min-width:280px;
  max-width:600px;
  border : none; 
}
#blacksmithMapDiv { 
  overflow:hidden;
  border : none; 
  min-height:500px;
  min-width:260px;
}
	
.clearDiv {
	clear:both;
}

.footer {
	border: none;
	font-size:12px;
	width: 100%;
	min-height: 220px;
	height:auto;
	padding: 10px;
	background: #333333;
	z-index:10;
	margin:0px 0px 0px 0px;
}

	.footerTop {
		min-height:100px;
		width:100%;
		text-align:right;
		background: #333333;
	}

	.footerTop a {
		font-size:16px;
		color:#ffff00;
		font-weight:bold;
		text-decoration:none;
	}

	.footerTop a:hover {
		color:#cccc00;
		font-weight:bold;
		text-decoration:none;
	}

	.footerBottom {
		color: #cccccc;
		min-height:50px;
		width:100%;
		background: #333333;
		text-align: center;
	}

	.footerLeft {
		text-align: left;
		display:inline-block;
		margin: 0 auto;
		min-width:300px;
		max-width:33%;
		padding:10px;
	}

	.footerCenter {
		text-align: left;
		display:inline-block;
		margin: 0 auto;
		min-width:300px;
		max-width:33%;
		padding:10px;
	}

	.footerRight {
		text-align: left;
		display:inline-block;
		margin: 0 auto;
		min-width:300px;
		max-width:33%;
		padding:10px;
	}

@media screen and (max-width: 400px) {
   #directionsTextDiv { 
    float: none;
    margin-right:0;
    width:auto;
    border:none;
  }
	
}	

@media screen and (max-width: 600px) 
{
	.header {
		background-position: -700px 0px; 
	} 
	.headerBackground img {
		margin-left:-1400px;
	}
	.headerTextTop {
		font-size:12px;
		top:57px;
		left:65px;
	}
	.headerTextMid {
		font-size:32px;
		top:60px;
		left:20px;
	}
	.headerTextBot {
		font-size:26px;
		top:95px;
		left:20px;
	}
		.footerLeft, .footerRight
		{
			max-width: 100%;
			font-size:14px;
		}
		
		.footerTop {
			padding-top:20px;
		}
		
		.footerTop a {
			font-size:13px;
		}
	 
	.logoImage img {
		width:50px;
	}
	#contentSection1 img {
		align:center;
		padding:20px 0px 20px 0px;
		width:260px;
		height:auto;
	}

}

@media screen and (max-width: 800px) 
{
     .footerLeft, .footerRight
     {
          max-width: 100%;
     }
	 
	.logoImage img {
		width:75px;
	}

}