@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: 600px; }
  #wrapper #logo {
    top: 3%;
    left: 25%;
    width: 50%; }
  #wrapper .frame {
    width: 300px;
    height: 600px; }
    #wrapper .frame .copy {
      top: 14%;
      bottom: 0;
      left: 0;
      width: 295px;
      padding-left: 10px;
      padding-right: 10px; }
      #wrapper .frame .copy .copy1 {
        margin-top: 50px;
        font-size: 1.3em; }
      #wrapper .frame .copy .copy2 {
        font-size: 2.2em;
        height: 50px; }
      #wrapper .frame .copy .copy1, #wrapper .frame .copy .copy2 {
        position: relative;
        text-align: center; }
    #wrapper .frame .icon {
      top: 49%;
      left: 25%;
      width: 50%; }
      #wrapper .frame .icon.routeShown {
        top: 54%; }
    #wrapper .frame .title {
      left: 10%;
      width: 80%;
      height: 10%; }
      #wrapper .frame .title span span {
        font-size: 30%; }
      #wrapper .frame .title.routeShown {
        height: 15%; }
    #wrapper .frame .price {
      top: 12%;
      left: 10%;
      width: 80%;
      height: 23%;
      text-align: center; }
      #wrapper .frame .price.routeShown {
        top: 27%; }
    #wrapper .frame .cta {
      top: 78%;
      left: 25%;
      width: 50%;
      height: 14%; }
      #wrapper .frame .cta span {
        padding: 10px;
        margin-bottom: 10px;
        width: 100%; }
      #wrapper .frame .cta img {
        margin-left: 15%;
        width: 70%; }
      #wrapper .frame .cta.routeShown {
        top: 79%;
        left: 10%;
        width: 80%;
        height: 7%; }
        #wrapper .frame .cta.routeShown span {
          padding: 8px;
          margin-bottom: 0px;
          width: 55%;
          display: inline-block; }
        #wrapper .frame .cta.routeShown img {
          margin-left: 5%;
          width: 40%;
          display: inline-block;
          vertical-align: middle; }
        #wrapper .frame .cta.routeShown.discountNotShown {
          font-size: 18px !important; }
          #wrapper .frame .cta.routeShown.discountNotShown span {
            margin-left: 23%;
            padding: 7px;
            display: block; }
    #wrapper .frame .disclaimer {
      left: 15%;
      bottom: 2%;
      width: 70%;
      height: 6%;
      text-align: center; }
      #wrapper .frame .disclaimer br {
        display: none; }