/*-----------------------------------------------------------------------------

	*Filename:					main.css
	
	*Description:				Global CSS
	
	*Version:					1.0.0(2009-03-13)YYYY-MM-DD
	
	*Website:					http://startswimming.com
	
	*Author:					Nancy Rizk, Blue Oxygen Design Studio;
								Daniel Paul Searles
	
	
	==Structure:===============================================================
	
	
	*Page width:				907px
	
	*Number of columns:			1
	
	$__header					Header Definitions
	
	$__nav						Global Site Navigation
	
	$__main						Everything within the content
	
	$__footer					Footer Definitions

-----------------------------------------------------------------------------*/


.guide { background: #9ACCFE url(../images/main_background_test.jpg) no-repeat; margin: 0 auto; height: 922px; width: 1188px; }

body { background: #9ACCFE url(../images/background.jpg) repeat-x; }

#site { margin: 0 auto; height: 922px; width:907px; }


/* __header */

#header { height:146px; width:100%; background: url(../images/top_box.png) 5px 20px no-repeat; }

#header #login { position: relative; left:680px; height:96px; width:210px; background: url(../images/login_box.png) top no-repeat; }
#header #login h1 { padding: 4px 0 7px 0; color: #0f597d; font-size: .9em; font-weight: bold; font-family: 'trebuchet ms', arial, helvetica; text-align:center; }
#header #login label { margin: 0 0 12px 22px; display: block; color: #0f597d; font-size: .8em; font-family: arial, helvetica; }
#header #login a { margin: 0 0 13px 24px; color: #2b80aa; font-size: .65em; font-family: arial, helvetica; }
#header #login a:hover { color: #0f597d; }
#header #login input#username { padding: 2px; border: none; position: relative; top: -62px; left: 88px; height: 13px; width: 97px; background: transparent; }
#header #login input#password { padding: 2px; border: none; position: relative; top: -39px; left: -17px; height: 13px; width: 97px; background: transparent; }
#header #login input#login_submit { padding: 2px; border: none; position: relative; top: -33px; left: 126px; height: 20px; width: 64px; background: transparent; cursor: pointer; }

#header img#startswimming_logo { position: relative; top:-91px; left:-556px; }

/* __nav */

#header #main_nav {  }
#header #main_nav ul { position: relative; top: 13px; left: 287px; height: 37px; width: 607px; background: url(../images/main_nav/nav_sprite.jpg) no-repeat;  }
#header #main_nav ul li { display: inline; cursor: pointer; text-align: center; }
#header #main_nav a { float: left; padding: 10px 0 0 0; width: 0px; height: 37px; color: #444444; font: .8em 'futurabt lt', arial, helvetica; text-decoration: none; text-align: center; }

#header #main_nav ul li a.blue { width: 93px; background: none; }
#header #main_nav ul li a.green {  width: 102px; background: none; }
#header #main_nav ul li a.yellow {  width: 132px; background: none; }
#header #main_nav ul li a.orange {  width: 92px; background: none; }
#header #main_nav ul li a.red {  width: 84px; background: none; }
#header #main_nav ul li a.purple {  ; width: 101px; background: none; }

#header #main_nav ul li a.blue:hover { background: url(../images/main_nav/nav_sprite.jpg) 0px -37px no-repeat; }
#header #main_nav ul li a.green:hover { background: url(../images/main_nav/nav_sprite.jpg) -93px -37px no-repeat; }
#header #main_nav ul li a.yellow:hover { background: url(../images/main_nav/nav_sprite.jpg) -195px -37px no-repeat; }
#header #main_nav ul li a.orange:hover { background: url(../images/main_nav/nav_sprite.jpg) -327px -37px no-repeat; }
#header #main_nav ul li a.red:hover { background: url(../images/main_nav/nav_sprite.jpg) -419px -37px no-repeat; }
#header #main_nav ul li a.purple:hover { background: url(../images/main_nav/nav_sprite.jpg) -504px -37px no-repeat; }

/* __main */
#main { padding:27px 0 0 53px; height:648px; width:847px; background: url(../images/main_background.png) repeat-y; }
#main h1 { font-family: 'century gothic', arial, helvetica; }
#main h2 { font-family: georgia, arial, helvetica; }

#main #students { height:288px; width:805px; background: url(../images/students.jpg) no-repeat; }
#main #students p { font-family: georgia, arial, helvetica; }
#main #students ul li { font-family: 'trebuchet ms', arial, helvetica; }
#main #students img { margin: 10px 3px 0 0; }

#main #students div.left { height: 286px; width: 342px;}
#main #students .left h1 { padding: 135px 4px 0 0; color: #183687; text-align: center; font-weight: bold; }
#main #students .left .price { font-size: 2.28em; font-weight: normal; }
#main #students .left p { padding:17px 49px 0 45px; color: #747474; text-align: center; font-size: 1.13em; font-style: italic; line-height: 1.1em; }
#main #students .left .free { color: #1c8cb4; }

#main #students div.right { float:right; height: 286px; width: 463px;}
#main #students .right h1 { margin: 15px 26px 0; width: 224px; color: #cff0ff; font-size: 1.2em; line-height: 1.2em; letter-spacing: 0.019em; }
#main #students .right ul { margin: 9px 0 0 62px; color: #ffffff; list-style-image: url('../images/arrow.png'); }
#main #students .right ul li { margin: 0 0 6px 0; }
#main #students .right h1.search { margin: 22px 0 0 50px; color: #ffffff; text-align:center; }
#main #students .right p { margin: 0 0 0 38px; width: 265px; color: #ffffff; font-size: 0.75em; font-family: 'trebuchet ms', arial, helvetica; line-height: 1.2em; }
#main #students .right form { margin: 13px 0 0 86px; }
#main #students .right label { position: relative; top: 3px; left: -262px; color: #ffffff; font-size: 0.8em; }
#main #students .right input { border: none; padding: 2px 5px 0; height:15px; width: 116px; background: transparent; font-size: 0.6em; }
#main #students .right input#search_submit { margin: 0 0 0 7px; height: 21px; width: 64px; cursor: pointer; }

#main #center { height:168px; width:805px; }
#main #center h1 { padding: 30px 0 0 10px; color: #064792; font-size: 1.23em; letter-spacing: 0.025em; }
#main #center p { margin: 3px 0 37px 9px; width: 323px; color: #8a8980; font-family: 'trebuchet ms', arial, helvetica; font-size: 0.88em; line-height: 1.4em; }
#main #center #circle_pics { float:right; margin: 22px 2px 0 0; height: 150px; width:460px; }
#main #center #circle_pics .circle { float: right; width: 113px; text-align: center; }
#main #center #circle_pics .caption { position: relative; top: 11px; margin: 7px 0 0 0; color: #5e5e5e; text-align: center; font-size: .7em; font-family: 'trebuchet ms', arial, helvetica; }

#main #instructors { height:176px; width:805px; background: url(../images/instructors.jpg) no-repeat; }
#main #instructors .right { float: right; margin: -4px 1px 0 0; height: 176px; width: 525px; text-align: center; }
#main #instructors .right h1 { margin: 13px 0 0 0; color: #085aa4; font-size: 1.68em; }
#main #instructors .right h2 { margin: 4px 0 0 0; color: #4a4a4a; font-size: 1.54em; font-style: italic; }
#main #instructors .right .free { color: #d88e00; }
#main #instructors .right p { margin: 1px 0 0 0; color: #767676; font-size: 0.87em; font-family: 'trebuchet ms', arial, helvetica; line-height: 1.63em; }
#main #instructors .right img { margin: 13px 0 0 0; }


/* __footer */

#footer { height:101px; width:896px; background: url(../images/footer_background.png) repeat-y; text-align: center; }
#footer ul { padding: 10px 0 0 0; color: #a0a0a0; font-family: 'trebuchet ms',arial, helvetica; font-size: 0.74em; font-weight: bold; }
#footer ul li { display: inline; }
#footer h1 { margin: 10px 10px 0 0; font-family: 'trebuchet ms', arial, helvetica; font-size: 0.7em; color: #8d8d8d; }
#footer a { color: #a0a0a0; text-decoration: none; }
#footer a:hover { color: #666666; }
#footer img { float: left; position: relative; top: -7px; left: 40px; }

#blue-oxygen {float: left; padding-left: 40px;}

a.srollover {
display: block;
width: 96px;
height: 35px;
background: url("../images/orange-county-website-design.jpg") 0 0 no-repeat;
text-decoration: none;
}
a:hover.srollover {
background-position: 0px -35px;
      }
	  
.srollover span {
	position: absolute;
	right: 10000px;
	font-size: 5px;
}