.shimmer-data {
    padding: 25px;
    display: flex;
    width: 100%;
  }
  .shimmer-data1{
      padding: 25px;
      display: flex;
      width: 100%;
  }
  
  .shimmmer-box {
    height: auto;
    width: 25%;
    margin-right: 10px;
  }
  .shimmer-header {
    height: 80px;
    width: 80px;
    border-radius: 5px;
    background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
    -webkit-background-size: 125px 100%;
    -moz-background-size: 125px 100%;
    background-size: 500px 100px;
    -webkit-animation-name: shimmerBackground;
    animation-name: shimmerBackground;
    -webkit-animation-duration: 60s;
    animation-duration: 60s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    margin: auto;
    margin-bottom: 20px;
  }
  .shimmer-lines {
    height: 10px;
    width: 100%;
    background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
    background-size: 500px 100px;
    -webkit-animation-name: shimmerBackground;
    animation-name: shimmerBackground;
    -webkit-animation-duration: 60s;
    animation-duration: 60s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    margin: auto;
    margin-bottom: 10px;
  }
  .shimmer-lines:nth-child(2) {
    width: 100%;
  }
  .shimmer-lines:nth-child(2)
  {width :90%}
  .shimmer-lines:nth-child(3)
  {width: 80%}
  .shimmer-lines:nth-child(4)
  {width: 70%}
  .shimmer-lines:last-child
  {margin-bottom: 0px}
  .shimmer-lines:last-child
  {margin-right: 0px}
  
  @keyframes shimmerBackground {
    0% {
      background-position: -5000px 0;
    }
    100% {
      background-position: 5000px 0;
    }
  }
  
  .shimmer-slider{
      height: 280px;
      width: 280px;
      border-radius: 5px;
      background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
      -webkit-background-size: 125px 100%;
      -moz-background-size: 125px 100%;
      background-size: 500px 100px;
      -webkit-animation-name: shimmerBackground;
      animation-name: shimmerBackground;
      -webkit-animation-duration: 60s;
      animation-duration: 60s;
      -webkit-animation-iteration-count: infinite;
      animation-iteration-count: infinite;
      -webkit-animation-timing-function: linear;
      animation-timing-function: linear;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      margin: auto;
      margin-bottom: 20px;
  }
  
  .lines{
      
      height: 10px;
      width: 100%;
      background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
      background-size: 500px 100px;
      -webkit-animation-name: shimmerBackground;
      animation-name: shimmerBackground;
      -webkit-animation-duration: 60s;
      animation-duration: 60s;
      -webkit-animation-iteration-count: infinite;
      animation-iteration-count: infinite;
      -webkit-animation-timing-function: linear;
      animation-timing-function: linear;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
      margin: auto;
      margin-bottom: 10px;
  }
  

  /* Rewards */

  
.boxrewards{
  /* //max-width: 900px; */
  width: 100%;
  /* //height: 70%; */
  display: flex;
  padding: 0 15px;
}
.skeletonrewards {
  padding:15px;
  max-width: 300px;
  width: 100%;
  background: #fff;
  margin-bottom: 20px;
  border-radius: 5px;
  /* //display: grid; */
  justify-content: center;
  align-items: center;
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12);
}
.skeletonrewards .square {
  height: 130px;
  border-radius: 5px;
  background: rgba(130, 130, 130, 0.2);
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
  background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
  background-size: 800px 100px;
  animation: wave-squares 2s infinite ease-out;
}
.skeletonrewards .line {
  height: 12px;
  margin-bottom:6px;
  border-radius: 2px;
  background: rgba(130, 130, 130, 0.2);
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
  background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
  background-size: 800px 100px;
  animation: wave-lines 2s infinite ease-out;
}
.skeleton-right{
 /* flex:1; */
}
.skeleton-left{
 /* flex:2; */
 padding-right:15px;
}
.flex1{
 flex: 1;
}
.flex2{
 flex: 2;
}
.skeleton .line:last-child{
 margin-bottom: 0;
}
.h8{
 height: 8px !important;
}
.h10{
 height: 10px !important;
}
.h12{
 height: 12px !important;
}
.h15{
 height: 15px !important;
}
.h17{
 height: 17px !important;
}
.h20{
 height: 20px !important;
}
.h25{
 height: 25px !important;
}
.w25{
 width: 25% !important
}
.w40{
 width:40% !important;
}
.w50{
 width: 50% !important
}
.w75{
 width: 75% !important
}
.m10{
 margin-bottom: 10px !important;
}
.circle{
 border-radius: 50% !important;
  height: 80px !important;
  width: 80px;
}
@keyframes wave-lines {
 0% {
     background-position: -468px 0;
 }
  100% {
     background-position: 468px 0;
 }
}
@keyframes wave-squares {
 0% {
     background-position: -468px 0;
 }
  100% {
     background-position: 468px 0;
 }
}


/* Placements */

.box{
  max-width: 600px;
  width: 100%;
  display: flex;
  padding: 0 15px;
}
.skeleton {
  padding:15px;
  max-width: 600px;
  width: 100%;
  background: #fff;
  margin-bottom: 20px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12);
}
.skeleton .square {
  height: 130px;
  border-radius: 5px;
  background: rgba(130, 130, 130, 0.2);
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
  background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
  background-size: 800px 100px;
  animation: wave-squares 2s infinite ease-out;
}
.skeleton .line {
  height: 12px;
  margin-bottom:6px;
  border-radius: 2px;
  background: rgba(130, 130, 130, 0.2);
  background: -webkit-gradient(linear, left top, right top, color-stop(8%, rgba(130, 130, 130, 0.2)), color-stop(18%, rgba(130, 130, 130, 0.3)), color-stop(33%, rgba(130, 130, 130, 0.2)));
  background: linear-gradient(to right, rgba(130, 130, 130, 0.2) 8%, rgba(130, 130, 130, 0.3) 18%, rgba(130, 130, 130, 0.2) 33%);
  background-size: 800px 100px;
  animation: wave-lines 2s infinite ease-out;
}
.skeleton-right{
 flex:1;
}
.skeleton-left{
 flex:2;
 padding-right:15px;
}
.flex1{
 flex: 1;
}
.flex2{
 flex: 2;
}
.skeleton .line:last-child{
 margin-bottom: 0;
}
.h8{
 height: 8px !important;
}
.h10{
 height: 10px !important;
}
.h12{
 height: 12px !important;
}
.h15{
 height: 15px !important;
}
.h17{
 height: 17px !important;
}
.h20{
 height: 20px !important;
}
.h25{
 height: 25px !important;
}
.w25{
 width: 25% !important
}
.w40{
 width:40% !important;
}
.w50{
 width: 50% !important
}
.w75{
 width: 75% !important
}
.m10{
 margin-bottom: 10px !important;
}
.circle{
 border-radius: 50% !important;
  height: 80px !important;
  width: 80px;
}
@keyframes wave-lines {
 0% {
     background-position: -468px 0;
 }
  100% {
     background-position: 468px 0;
 }
}
@keyframes wave-squares {
 0% {
     background-position: -468px 0;
 }
  100% {
     background-position: 468px 0;
 }
}



/* events && news room */



