/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body {
	color: #666;
	background: #FFF url('../images/bg_large.jpg') no-repeat top center;
	font-size: 14px;
	text-shadow: 0px 1px 0px #FFF;
    

    /* standard font stack */
    font-family: "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", 'TeXGyreHerosRegular', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; 
    font-weight: 400; 
    font-stretch: normal;

    /* bold font stack */
    /*
    font-family: "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; 
    font-weight: 600; 
    font-stretch: normal;
    */
}

div.divider {
	border-top: 1px solid #D4D4D4;
	border-bottom: 1px solid #FFF;
	margin: 1.25em 0;
	height: 0px;
}
div.divider hr {
	display: none;
}

form input, form select {
	margin-bottom: 10px !important;
}
form input.one-third, form select.one-third {
	max-width: 33%;
}
form input.two-thirds, form select.two-thirds {
	max-width: 66%;
}
form input.one-half, form select one-half {
	max-width: 50%;
}

form input.button {
    display: block;
    width: 100%;
    max-width: 100%;

    font-size: 1.7142857143em;
    line-height: 1em;

    font-family: "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "HelveticaNeue", "Helvetica Neue", 'TeXGyreHerosBold', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; 
    font-weight: 600; 
    font-stretch: normal;

    text-decoration: none;
    color: #666666 !important;
    padding: 5px;
    margin: 2em 0 0.75em 0;
    background: #d9d9d9;
    background: linear-gradient(top, #fcfcfc 0.1%, #f4f4f4 0.39%, #d9d9d9 100%); 
    background: -webkit-gradient(linear, left top, left bottom, color-sto(0%,#fcfcfc), color-stop(0.1, #fcfcfc), color-stop(0.39, #f4f4f4), color-stop(100%, #d9d9d9)); 
    background: -webkit-linear-gradient(top, #fcfcfc 0.1%, #f4f4f4 0.39%, #d9d9d9 100%); 
    background: -moz-linear-gradient(top, #fcfcfc 0.1%, #f4f4f4 0.39%, #d9d9d9 100%); 
    background: -o-linear-gradient(top, #fcfcfc 0.1%, #f4f4f4 0.39%, #d9d9d9 100%); 
    background: -ms-linear-gradient(top, #fcfcfc 0.1%, #f4f4f4 0.39%, #d9d9d9 100%); 
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border: none;
    box-shadow: 0px 1px 2px rgba(51,51,51,0.7);
    text-shadow: 0px 1px 0px #FFF;
    text-align: center;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    position: relative;
    cursor: pointer;
}
form input.button:hover {
    border: inherit;
}

/* #Typography
================================================== */
p, h1 {
  font-size: 1em; /* 14px */
  line-height: 1.2857em; /* 18px */
  margin: 0 0 1.2857em 0;
  font-family: inherit;
  color: inherit;
}

p.small, p small {
  font-size: 0.9286em; /* 13px */
  line-height: 1.3846em; /* 18px */
  margin-top: 1.3846em;
  margin-bottom: 0em;
}
p.smaller {
  font-size: 0.8571em; /* 12px */
  line-height: 1.5em; /* 18px */
  margin-top: 1.5em;
  margin-bottom: 0em;
}
p.smallest {
  font-size: 0.8857em; /* 11px */
  line-height: 1.6364em; /* 18px */
  margin-top: 1.6364em;
  margin-bottom: 0em;
}

p a, p a:visited {
	text-decoration: none;
}
p a:hover {
	text-decoration: underline;
}

h2 {
  font-size: 1.7143em; /* 24px */
  line-height: 1.5em; /* 36px */
  margin-top: 0.75em;
  margin-top: 0;
  margin-bottom: 0.15em;
  font-family: inherit;
  font-weight: normal;
  color: #333;
}
h2.red {
	color: #323232;
}

h3 {
  font-size: 1.4286em; /* 20px */
  line-height: 1.8em; /* 36px */
  margin-top: 0.9em;
  margin-bottom: 0em;
  font-weight: normal;
  font-family: inherit;
  color: #454545;
}

h4 {
  font-size: 1.1429em; /* 16px */
  line-height: 1.125em; /* 18px */
  margin-top: 1.125em;
  margin-bottom: 0em;
  margin-bottom: -0.5em;
  font-weight: bold;
  font-family: inherit;
  color: #333;
}


/* left overs */

.class-for-22px {
  font-size: 1.5714em; /* 22px */
  line-height: 1.6364em; /* 36px */
  margin-top: 0.8182em;
  margin-bottom: 0em;
}
.class-for-18px {
  font-size: 1.2857em; /* 18px */
  line-height: 1em; /* 18px */
  margin-top: 1em;
  margin-bottom: 0em;
}

strong { color: inherit;}


/* #Page Styles
================================================== */

header { 
    padding-top: 150px !important;
}
header div#draw_information { 
	height: 50px;
	margin-top: 0;
	margin-bottom: 20px;
}
header div#draw_information p { 
	color: #666;
	text-align: right;
	margin: 0;
	line-height: 1em;
	font-size: 0.9em;
}

header div#prize_pool_information {}
#prize_win {
    color: #007D7D;
    font-size: 2em;
    letter-spacing: -0.02380952381em;
    margin: 0;
    text-transform: uppercase;
    font-weight: bold;
}
#prize_share {
    color: #666666;
    font-size: 2em;
    letter-spacing: -0.02380952381em;
    margin: 10px;
}
#prize_pool {
    color: #212121;
    font-size: 2em;
    letter-spacing: -0.02380952381em;
    margin: 0;
}


/* ordering information */
div#order_content {
	background: transparent url('../images/order_bg.jpg') no-repeat top center;
}
div#order_content div#order_introduction {
	margin-bottom: -1em;
}
div#order_content div#artunion_details p:first-child {
	margin-top: 0;
}
div#order_content div#artunion_details p {
	color: #999;
}
div#order_content div#artunion_details p a {
	color: #666;
}
div#order_content div#the_order input#process_button {
	width: 244px;
	margin: 0 auto;
}

/* legal */
div#legal {
	margin-top: 1em;
}
div#legal p {
	color: #999;
	text-align: center;
}




footer {
	background: transparent url('../images/footer_bg.jpg') no-repeat top center;
	padding-top: 10px;
	padding-bottom: 5em;
}
footer p {
	text-align: center;
	color: #999;
	text-shadow: 0px -1px 0px #000;
}
footer a, footer a:visited {
	color: #CCC !important;
}
footer a:hover {
	color: #FFF;
}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
        body {
            background: #FFF url('../images/bg_medium.jpg') no-repeat top center;
        }
        header {
            padding-top: 166px !important;
        }
        header div#prize_pool_information {
            font-size: 0.9em;
        }
		div#order_content {
			background: none;
		}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		body {
			background: #F4F4F4 url('../images/bg_small.jpg') no-repeat top center;
			font-size: 12px;
			padding-top: 0px;
		}
        header {
            padding-top: 155px !important;
        }
        header div#draw_information {
            margin-bottom: 0;
        }
        header div#prize_pool_information {
            font-size: 0.8em;
            padding-bottom: 2em !important;
        }
        header div#prize_pool_information div.eight.columns {
            display: none;
        }
        header div#prize_pool_information div.four.columns {
            width: 45% !important;
            float: left;
            margin-left: 5%;
        }
        
        div#order_content {
			background: none;
		}
		div#order_content fieldset#personal_details, div#order_content fieldset#order_details {
			margin-bottom: 20px;
		}
		div#order_content fieldset#order_details {
			border-bottom: 1px solid #DDD;
			padding-bottom: 20px;
		}
		div#welcome_content {
			background: none;
		}
		div#welcome {
			margin-bottom: 2em;
		}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {	
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		div#welcome div#find_out_more {
			display: none;
		}
	}

	/* only show the beefeater & big ben if past a certain res */
	@media only screen and (min-width: 1350px) {
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }