@import url(https://fonts.googleapis.com/css?family=Raleway:300,500,800);
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700');
/* ==|== primary styles =====================================================
   Author: Silverink
   ========================================================================== */

/* ==|== Easibuild Structural Elements =====================================================
   Structural elements such as mainContent/Wide, submenu etc. Ideally these elements will change
   to HTML5 tags...  aside, article etc.
   ========================================================================== */

  /* COLOURS

	  Dark Blue : rgb(53,74,131)
	  Yellow : rgb(253,206,36)

  */

a:hover {text-decoration: none;}
body {position: relative; z-index: 1;}
body[data-itemid="1"] .bCrumbContain {display: none;}
.rightImg {float: none; display: block; margin-bottom: 30px;}
.rightImg img {float: none !important;}
blockquote {border-left: 2px solid rgb(253,206,36); font-weight: 500; font-style: oblique; line-height: 180%;}

 .alert {display: block; border-radius: 0px;}
audio {width: 100%;}
	#audio p {text-align: center;}
	#audio {margin: 40px 0px;}
	p, select, ul, ol { font-size: 1.6rem; line-height: 160%;}
	
	
body { position: relative; overflow-x: hidden; font-family: "Raleway","Futura PT", Futura,  "Century Gothic", sans-serif ; font-size: 100%; margin-top: 60vh;  } /* FIXED HEADER HEIGHT */


.bCrumbContain {background: #dedede; text-transform: capitalize;}
.breadcrumb {background: none; margin-bottom: 0px; padding-left: 0px;}
	.breadcrumb a {font-weight: bold;}
.whiteContainerWrap {background-color: #fff; overflow: hidden;}

.btn-default {background: rgb(253,206,36); color: rgb(53,74,131); border-radius: 0px; border: none; font-weight: bold; text-transform: uppercase;}


.ContactDetails h1, .ContactForm h1 {font-size: 1.75em;}
	.ContactForm label, #questionForm label {display: block;}
	.ContactForm div, #questionForm div {margin-bottom: 10px;}
	.ContactForm input[type='text'], .ContactForm input[type='tel'], .ContactForm input[type='email'], .ContactForm textarea {border: 1px solid #888;}
	.notEmail {display: none;}
	form { font-size: 1.25em;}


.dataTables_filter {text-align: left !important;}
.dataTables_filter input {max-width: 150px;}

.dataTables_length {float: left;}
.dataTables_info {float: left;}
.dataTables_paginate {}
.paginate_button_disabled {opacity: 0.4; -moz-opacity: 0.4;}
.paging_full_numbers {color: #257f5b;}
.dataTables_wrapper {margin-top: 0px}


/* FAQ TEMPLATE */
.answer {padding: 15px; font-size: 1.4em;}

footer {background: #344a83;}
footer .container  {margin-top: 30px; padding-top: 30px; border-top: 1px solid rgb(0,92,155)}

.greyBg {background: rgb(224,226,231); padding: 50px 0px 20px 0px; margin-top: 0px;}


body[data-itemid="12"] h1 {clear: both; margin-top: 40px;}
.galleryimage {float: left; margin: 20px; height: 320px;}
.galleryimage h2 {font-size: 1.2em;}
.gallerycaption {font-size: 1.4rem; padding: 5px;}


.productimage {margin: 2%; box-shadow: 0px 0px 8px rgba(0,0,0,0.6)}
.productimage td {padding: 10px;}
.productimage p {margin-bottom: 3px; font-size: 1.4rem;}
h1 {font-size: 2.4em; margin-bottom: 30px;}
h2 {font-size: 2em;}
h3 {font-size: 1.8em; line-height: 160%;}
.homeItem {box-shadow: 0px 0px 5px rgba(0,0,0,0.3); position: relative; height: 130px; margin-bottom: 30px; }
	.homeItem .bgImage {background-size: cover; background-position: center bottom; background-repeat: no-repeat; width: 100%; height: calc(100% - 50px);}
	.homeItem h3 {position: absolute; bottom: 0px; left: 0px; line-height: 50px; background: rgb(253,206,36); font-size: 1.4em; font-weight: 800; width:100%; margin: 0; text-align: center; text-transform: uppercase;}

#halfMarathonContent {background: #e2edf4; padding: 50px 0px}

img {max-width: 100%; height: auto !important;}

#logo {padding: 15px 0px;}
#logo img {max-width: 100%; max-height:70px;cursor: pointer; display: block;}
	#logo a.enterButton {display: none;}
	
/* ==|== Everything Else =====================================================================
   Alphabetically ordered unles it's nested (.level2 will be nested with #submenu for example)
   =========================================================================================== */


/* CAROUSEL */
.carousel {height: 70vh; transition: all 0.6s ease; }
	.carousel-inner {height: 70vh}
	.carousel .item { width: 100%; height:100%;}
		.slideImage {background-size: auto 100%; height:100%; background-position: center center; transition: all 0.6s ease;}
		.zap .slideImage {background-size: auto 140%;background-position: bottom center;}
.flickrGal {padding: 0; margin: 0;}

.fb-page, .tweets {width: 100%; max-width:500px; display: inline-block;}

	.fixedBreadCrumb {position: fixed; top: 70px; width: 100%; z-index: 50;}
	.fixedBreadCrumb ol {float: right;}
	
	
	.fixedBreadCrumb + .mobileSubMenuContain { position: fixed;top: 110px; width: 100%; z-index: 50;}

body[data-itemid='71'] figure {cursor: pointer;}

	.share {text-align: right; vertical-align: middle;margin-top: 25px;}
		.share img, .share svg {width: 32px; height: 32px; margin: 5px; display: inline-block;}

/* FRONT PAGE IMAGES */

#fpImageDiv.carousel {position: fixed; top: 0px; left: 0px; height: 70vh; width: 100%; z-index: -2;}
	#fpImageDiv	.carousel-caption { position: absolute; left: 0px; bottom: 0px; background: rgba(0,0,0,0); width: 100%; padding: 0;}
		#fpImageDiv	.carousel-caption .heading {text-transform: uppercase; font-weight: 400; font-size: 3.8em; letter-spacing: 0.1rem; display: none;}
		#fpImageDiv	.Desc {background: rgb(253,206,36); color: rgb(53,74,131); font-weight: 800; text-align: center; display: inline-block; padding: 15px 60px; font-size: 1.5em; text-shadow: none; cursor: pointer; margin-bottom: 30px; text-transform: uppercase;}
		#fpImageDiv	.Desc p  {margin: 0;}
		#fpImageDiv .summary {padding-top: 15px; padding-bottom: 15px; background: rgb(53,74,131);font-size: 1.6em; height:100%; display: block; position: absolute; bottom: 0px;}
		
		#fpImageDiv .carousel-indicators {display: none;}


#homeEditable {padding-top: 10px;}

			#topBanner {background-color: #0f3d71; padding-bottom: 0px;}
#topBanner {position: fixed; top: 0px; width: 100%; z-index: 100;}

			.carousel-control.right {position: absolute; right: 0px; left: auto;}

/* END FRONT PAGE IMAGES */

/* GALLERY */
figcaption .btn {width: 100%; padding: 10px; margin-bottom: 30px;}
body[data-template='Gallery'] figure {background-repeat: no-repeat; background-size: cover; background-position: center center; cursor: pointer; height: 250px; margin-bottom: 30px;border: 1px solid #c6c6c6; position: relative;}
	body[data-template='Gallery'] figcaption {background: #f3f4f8; position: absolute; bottom: 0px; width: 100%; padding: 5%; text-align: center; text-transform: uppercase; height: 60px; vertical-align: middle; font-size: 0.75em;}
body[data-template='Gallery'] li {list-style-type: none; margin:0; text-align: center;}
body[data-template='Gallery'] .controls{
        width:50px;
        display:block;
        padding-top:8px;
        font-weight:bold;
        font-size: 1em;
    }
    body[data-template='Gallery'] .next {
        float:right;
        text-align:right;
    }

    #galleryModal .modal-body {text-align: center;}
    	.img-responsive {margin: auto;}

.mb {margin-bottom: 5px;}

/* KNOWLEDGEBASE */


.panel-default>.panel-heading {background-color: rgb(71,149,195); color: rgb(255,255,255)}
.panel-heading a {display: block;}
.panel-group .panel {margin-bottom: 20px;}
/* END KNOWLEDGEBASE */
.mobileButton:before {content: "MENU"; position: absolute; left: -60px; top: 0px; color: #fff; font-weight: 500; font-size: 1.6em;}
	.mobileButton {border: none !important; border-radius: 0px; padding: 0; width: 25px; margin-top: 10px; position: absolute; right: 0px; top: 15px;}
		.mobileButton span {height: 5px;}


.mobileMenu {background: rgba(0,29,51,1); border-left: 1px solid rgb(255,255,255); z-index: 2000;}
	.mobileMenu .header {background: rgba(0,29,51,1); padding: 0px 15px; text-align: right;font-weight: 500; font-size: 1.6em; height: 60px; z-index: 10000;}
	.mobileMenu .header a {text-decoration: none; color: #fff; display: inline-block; padding-top: 22px;}
		.mobileMenu .header .svg {width: 24px; height: 24px; float: right; margin-top: 0px; margin-left: 10px; margin-right: 3px;}
	.mobileMenu ul { padding: 0px; margin: 0px;}
		.mobileMenu li a {display: block; line-height: 50px; background: rgba(255,255,255,0.9); margin-top: 1px; text-align: center; text-transform: uppercase; color: #253b6f; text-decoration: none; font-weight: 800; }
		.mobileMenu li a:hover {background: rgba(255,255,255,0.7);}
		.mobileMenu .header {color: #fff;}

		.mobileSubMenuContain {background: rgb(253,206,36);  padding: 5px; margin-top: 0px; text-align: right;}
			.mobileSubMenuContain a {color: rgb(0,0,0); text-transform: uppercase}
			.mobileSubMenuContain .title {font-size: 1.6em; line-height: 40px; color: #fff; margin-right: 10px;}
			.mobileSubMenuContain .navbar-toggle {padding: 2px; margin-right: -20px;}


.month li, .year li {display: none;}
.month li.monthName, .month li.yearName, .yearName {display: block;}
#map_canvas {width: 100%; min-height: 150px;}

	.navbar-toggle .icon-bar {background: #fff; height: 3px;}

.scrolled.whiteContainerWrap {padding-top: 80px;}

/* NEWS */
body[data-template='News'] .introduction {font-size: 1.8em; margin: 15px 0px;}
.newsFrontPage figure {margin-bottom: 30px; position: relative; }
	.newsFrontPage figcaption {background: rgba(224,226,231,0.3); padding: 15px; border-bottom: 1px solid rgba(224,226,231,0.8)}
	.newsFrontPage figure .intro {font-size: 1.25em;}
.newsFrontPage .image {width: 100%; height: 160px;background-size: cover; background-repeat: no-repeat; background-position: center top}
	.newsFrontPage .readMore {text-transform: uppercase; font-weight: bold; font-size: 1.4em; margin-top: 15px; display: block}

	.articleFigure figcaption {font-size: 1.4em; padding: 15px 0px;}


.newsItem {margin: 30px 0px; position: relative; border: 1px solid rgba(200,200,200,1)}
	.newsItem h3 {margin-top: 15px;  text-transform: uppercase; font-size: 2rem; color: #000; line-height: 150%;}
	.newsItem {padding: 15px 0px; background: rgb(240,240,240); border-bottom: 1px solid rgba(200,200,200,1);}
		.newsItem .date {position: absolute; right: 15px; top: -5px; padding: 5px 5px; background: rgba(0, 179, 234, 1); color: rgb(255,255,255); font-size: 1.6rem; font-weight: bold; z-index: 30;}
		.newsItem img {margin-top: 30px;}
		.newsItem .intro {margin-bottom: 15px; color: #000; font-size: 1.6rem; line-height: 180%;}
	.newsItem:hover, .calendarItem:hover  {border-bottom: 1px solid #164886;}
.fileStoreContain, .whiteContainerWrap {padding: 0px;}
a:hover .newsItem {color: rgb(1,63,40) !important; box-shadow: 0px 0px 40px rgba(0,0,0,0.3)}
	a:hover .newsItem .date {background: #164886;}



/* RESULTS */
#marathonResultsSelect {margin-top: 20px; margin-bottom: 20px;}

.openContainer {padding-top: 40px;}

#resultsTable, #halfresultsTable, #entriesTable, .dataTable {font-size: 1em; }
#resultsTable td, #halfresultsTable td, #entriesTable td, .dataTable td {line-height: 130%;}

#resultsTable, #halfresultsTable, #entriesTable, .dataTable  {margin-top: 10px; margin-bottom: 10px;width: 100% !important;}
#resultsTable thead, #halfresultsTable thead, #entriesTable thead, .dataTable thead {background-color: rgb(79,148,196); }
#resultsTable th, #halfresultsTable th, #entriesTable th, .dataTable th { text-align: left; padding: 2px; color: #fff;cursor: pointer; text-transform: uppercase;}
#resultsTable th a, #halfresultsTable th a, #entriesTable th a, .dataTable th a  {color: #fff !important;}
#resultsTable td, #halfresultsTable td, #entriesTable td, .dataTable td {border-bottom: 1px solid #fff;}
#resultsTable_info {display: none; }
	#resultsTable td:nth-child(1), #resultsTable td:nth-child(7),#halfresultsTable td:nth-child(1), #halfresultsTable td:nth-child(7)  {width: 20px !important;}
	.even td, .odd td {padding: 5px;}
	.even td {background-color: rgba(253,206,36,0.2)}
	.odd td {background-color: rgba(253,206,36,0.1);}

.dataTables_paginate {display: block; text-align: center;}
.dataTables_wrapper {margin-top: 0px; overflow-y: scroll; }
  		.pagination {margin: 40px !important; display: inline-block; }
  			.pagination li {display: inline !important;}


  .nav-tabs li.active a, .nav-tabs li.active:hover a {border-radius: 0px; border-color: #0e2d5e; border-bottom: 1px solid #fff; color: #000;}
  .nav-tabs {border-bottom: 1px solid #0e2d5e; margin-bottom: 20px; font-size: 1em;}
  .nav-tabs li:hover a {border-radius: 0px; border-bottom: 1px solid #0e2d5e; background-color: rgba(14,45,94,0.1);}
  
  .nav>li>a {padding: 5px; font-size: 1rem;}
/* ROUTE */
	#routeMap, #HMrouteMap {height: 550px; width: 90%; margin: 5%;}
	#legend, #logoForMap, #logoForHMMap {border: 2px solid rgb(53,74,131); padding: 5px; background: rgb(255,255,255); width: 80px; margin-top: 10px; margin-right: 10px;}
	#legend {width: 90%; padding: 10px; margin: 5%;}
	#legend div {margin-bottom: 10px;}
	#legend img {width: 16px; height: auto; margin-right: 10px;}
		#logoForMap img, #logoForHMMap img {max-width: 100%; height: auto;}

	.routePageContainer {}
		.routeDownloadLink {width: 100%; display: block;}

.tab-content > .tab-pane {
    display: block;
    height:0;
    overflow:hidden;
}

.tab-content > .active {
    display: block;
    height:auto;
}


.trackClick {}


/* SPONSORS */
section.sponsors {margin: 50px auto;}


/* SILVERINK LINK */
#silverinkWebDesign {
	font-size: 10px;
	font-family: helvetica, arial;
	margin-left: -2px;
	margin-top: 5px;
}
#silverinkWebDesign 	a {
	color: #888;
}

#socialBar {padding-bottom: 50px;}

.socialLogos {font-size: 1.6em;}
.socialLogos .svg {width: 40px; height: 40px; margin-left: 10px; display: inline; }
	.socialLogos a {display: inline-block; height: 40px; vertical-align: middle;}
.socialLogos span { line-height: 90px; display: inline-block; }
#socialShareLinks a {margin-top: 30px; text-decoration: none;}
#socialShareLinks:hover a {color: #fff;}


.shareBtn {display: block; width: 100%; border-radius: 4px; border: 1px solid transparent; line-height: 40px; color: #fff; text-transform: uppercase; margin-bottom: 20px;}
	.shareBtn span:first-child {width: 20%; display: block; float: left; line-height: 40px; margin-right:20px; text-align: center;}
		.shareBtn img {max-height: 20px !important; width: auto;}
	.shareBtn.fb {background: #3468af}
		.shareBtn.fb span:first-child {background: #1a4e95;}
	.shareBtn.twitter {background: #4fc4f6}
		.shareBtn.twitter span:first-child {background: #35aadc;}

#SubMenuUl 	{ padding: 0px; margin: 0px; list-style-type: none; clear: both; margin-top: 25px;}
	#SubMenuUl 	li a, .month li a, .year li a {padding: 10px; margin-bottom: 10px; border-bottom: 1px solid rgb(240,240,240); display: block; font-size: 0.875em; color: rgba(107,188,227); font-weight: 400; margin-bottom: 1px;}
	#SubMenuUl 	.selected a {font-weight: bold;}

	.level3 {padding-left: 20px;}

		.month, .yearName {margin: 20px 0; padding: 0;list-style-type: none;}
	.monthName, .yearName {cursor: pointer; }

/* COUNTDOWN */
#countdown{ background: #174986; overflow: hidden; padding: 15px 0px;}
#time, #halftime {display: block; margin-bottom: 15px;  color: rgb(255,255,255); text-align: center; font-size: 2rem; font-weight: 800; font-family: "Futura PT", Futura,"Raleway",  "Century Gothic", sans-serif; width: 100%; }

#time {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7db9e8+0,32aae6+100&0+0,1+100 */
background: -moz-linear-gradient(45deg, rgba(125,185,232,0.13) 0%, rgba(50,170,230,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(125,185,232,0.13) 0%,rgba(50,170,230,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(125,185,232,0.13) 0%,rgba(50,170,230,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#32aae6',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}

#halftime {/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7db9e8+0,32aae6+100&0+0,1+100 */
background: -moz-linear-gradient(45deg, rgba(144,124,11,0.13) 0%, rgba(196,182,18,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(144,124,11,0.13) 0%,rgba(196,182,18,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(144,124,11,0.13) 0%,rgba(196,182,18,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007db9e8', endColorstr='#32aae6',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}

#time .days, #time .hours, #time .minutes, #time .seconds, #halftime .days, #halftime .hours, #halftime .minutes, #halftime .seconds { width: 60px; height: 28px; display: inline-block; margin: 2px; position: relative; }
.cd-time {display: block; font-size: 1em;}
#halftime {margin-bottom: 5px; margin-left: 0px;}
#time .date, #halftime .date { display: block; padding: 4px; margin: 2px;  margin-top: 2px; font-size: 1.4rem; }
#time {}
.countdownContainer {}
.countdownContainer .title {text-transform: uppercase; font-size: 0.75em; text-shadow: 0px 0px 8px rgba(0,0,0,0.3); padding-top: 5px;}


.videoEmbed {position: relative;}
.videoEmbed h3 {position: absolute; bottom: 0px; left: 0px;  width: 100%;z-index: 10001; padding: 10px; font-size: 1.2em; background: rgba(0,0,0,0.6); color: rgba(255,255,255,1)}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
	/* display: none; */
}

.videoWrapperVis {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}


body[data-itemid="27"] .videoWrapper {
	height:auto;
	display: block;

}


.scrolledMenu #logo {position: fixed; width: 120px; height: auto; left: 15px; z-index: 205; }
	#topBanner {min-height: 70px;}
#topMenu, .vTopNav { font-family: "Open Sans Condensed"}
#topMenu  .navbar-nav {margin-top: 0px; }
#topMenu .nav {left: 0px; top: 0px; padding: 10vh 15px; width: calc( 100% + 15px ); height: 100vh; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#020912+0,0c2e58+100 */
background: rgb(2,9,18); /* Old browsers */
background: -moz-linear-gradient(45deg, rgba(2,9,18,1) 0%, rgba(12,46,88,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(2,9,18,1) 0%,rgba(12,46,88,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(2,9,18,1) 0%,rgba(12,46,88,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020912', endColorstr='#0c2e58',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ }
#topMenu .nav a { padding: 5px; margin-bottom: 1px; color: #fff; margin-right: 0px; margin-left: 10px; text-transform: uppercase; font-weight: 400; position: relative;}
#topMenu .nav a b { display: inline-block;}
#topMenu .nav .selected a {background:  rgba(255,255,255,.2);}
.caret {
	vertical-align: middle;
	border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid #fff;
    opacity: 0.8
}
/* #topMenu .navbar-nav .open .dropdown-menu>li>a {background: #6cb2d5;} */
#topMenu .navbar-nav .open .dropdown-menu {display: block;}

.caretContain { padding-top: 10px; border-left: 1px solid #0C2E58;position: absolute; top: 0px; right: 0px; text-align: center;display: inline-block; width: 40px; height: 100%; float: right;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#13a3ea+0,134964+100&1+0,0.42+100 */
background: -moz-linear-gradient(45deg, rgba(19,163,234,1) 0%, rgba(19,73,100,0.42) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, rgba(19,163,234,1) 0%,rgba(19,73,100,0.42) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, rgba(19,163,234,1) 0%,rgba(19,73,100,0.42) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#13a3ea', endColorstr='#6b134964',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */}

.topPic { position: fixed; top: 0px; left: 0px;width: 100%; height: 60vh; z-index: -1; background-size: cover; background-position: center center;}
	.topPic .enterButton {position: absolute; bottom: 20px; color: rgb(255,255,255); left: 0px; display: block; width: 100%; font-size: 2rem; z-index: 1000; text-shadow: 1px 1px 0px rgba(189, 160, 12, 1);} /* */
	.topPic .enterButton:hover {background: #FCD303;}
	.topPic .enterHalfButton { position: absolute; bottom: 40px;left: 0px; border-radius: 0px; width: 100%;font-family: "Raleway","Futura PT", Futura,  "Century Gothic", sans-serif ;}
	
	.topPic:before {content: " "; position: absolute; top: 0px; left: 0px; height: 20%; width: 100%;/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7db9e8+0,32aae6+100&0+0,1+100 */
background: -moz-linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.4) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(0deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(0deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.4) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

	
 .videoWrapper iframe, .videoWrapperVis iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.videoOverlay {box-shadow: 0px 0px 8px rgba(0,0,0,0.3)}
 	 .winnersTable {width: 100%; font-size: 1.1em;}
 	 	.winnersTable+p {margin: 0;}
 	 .winnersTable th {text-align: left;}
 	 	.winnersTable td{padding: 10px; border-bottom: 1px solid #efefef;}

#topMenu .nav {background: rgba(53,74,131,0.8); margin-right: 0px; margin-top: 18px;}
#topMenu .nav a { padding: 10px; color: #fff; text-transform: uppercase; font-size: 0.7em; font-weight: 100;}

/* hide times from mobile */
.winnersTable td:nth-child(3), .winnersTable td:nth-child(6) {display: none;}

/* ==|== media queries ======================================================
   Media Queries for Responsive Design.
   These override the primary ('mobile/desktop first') styles
   Modify as content requires.
   ========================================================================== */




/*===============================*/
/* 480 - LANDSCAPE MOBILE LAYOUT */
/*===============================*/

@media only screen and (min-width: 480px) {
  /* Style adjustments for viewports 480px and over go here */
  #logo img {max-height:180px;}

/* COUNTDOWN */

.rightImg {float: right;margin-left: 40px; margin-bottom: 40px; width: 49%; }
	.rightImg img { width: 100%; }
.leftImg {float: left; margin-right: 10px; margin-bottom: 10px;  width: 25%;}

}





















/*=====================*/
/* 768 - TABLET LAYOUT */
/*=====================*/
@media only screen and (min-width: 768px) {
  /* Style adjustments for viewports 768px and over go here */

.productimage {float: left; max-width: 46%; margin: 2%; box-shadow: 0px 0px 8px rgba(0,0,0,0.6)}

.articleFigure {float: right; width: 45%; margin-left: 30px; margin-bottom: 30px;}

	.fixedBreadCrumb ol {margin-left: 0px;}

.chosenStoryFigure {width: 40%; margin-left: 25px; float: right;}

/* FP NEWS */

.caret {
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #000000;
}


#resultsTable, #halfresultsTable, #entriesTable, .dataTable td {font-size: 1em; line-height: 100%; }

#time .date, #halftime .date {display: block;}

	.fixedBreadCrumb ol {float: none;}

footer {margin-top: 80px;}

	.scrolledMenu #logo a.enterButton {display: block; margin-top: 5px;}


	#legend {width: 100%; margin: 0;}
	#routeMap, #HMrouteMap {width: 100%; margin: 0;}

.dataTables_filter input {max-width: none;}
.dataTables_filter {text-align: right !important;}

.dataTables_length {float: right;}
.dataTables_info {float: none; margin-left: 30px;}
.dataTables_wrapper {margin-top: 0px; overflow-y: hidden !important; }
	.dataTables_wrapper .row {margin: 0px 0px}
#time, #halftime {font-size: 2em; clear: none;  width: auto;}
#time, #halftime {margin-top: 25px;}
#time .days, #time .hours, #time .minutes, #time .seconds, #halftime .days, #halftime .hours, #halftime .minutes, #halftime .seconds { width: 60px; height: 50px;  }
.cd-time {font-size: 0.5em;}
#time .date, #halftime .date {font-size: 0.5em;}

#resultsTable th, #halfresultsTable th, #entriesTable th, .dataTable th { text-align: left; padding: 5px; color: #fff;cursor: pointer; text-transform: uppercase;}
  .nav>li>a {padding: 10px 10px; font-size: 1.4rem;}

#topBanner {top: 50px; width: 100%; background: none;}
	#topBanner #logo { }
	

.topPic {text-align: center; transition: all 0.2s ease;}
	.topPic .enterButton { position: relative; margin-top: 20%; display: inline-block; padding: 15px 30px; width: auto; font-size: 4rem; transition: 0.2s all ease}
		.topPic .enterHalfButton {position: relative; margin: 0px auto; margin-top: 12%; border-radius: 0px; width: auto;transition: 0.2s all ease; font-size: 2.2rem;}

	/*
		box-shadow: 8px 8px 0px rgba(227, 189, 0, 0.74);
	.topPic .enterButton:hover {box-shadow: 8px 8px 0px rgba(227, 189, 0, 0.4);}
*/

#topMenu .nav {background: none; margin-right: 0px; margin-top: 0px; padding: 0px;}
#topMenu .nav a { text-shadow: 1px 1px 4px rgba(0,0,0,0.9); padding: 5px; color: #fff; text-transform: uppercase; font-weight: 800; letter-spacing: 0.02em; background: none;}
#topMenu .nav a:hover, #topMenu .nav .selected a {background:  rgba(0,0,0,.4);}

.caret {
	vertical-align: middle;
	border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #fff;
    opacity: 1
}
#topMenu .dropdown-menu a {background: #ffffff; text-shadow: none !important; color: #000; display: block; padding: 0;}
#topMenu .dropdown-menu a:hover {background: none;}
.caretContain { padding: 0px; border: none; position: relative; text-align: right;display: inline-block; width: auto; height: 100%; float: right;background: none; margin-left: 5px;}


.dropdown-menu>li>a {
    margin-bottom: 5px;
    font-size: 1.4rem;
    color: #000;
    
}

.dropdown ul.dropdown-menu {
    border-radius:0px;
    box-shadow:0px 0px 20px rgba(0,0,6,0.2);
    margin-top:0px;
    width:300px;
}
.dropdown ul.dropdown-menu:before {
    content: "";
    border-bottom: 10px solid #fff;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    position: absolute;
    top: -10px;
    right: 16px;
    z-index: 10;
}
.dropdown ul.dropdown-menu:after {
    content: "";
    border-bottom: 12px solid #ccc;
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
    position: absolute;
    top: -12px;
    right: 14px;
    z-index: 9;
}


.vTopNav {position: fixed; top: 0px; left: 0px;background: #08274D; width: 100%; z-index: 200; }
.vTopNav .navbar, .vTopNav .navbar-nav {margin-bottom: 0px;}
.vTopNav a {text-transform: uppercase; color: #fff; font-size: 1.4rem; font-weight: 800;}
.vTopNav .navbar-nav>li>a:hover {background: rgba(0,0,0,0.2);}
.vTopNav .dropdown-menu a {font-weight: 800}
.scrolledMenu #logo {position: fixed; width: 120px; height: auto; z-index: 205; }
.scrolledMenu #topBanner {background: #fff; border-bottom: 1px solid rgba(23,73,134,1)}
.scrolledMenu #topMenu {background: #fff; }
	#topMenuNav {text-align: right;}
	.scrolledMenu #topMenuNav .dropdown-toggle { text-shadow: none; color: #000; }
	.scrolledMenu #topMenuNav > li {display: inline-block;}
	.scrolledMenu #topMenu .nav > li > a:hover{background:  none;}
	.scrolledMenu #topMenu .caret {
		border-left: 4px solid transparent;
	    border-right: 4px solid transparent;
	    border-top: 4px solid #000;
	    opacity: 1
	}
	.scrolledMenu #logo {left: auto;}
	
	#topMenuNav {font-size: 2.2rem;}

}












/*=======================*/
/* 1024 - DESKTOP LAYOUT */
/*=======================*/
@media only screen and (min-width: 992px) {
  /* Style adjustments for viewports 1024px and over go here */

  /* FRONT PAGE IMAGES */
	#fpImageDiv	.carousel-caption .heading {font-size: 2.8em; margin-bottom: 30px; margin-top: 50px;}
	#fpImageDiv	.Desc {font-size: 2.4em; }
	#fpImageDiv	.Desc p  {margin: 0;}
	#fpImageDiv .summary {font-size: 1.75em;}
#resultsTable, #halfresultsTable, #entriesTable, .dataTable {font-size: 1.25em; }

	h2 {font-size: 2.4em;}
	.homeItem {box-shadow: 0px 0px 5px rgba(0,0,0,0.3); position: relative; height: 200px; margin-bottom: 30px; }
	
	#homeEditable {padding-top: 25px !important; padding-bottom: 15px !important;}
	#logo {max-width: 150px;}
	#socialShareLinks {font-size: 1.8em; font-weight: bold;}
		#socialShareLinks address {margin-top: 30px ; color: rgb(255,255,255); font-weight: 100; font-size: 0.75em;}
	.shareBtn i {font-style: normal;}
	.scrollmagic-pin-spacer {z-index: 20;}
	#topMenu .nav a {font-size: 1.5rem;}
	
	#topMenu .dropdown-menu>li>a {
    margin-bottom: 1px;
    margin-left: 0px;
    font-size: 1.4rem;
    color: #000;
    padding: 4px 10px;
    
	} 
	#topMenu .dropdown-menu>li>a:hover {background: #d6e1ea}
	
	.videoWrapper {margin-top: 20px;}
	.videoWrapper + h3 {text-transform: uppercase; text-align: right; font-weight: bold;}
	
	
	#easilogo {margin-top: 40px;}
	
	.fixedBreadCrumb {position: fixed; top: 114px; width: 100%; z-index: 50;}
}








/* WIDE DESKTOP LAYOUT */
@media only screen and (min-width: 1200px) {
  /* Style adjustments for viewports 1176px and over go here */
	#topMenu .nav a {font-size: 1.8rem;}
.productimage {float: left; max-width: 29%; margin: 2%; min-height: 490px;}

}






































/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.

RESPONSIVE TABLE
*/
@media
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	.respTable table, .respTable thead, .respTable tbody, .respTable th, .respTable td, .respTable tr {
		display: block;
		height: auto !important;
		width: 100%;
		padding: 10px;
		text-align: center;
		margin-bottom: 10px;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	.respTable thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	.respTable tr { border: 1px solid #ccc; box-shadow:  0px 0px 6px rgba(80,80,80,0.2)}

	.respTable td {
		/* Behave  like a "row" */
		border: none !important;
		position: relative;
		width: 100% !important;

	}

	.respTable td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
	}

	#topMenu .nav a {font-size: 2rem;}



}







/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}