/* #Table of contents
==================================================
#1 Reset
#2 Main and Structure
#3 Typography
#4 Button Styles
#5 Video
#6 Facebook Comments
#7 Clearing and Misc
#8 Responsive
#9 Layouts
==================================================
*/


/* #1 Reset
================================================== */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1.4;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1200px;

  /* Set up proportionate scaling */
  width: 100%;
  height: auto;

  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
}

@media screen and (max-width: 1200px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -600px;   /* 50% */
  }
}


/* #2 Main and structure
================================================== */

* {
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
}

body {
  font-family: 'Source Sans Pro', sans-serif;
  background-color: #f5f5f5;
  color: #333;
}

.wrap {
  max-width: 60em; /* 960 / 16 */
  margin: 0px auto;
}

.panel {
  background: #fff;
  border: 1px #e5e5e5 solid;
  box-shadow:  0px 0px 10px 0px rgba(0,0,0,.05);
  padding-bottom: 4em;
}

.inner-wrap {
  padding: 1.25em 10em;
}

.inner-wrap img, .panel img {
  max-width: 100%
}

a { color: #456ea9; }
.small a { color: #b1b1b1; }


.legal {
  margin: 2em 0px 5em;
}

.center {
  text-align: center;
}

.white-bg {
  background-color: #fff;
}

.gray-bg {
  background-color: #f9f9f9;
}

.testimonials {
  margin: 4em 0px;
}
.details-bottom {
  margin-top: 4em;
}


/* #3 Typography
================================================== */

h1, h2, h3, button, .offer, .cite {
  font-family: "Oswald", sans-serif;
}

h1, h2, h3, .offer, button, .small {
  text-align: center;
}

h1 {
  font-size: 3.25em;
  padding: .208333333em 0px;
  font-weight: bolder;
  letter-spacing: -1px;
  line-height: 1.15em;
  margin-bottom: .2em;
  color: #456ea9;
}

h2 {
  font-size: 2.75em;
  font-weight: lighter;
  margin-bottom: .5em;
}

h3 {
  font-size: 2.25em;
  font-weight: lighter;
  margin-bottom: 1em;
}

p, li {
  font-size: 1.125em;
  font-weight: lighter;
}

p, ul, ol {
  margin-bottom: 1em;
}

ul, ol {
  margin-left: 2.5em;
}

ul { list-style-type: disc; }
ol { list-style-type: decimal; }

strong { font-weight: bold; }
em { font-style: italic; }

.offer {
  color: #456ea9;
  font-size: 2.25em;
  font-weight: normal;
  margin-bottom: .5em;
}

.secure {
  font-size: 1.125em;
  text-align: center;
  font-weight: bold;
  color: #bbb;
}

.small {
  color: #b1b1b1;
  font-size: .8em;
}

.quote-wrap {
  border: solid #ccc 1px;
  border-radius: 4px;
  background-color: #fff;
  box-shadow: 0px 1px 3px 0px rgba(0,0,0,.1);
  line-height: 2em;
}

.quote-wrap .photo {
  border: 5px solid #fff;
  box-shadow: 0px 0px 0px 1px rgba(0,0,0,.1);
  margin: 1px 0px 0px 1px;
}

.quotes {
  position: relative;
  top: 3px;
}

.quotes.left { margin-right: 4px; }
.quotes.right { margin-left: 4px; }

.cite {
  background: url("images/bubble-triangle-3276294e0449030ff67bf9257701bb55.png") no-repeat;
  background-position: top left;
  position: relative;
  top: -2px;
  margin-left: 2em;
  padding-left: 2.5em;
  padding-top: 1em;
  min-height: 30px;
  font-size: 1.375em;
  font-weight: lighter;
  color: #999;
  margin-bottom: 2em;
}

.cite .name {
  font-weight: normal;
  text-transform: uppercase;
}

.cite.right {
  background: url("images/bubble-triangle2-3276294e0449030ff67bf9257701bb55.png") no-repeat;
  background-position: top right;
  margin-right: 2em;
  padding-right: 2.5em;
  text-align: right;
}

/* #4 Button Styles
================================================== */

.button {
  color: #fff;
  background: #ff9600;
  cursor: pointer;
  font-size: 1.625em;
  border-radius: 5px;
  -webkit-appearance: none;
  display: block;
  width: 100%;
  font-family: "Oswald", sans-serif;
  font-size: 2.625em;
  padding: .25em 0px;
  margin-bottom: .476190476em;
  letter-spacing: -1px;
  font-weight: normal;
  border: 1px solid #ff9200;
  box-shadow: 0px 1px 3px 0px #b4b9b6,
  inset 0px 1px 0px 0px rgba(255,255,255, 0.3);
  text-align: center;
  text-decoration: none;
}

.button:hover {
  background-color: #ff9000;
}

.button:active {
  background-color: #ff9000;
  box-shadow: inset 0px 0px 10px 0px rgba(0,0,0,.5);
  border: 1px solid #ff9200;
}


/* #5 Video
================================================== */

.video-container {
  position: relative;
  padding-bottom: 55.2%;
  margin-bottom: 1.25em;
}

.video-container iframe {
  position: absolute;
  width: 98%;
  height: 100%;
}


/* #6 Facebook Comments
================================================== */

.facebook-comments {
  background-color: #fff;
  margin-top: 5em;
}

.facebook-comments .header h4 {
  font-size: 1.625em;
  font-weight: bolder;
  padding-right: 100px; /* Needs to stay pixels since it relates to an image, same below */
  min-height: 45px;
  background: url("images/arrow-3276294e0449030ff67bf9257701bb55.png") no-repeat right top;
  display: inline-block;
}

.fb-comments,
.fb-comments > span[style],
.fb_iframe_widget iframe[style] {
  width: 100% !important;
}

.fb-comments {
  border: solid 10px #f1f1f1;
  margin-top: .5em;
}


/* #7 Clearing and Misc
================================================== */

.hide {
  display: none;
}

/* Self Clearing Floats */

.group {
  position: relative;
}

.group:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Media Object Used in the Testimonials */

.media { margin: 1.25em; }
.media, .bd {overflow:hidden; _overflow:visible; zoom:1;}
.media .media-image { float: left; margin-right: 1.25em; }
.media .media-image img { display: block; }
.media .media-imageExt { float: right; margin-left: .625em; }

.right .media { margin: 1.25em; }
.right .media, .bd {overflow:hidden; _overflow:visible; zoom:1;}
.right .media .media-image { float: right; margin-left: 1.25em; margin-right: 1px; }
.right .media .media-image img { display: block; }
.right .media .media-imageExt { float: left; margin-right: .625em; }


/* #8 Responsive
================================================== */

@media only screen and (max-width: 768px) {
  body { font-size: 80%; }
  .inner-wrap { padding: 2.5em; }
  .panel { margin: 0px 1em; }
  h1 { font-size: 2.625em; }
  h2, .offer { font-size: 2em; }
  h3 { font-size: 1.5em }
  button { font-size: 1.8em; }
  .secure { font-size: .75em; }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
  h1 { font-size: 1.8em; }
  h2, h3, .offer { font-size: 1.5em; }
  p { font-size: 1em; }
  button { font-size: 1.7em; }
  .media .media-image, .media .media-imageExt,
  .right .media .media-image, .right .media .media-imageExt { float: none; }
  .media .media-image img { margin-bottom: .5em; }
  .cite { font-size: 1em; }
}


/* #9 Layouts
================================================== */
.layout-headline .section-1 h1 {
  display: none;
}

.layout-sub-headline .section-1 h2 {
  display: none;
}

.layout-no-video .video {
  display: none;
}

.layout-offer-text .section-1 .offer {
  display: none;
}

.layout-call-to-action .section-1 .button {
  display: none;
}

.layout-secure-checkout .section-1 .secure {
  display: none;
}

.layout-credit-cards .section-1 .center {
  display: none;
}

.layout-product-details-headline .section-2 h1 {
  display: none;
}

.layout-product-details-sub-headline .section-2 h2{
  display: none;
}

.layout-product-image .section-2 .product-image {
  display: none;
}

.layout-details-top .details-top {
  display: none;
}

.layout-testimonial-title .testimonials h3 {
  display: none;
}

.layout-single-testimonial .testimonials blockquote.last {
  display: none;
}

.layout-quote-only-testimonials .testimonials .media-image {
  display: none;
}

.layout-testimonials .testimonials {
  display: none;
}

.layout-bottom-cta-headline .section-3 h1 {
  display: none;
}

.layout-bottom-cta-sub-headeline .section-3 h2 {
  display: none;
}

.layout-bottom-guarantee-image .section-3 .bottom-guarantee-image {
  display: none;
}

.layout-bottom-offer .section-3 .offer {
  display: none;
}

.layout-bottom-call-to-action .section-3 .button {
  display: none;
}

.layout-bottom-secure-checkout .section-3 .secure {
  display: none;
}

.layout-bottom-credit-cards .section-3 .bottom-credit-cards {
  display: none;
}

.layout-bottom-details .details-bottom {
  display: none;
}

.layout-copyright .legal {
  display: none;
}