$schemeW: 32px;

.schemes {
    font-size: 0;
    height: 32px;
    position: absolute;
    right: 0;
    top: 160px;
    width: 200px;
}

.scheme {
    background-image: url('../res/scheme.svg');
    background-repeat: no-repeat;
    border: 4px solid #fff;
    display: inline-block;
    height: 40px;
    outline: 1px solid #d5d5d5;
    width: 40px;
}

.scheme1,
.scheme2,
.scheme3 {
    margin-right: 13px;
}

@for $i from 1 through 4 {
    .scheme#{$i} {
        background-position: -#{($i - 1) * $schemeW} 0;
    }
}