section.bandit {
  padding: 45px 0 75px;
  overflow: hidden;
}

.bandit .apparat {
  width: 440px;
  float: left;
}

.bandit .apparat .tablo {
  float: left;
}

.bandit .apparat .tablo .sector {
  float: left;
  width: 100px;
  height: 240px;
  background: #0347b7;
  border-radius: 15px;
  position: relative;
  overflow: hidden;
}

.bandit .apparat .tablo .sector:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 110px;
  background: linear-gradient(to top, #03368b00, #03368b);
  z-index: 5;
}

.bandit .apparat .tablo .sector:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height:110px;
  background: linear-gradient(to bottom, #03368b00, #03368b);
  z-index: 5;
}

.bandit .apparat .tablo .sector+.sector {
  margin-left: 15px;
}

.bandit .apparat .tablo .sector>div {
  width: 100px;
  position: absolute;
  left: 0;
  bottom: 0;
  transition: all 7s ease-out;
}

.bandit .apparat .tablo .sector>div>div {
  float: left;
  width: 100px;
  height: 80px;
  text-align: center;
  vertical-align: middle;
  line-height: 80px;
  font-size: 25px;
  font-weight: 700px;
  color: #eee;
}

.bandit .apparat .tablo .sector>div>div.i0 {
  background: url(../images/bandit_jack_pot.png) center center no-repeat;
  background-size: contain;
}
.bandit .apparat .tablo .sector>div>div.i1 {
  
}
  .bandit .apparat .tablo .sector>div>div.i1:after {
    content: "5%";
  }
.bandit .apparat .tablo .sector>div>div.i2 {
  
}
  .bandit .apparat .tablo .sector>div>div.i2:after {
    content: "10%";
  }
.bandit .apparat .tablo .sector>div>div.i3 {
  
}
  .bandit .apparat .tablo .sector>div>div.i3:after {
    content: "15%";
  }

.bandit .apparat .handle_wrap {
  float: left;
  margin-left: 48px;
  width: 17px;
  height: 215px;
  margin-top: 23px;
  background: #033692;
  background: -webkit-gradient(linear, 100% 0, 0 0, from(#7c868a), color-stop(0.5, #92999b), to(#a7abac));
  background: -webkit-linear-gradient(to right, #7c868a, #92999b, #a7abac);
  background: -moz-linear-gradient(to right, #7c868a, #92999b, #a7abac);
  background: -o-linear-gradient(to right, #7c868a, #92999b, #a7abac);
  background: linear-gradient(to right, #7c868a, #92999b, #a7abac);
  border: 1px solid #999999;
  border-radius: 9px;
  position: relative;
}

.bandit .apparat .handle_wrap .handle {
  position: absolute;
  left: 2px;
  top: -20px;
  width: 11px;
  height: 50px;
  border-radius: 6px;
  border: 1px solid #434343;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#4e5658), to(#848484));
  background: -webkit-linear-gradient(to top, #4e5658, #848484);
  background: -moz-linear-gradient(to top, #4e5658, #848484);
  background: -o-linear-gradient(to top, #4e5658, #848484);
  background: linear-gradient(to top, #4e5658, #848484);
  cursor: pointer;
  transition: all 0.5s ease-in;
}

.bandit .apparat .handle_wrap .handle.down {
  height: 10px;
  top: 200px;
}

.bandit .apparat .handle_wrap .handle:after {
  content: "";
  position: absolute;
  left: -19px;
  top: -33px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#682e03), color-stop(0.5, #c15406), to(#e49e6c));
  background: -webkit-linear-gradient(to top, #682e03, #c15406, #e49e6c);
  background: -moz-linear-gradient(to top, #682e03, #c15406, #e49e6c);
  background: -o-linear-gradient(to top, #682e03, #c15406, #e49e6c);
  background: linear-gradient(to top, #682e03, #c15406, #e49e6c);
}

.bandit .info {
  float: left;
  width: 500px;
  padding-left: 40px;
}

.bandit .info .text1 {
  margin-bottom: 20px;
  color: #0443af;
}

.bandit .info .text1 span {
  color: #000000;
  font-size: 20px
}

.bandit .info .text2 {
  margin-bottom: 20px;
  color: #ff730e;
  display: none;
}

.bandit .info .text2 span {
  display: block;
  padding-bottom: 15px;
}

.bandit .info .buttons {
  
}

.bandit .info .button {
  color: #fff;
  font: 500 20px/42px Roboto;
  border-radius: 25px;
  background: -moz-linear-gradient(top, #e6802f 0%, #fe4f1d 100%);
  background: -webkit-linear-gradient(top, #e6802f 0%, #fe4f1d 100%);
  background: linear-gradient(to bottom, #e6802f 0%, #fe4f1d 100%);
  text-align: center;
  text-decoration: none;
  padding: 0 50px;
  display: inline-block;
}


.bandit .info .buttons .button:hover {
  background: #ae3f1a;
}



@media (max-width: 980px) {
  .bandit .apparat {
      width: 440px;
      float: none;
      margin: 0 auto;
  }

  .bandit .info {
      float: none;
      width: 500px;
      padding-left: 0;
      margin: 0 auto;
      max-width: 100%;
      overflow: hidden;
    padding-top: 30px;
  }
  .cont {
    box-sizing: border-box;
    overflow: hidden;
    padding-top: 50px;
  }
  
}

@media (max-width: 980px) {
  .bandit .info .text1 {
    font-size: 17px;
  }
  .bandit .apparat .tablo .sector {
    width: 64px;
  }
  .bandit .apparat .tablo .sector > div {
    width: 64px;
  }
  .bandit .apparat .tablo .sector > div > div {
    width: 64px;
  }
  .bandit .apparat .handle_wrap {
      margin-left: 24px;
  }
}