@font-face {
  font-family: "Montserrat-Bold";
  font-weight: sans-serif;
  src: url("../fonts/Montserrat-Bold/Montserrat-Bold.eot");
  src: url("../fonts/Montserrat-Bold/Montserrat-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Bold/Montserrat-Bold.woff") format("woff"), url("../fonts/Montserrat-Bold/Montserrat-Bold.ttf") format("truetype"), url("../fonts/Montserrat-Bold/Montserrat-Bold.svg#Montserrat-Bold") format("svg"); }

@font-face {
  font-family: "Montserrat-Regular";
  font-weight: sans-serif;
  src: url("../fonts/Montserrat-Regular/Montserrat-Regular.eot");
  src: url("../fonts/Montserrat-Regular/Montserrat-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Montserrat-Regular/Montserrat-Regular.woff") format("woff"), url("../fonts/Montserrat-Regular/Montserrat-Regular.ttf") format("truetype"), url("../fonts/Montserrat-Regular/Montserrat-Regular.svg#Montserrat-Regular") format("svg"); }

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit; }

* {
  margin: 0;
  padding: 0;
  display: block;
  overflow: visible;
  cursor: pointer;
  color: white;
  font-family: 'Montserrat-Regular';
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

#wrapper {
  border: 1px solid white;
  background-color: #00acec;
  position: relative; }
  #wrapper #logo {
    z-index: 999;
    position: absolute; }
  #wrapper .frame {
    position: absolute;
    top: 1px;
    left: 1px;
    background-size: cover;
    background-position: 50%;
    opacity: 0; }
    #wrapper .frame#frame_0 {
      opacity: 1; }
      #wrapper .frame#frame_0 .copy {
        opacity: 1; }
    #wrapper .frame br {
      line-height: 0.3em; }
    #wrapper .frame#frame_1 .copy {
      text-align: center; }
    #wrapper .frame .copy {
      position: absolute;
      -webkit-filter: blur(0px) !important;
      -ms-filter: blur(0px) !important;
      -moz-filter: blur(0px) !important;
      filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='blur'><feGaussianBlur stdDeviation='0' /></filter></svg>#blur");
      filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='0');
      -moz-transition: filter 0.6s ease-in;
      -o-transition: filter 0.6s ease-in;
      -webkit-transition: filter 0.6s ease-in;
      transition: filter 0.6s ease-in; }
      #wrapper .frame .copy.blur {
        -webkit-filter: blur(5px) !important;
        -ms-filter: blur(5px) !important;
        -moz-filter: blur(5px) !important;
        filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='blur'><feGaussianBlur stdDeviation='5' /></filter></svg>#blur");
        filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='5'); }
      #wrapper .frame .copy .copy1, #wrapper .frame .copy .copy2 {
        position: absolute; }
      #wrapper .frame .copy .copy1 {
        text-align: right; }
      #wrapper .frame .copy .copy2 {
        text-align: left;
        background: red; }
    #wrapper .frame .icon {
      position: absolute; }
    #wrapper .frame .title {
      position: absolute;
      font-family: 'Montserrat-Bold';
      line-height: 1em;
      text-transform: uppercase; }
      #wrapper .frame .title span {
        font-size: 80%;
        font-weight: bold;
        line-height: 1em;
        text-transform: uppercase; }
        #wrapper .frame .title span span {
          font-size: 50%;
          font-weight: initial;
          line-height: 1.5em; }
      #wrapper .frame .title font {
        display: inline-block;
        text-transform: lowercase;
        font-size: 60%;
        margin-right: 0.4em; }
    #wrapper .frame .price {
      position: absolute;
      letter-spacing: -0.04em;
      line-height: 0.8em;
      font-family: 'Montserrat-Bold';
      text-align: center; }
      #wrapper .frame .price span {
        display: inline-block;
        line-height: initial;
        vertical-align: top; }
        #wrapper .frame .price span.pre {
          font-size: 25%;
          margin-right: 0.1em; }
        #wrapper .frame .price span.post {
          font-size: 24px; }
    #wrapper .frame .cta {
      position: absolute; }
      #wrapper .frame .cta span {
        background-color: #006643;
        border: 1px solid white;
        font-family: 'Montserrat-Bold';
        text-align: center;
        text-transform: uppercase; }
        #wrapper .frame .cta span:hover {
          background-color: white;
          border: 1px solid #006643;
          color: #006643; }
    #wrapper .frame .disclaimer {
      position: absolute;
      display: inline-block;
      color: white; }
      #wrapper .frame .disclaimer span {
        font-size: 70%;
        margin-top: 0.5em;
        color: white; }

/*----------------------------------*/
/* BANNER AD CONFIGURABLE VARIABLES
/*----------------------------------*/
#wrapper {
  width: 300px;
  height: 250px; }
  #wrapper #logo {
    top: 8%;
    left: 41%;
    width: 37%; }
    #wrapper #logo.routeShown {
      top: 5%;
      left: 5%;
      width: 32%; }
  #wrapper .frame {
    width: 300px;
    height: 250px; }
    #wrapper .frame .copy {
      top: 23%;
      bottom: 0;
      left: 0;
      width: 298px;
      padding-left: 10px;
      padding-right: 10px; }
      #wrapper .frame .copy .copy1 {
        font-size: 1em;
        top: 11%;
        left: 3%;
        width: 28%;
        height: 35%; }
      #wrapper .frame .copy .copy2 {
        font-size: 2.3em;
        top: 8%;
        left: 35%;
        width: 60%;
        height: 40px;
        line-height: 40px; }
    #wrapper .frame .icon {
      top: 3%;
      left: 21%;
      width: 15%; }
      #wrapper .frame .icon.routeShown {
        top: 29%;
        left: auto;
        right: 2px;
        width: 38%; }
    #wrapper .frame .title {
      left: 4%;
      width: 34%;
      height: 30%;
      top: 6%;
      text-align: right; }
      #wrapper .frame .title span {
        display: inline-block;
        font-size: inherit; }
        #wrapper .frame .title span span {
          font-size: 27%;
          display: block; }
      #wrapper .frame .title.routeShown {
        top: 15%;
        left: 5%;
        width: 90%;
        height: 11%;
        text-align: left; }
        #wrapper .frame .title.routeShown span {
          display: inline-block;
          font-size: inherit;
          margin-left: 0.35em;
          vertical-align: baseline; }
          #wrapper .frame .title.routeShown span span {
            font-size: 40%;
            display: block;
            position: absolute;
            left: 0;
            margin-left: 0em; }
    #wrapper .frame .price {
      top: 6%;
      right: 6%;
      width: 51%;
      height: 43%; }
      #wrapper .frame .price span.post {
        font-size: 18px; }
      #wrapper .frame .price.routeShown {
        top: 33%;
        left: 5%;
        width: 52%;
        height: 32%;
        text-align: left; }
    #wrapper .frame .cta {
      top: 62%;
      left: 14%;
      width: 72%;
      height: 13%; }
      #wrapper .frame .cta span {
        display: inline-block;
        padding: 5px;
        margin-right: 5%;
        width: 45%; }
      #wrapper .frame .cta img {
        display: inline-block;
        vertical-align: middle;
        width: 50%; }
      #wrapper .frame .cta.discountNotShown {
        font-size: 15px !important; }
        #wrapper .frame .cta.discountNotShown span {
          margin-left: 23%;
          margin-right: 0%;
          padding: 7px;
          width: 55%;
          display: block; }
    #wrapper .frame .disclaimer {
      bottom: 3.5%;
      left: 4%;
      width: 92%;
      height: 15%;
      text-align: center; }
      #wrapper .frame .disclaimer br {
        display: none; }