@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');

body {
	font-family: 'Roboto Condensed', 'sans-serif' !important;
	color: #111;
	margin:0;
	font-size: 1em;
	font-weight: 400;
	overflow-x: hidden;
	position: relative;}

.cata {
	display: flex;
	align-items: center;
	flex-flow: column;
	justify-content: center;
}

.half {
	display: none;
}

.scrollup{
    width:40px;
    height:40px;
    opacity:1;
    position:fixed;
    bottom:20px;
    right:0;
    display:none;
    text-indent:-9999px;
    background: url(graphics/icon_top.png) no-repeat;
}

a {text-decoration: none;}
a:hover {text-decoration: none;}

.navy {color:#1d2b3d;}
.blue {color:#4a8ae0;}
.red {color:#c90d15;}
.gray {color:#aaa;}
.white {color:#fff;}
.black {color:#111;}

.smaller {font-size: 85%!important;}
.larger {font-size: 125%!important;}
.lh-list {line-height: 2.25em;}

.divider-gray {border-top:1px solid #ccc;}
.border-pic {border:1px solid #4a8ae0;}

.heading-red {font-size: 1.35em; font-weight: 700; color:#c90d15; text-transform: uppercase;}
.heading-blue {font-size: 1.15em; font-weight: 700; color:#4a8ae0; text-transform: uppercase;}

.sidebar {background:#ddd;}

.indent {padding-left:40px;}

h1 {
	font-family: 'Roboto Condensed', serif;
	font-size: 2.5em;
	font-weight: 700;
	text-transform: uppercase;
	color:#4a8ae0;
	letter-spacing: -.5px;
}

h2 {
	font-size:24pt;
	text-transform:uppercase;
	font-weight:bold;
	color:#458cd4;
	margin-top:0;
	margin-bottom:10px;
}

h3 {
	font-size:20pt;
	text-transform:uppercase;
	font-weight:bold;
	color:#cc0b0b;
	margin-top:0;
	margin-bottom:-10px;
}

h4 {
	font-size:18pt;
	text-transform:uppercase;
	font-weight:bold;
	color:#1c2b3e;
	margin-top:0;
}

h5 {
	font-size:16pt;
	text-transform:uppercase;
	font-weight:bold;
	color:#458cd4;
	margin-top:-10px;
	margin-bottom:10px;
}

.header {
  padding:5px;
  background: #1d2b3d;
  z-index:999999;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  background:#1d2b3d;
  z-index: 10;
}

.sticky + .content {
  padding-top: 102px;
}

.bg-top {background:#fff; color:#111; font-size:.8em; font-weight:400; letter-spacing: -.25px!important; position: relative; z-index: 10;}
.bg-top a {color: #111; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.bg-top a:hover {color: #bbb; text-decoration: none;}
.bg-top ul {padding:0; margin:0; text-align:right;}
.bg-top ul li {list-style-type:none; display:inline;}
.bg-top ul li:before {content:'';}
.bg-top ul li:after {content:'|'; color:#ccc; margin:0 10px; font-weight: 900;}
.bg-top ul li:last-child:after {content:'';}

.navbar-light .navbar-nav .nav-link {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: .9em;
	font-weight: 700;
	color:#4a8ae0;
	text-transform: uppercase;
	padding:10px .75rem!important;
	letter-spacing: -.5px!important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.navbar-light .navbar-nav .nav-link:hover {color:#fff!important;}

.nav-item a {color: #4a8ae0!important;}
.nav-item a:hover {color:#fff!important;}

.navbar-toggler {border-color:#000!important; background-color:transparent!important; border:0!important; color:(0,0,0,1.0)!important;}
.navbar-light .navbar-toggler {outline: none;}

.navbar-brand {height:100%; position: relative; z-index: 9999999999; margin-top:-90px!important;}
.navbar-brand img {height:140px;}
.navbar-brand.js-scrolling img {
/*	height: 90px;*/
	margin-top:50px!important;
	-webkit-transition: height 0.3s ease;
	-moz-transition: height 0.3s ease;
	-ms-transition: height 0.3s ease;
	-o-transition: height 0.3s ease;
	transition: height 0.3s ease;
	overflow: hidden;
	clear: both;
}

.dropdown-menu {
	background-color: #1d2b3d!important;
	border-radius: 0!important;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: .85em!important;
	font-weight: 700!important;
	line-height: 1.5em;
	top:100%!important;
	left:15%;
	border:0!important;
	text-align: left!important;
	color: #4a8ae0!important;
	letter-spacing: 0;
}
.dropdown a {color: #4a8ae0!important;}
.dropdown a:hover {color:#fff!important;}

.dropdown-menu a {color: #fff!important; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.dropdown-menu a:hover {color: #4a8ae0!important; text-decoration: none;}
.dropdown-item {color:#fff!important; font-weight: 400!important; padding:.25rem 1rem!important; text-align: left!important;}
.dropdown-item:hover {background:#1d2b3d!important;}

.content {min-height:500px;}
.content a {color:#4a8ae0; text-decoration:none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.content a:hover {color:#1d2b3d; text-decoration:none;}

.btn-content {
	background-color:#1d2b3d;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 95%;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	color:#aaa;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
}
.btn-content:hover {
	background:#4a8ae0;
	color:#fff!important;
	cursor: pointer;
}

.btn-content2{
	background-color:#1d2b3d;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 95%;
	font-weight: 400;
	text-transform: uppercase;
	text-align: center;
	color:#aaa;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
}
.btn-content2:hover {
	background:#4a8ae0;
	color:#fff!important;
	cursor: pointer;
}

.bg-banners {background-image:url(graphics/bg-banners.jpg);}

.bg-hero {background-image:url(graphics/bg-hero.jpg);}

.bg-callouts {background:#ddd;}
.callout-icon {background:#1d2b3d; border-radius: 50%; font-size: 5.25em; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.callout-icon:hover {background:#4a8ae0; color:#1d2b3d;}
.callout-title {font-size: 1.75em; font-weight: 700; line-height: 1em;}
.callout-title-sm {font-size: 1em; font-weight: 700;}

.footer {background:#1d2b3d; border-top:10px solid #c90d15; font-size: .8em; -webkit-box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.5); box-shadow: 0px 0px 20px 5px rgba(0,0,0,0.5); letter-spacing: 0;}
.footer-heading {color:#fff; font-size: 105%; font-weight: 700;}
.footer a {color: #4a8ae0!important; text-decoration: none; font-weight: 400; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.footer a:hover {color: #fff!important; text-decoration: none; font-weight: 400; padding-left:4px;}

.anchor {background-image: url(graphics/bg-banners.jpg); color:#fff; font-size: .8em; font-weight: 400; line-height: 1.85em; border-bottom: 4px solid #1d2b3d;}

.anchor-L a {color: #fff!important; text-decoration: none; font-weight: 400; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.anchor-L a:hover {color: #1d2b3d!important; text-decoration: none; font-weight: 400;}

.anchor-R a {color: #fff!important; text-decoration: underline; font-weight: 400; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
.anchor-R a:hover {color: #1d2b3d!important; text-decoration: underline; font-weight: 400;}

.index-heading {font-size: 1.35em; font-weight: 700; color:#c90d15; text-transform: uppercase;}

.btn-index {
	background-color:#4a8ae0;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 95%;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	color:#fff!important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
}
.btn-index:hover {
	background:#1d2b3d;
	color:#aaa!important;
	cursor: pointer;
}

.info-box {border:2px solid #ccc; font-weight: 700; font-size: 90%; margin-top:0px!important; letter-spacing: -.5px;}

/*TABS*/

.tab-pane {
  padding:2rem 0;
}

.nav-tabs {font-size: 120%; font-weight: 800; text-transform: uppercase; border-bottom:0;}
.nav-item-tab {padding:1.5%; background:#fff; border:1px solid #bbb; margin-right:1%;}

.nav-link-tab {
background: #fff;
}
.nav-link-tab.active {
  font-weight: bold;
  background:#fff;
}

.tab-heading {font-size: 1.15em; font-weight: 700; color:#4a8ae0; text-transform: uppercase;}

.history-pic {display: block;}
.history-pic-mobile {display: none;}


.find-name {float:left; font-size: 14pt; padding-right: 1%;}
.find-field {float:left; padding-right: 1%;}
.find-btn {float:left; padding-right: 1%;}

/*2020 JR NATIONAL*/
.btn-navy {
	background-color:#1c2b3e;
	font-size: 110%!important;
	text-transform: uppercase;
	text-align: center;
	color:#fff!important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
	border:2px solid #1c2b3e;
}
.btn-navy:hover {
	background:#fff;
	color:#1c2b3e!important;
	cursor: pointer;
	border:2px solid #458cd4;
}

.btn-red {
	background-color:#cc0b0b;
	font-size: 110%!important;
	text-transform: uppercase;
	text-align: center;
	color:#fff!important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
	border:2px solid #cc0b0b;
}
.btn-red:hover {
	background:#fff;
	color:#cc0b0b!important;
	cursor: pointer;
	border:2px solid #458cd4;
}

.btn-register {
	background-color:#cc0b0b;
	font-size: 150%!important;
	font-weight: 700;
	text-transform: uppercase;
	text-align: center;
	color:#fff!important;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	border-radius: 5px;
}
.btn-register:hover {
	background:#1c2b3e;
	color:#ccc!important;
	cursor: pointer;
}

.parking-icon {font-size:200px;}

.divider-gray {border-top:1px solid #ccc;}
.divider-blue {border-top:1px solid #458cd4;}

label {display: block;}
input {width:97%; padding:1.5%; margin:5px 0;}
select {width:97%; padding:1.5%; margin:5px 0;}
textarea {width:100%!important; margin-bottom: 15px;}

.btn-link {font-family: 'Roboto Condensed', sans-serif; font-size: 90%!important; font-weight: 900; color:#1c2b3e; text-transform: uppercase; letter-spacing: -.5px;}
.btn-link:hover {text-decoration: none!important; color:#458cd4!important;}

.info-box {border:2px solid #CC0B0C; background:#eee; text-align: center; font-size: 120%; font-weight: 900;}

.archive {line-height:1em;}

table {
	width:100%;
	border-collapse: collapse;
	margin:20px auto;
	}

/* Zebra striping */
tr:nth-of-type(odd) {
	background: #eee;
	}

th {
	background: #458cd4;
	color: white;
	font-weight: bold;
	}

td, th {
	padding: 10px;
	border: 1px solid #ccc;
	text-align: left;
	font-size: 1em;
	}

/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/

.video-header {
	font-size: 21pt;
	text-transform: uppercase;
	font-weight: bold;
	color:#458cd4;
	margin-top:0;
}

.video-header-hidden {display: block;}
.video-header-mobile {display: none;}

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.notice {border:4px solid #c90d15; font-size: 105%; overflow: hidden; line-height: 2em;}

@media (max-width: 1200px) {
.bg-top {font-size:.75em;}
.bg-top ul li:after {margin:0 5px;}
.callout-icon {font-size: 4.25em;}
.callout-title {font-size: 1.5em;}
}

@media (max-width: 992px) {
.bg-top {font-size:.8em;}
.bg-top ul li {display:block;}
.bg-top ul li:after {content:''; margin:0;}
.navbar-brand {margin-top: -205px;}
.navbar-brand img {height:140px;}
.navbar-brand.js-scrolling img {margin-top:165px!important;}
.callout-icon {font-size: 7em;}
.nav-tabs {font-size: 110%;}
.video-header {font-size: 16pt;}
}

@media (max-width: 768px) {
.callout-icon {font-size: 8.5em;}
.nav-tabs {font-size: 125%;}
.nav-item-tab {padding:2%; margin:0 2% 10px 0;}
.history-pic {display: none;}
.history-pic-mobile {display: block;}
.video-header {font-size: 14pt;}
.half {
	display: block;
}
.half2 {
	display: none;
}
}

@media
only screen and (max-width: 768px) {

	table {
	  	width: 100%;
	}

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr {
		display: block;
	}

	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	tr { border: 1px solid #ccc; }

	td {
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee;
		position: relative;
		padding-left: 50%;
		font-size: 90%;;
	}

	td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 12px;
		left: 6px;
		width: 45%;
		padding-right: 10px;
		white-space: nowrap;
		/* Label the data */
		content: attr(data-column);
		font-size: 90%;
		color: #000;
		font-weight: bold;
	}

}

@media (max-width: 576px) {
h2 {font-size: 18pt;}
.callout-icon {font-size: 8em;}
.half {
	display: block;
}
.half2 {
	display: none;
}
}

@media (max-width: 480px) {
h2 {font-size: 16pt;}
.navbar-brand {margin-top: -245px;}
.navbar-brand img {height:100px;}
.navbar-brand.js-scrolling img {height: 90px;}
.navbar-brand.js-scrolling img {margin-top:210px!important;}
.callout-icon {font-size: 5em;}
.card-header {padding:.5rem;}
.video-header-hidden {display: none;}
.video-header-mobile {display: block;}
.half {
	display: block;
}
.half2 {
	display: none;
}
}

@media (max-width: 375px) {
h2 {font-size: 13pt;}
.navbar-brand {margin-top: -70px;}
.navbar-brand.js-scrolling img {margin-top:35px!important;}
.bg-top ul li {display: none;}
.callout-icon {font-size: 4.5em;}
.callout-title {font-size: 1.25em;}
.anchor {font-size: .7em;}
.video-header {font-size: 13pt; letter-spacing: -1px;}
.half {
	display: block;
}
.half2 {
	display: none;
}
}

@media (max-width: 320px) {
.callout-icon {font-size: 3.5em;}
.half {
	display: block;
}
.half2 {
	display: none;
}
}
