/* CSS responsive fixed full width header */
@font-face {
    font-family: 'chunkfiveroman';
    src: url('../fonts/chunkfive-webfont.eot');
    src: url('../fonts/chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/chunkfive-webfont.woff2') format('woff2'),
         url('../fonts/chunkfive-webfont.woff') format('woff'),
         url('../fonts/chunkfive-webfont.ttf') format('truetype'),
         url('../fonts/chunkfive-webfont.svg#chunkfiveroman') format('svg');
    font-weight: normal;
    font-style: normal;

}

img {
	max-width:100%;
}
body {
	background: #e1dcbf;
	font: 100% Helvetica,  Arial,  sans-serif;
	line-height: 1.25em;
}

h1 {
	font-size: 60px;
	margin: 0 auto;
	line-height: 130%;
	font-family:chunkfiveroman, Oswald, sans-serif;
	font-style:normal;
	font-weight:700;
	text-align:center;
	color:#fff;
	padding:3% 0 2% 0;
	letter-spacing: 5px;
}
h3 {
	font-size: 40px;
	margin: 0 auto;
	line-height: 110%;
	font-family:chunkfiveroman, Oswald, sans-serif;
	font-style:normal;
	font-weight:700;
	text-align:center;
	color:#000;
	padding:2% 0 1% 0;
}
.as {
	font-size:27px;
	font-family:arial,sans-serif;
	color:#f70000;
	padding-top:5px;
	text-align:center;
	letter-spacing: 3px;
}
#maincontent h1 {
	font-size: 40px;
	margin: 0 auto;
	line-height: 130%;
	font-family:chunkfiveroman, Oswald, sans-serif;
	font-style:normal;
	font-weight:700;
	text-align:center;
	color:#000;
	padding:3% 0 2% 0;
}
#maincontent h2 {
	font-size: 30px;
	margin: 0 auto;
	line-height: 130%;
	font-family:chunkfiveroman, Oswald, sans-serif;
	font-style:normal;
	font-weight:700;
	text-align:center;
	color:#000;
	padding:3% 0 2% 0;
}

p {
	margin: 1.5em 0;
	line-height: 1.5em;
	color: #000000;
    font-family: "Lato",sans-serif;
    font-size: 20px;
}
.timerheading {
	font-size:40px;
	color:#fff;
	font-family:Oswald, sans-serif;
	font-weight:bold;
	margin:2% auto;
	text-align:center;
}
a {
	text-decoration: underline;
	color: #0036ff;
}

.timercontainer {
	margin: 0 auto 3% auto;
	max-width: 55%;
}
.content {
	background:#fff;
	width: 70%; 
	position: relative;
	margin:0 auto;
	padding:  1% 3%;
	line-height: 1.4em;
	border:1px solid #c2c2c2;
}

.topheader {
	background:#ffae00;
	line-height:1.5;
}
.topcontainer {
	width:100%;
	min-height:40px;
	margin:0 auto;
	}
.header {
	background:#000;
	font-size: 1.25em;
	background: url(../images/headerbg2.jpg);
	background-size: cover;
	border-bottom:solid 4px #000;
}
.access-btn {
	max-width:450px;
	margin:0 auto 3px auto;
}
.headercontent {
	width:70%;
	/*min-height:500px;*/
	margin:0 auto;
}
.logo {
	padding:15px;
}

#footer {
	height:auto;
	padding: 1%;
	width:100%;
	background:#000;
}

#footer p {
	font-size: 100%;
	font-family:sans-serif;
	color: #fff;
	text-align:center;
}

.prehead {
	font-size:26px;
	line-height:120%;
	padding:0;
	margin:0;
}
.red {
	color:#e60000;
}
.headertext {
	max-width:70%;
	padding:0;
	margin:0 auto;
}

.guarantee {
	background:#f8fcff;
	max-width:90%;
	height:auto;
	padding:0 2% 1% 2%;
	border:1px solid #bfe0ff;
	margin:0 auto 2% auto;
}
.guarantee p {
	line-height:115%;
	padding:2% 2% 0 2%;
}
.guarantee h3 {
	margin:0 auto;
	padding:2% 0 0 0;
	line-height:110%;
}
.seal {
	float:left;
	padding: 2% 2% 0 0;
}
.button2 {
	margin:0 auto;
	padding:4% 0 0 0;
	text-align:center;
}
.seasonpass {
	padding:0;
	margin:0 auto;
	text-align:center;
	color:#f30000;
}
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0 auto;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% .5%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF TWO  */
.span_2_of_2_top {
	width: 100%;
}
.span_1_of_2_top {
	width: 49.75%;
}
.span_2_of_2 {
	width: 100%;
}
.span_1_of_2 {
	width: 49.75%;
}
/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.5%; }
.span_1_of_3 { width: 33%; }


.effect
{
    position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect:before, .effect:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}
.money {
	margin-top:-125px;
}
.record-right {
	 -ms-transform: rotate(7deg); /* IE 9 */
    -webkit-transform: rotate(7deg); /* Chrome, Safari, Opera */
    transform: rotate(7deg);
	margin-top:-50px;
}

/*NUMBER REMAINING */

#float-number {
	background:#000; 
	float:left;
	max-width: 98px;
	height: auto;
	margin:0 0 0 5px;
	padding:2px 2% 0 2%;
	border:thin solid yellow;
}

.remaining {
	margin-top:-5%;
	padding:0;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 50px;
	line-height:100%;
	color:#fff;
	text-shadow: 1px 1px 2px #fefff2;
}


@media only screen and (max-width: 960px) {
	.as {
	font-size:120%;
	}
}

/* Media query 800px */
@media (max-width: 800px) {
	.seal {
	max-width:100%;
	float:none;
	margin:2% auto 0 auto;
	text-align:center;
	}
	.note {
	margin:0 auto;
	}
	.record-right {
	 -ms-transform: none; /* IE 9 */
    -webkit-transform: none; /* Chrome, Safari, Opera */
    transform: none;
	margin-top:0;
}
	.remaining {
	font-size:30px;
	}
	.float-number {
	float:left;
	margin:0 auto;
	}
	.content {
		border:0;
		width:100%;
		padding:1%;
	}
	.effect {
		-webkit-box-shadow: 0 0 0 0; /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
		-moz-box-shadow: 0 0 0 0 ;  /* Firefox 3.5 - 3.6 */
		box-shadow: 0 0 0 0 ;
	}

	.effect:before, .effect:after {
	-webkit-box-shadow:0;
    -moz-box-shadow:0;
    box-shadow:0;
    top:0;
    bottom:0;
    left:0;
    right:0;
    -moz-border-radius:0;
    border-radius:0;
	}
	.effect:after
{
    right:0;
    left:0;
    -webkit-transform:none;
       -moz-transform:none;
        -ms-transform:none;
         -o-transform:none;
            transform:none;
}
	.timercontainer {
		max-width:80%;
	}
	.headercontent {
	width:85%;
	}
	.headertext {
	max-width:95%;
	}
	h1{
		font-size:200%;
	}
	.prehead {
		font-size:22px;
	}
	img {
	margin:0 auto;
	text-align:center;
	}
	.top {
	font-size:160%;
	}
	.topcontainer {
	max-width:100%;
	}
	.topheader {
	/*height:40px;*/
	}
	.as {
	font-size:90%;
	}
}

@media only screen and (max-width: 800px) {
	
	.span_2_of_2_top, .span_1_of_2_top { 
	width: 100%;
	float:left;
}
.span_2_of_2, .span_1_of_2 { 
	width: 100%;
	float:left; 
}
	.content .effect {
	position:relative;
    -webkit-box-shadow:0;
       -moz-box-shadow:0;
            box-shadow:0;
	}
	.col {  margin: 1% 0 1% 0%; }
	/*.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%;margin:0 auto; }*/
	.as {
	font-size:110%;
	}
}

@media only screen and (max-width: 600px) {
	.as {
	font-size:80%;
	}
	h1 {
	font-size:170%;
	}
	#footer p {
	font-size:80%;
	}
	.timerheading {
	font-size:25px;
	}
}


/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
	h1 {
	font-size:130%;
	}
	#footer p {
	font-size:60%;
	}
	.topcontainer h2 {
	font-size:80%;
	}
}



