@import "bourbon";

@mixin roboto {
  font-family: 'Roboto', sans-serif;
}

@mixin robotoslab {
  font-family: 'Roboto Slab', serif;
}

@mixin clearfix {
  &:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
  }
}

@font-face {
  font-family: 'tve-leads-fifteen-set-icons';
  src: url('fonts/fifteen_set/fifteen_set_icons.eot?kbj5hd');
  src: url('fonts/fifteen_set/fifteen_set_icons.eot?#iefixkbj5hd') format('embedded-opentype'),
  url('fonts/fifteen_set/fifteen_set_icons.woff?kbj5hd') format('woff'),
  url('fonts/fifteen_set/fifteen_set_icons.ttf?kbj5hd') format('truetype'),
  url('fonts/fifteen_set/fifteen_set_icons.svg?kbj5hd#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

$white: #fff;
$black: #000;

[class*='fifteen_set'] {
  @include clearfix();
  &.tve_gray_bg {
    background-image: none;
    background: #c2c2c2;
  }
}

#tve_fifteen_set {
  [class*='fifteen_set'] {
    h2 {
      .bold_text {
        color: #1bf3f0;
      }
    }
    .tve-screen-filler-close {
      border-radius: 50%;
      border: 1px solid #7c7c80;
      background: transparent;
      color: #7c7c80;
      display: block;
      font-size: 25px;
      font-family: Verdana, Geneva, sans-serif;
      height: 26px;
      line-height: 20px;
      position: absolute;
      top: 20px;
      right: 20px;
      text-align: center;
      text-decoration: none;
      width: 26px;
    }
    .tve_editor_main_content {
      margin-left: auto;
      margin-right: auto;
      max-width: 790px;
    }
    a {
      color: inherit;
    }
    h2 {
      @include robotoslab();
      color: #fff;
      font-weight: 300;
      font-size: 60px;
      line-height: 1.333em;
      letter-spacing: normal;
      .bold_text {
        font-weight: 400;
      }
    }
    h3 {
      @include roboto();
      color: #fff;
      font-weight: 700;
      font-size: 36px;
      line-height: 1.667em;
      letter-spacing: normal;
    }
    h5 {
      @include roboto();
      color: #fff;
      font-weight: 300;
      font-size: 28px;
      line-height: 1.429em;
      letter-spacing: normal;
      .bold_text {
        font-weight: 500;
      }
    }
    p {
      color: #666666;
      font-size: 24px;
      line-height: 1.417em;
      letter-spacing: normal;
      margin-bottom: 20px;
    }
    .bold_text {
      font-weight: 600;
    }
    h2, h3, h5 {
      clear: none;
      padding-bottom: 0;
    }
  }
  .tve_fifteen_set_vms_step1 {
    h2 {
      .bold_text {
        color: #1dc7c5;
      }
    }
    .tve_editor_main_content {
      max-width: 1130px;
    }
  }
  .tve_fifteen_set_vms_step2 {
    .tve_cb5 {
      .tve_cb_cnt {
        padding: 40px 60px;
      }
    }
  }
  .tve_fifteen_set_vms_step3, .tve_fifteen_set_vms_step4 {
    p {
      font-weight: 100;
    }
  }
}

#tve_fifteen_set {
  @include robotoslab();
  text-shadow: none;
  article {
    padding-bottom: 0;
  }
  .tve_sep1 {
    border-top: 1px solid rgba(#fff, .32);
  }
  .tve_colm {
    position: relative;
  }
  .image_set15_ad {
    position: absolute;
    top: 35px;
    right: -49px;
  }
  .tve_cb5 {
    border-radius: 40px;
    .tve_cb_cnt {
      padding: 40px 60px;
    }
    p {
      text-shadow: none;
      color: #fff;
      font-weight: 100;
      .bold_text {
        font-weight: 400;
      }
    }
  }
  .tve_cb_symbol {
    background: none;
    -webkit-perspective: 150px;
    perspective: 150px;
    .tve_cb_cnt {
      padding-bottom: 0;
    }
    &.tve_sb_bot {
      > .thrv_cb_text {
        &.aligncenter {
          @include transform(translate(-50%, 0) rotateY(25deg));
        }
        &.alignright {
          @include transform(translate(-100%, 0) rotateY(25deg));
        }
        &.alignleft {
          @include transform(translate(0%, 0) rotateY(25deg));
        }
      }
    }
    > .thrv_cb_text {
      border-radius: 0;
      border: 0;
      .tve_sc_text {
        font-size: 18px;
        height: auto;
      }
      &.aligncenter {
        left: 50%;
        display: inline-block;
        @include transform(translate(-50%, 0) rotateY(25deg));
      }
      &.alignright {
        @include transform(translate(-100%, 0) rotateY(25deg));
      }
      &.alignleft {
        @include transform(translate(0, 0) rotateY(25deg));
      }
      span.tve_sc_text {
        border-radius: 0;
      }
    }
  }
  .tve_brdr_solid.thrv_icon {
    border-radius: 300px;
    border-color: #fff;
    border-width: 6px;
    span.tve_sc_icon {
      border-radius: 300px;
      padding: 30px;
    }
  }
  .thrv_button_shortcode {
    .tve_btn.tve_btn3 {
      &:hover {
        background: none;
        border-color: #fff;
      }
      &:active {
        background: rgba(#000, .2);
      }
    }
  }
  .tve_btn.tve_btn3 {
    border-radius: 100px;
    @include robotoslab();
    color: $white;
    font-weight: 400;
    &.tve_normalBtn {
      .tve_btnLink {
        font-size: 20px;
      }
    }
    .tve_btnLink {
      text-shadow: none;
    }
    &.tve_white {
      a {
        span {
          color: #4b4b4b;
        }
      }
    }
  }
  .thrv_lead_generation {
    .tve_submit_container {
      button {
        &:hover {
          background: none;
          border-color: #fff;
        }
        &:active {
          background: rgba(#000, .2);
        }
      }
    }
    &.tve_white {
      button {
        color: #fff;
      }
    }
    button {
      border-radius: 100px;
      @include robotoslab();
      text-shadow: none;
      box-shadow: none;
      color: $white;
      font-weight: 400;
      font-size: 22px;
      line-height: 38px;
      padding: 16px 10px;
    }
    input[type="text"], input[type="email"] {
      border-radius: 100px;
      @include robotoslab();
      box-shadow: 0 2px 0 0 #666666;
      background: rgba(#000, .23);
      border: 0;
      color: #5f5f62;
      font-size: 20px;
      font-weight: 400;
      height: auto;
      line-height: 28px;
      margin-bottom: 20px;
      padding: 20px !important;
      &:focus {
        box-shadow: 0 2px 0 0 #666666;
        background: rgba(#000, .54);
        color: #cccccc;
      }
    }
  }
}

$color-pallete: 'blue' #4c58a1 #4c58a1,
'black' #131313 #131313,
'green' #628520 #628520,
'white' #ffffff #ffffff,
'orange' #acac94 #acac94,
'purple' #5a2364 #5a2364,
'red' #811515 #811515,
'teal' #1dc7c5 #1bf3f0;

@each $color in $color-pallete {
  #tve_fifteen_set {
    .thrv-leads-screen-filler.tve_#{nth($color, 1)} {
      background-color: nth($color, 2);
    }
    .tve_cb5.tve_#{nth($color, 1)} {
      background: rgba(nth($color, 2), .07);
    }
    .tve_btn.tve_btn3.tve_#{nth($color, 1)} {
      background: nth($color, 2);
      border: 2px solid nth($color, 2);
    }
    .thrv_lead_generation.tve_#{nth($color, 1)} {
      input[type="text"], input[type="email"] {
        &:hover {
          box-shadow: 0 2px 0 0 nth($color, 2);
        }
      }
      button {
        background: nth($color, 2);
        border: 2px solid nth($color, 2);
      }
    }
    .tve_cb_symbol.tve_#{nth($color, 1)} {
      .tve_sc_text {
        background: nth($color, 2);
      }
    }
    #tve_editor {
      .thrv_icon {
        span.tve_sc_icon.tve_#{nth($color, 1)} {
          color: nth($color, 3);
        }
      }
    }
  }
}

[class^="fifteen-set"], [class*=" fifteen-set"] {
  color: inherit;
  font-family: 'tve-leads-fifteen-set-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fifteen-set-icon-sixpack:before {
  content: "\e601";
}

.fifteen-set-icon-burnfat:before {
  content: "\e600";
}

.fifteen-set-icon-getstrong:before {
  content: "\e603";
}

@import "_responsive";

@media only screen and (max-width: 940px) {
  #tve_fifteen_set {
    [class*="tve_fifteen_set_vms"] {
      .image_set15_ad {
        display: none;
      }
      .tve_cb5 {
        .tve_cb_cnt {
          padding: 10px;
        }
      }
    }
  }
}