
body {
	background-image: url(images/wood_tile.jpg);
	background-color: #564d48;	/*backdrop color*/
	font-size: 1em;
	margin: 0px;
	text-align: center; /* IE trick in CSS to center. Top+Bottom Left+Right. */
	color: #000e2d;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 0.9em;
	}

#wrapper {
	background-image: url(images/rough_paper_pattern.jpg);
	margin: 30px auto; /* Firefox trick in CSS to center. vert_margins horz_margins. */
	width: 940px; /* width of site */
	text-align: left; /* Set text back to normal after page is centered */
	position: relative;

}
	
#header {
	background: url(images/header.jpg) no-repeat; 
	width: 940px;
	height: 319px;
	margin-left: 0px;
	z-index: 2;
	position: relative;
}

#footer {
	position: absolute;
	bottom: -20px;
	right: 10px;
	font-size: 0.7em;
	color: #272221;
}

/*======================= falling_petals ===============================================*/

#falling_petals {
	background: url(images/falling_petals_pattern.jpg);
	position: absolute;
	left: 0px;
	width: 100px; /*width of image*/
	
	height: 100%;
	top: 0px;
}

#water_petals {
	background: url(images/water_petals.jpg);
	position: absolute;
	z-index: 1; /*make go over falling petals layer*/
	bottom: 0px;
	left: 0px;
	height: 181px;
	width: 368px;
}

/*========================== Main_text =================================================*/

#main_text {
	position: relative;
	
	width: 522px;
	left: 100px; /* = falling_petals width */
	
	/*position over header*/
	top: -40px; 
	z-index: 2;
	
	min-height: 400px;/*minimum height*/
	
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 60px;
	
	font-size: 0.9em;
	text-align: justify;
	
	
}

img {
	border: none;
}

.scn_shot {
	border: solid black 1px;
}

h2 {
	font-size: 1.3em;
	
}

h3 {
	font-size: 1em;	
}

.header {
	margin-top: 35px;
	text-align: left;
}

.text_image {
	margin-bottom: -8px;
}

.tab {
	padding-left: 0.5in;
	text-align: left;
}

ul li {
	list-style-type: none;
}

.reg_list li {
	list-style-type: disc;
}

.small_text {
	font-size: 0.7em;	
}

.center_bottom {
	margin-top: 35px;
	text-align: center;
}

.h_small_text { /* for headers */
	font-size: 0.55em;	
	font-weight: normal;
	padding-left: 0.2in;
}
/*----------------------- W3C buttons ----------------------------------------------*/
#valid_xhtml,
#valid_css {
	margin-top: 10px;
	float: left;
}
#valid_xhtml {
	margin-right: 10px;
}
/*----------------------- Package format ----------------------------------------------*/

.package_details {
	text-align: left;
	padding-left: 0.2in;
}

.package_details li { /*make future lines indented*/
	padding-left: 2em;
	text-indent: -2em;
}

.added_feature {
	list-style-type: disc;
	list-style-image: url(images/arrow.png);
}

/*----------------------- Tables ----------------------------------------------*/
.table_border {
	border: solid #c4d9dc 1px;
	border-style: outset;
}

table {
	text-align: left;
	/*font-size: 0.7em;*/
	border-collapse: collapse; /*overlap borders*/
}

.table_border,
table {
	width: 500px;
}

table th {
	background-color: #bedde2;
	border-bottom: solid #abd6dd 1px;
	padding: 2px 5px; /*y x*/
}

table td {
	padding: 2px 5px; /*y x*/
	border-bottom: solid #c4d9dc 1px;
	background-color: #d5dedf;
	height: 40px;
	
	padding-left: 3em;
	text-indent: -2em;
}

.col_1 {
	width: 320px;
}

.col_2,
.col_3 {
	text-align: center;
}

.subcol_pound {
	width: 0px;
	padding: 0em;
	text-indent: 0em;
	text-align: right;
	padding-left: 5px;
}

.last_row  td{
	border-bottom: none;
	padding-bottom: 3px;
} 

.price_td {
	text-align: right;
	width: 0px;
}

.unit_td {
	text-align: center;
}

.table_tab {
	text-indent: 0em;
}

/*----------------------- Links ----------------------------------------------*/

a:link, a:visited {
    color: #0042e9;
    text-decoration: none;
}

a:hover {
	text-decoration: underline;
	color: #0031ae; 
}

a:active {
	color: #5288da; 
}

a {
   outline: none; /*removes dotted outline on active links*/
}

a:active .scn_shot {
   outline: dotted black 1px;
}

/*======================= pencil ===============================================*/

#eraser {
	background: url(images/pencil_eraser.jpg);
	position: absolute;
	left: 682px; /* falling_petals width + main_text width */
	width: 30px; /*width of image*/
	
	/*position over header*/
	top: 279px; /*header height - overlap(40)*/
	z-index: 2;
	
	height: 83px; /*height of image*/

}

#pencil_body {
	background: url(images/pencil_body_pattern.jpg);
	position: absolute;
	left: 682px; /* falling_petals width + main_text width */
	width: 30px; /*width of image*/
	top: 362px; /*header height + height of pencil_eraser - top overlap*/
	height: 200px; /*desired pencil body height*/
}
#pencil_head {
	background: url(images/pencil_head.jpg);
	position: absolute;
	left: 682px; /* falling_petals width + main_text width */
	width: 30px; /*width of image*/
	top: 562px; /*header height + height of pencil_eraser + pencil_body - eraser top overlap*/
	height: 114px; /*height of image*/
}

/*======================== Nav_bar ======================================================*/

#nav_bar {
	position: absolute;
	left: 717px; /* falling_petals width + main_text width + pencil width + 5px spacing */
	width: 228px;
	
	/*position over header*/
	top: 279px; /*header height - overlap (40) */
	z-index: 2;
}

#nav_bar ul li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#nav_bar ul {
	margin: 0;
	padding: 0;
}

/*----------------------- Buttons ----------------------------------------------*/
/*For image links:*/

#home_link {
	background: url("images/home.jpg") no-repeat 0 0;
	width: 77px;
}

#web_d_link {
	background: url("images/web.jpg") no-repeat 0 0;
	width: 145px;
}

#prog_link {
	background: url("images/prog.jpg") no-repeat 0 0;
	width: 157px;
}

#xp_link {
	background: url("images/xp.jpg") no-repeat 0 0;
	width: 149px;
}

#edu_link {
	background: url("images/edu.jpg") no-repeat 0 0;
	width: 134px;
}

#projects_link {
	background: url("images/proj.jpg") no-repeat 0 0;
	width: 119px;
}

#contact_link {
	background: url("images/cont.jpg") no-repeat 0 0;
	width: 119px;
}

#prices_link {
	background: url("images/prices2.jpg") no-repeat 0 0;
	width: 85px;
}

#links_link {
	background: url("images/links.jpg") no-repeat 0 0;
	width: 148px;
}

#prices_link, 
#links_link, 
#home_link, 
#web_d_link, 
#prog_link, 
#xp_link, 
#edu_link, 
#projects_link,
#contact_link {
	display: block;
	height: 30px;
	margin-top: 15px;
}

#prices_link {
	height: 26px;
}

/*#prices_link:hover,*/
#links_link:hover, 
#home_link:hover, 
#web_d_link:hover, 
#prog_link:hover, 
#xp_link:hover, 
#edu_link:hover, 
#projects_link:hover,
#contact_link:hover {
	background-position: 0 -30px;
}

#prices_link:hover {
	background-position: 0 -26px;
}


/*Hide the link's default text*/
#prices_link span,
#links_link span,
#home_link span,
#web_d_link span, 
#prog_link span, 
#xp_link span, 
#edu_link span, 
#projects_link span,
#contact_link span{
	display: none;
}

/*Change width of button to show the arrow which indicates the current page*/
body#prices a#prices_link,
body#links a#links_link,
body#home a#home_link,
body#web a#web_d_link,
body#prog a#prog_link,
body#xp a#xp_link, 
body#edu a#edu_link,
body#proj a#projects_link,
body#con a#contact_link {
	width: 228px;
}

