.about-loyalty {
  width: 650px;
  margin-right: -5px;
  display: inline-block;
  padding-right: 30px;
  vertical-align: top;
}
@media (max-width: 1023px) and (min-width: 768px) {

  .about-loyalty {
    width: 100%;
    padding: 0;
  }
}
@media (max-width: 767px) {

  .about-loyalty {
    width: 100%;
    padding: 0;
  }
}
.loyalty-right-side {
  display: inline-block;
  width: 310px;
  vertical-align: top;
}
@media (max-width: 1023px) and (min-width: 768px) {

  .loyalty-right-side {
    width: 100%;
    padding: 20px 0 0 0;
    margin-top: 20px;
    border-top: 1px dashed #ddd;
  }
}
@media (max-width: 767px) {

  .loyalty-right-side {
    width: 100%;
    padding: 20px 0 0 0;
    margin-top: 20px;
    border-top: 1px dashed #ddd;
  }
}
.loyalty-ranks li {
  font-size: 14px;
  list-style: none;
  padding: 8px 0px;
  border-bottom: 1px solid #ddd;
}
.loyalty-ranks li:nth-child(even) {
  background: #eee;
}
.loyalty-ranks li.header {
  font-weight: bold;
  border-bottom: 1px solid #bbb;
  padding-bottom: 10px;
}
.loyalty-ranks li .rank-nr {
  display: inline-block;
  vertical-align: top;
  min-width: 10%;
  padding-left: 5px;
  margin-right: -10px;
}
.loyalty-ranks li .rank-name {
  display: inline-block;
  vertical-align: top;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 70%;
  margin-right: -10px;
}
.loyalty-ranks li .rank-precent {
  display: inline-block;
  vertical-align: top;
  width: 20%;
  padding-right: 5px;
  text-align: right;
}
.loyalty-stats {
  background: #c6ecff;
  border: 1px solid #a1d5ef;
  padding: 10px;
}
.loyalty-stats li {
  font-size: 14px;
  list-style: none;
  padding-left: 10px;
  margin-bottom: 6px;
}
.line{
    width: 100%;
    display: inline-block;
    line-height: 3em;        
}