@font-face {
    font-family: 'Roboto';
    src: url('../fonts/roboto/Roboto-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}


.currency i {
    font-family: Roboto, sans-serif;
    cursor: pointer;
    margin: 0;
    font-weight: bold;
    font-size: 16px;
    padding: 3px 8px;
    border: 1px dotted lightgrey;
    border-radius: 2px;
}

.currency i.active {
    background-color: gold;
    border: 1px solid lightgrey;
}

.currency .icon-usd {
    font-family: initial, sans-serif;
    font-size: 17px;
}

.rub:after {
    content: "\20bd";
    font-family: Roboto, sans-serif;
    font-size: 16px;
}

.usd:after {
    content: "\24";
    font-family: initial, sans-serif;
    font-size: 17px;
}

.eur:after {
    content: "\20ac";
    font-family: Roboto, sans-serif;
    font-size: 16px;
}

.price-currency {
    padding: 0;
    margin: 0;
    width: 120px;
}

.price-currency li.hidden {
    display: none;
}

.price-currency li {
    list-style-type: none;
    text-align: left;
    width: auto;
    display: inline-block;
    line-height: 14px;
    font-size: 14px;
}

.price-area {
    overflow: hidden;
    position: relative;
}

.price-area .price-currency {
    display: inline-block;
    width: auto;
}

.price-area .measure {
    display: inline-block;
}

.price-area .price-currency li {
    width: auto;
}

.price-currency li:after {
    color: black;
    font-style: normal;
    font-weight: 800;
    vertical-align: top;
    display: inline-block;
    width: 14px;
    float: right;
    text-align: right;
    text-shadow: 0 0 1px gold;
}