/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
  
  //CSS
  
}

/* 
  ##Device = Laptops, Desktops
  ##Screen = B/w 1025px to 1280px
*/

@media (min-width: 1025px) and (max-width: 1280px) {
  
  //CSS
  
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
  
  .intro h2 a {
		font-family: 'Overpass', sans-serif;
    color: #fff;
    font-size: 1.5rem;
    position: relative;
    top: 0;
    border-bottom: 0;
	text-decoration: underline;  
}

  
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  
  h1 {
    font-size: 5.5rem;
	line-height: 5rem;
	width: 90%;
	margin: 0 auto;
}



h1#bighead {
	width: 500px;
	height: 500px;
	background-size: 500px;
	margin: 0 0 0 -250px;
}

.nav__list-item a {
	font-family: 'Archivo Black', sans-serif;	
	font-size: 40px;
	padding: 10px 0 0 60px;
}
  
  .intro h2 a {
		font-family: 'Overpass', sans-serif;
    color: #fff;
    font-size: 1.5rem;
    position: relative;
    top: 0;
    border-bottom: 0;
	text-decoration: underline;  
}

.rides_landing h1 {
	top: 200px;
}

.rides_landing .image_bottom_fade {
	top: 300px;
	height: 200px;
}

.rides_landing {
height: 500px;
}

.rr-header p {
	padding-top: 25px;
    width: 80%;
    text-align: center;
    margin: 0px auto 40px auto;;
	padding-bottom: 0px;
	font-size: .8rem;
	line-height: 1.2rem;
    margin-bottom: 50px;	
}

.rr-header {
	padding: 125px 0 0 0;
	width: 100%;
}

.rr-cont .intro {
padding: 0;
}


}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
  
h1 {
    font-size: 4rem;
	line-height: 3.7rem;
	width: 90%;
	margin: 0 auto;
}


h1#bighead {
	width: 400px;
	height: 400px;
	background-size: 400px;
	margin: 0 0 0 -200px;
}

.nav__list-item a {
	font-family: 'Archivo Black', sans-serif;	
	font-size: 35px;
	padding: 10px 0 0 60px;
}

.col_long_copy {
width: 90%;	
}

.table {
width: 90%;
}

.about-cont {
    padding-top: 50px;
}


.about-cont .intro {
    margin: 0 auto 50px auto;
}

p.hamer img {
	width: 100%;
}

p.hamer {
	padding: 0px;
}


.intro h2 a {
	font-family: 'Overpass', sans-serif;
    color: #fff;
    font-size: 2.25rem;
    position: relative;
    top: 0;
    border-bottom: 0;
	text-decoration: underline;  
}
table {
margin: 0 auto;
}

.map {
	width: 90%;
	margin: 30px auto 30px auto;
}

.rides_landing h1 {
	top: 150px;
}

.rides_landing .image_bottom_fade {
	top: 200px;
	height: 150px;
}

.rides_landing {
height: 350px;
}

.rides-cont h2 {
	    font-size: 2.25rem;

}

.rides-cont .row p.ride_details {
    padding: 10px 0;
	    margin: 15px auto 10px auto;

}

.rr-cont .col {
	flex-basis: auto;
}


.rr-header p {
	padding-top: 15px;
    width: 80%;
    text-align: center;
    margin: 10px auto;
	font-size: .8rem;
	line-height: 1.2rem;
	padding-bottom: 25px;
}

.rr-header {
	padding: 125px 0 0 0;
}
.rr-cont .intro {
padding: 0;
}


}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
  
.menu-icon {
  left: 10px;
  top: 10px;
}

.nav__list-item a {
	font-family: 'Archivo Black', sans-serif;	
	font-size: 30px;
	padding: 10px 0 10px 20px;
}

.nav__content {
  top: 50%;
}

#social {
	top: 15px;
	right: 10px;
	width: 200px;
	height: 50px;
	font-size: 30px;
}

#social li {
	margin: 0px;
	padding: 0px;
}

#social a {
	display: block;
	padding: 0 10px;
}

#nav_logo {
    padding: 10px;
    width: 100px;
    top: 15px;
	left: 70px;
	z-index: 9999;
}

h1#bighead {
	width: 300px;
	height: 300px;
	background-size: 300px;
	margin: 0 0 0 -150px;
}

 #header {
	height: 600px;
}

.image_bottom_fade {
	top: 400px;
	height: 200px;
}


.container .intro h2 {
	font-size: 1.5rem;
	line-height: 2rem;
}

.intro p {
	width: 100%;
}

 .intro {
	margin: 0 auto 100px auto;
	padding: 10px;
	text-align: center;
}

 .about .container, .rides .container, .racereports .container {
	width: 100%;
 }
 
.rides, .about {
	padding: 100px 0 0 0;
	height: 500px;
}
.racereports {
	padding: 100px 0 0 0;
	height: 600px;
}

.footer ul li {
	margin: 20px 30px 0 0;
	padding: 0px;
	float: none;
}

.footer {
	padding: 50px 20px;
	background-color: #000000;
}

h1 {
    font-size: 4rem;
	line-height: 3.7rem;
	width: 90%;
	margin: 0 auto;
}

.col_long_copy {
width: 90%;	
}

.table {
width: 100%;
}

.about-cont {
    padding-top: 20px;
}

.about-cont-two .row p {
padding: 10px 0 10px 0;
}

.about-cont-two {
padding: 50px 0 50px 0;
}

.about-cont .intro {
    margin: 0 auto 50px auto;
}

p.hamer img {
width: 100%;
}

.hamer {
padding: 50px 0px;
}

.about_landing {
	    padding: 150px 0 0 0;
	height: 400px;
}

.about_landing .image_bottom_fade {
	top: 250px;
	height: 150px;
}

.intro h2 a {
		font-family: 'Overpass', sans-serif;
    color: #fff;
    font-size: 1.5rem;
    position: relative;
    top: 0;
    border-bottom: 0;
	text-decoration: underline;  
}

.keystats {
padding: 50px 0;
}



.map {
	width: 90%;
	margin: 30px auto 30px auto;
}

.rides_landing h1 {
	top: 100px;
}

.rides_landing .image_bottom_fade {
display: none;
}

.rides_landing {
height: 200px;
}

.rides-cont h2 {
	font-size: 1.5rem;
	line-height: 2rem;
}

.rides-cont .row p.ride_details {
    padding: 10px 0;
	    margin: 15px auto 10px auto;

}


.rr-cont .col {
	flex-basis: auto;
}


#racereport {
height: 400px;
}

.rr-header p {
	padding-top: 15px;
    width: 80%;
    text-align: center;
    margin: 10px auto;
	font-size: .8rem;
	line-height: 1.2rem;
	padding-bottom: 25px;
}

.carousel-cell-image {
  max-width: 300px;
}
	
	
.rr-cont .intro {
padding: 0;
}