@import url("editor.css");

body
{
	font-family: Helvetica, Arial, sans-serif;
/*	background: #e3eeea url(../images/bg-footer.jpg) bottom center no-repeat;*/
	background-color: #e3eeea;
	height: 100%;
}

h1
{
	
	width: 419px; 
	height: 110px;
	margin: 50px auto;
	text-indent: -9999px;
	overflow: hidden;
}

h2
{
	color: #1697bc;
	font-size: 1.8em;
	font-weight: normal;
	margin: 30px 0 10px 0;
}

h3
{
	color: #1697bc;
	font-weight: normal;
	font-size: 1.2em;
	margin: 30px 0 5px 0;
}

h3 .note
{
	font-size: .625em;
}

h4
{
	color: #1697bc;
	font-weight: normal;
	font-size: 1em;
	margin: 0 0 5px 0;
}

#footer h4
{
	color: #ffffff;
	font-weight: bold;
	font-size: 1.1em;
	margin-top:9px;
}

ul
{
	margin: 30px 0 0 0;
}

ul li
{
	color: #1697bc;
}

ul li a
{
	text-decoration: none;
	color: #1697bc;
}

ul li a:hover,
ul li a.selected
{
	color: #ff9000;
}

ul li h4
{
/*	font-weight: bold;*/
}

ul.pagination li
{
	float: left;
	font-size: .75em;
	margin: 9px 10px 0 0;
}

ul.pagination li.active
{
	color: #1697bc;
	font-size: 1.4em;
	font-weight: bold;
	margin: 0 10px 0 0;
}

ul.pagination li a:hover
{
	text-decoration: underline;
}

a
{
	color: #1697bc;
}

p
{
	font-size: .825em;
	color: #1697bc;
}

hr
{
	border: 0;
	border-bottom: 1px #9fd5df solid;
	margin: 30px 0 0 0;
}

img
{
	vertical-align:top;
}

/* START MAIN SECTIONS */

#content
{
	background: url(../images/bg-content.jpg) no-repeat;
	width: 1250px;
	margin: 15px auto 0px auto;
}

#content.start
{
	background: url(../images/bg-start-dark.jpg) no-repeat;
}

#header,
#puffs,
#upper, 
#lower,
#footer
{
	width: 954px;
	margin: 0 auto;
	overflow: hidden;
}

#header.start
{
	height: 570px;
}

#nav
{
	width: 954px;
	height: 60px;
	margin: 0;
	padding-left: 30px;
}

#nav li
{
	float: left;
	height: 60px;
	display: inline;
	margin: 0 10px 0 0;
}

#nav li a
{
	font-size: 1.2em;
	padding: 20px 30px 20px 0;
	color: #1697bc;
	text-decoration: none;
	float: left;
	border-bottom: 1px solid #9fd5df;
}

#nav li a:hover, 
#nav li a.selected
{
	color: #ff9000;
	border-bottom: 2px solid #ff9000;
	padding: 20px 30px 19px 0;
}

#subnav
{
	float: left;
	background: url(../images/bg-subnav.jpg) no-repeat;
	width: 955px;
	height: 60px;
	margin: 0;
	padding-left: 30px;
}

#subnav li
{
	float: left;
	height: 60px;
	display: inline;
	margin: 0 10px 0 0;
}

#subnav li a
{
	font-size: 1em;
	padding: 22px 30px 21px 0;
	color: #1697bc;
	text-decoration: none;
	float: left;
}

#subnav li form
{
	float: right;
	padding: 15px 30px 20px 0;
}

#subnav input, 
#subnav select
{
	width: 118px;
}

#subnav li a:hover, 
#subnav li a.selected
{
	color: #ff9000;
	border-bottom: 2px solid #ff9000;
	padding: 22px 30px 20px 0;
}

#subnav .search
{
	margin: 0;
	padding: 10px 60px 0 0;
	float: right;
}

#subnav .button
{
	width: 73px;
}

#puffs
{
	padding: 0 0 30px 0;
}

#upper
{
	background: #ebf3f0 url(../images/bg-upper.jpg) no-repeat;
	min-height: 200px;
}

#upper.register {
	background: transparent url(../images/bg-upper.jpg) no-repeat 0px 3px;
}
/*
#upper.register p {
	font-size: 1em;
	line-height: 1.4em;
}
*/
#lower
{
	background: #e8f1ee url(../images/bg-lower.jpg) no-repeat;
	min-height: 60px;
/*	padding-bottom: 30px;*/
}

#footer
{
	background: #8ac0c5;
	height: 100px;
}

#footer ul
{
	margin:0;
}
#footer ul.left
{
	margin: 0 0 0 30px;
}


#footer ul li
{
	background: #8ac0c5 url(/images/left-line.gif) no-repeat;
	_line-height: 30px;
	color: #ffffff;
	font-size: 0.7em;
	display: inline-table;
	_line-height:30px;
	padding: 20px 0 0 5px;
	margin: 0 20px 0 0;
}

#footer ul.right
{
	margin-right: 10px;
}

#footer ul.right li
{
	background: #8ac0c5 url(/images/bg-blue_line.gif) repeat-y;
	line-height: 10px;
	color: #1a8ead;
	display: inline-table;
	padding: 30px 0 0 5px;
	margin: 0 20px 0 0;
	float:right;
}

#footer ul.right li a
{
	color: #1697bc;
	text-decoration: underline;
}

#history
{
	margin: 30px 0;
}

#history li
{
	margin: 0;
	padding: 5px 15px 4px 15px;
	border-bottom: 1px #abdbe4 solid;
	cursor: pointer;
}

#history li.selected
{
	margin: 0;
	padding: 5px 15px;
	color: #ffffff;
	background: #454545;
	background: -moz-linear-gradient(top, #666666, #333333);
	background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#333333));
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	border: 0;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#history li:hover p
{
	color: #454545;
}

#history li.selected p
{
	color: #ffffff;
	margin: 5px 0;
}

#history li p
{
	margin: 5px 0;
}

#history li p.date
{
	font-size: 1em;
	line-height: 1.2em;
}

#map
{
	background: #ddd;
	margin: 30px 0;
	height: 320px;
}

#stats ul li
{
	padding-bottom: 5px;
	border-bottom: 1px #abdbe4 solid;
}

#stats ul li.misc
{
	padding-bottom: 4px;
}

#stats ul li.misc p
{
	margin: 0 0 5px 0;
}

#stats h3
{
	font-size: 1.5em;
	margin: 30px 0 5px 0;
}

#stats h4
{
	margin-top: 15px;
}

#graph
{
	margin: 30px 0;
	height: 180px;
}

.graph_slider
{
	display: inline-block;	
	background: transparent url('../images/graph_slider_bg.png') no-repeat top right;
	position: relative;
	top: -180px;
	left: 5px;
	width: 570px;
	height: 165px;
}

.graph_slider a
{
	position: absolute;
}

.graph_slider a .slide-handler
{
	background: transparent url('../images/graph_slider_handle.png') no-repeat scroll 50% 50%;
	position: absolute;
	top: 0;
	left: 0;
	width: 10px;
	height: 165px;
	cursor: pointer;
}

.graph_slider .fill
{
	height: 100%;
	width: 0%;
	position: absolute;
	background: transparent url('../images/graph_slider_bg.png') no-repeat bottom left;
}


#results
{
	margin-top: 10px;
}

#results .item
{
	float: left;
	margin: 10px 10px 0 0;
}

#results .item img
{
	margin: 0 0 5px 0;
}

#results h4
{
	font-size: .625em;
	font-weight: bold;
	margin-bottom: 3px;
	text-transform: uppercase;
}

#results p
{
	font-size: .625em;
	margin-bottom: 10px;
}

/* START FORMS */

input, 
select, 
textarea,
button
{
	padding: 3px 6px 3px 6px;
	margin: 5px 0;
	width: 189px;
	height: 20px;
	color: #ffffff;
	background: #555555;
	background: -moz-linear-gradient(top, #777777, #444444);
	background: -webkit-gradient(linear, left top, left bottom, from(#777777), to(#444444));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 0px #333333 solid;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

textarea
{
	height: 82px;
}

fieldset
{
	margin: 30px 0 0 0;
}

label
{
	display: block;
	color: #1697bc;
	margin: 10px 0 0 0;
}

.button
{
	margin-top: 7px;
	width: 201px;
	height: 26px;
	cursor: pointer;
	text-shadow: 0 1px 0 #000000;
	text-transform: uppercase;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

/*
.dialog_button
{
	margin-top: 7px;
	width: 201px;
	height: 26px;
	cursor: pointer;
	background: transparent;
	background: #1697bc;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	text-shadow: 0 1px 0 #000000;
	text-transform: uppercase;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}
*/
select.button
{
	padding: 5px 6px 5px 6px;
	margin: 5px 0;
}

#reg
{
	/*
	background: url(../images/pennant_rounded.png) no-repeat bottom;
	padding: 0 38px 75px 39px;
	margin:-10px 0 0 30px;
	*/
	
	background: url(../images/pennant_rounded.png) no-repeat;
	padding: 0 40px 75px 40px;
	margin: -10px 0 0 30px;
}

#user,
#login,
#register
{
	background: #555555;
	background: -moz-linear-gradient(top, #444444, #777777);
	background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#777777));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 0;
}

#user
{
	position:relative;
	color: #ffffff;
	background: #555555 url() no-repeat top right;
	height: 60px;
	margin: 30px 0 0 0;
}

#user a
{
	color: #ffffff;
	text-decoration: none;
}

#user p
{
	font-size: .75em;
	line-height: 1.2em;
	color: #ffffff;
	padding: 4px 10px;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#user hr
{
	color: #555555;
	background-color: #555555;
	border: 0;
	border-top: 1px #4c4c4c solid;
	border-bottom: 1px #6c6c6c solid;
	margin: 0 60px 0 0;
}

#user_menu_list
{
	background: #666666;
	background: -moz-linear-gradient(top, #666666, #999999);
	background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#999999));
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	position:absolute;
	top:61px;
	font-size: .75em;
	padding: 3px 10px;
	margin: 0;
	width: 121px;
	display: none;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#user_menu_list p
{
	font-size: 1em;
	line-height: 1em;
	color: #ffffff;
	padding: 4px 0;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#user_menu_list p a
{
	color: #eeeeee;
	padding: 5px 0 0 0;
}

#user_menu_list p a:hover
{
	color: #ffffff;
	padding: 5px 0 0 0;
}

#user_menu_list hr
{
	padding: 0;
	margin: 0;
}

#register
{
	margin: 0;
	padding-top: 10px;
}

#login hr,
#register hr
{
	color: #555555;
	background-color: #555555;
	border: 0;
	border-top: 1px #4c4c4c solid;
	border-bottom: 1px #6c6c6c solid;
	margin: 0;
}

#login input
{
	background: transparent;
	border: 0;
	padding: 0 6px;
	margin: 5px 0;
	width: 110px;
	height: 16px;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

a.forgot_password
{
	text-decoration:none;
	font-size:12px;
	margin:0 4px;
}

#register input
{
	background: transparent;
	border: 0;
	padding: 0 6px;
	margin: 5px 0;
	width: 189px;
	height: 16px;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.register_select
{
	background: #444444;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
	width: 201px;
	padding: 3px;
	height: 24px;
	
}

.login_button
{
	width: 124px;
	height: 24px;
	padding: 3px;
	border: 0;
	cursor: pointer;
	text-shadow: 0 1px 0 #000000;
	text-transform: uppercase;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.register_button
{
	width: 201px;
	height: 24px;
	padding: 3px;
	border: 0;
	cursor: pointer;
	text-shadow: 0 1px 0 #000000;
	text-transform: uppercase;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#footer .left li
{
	vertical-align:top;
	float:left;
}
#send_invite input
{
	width: 154px;
	margin-right: 5px;
}

#send_invite button
{
	padding: 0;
	margin: 0 0 20px 0;
	width: 25px;
	height: 25px;
}

#make_public label
{
	height: 20px;
	padding: 1px 3px 5px 3px;
	margin: 5px -5px 5px 0;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

#news_letter label
{
	height: 20px;
	padding: 1px 3px 5px 3px;
	margin: 5px -5px 5px 0;
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

/* START MODULES */

#splash
{
	color: #fff;
	margin-top: 160px;
}

#splash h2
{
	text-transform: uppercase;
	font-size: 2.4em;
	color: #fff;
}

#splash p
{
	font-size: 0.8em;
	color: #fff;
}

#profile img
{
	margin: 30px 0 0 0;
}

.coach h2
{
	font-size: 1.5em;
}

.coach li
{
	font-size: .825em;
}

.coach li h4
{
	font-size: 1.25em;
}

/* START UI ELEMENTS */

.range
{
	display: inline-block;	
	background: transparent url('../images/range-track.png') no-repeat top right;
	height: 10px;
	top: -10px;
	position: relative;
	margin: 15px 10px;
}

.range a
{
	position: absolute;
}

.range a .range-handler
{
	background: transparent url('../images/range-handle.png') no-repeat scroll 50% 50%;
	width: 30px;
	height: 30px;
	position: absolute;
	top: -10px;
	left: -15px;
	cursor: pointer;
}

.range .fill
{
	height: 100%;
	width: 0%;
	position: absolute;
	background: transparent url('../images/range-track.png') no-repeat bottom left;
}

.panel
{
	position: relative;
	margin: 10px 0;
	width: 890px;
	overflow: hidden;
	z-index: 1;
}

.panel .holder {
	position: relative;
	top: 0px;
	left: 0px;
	width: 960px;
	margin-top: 10px;
}

.panel .holder .element
{
	padding: 0;
	margin: 10px 10px 0 0;
	float: left;
}

.panel .holder .element img
{
	margin: 0 0 5px 0;
}

.panel .holder h4
{
	font-size: .625em;
	font-weight: bold;
	margin-bottom: 3px;
	text-transform: uppercase;
}

.panel .holder p
{
	font-size: .625em;
	margin-bottom: 10px;
}

.slider
{
	display: inline-block;	
	background: transparent url('../images/slider-track.png') no-repeat top right;
	width: 890px;
	height: 15px;
	top: -15px;
	position: relative;
	margin: 10px 0 10px 0;
}

.slider a
{
	position: absolute;
}

.slider a .slide-handler
{
	background: transparent url('../images/slider-handle.png') no-repeat scroll 50% 50%;
	width: 15px;
	height: 15px;
	position: absolute;
	top: 0;
	left: -7px;
	cursor: pointer;
}

.slider .fill
{
	height: 100%;
	width: 0%;
	position: absolute;
	background: transparent url('../images/slider-track.png') no-repeat bottom left;
}

.submenu
{
	height: 40px;
}

.submenu li
{
	float: left;
	height: 40px;
	display: inline;
	margin: 0 10px 0 0;
}

.submenu li a
{
	font-size: 1em;
	padding: 12px 30px 10px 0;
	color: #1697bc;
	text-decoration: none;
	float: left;
}

.submenu li a:hover, .submenu li a.selected
{
	color: #ff9000;
	border-bottom: 2px solid #ff9000;
}

li .right
{
	margin: 0;
}

.filled
{
	color: #ddd;
	background-color: #ddd;
	margin-top: 10px;
	margin-bottom: 10px;
}

.huge
{
	margin: 10px 0 0 0;
	font-size: 4.4em;
	font-weight: bold;
}

.big
{
	margin: 10px 0 0 0;
	font-size: 3em;
	font-weight: bold;
}

.big .unit
{
	font-size: .4em;
}

.medium
{
	margin: 10px 0 0 0;
	font-size: 2em;
	font-weight: bold;
}

.medium .unit
{
	font-size: .45em;
}

.small
{
	margin: 17px 0 0 0;
	font-size: 1.5em;
}

.tiny
{
	margin: 19px 0 0 0;
	font-size: 1em;
}

.unit
{
	font-size: .3em;
}

.puff
{
	font-size: .85em;
	line-height: 1.25em;
}


.black
{
	color: #555555 !important;
}

.red
{
	color: #f66c19 !important;
}

.yellow
{
	color: #e4c101 !important;
}

.drop
{
	text-shadow: 0 1px 0 #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.shadow
{
	-moz-box-shadow: 2px 2px 2px #d5eef4;
	-webkit-box-shadow: 2px 2px 2px #d5eef4;
	box-shadow: 2px 2px 2px #d5eef4;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#d5eef4')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#d5eef4');
}

.trans { -moz-opacity:.75; filter:alpha(opacity=75); opacity:.75; }

/* START JQUERY UI SPECIFIC */

.ui-datepicker
{
	width: 197px;
}

.ui-datepicker td a
{
	font-size: 1.25em;
	height: 20px;
}

.ui-datepicker-title
{
	font-size: 1.25em;
}

.ui-dialog
{
	background: #555555;
	background: -moz-linear-gradient(top, #666666, #333333);
	background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#333333));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	
	-moz-box-shadow: 0px 0px 5px #000000;
	-webkit-box-shadow: 0px 0px 5px #000000;
	box-shadow: 0px 0px 5px #000000;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#000000');
	
	padding: 10px 0 0 0;
}

.ui-dialog p
{
	margin: 20px 0;
	font-size: 1.25em;
	color: #ffffff;
}

.ui-dialog p a
{
	color: #1697bc;
}

.ui-dialog .ui-widget-header
{
	background: transparent;
	font-size: 1.75em;
	padding: 0 10px;
}