.indicator { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 23px; margin-bottom: 17px; color: black; border: 0; }

.indicator__label { width: 100px; text-align: center; visibility: hidden; opacity: 0; position: absolute; left: -95px; top: -3px; background-color: #020202; border-radius: 5px; padding: 7px 11px; color: #fefefe; font-size: 11pt; line-height: 1; -webkit-transition: .3s; transition: .3s; }

.indicator__label:after { content: ''; position: absolute; right: -6px; top: 7px; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 7px solid #020202; }

@media screen and (max-width: 767px) { .indicator__label { display: none; } }

.indicator i { color: #020202; cursor: pointer; }

.indicator .icon:before { font-size: 20px; }

.indicator__button { cursor: pointer; border: 0; line-height: 0; color: #020202; }

.indicator__button .icon:before { font-size: 23px; }

.indicator__button:hover i { color: #d7002c; }

.indicator__counter { line-height: 1; margin-top: 4px; font-size: 10pt; font-weight: bold; cursor: pointer; }

.indicator:hover .indicator__icon, .indicator:hover .indicator__counter { color: #d7002c; }

.indicator:hover .indicator__label { visibility: visible; opacity: 1; left: -117px; }

.indicator--active .indicator__counter, .indicator--active .indicator__icon { color: #d7002c; }

.like__button.indicator { margin-bottom: 15px; }

.like--active .indicator__button, .like--active .indicator__counter, .like--active .indicator__icon { color: #d7002c; }

/*# sourceMappingURL=indicator.css.map */