@charset "utf-8";

#topList, #topList * { box-sizing: border-box; margin: 0px; padding: 0px; list-style: none; font-family: inherit; }

@keyframes progress-bar-stripes { 
  0% { background-position: 40px 0px; }
  100% { background-position: 0px 0px; }
}

@-webkit-keyframes progress-bar-stripes { 
  0% { background-position: 40px 0px; }
  100% { background-position: 0px 0px; }
}

#topList { width: 100%; }

#topList { width: 100%; }

#topList li { display: flex; justify-content: space-between; }

.topList__person { width: 40%; display: grid; grid-template-columns: 25px min-content 1fr; align-items: center; }

.topList__person--name { line-height: 1; }

.topList__person--ava img { width: 50px; height: 50px; margin-left: 14px !important; margin-right: 8px !important; }

.topList__progress { display: flex; align-items: center; width: 50%; }

.progressBar { display: block; height: 25px; background-color: rgb(25, 118, 210); background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.1) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 75%, transparent 75%, transparent); background-size: 40px 40px; border-radius: 3px; animation: 2s linear 0s infinite normal none running progress-bar-stripes; transition: 800ms ease-out; width: 40%; margin: 0px 20px !important; }

@media screen and (max-width: 800px) {
  #topList li { flex-direction: column; margin-bottom: 12px !important; }
  .topList__progress { margin-top: 2px !important; margin-left: 19px !important; }
  .topList__person, .topList__progress { width: 100%; }
}