body {
	background-color:#284C7E;
	font-family:'Helvetica Neue',arial,helvetica,helve,geneva,tahoma,swiss,verdana,sans-serif;
	font-size:17px;
	font-size:1.7rem; /* This equals 17px */
	line-height:1.2;
	margin:auto;
	max-width:960px;
	padding:0 0.7em;
	}
#header {
	background-image:url(../images/header-bg.jpg);
	background-repeat:no-repeat;
	background-size:100% auto;
	}
#header a:link, #header a:visited, #header a:active {text-decoration:none;}
#header a:hover {text-decoration:none;}

p {}

h1 {
	color:#006;
	font-family:'Amaranth', serif;
	/*text-shadow:0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;*/
	/*text-shadow:0px 1px 0px #f65b69, 0px 2px 0px #d94755, 0px 3px 0px #c4414e, 0px 4px 0px #bb2937, 0px 5px 0px #bb2937, 0px 6px 0px #a8111f, 0px 7px 0px #940411, 0px 8px 7px #001135;*/
	/*text-shadow:1px 1px 1px #f65b69, 1px 2px 1px #d94755, 1px 3px 1px #c4414e, 1px 4px 1px #bb2937, 0px 6px 7px #001135;*/
	/*text-shadow:0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 8px 7px #001135;*/
	text-shadow:1px 0px 1px #FFF, 0px 1px 0px #CCC, 1px 0px 1px #999, 0px 3px 1px #903, 0px 0px 1px #F00;
	font-size:2.4em;
	font-weight:bold;
	margin-bottom:0;
	text-align:center;
	}
h2 {
	color:#006;
	font-family:'Amaranth', serif;
	/*text-shadow:0px 1px 0px #FFF, 0px 2px 0px #CCC, 0px 3px 0px #999, 0px 4px 1px #903, 0px 4px 4px #F00;*/
	/*text-shadow:0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 8px 7px #001135;*/
	text-shadow:2px 0px 2px #999, 0px 1px 0px #888, 0px 3px 1px #001135;
	font-size:1.8em;
	font-weight:bold;
	text-align:center;
	font-style:italic;
	}
h3, h4, h5, h6 {color:#036; font-style:italic; font-weight:bold;}
h3 {font-size:27px; font-size:2.7rem; font-style:italic;}
h4 {font-size:22px; font-size:2.2rem; font-style:italic;}
h5 {font-size:15px; font-size:1.5rem; font-style:italic;}
h6 {font-size:10px; font-size:1.0rem; font-style:italic;}
.nobreak {display:inline-block;}
#menu {background-image:url(../images/menu-950.png); background-size:100% auto; background-repeat:no-repeat; height:82px;}
#menu ul li .active {background:url(../images/hover.png) no-repeat center;}
#main-content {padding:20px 20px 0 20px;}
#main-content-positioning {margin-bottom:-1.5em;}

/* ******************************************* */
/* ******* Secondary Navigation ************** */
.secondary-nav {
	background-color:#c00;
	color:#fff;
	display:table;
	margin:auto;
	margin-top:-15px;
	margin-bottom:15px;
	min-width:50px;
	padding:7px 15px;
	text-align:center;
	border:2px solid #06c;
	-webkit-border-radius:20px;
	-moz-border-radius:20px;
	border-radius:20px;
	-webkit-background-clip:padding-box;
	-moz-background-clip:padding;
	background-clip:padding-box;
	/* IE 8 and below do not support rounded corners. May set up a dedicated stylesheet for them that has no rounded corners. */
}
.secondary-nav p {margin-bottom:7px; padding:7px 7px 0 7px;}
.secondary-nav a:link, .secondary-nav a:visited, .secondary-nav a:active {color:#03c; text-decoration:none;}
.secondary-nav a:hover {color:#fff;}

/* ********************************************** */
/* ******* Image Styling ************************ */
img {border:0;}
.img-border-red  {border:2px solid #c00;}
.img-border-blue {border:2px solid #06c;}
.img-border-none {border:0;}

.img-responsive     {display:block; height:auto; max-width:100%;}
.img-full-width     {width:100%; box-sizing:border-box;}
.img-full-max-width {max-width:100%; box-sizing:border-box;}
.img-50pc-max-width {max-width:50%; box-sizing:border-box;}

.float-left  {float:left;  margin-bottom:0.2em; margin-right:1em;}
.float-right {float:right; margin-bottom:0.2em; margin-left:1em;}

.center {display:block; margin-left:auto; margin-right:auto; width:50%;}

/* ********************************************** */
/* ******* Pictures with Captions *************** */
/* Source: http://www.labnol.org/internet/design/add-text-captions-align-images-html-css/2309/  */
.picture {
/*	border:1px solid #069;*/
	padding:3px;
	font-size:10px;
	text-align:center;
	font-style:italic;
	font-weight:bold;
	}
.picture img {
	/*border:2px solid #06c;*/
	vertical-align:middle;
	margin-bottom:3px;
	}
.picture .img-link {
	border:2px solid #06c;
	margin-bottom:3px;
	vertical-align:middle;
	}
.picture .img-nolink {
	margin-bottom:3px;
	vertical-align:middle;
	}
.picture .img-no-border {
	border:0;
	margin-bottom:3px;
	vertical-align:middle;
	}

/* ********************************************** */
/* ******* Colored Box with Rounded Corners ***** */
/* Source: http://cssround.com/  */
.rcbox {
	background-color:#CCCC99;
	border-radius:15px;
	border:2px solid #8F0000;
	box-shadow:#B3B3B3 3px 3px 3px;
	padding:20px 10px 3px 15px;
	-moz-border-radius:15px;
	-moz-box-shadow:#B3B3B3 3px 3px 3px;
	-webkit-border-radius:15px;
	-webkit-box-shadow:#B3B3B3 3px 3px 3px;
}

/* ********************************************** */
/* ******* Miscellaneous Styles ***************** */
/*.clear { clear:both; }*/
.clear {
	clear:both;
	display:block;
	height:0;
	overflow:hidden;
	visibility:hidden;
	width:0;
	}
hr.curved {
	/*border-color:black;*/
	border-color:#339933;
	border-radius:20px;
	border-style:solid;
	border-width:1px 0 0 0;
	height:30px;
	margin-bottom:-15px;
	}
hr.curved:before { /* Not really supposed to work, but does */
	/*border-color:black;*/
	border-color:#339933;
	border-radius:20px;
	border-style:solid;
	border-width:0 0 1px 0;
	content:"";
	display:block;
	height:30px;
	margin-top:-31px;
	}
hr {
	background-image:url(../images/hr-red-white-and-blue.gif);
	border:none;
	clear:both;
	height:6px;
	/*padding:7px 0;*/
	/*width:914px;*/
	width:100%;
	}
em {font-style:italic;}
strong {color:#03C; font-style:italic;}
sup, sub {
	height:0;
	font-size:70%;
	line-height:1;
	vertical-align:baseline;
	_vertical-align:bottom;
	position:relative;
	}
sup {bottom:1ex;}
sub {top:.5ex;}

.padding10pxTopThen0, .padding20pxTopThen0, .padding30pxTopThen0, .padding40pxTopThen0, .padding50pxTopThen0 {padding:0;}
.padding0Then10pxTop {padding-top:10px;}
.padding0Then20pxTop {padding-top:20px;}
.padding0Then30pxTop {padding-top:30px;}
.padding0Then40pxTop {padding-top:40px;}
.padding0Then50pxTop {padding-top:50px;}

.link-container {display:inline-block; padding-bottom:20px;}
.link-container p {line-height:1.2;}

#nivo-wrapper-header {margin:auto; padding-top:15px; width:226px; height:330px;}
.social-divider-line {border-top:1px solid #03C;}

/*.link-to-videos {background:#069; color:#fff; margin:auto; text-align:center; width:90%;}
.link-to-videos p {padding:7px 3px;}
.link-to-videos a:link, .link-to-videos a:visited, .link-to-videos a:active {color:#fff;}
.link-to-videos a:hover {color:#c00;}*/
.link-to-videos {border:3px double #c00; margin:auto; margin-bottom:20px; text-align:center; width:90%;}
.link-to-videos p {margin-bottom:0; padding:7px 3px;}

/* Page describing how to make videos responsive: */
/* http://webdesignerwall.com/tutorials/css-elastic-videos */
video {max-width:100%; height:auto;}
.video-wrapper-320 {border:2px solid red; margin:auto; width:320px; max-width:98%;} /* For videos with a 1.777 aspect ratio */
.video-wrapper-800 {border:2px solid red; margin:auto; width:800px; max-width:98%;} /* For videos with a 1.777 aspect ratio */
/*.video-container {height:0; overflow:hidden; padding-bottom:56.25%; padding-top:30px; position:relative;}*/
.video-container {height:0; overflow:hidden; padding-bottom:56.25%; position:relative;}
.video-container iframe, 
	.video-container object, 
	.video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}

/* ******************************************* */
/* ******* List Styles *********************** */
ol {list-style:decimal; margin-top:-10px;}
ul {list-style:disc;    margin-top:-10px;}
li {margin-left:40px;   margin-bottom:5px;}

/* ****************************************** */
/* ******* Hyperlinks *********************** */
a:link, a:visited, a:active {color:#c00; font-weight:600; text-decoration:none;}
a:hover {color:#03c; font-weight:600; text-decoration:none;}
a.clickable-div {
	display:block;
	height:100%;
	text-decoration:none;
	width:100%;
	}

/* *************************************** */
/* ******* Spacing *********************** */
/*p, dl, ol, ul, pre, table, address, fieldset { margin-bottom:20px; }*/

/* ********************************************* */
/* ********************************************* */
/* ******* Containers ************************** */
#container_red   {border:2px solid #c00; margin-top:10px;}
#container_white {border:2px solid #fff;}
#container_blue  {border:2px solid #00c; background-color:#fff;}
/* *********************************************** */
/* *********************************************** */

/* ************************************** */
/* *************** Footer *************** */
#footer p {font-size:1.2rem; text-align:center;}
#footer {
	/*
	padding:10px 5px;
	position:relative;
	width:938px;
	*/
	background-image:url(../images/footer-bg.gif);
	color:#000;
	font-size:14px;
	height:100px;
	}
/*
#footer a:link, #footer a:visited, #footer a:active {
	color:#EFFF5D;
	text-decoration:underline;
	}
#footer a:hover {color:#0C0; text-decoration:none;}
*/


/* ====================================================================== */
/*  FORMS STYLING ======================================================= */
/* ====================================================================== */
form.contact {box-sizing:border-box;}
fieldset {border:1px solid #00c; margin:auto; padding:20px; width:100%;}
form.contact input[type="text"], textarea {background-color:#284c7e; border:1px solid #00c; color:#fff; font-size:16px; opacity:0.9;}
form.contact input[type="text"]:focus, textarea:focus {background-color:#090; border:1px solid #c00; opacity:0.8;}
form.contact input[type="submit"] {background-color:#9f9; border:1px solid #390; color:#03f; max-width:100%; padding:0px 7px;}
form.contact input[type="submit"]:hover {background-color:#390; border:1px solid #00c; font-style:italic;}

input {
	border:1px solid #630;
	color:#fff;
	font-size:14px;
	margin-bottom:7px;
	max-width:30%;
	}
input.short {width:10%;}
input.long  {width:50%;}
label {
    display:block;
    float:left;
	font-size:14px;
	font-size:1.5rem;
    margin:9px 5px 0 0;
	margin-left:-2rem;
    text-align:right;
    width:100px;
	}
legend {
	background:#00c;
	border:1px solid #00c;
	color:#fff;
	font-weight:bold;
	padding:2px 7px;
	}
textarea {
	font-family:inherit;
	margin-bottom:7px;
	min-width:40%;
	}
.form-button {margin-top:-20px;}
.asdd {display:none;} /* asdd = "Anti-Spam Don't Display". This is not shown to real users, but hopefully spambots will see it and fill it in. If it is filled in, don't send the email */

/*
.btn-red {background-color:#c03; border:1px solid #09C; border-radius:12px; max-width:100%; padding:7px 10px;}
.btn-red:hover {background-color:#fff; border:1px solid #c03; font-style:italic;}
a.btn-red {color:#fff;}
a.btn-red:hover {color:#c03;}
*/


/* ======================================================== */
/*  MEDIA BREAKPOINTS - Mobile First                        */
/*  These breakpoints are for the site only.                */
/*  For the Menu, see responsivemobilemenu.css)             */
/* ======================================================== */
/* For devices larger than 100px */
@media all and (min-width:100px) {
	.float-none-then-left-150  {text-align:center; margin-bottom:0;}
	.float-none-then-right-200 {margin:auto; margin-bottom:15px; text-align:center;}
	.float-none-then-right-400 {margin:auto; margin-bottom:-20px; text-align:center;}
	.lines2 {margin:0; padding:0;} /* For Videos and Archived Warriors titles */
	.lines3 {line-height:1.1; margin-bottom:3px;} /* For Videos and Archived Warriors titles */
	.lines4 {line-height:1.1; margin-bottom:3px;} /* For Videos and Archived Warriors titles */
	.link-to-videos {width:100%;}
	.padding-below-550 {padding-top:25px;}
	h3 {font-size:23px; font-size:2.3rem;}
	#main-content {margin-top:-20px; padding:0 5px 0 5px;}
	#footer {height:220px;}
	#header {background-image:url(../images/header-bg-500.jpg);}
	#nivo-wrapper-header-optional {display:none;}
	table.ride td {}
	.six-twitter {width:100%; margin-left:0;}
}

/*  PHONES  ================================================================= */
/* For devices larger than 320px */
@media all and (min-width:320px) {
}
/* For devices larger than 365px */
@media all and (min-width:365px) {
	.float-none-then-left-150 {float:left; margin-right:10px; clear:both;}
	h3 {font-size:27px; font-size:2.7rem;}
}

/*  IN-BETWEENS  ======================================================== */
/* For devices larger than 480px */
@media all and (min-width:480px) {
	.link-to-videos {width:90%;}
	#main-content {padding:0 10px 0 10px;}
}
/* For devices larger than 540px */
@media all and (min-width:540px) {
	.link-to-videos {width:80%;}
}
/* For devices NO larger than 549px */
@media (max-width:549px) {
	.padding10pxTopThen0 {padding-top:10px;}
	.padding20pxTopThen0 {padding-top:20px;}
	.padding30pxTopThen0 {padding-top:30px;}
	.padding40pxTopThen0 {padding-top:40px;}
	.padding50pxTopThen0 {padding-top:50px;}
	.padding0Then10pxTop, .padding0Then20pxTop, .padding0Then30pxTop, .padding0Then40pxTop, .padding0Then50pxTop {padding:0;}
}
/* For devices larger than 550px */
@media all and (min-width:550px) {
	.lines2 {height:2.3em; line-height:1.1; margin-bottom:0;} /* For Videos and Archived Warriors titles */
	.lines3 {height:3.3em; line-height:1.1; margin-bottom:0;} /* For Videos and Archived Warriors titles */
	.lines4 {height:4.6em; line-height:1.1; margin-bottom:0;} /* For Videos and Archived Warriors titles */
	.padding-below-550 {padding:0;}
	.social-divider-line {border-top:0;}
	#footer {height:100px;}
	#nivo-wrapper-header-optional {display:block; margin:auto; padding-top:15px; width:226px; height:330px;}
	#nivo-wrapper-header {margin:auto; padding-top:15px; width:226px; height:330px;}
}
/* For devices larger than 570px */
@media all and (min-width:570px) {
	.float-none-then-right-400 {float:right; margin-left:20px;}
}
/* For devices larger than 600px */
@media all and (min-width:600px) {
	.link-to-videos {width:100%;}
	.video-wrapper-320 { display:none; }
	#main-content {padding:0 12px 0 12px;}
	#header {background-image:url(../images/header-bg-600.jpg);}
}
/* For devices larger than 635px */
@media all and (min-width:635px) {
	.float-none-then-right-200 {float:right; margin-left:15px;}
}
/* For devices larger than 640px */
@media all and (min-width:640px) {
	#main-content {margin-top:-10px;}
}
/* For devices larger than 730px */
@media all and (min-width:730px) {
	.six-twitter {width:48%;}
	.twitter-spacing {padding-left:15px;}
}
/* For devices larger than 768px */
@media all and (min-width:768px) {
	#header {background-image:url(../images/header-bg.jpg);}
	#main-content {padding:0 15px 0 15px;}
}
/* For devices larger than 820px */
@media all and (min-width:820px) {
	.link-to-videos {width:90%;}
	#main-content {margin-top:0}
}
/* For devices larger than 960px */
@media all and (min-width:960px) {
	#main-content {padding:20px 20px 0 20px;}
}
/* For devices larger than 1025px */
@media all and (min-width:1025px) {
}
/* For devices NO larger than 360px */
@media all and (max-width:360px) {
	table.ride td {font-size:9px; margin:0; padding:0;}
}
/* For devices NO larger than 450px */
@media all and (max-width:450px) {
	table.ride td {font-size:12px;}
}

/* Choose the appropriate video depending on device screen size */
/* Unfortunately, having a single page for both sizes of videos prevents the autoplaying of the video */
/* If autoplay is used, both will play at the same time (even though only one is visible). */
/* There doesn't seem to be an easy way around this. Maybe it could be solved using Javascript. */
/* Also, simply setting autoplay to false won't work. Autoplay cannot be used anywhere on the page. */
@media all and (min-width:100px) and (max-width:599px) {
	.video-wrapper-800 {display:none;}
}
/* For devices larger than 600px */
@media all and (min-width:600px) {
	.video-wrapper-320 { display:none; }
}