@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-custom.eot');
  src: url('../fonts/fontawesome-custom.eot') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.0.1') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.0.1') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.0.1#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@import "bourbon";
//@import "compass/css3";
//@import "compass/support";

$experimental-support-for-svg: true;
$gray: #5a5a5a;
@import "_variables.scss";
@import "_mixins.scss";
.left {
  float: left;
}

.right {
  float: right;
}

.clear {
  clear: both;
}

a {
  text-decoration: none;
}

.upp {
  text-transform: uppercase;
}

.wrp {
  margin: 0 auto;
  width: 1080px;
}

#container-focus-preview {
  .f3, .f4 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .f5 {
    form {
      padding: 0 40px;
    }
  }
}

.farb {
  border: none !important;
  margin-bottom: 20px;
}

.far {
  color: $white;;
  font-size: 16px;
  padding: 50px 0;
  h4 {
    font-size: $normalSize * 1.5;
    line-height: $normalSize;
    margin-top: 0px;
    margin-bottom: 10px;
  }
  h1, h2, h3, h4, h5, h6, a {
    color: $white !important;
  }
  &.light {
    h1, h2, h3, h4, h5, h6, a {
      color: #3a3a3a !important;
    }
  }
  a {
    text-decoration: underline;
  }
  ul {
    font-style: italic;
    letter-spacing: 1px;
    margin: 20px auto 0;
    width: 80%;
  }
  hr {
    border: none;
    margin: 20px -19px 20px -19px;
  }
  &.farb {
    hr {
      margin: 20px 0;
    }
  }
  ul {
    li {
      list-style-image: url('../images/green_arrow.png');
    }
  }
  &.mid {
    &.f2, &.f4, &.f5 {
      margin-bottom: 20px;
      .wrp {
        width: 96%;
      }
    }
  }
}

.far {
  box-shadow: inset 0 7px 8px -10px $black, inset 0px -7px 8px -10px $black;
  &.blue {
    @include linear-gradient(#53ace8 0%, #3498db 100%);
    hr {
      background: #2980b9;
    }
  }
  &.dark {
    @include linear-gradient(#4a5d70 0%, #2c3e50 100%);
    hr {
      background: #2c3e50;
    }
  }
  &.green {
    @include linear-gradient(#4dd888 0%, #2cc56d 100%);
    hr {
      background: #20a850;
    }
  }
  &.light {
    @include linear-gradient(#f9f9f9 0%, #cccccc 100%);
    color: #3a3a3a;
    hr {
      background: #808080;
    }
  }
  &.purple {
    @include linear-gradient(#b37fc9 0%, #9b59b6 100%);
    hr {
      background: #8e44ad;
    }
  }
  &.red {
    @include linear-gradient(#f06d60 0%, #e74c3c 100%);
    hr {
      background: #c0392b;
    }
  }
  &.orange {
    @include linear-gradient(#f7b03f 0%, #f39c12 100%);
    hr {
      background: #e67e22;
    }
  }
}

.farb {
  box-shadow: (0 0 3px rgba(1, 1, 1, .16));
  &.green {
    background: #4dd888;
  }
  &.red {
    background: #f06d60;
  }
  &.blue {
    background: #53ace8;
  }
  &.purple {
    background: #b37fc9;
  }
  &.orange {
    background: #f7b03f;
  }
  &.light {
    background: #f9f9f9;
  }
  &.dark {
    background: #4a5d70;
  }
}

.f0 {
  .wrp {
    padding: 0 20px;
  }
}

.f1 {
  .wrp {
    padding: 0 20px;
    text-align: center;
  }
  img {
    margin: 30px 0;
  }
}

.bSe {
  .f2 {
    .wrp {
      width: auto;
    }
  }
}

.f2 {
  &.farb {
    .wrp {
      box-sizing: border-box;
      padding: 0 5%;
    }
  }
  .wrp {
    box-sizing: border-box;
    padding: 0 10px;
  }
  .left {
    width: 65%;
  }
  .right {
    width: 35%;
  }
  .f2l {
    padding-right: 2%;
    width: 32%;
  }
  .f2r {
    width: 60%;
  }
}

.f3 {
  .left {
    width: 65%;
  }
  .right {
    width: 33%;
  }
}

.f4 {
  p, ul {
    font-size: $normalSize * .875;
  }
  .left {
    padding-right: 1%;
    width: 71.2%;
  }
  .right {
    width: 27.8%;
    p {
      color: $white;
      font-size: $normalSize * .75;
      margin-top: 10px;
      text-align: center;
    }
  }
  &.light {
    p {
      color: #3a3a3a;
    }
  }
}

.f5 {
  .f5l {
    padding-right: 5%;
    width: 20%;
  }
  .f5r {
    width: 75%;
  }
  .frm {
    padding-left: 60px;
    input[type="text"], input[type="email"] {
      padding: 17px 20px 18px 20px;
    }
    .input_for_2_fields {
      margin-right: 2%;
      width: 27%;
    }
    .submit_with_2_fields {
      width: 33%;
    }
    .input_for_1_fields {
      margin-left: 16%;
      width: 30%;
    }
    .submit_with_1_fields {
      margin-right: 16%;
      width: 28%;
    }
    .btn {
      input[type='submit'] {
        padding: .44em 1.3em;
      }
    }
  }
}

.gBt {
  @include linear-gradient(bottom, darken(#f9f9f9, 15%) 0%, #f9f9f9 100%);
  border: 1px solid #dfdcdc;
  color: #636363;
  display: block;
  font-weight: bold;
  font-size: $normalSize * 1.563;
  margin: 0 auto;
  max-width: 300px;
  padding: 35px 0;
  text-align: center;
  &:hover {
    @include linear-gradient(bottom, #f9f9f9 0%, darken(#f9f9f9, 15%) 100%);
  }
}

.oac {
  box-shadow: 0 0 3px rgba(1, 1, 1, .16);
  background: #4174dc;
  color: $white;
  text-align: center;
  padding: 20px;
}

.oab {
  box-shadow: 0 0 3px rgba(1, 1, 1, .16);
  color: $white;
  text-align: center;
  padding: 20px;
}

.cnt {
  .oab {
    p {
      color: $white;
      margin-bottom: 20px;
    }
    img {
      margin-top: 0;
    }
  }
}

.optin_widget {
  h4 {
    margin-top: 0;
  }
}

@each $color in $widgetColors {
  .#{nth($color, 1)}_cta .oab {
    background: nth($color, 2);
    border: 4px solid nth($color, 3);
  }
}

.cnt {
  .light_cta {
    .oab p {
      color: #666565;
    }
  }
}

.optin_widget .oab {
  border: 0;
}

.oac, .oab {
  h4 {
    margin-bottom: 10px;
  }
  img {
    margin: 20px 0;
  }
  p, h4 {
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

.frm {
  input[type="text"], input[type="email"] {
    box-sizing: border-box;
    box-shadow: 1px 1px 6px -4px $black inset;
    border: none;
    background: $white;
    font-size: $normalSize * .83;
    margin-bottom: 10px;
    padding: 4% 0 4% 7%;
    width: 100%;
  }
  .op-r {
    margin-bottom: 10px;
  }
  input[type="submit"] {
    cursor: pointer;
  }
}

aside {
  .frm {
    input[type="submit"] {
      @include linear-gradient(bottom, #e8e8e8 0%, $white 100%);
      border: 0;
      color: #666565;
      cursor: pointer;
      font-weight: bold;
      font-size: $normalSize;
      padding: 16px 15px;
      text-transform: uppercase;
      width: 100%;
      &:hover {
        @include linear-gradient(bottom, $white 0%, #e8e8e8 100%);
      }
    }
  }
}

.f1, .f5, .f0 {
  .lfa {
    box-sizing: border-box;
    width: 96%;
  }
}

.f3, .f4 {
  .lfa {
    box-sizing: border-box;
    padding: 0 2%;
    width: 100%;
  }
}

.f5 .lfa {
  hr {
    border-color: $gray;
  }
  .dwr {
    padding-left: 0;
  }
}

.cnt {
  .lfa {
    p {
      color: $white;
    }
  }
}

.bSe {
  a.gBt {
    color: #636363;
  }
}

//buttons
.far {
  .btn {
    font-weight: bold;
  }
  .btn span, .btn input[type="submit"] {
    text-shadow: none;
  }
}

.f1, .f2 {
  .btn {
    font-size: 26px;
  }
}

.f4, .f5 {
  .btn input {
    font-size: 24px;
  }
}

.f1 {
  .btn {
    span {
      font-weight: bold;
      padding: .6em 3em;
    }
  }
}

.f2 {
  .right {
    text-align: right;
  }
  .btn {
    margin-top: 10%;
    width: 90%;
    span {
      padding: 1em 0;
      width: 100%;
    }
  }
}

.f4 {
  .btn {
    width: 100%;
    span {
      padding: 1em 0;
      width: 100%;
    }
  }
}

.fbt {
  text-transform: capitalize;
}

.btn, .btn > span, .btn input[type="submit"] {
  border-radius: 4px;
  display: inline-block;
}

.btn {
  position: relative;
  overflow: visible; /* removes extra side padding in IE */
  outline: none;
  border: 1px solid #999; /* IE */
  border: rgba(0, 0, 0, 0.2) 1px solid; /* Saf4+, Chrome, FF3.6 */
  border-bottom: rgba(0, 0, 0, 0.4) 1px solid;
  background: -moz-linear-gradient(center top, rgba(255, 255, 255, .1) 0%, rgba(0, 0, 0, .1) 100%);
  background: -webkit-gradient(linear, center bottom, center top, from(rgba(0, 0, 0, .1)), to(rgba(255, 255, 255, .1)));
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  white-space: normal;
  line-height: 1em;
  -ms-filter: "progid: DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')";
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000');
  cursor: pointer;
  -moz-user-select: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  user-select: none;
  margin-bottom: 15px;
}

button::-moz-focus-inner {
  border: none;
}

button.button {
  margin: 0;
  padding: 0;
}

a.button, a.button:hover {
  text-decoration: none;
}

.btn:hover, .btn.hover {
  background: -moz-linear-gradient(center top, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .1) 100%);
  background: -webkit-gradient(linear, center bottom, center top, from(rgba(255, 255, 255, .1)), to(rgba(255, 255, 255, .2)));
  -ms-filter: "progid: DXImageTransform.Microsoft.gradient(startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF')";
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF');
}

.btn:active, .btn.active {
  top: 1px;
  background: -moz-linear-gradient(center top, rgba(0, 0, 0, .1) 0%, rgba(255, 255, 255, .1) 100%);
  background: -webkit-gradient(linear, center bottom, center top, from(rgba(255, 255, 255, .1)), to(rgba(0, 0, 0, .1)));
  -ms-filter: "progid: DXImageTransform.Microsoft.gradient(startColorStr='#19000000', EndColorStr='#19FFFFFF')";
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19000000', EndColorStr='#19FFFFFF');
}

.btn > span, .btn input[type="submit"] {
  position: relative;
  padding: .6em 1.3em;
  border-top: rgba(255, 255, 255, .2) 1px solid;
  color: $white;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .25);
  white-space: normal;
  line-height: 1em;
}

.btn {
  &.small > span {
    font-size: $normalSize * .875;
    padding: 10px 30px;
  }
  &.medium > span, &.medium input[type="submit"] {
    font-size: $normalSize;
    padding: 14px 40px;
  }
  &.big > span, &.big input[type="submit"] {
    font-size: $normalSize * 1.35;
    font-weight: bold;
    padding: 15px 50px;
  }
  &.aligncenter {
    display: table;
    margin: 0 auto 15px;
  }
}

@each $color in $buttonColors {
  .#{nth($color, 1)} {
    &.btn, &.faqC {
      background-color: nth($color, 2);
    }
  }
}

.btn, .faqC {
  &.light {
    color: $black !important;
    span, input[type="submit"] {
      color: #4b4b4b !important;
    }
  }
  &:active {
    position: relative;
    top: 1px;
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  button.btn > span {
    margin-top: -1px;
    margin-right: -2px;
    margin-left: -2px;
  }
}

.center {
  text-align: center;
}

.btn.full {
  width: 100%;
  text-align: center;
}

.focus_submit {
  background: none;
  border-left: none;
  border-right: none;
  border-bottom: none;
  width: 100%;
}

#poststuff #thrive_focus_options #container-focus-preview {
  h1 {
    font-size: $normalSize * 2.250;
    margin: 33px 0 16px;
  }

  h2 {
    color: $white;
    font-size: $normalSize * 1.875;
    font-weight: bold;
    margin: 25px 0 12px;
  }
  .light {
    h2, h3, a {
      color: #3A3A3A;
    }
  }
  h3 {
    border: none;
    color: $white;
    font-size: $normalSize * 1.625;
    margin: 22px 0 11px;
    padding: 0;
  }

  h4 {
    font-size: $normalSize * 1.375;
    margin: 18px 0 9px;
  }

  h5 {
    font-size: $normalSize * 1.125;
    margin: 16px 0 8px;
  }

  h6 {
    font-size: $normalSize * .875;
    margin: 14px 0 7px;
  }
  a {
    color: $white;
    text-decoration: underline;
  }
}