@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic);


body {
	margin: 0;
	padding: 0;
	border: 0;			/* This removes the border around the viewport in old versions of IE */
	background: #fff;
	width: 100%;
	font: 18px/1.6 'Open Sans', Arial, Helvetica, sans-serif;
	position: relative;
	top: 0; left: 0;
	z-index: 0;
}
.print-inline { display: none; }
a {
	color:#006AA8;
}
a:hover {
	color:#EB1C22;
	}
.col1 a {
	padding: 0 2px;
	}
.col1 a:hover, #botnav a:hover {
	color:#fff;
	background:#0079C0;
	text-decoration:none;
	}
.col1 a.i { padding: 0; }
.col1 a.i:hover { background: transparent; }

a.pdf,
.col1 a.pdf {
	background-image: url(images/icon_pdf.png);
	background-repeat: no-repeat;
	background-position: 2px center;
	padding-left: 30px;
	display: inline-block;
	min-height: 24px;
}

/* Fonts */

/* Generated by Font Squirrel (https://www.fontsquirrel.com) on September 18, 2012 08:42:14 PM America/New_York */
@font-face {
    font-family: 'Oswald';
    src: url('fonts/Oswald-Bold-webfont.eot');
    src: url('fonts/Oswald-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Oswald-Bold-webfont.woff') format('woff'),
         url('fonts/Oswald-Bold-webfont.ttf') format('truetype'),
         url('fonts/Oswald-Bold-webfont.svg#OswaldBold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Flavors';
    src: url('fonts/Flavors-Regular-webfont.eot');
    src: url('fonts/Flavors-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Flavors-Regular-webfont.woff') format('woff'),
         url('fonts/Flavors-Regular-webfont.ttf') format('truetype'),
         url('fonts/Flavors-Regular-webfont.svg#FlavorsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Worstveld-i';
    src: url('fonts/worstveld_sling_oblique-webfont.eot');
    src: url('fonts/worstveld_sling_oblique-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/worstveld_sling_oblique-webfont.woff') format('woff'),
         url('fonts/worstveld_sling_oblique-webfont.ttf') format('truetype'),
         url('fonts/worstveld_sling_oblique-webfont.svg#worstveld_sling_obliqueRg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Worstveld';
    src: url('fonts/worstveld_sling-webfont.eot');
    src: url('fonts/worstveld_sling-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/worstveld_sling-webfont.woff') format('woff'),
         url('fonts/worstveld_sling-webfont.ttf') format('truetype'),
         url('fonts/worstveld_sling-webfont.svg#worstveld_slingregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {
	font-family: Flavors, Impact, "Helvetica Inserat", Arial, sans-serif;
	margin: .2em 0 .4em 0;
	padding: 0;
	font-size: 2.3em;
	line-height: 1.3em;
	font-weight: normal;
	color: #0079C0;
	}
h2, h3, h4 {
	margin: .5em 0;
	padding: 0;
}
h2 {	
	color: #EB1C22;
	font-size: 1.4em;
	line-height: 1.2em;
	}
h3 {
	color: #000;
	font-size: 1.2em;
	line-height: 1.2em;
	}
h4 {
	color: #000;
	font-size: 1em;
	line-height: 1.3em;
	}
p {
	margin: 0 0 1em 0;
	padding: 0;
	}
ul, ol {
	margin-top: 0;
	margin-bottom: 1em;
	}
a img {
	border: 0;
	}
input, select, textarea {
	font: 100%/1.3em Arial, Helvetica, sans-serif;
	}
/* Header styles */

#header {
	width: 98%;
	border: 0;
	margin: 0;
	float: left;
	padding: 20px 1% 15px 1%;
	background: #0079C0 url(images/banner-fool-watermark.png) right center no-repeat;
	}
#header h1,
#header h2 {
	margin: 0;
	padding: 0;
	color: #fff;
	font-weight: normal;
	font-family: Impact, "Helvetica Inserat", Haettenschweiler, Oswald, sans-serif;
}
#header h1 {
	font-size: 2.5em;
	margin-bottom: .15em;
	}
#header h1 a {
	color: #fff;
	text-decoration: none;
	}
#header h1 a:hover {
	color: #FFF9A1; 
	text-shadow: -1px 1px 7px rgba(0,0,0,.5);
	}
#header h2 {
	font-size: 1.5em;
	line-height: 1em;
	}
#header h2 span {
	font: 1.1em/1em Flavors, Arial, Helvetica, sans-serif;
	padding-right: .25em;
	}
#header h3 {
	margin: 0;
	padding: 0;
	color: #fff;
	font-size: 1.2em;
	line-height: 1.15em;
	margin-bottom: 8px;
	}
#header #title-spons {
	float: left;
	padding: 14px .2% 14px 1.4%;
	}
#header #title-text {
	float: left; 
	text-align: left;
	padding: 0 1.6%;
	margin: 0 0 5px 0;
	}
#header #presented-by {
	float: left;
	text-align: left;
	padding: 0 1.6%;
	margin: 20px 0 5px 0;
	}
#header #presented-by span.cclogos { 
	white-space: nowrap; 
	}
#header span.alt {
	display: none;
	}
#header #presented-by img {
	padding-right: 8px;
	}
#header #afrlogo {
	float: left;
	margin: 0;
	padding: 0;
	}

#mmenu { display: none; }
	
#nav {
	clear: both;
	float: left;
	width: 97.6%;
	border: 0;
	list-style: none;
	margin: 0;
	padding: .4em 0 .2em 2.4%;
	background: #006AA8;
	font-size: .9em;
	line-height: 1.8;
	position: relative;
	z-index: 1;
	}

#nav li {
	margin: 0 8px 0 0;
	padding: 0 0 .2em 0;
	float: left;
	position: relative;
	height: 1.8em;
}

#nav a {
	display: block;
	float: left;
	padding: 0 10px;
	color: #fff;
	font-weight: normal;
	text-decoration: none;
	width: auto; 
	/* height: 1.8em; */
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px; 
	border-radius: 6px;
	-moz-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	-webkit-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	z-index: 1;
	}

#nav a:hover, #nav li:hover > a {
	background: #FFF9A1 url(images/nav-hov-bg.jpg) center center repeat-x;
	color: #000;
	-moz-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	-webkit-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	}
#nav ul { 
	display: none;
	position: absolute;
	list-style: none;
	margin-left: -1px;
	padding: 0;
	top: 2em;
	left: 0;
	float: left;
	width: 210px;
	background: #FFF9A1 url(images/nav-drop-bg2.jpg) center bottom repeat-x;
	background-size: contain;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px; 
	border-radius: 6px;
	-moz-box-shadow: -3px 4px 4px rgba(0,0,0,0.5), inset 1px -1px 2px rgba(0,0,0,0.4);
	-webkit-box-shadow: -3px 4px 4px rgba(0,0,0,0.5), inset 1px -1px 2px rgba(0,0,0,0.4);
	box-shadow: -3px 4px 4px rgba(0,0,0,0.5), inset 1px -1px 2px rgba(0,0,0,0.4);
	z-index: 9999;
	}
#nav ul li {
	min-width: 210px;
	height: auto;
	border: none;
	margin: 0;
	padding: 0; 
	border: 0;
	}
#nav ul a {
	font-weight: normal;
	font-size: .9em;
	line-height: 1.2em;
	padding: 5px 10px;
	width: 190px;
	height: auto;
	background: transparent !important; 
	color: #000 !important;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	}

#nav ul :hover > a {
	background: #EE3338 !important;
	color: #fff !important;
}
#nav ul #gogreen a:hover {
	background: green !important;
	}

#nav li:hover > ul {
	display: block;
	z-index: 9999;
}

#subnav {
	clear: both;
	background: #fff url(images/subnav_greenwave.jpg) center bottom repeat-x;
	width: auto;
	height: 29px;
	}
#wrapper {
	width: auto;
	max-width: 1800px;
	margin: 0 auto;
	padding: 0;
	z-index: 10;
	}

/* column container */
.colmask {
	position:relative;	/* This fixes the IE7 overflow hidden bug */
	clear:both;
	float:left;
	width:100%;			/* width of whole page */
	overflow:hidden;		/* This chops off any overhanging divs */
}
/* common column settings */
.colright,
.colmid,
.colleft {
	float:left;
	width:100%;			/* width of page */
	position:relative;
}
.col1,
.col2,
.col3 {
	float:left;
	position:relative;
	padding: 1em 0;	/* no left and right padding on columns, we just make them narrower instead 
					only padding top and bottom is included here, make it whatever value you need */
	overflow:hidden;
}
/* 3 Column settings */
.threecol {
	background:#fff;		/* right column background colour */
}
.threecol .colmid {
	right:25%;			/* width of the right column */
	background:#fff;		/* center column background colour */
}
.threecol .colleft {
	right:55%;			/* width of the middle column */
	background:#fff;	/* left column background colour */
}
.threecol .col1 {
	width:51%;			/* width of center column content (column width minus padding on either side) */
	left:102%;			/* 100% plus left padding of center column */
}
.threecol .col2 {
	width:18%;			/* Width of left column content (column width minus padding on either side) */
	left:30%;			/* width of (right column) plus (center column left and right padding) plus (left column left padding) */
	text-align: right;
}
.threecol .col3 {
	width:21%;			/* Width of right column content (column width minus padding on either side) */
	left:88%;			/* Please make note of the brackets here:
					(100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
	padding-top: 1.5em;
}
.col1 img {
	max-width: 100%;
	} 
.col2 img, .col3 img {
	max-width: 96%;
	}
.col2 img {
	padding-bottom: 1em;
	}

a.inlinebutton {
	display: inline-block;
	margin: .5em 0;
	background: #9EBD7A;
	border: 1px solid #999;
	text-transform: uppercase;
	font-size: .95em;
	line-height: 1.2;
	font-weight: bold;
	text-align: center;
	color: #000;
	text-decoration: none;
	padding: 7px 20px;
	-moz-border-radius: 16px;
	-webkit-border-radius: 16px; 
	border-radius: 16px;
	-moz-box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	-webkit-box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	-webkit-text-shadow: 0 1px 2px rgba(255,255,255,.6);
	-moz-text-shadow: 0 1px 2px rgba(255,255,255,.6);
	text-shadow: 0 1px 2px rgba(255,255,255,.6);
}
a.inlinebutton:hover {
	background: #EE3338;
	color: #fff;
	-webkit-text-shadow: 0 -1px 1px rgba(0,0,0,.8);
	-moz-text-shadow: 0 -1px 1px rgba(0,0,0,.8);
	text-shadow: 0 -1px 1px rgba(0,0,0,.8);
}

	
.nicebutton {
	display: block; 
	background: #9EBD7A;
	width: 90%;
	border: 1px solid #999;
	margin: 4px auto 15px auto;
	-moz-border-radius: 16px;
	-webkit-border-radius: 16px; 
	border-radius: 16px;
	-moz-box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	-webkit-box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	box-shadow: -1px 1px 3px rgba(0,0,0,0.25), inset 0 14px 14px rgba(255,255,255,0.6);
	transition: all .3s ease;
}
.nicebutton.hivis {
	background: #45B0E3;
}
.nicebutton a {
	display: block;
	width: auto;
	overflow: hidden;
	font-size: 1.1em;
	line-height: 1.3em;
	font-weight: bold;
	text-align: center;
	color: #000;
	text-decoration: none;
	padding: 7px 7px 8px 7px;
	-moz-border-radius: 16px;
	-webkit-border-radius: 16px; 
	border-radius: 16px;
	-webkit-text-shadow: 0 1px 2px rgba(255,255,255,.6);
	-moz-text-shadow: 0 1px 2px rgba(255,255,255,.6);
	text-shadow: 0 1px 1px rgba(255,255,255,.9);
	transition: all 0.3s ease;
	}
.nicebutton:hover {
	background: #EE3338;
}
.nicebutton:hover > a,
.nicebutton a:hover {
	color: #fff;
	background: transparent;
	-webkit-text-shadow: 0 -1px 1px rgba(0,0,0,.8);
	-moz-text-shadow: 0 -1px 1px rgba(0,0,0,.8);
	text-shadow: 0 -1px 1px rgba(0,0,0,.8);
	}
#regbut a {
	font-size: 1.2em;
	line-height: 1.3em;
	text-transform: uppercase;
	}
.nbm { margin-bottom: 0; }
.ntm { margin-top: 0; }
.hbm { margin-bottom: .5em; }
.left { text-align: left; }
.cen { text-align: center; }
.blue { color: #0079C0; }
.normal { font-family: Arial, Helvetica, sans-serif; font-size: .7em; }
img.centred { display: block; margin: 0 auto 1em auto; }
.sm { font-size: .85em; line-height: 1.3em; }
.red  { color: #EB1C22; }
.green { color: #739E42; }
.pay-attn { background: yellow; padding: 2px 4px; }
sup { font-size: .6em; vertical-align: top; }
iframe { max-width: 100%; }
.video-holder {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.video-holder iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.alert { 
	background: transparent url(images/alert.png) 0 3px no-repeat;
	padding-left: 58px;
	min-height: 51px; 
	}
li.alert {
	list-style: none;
	margin-left: -15px;
	}
.advice {
	clear: left;
	background: transparent url(images/advice2.png) 0 3px no-repeat;
	padding-left: 60px;
	min-height: 63px;
	font-style: italic;
	font-family: "Gill Sans", "Gill Sans MT", GillSans, Calibri, "Trebuchet MS", sans-serif;
	font-size: 1.15em;
	line-height: 1.2em;
	margin-left: 1.5em; 
	margin-right: 1.5em;
	}
.flr { float: right; margin: 5px 0 10px 1em; }
.fll { float: left; margin: 5px 1em 10px 0; }
.col1 .flr, 
.col1 .fll {
	max-width: 40%; 
	}
.snap { 
	background: #fff; 
	padding: 5px; 
	border-right: 1px solid #eee;
	margin-bottom: 5px;
	-moz-box-shadow: -3px 2px 6px rgba(0,0,0,0.5);
	-webkit-box-shadow: -3px 2px 6px rgba(0,0,0,0.5);
	box-shadow: -3px 2px 6px rgba(0,0,0,0.5);
	}
.fll.snap {
	margin-left: 9px;
	}
.flr.snap {
	margin-right: 2px;
	}
.captioned { 
	font-size: .8em;
	line-height: 1.2em;
	color: #444;
	background: #fff; 
	/* padding: 5px; */ 
/* 	border-right: 1px solid #eee;
	-moz-box-shadow: -3px 2px 6px rgba(0,0,0,0.5);
	-webkit-box-shadow: -3px 2px 6px rgba(0,0,0,0.5);
	box-shadow: -3px 2px 6px rgba(0,0,0,0.5); */
	}
.captioned img {
	display: inline;
	margin: 0;
	padding: 0 0 5px 0;
	}
.flr.captioned {	 margin: 5px 2px 10px 1.3em; }	
.fll.captioned { margin: 5px 1em 10px 9px; }
img.anglepic {
	margin: 1em auto 3em;
	transform: rotate(-7deg);
	transform-origin: 50% 50%;
	border: 6px solid #fff;
	box-shadow: 2px 2px 7px rgba(0,0,0,.6);
	display: block; 
	width: 200px;
	padding: 0 !important;
}
.lpic-caption { text-align: center; color: #444; font-size: .8em; line-height: 1.2em; }
.lside { float: left; width: 48%; }
.rside { float: right; width: 48%; }
.col-third { float: left; width: 30%; margin-right: 3%; }
.col-third .last { margin-right: 0; }
.sep li { margin-bottom: .75em; }
ul.nobul { list-style: none; margin-left: .5em; padding-left: 0; }
ul ul { margin-bottom: .2em; }
.bc { font-size: .9em; }
.quote {
	background: #eee;
	clear: both;
	padding: 10px 3%;
	margin: 1em 0;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px; 
	border-radius: 30px;
	-moz-box-shadow: inset 0px 0px 20px rgba(255,255,255,1);
	-webkit-box-shadow: inset 0px 0px 20px rgba(255,255,255,1);
	box-shadow: inset 0px 0px 20px rgba(255,255,255,1);
	}
.quote p, p.mini-quote {
	font-family: Worstveld, Georgia, serif;
	font-style: italic;
	font-size: 1.3em;
	line-height: 1.6em;
	margin-bottom: 0;
	}
.quote em {
	font-family: Arial, Helvetica, sans-serif;
	font-size: .65em; 
	font-style: normal;
	display: block;
	margin-left: 5%;
	color: #666;
	}
p.mini-quote {
	font-size: 1.1em;
	}
hr { 
	height: 1px; 
	border: 3px dotted #0079C0;
	border-width: 0 0 3px 0;
	clear: both;
	margin: 1.5em 0;
	padding: 0;
	}
.credits { text-align: center; font-size: .85em; }
.bigbutton-holder {
	clear: both;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 0;
	margin: .7em 0;
}
.col1 a.bigbutton {
	flex: 0 1 23%;
	box-sizing: border-box;
	display: block;
	border: 1px solid #33A3DB;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	padding: 1%;
	text-decoration: none;
	font-weight: bold;
	margin: 0 1% 1em;
	text-align: center;
	-webkit-box-shadow: -2px 2px 4px rgba(0,0,0,.5), inset 0px -2px 5px rgba(0,0,0,.4);
	-moz-box-shadow: -2px 2px 4px rgba(0,0,0,.5), inset 0px -2px 5px rgba(0,0,0,.4);
	box-shadow: -2px 2px 4px rgba(0,0,0,.5), inset 0px -2px 5px rgba(0,0,0,.4);
}
a.bigbutton img {
	display: block;
	margin: .25em auto;
	padding: 0;
	max-width: 100%;
}
.box, .box2 {
	border: 1px solid #A6CCAF;	
	padding: 8px 12px 10px 12px;
	/* text-align: left; */
	margin: 3px 3px 1em 1px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	-moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.5);
	-webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.5);
	box-shadow: 1px 2px 2px rgba(0,0,0,0.5);
	}
.box {
	background: #f8faf4; 
	}
.box h3 {
	margin: 0 0 .5em 0; 
	}
.box2 h3 {
	color: #6E9443;
	margin: 0 0 .5em 0;
	}
.box, .box2 .flr { margin-top: 4px; }	

.sbsh {
	display: none;
	background: url(images/easter-egg.png) 8px 3px no-repeat;
	border: 1px solid #7ED562;
	border-radius: 12px;
	padding: 5px 10px 5px 85px;
	max-width: 240px;
	margin: 1em auto;
	overflow: hidden;
	color: #666;
	text-indent: -33px;
}
.sbsh a {
	font-size: .75em;
	white-space: nowrap;
}
.home-page .sbsh {
	max-width: 100%;
	padding-left: 62px;
	text-indent: 0;
	color: #000;
	border-width: 2px;
}
.home-page .sbsh a {
	font-size: 1em;
}

.top { 
	text-align: right; 
	text-transform: uppercase; 
	font-size: .85em; 
	letter-spacing: 1px; 
	margin: 1.5em 0;
	clear: both;
	}
.top a { 
	display: block; 
	text-decoration: none; 
	padding: 0 5px 2px 0; 
	border-bottom: 3px dotted #0079C0;
	}
.top a:hover {
	border-color: #98B974;
	background: transparent;
	color: #98B974;
	}
.clr { clear: both; }
.icon { vertical-align: middle; padding-right: 3px; }
.indent { margin-left: 2.5em; }
dt { font-weight: bold; 
	margin: 1em 0 .2em 0; }
dd { margin: 0 0 1em 2em; }
.sitemap dt { font-weight: normal; font-size: 1.2em; }
.sitemap dd { margin-bottom: 0; }
.spons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin-bottom: 1em;
	margin-top: 0;
	padding: 0;
	line-height: 1;
}
.spons > a {
	display: block;
	margin: 1em;
	padding: 0;
}
.spons img {
	padding: 5px 10px; 
	max-width: 96%;
}
.side-spons {
	text-align: center; 
	margin-bottom: 1em;
	margin-top: 0;
	padding: 0;
	background: #fff;
	font-size: .85em; line-height: 1.2em;
	}
.side-spons img {
	padding: 12px 10px;
	vertical-align: middle;
	}
table.size-chart { 
	margin: 0 0 1em 0; 
	border: 1px solid #ccc;
	border-width: 1px 0 0 1px;
	}
.size-chart td { 
	padding: 4px; 
	border: 1px solid #ccc;
	border-width: 0 1px 1px 0;
	}
.size-chart .top-row td { 
	font-weight: bold; 
	border-bottom: 2px solid #98B974; 
	padding-top: 10px; 
	}
.racelisting { border-top: 1px solid #97B873; padding-top: .75em; padding-bottom: .25em; margin-bottom: .75em; margin-top: 1em; clear: left; }
.racelisting p { margin-left: 145px; margin-bottom: 0; margin-top: 0; }
.racelisting img { float: left; padding-bottom: .75em; }	

/* Photo gallery thumbnails: */

.col1 .imagerow {
	margin: 1em 0 .25em 0;
	line-height: 1em;
	}
.col1 .imagerow a { 
	display: inline-block;
	vertical-align: top;
	-webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
	box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
	padding: 2px 2px 0px 2px;
	margin: 0 10px 12px 0;
	background-color: #1484C5;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
    *display: inline;
	}
.col1 .imagerow a:hover {
	background-color: #97B774;
	}
.col1 .imagerow a img {
	border: 1px solid rgba(255, 255, 255, 0.3);
	padding: 0;
	margin: 0;
	}

/* training schedule styles */

.week {
	clear: both;
	margin-bottom: 1em;
	border-top: 1px solid #999;
	padding-top: .5em;
}
.day, .workout { 
	display: inline-block;
	vertical-align: top;
}
.day { 
	width: 23%;
	padding-right: 2%;
	clear: both;
	text-align: right;
}
.day:after {
	content: ":";
}
.workout {
	width: 74%;
}

/* form styles */

.signup label { 
	font-weight: bold; 
	text-align: right; 
	width: 40%;
	margin-right: 1%;
	display: inline-block; 
	vertical-align: top; 
}
.signup input[type="text"] { 
	text-align: left; 
}
form.signup .row { 
	clear: both; 
	margin: 1em 0;
	padding: 0;
}
form.signup .field { 
	padding: 0;
	width: 50%; 
	display: inline-block; 
	vertical-align: top; 
}
.pagenav {
	columns: 2;
	column-gap: 1em;
}
.pagenav.nocols {
	columns: 1;
	column-gap: 0;
}

.special {
	border: 2px solid red;
	padding: 15px;
	margin: 1em 0;
	border-radius: 8px;
}
.special p {
	margin-bottom: 0;
}
.special p a {
	font-size: 1.25em;
	font-weight: bold;
	line-height: 1.3;
	display: block;
	margin-bottom: .2em;
}
.special a:hover {
	background: transparent;
	color: red;
}
.special .image {
	text-align: center;
}
@media screen and (min-width: 414px) {
	.special {
		display: flex;
		justify-content: space-between;
	}
	.special p {
		flex-basis: 76%;
	}
	.special .image {
		flex-basis: 20%;
	}
}
	
/* Footer styles */
#footer {
	clear:both;
	float:left;
	width:100%;
	text-align:center;
	background: #CAE5AE;
	border-top:1px solid #ccc;
}
#footer p {
	padding:10px;
	margin:0;
}
#botnav {
	padding: 8px;
	}
#botnav a {
	padding: 0px 5px;
	}
#top-link { 
	display: none; 
	}

@media ( max-width: 1260px ) {
	#header h1 {
		font-size: 2.1em;
	}
	#header h2 {
		font-size: 1.3em;
		}
	#header h2 span {
		font: 1.05em/1em Flavors, Arial, Helvetica, sans-serif;
		padding-right: .2em;
	}
	#header h3 {
		font-size: 1.1em;
		line-height: 1.2em;
	}
	#header #title-spons {
		width: 132px;
		padding-left: 1.2%;
	}
	#header #title-text {
		padding-right: .8%;
		}
	#header #afrlogo img {
		/* width: 135px; */
		width: 175px;
	}
	#header #presented-by img {
		padding-right: 5px;
		width: 110px;
	}
	#nav {
		width: 99%;
		padding-left: 1%;
	}
	#nav li {
		margin-right: 1px;
	}
}
@media ( max-width: 1000px ) {
	#header {
		text-align: right;
		padding-bottom: 10px;
		padding-top: 15px;
		}
	#header #presented-by {
		clear: left;
		margin-left: 145px;
		margin-top: 0;
		}
	#header h3 {
		display: inline;
		padding-right: 8px;
	}
	#header #presented-by img {
		vertical-align: middle;
	}
	#header #afrlogo {
		position: absolute;
		float: none;
		left: 600px;
		top: 20px;
	}
	#header #afrlogo img {
		width: 130px;
	}
	#nav a {
		padding: 0 8px;
	}
	#nav ul a {
		padding: 5px 8px;
		width: 194px;
	}
	/* switch to two column layout */
	.threecol .colleft {
		right:75%;			/* width of the middle column */
	}	
	.col2 { 	display: none; }
	.threecol .col1 {
		width:71%;			/* width of center column content (column width minus padding on either side) */
	}
	.threecol .col3 {
		left:106%;			/* Please make note of the brackets here:
					(100% - left column width) plus (center column left and right padding) plus (left column left and right padding) plus (right column left padding) */
	}
}

@media ( max-width: 899px ) {
	/* hide drop downs when nav menu doesn't fit on one line */
	#nav li:hover > ul {
		display: none;
	}

}

@media ( max-width: 767px ) {
	#header #afrlogo {
		top: 90px;
		left: 447px;
	}
	#header #afrlogo img {
		padding: 0;
		width: 110px;
	}
	/* switch to single column layout */
	.colmask {
		position:static;	
		float:none;
		overflow:visible;
		padding: 0 16px;
		width: auto;
	}
	.colright,
	.colmid,
	.colleft {
		float:none;
		position:static;
		width: 100%;
	}
	.threecol .col1, .threecol .col3 { 
		clear: both; 
		float: none; 
		position: static;
		width: 100%;
		padding: .25em 0;
		overflow: visible;
	}
}

@media ( max-width: 620px ) {
	body { font-size: 104%; }
	#header { 
		box-sizing: border-box;
		width: 100%;
		padding: 8px 1.8% 6px 5%;
		font-size: 74%; 
		text-align: left; 
		border-bottom: 12px solid #006AA8;
		background-image: url(images/banner-fool2-watermark.png);
	}
	/* Make BMO logo smaller: */
	#header #title-spons {
		width: 75px;
		padding: 0 8px 0 0; 
		margin-bottom: 4px;
	}
	#header #title-text {
		float: none;
		margin: 0;
		padding: 0;
	}
	#header h1 { 
		line-height: 1.1em; 
		padding-right: 80px;
	}
	#header h2 { display: none; }
	#header #presented-by { 
		float: none; 
		margin: 0;
		padding: 0;
		/* text-align: center; */
	}
	#header #presented-by img {
		width: 72px;
		vertical-align: baseline;
	}
	/* #header #presented-by span.alt {
		display: inline;
	} */
	#header h3 { 
		padding-right: 0; 
		font-family: Arial, Helvetica, sans-serif;
		font-weight: normal;
		font-size: 1.4em;
		line-height: 1.2;
		margin: 0;
	}
	/* #header #presented-by span.cclogos { 
		display: none; 
	} */
	#header #afrlogo {
		top: 15px;
		left: auto;
		right: 8px;
	}
	#header #afrlogo img {
		width: 110px;
	}
	#nav { display: none; }
	#subnav { 
		text-align: right; 
	}
	#mmenu { 
		display: inline-block;
		text-decoration: none;
		padding: 8px;
		margin: 0 10px 5px 5px;
		transform: translateY(-20px);
		font-size: 1.3em;
		line-height: 1.1em;
		background: #FFF9A1 url(images/nav-hov-bg.jpg) center center repeat-x;
		color: #000;
		border-radius: 6px;
		box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
	}
	#mmenu:hover, 
	#mmenu:active {
		background: #EB1C22;
		color: #fff;
		-moz-box-shadow: -2px 2px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-box-shadow: -2px 2px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
		box-shadow: -2px 2px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
	}
	#footer {
		background: #fff;
		border: none;
		}
	#footer p {
		padding: 5px;
	}
	#top-link {
		display: block;
		background: #006AA8;
		padding: 5px 5px 1px 5px;
		margin: 0;
	}
	.pagenav {
		columns: auto;
		column-gap: 0;
		list-style: none;
		margin: -10px 0 10px -10px;
		padding: 0;
		text-align: center;
		display: flex;
		flex-wrap: wrap;
	}
	.pagenav li {
		flex: 0 1 calc(50% - 10px);
		margin: 10px 0 0 10px;
		box-sizing: border-box;
		background: #CAE5AE;
		/* hyphens: auto; */
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px; 
		border-radius: 6px;
		-moz-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-text-shadow: 0 1px 2px rgba(255,255,255,.9);
		-moz-text-shadow: 0 1px 2px rgba(255,255,255,.9);
		text-shadow: 0 1px 2px rgba(255,255,255,.9);
	}
	.pagenav a {
		font-size: .95em;
		line-height: 1.3;
		padding: .5em;
		box-sizing: border-box;
		display: block;
		text-decoration: none;
		color: #000;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		font-weight: bold;
	}
	.pagenav a:hover,
	.pagenav a:active {
		background: transparent;
		text-shadow: none;
		color: #000;
	}
	.pagenav li:hover,
	.pagenav il:active {
		background: #FFF9A1;
		color: #000;
	}
	.col1 .flr, 
	.col1 .fll {
		max-width: 50%;
	}
	.indent {
		margin-left: 1.5em;
	}

	#botnav {
		background: #006AA8;
		margin: 0;
		padding: 0px 5px 5px 5px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		/* -moz-column-count: 2;
		-webkit-columns: 2;
		-o-columns: 2;
		columns: 2;
		-webkit-column-gap: 5px;
		-moz-column-gap: 5px;
		-o-column-gap: 5px;
		column-gap: 5px; */	
	}
	#botnav a {
		flex-basis: 49.5%;
		box-sizing: border-box;
	}
	#botnav a, #top-link a {
		margin-bottom: 5px;
		padding: .4em .1em;
		display: block;
		text-decoration: none;
		color: #000;
		background: #CAE5AE;
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px; 
		border-radius: 6px;
		-moz-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		box-shadow: inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-text-shadow: 0 1px 2px rgba(255,255,255,.9);
		-moz-text-shadow: 0 1px 2px rgba(255,255,255,.9);
		text-shadow: 0 1px 2px rgba(255,255,255,.9);
	}
	#top-link a { font-weight: normal; }
	#botnav a:hover,
	#botnav a:active,
	#top-link a:hover,
	#top-link a:active {
		background: #FFF9A1;
		color: #000;
		-moz-box-shadow: -1px 1px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
		-webkit-box-shadow: -1px 1px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
		box-shadow: -1px 1px 2px rgba(0,0,0,0.4), inset 1px -1px 2px rgba(0,0,0,0.4);
	}
	.lside, .rside, .col-third { float: none; width: auto; margin-right: 0; }
	.quote p {
		font-size: 1.2em;
		line-height: 1.6em;
		}
	.col1 a.bigbutton {
		flex: 0 1 46%;
		padding: 1.5%;
		margin: 0 2% 1em;
	}
	.racelisting p { margin-left: 24%; }
	.racelisting img { max-width: 22%; height: auto; }	

	/* training schedule styles */
	.day { 
		width: 30%;
	}
	.workout {
		width: 66%;
	}

}

@media ( max-width: 415px ) {
	.pagenav {
		flex-direction: column;
	}
	.pagenav li {
		flex: 0 1 auto;
	}
	.col1 h1 { font-family: Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; font-weight: bold; font-size: 1.8em; line-height: 1.2em; margin-top: 0; }
	#header { 
		font-size: 68%; 
		border-width: 0 0 8px 0; 
	}
	#header h1 { 
		padding-right: 100px;
	}
	/* Make BMO logo smaller: */
	#header #title-spons {
		width: 65px;
		padding: 0 4px 0 0; 
		margin-bottom: 6px;
	}

	#header #afrlogo  img {
		width: 90px;
	}
	.snap, .captioned { 
		padding: 4px; 
		-moz-box-shadow: -3px 2px 4px rgba(0,0,0,0.35);
		-webkit-box-shadow: -3px 2px 4px rgba(0,0,0,0.35);
		box-shadow: -3px 2px 4px rgba(0,0,0,0.35);
	}
	
	#botnav {
		-moz-column-count: 1;
		-webkit-columns: 1;
		-o-columns: 1;
		columns: 1;
		-webkit-column-gap: 0px;
		-moz-column-gap: 0px;
		-o-column-gap: 0px;
		column-gap: 0px;
	}
	dd { margin-left: 0; }
	.sitemap dd { margin-left: 10px; }
	ul { margin-left: 18px; padding-left: 0; }
	ol { margin-left: 23px; padding-left: 0; }
	.advice {
		margin-left: .75em;
		margin-right: .75em;
	}
	.indent { margin-left: .75em; }
	.racelisting p { margin-left: 0; }
	.racelisting img { max-width: 40%; margin-right: 16px; padding-bottom: 0; }

	/* training schedule styles */
	.day, .workout { 
		display: block;
		vertical-align: baseline;
	}
	.day { 
		width: auto;
		font-weight: bold;
		padding-right: 0;
		text-align: left;
	}
	.workout {
		width: auto;
		margin-bottom: .5em;
	}
	.signup label { 
		text-align: left; 
		width: auto; 
		display: block; 
		margin-right: 0;
	}
	.signup input[type="text"] { 
		display: block;
		margin: 0 .5em;
	}
	form.signup .row { 
		margin: .5em 0;
	}
	form.signup .field { 
		width: auto; 
		display: block; 
	}

	.col1 .flr, 
	.col1 .fll {
		float: none;
		max-width: 90%;
		display: block;
		margin: 1.5em auto;
	}

}
@media ( max-width: 350px ) {
	#header h1 {
		padding-right: 0;
	}
	#header #afrlogo  img {
		width: 75px;
	}
	.quote p {
		font-size: 1.1em;
		line-height: 1.5;
	}
	.spons img {
		padding: 8px 2%; 
		max-height: 80px;
		width: auto;
		height: auto;
	}
}

@media ( max-width: 318px ) {
	#header #afrlogo {
		display: none;
	}
	#header h1 { 
		padding-right: 0px;
	}
	.alert { 
		padding-left: 0;
		padding-top: 52px;
		min-height: 0; 
	}
	li.alert {
		margin-left: 0;
	}
	.advice {
		padding-left: 0;
		padding-top: 68px;
		min-height: 0;
		margin-left: .5em;
		margin-right: .5em;
	}
	
	.col1 a.bigbutton {
		flex: 0 1 100%;
		text-align: left;
		padding: 3% 2% 3% 28%;
		margin-bottom: 1em;
		position: relative;
		overflow: hidden;
	}
	a.bigbutton img {
		width: 24%;
		position: absolute;
		top: -5px;
		left: 0px;
	}
	.pagenav li {
		flex: 0 1 calc(100% - 10px);
	}
}

ol.is-style-fancy-list {
	list-style: none;
	counter-reset: my-awesome-counter;
	padding-left: 54px;
	margin-left: 0;
}
ol.is-style-fancy-list li {
	margin: 0 0 1.5rem 0;
	counter-increment: my-awesome-counter;
	position: relative;
}
ol.is-style-fancy-list li:before {
	content: counter(my-awesome-counter);
	color: #fff;
	background-color: #0079C0;
	font-size: 1.25rem;
	font-weight: bold;
	position: absolute;
	--size: 38px;
	left: calc(-1 * var(--size) - 16px);
	line-height: var(--size);
	width: var(--size);
	height: var(--size);
	top: 0;	
	border-radius: 50%;
	text-align: center;
}