@import url("https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,800,900");

/* General */
body {margin:0; padding:0; border:0; width:100%; background: #222833;}
body, input, select, textarea {margin:0; padding:0; border:0; width:100%; color:#555555; font-size:100%; font-weight:300; line-height:1.75em; font-family:'Raleway',arial,helvetica,sans-serif; }

*, ::before, ::after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

h1, h2, h3, h4 {padding:0; /*clear:both;*/}
p {margin:0; padding:0;}
img {margin:0; border:0;}
.clearfloats {clear: both; margin:0;}

a {color: #2d72b8; text-decoration: underline;}
a:hover {text-decoration: none;}
strong, b {font-weight: 900;}
.heavy {font-weight:450;}
em, i {font-style: italic;}
p, ul, ol, dl, table, blockquote {margin: 0 0 15px 0;}
h1, h2, h3, h4, h5, h6 {color: inherit; font-weight: 600; line-height: 1.75em; margin-top:0; margin-bottom:0;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: inherit;	text-decoration: none;}
h2 {font-size: 2.5em; margin: 0 0 15px 0;} 
#content h2 {text-align:center;}
h3 {font-size: 1.25em;}
sub {font-size: 0.8em; position: relative; top: 0.5em;}
sup {font-size: 0.8em; position: relative; top: -0.5em;}
hr {border-top: solid 1px #888888; border: 0; margin-bottom: 1.5em;}
blockquote {border-left: solid 0.5em #888888; font-style: italic; padding: 1em 0 1em 2em;}
section.special, article.special {text-align: center;}
footer > :last-child {margin-bottom: 0;}
footer.major {padding-top: 3em;}

/* =Clearfix
--------------------------------------------------------------------------------------------------------*/
 .clear {clear: both;}
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
* html .clearfix {height:1%;}
/*.clearfix {display:block;}*/
.alignleft {float:left;}
.alignright, .alignRight {float:right;}
.aligncenter {margin:auto; display:block;}
.centered {text-align:center;}
/* End Clearfix
--------------------------------------------------------------------------------------------------------*/

/* Column widths */
.colWidth20 {width:20%;}
.colWidth25 {width:25%;}
.colWidth30 {width:30%;}
.colWidth33 {width:33.3333333333%;}
.colWidth40 {width:40%;}
.colWidth50 {width:50%;}
.colWidth60 {width:60%;}
.colWidth66 {width:66.6666666667%;}
.colWidth75 {width:75%;}
.colWidth100 {width:100%;}

/* Form */
input[type="text"], input[type="password"], input[type="email"], textarea {-moz-appearance: none; -webkit-appearance: none; -o-appearance: none; -ms-appearance: none; appearance: none; background: none; border: solid 1px #888888; color: inherit; display: block; outline: 0; padding: 0.5em; text-decoration: none; width: 100%;}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus {border-color: #2d72b8;}
input[type="text"], input[type="password"], input[type="email"] {line-height: 1em;}
::-webkit-input-placeholder {color: inherit; opacity: 0.5; position: relative; top: 3px;}
:-moz-placeholder {color: inherit; opacity: 0.5;}
::-moz-placeholder {color: inherit; opacity: 0.5;}
:-ms-input-placeholder {color: inherit; opacity: 0.5;}
.formerize-placeholder {color: rgba(85, 85, 85, 0.5) !important;}

/* Image */

.image {border: 0; position: relative;}
.image.fit {display: block;}
.image.fit img {display: block; width: 100%;}
.image.feature {display: block; margin: 0 0 2em 0;}
.image.feature img {display: block; width: 100%;}

/* Icon */

.icon {position: relative;}
.icon:before {content: ""; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-family: FontAwesome; font-style: normal; font-weight: normal; text-transform: none !important;}
.icon > .label {display: none;}

/* Lists */

ol.default {list-style: decimal; padding-left: 1.25em;}
ol.default li {padding-left: 0.25em;}
ul.default {list-style: none;padding-left: 15px;}
ul.default li {display: block; padding: 0.60em 0; border-top: 1px solid; border-color: rgba(192, 192, 192, 0.15);}
ul.default > :first-child {padding-top: 0; border-top: none;}
ul.icons {cursor: default;}
ul.icons li {display: inline-block; line-height: 1em; padding-left: 0.5em;}
ul.icons li:first-child {padding-left: 0;}
ul.actions {cursor: default;}
ul.actions:last-child {margin-bottom: 0;}
ul.actions li {display: inline-block; padding: 0 0 0 1.5em;}
ul.actions li:first-child {padding: 0;}
ul.actions.vertical li {display: block; padding: 1.5em 0 0 0;}
ul.actions.vertical li:first-child {padding: 0;}
ul.contact {list-style: none;}
ul.contact li {padding: 1.05em 0; border-top: 1px solid; border-color: rgba(192, 192, 192, 0.15);}
ul.contact li > span {display: inline-block;}
ul.contact li .address, ul.contact li .mail, ul.contact li .phone {float: left; width: 100px; font-weight: 600;}
ul.contact > :first-child {padding-top: 0; border-top: none;}
ul.style li {clear: both; display: block; padding-top: 3em;}
ul.style > :first-child {padding-top: 0;}
ul.style h3 {display: block; margin: 0; padding-bottom: 0.50em; font-size: 1.1em; font-weight: 700; color: #404040;}
ul.style .fa {float: left; display: inline-block; width: 80px; height: 80px; margin-right: 1em; background: #2d72b8; line-height: 80px; text-align: center; border-radius: 10px; font-size: 2em; color: white;}
ul.list {list-style: none;}
ul.list li {display: block; padding: 0.60em 0; border-top: 1px solid; border-color: red;}
ul.list > :first-child {padding-top: 0; border-top: none;}#main 
#main ul {font-size:120%;}
#main ul li {margin:0 0 5px 0;}
#main ol {font-size:120%;}
#main ol li {margin:0 0 5px 0;}

/* Tables */

table {width: 100%;}
table.default {width: 100%;}
table.default tbody tr {border-bottom: solid 1px #888888;}
table.default td {padding: 0.5em 1em 0.5em 1em;}
table.default th {font-weight: 700; padding: 0.5em 1em 0.5em 1em; text-align: left;}
table.default thead {background: #555555; color: #fff;}

/* Button */

input[type="submit"], input[type="reset"], input[type="button"], .button {-moz-appearance: none; -webkit-appearance: none; -o-appearance: none; -ms-appearance: none; appearance: none; -moz-transition: background-color 0.2s ease-in-out; -webkit-transition: background-color 0.2s ease-in-out; -o-transition: background-color 0.2s ease-in-out; -ms-transition: background-color 0.2s ease-in-out; transition: background-color 0.2s ease-in-out; background: #415443; border-radius: 40px; border: 0; color: white; cursor: pointer; display: inline-block; padding: 0.10em 2em; text-align: center; text-decoration: none; font-size: 1.4em; font-weight: 600; min-width:10em; border:1px #415443 solid;}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .button:hover {background-color: #fff; color:#415443;border:1px #415443 solid;}
input[type="submit"].fit, input[type="reset"].fit, input[type="button"].fit, .button.fit {width: 100%;}
input[type="submit"].small, input[type="reset"].small, input[type="button"].small, .button.small {font-size: 0.8em;}

/*================BASE TEMPLATE @ 1680+===================*/	

/* Cookie Message
--------------------------------------------------------------------------------------------------------*/

#cookiesMessage {width:100%; margin-left:auto; margin-right:auto; background-color:#415443; overflow:hidden; padding:1em 0 2em 0;}
.cookingContainer {width:55%; margin-left:auto; margin-right:auto; text-align:center;}
.cookiesMessage {width:90%; float:left; text-align:left;}
.cookiesClose {width:10%; float:right; text-align:right;}
#cookiesMessage h2, .cookiesMessage p{color:#fff;}
#cookiesMessage h2 {text-align:center; font-size:250%; text-shadow: 1px 1px 2px #8496a9, 0 0 1em #415443, 0 0 0.2em #aeb4be;}
.cookiesMessage p{padding:10px 0 0 0; font-size:110%; margin:0;}
.cookiesMessage p a, .cookiesClose p a{color:#fff; font-weight:bold;}
.cookiesClose form input#cookiesMessageClose {background-color:#415443; color: #fff; font-size: 200%; width: 80px; height: 80px; text-align: center; border: 2px solid #fff; margin-top:0; margin-right: 0; border-radius:20%; padding:0; padding-bottom:8px; cursor: pointer; min-width:0;}
.cookiesClose form input#cookiesMessageClose:hover {background-color: #fff; color: #415443; border: 2px solid #fff;}

/* End Cookie Message
--------------------------------------------------------------------------------------------------------*/


/* Header */
#header {background: #333333 url("../images/header.jpg") no-repeat; background-size: cover; color: #fff; padding:4em 0 2em 0; text-align: center; background-position: 0% 65%; position: relative;}
#header:before {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(16, 32, 48, 0.25);}
#header > * {position: relative; z-index: 1;}
.homepage #header {padding: 125px 0; background-position: center;}
.container {margin-left:auto; margin-right:auto; width:1400px;}
#logo {font-size: 160%;text-shadow: 1px 1px 2px #8496a9, 0 0 1em #415443, 0 0 0.2em #aeb4be;}

#headerNav {font-size:130%; margin-left:auto; margin-right:auto; text-align:center;text-shadow: 1px 1px 2px #8496a9, 0 0 1em #415443, 0 0 0.2em #aeb4be;}
#headerNav a:link, #headerNav a:visited {text-decoration:none;}
#headerNav a:hover, #headerNav a:active {text-decoration:underline;}
#headerNav ul{margin: 0; padding:0;}
#headerNav ul li {cursor:pointer; display:inline-block; white-space:nowrap; text-align:center; padding:0.5em 1.5em;border-radius: 10px 10px 0 0; margin-left: 0.5em; }
#headerNav ul li.opener {padding-right:25px;}
#headerNav ul li.opener:hover{background: #415443; border-radius: 10px; color: white; }
#headerNav ul ul {margin-top:-3px; padding-top:15px; padding-bottom:10px; background:#415443; border-radius:10px; min-width:260px;}
#headerNav ul ul li{white-space:nowrap; display:block; text-align: left;margin-left: 0.5em;font-size:90%;}
#headerNav ul ul ul{padding-top:0;}
#headerNav ul ul li ul{margin-top:-3px; padding-top:15px;background: #415443; border-radius:10px; left:-10000px;}
#headerNav ul ul li.opener:hover ul{left: 250px; margin-top:-50px;}
#headerNav ul ul ul li{white-space:nowrap; display:block; text-align: left;margin-left: 0;font-size:90%;}
#headerNav ul li.opener a:after, #headerNav ul li.opener span:after{display:inline-block; content: ""; width: 25px; height: 14px; background: transparent url('../images/forward-arrows.png') no-repeat right;}
#headerNav ul li:not(.opener) a:after{background:none;}
.nav li {position: relative;}
.nav a {display: block; padding: 5px; color: #fff;}
.nav a:hover {color: #fff;}
.nav ul, .nav ul ul {background: rgba(255,255,255,0); position: absolute; left: -9999px;}
.nav ul li{padding-top: 10px;}
.nav ul a {white-space: nowrap;}
.nav li.opener:hover ul {left: 0;}
.nav ul li.opener:hover ul li {left: 0;}


/* Banner */
#banner {text-align:center; padding:75px 0 0 0;}
#banner .major .byline {display: block; margin: 0em 2em; line-height: 1.6em; font-size: 160%; text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em darkblue;}
#banner a {color: inherit;}

/* Main */
header.major {padding-bottom: 2em;}
header.major h1, header.major h2, header.major p {margin: 0; padding: 0; font-size: 350%; font-weight: 600;}
header.major p {line-height: 1.75em; text-shadow: 1px 1px 2px #8496a9, 0 0 1em #415443, 0 0 0.2em #aeb4be;}
header.major p a {color:#fff; text-decoration:none;}
header .byline {font-size: 1.6em;}
.no-sidebar #main .major, .left-sidebar #main .major, .right-sidebar #main .major {text-align: center;}
.left-sidebar #main .sidebar .major, .right-sidebar #main .sidebar .major {text-align: left;}
.homepage #main .major {text-align: center;}
#main {padding: 2em 0; background:#fff;}
#main #pageTitle {width:100%;}
#main .sidebar {margin-top:2em;}
#main .sidebar .major {padding-bottom: 1em;}
#main .sidebar .major h2 {font-size: 1.5em; text-align:left;}
#main .sidebar .default li {border-color: #cdcdcd; font-size: 95%;}
#main .sidebar .default a {color: #464646;}
#main .sidebar > :first-child {margin-bottom: 1em;}
#main section p {font-size:125%;}
.row {margin-left:-50px;}
.row.half {margin-left: -25px;padding-left: 25px;}
.row.half section{width: 50%;}
.row.half > * {padding-left: 0;}
.row::after {content:''; display:block; clear:both; height:0;}
.row:first-child > * {padding-top: 0 !important;}
.row > * {padding-left: 25px;}
.row > * {float: left;}

/* Featured */
.featured {background: #ececec; padding: 6em 0; text-align: center;}

/* Footer */
#footer {padding: 2em 0; color: #fff;}
#footer .major h2 {font-size: 2em; color: #FFF;}
#footer .major .byline {font-size: 1.1em;}
#footer .copyright {margin-top: 3em; padding-top: 3em; border-top: 1px solid; border-color: rgba(192, 192, 192, 0.15); text-align: center; color: inherit;}
#footer a {color: inherit;}


/* ********* frame project listings ********* */
.frameProjectListing {margin:0; padding:0;}

.frameProjectListingTitles {font-weight:bold;}
.frameProjectListing li {list-style-type:none; line-height:1.5em;}
.frameProjectListing li div {display:inline-block;}
.frameProjectListing li.frameProject {border-top:solid #cdcdcd 1px;line-height:2em;}
.frameProjectName {width:25%; margin:0 2%;}
.framePackageWidth {width:12%; margin-right:2%;}
.framePackageHeight {width:12%; margin-right:2%;}
.frameMouldingWidth {width:12%; margin-right:2%;}
.frameMouldingHeight {width:12%; margin-right:2%;}
.frameDetailsLink{width:12%; margin-right:2%;}

.frameDetails {margin:0; padding:0;}
.frameDetails li {list-style-type:none; line-height:3em;}
.frameDetails li div {display:inline-block; margin:0; font-size:125%;}
.frameDetails li div.projectDetailsLineThirdsLeft {width:33%; float:left; text-align:left;}
.frameDetails li div.projectDetailsLineThirdsMiddle {width:33%; text-align:center;}
.frameDetails li div.projectDetailsLineThirdsRight {width:33%; float:right; text-align:right;}
.frameDetails li div.projectDetailsLineHalvesLeft {float:left; width:46%; text-align:left;}
.frameDetails li div.projectDetailsLineHalvesRight {float:right; width:46%; text-align:right;}
.frameDetails li div.projectDetailsLineFullLine {margin:0; width:100%; text-align:center;}
.frameDetails li div.keyText {font-size:140%; font-weight:bold;}

.mouldingProfileImage {position:relative; text-align:center;}
.mouldingProfileImage img {width:30%; height:auto;}
#rebateWidthImageLabel {position:absolute; top:52%; left:53%;}
#backMouldingWidthImageLabel {position:absolute; top:91%; left:42%;}
.frameProjectImage {position:relative; text-align:center;}
.frameProjectImage img {width:75%; height:auto;}
#packageHeight {position:absolute; top:49%; left:40%;}
#packageWidth {position:absolute; top:61%; left:56%;}
#packageSpacingImageLabel {position:absolute; top:25%; left:68%;}
#mouldingWidthImageLabel {position:absolute; top:0%; left:46%; font-weight:bold; font-size:125%;}
#mouldingHeightImageLabel {position:absolute; top:40%; left:6%; font-weight:bold; font-size:125%;}


/* ***END*** frame project listings ***END*** */


/* ********* general forms ********* */

#formDiv {padding:0 30px;margin-top:20px;}
#formDiv div.formGroup {margin: 7px 0;display:inline;}
#formDiv .formLabel {float: left; margin-right:2%; margin-top:6px; text-align: right;}
.colWidth100 #formDiv .formLabel {width:45%;}
.colWidth66 #formDiv .formLabel {width:40%;}
.colWidth75 #formDiv .formLabel {width:40%;}
input[type=text], input[type=password] {width:200px;}
textarea {width:400px;}
#formDiv .formGroupButtons input[type=submit] {width:150px;}
#formDiv .formGroupButtons {margin: 20px 0 20px 0;  text-align: center;}
p.phpErrorText-Intro{color:#cc0000;font-weight:bold;text-align:center;}
ul.phpErrorText-Intro{color:#cc0000;font-weight:bold;text-align:left;padding-left:42%;}
.phpErrorText-Form {color:#cc0000;font-weight:normal;text-align:center;}
#formDiv div.formGroup select {border:solid 1px #888888; width:auto; padding:0.3em; margin: 0 10px 0 0; line-height:1em;}
/*
.unBold {font-weight:normal;}
.italic {font-style:italic;}
.requiredField {color:#50496B;font-size:120%;font-weight:bold;}
.saveMessage  {font-weight:bold;margin-bottom:20px;}
.editMessage  {font-weight:bold;margin-bottom:20px;}

#formDiv {padding:0 30px;margin-top:10px;}
#formDiv fieldset {margin:15px;}
#formDiv .formLabel {float: left; margin-right:10px; margin-top:0; text-align: right; width: 230px;}
#formDiv form.fullWidth .formLabel {width: 397px;}
#formDiv form.acceptConditionsForm .formLabel  {width: 428px;}


input[type=text], input[type=password] {width:200px;}
input[type=text]#formUsername, input[type=password]#formPassword, input[type=password]#formConfirmPassword, select#formSecurityQuestion1, input[type=text]#formSecurityAnswer1, select#formSecurityQuestion2, input[type=text]#formSecurityAnswer2, input[type=text]#formAntiSpamUser300{	width:300px;}
select#formSecQsSecurityQuestion1, input[type=text]#formSecQsSecurityAnswer1, select#formSecQsSecurityQuestion1, input[type=text]#formSecQsSecurityAnswer2, input[type=text]#formSecQsAntiSpamUser{	width:300px;}
select#bookingDay, select#bookingEnquiryDay, select#bankholidayDay {width:40px;	text-align:center;}
select#bookingMonth, select#bookingEnquiryMonth, select#bankholidayMonth {	width:100px;	text-align:center;}
select#bookingYear, select#bookingEnquiryYear, select#bankholidayYear {	width:60px;	text-align:center;}
select#bookingStartHour, select#bookingStartMinutes, select#bookingEnquiryStartHour, select#bookingEnquiryStartMinutes {	width:100px;	text-align:center;}
select#bookingEndHour, select#bookingEndMinutes, select#bookingEnquiryEndHour, select#bookingEnquiryEndMinutes {	width:100px;	text-align:center;}
select#bookingRooms, select#bookingEnquiryRooms, select#bankholidayDescription {	width:200px;	text-align:left;}

#formDiv .inputSpan {margin-right:10px;font-style:normal;font-size:100%;}
#formDiv input.error{      background: #f8dbdb;      border-color: #e77776;  }  
#formDiv textarea.error{      background: #f8dbdb;      border-color: #e77776;  }  
#formDiv div.formGroup {  margin: 7px 0;display:inline-block;} 
#formDiv div.ckEditor{  margin: 7px 0 0 0;}
#formDiv div.ckEditor div#cke_bookingRequirements{  margin:10px 0;float: right;} 


#formDiv div p{  
    margin-left:240px; 
 
    font-style: italic;
	margin-bottom:0;
	line-height:1;
	padding:0 30px;
} 

#formDiv div p.showHelp {  
padding:0;
font-size: 80%; 
  margin-top:5px;
  margin-left:0;
     float: left;
    margin-right: 10px;
    text-align: right;
    width: 230px;
  
  
}

#formDiv form.fullWidth div p.showHelp {  

    width: 397px;
  
  
}

#formDiv form.acceptConditionsForm div p.showHelp {  
    width: 428px;
}

#formDiv div.ckEditor p.showHelp {  
float:none;
display: inline;
}


#formDiv div p.hintText {

margin:5px 0 5px 0;
font-style: normal;
font-size: 90%; 
font-weight:bold;

line-height:1.25;
display:none;
padding:0;
padding-right:30px;
padding-left:240px;
}


#formDiv form.fullWidth div p.hintText {
padding-left:407px;
}

#formDiv form.acceptConditionsForm div p.hintText {
padding-left:438px;
}

#formDiv div p.error{  
    color: #cc0000;  
font-weight:bold;
    font-style: normal;
margin-bottom:5px;
}  

#formDiv div p.phpErrorText-Form, #formDiv p.phpErrorText-Form {
color: #cc0000; 
font-weight:bold;
    font-style: normal;
margin-bottom:15px;
padding:0 30px 0 0;
margin-left:0;
text-align:center;
line-height:1.5;
}

#error{  
    margin-bottom: 20px;  
    border: 1px solid #efefef;  
}  
#error ul{  
    list-style: square;  
    padding: 5px;  
    font-size: 11px;  
}  
#error ul li{  
    list-style-position: inside;  
    line-height: 1.6em;  
}  
#error ul li strong{  
    color: #e46c6d;  
}  
#error.valid ul li strong{  
    color: #93d72e;  
}  

.formDetails {
margin-top:5px;
}


.formDetailsTitle {
font-weight:bold;
float:left;
width:125px;
text-align:right;
}

.formDetailsSubmitted {
float:right;
text-align:left;
width:360px;
}

#formDiv span.bankholidayDescription {
	
}

#formDiv span.bankholidayDate {

}

#formDiv span.bankholidayDelete {
	float:right;
}

span.bookingCost {
	float:right;
}
*/
/* ***END*** general forms ***END*** */

/* ********* ride listings ********* */
.ridesListing {margin:0; padding:0;}
.ridesListing li {list-style-type:none; line-height:1.5em;border-top:solid #cdcdcd 1px;}
.ridesListing li div {display:inline-block;}
.ridesListing li.rideType1 {background-color:#FFC000;color:black;}
.ridesListing li.rideType2 {background-color:#92D050;color:black;}
.ridesListing li.rideType3 {background-color:#FF3300;color:#fff;}
.ridesListing li.rideType4 {background-color:#92CDDC;color:black;}
.ridesListing li.rideType5 {background-color:#FFFF00;color:black;}
.ridesListing li.rideType6 {background-color:#B1A0C7;color:black;}
.ridesListing li.rideType7 {background-color:#65FFFF;color:black;}
.ridesListing li.rideType8 {background-color:#ff4dff;color:black;}
.ridesListing span {display:block; text-align:left;}
.ridesListing span.label {font-size:60%; line-height:1em; text-align:left; text-transform:uppercase;}
.ridesListingDate {width:25%; margin:0 2%;}
.ridesListingDistance {width:10%; margin-right:2%;}
.ridesListingAscent {width:9%; margin-right:2%;}
.ridesListingBike {width:22%; margin-right:2%;}
.ridesListingAvgSpeed {width:10%; margin-right:2%;}
.ridesListingAvgMilesPerDay {width:10%; margin-right:2%;}
.ridesListingPageLinks, .ridesListingYearLinks {text-align:right;}
.current {font-weight:bold; font-size:110%;}
.ridesListing span.current {display:inline;}
.belowTarget .data {color:#9C0006; font-weight:bold;}
.onTarget .data {color:#006100; font-weight:bold;}
/* ***END*** ride listings ***END*** */

/* ********* routes listings ********* */
.routesListing {margin:0; padding:0;line-height:1.5em;border-top:solid #cdcdcd 1px; overflow: auto;}
.routesListing span {display:block; text-align:left;}
.routesListing span.label {font-size:60%; line-height:1em; text-align:left; text-transform:uppercase;}
.routesListingName {width:88%; margin:0 2%;font-weight:bold;float:left;}
.routesListingDescription {width:88%; margin:0 2%;float:left;}
.routesListingDistance {width:6%; margin-right:2%;float:right;}
/* ***END*** routes listings ***END*** */





/* ********* calendar ********* */
#pageBodyCalendar {
			width:100%;
			text-align:center;
			border-left:1px solid #50496B;
		}

#pageBodyCalendarForm {
			text-align:center;
			margin-left:auto;
			margin-right:auto;
			margin-top:10px;
			margin-bottom:10px;
			font-size:100%;
		}
		
#pageBodyCalendarForm form {
font-size:90%;
}		

#formDiv #formCalendar div.formGroup, #formDiv #formCalendar div.formGroupButtons {margin: 7px 0; display:inline; text-align:center;}
#formDiv #formCalendar div.formGroupButtons input[type=submit] {min-width:37px; width:37px; padding:0;}
#formDiv #formCalendar div.formGroup select {border:solid 1px #888888; width:auto; padding:0.3em; margin: 0 10px 0 0; line-height:1em;}
#formDiv #formCalendar div.formGroup a {margin: 0 10px;}

#pageBodyCalendar .previousMonthLink {
float:left;
margin-top:10px;
margin-bottom:10px;
width:100px;
text-align:left;
}

#pageBodyCalendar .nextMonthLink {
float:right;
margin-top:10px;
margin-bottom:10px;
width:100px;
text-align:right;
}
	
#pageBodyCalendar .previousMonthLink a, #pageBodyCalendar .previousMonthLink a:link, #pageBodyCalendar .previousMonthLink a:visited,
#pageBodyCalendar .nextMonthLink a, #pageBodyCalendar .nextMonthLink a:link, #pageBodyCalendar .nextMonthLink a:visited
{
text-decoration:underline;
color:#50496B;
}
	
#pageBodyCalendar .previousMonthLink a:hover, #pageBodyCalendar .previousMonthLink a:active,
#pageBodyCalendar .nextMonthLink a:hover, #pageBodyCalendar .nextMonthLink a:active
{
text-decoration: none;
color:#CAD2D5;
}	
	
		#pageBodyCalendar ul {
			margin:0;
			padding:0;
		}
		
		#pageBodyCalendar ul li {
			margin:0;
			height:93px;
			width:14%;
			border-bottom:1px solid #50496B;
			/*padding:3px 0;*/
			padding:0;
			border-left:1px solid #50496B;
		/*	font-size:75%;*/
			list-style:none;
			display:block;
			float:left;
		}
		
		#pageBodyCalendar .count7, #pageBodyCalendar .count14, #pageBodyCalendar .count21, #pageBodyCalendar .count28, #pageBodyCalendar .count35, #pageBodyCalendar .count42 {
			border-right:1px solid #50496B;
		}
		
		#pageBodyCalendar ul li.title {
		/*	background:#FCF5EB;*/
			border-top:1px solid #50496B;
			color:#50496B;
			font-weight:bold;
			height:30px;
			font-size:100%;
			text-align:center;
		}

		#pageBodyCalendar div.dayNumberPrevious, #pageBodyCalendar div.dayNumberNext {
			text-decoration:none;
			display:block;
			font-style:italic;
			font-weight:normal;
			font-size:80%;
			padding:0 5px;
		}		
		
#pageBodyCalendar div.dayNumberCurrent {
	font-weight:bold;
	font-size:100%;
	padding:0 5px;
}

.currentMonth div, .previousMonth div, .nextMonth div {
line-height:1.2em;
}
		
.currentMonth div.rideType1, .currentMonth div.rideType2, .currentMonth div.rideType3, .currentMonth div.rideType4, .currentMonth div.rideType5, .currentMonth div.rideType6, .currentMonth div.rideType7, .currentMonth div.rideType8 {
font-size:65%;
height:auto;
padding:1px 0 3px 0;
width: 47%;
float: left;
}		

.currentMonth div.ride1, .currentMonth div.ride3 {
margin:2% 1% 2% 2%;
}

.currentMonth div.ride2, .currentMonth div.ride4 {
margin:2% 2% 2% 1%;
}

#pageBodyCalendarKey p {
margin-bottom:10px;
}
div #calendarKey {clear:both; overflow:hidden; text-align:center;}
#calendarKey h2 {margin:15px 0 5px 0;}
.calendarKey {width:200px; text-align:center; font-size:90%;}
.calendarKey.rideType1, .calendarKey.rideType2, .calendarKey.rideType3, .calendarKey.rideType4, .calendarKey.rideType5, .calendarKey.rideType6, .calendarKey.rideType7, .calendarKey.rideType8 {display:inline-block;}
.calendarKey {margin:5px;}
.calendarKey p {margin:5px 0; display:inline;}

.rideType1 {background-color:#FFC000;color:#000;}
.rideType2 {background-color:#92D050;color:#000;}
.rideType3 {background-color:#FF3300;color:#fff;}
.rideType4 {background-color:#92CDDC;color:#000;}
.rideType5 {background-color:#FFFF00;color:#000;}
.rideType6 {background-color:#B1A0C7;color:#000;}
.rideType7 {background-color:#65FFFF;color:#000;}
.rideType8 {background-color:#ff4dff;color:#000;}
#pageBodyCalendar ul div.rideContainer {height:44px;}
#pageBodyCalendar ul div.milesPerDay {float:none; display:inline-block; font-weight:normal; width:100%; color: #555555; font-size: 80%; opacity:0.8; }
#pageBodyCalendar ul div.belowTarget {background-color:#9C0006; color:#fff; padding:2px 0;}
#pageBodyCalendar ul div.onTarget {background-color:#006100; color:#fff; padding:2px 0;}
/* ***END*** calendar ***END*** */

/* ********* weekly totals ********* */
#ridesWeeklyTotals {margin:0; padding:0;}
#main ul li {margin:0;}
#ridesWeeklyTotals li {list-style-type:none; line-height:2em; width:10.5%;display:inline-block; padding:0 1%; font-size:85%;}
#ridesWeeklyTotals li.weeksColumn, #ridesWeeklyTotals li.weeksColumnLabel, #ridesWeeklyTotals li.totalsLabel {width:5.5%;}
#ridesWeeklyTotals li.weeksColumn {padding:0 2%;}
#ridesWeeklyTotals li.totalsLabel {padding:0 0.5%;}
#ridesWeeklyTotals li.rideType1 {background-color:#FFC000;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType2 {background-color:#92D050;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType3 {background-color:#FF3300;color:#fff; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType4 {background-color:#92CDDC;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType5 {background-color:#FFFF00;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType6 {background-color:#B1A0C7;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType7 {background-color:#65FFFF;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.rideType8 {background-color:#ff4dff;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesWeeklyTotals li.totalsRow, #ridesWeeklyTotals li.totalsColumn, #ridesWeeklyTotals li.weeksColumn {border-top: solid #cdcdcd 1px;}
#ridesWeeklyTotals li.totalsRow, #ridesWeeklyTotals li.totalsColumn {font-weight:bold;}
#ridesWeeklyTotals div {display:block; text-align:right;}
#ridesWeeklyTotals div.bikeNameLabel {display:block; text-align:center; font-size:80%; line-height: 1em;}
.ridesWeeklyTotalsYearLinks {margin-bottom:30px; text-align:right;}
/* ***END*** monthly totals ***END*** */

/* ********* monthly totals ********* */
#ridesMonthlyTotals {margin:0; padding:0;}
#main ul li {margin:0;}
#ridesMonthlyTotals li {list-style-type:none; line-height:2em; width:10%;display:inline-block; padding:0 1%; font-size:85%;}
#ridesMonthlyTotals li.rideType1 {background-color:#FFC000;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType2 {background-color:#92D050;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType3 {background-color:#FF3300;color:#fff; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType4 {background-color:#92CDDC;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType5 {background-color:#FFFF00;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType6 {background-color:#B1A0C7;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType7 {background-color:#65FFFF;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.rideType8 {background-color:#ff4dff;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesMonthlyTotals li.totalsRow, #ridesMonthlyTotals li.totalsColumn, #ridesMonthlyTotals li.monthsColumn {border-top: solid #cdcdcd 1px;}
#ridesMonthlyTotals li.totalsRow, #ridesMonthlyTotals li.totalsColumn {font-weight:bold;}
#ridesMonthlyTotals div {display:block; text-align:right;}
#ridesMonthlyTotals div.bikeNameLabel {display:block; text-align:center; font-size:80%; line-height: 1em;}
.ridesMonthlyTotalsYearLinks {margin-bottom:30px; text-align:right;}
/* ***END*** monthly totals ***END*** */

/* ********* annual totals ********* */
#ridesAnnualTotals {margin:0; padding:0;}
#main ul li {margin:0;}
#ridesAnnualTotals li {list-style-type:none; line-height:2em; width:10%;display:inline-block; padding:0 1%; font-size:85%;}
#ridesAnnualTotals li.yearsColumn, #ridesAnnualTotals li.yearsColumnTitle {width:8%;}
#ridesAnnualTotals li.totalsColumn, #ridesAnnualTotals li.totalsColumnTitle {width:12%;}
#ridesAnnualTotals li.rideType1 {background-color:#FFC000;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType2 {background-color:#92D050;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType3 {background-color:#FF3300;color:#fff; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType4 {background-color:#92CDDC;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType5 {background-color:#FFFF00;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType6 {background-color:#B1A0C7;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType7 {background-color:#65FFFF;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.rideType8 {background-color:#ff4dff;color:#555555; border-top:solid #cdcdcd 1px;}
#ridesAnnualTotals li.totalsRow, #ridesAnnualTotals li.totalsColumn, #ridesAnnualTotals li.yearsColumn {border-top: solid #cdcdcd 1px;}
#ridesAnnualTotals li.totalsRow, #ridesAnnualTotals li.totalsColumn {font-weight:bold;}
#ridesAnnualTotals div {display:block; text-align:right;}
#ridesAnnualTotals div.bikeNameLabel {display:block; text-align:center; font-size:80%; line-height: 1em;}
/* ***END*** annual totals ***END*** */

/* ********* graphs ********* */
#chartDiv {width:100%; height:800px;}
/* ***END*** graphs ***END*** */


/* ********* Add recording forms ********* */
#addNewArtistForms, #addNewFormatForm, #addNewGenreForm, #addNewLabelForm {display:none;}
/*#trackFormFields {}*/
#trackFormFields input {display:inline;}
#trackFormFields input.trackNumber {width:60px;}
/*#trackFormFields input.trackName {display:inline;}*/
/* ***END*** Add recording forms ***END*** */





/*=========RESPONSIVE SECTION========================================================================================*/
/*********************************************************************************************************************/

/*=========@ 1280 - 1679==========*/
@media all and (min-width: 1280px) and (max-width: 1679px) {
.container {width:1200px;}	
.homepage #header {padding: 85px 0;}
#header {background-size: 100% auto;}
}


/*=========@ 980 - 1279==========*/
@media all and (min-width: 980px) and (max-width: 1279px) {
.container {width:960px;}
	
}


/*=========@ 840 - 979==========*/
@media all and (min-width: 840px) and (max-width: 979px) {
.container {width:800px;}
	
}


/*=========@ 640 - 839==========*/
@media all and (min-width: 640px) and (max-width: 839px) {
.container {width:95%;}
	
}


/*=========@ 480 - 639==========*/
@media all and (min-width: 480px) and (max-width: 639px) {
.container {width:90%;}	
	
}


/*=========@ 300 - 479==========*/
@media all and (min-width: 300px) and (max-width: 479px) {
.container {width:90%;}	
#header {padding:3em 0 1em 0;}
header.major h1, header.major h2, header.major p {font-size:200%;}
#headerNav ul li {margin:0 auto;}
#headerNav ul ul {z-index:1000; margin-top:-2px; padding-top:0;}
#headerNav ul ul li {padding:0em 1em; text-align:center;}
/*.nav li.opener:hover ul {}*/
#formDiv div.formGroup {margin:2px 0; display:inline-block;}
.colWidth100 #formDiv .formLabel {width:100%;}
#formDiv .formLabel {float:left; margin-right:0; margin-top:0; text-align:left; font-size:95%;}
input[type="text"], input[type="password"] {width:100%;}
#formDiv .formGroupButtons {margin:10px 0; text-align:center;}
#formDiv .formGroupButtons input[type="submit"] {width:100%;}
input[type="submit"], input[type="reset"], input[type="button"], .button {min-width:100%; font-size:125%;}
/*=========@ 0 - 299==========*/
@media all and (min-width: 0px) and (max-width: 299px) {
	
	
}