/*
 * The Typekit service used to deliver this font or fonts for use on websites
 * is provided by Adobe and is subject to these Terms of Use
 * http://www.adobe.com/products/eulas/tou_typekit. For font license
 * information, see the list below.
 *
 * neue-haas-grotesk-display:
 *   - http://typekit.com/eulas/00000000000000003b9b204a
 *   - http://typekit.com/eulas/00000000000000003b9b204c
 *
 * © 2009-2019 Adobe Systems Incorporated. All Rights Reserved.
 */
/*{"last_published":"2019-04-01 17:42:48 UTC"}*/

/*@import url("https://p.typekit.net/p.css?s=1&k=lri8kss&ht=tk&f=39498.39500&a=20570886&app=typekit&e=css");*/

/*@font-face {
font-family:"grotesk";
src:url("https://use.typekit.net/af/8a200c/00000000000000003b9b204a/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff2"),
url("https://use.typekit.net/af/8a200c/00000000000000003b9b204a/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff"),
url("https://use.typekit.net/af/8a200c/00000000000000003b9b204a/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("opentype");
font-style:normal;
font-weight:600;
}

@font-face {
font-family:"grotesk_75";
src:url("https://use.typekit.net/af/d562ce/00000000000000003b9b204c/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),
url("https://use.typekit.net/af/d562ce/00000000000000003b9b204c/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),
url("https://use.typekit.net/af/d562ce/00000000000000003b9b204c/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-style:normal;font-weight:700;
}
*/
/*
@font-face {
  font-family: grotesk;
  src: url("../fonts/NHaasGroteskDSStd-65Md.otf");
}

@font-face {
  font-family: grotesk_75;
  src: url("../fonts/NHaasGroteskDSStd-75Bd.otf");
}
*/
* {
    box-sizing: border-box;
}

body {
    font-family: sans-serif;
    cursor: pointer;
    line-height: 15px;
}

ft-dynamic img{
    width:inherit;
    height:auto;
}

#destroy {
    display: none;
}

.ad {
    position: absolute;
    opacity: 0;
    overflow: hidden;
    border: 1px solid black;
    width: 300px;
    height: 600px;

    background-color: white;
}

.container {
    position: absolute;
}

#secondFrameLogo {
    width: 300px;
    height: 600px;
    top: -1px;
    left: -1px;
    text-align: center;
    position: relative;
    z-index: 9;
    pointer-events: none;
}

.secongFrameCarousel {
    text-align: center;
}

#secondFrameHeadline {
    position: absolute;
    top: 25px;
    width: 300px;
    font-family: Arial, sans-serif, "Courier New";
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 12px;
    z-index: 9;
    pointer-events: none;
    font-weight: bold;
    text-align: center;
}

#cta {
      position: relative;
      top: -107px;
      left: 1px;
      z-index: 7;
      font-family: Arial, sans-serif, "Courier New";
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-align: center;
      font-size: 11px;
      font-weight: 600;
      /* padding: 6px 15px 6px 16px; */
      padding-top: 7px;
      padding-bottom: 5px;
      padding-left: 16.45px;
      padding-right: 15px;
      letter-spacing: .2em;
      word-spacing: em;
      background-color: black;
      display: inline-block;
      /* opacity: 0.5; */
}

#firstFrame {
    cursor: pointer;
    position: absolute;
    z-index: 9999;
    width: 300px;
    height: 600px;
    top: -1px;
    left: -1px;
    overflow: hidden;
}

#firstFrameLogo {
    left: -1px;
    top: -1px;
    position: absolute;
    width: 300px;
    height: 600px;
    z-index: 99999;
}

#firstFrameLogo img {
    width: 300px;
    height: 600px;
}

#firstFrameContainer {
    position: absolute;
    width: 300px;
    height: 600px;
    z-index: 99999;
    text-align: center;
}

#firstFrameCTA {
    position: relative;
    z-index: 999999;
    font-family: Arial, sans-serif, "Courier New";
    -webkit-font-smoothing: antialiased;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
    padding: 8.5px 18.5px 7px 22.5px;
    letter-spacing: 1.4px;
    /* background: white; */
    border: white 1px solid;
    display: inline-block;
}

#firstFrameHeadline {
    position: absolute;
    width: 300px;
    text-align: center;
    color: white;
    z-index: 9999;
    font-family: Arial, sans-serif, "Courier New";
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 12px;
    letter-spacing: 1.9px;
}

#headline2 {
    position: absolute;
    width: 300px;
    color: black;
    z-index: 9999;
    font-family: Arial, sans-serif, "Courier New";
/*    font-size: 9px;
    */
        font-size: 8.5px;
    letter-spacing: 1.55px;
}

#frame2bgimge {
    position: absolute;
}

.titles {
    position: absolute;
    font-family: Arial, sans-serif, "Courier New";
    /* font-weight: bold; */
    font-size: 12px;
    width: 130px;
    height: 45px;
    letter-spacing: 1.25px;
    line-height: 15.5px;
    z-index: 9;
    pointer-events: none;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
    /* display: none; */
}

.prices {
    position: absolute;
    font-family: Arial, sans-serif, "Courier New";
    /* font-weight: bold; */
    font-size: 10px;
    width: 100px;
    height: 20px;
    line-height: 15.5px;
    letter-spacing: 1.35px;
    z-index: 9;
    pointer-events: none;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
}

.transition_transform {
    -webkit-transition: transform 0.3s ease-in-out;
    -moz-transition: transform 0.3s ease-in-out;
    -o-transition: transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
}

.inactive {
    opacity: 0;
}

.active {
    opacity: 1;
}

.carousel_frame {
    justify-content: center;
    flex-direction: column;
    align-items: center;
    display: flex;
    float: left;
}

.frame_image {
    max-height: 390px;
    max-width: 300px;
    position: relative;
    top: -18px;
    background-color: black;
}

.navigation_pagination {
    position: absolute;
    border-radius: 10px;
    left: 24px;
    bottom: 10px;
    width: 76px;
    height: 20px;
    cursor: pointer;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

#paginationPosition {
    z-index: 1002;
}

.paginationIcon {
    width: 8px;
    height: 8px;
    border-radius: 10px;
    /*background-color: #80b3cb;*/
    border: 1px solid #6b6b6b;
    display: table;
    margin: 0 auto;
    transform: scale(0.9);
}

.paginationIconDiv {
    position: relative;
    /*border: 1px solid #6b6b6b;*/
    /*    display: inline-block;*/
    /*    width: 15px;*/
    /*    height: 20px;*/
    justify-content: center;
    flex-direction: column;
    align-items: center;
    display: flex;
    float: left;
}

.prodMedium {
    transform: scale(0.7);
}

.prodSmall {
    transform: scale(0.5);
}

.prodCenter {
    background-color: #ffffff;
    transform: scale(0.9);
}

.prodRight {
    background-color: #80b3cb;
    /*    transform: scale(1);*/
}

.prodLeft {
    background-color: #80b3cb;
    /*    transform: scale(1);*/
}

#paginationContainer {
    transform: translate(10px, 0px);
    transition: all 0.5s ease;
}


.clickThrough0 {
    position: absolute;
    width: 300px;
    height: 600px;
    opacity: 0.5;
    z-index: 99;
    top: -64px;
    cursor: pointer;
}

.clickThrough1 {
    position: absolute;
    width: 300px;
    height: 600px;
    z-index: 99;
    opacity: 0.5;
    cursor: pointer;
    top: -64px;
}

.clickThrough2 {
    position: absolute;
    width: 300px;
    height: 600px;
    z-index: 99;
    opacity: 0.5;
    cursor: pointer;
    top: -64px;
}

.static-banner {
    position: absolute;
    font-size: 26px;
    background: white;
    width: 164px;
    left: 134px;
    background-position-x: -132px !important;
    background-position-y: 3px !important;
    height: 600px;
    top: -3px;
    z-index: 2;
    pointer-events: none;
}

.static-banner1 {
    left: 10px;
    top: 10px;

}

#feedFailimage {
    position: absolute;
}

.image_class {
    position: relative;
    max-width: 110px;
    max-height: 173px;
    /*left: 6%;*/
}


#hotSpot {
    position: absolute;
    width: 300px;
    height: 600px;
    z-index: 8;
    top: -1px;
    left: -1px;
}

.pagination_icon {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 1px solid #6b6b6b;
    margin: 0 4px;
    border-radius: 50%;
    opacity: 0.55;
}

.selected {
    background-color: black;
    opacity: 1;
}

.clicktag_div {
    position: absolute;
    top: -1px;
    left: -1px;
    width: 300px;
    height: 600px;
}

.pagination_icon_holder{
    display: inline-block;
}

#guide{
  width: 300px;
height: 600px;
position: absolute;
top: 0px;
left: 0px;
opacity: 0.5;
background-image: url("../images/300x600_guide.jpg");
}









@-moz-document url-prefix() {
    #firstFrameCTA {
        letter-spacing: 1.25px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

}
