.lbtop { padding: 25px 30px; border-radius: 4px; margin: 0 0 20px 0; }

/* шапка */
.lbtop__header-title { margin: 0 0 25px 0; }

/* выбор периода */
.lbtop__period-wrap { position: absolute; right: 15px; top: 12px; z-index: 3; }
.lbtop__select { right: -22px; }

/* блок с местом */
.lbtop__place { display: inline-block; vertical-align: bottom; width: 260px; padding: 170px 15px 15px 15px; position: relative; }

/* номер позиции */
.lbtop__spot { font: 16px/16px geometria, arial; margin: 0 0 20px 0; }
.lbtop__spot:before { content: ""; width: 12px; height: 12px; position: absolute; background: url(i/star.svg) no-repeat 50% / 12px; margin: 3px 0 0 -19px; }
.lbtop__spot:after { content: ""; width: 12px; height: 12px; position: absolute; background: url(i/star.svg) no-repeat 50% / 12px; margin: 3px 0 0 6px;  }
/* стили звёзд с номером позиции */
.lbtop__place--2 .lbtop__spot:before { background-image: url(i/star_silver.svg); }
.lbtop__place--2 .lbtop__spot:after { background-image: url(i/star_silver.svg); }
.lbtop__place--3 .lbtop__spot:before { background-image: url(i/star_bronze.svg); }
.lbtop__place--3 .lbtop__spot:after { background-image: url(i/star_bronze.svg); }

/* фотограция участника */
.lbtop__avatar { background-color: #eee; position: absolute; width: 100px; height: 100px; top: 0; border-radius: 50%; background-size: cover; background-position: 50%; background-repeat: no-repeat; left: 0; right: 0; margin: auto; }
.lbtop__avatar:before { content: ""; width: 50px; height: 100px; background: url(i/wreath_left_gold.svg) no-repeat 50% / 50px auto; position: absolute; left: -35px; bottom: -30px; }
.lbtop__avatar:after { content: ""; width: 50px; height: 100px; background: url(i/wreath_right_gold.svg) no-repeat 50% / 50px auto; position: absolute; right: -35px; bottom: -30px; }

.lbtop__avatar--noimage { background-image: url(i/user.svg);  background-size: 50px; }


/* венок вокруг фотографии */
.lbtop__place--2 > .lbtop__avatar:before { background-image: url(i/wreath_left_silver.svg); }
.lbtop__place--2 > .lbtop__avatar:after { background-image: url(i/wreath_right_silver.svg); }
.lbtop__place--2 > .lbtop__avatar { background-color: #c0c0c0; }
.lbtop__place--3 > .lbtop__avatar:before { background-image: url(i/wreath_left_bronze.svg); }
.lbtop__place--3 > .lbtop__avatar:after { background-image: url(i/wreath_right_bronze.svg); }
.lbtop__place--3 > .lbtop__avatar { background-color: #cf7e22 }
.lbtop__place--1 > .lbtop__avatar:before { width: 74px; height: 147px; left: -53px; background-size: 74px auto; }
.lbtop__place--1 > .lbtop__avatar:after { width: 74px; height: 147px; right: -53px; background-size: 74px auto; }
.lbtop__place--1 > .lbtop__avatar { background-color: #ffc900 }
.lbtop__place--1 .lbtop__avatar--noimage { background-size: 70px; }

/* стили блока с первым местом */
.lbtop__place--1 { padding-top: 250px; }
.lbtop__place--1 > .lbtop__avatar { width: 150px; height: 150px; }
.lbtop__place--1 .lbtop__ico { width: 80px; height: 80px; background-size: 80px; top: 160px; }

/* кубок под фотографией */
.lbtop__ico { width: 50px; height: 50px; position: absolute; background: url(i/trophy_gold.svg) no-repeat 50% / 45px; top: 110px; left: 0; right: 0; margin: auto; }
.lbtop__place--2 .lbtop__ico { background-image: url(i/trophy_silver.svg); }
.lbtop__place--3 .lbtop__ico { background-image: url(i/trophy_bronze.svg); }

/* имя участника */
.lbtop__name { font: 600 23px/28px geometria, arial; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: 0 0 10px 0; }

/* достижение */
.lbtop__score { font: 400 20px/20px geometria, arial; color: #a6a6a6; }

/* маркеры */
.lbtop__dots { height: 30px; margin: 20px 0 0 0; }
.lbtop__dots:before { content: ""; display: inline-block; vertical-align: middle; height: 100%; }
.lbtop__dot { width: 15px; height: 15px; background: #ccc; display: inline-block; vertical-align: middle; margin: 0 20px 0 0; border-radius: 50%; cursor: pointer; }
.lbtop__dot:last-child { margin-right: 0; }
.lb--foodhunter .lbtop__dot[data-class="foodhunter"] { background: #FF3838; cursor: default; }
.lb--critic .lbtop__dot[data-class="critic"] { background: #FF3838; cursor: default; }
.lb--restoholic .lbtop__dot[data-class="restoholic"] { background: #FF3838; cursor: default; }

.lbtop__tab { font: 600 21px/37px geometria, arial; height: 38px; }

.lbtop__hint { margin-bottom: 35px; padding: 18px 25px 15px 25px; }


@media screen and (max-width: 1000px) {
    .lbtop__place { width: 200px; }
    .lbtop__avatar:before { display: none; }
    .lbtop__avatar:after { display: none; }
    .lbtop__place--1 .lbtop__avatar { width: 120px; height: 120px; }
    .lbtop__place--1 { padding-top: 204px; }
    .lbtop__place--1 .lbtop__ico { top: 132px; width: 60px; height: 60px; background-size: 60px; }
    .lbtop__place--1 .lbtop__avatar--noimage { background-size: 60px; }
    .lbtop__name { font: 600 20px/20px geometria, arial; }
    .lbtop__score { font-size: 17px; }
}


/* HOVER */
@media screen and (min-width: 1000px) {
    .lbtop__tab:hover { background-color: #FF3838; color: #fff; border-color: #FF3838; }
    .lbtop__select-option:hover { background-color: #ffebcc; }
    .lbtop__period:hover { color: #f00; }
    .lbtop__period:hover:after { background-image: url(i/tick_red.svg); }
}