@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css");

.mobile-nav {
	display: none;
}

/* ALL MOBILE SCREENS (portrait and landscape) */
@media screen and (max-width: 767px) {
	html body {
		font-size: 75%;
	}
	#superhead {
		min-width: auto;
	}
	#superhead .inner {
		width: 100%;
	}
	#superhead #brand-switch {
		float: right;
		width: auto;
	}
	#superhead #social {
		display: none;
	}
	#superhead #brand-switch ul li {
		margin-right: 10px;
	}
	#superhead #brand-switch ul li img {
		height: 10px;
		width: auto;
	}

	/* CHANGE THE MENU */
	.mobile-nav {
		display: block;
		line-height: 36px;
		font-size: 20px;
		width: 100%;
		background-color: #eb252b;
		color: #fff;
		height: 36px;
		vertical-align: middle;
		text-transform: uppercase;
		text-align: center;
		font-family: veneer, arial, helvetica;
		cursor: pointer;
	}
	.mobile-nav.fixed {
		top: 0;
		position: fixed;
		z-index: 10000;
	}
	.mobile-nav i {
		font-size: 21px;
	}
	.mobile-nav i.fa-times {
		font-size: 22px;
	}
	#nav {
		position: absolute !important;
		width: 100%;
		display: none;
		left: 0 !important;
		margin: 0;
		overflow: hidden;
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		z-index: 10000;
		height: auto;
	}
	.mobile-nav.fixed + #nav {
		position: fixed !important;
		top: 35px;
		z-index: 10000;
	}
	#nav ul {
		float: none;
		position: relative;
		margin: 0 !important;
		padding: 0 !important;
		width: 100%;
	}
	#nav ul li {
		float: none;
		width: 100%;
		min-width: 100%;
		max-width: 100%;
		clear: both;
	}
	#nav ul li ul {
		display: none;
	}
	#nav ul li a {
		float: none;
		display: block;
		padding: 0;
	}
	/* Submenu */
	#nav ul li div {
		display: none;
		float: left;
		position: relative;
		width: 100%;
		transition: all .2s ease 0s;
	}
	#nav ul li.hasSub .sub { /* when visible */
		display: block !important;
		visibility: visible;
		opacity: 1 !important;
		position: relative !important;
		width: 100% !important;
		padding: 10px 0 0 0;
	}
	#nav ul li.hasSub .sub h4 {
		text-align: center;
	}
	#nav ul li.hasSub .sub ul {
		width: auto !important;
		line-height: initial;
		padding-bottom: 10px !important;
	}
	#nav ul li.hasSub .sub ul li {
		display: inline-block;
		width: auto;
		min-width: initial;
		border-right: 0;
		padding: 0;
		margin: 2px 5px 3px 5px;
	}

	#the-meat {
		width: 100%;
	}
	.advert {
		width: 100%;
		height: auto;
	}
	.advert img {
		width: 100%;
		height: auto;
	}

	.content-box {
		width: 100%;
		min-height: initial;
		box-sizing: border-box;
	}
	.content-box .left,
	.content-box .right {
		float: none;
		width: 100%;
		min-width: initial;
		overflow: auto;
		padding-bottom: 20px;
	}
	#slider {
		margin-left: auto;
		margin-right: auto;
		width: 335px;
		height: 215px;
	}
	#slideUtil {
		display: none;
	}
	.slide {
		width: 335px;
		background-size: cover;
	}
	.slide-info {
		width: auto;
		height: auto;
	}
	.slide-info h1 {
		margin-bottom: 10%;
	}
	.slide-info h2 {
		font-size: 14px !important;
	}
	.slide-info p {
		font-size: 12px !important;
	}

	#next-round {
		width: 100%;
		background-size: 100% ;
	}

	#news-feed {
		width: 100%;
	}
	#news-feed #the-feed iframe {
		width: 100%;
	}

	#footer {
		min-width: initial;
	}
	#footer .inner {
		width: 100%;
	}
	#footer-links ul {
		width: 30%;
		margin-right: 2%;
		margin-bottom: 20px;
	}

	/** NEWS FEED PAGE **/
	.article .image {
		width: 30%;
	}
	.article .image img {
		width: 100%;
		height: auto;
	}
	.article .articleInfo {
		width: 65%;
		overflow: initial;
	}
	.article .title {
		font-size: 18px;
		line-height: 20px;
	}
	.article .blurb {
		font-size: 13px;
		line-height: 15px;
		padding-top: 5px;
	}

	/** FD101 Page **/
	#socialNav {
		padding-bottom: 20px;
	}
	#fd101:before {
		content: "Zoom in to View";
		font-size: 20px;
		display: block;
		position: relative;
		padding: 0 0 20px 0;
		text-align: center;
		font-family: veneer, arial, helvetica;
	}
	#fd101 .page img {
		width: 100%;
		height: auto;
	}

	/** TICKETS PAGE **/
	.event-image {
		width: 100%;
		height: 200px;
	}
	.event-info {
		width: 100%;
	}
	.event-info h1 {
		font-size: 22px;
	}
	.content-box {
		width: 100%;
	}
	#event-information h1 {
		font-size: 28px;
	}
	#event-information h2 {
		font-size: 22px;
	}
	#event-header {
		width: 100%;
		height: auto;
		box-sizing: border-box;
	}
	.event-info .tickets {
		float: none !important;
		text-align: center;
		padding-bottom: 3px;
	}
	.event-info .tickets + div {
		float: none !important;
		text-align: center;
		display: block !important;
	}
	.event-info .tickets + div > a {
		float: none !important;
	}
	#event-details #left,
	#event-details #right {
		width: 100%;
		float: none;
		padding: 0;
	}
	#event-details p {
		width: 100%;
	}
	#event-details img {
		width: 100%;
		height: auto;
	}

	/** DRIVERS PAGE **/
	.leagueList {
		width: 50%;
		padding-bottom: 20px;
	}
	.leagueList:nth-child(3) {
		clear: left;
	}
	#individualDriver #left,
	#individualDriver #right {
		width: 100%;
		float: none;
		padding: 0;
	}
	#individualDriver img {
		max-width: 100%;
		height: auto;
	}
	#individualDriver #right {
		margin-top: 20px;
	}

	/** STANDINGS PAGE **/
	.newTableView thead tr th,
	.newTableView tbody tr td a {
	}
	.newTableView thead tr th,
	.newTableView tbody tr td {
		padding: 0 5px !important;
		font-size: 11px;
	}


	/* FOR responsive-tables.js */
	table.responsive { margin-bottom: 0; }

	.pinned {
		position: absolute; left: 0; top: 0; background: #fff; width: 21%; overflow: hidden; overflow-x: scroll; border-right: 1px solid #fff;
	}
	.pinned table { border-right: none; border-left: none; width: 100%; }
	.pinned table th, .pinned table td { white-space: nowrap; }
	.pinned td:last-child { border-bottom: 0; }

	div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #fff; clear: both;}
	div.table-wrapper div.scrollable table { margin-left: 21%; }
	div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }

	table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
	table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }
	.newTableView {
		margin-top: 0;
	}

	/** MEDIA PAGE **/
	.content-box #videos iframe {
		width: 350px;
		height: 350px;
	}
	#gallery-grid .gallery {
		width: 100%;
		height: 180px;
	}
	.galleryItem, .gallery-item {
		width: 100%;
		height: 190px;
		float: none;
	}

	#resultsTableTree,
	.fdResults .bracket.b16 {
		display: none !important;
	}
	#resultsGrid {
		display: block !important;
	}

	.fdResults .driverThumbs {
		width: 100%;
	}
	.fdResults .driverThumbs #allDrivers {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-flow: column wrap;
		flex-direction: row;
	}
	.fdResults .driverThumbs #allDrivers .driver {
		width: 150px;
	}
	.fdResults .driverThumbs ul li a.driverImage {
		float: none;
		display: block;
		margin: 0 auto;
	}
}

@media (max-width: 579px) {
	.fdResults .driverThumbs #allDrivers .driver:first-child {
		margin-left: 20%;
		margin-right: 20%;
	}
}
@media (max-width: 479px) {
	.fdResults .driverThumbs #allDrivers .driver:first-child {
		margin-left: 10%;
		margin-right: 10%;
	}
}


/* iPhone 6 and smaller portrait mode */
@media screen and (max-device-width: 667px) {
}
/* iPhone 2G-4S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) {
}
/* iPhone 2G-4S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) {
}
/* iPhone 5 & 5S in landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
}
/* iPhone 5 & 5S in portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {
}
/* iPhone 6 & 6S in landscape */
@media only screen  and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) {
}
/* iPhone 6 & 6S in landscape */
@media only screen  and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) {
}
/* iPhone 6 Plus & 6S Plus in landscape */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) {
}
/* iPhone 6 Plus & 6S Plus in portrait */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) {
}

/** Tablet Portrait Mode **/
@media only screen and (orientation: portrait) and (min-device-width: 768px) and (max-device-width: 1024px) {
	html body {
		font-size: 80%;
	}
	.grid-container.wrapper {
		max-width: 100%;
	}
}

/** Tablet Landscape Mode **/
@media only screen and (orientation: landscape) and (min-device-width: 768px) and (max-device-width: 1024px) {
}
