/*
===============================================
Imported Styles
=============================================== */
/* /css/base2.css
 *
 * - Elements
 *   - *
 *   - html
 *   - body
 *   - select
 *
 * - Major Class
 *   - .spinner (usually div)
 *   - .error
 *   - .alignLeft, .alignRight
 *   - .marginTop0
 *   - .wrapper
 *   - .clear
 *   - .tooltip
 *   - div.divSubmit, input[type="submit"]
 *   - div.header, div.header div.cancel
 *
 * - header
 *   + nav
 *
 * - Main Content (#content)
 *
 * - footer
 *   + #backgroundPatternId
 *   + .copy
 *   + nav
----------------------------------------------- */
@import url("/css/base2.css");

/* /runners/css/running_form.css
 * Running Form
----------------------------------------------- */
@import url("/runners/css/running_form.css");


/*
===============================================
Elements
=============================================== */
h1	{
	position:relative;
	width:698px;
	padding:16px;
	margin-bottom:20px;
	float:left;
	font-size:120%;
	font-weight:bold;
	color:#FFFFFF;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}


/*
===============================================
Class
=============================================== */
div.sport	{
	width:24px;
	height:24px;
	background-image:url(/img/icons_24x24.png);
}

div.scroll	{
	overflow:auto;
}

p.title	{
	width:100%;
	text-align:center;
	margin:0 0 20px 0;
}

p.notice	{
	color:#FC0;
}



/*
===============================================
Top Box
Second Box
=============================================== */
#topBox,
#secondBox	{
	position:relative;
	width:100%;
	float:left;
	margin-bottom:20px;
}


/*
===============================================
Basic Section/Div
=============================================== */
#calendar,
#user,
#plans,
#bests,
#comments,
#medias,
#lap,
#bottomBox	{
	float:left;
	padding:16px;
	color:#FFFFFF;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

/*
===============================================
Calendar
=============================================== */
#calendar	{
	position:relative;
	width:308px;
	height:344px;
	margin-right:20px;
}
#calendar table.calendar	{
	border-collapse:separate;
	border-spacing:0px;
}
#calendar table.calendar th	{
	width:40px;
	height:40px;
	font-size:120%;
	font-weight:normal;
	text-align:center;
}
#calendar table.calendar th.sunday	{
	color:#F00;
}
#calendar table.calendar th.saturday	{
	color:#09F;
}
#calendar table.calendar th.titleYearMonth	{
	font-weight:bold;
}
#calendar table.calendar th.goToPreviousMonth,
#calendar table.calendar th.goToNextMonth	{
	cursor:pointer;
}
#calendar table.calendar td	{
	width:40px;
	height:40px;
	font-size:120%;
	font-weight:bold;
	text-align:center;
	border-style:solid;
	border-width:2px;
	border-color:transparent;
	cursor:default;
}
#calendar table.calendar td.previousMonth, 
#calendar table.calendar td.nextMonth	{
	color:#CCC;
	font-weight:normal;
}
#calendar table.calendar td.comingDate	{
	color:#CCC;
}
#calendar table.calendar td.done	{
	color:#FC0;
	cursor:pointer;
}
#calendar table.calendar td.done.race	{
	color:#F00;
}
#calendar table.calendar td.currentDate	{
	border-color:#F0F;
}


/*
===============================================
User
=============================================== */
#user {
	position:relative;
	width:338px;
	height:344px;
}
#user h1	{
	width:auto;
	padding:0;
	margin:0;
	margin-bottom:0.5em;
	background-image:none;
	font-size:150%;
	font-weight:bold;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
}
#user div.info	{
	width:100%
	height:150px;
}
#user div.info img	{
	margin-right:16px;
	float:left;
}
#user div.info table	{
	border-collapse:collapse;
	font-size:92%;
}
#user div.info table th	{
	color:#EEE;
	padding:0.3em 0;
}
#user div.info table td {
	padding:0.3em 0 0.3em 0.75em;
}
#user div.info table tr.sex div	{
	width:24px;
	height:24px;
	background-image:url(/img/icons_24x24_2.png);
}
#userWhoAmI	{
	position:absolute;
	left:16px;
	bottom:48px;
	width:338px;
	max-height:100px;
	overflow:auto;
	font-size:92%;
	background-color:rgba(59,67,68,0.7);
}
#user div.buttons	{
	position:absolute;
	left:16px;
	bottom:14px;
	width:338px;
}
#user div.buttons div.buttonDirectMail	{
	width:218px;
	height:20px;
	float:right;
	background-image:url(/img/runners/blog/direct_mail_2.png);
	cursor:pointer;
}


/*
===============================================
Direct Mail
=============================================== */
#DirectMail	{
	position:absolute;
	top:0px;
	left:0px;
	width:698px;
	height:344px;
	padding:16px;
	color:#FFF;	
	background-color:rgba(57, 84, 117, 0.9);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

#DirectMail table	{
	margin-top:1em;
	margin-bottom:1em;
	width:100%;
	border-style:solid;
	border-width:1px;
	border-color:#CCC;
	border-collapse:collapse;
}
#DirectMail table.login	{
	width:500px;
	margin:0 auto;
}
#DirectMail	table th, 
#DirectMail	table td	{
	padding:0.5em;
	border-style:solid;
	border-width:1px;
	border-color:#CCC;
}
#DirectMail	table.login th	{
	width:120px;
}
#DirectMail	table th	{
	width:170px;
	background-color: rgba(51,153,0,0.6);
	text-align:right;
}
#DirectMail	table td {
	text-align:left;
}

#DirectMail input[type="text"],
#DirectMail input[type="password"],
#DirectMail textarea	{
	width:95%;
	padding:0.5em;
	color:#FFF;
	background-color:#374151;
	border-style:solid;
	border-width:1px;
	border-color:#999;
}
#DirectMail textarea	{
	height:72px;
	resize:none;
}

#DirectMail	div.divSubmit	{
	text-align:center;
}
#DirectMail	div.divSubmit input[type=button]	{
	padding:0.25em 1em;
}


/*
===============================================
Plan
Bests
=============================================== */
#plans,
#bests	{
	max-height:200px;
}
#plans	{
	width:240px;
	margin-right:20px;
}
#bests	{
	width:406px;
}

#plans p:first-child,
#bests p:first-child,
#comments p:first-child {
	display:block;
	width:100%;
	height:20px;
	text-align:center;
	margin-top:0px;
	margin-bottom:8px;
}
#plans p.title,
#bests p.title {
	margin-top:16px;
}
#plans div.scroll,
#bests div.scroll	{
	max-height:170px;
}
#plans table,
#bests table	{
	width:100%;
	border-style:solid;
	border-width:1px;
	border-color:#CCC;
	border-collapse:collapse;
	font-size:80%;
}
#plans	table th, 
#plans	table td,
#bests	table th, 
#bests	table td	{
	padding:0.3em;
	border-style:solid;
	border-width:1px;
	border-color:#CCC;
}
#plans	table th,
#bests	table th	{
	background-color: rgba(51,153,0,0.6);
	text-align:center;
}
#plans	table td,
#bests	table td {
	text-align:left;
}
#bests	table td.alignRight {
	text-align:right;
}
#plans table tr.race	{
	background-color:rgba(153, 0, 0, 0.6);
}


/*
===============================================
Log
=============================================== */
#log	{
	position:relative;
}
article	{
	position:relative;
	width:698px;
	padding:16px;
	margin-bottom:8px;
	float:left;
	color:#FFFFFF;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
article p:not(:first-child)	{
	margin-top:1em;
}
article strong	{
	font-weight:bold;
}
article em	{
	font-style:italic;
}
article ul	{
	margin-left:0;
	padding-left:1em;
	list-style:disc;
}

a:link, 
a:visited	{
	color:#FF0;
}
a:hover	{
	color:#FC0;
}

article header	{
	padding:0;
	margin-bottom:2em;
	background-color:transparent;
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-bottom-color:#666;
}
article header>div	{
	width:100%;
}
article header>div time	{
	float:left;
	margin-right:10px;
	font-weight:bold;
}
article header>div p.race	{
	float:left;
	margin-top:0;
	font-weight:bold;
	color:#F00;
}
article header h1	{
	float:none;
	width:auto;
	padding:0;
	margin:0.5em 0 1em 0;
	background-image:none;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
}

#buttonToFacebook	{
	float:right;
	width:53px;
	height:26px;
	background-image:url(/img/to_facebook.png);
	cursor:pointer;
}
#facebookUserFeed	{
	position:absolute;
	top:0px;
	left:0px;
	width:698px;
	padding:16px;
	color:#FFF;	
	background-color:rgba(57, 84, 117, 0.9);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
#facebookUserFeed table	{
	width:100%;
}
#facebookUserFeed th	{
	width:90px;
	padding:0.25em 1em 0.25em 0;
	text-align:right;
}
#facebookUserFeed td	{
	padding:0.25em;
}
#facebookUserFeed td.submit	{
	width:70px;
	text-align:right;
}
#facebookUserFeed td.submit input[type=button]	{
	padding:0.25em 1em;
}
#facebookUserFeed textarea	{
	width:96%;
	height:50px;
	padding:0.5em;
	color:#FFF;
	background-color:#374151;
	border-style:solid;
	border-width:1px;
	border-color:#999;
	resize:none;
}
#facebookUserFeedContent	{
	border-style:solid;
	border-color:#999;
	border-width:1px;
}
#facebookUserFeedContent img	{
	float:left;
	width:200px;
	height:auto;
	margin-right:1em
}
#facebookUserFeedContent h1	{
	float:none;
	width:auto;
	padding:0;
	margin:1em;
	background-image:none;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
	font-size:100%;
	font-weight:normal;
}
#facebookUserFeedContent p	{
	margin:1em;
	font-size:92%;
}


/*
===============================================
Ratings
=============================================== */
#ratings	{
	position:relative;
	width:730px;
	margin-bottom:20px;
	float:left;
	color:#FFFFFF;
}
#ratings div.md2Button	{
	width:200px;
	height:24px;
	float:left;
	background-image:url(/img/runners/blog/md2.png);
	cursor:pointer;
}
#ratings p	{
	float:right;
	color:#374151;
}


/*
===============================================
Comments
=============================================== */
#comments	{
	position:relative;
	width:698px;
	margin-bottom:20px;
}

#comments article,
#commentInput	{
	float:none;
	width:auto;
	padding:8px;
	margin:8px 0 0 0;
	border-style:solid;
	border-width:1px;
	border-color:#999;
	background-image:none;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}

#comments article header	{
	padding:0.5em;
	margin-bottom:1em;
}
#comments article header h1	{
	float:left;
	margin:0 24px 0 0;
	font-size:100%;
}
#comments article header time	{
	float:left;
}
#comments article header div.buttonReply	{
	width:24px;
	height:24px;
	float:right;
	margin:0;
	background-image:url(/img/icons_24x24_2.png);
	background-position:-192px 0px;
	cursor:pointer;
}

#commentInput div.header div.moveBottom	{
	width:24px;
	height:24px;
	float:right;
	background-image:url(/img/icons_24x24_2.png);
	background-position:-216px 0px;
	cursor:pointer;
}
#commentInput table	{
	width:100%;
}
#commentInput th	{
	width:130px;
	padding:0.25em 1em 0.25em 0;
	text-align:right;
}
#commentInput td	{
	padding:0.25em;
}
#commentInput td.submit	{
	width:90px;
	text-align:right;
}
#commentInput textarea,
#commentInput input[type=text]	{
	width:95%;
}
#commentInput textarea	{
	height:200px;
}
#commentInput input[type=text]	{
	padding:0.25em 0.5em;
	color:#FFF;
	background-color:#374151;
	border-style:solid;
	border-width:1px;
	border-color:#999;
}


/*
===============================================
Medias
=============================================== */
#medias	{
	position:relative;
	width:698px;
	margin-bottom:20px;
}
#medias div:not(:last-child)	{
	margin-bottom:16px;
}
#medias img,
#medias iframe	{
	float:left;
	margin:0 10px 0 0;
	border-style:solid;
	border-width:10px;
	border-color:#FFF;
}


/*
===============================================
Information
=============================================== */
#info	{
	width:710px;
	height:32px;
	margin-bottom:20px;
	padding:4px 10px;
	float:left;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
#info select	{
	margin-right:10px;
	float:left;
	font-size:120%;
	font-weight:bold;
	border-style:none;
}
#info div.summary	{
	float:left;
}
#info div.sport	{
	margin-top:4px;
	margin-right:10px;
	float:left;
}
#info p	{
	margin-top:7px;
	font-size:100%;
}
#info p.summary {
	float:left;
	color:#FFF;
	font-weight:bold;
}
#info div.weather	{
	margin-left:20px;
	float:left;
}
#info p.weather	{
	float:left;
	color:#FFF;
	font-weight:normal;
}
#info p.race {
	margin-top:8px;
	margin-right:0;
	float:right;
	color:#F00;
	font-size:92%;
	font-weight:bold;
}


/*
===============================================
GARMIN Branding
=============================================== */
div.garminBranding {
	margin-bottom:20px;
}


/*
===============================================
Lap
=============================================== */
#lap	{
	position:relative;
	width:698px;
	font-size:75%;
}

#lap table	{
	width:100%;
	border:1px solid #CCC;
	border-collapse:collapse;
}
#lap table tr.total	{
	background-color:rgba(153, 0, 0, 0.6);
}
#lap table tr.rest	{
	background-color:rgba(0, 51, 102, 0.6);
}
#lap table th,
#lap table td	{
	border: 1px solid #CCC;
	padding: 0.3em;
}
#lap table th	{
	background-color: rgba(51,153,0,0.6);
	font-weight: normal;
	text-align: center;
}
#lap table td	{
	text-align:right;
}


/*
===============================================
Map
=============================================== */
#map {
	color:#FFFFFF;
	float:left;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}


/*
===============================================
Chart
=============================================== */
#chart {
	position:relative;
/*	width:729.6px;*/
	width:730px;
	height:376px;
	color:#FFFFFF;
	float:left;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
#chart select	{
	border-style:solid;
	border-width:1px;
}


/*
===============================================
Sports Selector
=============================================== */
#sportsSelector	{
	position:absolute;
	width:24px;
	height:24px;
	border-width:1px;
}
#sportsSelector div.icon {
	float:left;
	width:24px;
	height:24px;
	cursor:pointer;
}


/*
===============================================
Lap
=============================================== */
#bottomBox	{
	position:relative;
	width:698px;
}
#bottomBox div.blogWidget	{
	float:right;
	border-style:none;
	line-height:0;
}

#longTermData	{
	float:left;
}
#longTermData>div	{
	margin-bottom:20px;
}
#monthlyData,
#dailyData1	{
	width:100%;
	height:145px;
}
#weight	{
	width:100%;
	height:310px;
}
#monthlyData	p,
#weight			p,
#dailyData1		p	{
	display:block;
	height:20px;
	text-align:center;
}

#monthlyData	div.chart,
#weight			div.chart,
#dailyData1		div.chart	{
	width:100%;
	height:124px;
	margin-bottom:20px;
}

/* Running Form
----------------------------------------------- */
div.runningForm {
	margin-top:12px;
}