/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/* =============================================================================
   Base
   ========================================================================== */

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 14px; line-height: 1.1; }
body, button, input, select, textarea { font-family: sans-serif; color: }
::-moz-selection { background: #ffffff; color: #ed1c24; text-shadow: none; }
::selection { background: #ffffff; color: #ed1c24; text-shadow: none; }

/* =============================================================================
   Links
   ========================================================================== */

a, a:visited {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* ==|== primary styles =====================================================
   ========================================================================== */

/* GLOBAL */

body {
	background: #ed1c24;
	color: #ffffff;
    line-height: 1.2;
}

a {
	color: #ffffff;
}

a:hover {
	text-decoration: none;
	background: #ffffff;
	color: #ed1c24;
}

p {
	margin: 0 0 1em 0;
}

h1 {
    font-family: Arial Black, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;

}

h2 {
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: normal;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
}

#container{
	width: 967px;
	margin: 0 auto;
}

#content {
	background: url(../images/header.png) top center no-repeat;
	padding: 313px 0 0 0;
    clear: none;
}

section {
    border-top: solid 1px #ffffff;
    padding: 20px;
    margin: 10px 0;
}


/* BUY BUTTON TOP */

header {
    width: 250px;
    height: 140px;
    background: url(../images/buy-now.png) top right no-repeat;
    top: 0;
    right: 0;
    float: right;
}

header a:hover {
	background: none;
}

#buy-header {
    width: 250px;
    height: 140px;
}


/* PROOF */

#float-right {
	width: 400px;
	float: right;
}

.ie7 #float-right {
	margin-right: 20px;
	padding-right: 20px;
}

#proof {
    width: 400px;
	padding: 20px;
    float: right;
    text-align: right;
	border: none;
}

#proof #quote-1, #proof #quote-2 {
    font-size: 16px;
    text-align: center;
    margin: 20px 0;
	padding-top: 15px;
}
    
#proof #quote-1 {
    width: 355px;
    height: 130px;
    background: url(../images/quote-1-bg.png) top center no-repeat;
    float: right;
    padding-right: 15px;
}

#proof #quote-2 {
    width: 391px;
    height: 114px;
    background: url(../images/quote-2-bg.png) top center no-repeat;
    float: right;
    padding-right: 8px;
	margin-bottom: 10px;
}


/* DISCLAIMER */

#disclaimer {
	width: 380px;
	float: right;
	clear: right;
	font-size: 95%;
}


/* STORY */

#story {
    width: 430px;
    font-size: 16px;
    line-height: 1.3;
    padding-right: 0;
	border: none;
}


/* BENEFITS */

#benefits {
    width: 470px;
    padding-right: 0;
}

#benefits ul {
    padding: 0;
    margin: 20px 0 0 18px;
}

#benefits ul li {
    list-style-image: url(../images/dot-point.png);
    list-style-position: outside;
    line-height: 1.4;
    padding-bottom: 10px;
}


/* ADVICE */

#advice {
    overflow: hidden;
}

#advice ul {
	padding: 0 0 0 20px;
	margin: 0;
}

#advice ul li {
	list-style-image: url(../images/arrow-point.png);
	list-style-position: outside;
	padding-bottom: 10px;
}

.advice-column-left, .advice-column-right {
    width: 450px;
    float: left;
}

.advice-column-left {
    margin-right: 25px; ;
}


/* BUY BUTTON BOTTOM */

#buy-bottom {
	height: 34px;
	background: url(../images/buy-now-bottom.png) top center no-repeat;
	color: #000;
	font-family: Arial Black, sans-serif;
	font-size: 30px;
	text-align: center;
	padding: 30px;
	text-transform: uppercase;
}


/* FOOTER */

footer {
    padding: 2px;
    margin-top: 20px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    color: #231f20;
    font-size: 90%;
    text-align: center;
    font-style: italic;
}

footer a, footer a:visited, footer a:focus, footer a:active   {
    color: #000;
}

footer a:hover {
    color: #fff;
	background: none;
}


/* ==|== media queries ======================================================
   PLACEHOLDER Media Queries for Responsive Design.
   These override the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 480px) {
  /* Style adjustments for viewports 480px and over go here */

}

@media only screen and (min-width: 768px) {
  /* Style adjustments for viewports 768px and over go here */

}

/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; height: 1px; width: 100%; }
.left{float:left;}
.right{float:right;}

/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
