﻿/*
===============================================
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");


/*
===============================================
Elements
=============================================== */
section {
	width:698px;
	padding:16px;
	margin-bottom:20px;
	color:#FFFFFF;
	float:left;
	background-image:url(/img/patterns/denim.png);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
}
section:last-child	{
	margin-bottom:0;
}
section header {
	width:100%;
	margin-bottom:16px;
	background-color:transparent;
}

h1	{
	float:left;
	font-size:150%;
	font-weight:bold;
	color:#FFFFFF;
}

select	{
	border-style:none;
}

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


/*
===============================================
Major Class
=============================================== */
.notice	{
	color:#999;
	font-size:80%;
}
.alignCenter	{
	text-align:center;
}

.marginTop0	{
	margin-top:0;
}


/*
===============================================
content
=============================================== */
#content	{
	min-height:100px;
}


/*
===============================================
evaluation
=============================================== */
div.evaluation p	{
	margin-left:10px;
	float:right;
	font-size:120%;
	font-weight:bold;
}
div.evaluation div	{
	width:120px;
	height:24px;
	float:right;
	background-image:url(/img/runners/race/evaluation_120x24.png);
}


/*
===============================================
information
=============================================== */
#information div.evaluation {
	float:right;
}
#information table	{
	table-layout:fixed;
	width:100%;
	border:1px solid #CCC;
	border-collapse:collapse;
}
#information table th,
#information table td	{
	border: 1px solid #CCC;
	font-weight: normal;
	padding: 0.3em;
}
#information table th	{
	background-color: rgba(51,153,0,0.6);
	text-align: center;
}
#information table td	{
	text-align:left;
}
#information table td.totalDistance	{
	text-align:center;
}
#information table td.undulation		span,
#information table td.airCleanliness	span,
#information table td.obstruction		span	{
	display:none;
}
#information table td.undulation		div,
#information table td.airCleanliness	div,
#information table td.obstruction		div	{
	margin:auto auto;
	width:24px;
	height:24px;
	background-image:url(/img/runners/training/icons_training.png);
}
#information p.notice	{
	margin-top:8px;
}


/*
===============================================
courses
=============================================== */
#courses header	{
	font-size:120%;
	font-weight:bold;
	margin-bottom:8px;
}
#courses header select	{
	margin-right:8px;
	float:left;
	border-style:solid;
	border-width:1px;
	border-color:#999;
}
#courses header p	{
	margin-top:4px;
}
#courses header p.distance	{
	float:left;
}
#courses header p.postedBy	{
	float:right;
}

#sportsSelector	{
	width:100%;
	height:24px;
	margin:0 0 16px 0;
	border-width:1px;
}
#sportsSelector div.icon {
	float:left;
	width:24px;
	height:24px;
	cursor:pointer;
}

#map {
	width:698px;
	height:580px;
	float:left;
}
#map.withVideo {
	height:400px;
}

#chart {
	position:relative;
	width:698px;
	height:180px;
	float:left;
}


/*
===============================================
comments
=============================================== */
#comments > header	{
	height:20px;
	text-align:center;
	margin-top:0px;
	margin-bottom:16px;
}
#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 0;
	margin-bottom:1em;
	background-color:transparent;
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-bottom-color:#666;
}
#comments article header h1	{
	margin:0 24px 0 0;
	font-size:100%;
}
#comments article header time	{
	float:left;
}
#comments article header div.evaluation {
	float:right;
}
#comments article div.contents	{
	width:100%;
}
#comments article div.contents img	{
	float:right;
	margin:0 0 0 10px;
	border-style:solid;
	border-width:10px;
	border-color:#FFF;
}
#comments article div.contents p	{
	margin-top:1em;
}
#comments article div.contents img + p,
#comments article div.contents p:first-child	{
	margin-top:0em;
}
article strong	{
	font-weight:bold;
}
article em	{
	font-style:italic;
}
article ul	{
	margin-left:0;
	padding-left:1em;
	list-style:disc;
}
#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;
}

/* jQuery UI Slider
----------------------------------------------- */
#commentEvaluation div	{
	width:200px;
	margin:6px 20px 2px 10px;
	float:left;
}
#commentEvaluation p	{
	margin-top:5px;
	float:left;
}
#commentEvaluation .ui-widget-content	{
	background:#374151;
}


/*
===============================================
videos
=============================================== */
#videos ul	{
	margin-top:0.5em;
	margin-left:0;
	padding-left:1.5em;
	list-style:disc;
}

#videos strong {
	font-weight:bold;
	color:#FC0;
}

/*
===============================================
originalContents
=============================================== */
#originalContents	{
	font-size:100%;
}
#originalContents p:not(:first-child)	{
	margin-top:1em;
}
#originalContents div:not(:first-child)	{
	margin-top:2em;
}
#originalContents div.midDiv	{
	margin-top:0;
}
#originalContents div.midDiv img	{
	margin-bottom:0;
}
#originalContents h2	{
	font-size:120%;
	font-weight:bold;
}
#originalContents img,
#originalContents span.floatRight	{
	margin:1em 0 1em 1em;
	float:right;
}
#originalContents img.marginTop0	{
	margin-top:0;
}
#originalContents ol	{
	margin-left:0;
	padding-left:2em;
	list-style:decimal;
}
#originalContents table	{
	width:100%;
	border:1px solid #CCC;
	border-collapse:collapse;
	margin-top:0.5em;
}
#originalContents table th,
#originalContents table td	{
	border: 1px solid #CCC;
	font-weight: normal;
	padding: 0.3em;
}
#originalContents table th	{
	background-color: rgba(51,153,0,0.6);
	text-align: center;
}
#originalContents header	{
	margin-bottom:24px;
	font-size:120%;
	font-weight:bold;
}
#originalContents header p.title,
#originalContents header p.postedBy	{
	margin-top:0;
}
#originalContents header p.title	{
	float:left;
}
#originalContents header p.postedBy	{
	float:right;
}


/*
===============================================
relatedLinks
=============================================== */
#relatedLinks header	{
	font-size:120%;
	font-weight:bold;
}
#relatedLinks li:not(:first-child)	{
	margin-top:1em;
}