// $base-layout: smart
// $base-sprite-dimensions: true
// @import "alvadi/pages/base/*.png"
// @include all-base-sprites

// $brands-layout: smart
// $brands-sprite-dimensions: true
// @import "alvadi/pages/sparePartsCatalog/brands/*.png"
// @include all-brands-sprites


.al-icon
  display: inline-block
  fill: currentColor

.al-icon__position
  margin-right: 5px
  position: relative
  top: 5px
  left: 0
.al-icon__size
  width: 20px
  height: 20px

.al-icon-cart, .al-icon-account, .al-icon-phone
  @extend .al-icon__size
  @extend .al-icon__position

.al-icon-new_window
  width: 14px
  height: 14px
  margin-left: 1px
  margin-right: -21px
  position: relative
  top: 4px
  left: 0

.al-icon-back_button
  position: absolute
  top: 0
  left: -5px
  height: 100%
  width: 100%

.al-icon-down
  width: 8px
  height: 8px
.al-icon-up
  width: 8px
  height: 8px

.al-icon-geo, .al-icon-time, .al-icon-mail, .al-icon-phone-footer
  width: 20px
  height: 20px
  margin-right: 5px
  margin-left: -25px
  margin-bottom: -5px

#icon-time
  .path1, .path2
    fill: currentcolor

.al-icon-lang_en, .al-icon-lang_fi, .al-icon-lang_ru, .al-icon-lang_lv, .al-icon-lang_ee
  width: 22px
  height: 15px
  position: relative
  top: 3px
  left: 0
  margin: 0 10px

#icon-lang_ee
  .path1
    fill: rgb(67, 74, 84)
  .path2
    fill: rgb(245, 247, 250)
  .path3
    fill: rgb(59, 175, 218)

#icon-lang_en
  .path1, .path2, .path3, .path4, .path5, .path6, .path7, .path8, .path9, .path10
    fill: rgb(71, 88, 169)
  .path11, .path12, .path13, .path14
    fill: rgb(237, 85, 101)
  .path15, .path16, .path17, .path18
    fill: rgb(245, 247, 250)
  .path19, .path20, .path21
    fill: rgb(237, 85, 101)

#icon-lang_fi
  .path1, .path2, .path3, .path4
    fill: rgb(245, 247, 250)
  .path5
    fill: rgb(71, 88, 169)

#icon-lang_lv
  .path1, .path2
    fill: rgb(180, 43, 57)
  .path3
    fill: rgb(245, 247, 250)

#icon-lang_ru
  .path1
    fill: rgb(74, 137, 220)
  .path2
    fill: rgb(245, 247, 250)
  .path3
    fill: rgb(237, 85, 101)