/* START OF STYLESHEET FOR STYLE 3 */


/* CONTAINER PROPERTIES START HERE */

/* This makes the background flush with the border of the screen and puts a gradient over the top */
body{
margin: 0px;
background: url('headerbg1.jpg') repeat-x #2d637c;
}

/* This establishes a container and puts waves over the top */
#container{
min-height: 100%;
margin: 0px;
padding: 0px;
background: url('headerbg2.jpg') repeat-x;
}

/* This is the container for the Content Body, it also puts the background under the text. This element contains the header */
#cbody{
margin: 0px;
padding: 0px;
position: relative;
top: 100px;
background: url('bg.jpg') repeat-y #fff;
width: 740px;
}

/* Establishes the footer and puts a gradient under it */
#footer {
height: 207px;
background: url('footer.jpg') bottom repeat-x;
}


/* END OF CONTAINER PROPERTIES */


/* IMAGE DRAWING DIVS START HERE */

/* Draws and contains the link bar so the animations do not mess up the page */
#links {
background: url('header.jpg') top no-repeat;
margin: 0px;
padding: 0px;
height: 118px;
overflow: hidden;
}

#links span {
margin-left: -10000px;
}

/* Draws the title at the top of the page */
.title {
background: url('title.jpg') no-repeat;
width: 740px;
height: 91px;
}

/* END OF DRAWING DIVS */


/* TEXT ALTERATION STARTS HERE */

/* This contains the text and sets it as sans-serif */
#text{
font-family: Arial, Helvetica, sans-serif;
min-height: 500px;
width: 680px;
text-align: left;
}

/*this is the text for the footer */
.ftext {
	width: 760px;
	text-align: left;
	position: relative;
	color: black;
	font-family: serif;
	font-size: 12px;
	top: 120px;
}

/* These all customize the text, changing spacing and lineheight, etc. */
p, ul {
font-size: 13px;
letter-spacing: .3px;
line-height: 1.5;
}
h1 {
font-size: 29px;
letter-spacing: 2px;
font-weight: bold;
color: #2d637c;
border-bottom: 2px #55bb8f solid;
width: 50%;
}
h2 {
font-size: 14px;
font-weight: bold;
}
h3 {
font-size: 18px;
font-weight: bold;
}

/* END OF TEXT ALTERATIONS */



/* LINK BAR STARTS HERE */

/* Establishes the common attributes for all the links */ 
.home, .about, .contact, .news, .classes, .store {
float: left;
position: relative;
bottom: 0px;
left: 6px;
height: 63px;
cursor: pointer;
}

/* Assigns the unique attributes to each button */
.home {
width: 106px;
background: url('home.jpg') bottom no-repeat;
}
.about {
width: 130px;
background: url('about.jpg') bottom no-repeat;
}
.contact {
width: 125px;
background: url('contact.jpg') bottom no-repeat;
}
.news {
width: 125px;
background: url('news.jpg') bottom no-repeat;
}
.classes {
width: 125px;
background: url('classes.jpg') bottom no-repeat;
}
.store {
width: 116px;
background: url('store.jpg') bottom no-repeat;
}

/* LINK BAR ENDS HERE */



/* VALIDATION */

.valid {
float: right;
}

/* END OF VALIDATION */

.cert {
float: right;
padding: 10px;
}

/* END OF STYLESHEET FOR STYLE 3 */

