@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap');
:root {
 --color-1:#fff; /*Фон блока*/
 --color-2:#333; /*Цвет текста*/
 --color-3:#f0f0f0; /*Фон плашки рейтингового места*/
 --color-4:#81ABE9; /*Цвет фона кнопки*/
 --color-5:#588ddd; /*Цвет фона кнопки при наведении*/
}

.rating-table-wrapper {
 background:var(--rating-color-1);
 box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0);
 border-radius: 16px;
 padding: 30px 20px 30px;
}

.xdget-userScaleRating {
 display: none;
}

.rating-table-wrapper > h2 {
 color: var(--rating-color-2);
 font-family: 'Inter', sans-serif;
 font-size: 20px;
 font-style: normal;
 font-weight: 400; 
 text-align:center;
 margin-bottom:20px;
}

.rating-table {
 display:flex;
 flex-direction:column;
 gap:15px;
 counter-reset: rating_list;
}

.rating-table-wrapper .place.my {
 background:transparent;
 box-shadow:none;
 flex-direction:column;
 padding:0;
 margin-bottom:10px;
}

.rating-table-wrapper .my-rating {
 margin-bottom:20px;
}

.rating-table-wrapper .place.my:before {
 display:none;
}

.rating-table-wrapper .place.my img {
 margin-right:0;
 width:100px;
 высота: 100 пикселей;
 отступ снизу: 5 пикселей;
}

.rating-table-wrapper .place.my .place-name {
 font-size: 20px;
 text-align: center;
 color: var(--rating-color-2);
}

.rating-table-wrapper .place.my .place-scale {
 font-size: 16px;
 width: 50%;
 text-align: center;
 padding-bottom: 5px;
 border-bottom: 1px solid var(--rating-color-3);
}

.rating-table-wrapper .place {
 background:var(--rating-color-1);
 display:flex;
 align-items: center;
 padding:10px 20px;
 border-radius:6px;
 box-shadow:0 10px 15px 0 rgba(0, 0, 0, 0.05);
}

.rating-table-wrapper .place:before {
 content: counter(rating_list);
 counter-increment: rating_list;
 font-family: 'Inter', sans-serif;
 font-size: 20px;
 font-style: normal;
 font-weight: 400; 
 text-align:center;
 margin-right:15px;
 color:var(--rating-color-2);
}

.rating-table-wrapper .place img {
 border-radius:50%;
 margin-right:15px;
 flex:0 0 50px;
 width:50px;
 height:50px;
}

.rating-table-wrapper .place .place-name {
 font-family: 'Inter', sans-serif;
 font-size: 16px;
 font-style: normal;
 font-weight: 400; 
 margin-bottom:20px;
 color:var(--rating-color-2);
}

.rating-table-wrapper .place .place-scale {
 font-family: 'Inter', sans-serif;
 font-size: 14px;
 font-style: normal;
 font-weight: 400; 
 color:var(--rating-color-6);
}

.rating-table > button {
 border: 1px solid #4353FF;
 background:var(--rating-color-1);
 font-family: 'Inter', sans-serif;
 font-size: 14px;
 font-style: normal;
 font-weight: 400; 
 border-radius:6px;
 padding:10px;
 color:var(--rating-color-4);
 transition:all .3s;
 margin-top:5px;
 box-shadow:none;
 outline:none;
}

.rating-table > button:hover {
 border:none;
 background:var(--rating-color-3);
}

@media(max-width:768px) {
 .rating-table-wrapper .place {
 padding:10px 15px;
 }
 
 .rating-table-wrapper .place:before {
 font-size:20px;
 margin-right:15px;
 }
 
 .rating-table-wrapper .place img {
 margin-right:15px;
 }
 
 .rating-table-wrapper .place .place-name {
 font-size: 16px;
 }
 
 .rating-table-wrapper .place .place-scale {
 font-size: 12px;
 }
}