.sprite-refresh-blue,
.sprite-refresh-orange,
.sprite-recharge-arrow,
.sprite-facebook,
.sprite-popup-close,
.sprite-payment-transfer,
.sprite-payment-paypal,
.sprite-payment-cards,
.sprite-wof-point,
.sprite-maskot,
.sprite-wof-off,
.sprite-wof-on,
.sprite-wof-yellow-on,
.sprite-wof-white-on,
.sprite-wof-background,
.sprite {
  background-image: url("../img/wheelOfFortune/sprite.png?1600");
  position: relative;
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
}
.sprite-refresh-blue {
  width: 19px;
  height: 19px;
  background-position: -5px -5px;
}
.sprite-refresh-orange {
  width: 19px;
  height: 19px;
  background-position: -5px -34px;
}
.sprite-recharge-arrow {
  width: 326px;
  height: 20px;
  background-position: -5px -63px;
}
.sprite-facebook {
  width: 24px;
  height: 25px;
  background-position: -5px -93px;
}
.sprite-popup-close {
  width: 27px;
  height: 27px;
  background-position: -5px -128px;
}
.sprite-payment-transfer {
  width: 80px;
  height: 35px;
  background-position: -5px -165px;
}
.sprite-payment-paypal {
  width: 80px;
  height: 35px;
  background-position: -5px -210px;
}
.sprite-payment-cards {
  width: 80px;
  height: 35px;
  background-position: -5px -255px;
}
.sprite-wof-point {
  width: 120px;
  height: 132px;
  background-position: -5px -300px;
}
.sprite-maskot {
  width: 224px;
  height: 262px;
  background-position: -5px -442px;
}
.sprite-wof-off {
  width: 470px;
  height: 470px;
  background-position: -5px -714px;
}
.sprite-wof-on {
  width: 470px;
  height: 470px;
  background-position: -5px -1194px;
}
.sprite-wof-yellow-on {
  width: 470px;
  height: 470px;
  background-position: -5px -1674px;
}
.sprite-wof-white-on {
  width: 470px;
  height: 470px;
  background-position: -5px -2154px;
}
.sprite-wof-background {
  width: 470px;
  height: 470px;
  background-position: -5px -2634px;
}
.columns.lg-2 > .column-wider {
  width: 53%;
}
.columns.lg-2 > .column-thiner {
  width: 47%;
}
.columns.lg-2 > .column-wide {
  width: 63%;
}
.columns.lg-2 > .column-thin {
  width: 37%;
}
.columns {
  font-size: 0;
}
.columns > [class^="column"] {
  font-size: 14px;
}
.columns-no-space {
  margin: 0 !important;
}
.columns-no-space > [class^="column"] {
  padding: 0 !important;
}
.columns-large-space {
  margin: 0 -50px !important;
}
.columns-large-space > [class^="column"] {
  padding: 0 50px !important;
}
.columns-small-space {
  margin: 0 -8px !important;
}
.columns-small-space > [class^="column"] {
  padding: 0 8px !important;
}
@media screen {
  .columns.xs-1,
  .columns.xs-2,
  .columns.xs-3,
  .columns.xs-4,
  .columns.xs-5,
  .columns.xs-6 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .columns.xs-1 > [class^="column"],
  .columns.xs-2 > [class^="column"],
  .columns.xs-3 > [class^="column"],
  .columns.xs-4 > [class^="column"],
  .columns.xs-5 > [class^="column"],
  .columns.xs-6 > [class^="column"] {
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    /**display: inline;*/
    /**zoom: 1;*/
    vertical-align: top;
  }
  .columns.xs-1 > .column {
    width: 100%;
  }
  .columns.xs-2 > .column {
    width: 49.998000000000005%;
  }
  .columns.xs-3 > .column {
    width: 33.332%;
  }
  .columns.xs-4 > .column {
    width: 24.999000000000002%;
  }
  .columns.xs-5 > .column {
    width: 20%;
  }
  .columns.xs-6 > .column {
    width: 16.666%;
  }
  .xs-invisible {
    display: none !important;
  }
  .xs-sm-visible {
    display: none !important;
  }
  .xs-md-visible {
    display: none !important;
  }
  .xs-lg-visible {
    display: none !important;
  }
}
@media screen {
  .columns.sm-1,
  .columns.sm-2,
  .columns.sm-3,
  .columns.sm-4,
  .columns.sm-5,
  .columns.sm-6 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .columns.sm-1 > [class^="column"],
  .columns.sm-2 > [class^="column"],
  .columns.sm-3 > [class^="column"],
  .columns.sm-4 > [class^="column"],
  .columns.sm-5 > [class^="column"],
  .columns.sm-6 > [class^="column"] {
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    /**display: inline;*/
    /**zoom: 1;*/
    vertical-align: top;
  }
  .columns.sm-1 > .column {
    width: 100%;
  }
  .columns.sm-2 > .column {
    width: 49.998000000000005%;
  }
  .columns.sm-3 > .column {
    width: 33.332%;
  }
  .columns.sm-4 > .column {
    width: 24.999000000000002%;
  }
  .columns.sm-5 > .column {
    width: 20%;
  }
  .columns.sm-6 > .column {
    width: 16.666%;
  }
  .sm-invisible {
    display: none !important;
  }
  .sm-md-visible {
    display: none !important;
  }
  .sm-lg-visible {
    display: none !important;
  }
}
@media screen {
  .columns.md-1,
  .columns.md-2,
  .columns.md-3,
  .columns.md-4,
  .columns.md-5,
  .columns.md-6 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .columns.md-1 > [class^="column"],
  .columns.md-2 > [class^="column"],
  .columns.md-3 > [class^="column"],
  .columns.md-4 > [class^="column"],
  .columns.md-5 > [class^="column"],
  .columns.md-6 > [class^="column"] {
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    /**display: inline;*/
    /**zoom: 1;*/
    vertical-align: top;
  }
  .columns.md-1 > .column {
    width: 100%;
  }
  .columns.md-2 > .column {
    width: 49.998000000000005%;
  }
  .columns.md-3 > .column {
    width: 33.332%;
  }
  .columns.md-4 > .column {
    width: 24.999000000000002%;
  }
  .columns.md-5 > .column {
    width: 20%;
  }
  .columns.md-6 > .column {
    width: 16.666%;
  }
  .md-invisible {
    display: none !important;
  }
  .md-lg-visible {
    display: none !important;
  }
}
@media screen {
  .columns.lg-1,
  .columns.lg-2,
  .columns.lg-3,
  .columns.lg-4,
  .columns.lg-5,
  .columns.lg-6 {
    margin-left: -5px;
    margin-right: -5px;
  }
  .columns.lg-1 > [class^="column"],
  .columns.lg-2 > [class^="column"],
  .columns.lg-3 > [class^="column"],
  .columns.lg-4 > [class^="column"],
  .columns.lg-5 > [class^="column"],
  .columns.lg-6 > [class^="column"] {
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    /**display: inline;*/
    /**zoom: 1;*/
    vertical-align: top;
  }
  .columns.lg-1 > .column {
    width: 100%;
  }
  .columns.lg-2 > .column {
    width: 49.998000000000005%;
  }
  .columns.lg-3 > .column {
    width: 33.332%;
  }
  .columns.lg-4 > .column {
    width: 24.999000000000002%;
  }
  .columns.lg-5 > .column {
    width: 20%;
  }
  .columns.lg-6 > .column {
    width: 16.666%;
  }
  .lg-invisible {
    display: none !important;
  }
}
.box-recharge {
  background: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  margin-bottom: 10px;
  text-align: center;
  overflow: hidden;
  position: relative;
}
.box-recharge-title {
  background: #3F51B5;
  color: #fff;
  padding: 20px 20px 10px;
  -webkit-border-radius: 10px 10px 0 0;
  border-radius: 10px 10px 0 0;
  position: relative;
}
.box-recharge-title > span {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: -1px;
}
.box-recharge-inner {
  padding: 40px 30px 30px;
}
.box-price {
  background: #fff;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  margin-bottom: 10px;
  text-align: center;
  overflow: hidden;
  display: block;
  text-decoration: none !important;
  position: relative;
}
.box-price-counter {
  display: block;
  background: #00a7e1;
  width: 100px;
  height: 100px;
  color: #fff;
  -webkit-border-radius: 100px;
  border-radius: 100px;
  position: absolute;
  font-size: 12px;
  bottom: -55px;
  right: -55px;
  padding: 20px 0 0 20px;
  -webkit-transition: background 0.2s ease-in-out;
  transition: background 0.2s ease-in-out;
}
.box-price-counter span {
  position: absolute;
  top: 0;
  left: 0;
  width: 45px;
  height: 45px;
  line-height: 45px;
  display: block;
  padding: 5px 0 0 5px;
}
.box-price img {
  max-width: 100%;
}
.box-price h2 {
  padding: 15px;
  text-transform: none;
  font-size: 16px;
  font-family: 'Baloo', cursive;
  line-height: 1.5em;
  margin-bottom: 0;
  -webkit-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}
.box-price h2 small {
  font-size: 11px;
  font-weight: normal;
  line-height: 1.1em;
  display: block;
}
.box-price:hover h2 {
  color: #ff7a04;
}
.box-price:hover .box-price-counter {
  background: #ff7a04;
}
.btn2 {
  display: inline-block;
  background-image: -webkit-linear-gradient(270deg, #11c6f8, #0083b5);
  background-image: linear-gradient(180deg, #11c6f8, #0083b5);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='argb(#11c6f8)', endColorstr='argb(#0083b5)', GradientType=0);
  -webkit-background-size: 250% 250%;
  background-size: 250% 250%;
  background-position: 0 10%;
  border: 1px solid #02a4e0;
  border-bottom-color: #0092c9;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 1px 0 #ededed;
  box-shadow: 0 1px 0 #ededed;
  text-decoration: none !important;
  padding: 15px 40px;
  font-size: 14px;
  -webkit-transition: all 0.2s ease-in-out !important;
  transition: all 0.2s ease-in-out !important;
  color: #fff !important;
}
.ie7 .btn2,
.ie8 .btn2,
.ie9 .btn2 {
  background: #07b7e7 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}
.btn2-facebook {
  background-image: -webkit-linear-gradient(270deg, #5b86bd, #315a92);
  background-image: linear-gradient(180deg, #5b86bd, #315a92);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='argb(#5b86bd)', endColorstr='argb(#315a92)', GradientType=0);
  border: 1px solid #3664a2;
  border-bottom-color: #28548f;
  position: relative;
}
.ie7 .btn2-facebook,
.ie8 .btn2-facebook,
.ie9 .btn2-facebook {
  background: #3664a2 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}
.btn2-facebook .sprite-facebook {
  position: absolute;
  top: 50%;
  left: 15px;
  margin-top: -12px;
}
.btn2-facebook .badge {
  position: absolute;
  top: -19px;
  right: -19px;
  width: 38px;
  height: 38px;
  background: #ff7802;
  color: #fff;
  text-align: center;
  font-size: 12px;
  line-height: 38px;
  -webkit-border-radius: 100px;
  border-radius: 100px;
}
.btn2-fixed {
  width: 290px;
  padding-left: 15px;
  padding-right: 15px;
}
.btn2-block {
  display: block;
  max-width: 300px;
  margin: 0 auto;
}
.btn2:hover {
  background-position: 0 90%;
  color: #fff;
}
.wof-page .bPopup {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 40px;
  text-align: center;
  width: 720px;
  color: #242424;
}
.wof-page .bPopup p {
  padding-bottom: 0 !important;
}
.wof-page .bPopup *,
.wof-page .bPopup *:before,
.wof-page .bPopup *:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.wof-page .bPopup .content {
  padding: 20px;
}
.wof-page .bPopup h2 {
  /*font-family: 'Baloo', cursive;*/
  color: #00a3e0;
  text-transform: none;
  font-size: 28px;
  font-weight: normal;
  margin-bottom: 50px;
}
.wof-page .bPopup h3 {
  /*font-family: 'Baloo', cursive;*/
  color: #000;
  text-transform: none;
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 15px;
}
.wof-page .bPopup .price-data {
  font-size: 45px;
  line-height: 1.2em;
  font-weight: bold;
  color: #ff7802;
}
.wof-page .bPopup .price-data .large {
  font-size: 80px;
}
.wof-page .bPopup .b-close-button {
  background: none;
  border: 0;
  opacity: 0.2;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
  top: 25px;
  right: 25px;
  width: 27px;
  height: 27px;
}
.wof-page .bPopup .b-close-button:hover {
  opacity: 1;
}
.wof-page .bPopup .b-close-button i {
  background-image: url("../img/wheelOfFortune/sprite.png?1600");
  position: relative;
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
  width: 27px;
  height: 27px;
  background-position: -5px -128px;
}
.wof-page .bPopup .box-payment {
  display: block;
  text-decoration: none;
  padding: 20px;
  border: 1px solid #d1d1d1;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 1px 0 #d1d1d1;
  box-shadow: 0 1px 0 #d1d1d1;
  -webkit-transition: border 0.2s ease-in-out;
  transition: border 0.2s ease-in-out;
}
.wof-page .bPopup .box-payment:hover {
  border-color: #00a3e0;
}
.wof-page .bPopup .box-payment:hover h3 {
  color: #00a3e0;
}
.wof-page .bPopup .box-payment h3 {
  /*font-family: 'Baloo', cursive;*/
  text-transform: none;
  font-size: 18px;
  font-weight: normal;
  margin: 0;
  padding-top: 20px;
  -webkit-transition: color 0.2s ease-in-out;
  transition: color 0.2s ease-in-out;
}
.wof-page .bPopup .popup-box-content-small {
  max-width: 350px;
  margin: 0 auto;
}
.wof-page .bPopup .popup-box-content-xsmall {
  max-width: 450px;
  margin: 0 auto;
}
.wof-page .bPopup .inline-block {
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
}
.wof-page .bPopup .align-left {
  text-align: left;
}
.wof-page .bPopup .align-right {
  text-align: right;
}
.wof-page .bPopup .align-center {
  text-align: center;
}
.wof-page .bPopup .bold {
  font-weight: bold;
}
.wof-page .bPopup .block-checkbox {
  display: block;
  font-weight: bold;
}
.wof-page .bPopup .block-checkbox input + span {
  line-height: 1.5em;
  position: relative;
  top: -3px;
}
.wof-page .bPopup form {
  width: 290px;
  margin: 0 auto;
  text-align: left;
}
.wof-page .bPopup form .control-group + .control-group {
  margin-top: 15px;
}
.wof-page .bPopup form .control-label {
  font-weight: bold;
  margin-bottom: 5px;
}
.wof-page .bPopup form .control-field .btn2 {
  width: 100%;
}
.wof-page .bPopup form .control-field.align-center a {
  margin: 0 10px;
}
.wof-page .bPopup form .input {
  width: 100%;
  border: 1px solid #c8c8c8;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  padding: 15px;
  margin: 0;
}
.wof-page .bPopup form .input:focus {
  outline: none;
}
.wof-page .bPopup .align-center .btn2-fixed {
  margin: 0 20px;
}
.wof-page .bPopup .table-data {
  border: 0;
}
.wof-page .bPopup .table-data tbody tr th,
.wof-page .bPopup .table-data tbody tr td {
  background: none;
  border: 0;
  text-align: left;
  width: 50%;
  padding: 10px 0;
  font-weight: bold;
  font-size: 14px;
}
.wof-page .bPopup .table-data tbody tr:nth-child(even) th,
.wof-page .bPopup .table-data tbody tr:nth-child(even) td {
  background: none;
  border: 0;
}
.wof-page .bPopup .margin-top-50 {
  padding-top: 50px;
}
.wof-page .bPopup .price-detail {
  text-align: left;
  padding-top: 40px;
  font-weight: bold;
}
.wof-page .bPopup .price-detail.align-center {
  text-align: center;
  padding-top: 0px;
}
.wof-page .bPopup .price-detail ul li {
  margin: 13px 0;
  padding-left: 30px;
  position: relative;
}
.wof-page .bPopup .price-detail ul li:before {
  content: '';
  display: block;
  position: absolute;
  top: 50%;
  left: 10px;
  width: 6px;
  height: 6px;
  margin-top: -3px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  background: #00a3e0;
}
.recharge-title {
  padding: 40px 0 30px;
  text-align: center;
  text-transform: none;
  font-weight: bold;
  font-family: 'Baloo', cursive;
  font-size: 28px;
  color: #3F51B5;
}
.recharge-amount {
  font-size: 22px;
  font-weight: bold;
}
.recharge-repeats {
  color: #29B6F6;
  font-size: 25px;
  margin-bottom: 20px;
}
.recharge-repeats span {
  margin-right: 5px;
  position: relative;
  top: -2px;
}
.recharge-price {
  margin-bottom: 30px;
}
.recharge-price-old {
  color: #aaa;
  font-size: 12px;
  text-decoration: line-through;
  margin-right: 5px;
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
}
.recharge-price strong {
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
  color: #3F51B5;
  font-size: 20px;
  font-weight: normal;
}
.recharge-btn {
  display: block;
  width: 267px;
  border-radius: 8px;
  background-color: #01E29C;
  font-size: 22px;
  line-height: 24px;
  text-align: center;
  text-shadow: 0 2px 0 0 #00D08F;
  color: #fff !important;
  text-decoration: none !important;
  padding: 15px;
}
.recharge-btn:hover {
  text-decoration: underline !important;
}
.sprite-refresh-blue,
.sprite-refresh-orange,
.sprite-recharge-arrow,
.sprite-facebook,
.sprite-popup-close,
.sprite-payment-transfer,
.sprite-payment-paypal,
.sprite-payment-cards,
.sprite-wof-point,
.sprite-maskot,
.sprite-wof-off,
.sprite-wof-on,
.sprite-wof-yellow-on,
.sprite-wof-white-on,
.sprite-wof-background,
.sprite {
  background-image: url("../img/wheelOfFortune/sprite.png?1600");
  position: relative;
  display: inline-block;
  /**display: inline;*/
  /**zoom: 1;*/
  vertical-align: middle;
}
.sprite-refresh-blue {
  width: 19px;
  height: 19px;
  background-position: -5px -5px;
}
.sprite-refresh-orange {
  width: 19px;
  height: 19px;
  background-position: -5px -34px;
}
.sprite-recharge-arrow {
  width: 326px;
  height: 20px;
  background-position: -5px -63px;
}
.sprite-facebook {
  width: 24px;
  height: 25px;
  background-position: -5px -93px;
}
.sprite-popup-close {
  width: 27px;
  height: 27px;
  background-position: -5px -128px;
}
.sprite-payment-transfer {
  width: 80px;
  height: 35px;
  background-position: -5px -165px;
}
.sprite-payment-paypal {
  width: 80px;
  height: 35px;
  background-position: -5px -210px;
}
.sprite-payment-cards {
  width: 80px;
  height: 35px;
  background-position: -5px -255px;
}
.sprite-wof-point {
  width: 120px;
  height: 132px;
  background-position: -5px -300px;
}
.sprite-maskot {
  width: 224px;
  height: 262px;
  background-position: -5px -442px;
}
.sprite-wof-off {
  width: 470px;
  height: 470px;
  background-position: -5px -714px;
}
.sprite-wof-on {
  width: 470px;
  height: 470px;
  background-position: -5px -1194px;
}
.sprite-wof-yellow-on {
  width: 470px;
  height: 470px;
  background-position: -5px -1674px;
}
.sprite-wof-white-on {
  width: 470px;
  height: 470px;
  background-position: -5px -2154px;
}
.sprite-wof-background {
  width: 470px;
  height: 470px;
  background-position: -5px -2634px;
}
.no-svg .svg:before {
  background-image: url("../svg/wheelOfFortune/sprite.png?1600");
}
.svg {
  font-size: 10px;
}
.svg:before {
  content: ' ';
  vertical-align: middle;
  display: inline-block;
  background-image: url("../img/wheelOfFortune/svg/sprite.svg?1600");
  background-repeat: no-repeat;
  -webkit-background-size: 0em 0em;
  background-size: 0em 0em;
}
#wof-wrap-other {
  background-image: url("../img/wheelOfFortune/background-wof-other.jpg?1600");
  background-repeat: no-repeat;
  background-position: top center;
  background-color: #99E0FF;
}
#wof-wrap-other > .wrap {
  background-color: white;
  padding: 20px;  
}
#wof-wrap-with-banner {
  background-image: url("../img/wheelOfFortune/background-wof-with-banner.jpg?1600");
  background-repeat: no-repeat;
  background-position: top center;
  background-color: #99E0FF;
  padding-top: 180px;
}
#wof-wrap-with-banner > .wrap {
  background-color: white;
  padding: 20px;  
}

.wof {
  padding: 70px 0 70px; 
  background-image: url("../img/wheelOfFortune/background-wof-repeat.jpg?1600");
  background-repeat: repeat-x;
  background-position: 0 0;
  background-color: #99E0FF;
  font-family: 'Baloo', cursive;
}
.wof *,
.wof *:before,
.wof *:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.wof .hidden {
  display: none;
}
.wof-show-result {
  position: relative;
  z-index: 500;
  display: none;
}
.wof h1 {
  text-transform: none;
  text-align: center;
  color: white;
  font-size: 70px;
  font-family: 'Baloo', cursive;
  text-shadow: 0 3px 0 0 rgba(63,81,181,0.2);
}
.wof .sub-title {
  font-size: 25px;
  color: #3F51B5;
  text-align: center;
  margin-bottom: 50px;
  line-height: 1.3em;
  font-weight: bold;
  font-family: 'Baloo', cursive;
}
.wof-box {
  background: #ADE5FF;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  padding: 30px;
}
.wof-repeats {
  position: absolute;
  top: 0;
  left: 0;
  color: #3F51B5;
  font-size: 20px;
  line-height: 20px;
}
.wof-repeats span[class*="sprite-"] {
  margin-right: 10px;
  float: left;
}
.wof-wheel-base {
  width: 470px;
  height: 470px;
  position: relative;
}
.wof-yellow-on {
  width: 470px;
  height: 470px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  opacity: 0;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.wof-white-on {
  width: 470px;
  height: 470px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  opacity: 0;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.wof-wheel-off {
  width: 470px;
  height: 470px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.wof-wheel-on {
  width: 470px;
  height: 470px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 15;
  -webkit-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
}
.wof-wheel-point {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 16;
  margin-top: -72px;
  margin-left: -60px;
}
.wof-start,
.wof-recharge {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 30;
  text-decoration: none !important;
  background: #fff;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.2);
  box-shadow: 0 0 4px rgba(0,0,0,0.2);
  padding: 10px;
  text-align: center;
  line-height: 1.8em;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.ie7 .wof-start,
.ie7 .wof-recharge,
.ie8 .wof-start,
.ie8 .wof-recharge {
  margin-top: -30px;
  margin-left: -110px;
}
.wof-start span,
.wof-recharge span {
  display: block;
  width: 180px;
  border-radius: 8px;
  background-color: #01E29C;
  color: #FFFFFF;
  font-size: 22px;
  text-align: center;
  text-shadow: 0 2px 0 0 #00D08F;
  padding: 15px;
}
.wof-start:hover span,
.wof-recharge:hover span {
  background-position: 0 90%;
}
.wof-start span {

}
.ie7 .wof-start span,
.ie8 .wof-start span,
.ie9 .wof-start span {
  background: #07b7e7 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}

.ie7 .wof-start:hover span,
.ie8 .wof-start:hover span,
.ie9 .wof-start:hover span {
  background: #06a5d0 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}
.wof-recharge span {
  background-image: -webkit-linear-gradient(270deg, #ff9133, #e66a00);
  background-image: linear-gradient(180deg, #ff9133, #e66a00);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='argb(#ff9133)', endColorstr='argb(#e66a00)', GradientType=0);
  border: 1px solid #e16800 !important;
}
.ie7 .wof-recharge span,
.ie8 .wof-recharge span,
.ie9 .wof-recharge span {
  background: #ff7601 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}
.wof-recharge:hover span {
  border: 1px solid #cb5e00 !important;
}
.ie7 .wof-recharge:hover span,
.ie8 .wof-recharge:hover span,
.ie9 .wof-recharge:hover span {
  background: #e66a00 !important;
  background-image: none !important;
  -webkit-filter: none !important;
          filter: none !important;
}
.wof-wheel-base.active .wof-start,
.wof-wheel-base.active .wof-recharge {
  opacity: 0;
  visibility: hidden;
}
.wof-wheel-base.active .wof-wheel-off {
  opacity: 0;
}
.wof-wheel-base.active .wof-yellow-on,
.wof-wheel-base.active .wof-white-on {
  -webkit-animation-name: blink;
          animation-name: blink;
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
@-webkit-keyframes blink {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes blink {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.wof-bg-button {
   
    position: absolute;
    height: 700px;
    width: 220px;
    margin-top: 50px;
    display: inline-block;
    
}

.wof-bg-button-left {
    margin-left: -240px;
}
.wof-bg-button-right {
    margin-left: 1020px;
}

.wof-banner-button {
    display: inline-block;
    height: 118px;
    margin-top: -138px;
    position: absolute;
    width: 1000px;
}

.price-list .wof-number {
    font-size: 17px;
    margin-top: -10px;
}

.bPopup.wof-payments {
    background-color: #c3e1ea;
    width: 800px;
}
.bPopup.wof-payments .b-close{
    display: none;
}
.bPopup.wof-payments .content {
    background-color: #c3e1ea;
}

.wof-page .popup-box-payment .space {
    color: #ff7802;
    font-size: 75%;
}

.intro-wof-banner {
    height: 200px;
    margin-top: -50px;
}