/* This is the CSS Document for all of the pages found on Seaway's website.
	CSS deals with how the page is spaced, what colors things are, and how the
	page looks. All of the content on the site is put in in the HTML code. !!!If you
	change something in here it will change how everypage on the site looks!!! All of
	the grey text is just my comments to help you understand how this code works when
	you want to edit it.
*/

/* Body is the background design (the grey on the sides of the page)*/
body	{
		margin: 0; 					/* This makes sure that there are no spaces around the main site*/
		background: #999; 			/* This makes the background color grey, or color code #999 */
		background-image:url(/images/gradient.jpg);
		background-repeat:repeat-x;
		}

/* 	The p code is just a fix to remove spaces that some web browsers like to put between
	different pieces of the page*/
p		{
		padding: 0;
		border:0;
		margin:0;
		}
	
/*	This is a container that will hold the banner at the top of the page*/
.logo	{
		position: relative; 		/* the position and margin code centers the banner relative to the screen */
		margin: 0 auto 0 auto; 		/* this makes 0 space above and below the banner, and lets the left and right margins be automatically set to keep it centered */
		width: 774px; 				/* Sets the width of the container to 774 pixels, should not be changed */
		background-color:#431d1c;	/*This sets the background color for the container */
		}
		
		/* This code is for any images that are going to be inside of the banner container */
		div.logo img{
				border:0; 			/* this just makes it so there are no borders of color around the logo */
				}
				
/* 	This is the code for the top navigation bar*/
.top_nav {
		position: relative; 		/* the position and margin code centers the banner relative to the screen */
		margin: 0 auto; 			/* this makes 0 space abovethe banner, and lets the left, bottom, and right margins be automatically set to keep it centered */
		height: 33px; 				/* Sets the height of the bar to 30 pixels */
		width: 774px; 				/* Sets the width of the bar to 774 pixels */
		}
			/* This controls how the list of titles looks*/
			div.top_nav ul{
			padding:0; 				/*This makes sure that there are no spaces around the bar */
			margin:0;				/*This makes sure that there are no spaces around the bar */
			list-style-type:none;	/*This removes any bullets from the front of the titles */
			}
			
			/*This is how each indivual title, and its surrounding block, looks*/
			div.top_nav a{
			padding-top: 5px; 		/* moves the text 5 pixels down from the top of the bar */
			text-align: center; 	/* centers the text in the block*/
			float: left;			/* keeps all the titles in line, next to each other */
			width: 129px;			/* makes each block that holds the titles 129 pixels wide */
			height: 30px;			/* makes each block that holds the titles 30 pixels high */
			text-decoration: none;	/* Makes sure that the titles are not underlined */
			color: white; 			/* Colors the text white */
			background-color: #431d1c; /* Makes the background color of the blocks the specified color */
			}
			
			/* This Code is run when the mouse hovers over the block */
			div.top_nav a:hover {
			background-color:#3d3f3c; /* Changes the background color */
			}
			
			/* Makes the blocks line up next to each other side to side, instead of up and down */
			div.top_nav li {display:inline;}

/* This creates a container that will hold the left and right navigation bars as well as the center content for the site, It will help with the positioning and sizing of these elements*/
#container{
		padding: 0;
		position: relative;			/* the position and margin code centers the banner relative to the screen */
		margin: 0 auto;				/* this makes 0 space abovethe banner, and lets the left, bottom, and right margins be automatically set to keep it centered */
		text-align: left;			/* Aligns the text to the left side */
		width: 774px;				/* Makes the container 774 pixels wide*/
		background: #8a9d6f; 		/* Sets the background color to the specified color*/
		font-size: 14px; 			/* Makes any font in this container 14 pixels tall*/
		font-weight: bold;			/* Makes any font in this container bold unless otherwise specified*/
		min-height: 490px; 			/* Makes the container's smallest height 450 pixels, if the content that the container holds takes up more space the container will grow.*/
		}
		
		/* This is only read by internet explorer, it makes the minimum height work in Internet Explorer*/
		*html #container{
			height: 335px;
		}
			
/* This is the code for how the left navigation bar will look */ 
.left_nav {
		position: absolute;			/* Gives the container a set postion within whatever container it is in */
		left: 0;					/* positions the container 0 pixels from the left hand side of the container that this container is in */
		top: 0;						/* positions the container 0 pixels from the top side of the container that this container is in */
		width: 150px;				/* Makes the container 155 pixels wide*/
		background-color:#8a9d6f;	/* Sets the background color to the specified color*/
		height: 100%;				/* Makes the height the same height as the container that is holding this container */]
		}

			/* this code is for any images that are found in the left_nav container*/
			div.left_nav a{
			display:block;
			}
			
			div.left_nav img{
			border:none;
			}

/* This is the code for how the right navigation bar will look */ 			
.right_nav {
		position: absolute;			/* Gives the container a set postion within whatever container it is in */
		left: 619px;				/* positions the container 619 pixels from the left hand side of the container that this container is in */
		top: 0;						/* positions the container 0 pixels from the top side of the container that this container is in */
		width: 155px;				/* Makes the container 155 pixels wide*/
		text-align: center;			/*Centers the text in the container*/
		background-color:#d7dece;	/* Sets the background color to the specified color*/
		height: 100%;				/* Makes the height the same height as the container that is holding this container */
		}
			
			/*This is how each indivual title, and its surrounding block, looks*/
			div.right_nav a{
			font-size: 12px;		/* Sets the font size to 10 pixels tall*/
			text-decoration: underline;	/* Underlines the text */
			color: black;			/* Makes the font color black */
			font-weight: normal;	/* Makes the font not bold for the links */
			}

/* This is the container that will hold the main content of the page */		
.main {
		font-weight:normal;			/* Makes the font not bold */
		font-family: "Times New Roman", Courier, Garamond, serif;	/* Makes the font "Times New Roman"*/
		width: 429px;				/* Makes the container 424 pixels wide */
		background-color: #d7dece;	/* Makes the background color the specified color*/
		margin-top:0px;
		margin-left:150px;			/* pushes the main content 155 pixels to the right (this is to put it next to left_nav) */
		min-height: 450px;			/* Makes the container's smallest height 480 pixels, if the content that the container holds takes up more space the container will grow.*/
		padding: 20px;				/* Makes the content found in this container 20 pixels away from the edge of the container */
		}
		
		/* This is only read by internet explorer, it makes the minimum height work in Internet Explorer*/
		*html .main{
			height: 335px;
			}
		
		/* this code is for any images that are found in the main container*/
		div.main img{
			border:0px;				/* Makes any images found in the main container have no border */
			padding: 0 10px 0 10px;			/* Makes any images found in the main container have a space of 10 pixels surrounding it on all sides*/ 
			}

/* This is the container that holds the information for the bar along the bottom of the page that holds the contact information */
.footer{
		position: relative;			/* the position and margin code centers the banner relative to the screen */
		padding-left: 20px;			/* This puts a space of 20 pixels on the left of the blocks */
		padding: 10px;				/* This puts a space of 10 pixels on the top, right, and bottom of the blocks*/
		font-size: 10px; 			/* Makes any font in this container 14 pixels tall*/
		color: white;				/* This sets the text color to white*/
		background-color:#431d1c;	/* Sets the background color to the specified color*/
		width: 754px;				/* Makes the container 774 pixels wide*/			
		margin: 0 auto;				/* this makes 0 space abovethe banner, and lets the left, bottom, and right margins be automatically set to keep it centered */
		height: 45px;				/* This sets the height of the container to 45 pixels */
		}

		/* This controls how the list of titles looks*/
		div.footer ul{
			float:left;				/* keeps all the titles in line, next to each other */
			padding:0; 				/*This makes sure that there are no spaces around the bar */
			margin:0;				/*This makes sure that there are no spaces around the bar */
			list-style-type:none;	/*This removes any bullets from the front of the titles */
			}
			
			/*This is how each indivual title, and its surrounding block, looks*/
			div.footer a{
			padding-right: 24px;	/* Puts a space 24 pixels wide to the right of each title */
			float: left;			/* keeps all the titles in line, next to each other */
			width: 106px;			/* Makes each block 106 pixels wide */
			height: 30px;			/* Makes each block 30 pixels tall */
			text-decoration: none;	/* Makes the text not underlined */
			color: white;			/* Makes the font color white */
			background: #431d1c;	/* Makes the background color the specified color*/
			}
			
			/* Makes the blocks line up next to each other side to side, instead of up and down */
			div.footer li {display:inline;}