html, body, div {
  padding: 0;
  margin: 0; }

body {
  font-family: "ff-basic-gothic-web-pro", Verdana, Sans-Serif;
  color: #444;
  font-size: 18px;
  line-height: 1.5; }

a, .story ul li a, .story h2 a, .story ol li a {
  color: #827c76; }

strong {
  font-weight: 500; }

h1 {
  font-weight: 200;
  font-size: 36px;
  color: #d44822;
  letter-spacing: -.03em; }

h2, h3 {
  font-weight: 500;
  font-size: 22px;
  margin: 2em 0 0 0; }

blockquote {
  color: #666;
  border-left: 4px solid #ddd;
  margin: 0;
  padding: 0 20px;
  font-size: 90%;
  font-style: italic; }

nav {
  font-size: 15px; }
  nav a + a {
    margin-left: .5em; }

input[type="text"], input[type="password"], input[type="name"], input[type="email"], input[type="number"], select, textarea, input[type=file] {
  font: 18px/1.552em "ff-basic-gothic-web-pro", Verdana, Sans-Serif;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 0.4em;
  -moz-border-radius: 0.4em;
  -o-border-radius: 0.4em;
  border-radius: 0.4em;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
  border: 2px solid #ddd;
  display: block;
  font-size: 14px;
  padding: 6px 6px;
  width: 100%;
  outline: none;
  margin: 1em 0; }
  input[type="text"]:hover, input[type="text"]:active, input[type="text"]:focus, input[type="password"]:hover, input[type="password"]:active, input[type="password"]:focus, input[type="name"]:hover, input[type="name"]:active, input[type="name"]:focus, input[type="email"]:hover, input[type="email"]:active, input[type="email"]:focus, input[type="number"]:hover, input[type="number"]:active, input[type="number"]:focus, select:hover, select:active, select:focus, textarea:hover, textarea:active, textarea:focus, input[type=file]:hover, input[type=file]:active, input[type=file]:focus {
    border: 2px solid #79c2e4; }
  input[type="text"]:focus, input[type="password"]:focus, input[type="name"]:focus, input[type="email"]:focus, input[type="number"]:focus, select:focus, textarea:focus, input[type=file]:focus {
    border: 2px solid #299ace; }

input[type=submit], a.submit {
  font-family: "ff-basic-gothic-web-pro", Verdana, Sans-Serif;
  cursor: pointer;
  border-radius: 0.4em;
  background-color: #299ace;
  padding: 1em 1.5em .9em;
  margin: 1 0;
  font-weight: 600;
  letter-spacing: 0;
  text-decoration: none;
  font-size: 13px;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #FFF; }
  input[type=submit]:hover, a.submit:hover {
    background-color: #48b2e9;
    text-shadow: 0px 0px 1px #299ace; }
  input[type=submit].buy, a.submit.buy {
    font-size: 150%; }

.story {
  width: 100%;
  max-width: 36em;
  margin: 0 auto; }
  .story a {
    color: #d44822;
    text-decoration: underline; }

.post-header {
  text-align: center;
  margin: 2em 0 0; }

.testimonial-photo {
  max-width: 3em;
  max-height: 3em;
  border-radius: 3em;
  display: block; }

a.button {
  text-align: center;
  background-color: #e66125;
  color: white;
  padding: .25em .5em;
  display: block;
  width: 6.5em;
  font-weight: 500;
  font-size: 13px;
  border-radius: 9px;
  text-decoration: none; }
  a.button:hover {
    background-color: #ff7a48; }

table.pricing {
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  border-radius: 1em;
  border: 5px solid #299ace;
  margin: 2em 0;
  width: 100%; }
  table.pricing h2 {
    font-weight: 500;
    font-size: 150%;
    margin: 1em 0 .5em; }
  @media screen and (max-width: 650px) {
    table.pricing {
      font-size: 75%; } }
  table.pricing tr:first-child td:first-child {
    -moz-border-radius-top-left: 1em;
    -webkit-border-top-left-radius: 1em;
    border-top-left-radius: 1em; }
  table.pricing tr:first-child td:last-child {
    -moz-border-radius-top-right: 1em;
    -webkit-border-top-right-radius: 1em;
    border-top-right-radius: 1em; }
  table.pricing tr:last-child td:first-child {
    -moz-border-radius-bottom-left: 1em;
    -webkit-border-bottom-left-radius: 1em;
    border-bottom-left-radius: 1em; }
  table.pricing tr:last-child td:last-child {
    -moz-border-radius-bottom-right: 1em;
    -webkit-border-bottom-right-radius: 1em;
    border-bottom-right-radius: 1em; }
  table.pricing tr:last-child {
    border: 0; }
  @media screen and (max-width: 650px) {
    table.pricing .button {
      padding: .1em .5em .25em; } }
  table.pricing .bottom-right {
    border-radius-bottom-right: 0.4em; }
  table.pricing th, table.pricing td {
    border: 1px solid #f1f3f5; }
  table.pricing th, table.pricing .check, table.pricing .buy {
    text-align: center; }
  table.pricing th {
    padding: 1em 0; }
    @media screen and (max-width: 650px) {
      table.pricing th h2 {
        font-size: 70%; } }
    table.pricing th p {
      font-size: 80%; }
      @media screen and (max-width: 650px) {
        table.pricing th p {
          font-size: 70%; } }
  table.pricing td {
    font-size: 80%;
    padding: 1em 1.5em; }
    table.pricing td strong {
      color: #cec6c1;
      font-weight: 600;
      font-size: 100%; }
    @media screen and (max-width: 650px) {
      table.pricing td {
        padding: .25em; } }
  table.pricing .money-sign {
    font-weight: 400;
    color: #2B2828;
    vertical-align: .25em; }
    @media screen and (max-width: 650px) {
      table.pricing .money-sign {
        font-size: 70%; } }
  table.pricing .per-month {
    color: #2B2828;
    font-weight: 300; }
    @media screen and (max-width: 650px) {
      table.pricing .per-month {
        font-size: 70%; } }
  table.pricing .bonus {
    background-color: #f7f8f9;
    font-weight: 500;
    color: #504a44;
    border: 0; }
    table.pricing .bonus p, table.pricing .bonus h2 {
      letter-spacing: normal;
      text-align: left; }
    table.pricing .bonus p {
      font-weight: normal; }
  table.pricing .center {
    text-align: center; }
  table.pricing .check {
    text-align: center; }
    table.pricing .check i {
      color: #e66125; }
  table.pricing a.premium {
    background-color: #ff552c; }

/*
// Our variables
$base-font-family: "ff-basic-gothic-web-pro", Verdana, Sans-Serif;
$base-font-weight: 	300;
$base-font-size:   18px;
$base-line-height: 1.4;

$headline-font-weight: 200;
$headline-font-size: $base-font-size * 2;
$headline-line-height: 1.27;
$headline-margin: 1.5em 0 .5em;
$headline-letter-spacing: -.03em;

$sub-headline-font-family: "ff-basic-gothic-web-pro", Verdana, Sans-Serif;
$sub-headline-font-weight: 500;
$sub-headline-font-size: $base-font-size * 1.1;
$sub-headline-line-height: 1.34;

$small-font-size:  $base-font-size * 0.875;

$ui-border-radius: .4em;
$pricing-table-border-radius: 	1em;
$pricing-table-border-radius-outside: 1em;

$spacing-unit:     30px;

$text-color:       	#4c4c4c;
$background-color: 	#fefefe;
$brand-color:      	#299ace;
$hover-color:				#48b2e9;
$red-color:					#e66125;
$green-color: 			#36b744;

$black-color:			 #2B2828;
$header-color:		 $black-color;

$grey-color:       #d9d3cf;
$grey-color-light: #dddddd;
$grey-color-dark:  #504a44;



// Width of the content area
$content-width:    750px;
$on-palm:          650px;
$on-laptop:        650px;



// Using media queries with like this:
// @include media-query($on-palm) {
//     .wrapper {
//         padding-right: $spacing-unit / 2;
//         padding-left: $spacing-unit / 2;
//     }
// }
@mixin media-query($device) {
    @media screen and (max-width: $device) {
        @content;
    }
}



// Import partials from `sass_dir` (defaults to `_sass`)
@import
        "base",
        "layout",
        "syntax-highlighting"
;


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer 
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}*/
