/*   
Theme Name: 
Theme URI: http://blinkerfluidinc.com
Description: Simple one page website
Author: Ryan Litts + @rlitts
Author URI: http://ryanlitts.com
*/

html { 
  background: url(../images/bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

body {
	font-family: 'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma, sans-serif;
	font-size: 24px;
	line-height: 1.5em;
}

a { 
	text-decoration: none;
	-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; transition: all .4s ease-in-out;	
}

#wrapper {
	width: 1018px;
	margin: 0 auto;
	background: url('../images/bg-w.png') repeat;
	box-shadow: 0px 0 30px 5px #555 ;
	position: relative;
}

header {
	background: url('../images/curve-road.png') no-repeat ;
	display: block;
	width: 1020px;
	height: 400px;
	margin: 0 auto;
	position: relative;
	top: 0px;
	
}

h1.event-name {
	background: url('../images/blinker-fluid.png') no-repeat;
	text-indent: -9999px;
	display: block;
	width: 600px;
	height: 150px;
	position: absolute;
	top: 80px;
	left: 10px;	
}

.event-date  {
	background: url('../images/date.png') no-repeat -1px 0;
	text-indent: -9999px;
	width: 175px;
	height: 130px;
	position: relative;
	left:500px;
	top:90px;
}

nav ul { 
	margin: 137px 0; 
	background: url('../images/tire-tred-top.png') no-repeat 0 10px;
	width: 100%;
	height: 250px;
	padding-left: .5em;
}

nav ul li { display: inline-block;
	color: #fff;
	margin: 1em .1em;
	}

nav ul li a {
	color: #fff;
	text-decoration: none;
	padding: .2em .7em;
	border-radius: 5px;
}

nav ul li a:hover {
	color:;
	background: #c15800 url() no-repeat;
	
}

.main-content {
	text-align: center;
	padding: 2em 5em;
	margin-top: 1em;
}

.main-content ul:before {
	display: block;
	content:'';
	width: 14px;
	height: 14px;
	background-color: #ffa84c;
	margin: 1em auto;
}

.main-content ul li:first-child:before {
	display: none;
}

.main-content ul li {
	font-weight: bold;
	font-size: 1.2em;
}

.main-content ul ul li{
	font-weight: normal;
	margin: 1em 1em;
	font-size: .8em;
	line-height: 1.5em;
}

.main-content ul ul:before {
	display: none;
	content:'';
}


.main-content h2 {
	color: #000;
	display: inline-block;
	padding: .25em .5em;
	margin-top: .1em;
	margin-bottom: .1em;
	font-size:2.5em;
	line-height: .8em;
	font-weight: bold;
	text-transform: uppercase;
	
}

.main-content h3 {
	color: #ef7f22;
	background: #000 url() no-repeat;
	display: inline-block;
	padding: .25em .5em;
	margin-top: 1em;
	margin-bottom: 1em;
	font-size:1.2em;
}



a.bnt {
	-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; transition: all .4s ease-in-out;	
	color: #000;
	text-transform: uppercase;
	margin-top: 1em;
	display: inline-block	;
	border-radius: 25px;
	padding: .5em 1em;
	background: #ef7f22; /* Old browsers */
	background: -moz-linear-gradient(top,  #ef7f22 0%, #f79621 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9c667), color-stop(100%,#f79621)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ef7f22 0%,#f79621 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ef7f22 0%,#f79621 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ef7f22 0%,#f79621 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ef7f22 0%,#f79621 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ef7f22', endColorstr='#f79621',GradientType=0 ); /* IE6-9 */
}
a.bnt:hover {
	-webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; transition: all .4s ease-in-out;	
	
	background: #ffa84c; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffa84c 0%, #ef7f22 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffa84c), color-stop(100%,#ef7f22)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffa84c 0%,#ef7f22 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffa84c 0%,#ef7f22 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffa84c 0%,#ef7f22 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffa84c 0%,#ef7f22 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ef7f22',GradientType=0 ); /* IE6-9 */	
}

sup {
	display: inline-block;
	font-size: .6em;
	position: relative;
	top:-.7em;
	
}

/* spinning rotate */
@-webkit-keyframes spinnerRotate
{
    from{-webkit-transform:rotate(0deg);}
    to{-webkit-transform:rotate(360deg);}
}
@-moz-keyframes spinnerRotate
{
    from{-moz-transform:rotate(0deg);}
    to{-moz-transform:rotate(360deg);}
}
@-ms-keyframes spinnerRotate
{
    from{-ms-transform:rotate(0deg);}
    to{-ms-transform:rotate(360deg);}
}

#tire-box {
	position: absolute;
	top:20px;
    left:680px;
  	-webkit-transition: 2s ease-in-out;
}

#tire-box:hover {
	-webkit-transform: translate(80px,-12px);
	width: 250px;
	height: 250px;
	}

#spin{
	-webkit-transition: 2s ease-in-out;
	-webkit-animation-name: spinnerRotate;
	-webkit-animation-duration: 5s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	-moz-animation-name: spinnerRotate;
	-moz-animation-duration: 5s;
	-moz-animation-iteration-count: infinite;
	-moz-animation-timing-function: linear;
	-ms-animation-name: spinnerRotate;
	-ms-animation-duration: 5s;
	-ms-animation-iteration-count: infinite;
	-ms-animation-timing-function: linear;
	
}

footer { margin: 0 0 -1em 0;}