/*CSS for Bank Nine site*/



html * {	/*This code eliminates padding and margins put in my various browsers*/
	margin: 0;
	padding: 0;
}
body{
	background-color: #abf289;
	background-image: url(images/natfl224.jpg);
	width: 960px;
	margin: 0 auto;
}	
#bodyCopy {	/*This codes sets of the main body settings*/
	clear: left;
	width: 960px;
	float: left;
	background-color: #ffffff;
}
#mainNav{	/*This code sets the navigation layout*/
	list-style: none;
	text-align:center;
	width: 960px;
	margin-left: 25px;
}
#mainNav li{
	float: left;
	padding:  5px 10px;
}
#mainNav li img{
	border: 3px ridge green;
}
h1{	/*This code aligns all h1 and h2 to be centered*/
	text-align: center;
	}
h2, h3{
	text-align: center;
}
#browseMsg{
	border: 10px ridge green;
	width:  930px;
	float: left;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	text-align: left;
	font-family: "Arial", "Helvetica", sans-serif;
	font-size: 1.5em;
}
.photoSmall {	/*This code set up the image frames for the home page*/
	border: 10px ridge green;
	width: 295px;	
	float: left;
	padding-right: 5px;
	background-color: white;
	}
.photoSmall p{	/*This code centers the caption under each image*/
	text-align: center;
	color: black;
}
.photoSmall img{	/*This code specifies the image attributes for images on the home page*/
	width: 300px;
	height:  295px;
	border: none;
}
.description{	/*This code sets up the frame attributes for all frames NOT on the home page, 
		except the glove demo*/
	border: 10px ridge green;
	width: 380px;
	height: 380px;
	float: left;
	font-family: Arial, Helvetica, Sans-Serif;	
	font-size: 100%;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 10px;
	background-color: #99ccff;
}
.largePhoto{	/*This codes specifies the image attributes for all images NOT on the home page*/
	margin-left: 50px;
	border: 10px ridge green;
	width: 389px;
	height: 389px;
	float: left;
	background-color: #639ad2;	
}
.largePhoto img{
	width: 390px;
	height: 390px;
	border: none;
}
#aboutUs{	/*This codes is for the ABOUT US page*/
	border: 10px ridge green;
	width:  432px;
	float: left;
	margin-left: 250px;
		padding-top: 5px;
		padding-left: 5px;
		padding-bottom: 5px;
		padding-right: 5px;
		background-color: #ffffff;	
}
.demo-double-magnet{	/*Set up for frames on the double-magnet-demo.html page*/
	vertical-align: center;
	border: 10px ridge green;
	width: 445px;
	float: left;
	height: 305px;
	font-family: Arial, Helvetica, Sans-Serif;	
	font-size: large;
	padding-left: 5px;
}
.hatphoto-red{	/*Set up for the red baseball hat picture*/
	margin-left: 79px;
	border: 10px ridge green;
	padding-left: 0px;
	width: 445px;
	height: 305px;
	float: left;
	background-color: #667988;
}
.hatphoto-red img{
	width: 450px;
	border: none;
}
.glovephoto{	/*Set up for the triple glove photo*/	
	border: 10px ridge green;
	width: 805px;
	height: 255px;
	float: left;
	background-color: #667988;	
	margin-left: 80px;
}
.glovephoto img{
	border:none;
	width: 805px;
}
.caddiephoto{
	margin-left: 150px;
	}
.demo-glove-referral{	/*Sets up comments and frame below triple glove image*/
	vertical-align: center;
	border: 10px ridge green;
	width: 800px;
	float: left;
	height: 60px;
	font-family: Arial, Helvetica, Sans-Serif;	
	font-size: large;
	padding-left: 5px;
	margin-left: 80px
}
.double-mag-frame{	/*Sets up the frame for the double magnet image at doubl-magnet-demo.html*/
	border: 10px ridge green;
	width: 320px;
	height: 320px;
	float: left;
	background-color: #639ad2;
}
.double-mag-frame img{
	width: 320px;
	border: none;
}
#markComp{
	border: 10px ridge green;
	width:  432px;
	float: left;
	margin-left: 250px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
#shipping{
	border: 10px ridge green;
	width:  432px;
	float: left;
	margin-left: 250px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
#contactUs{
	border: 10px ridge green;
	width:  300px;
	float: left;
	margin-left: 300px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}

#placeOrder{
	border: 10px ridge green;
	width:  810px;
	float: left;
	margin-left: 50px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
#doubleMagDemo{
	border: 10px ridge green;
	width:  930px;
	float: left;
	margin-left: 0px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
#glove{
	border: 10px ridge green;
	width:  795px;
	float: left;
	margin-left: 80px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
#hatClip{
	border: 10px ridge green;
	width:  435px;
	float: left;
	margin-left: 80px;
	padding-top: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	background-color: #ffffff;
	clear: left;	
}
.paypal{
	margin-left: 50px;
}
footer {	/*This codes sets the footer to clear floats so it will actually go the bottom*/
	clear: both;
}