.countdown {
  width: auto !important;
  background:#00000061;
}

#uniqEmailCouponPopup .dotted-top {
	border-top: 6px dotted #d6d0dd;
}

#uniqEmailCouponPopup .dotted-bottom {
	border-bottom: 6px dotted #d6d0dd;
}
#uniqEmailCouponPopup .modal-header {
  border-bottom:none;
}

#uniqEmailCouponPopup .row > div:last-child .uniq-email-coupon-popup-dismiss  {
    position:absolute;
    bottom: 1em;
    right: 1em;
}


#uniqEmailCouponPopup .row > div:last-child p {
  font-size:22px;
}

@media (max-width: 1199px) {
  #uniqEmailCouponPopup .row > div:last-child p {
    font-size:16px;
  }
}

@media (max-width: 576px) {
  #uniqEmailCouponPopup .row > div:last-child p {
    font-size:14px;
  }
}
/*
.ribbon-color-email-coupon {

  font-weight: 800;
  text-shadow: 0px 0px 3px #000000;
  background: url(../images/december_ribbon.jpg) no-repeat center top;
  background-size:100%;
}*/

.ribbon-color-email-coupon {
  text-align:center;
  background: rgb(102,88,165);
background: -moz-linear-gradient(90deg, rgba(102,88,165,1) 0%, rgba(100,95,169,1) 26%, rgba(141,200,116,1) 78%, rgba(141,200,116,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(102,88,165,1) 0%, rgba(100,95,169,1) 26%, rgba(141,200,116,1) 78%, rgba(141,200,116,1) 100%);
background: linear-gradient(90deg, rgba(102,88,165,1) 0%, rgba(100,95,169,1) 26%, rgba(141,200,116,1) 78%, rgba(141,200,116,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6658a5",endColorstr="#8dc874",GradientType=1);
}

.ribbon-color-email-coupon img {
    width:100%;
}

@media (min-width: 1920px) {
  .ribbon-color-email-coupon img {
      width:auto;
      margin-left:auto;
      margin-right:auto;
  }
}

/*@media (max-width: 767px) {
  .ribbon-color-email-coupon {
    background-size:cover !important;
  }
}

.ribbon-color-email-coupon span {
  background:transparent;
}*/

#uniqEmailCouponContent {
  color: #333333;
  background: #58336b;
  /*background-image: radial-gradient(
    circle,
    transparent 50%,
    rgba(0, 0, 0, 0.3)
  );*/
  background: url(../images/temp/glass-globe-background.jpg?t=3) no-repeat center top;
  background-size:100%;
  /*background: url(../images/temp/christmas.jpg);*/
  background-size: cover;
      border-radius: 0.4em;
}



#uniqEmailCouponPopupLabel {
  color: white;
    font-weight: 800;
}


#uniqEmailCouponContent input[name="email"] {
     background: #124c12;
    /* width: 300px; */
    margin-left: auto;
    margin-right: auto;
    color: white;
    border-color: transparent;
}

#uniqEmailCouponContent input[name="email"]:focus, #uniqEmailCouponContent input[name="email"]:hover, #uniqEmailCouponContent .btn:focus, #uniqEmailCouponContent .btn:hover {
  border-color:transparent;
  box-shadow: 0 0 10px 0px white;
}

.uniq-email-coupon-popup-dismiss {
    height: auto !important;
}

#uniqEmailCouponContent .btn {
  background: #dba53c;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
  text-shadow: 0 0 4px #000000;
  margin-left: auto;
  margin-right: auto;
  border: none;
  color: white;
  font-weight:800;
  text-align: center;
  height: 38px;
}

#uniqEmailCouponContent .btn-close {
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
  opacity:1;
}


#uniqEmailCouponContent input[name="email"]::placeholder {
  color: rgba(255,255,255,0.7);
  opacity: 1; /* Firefox */
}

#uniqEmailCouponContent input[name="email"]::-ms-input-placeholder { /* Edge 12 -18 */
  color: rgba(255,255,255,0.7);
}

#shake {
  margin: 1em;
  font-size: 1.5em;
  opacity: 0.5;
  padding: 0.5em 1em;
}

#globe_outside {
  background: url(../images/temp/glass-globe2.png?t=3);
  background-position: center top;
  background-size: 100%;
  width: 300px;
  height: 302px;
  margin-top: 2em;
  margin-bottom: 2em;
  margin-left:auto;
  margin-right:auto;
}

#globe {
  font-size: 1vmin;
  width: 300px;
  height: 260px;
  margin: auto;
  border-radius: 300px 300px 200px 200px;
  overflow: hidden;
  perspective: 10000px;
  perspective-origin: 50% 75%;
  pointer-events: none;
  transform-origin: 50% 120%;
}

@media (max-width: 435px) {
  #globe_outside {
    width: 250px;
    height: 275px;
  }

  #globe {
    font-size: 1vmin;
    width: 250px;
    height: 217px;
    border-radius: 250px 250px 170px 170px;
  }
}

@media (max-width: 310px) {

  #globe_outside {
    width: 200px;
    height: 219px;
  }

  #globe {
    font-size: 1vmin;
    width: 200px;
    height: 177px;
    border-radius: 200px 200px 150px 150px;
  }
}

#globe .result-content div{
  font-size: 120px;
  width: 100%;
  height: 100%;
  border-radius: 300px 300px 200px 200px;
  background: rgb(255,255,255);
background: -moz-radial-gradient(circle, rgba(255,255,255,1) 39%, rgba(143,202,115,0) 100%);
background: -webkit-radial-gradient(circle, rgba(255,255,255,1) 39%, rgba(143,202,115,0) 100%);
background: radial-gradient(circle, rgba(255,255,255,1) 39%, rgba(143,202,115,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#8fca73",GradientType=1);
  font-weight: 800;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #dba53c;
  text-shadow: 0 0 black !important;
}

#globe .result-content div span:first-child {
  font-size: 70px;
}

#globe .result-content div sup {
  font-size: 60px;
  top: -21px;
  left: 0px;
}


@media (max-width: 435px) {
  #globe .result-content div{
    font-size: 100px;
  }

  #globe .result-content div span:first-child {
    font-size: 50px;
  }
  
  #globe .result-content div sup {
    font-size: 40px;
    top: -21px;
    left: -4px;
  }
}




@media (max-width: 310px) {
  #globe .result-content div{
    font-size: 80px;
  }
}


#globe .result-content{
  color: white;
  font-size: 190px;
  position: absolute;
  z-index: 9999;
  top: 0;
  width: 100%;
  text-align: center;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-shadow: 0 0 5px BLACK;

}

@media (max-width: 435px) {
  #globe .result-content{
    font-size: 150px;
  }
}

.flakes {
  position: absolute;
  top: -5rem;
  left: -5rem;
  right: -5rem;
  bottom: -5rem;
  width: auto;
  height: auto;
  text-align: center;
}

.flake {
  position: absolute;
  transform-style: preserve-3d;
  top: -6em;
  width: 0.8em;
  height: 0.8em;
  background: #fff;
  opacity: 0.5;
  transform-origin: 0% 250%;
  border-radius: 40%;
}


@media (max-width: 435px) {
  .flake {
    width: 1.6em;
    height: 1.6em;
  }
}

@media (max-width: 310px) {
  .flake {
    width: 2em;
    height: 2em;
  }
}

/*

#uniqEmailCouponPopup #crackerWrapper{
    cursor: pointer;
    height: 120px;
    width: 586px;
    transform: scaleX(1);
    text-align: center;
  }
  #uniqEmailCouponPopup #message{
    position: absolute;
    width: 100%;
    text-align: center;
    font-family: 'Berkshire Swash', cursive;
    font-size: 30px;
    color: #b81313;
    text-shadow: 3px 3px #fff;
    animation: null;
  }
  @keyframes title{
    from{
      font-size: 30px;
      transform: translate(0px, 0px);
    }
    to{
      font-size: 80px;
      transform: translate(0px, -250px);
    }
  }
  #uniqEmailCouponPopup #jokeWrap{
    width: 326px;
    height: 100px;
    position: absolute;
    top: 10px;
    left: 130px;
    text-align: center;
    animation: null;
  }
  @keyframes joke{
    from{
      opacity: 0;
    }
    to{
      opacity: 1;
    }
  }
  #uniqEmailCouponPopup #leftCracker{
    width: 300px;
    height: 120px;
    animation: null;
  }
  @keyframes left{
    from{
      transform: translate(0px, 0px) rotate(0deg)
    }
    to{
      transform: translate(-140px, 80px) rotate(-30deg)
    }
  }
  
  
  #uniqEmailCouponPopup .end{
    position: relative;
    top: -120px;
    left: 0px;
    height: 120px;
    width: 10px;
    border-radius: 50%;
    background-color: #c48300;
  }
  #uniqEmailCouponPopup .handle{
    position: relative;
    top: 0px;
    left: 5px;
    height: 120px;
    width: 50px;
    background-color: #EEAE2D;
  }
  #uniqEmailCouponPopup .handle2{
    position: relative;
    top: -240px;
    left: 55px;
    border-left: 48px solid #EEAE2D;
    border-top: 27px solid transparent;
    border-bottom: 25px solid transparent;
    height: 120px;
    width: 0;
  }
  #uniqEmailCouponPopup .ring{
    position: relative;
    top: -337px;
    left: 95px;
    height: 76px;
    width: 15px;
    background-color: #244B96;
    border-radius: 3px;
  }
  #uniqEmailCouponPopup .body{
    position: relative;
    top: -437px;
    left: 110px;
    border-right: 20px solid #c48300;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    height: 120px;
    width: 0;
  }
  #uniqEmailCouponPopup .body2{
    position: relative;
    top: -556px;
    left: 130px;
    height: 120px;
    width: 150px;
    background-color: #eda71a;
  }
  #uniqEmailCouponPopup .zigzag{
    position: relative;
    top: -676px;
    left: 260px;
    height: 120px;
    width: 40px;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  
  }
  #uniqEmailCouponPopup .zig1{
    height: 30px;
    width: 30px;
    background-color: #eda71a;
    transform: translate(5px, -14px) rotate(45deg);
  }
  #uniqEmailCouponPopup #rightCracker{
    position: relative;
    top: -120px;
    left: 286px;
    width: 300px;
    height: 120px;
    transform: rotate(180deg);
    animation: null;
  }
  @keyframes right{
    from{
      transform: translate(0px, 0px) rotate(180deg)
    }
    to{
      transform: translate(140px, 80px) rotate(210deg)
    }
  }
  #uniqEmailCouponPopup #rightCracker > .zigzag .zig1{
    height: 30px;
    width: 30px;
    background-color: #eda71a;
    transform: translate(5px, -1px) rotate(45deg);
  }
  
  #uniqEmailCouponPopup .instructions{
    position: absolute;
    top: calc(50% + 150px);
  }*/