/*CSS Green Team Recycling*/

/* ---------------------------------------------------------------- */
/* Project Name: Green Team Recycling                               */
/*   Page Title: styles for positioning, font, color                */
/*   Web Author: Rick van Rijn                                      */
/* ---------------------------------------------------------------- */
/* Version Control                                                  */
/* 		Version 1.0                                             */
/* 		Version Begin Date 04/05/2010                           */
/* ---------------------------------------------------------------- */
/* Copyright © 2010 - Rick van Rijn and Freelance I.T. Solutions    */
/*		All Rights Reserved                                     */
/* ---------------------------------------------------------------- */



	body {
		 font-family: Verdana, Helvetica, Arial, sans-serif;
		 background-color: #5F7C28;
		 padding: 0;
             margin: 0;
	 }

	
	p {
		font-size: small;
		color: navy;
	} 
	#tagline p {
	      font-style: italic;
		font-size: x-small;
	      font-family: Verdana, Times, serif;
	      background-color: #bed8f3;
	      border-top: 3px solid #7da5d8;
	      border-bottom: 3px solid #7da5d8;
		padding-top: .2em;
		padding-bottom: .2em;
		background: #bed8f3 url(backgrounds/tagline-fade.jpg) repeat-y right;

	}

		
	h1, h2, h3 {
	      font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
	}

	
	li {
		 font-size: small;
		 list-style-type: none;
	}
	
	h2 {
		color: #72A610;
		font-size: large;
		font-weight: bold;
		padding-top: 15px;

	}


	a {
		font-weight: bold;
	}

	#navigation {
	      width: 250px;
		height: 600px;
	      background:#7da5a8 url(backgrounds/nav-bg.JPG) no-repeat;
	}

	#header {
		border-top: 3px solid #7da5d8;
	} 

	#navigation ul {
		margin-left: 60px;
		margin-right: 60px;
		padding: 0;
		padding-top: 1em;
	}

	
	#navigation a:link, #navigation a:visited {
		display: block;
		font-size: small;
		padding: 0.4em 1em 0.4em 1em;
		color: #FFFFFF;
		background-color: #5F7C28;
		text-decoration: none;
		border: 1px solid #7da5d8;
	}
	
	#navigation a:hover {
		color: #FFFFFF;
		background-color: #72A610;
	}
		
	
		

	/*
	This section deals with the position of items on the screen.
	It uses absolute positioning- fixed x and y coordinates measured
	from the top-left corner of the wrapper box.
	*/


	#navigation, #bodycontent, #header, #tagline p,  #top {
		position: absolute;
	}
	
	#navigation, #bodycontent {
		top: 12.80em;
	}
 
	#bodycontent {
		left: 250px;
		height: 600px;
		width: 730px;
		padding-left: 20px;
		background: white;
		
	}
	
	#header {
		width: 1000px;
	}

	#tagline p {
			top: 170px;
			width: 1000px;
	}
	 
	#top  {
			left: 250px;
	}
	#wrapper {
			position: relative;
			width: 1000px;
			height: 600px;
			background-color: white;
			margin-right: auto;
			margin-left: auto;
	}
	#coupon a {
		 
			position: absolute;
			font-size: x-large;
			color: #7da5d8;
			background-color: #5F7C28;
			text-decoration: none;
			top: 450px;
			left: 550px;
			width: 140px;
                  height: 50px;
			padding-top: .4em;
                  border-top: 3px solid  #7da5d8;
	            border-left: 3px solid  #7da5d8;
		      border-bottom: 3px solid  #7da5d8;
			border-right: 3px solid  #7da5d8;
		}

	#coupon a:hover {
			background-color: #72A610;

		}
	#recycle {
			position: absolute;
			text-decoration: none;
			text-align: center;
			border-style: outset;
			background: #bed8f3 url(backgrounds/tagline-fade.jpg) repeat-y right;
			height: 14px;
			width: 340px;
			font-size: 10px;
}

	#recycle a {
			text-decoration: none;
			color: navy;
}

		/*
                beginning of sign in form
							*/

	form.contact fieldset {
			border: 2px solid navy;
			padding: 10px;
			width: 650px;
		}

	form.contact legend {
			font-weight: bold;
			font-size: small;
			color: navy;
			padding: 10px;
		}

	form.contact label.fixedwidth {
			display: block;
			width: 240px;
			float: left;
		}

	form.contact .buttonarea input{
			background: navy;
			color: white;
			font-weight: bold;
			padding: 5px;
			border: 1px  solid white;
		}

	form.contact .buttonarea {
			text-align: center;
			padding: 4px;
			background-color: #7da5d8;
		}

	#freelance {

			position: absolute;
			text-align: center;
			font-size: 10px;
			top: 560px;
			left: 250px;
			
}

		
/* STYLES FOR PAYMENT PAGE */

form.payment {
	font-family: Verdana, Arial;
	font-size: 13px;
	color: #0000FF;
}

form.payment fieldset.paymentForm {
	border: 2px solid navy;
	padding: 10px;
	width: 650px;
	height: 500px;
}

form.payment legend {
	font-weight: bold;
	font-size: small;
	color: navy;
	padding: 10px;
}

form.payment label.fixedwidth {
	display: block;
	width: 240px;
	float: left;
}

form.payment fieldset.summary {
	background-color: #FFFFCC;
	
	position: absolute;
	top: 25px;
	left: 510px;
	
	font-family: Verdana, sans-serif;
	font-size: 12px;
	color: #000000;
	text-align: right;
	
	width: 170px;
	min-width: 170px;
	max-width: 170px;
	
	border: 1px solid #0000FF;
	padding: 2px;
}

form.payment .formContent1 {
	display: none;
	
	width: 450px;
	max-width: 450px;
}

form.payment .formContent2 {
	display: none;
	
	width: 450px;
	max-width: 450px;
}

form.payment .formContent3 {
	display: none;
	
	width: 450px;
	max-width: 450px;
}

form.payment .formContent4 {
	display: none;
	
	width: 450px;
	max-width: 450px;
}

form.payment .formStep1 input{
	background: navy;
	color: white;
	font-weight: bold;
	padding: 5px;
	border: 1px  solid white;
}

form.payment .formStep1 {
	text-align: center;
	padding: 4px;
	background-color: #7da5d8;
}

form.payment .formStep2 {
	background-color: #7DA5D8;
	
	text-align: center;
	
	padding: 4px;
}

form.payment .formStep2 input {
	background: navy;
	
	font-weight: bold;
	color: #FFFFFF;
	
	border: 1px  solid #FFFFFF;
	
	padding: 5px;
}

form.paymnet input.paymentInputText {
	background-color: #FFFFFF;
	
	font-size: 13px;
}