﻿@media only screen and (max-width: 1240px) {
	#nav {
		font-size:19px;
	}
}


@media only screen and (max-width: 1100px) {
	
	html {
		background:#2b2b2b;
	}
	body {
		font-size:13px;
	}
	#content {
		padding:40px 55px;
	}
	#footer {
		padding:30px 55px;
	}
	#logo {
		left:55px;
	}
	#nav {
		font-size:18px;
		right:55px;
	}
	#carousel, .banner {
		margin:-40px -55px 40px -55px;
	}
	#carousel, #carousel li {
		height:350px;
	}
	#carousel li {
		padding:60px 90px 0 90px;
	}
	#carousel h2 {
		padding:16px;
		font-size:40px;
	}
	#carousel h3 {
		padding:12px 16px;
		font-size:20px;
	}
	#carousel .image {
		width:400px;
		height:310px;
	}
	.banner {
		height:250px;
		padding:65px 55px 0 55px;
	}
	.banner h1 {
		font-size:45px;
		padding:15px;
		margin-bottom:8px;
	}
	.banner h1.single {
		margin-top:22px;
	}
	.banner h2 {
		font-size:25px;
		padding:10px 15px;
	}
	.draw th, .draw td {
		padding:6px 8px;
	}
}

@media only screen and (max-width: 990px) {
	body {
		font-size:12px;
	}
	#content, #footer {
		padding:30px;
	}
	#logo {
		left:30px;
	}
	#nav {
		right:30px;
	}
	#carousel, .banner {
		margin:-30px -30px 30px -30px;
	}
	.banner {
		padding:65px 30px 0 30px;
	}
	.draw th, .draw td {
		padding:6px;
	}
}

@media only screen and (max-width: 940px) {
	#nav {
		font-size:17px;
	}
	#drivers h2 {
		font-size:26px;
	}
	#drivers li {
		padding-right:20px;
	}
}

@media only screen and (max-width: 890px) {
	#nav {
		font-size:16px;
	}
	table.draw {
		border-collapse:separate;
	}
	table.draw td {
		border-bottom:0;
	}
	table.draw .venue-row td {
		border-bottom:1px solid #cbcbcb;
		padding-top:0;
	}
	#years li {
		display:none;
	}
	#years li:nth-child(1),
	#years li:nth-child(2),
	#years li:nth-child(3),
	#years li:nth-child(4),
	#years li:nth-child(5),
	#years li:nth-child(6) {
		display:block;
	}
	.hide-mobile {
		display:none;
	}
	.show-mobile {
		display:block;
	}
	tr.show-mobile {
		display:table-row;
	}
	.draw td.team {
		font-size:0.8rem;
		line-height:1.3;
	}
	.draw td.date {
		width:auto;
	}
}

@media only screen and (max-width: 860px) {
	#header {
		height:116px;
	}
	#logo {
		width:160px;
		height:62px;
		background-size:160px 62px;
		top:30px;
	}
	#nav {
		top:40px;
	}
	#carousel .image {
		display:none;
	}
	img.shield, .draw + p {
		display:none;
	}
}

@media only screen and (max-width: 820px) {
	#nav {
		font-size:15px;
	}
	#drivers a {
		width:120px;
	}
}