style.css

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
*,
*:before,
*:after {
	box-sizing: border-box;
}
body{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    background-image: url('data:image/svg+xml,%3Csvg width="52" height="26" viewBox="0 0 52 26" xmlns="http://www.w3.org/2000/svg"%3E%3Cg fill="none" fill-rule="evenodd"%3E%3Cg fill="%239C92AC" fill-opacity="0.4"%3E%3Cpath d="M10 10c0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6h2c0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4 3.314 0 6 2.686 6 6 0 2.21 1.79 4 4 4v2c-3.314 0-6-2.686-6-6 0-2.21-1.79-4-4-4-3.314 0-6-2.686-6-6zm25.464-1.95l8.486 8.486-1.414 1.414-8.486-8.486 1.414-1.414z" /%3E%3C/g%3E%3C/g%3E%3C/svg%3E');
    background-color:#230446;
    background-size:10%;
    animation: bgScroll 20s linear infinite;
  }
  
  @keyframes bgScroll {
    0% {
      background-position : 0px 0px
    }
    100% {
      background-position : 0px -808px
    }
  }
.leaderBoard-wrapper{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-top: 20%;
}
.leader-board {
    width: 380px;
	height: auto;
	border-radius: 10px;
	background-color: white;
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	overflow: hidden;
}
.heading{
    background: #3A404D;
    color: white;
    padding: 20px;
    text-align: center;
}
.persons{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 15px 25px 15px 25px;
    /* default color if no color assigned using code leader-board .persons:nth-child(n){color:#xxx;} */
    background: #818181; 
}
.persons h1{
    font-size: 19px;
    color: white;
}
.leader-board .persons {
	background: #3F0B79;
}

@media only screen and (max-width: 600px) {
    .leader-board {
        width: 95%;
        height: auto;
        border-radius: 10px;
        background-color: white;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
        overflow: hidden;
    }
}