.icon {
  display: inline-block;
  margin: 0 auto;
  vertical-align: middle; //a
  &--account {
    background: url('../images/ib/account.svg') no-repeat;
    height: 22px;
    width: 32px;
  }
  &--alert__success {
    background: url('../images/ib/alert-success.svg') no-repeat;
    height: 50px;
    width: 50px;
  }
  &--alert__warning {
    background: url('../images/ib/alert-warning.svg') no-repeat;
    height: 50px;
    width: 50px;
    &--small {
      background: url('../images/ib/alert-warning-small.svg') no-repeat;
      height: 50px;
      width: 50px;
    }
  }
  &--alert__error {
    background: url('../images/ib/alert-error.svg') no-repeat;
    height: 50px;
    width: 50px;
  }
  &--arr-left-purple {
    background: url('../images/ib/arr-left-purple.svg') no-repeat;
    width: 34px;
    height: 34px;
    vertical-align: middle;
  }
  &--arr-left-16 {
    background: url('../images/ib/arr-left-16.svg') no-repeat;
    width: 24px;
    height: 24px;
    vertical-align: middle;
  }
  &--atm {
    background: url('../images/nwp-icon/atm.svg') no-repeat;
    background-size: 100%;
    vertical-align: middle;
    width: 57px;
    height: 70px;
  } //b
  &--bank-branch {
    background: url('../images/nwp-icon/bank-branch.svg') no-repeat;
    background-size: 100%;
    width: 60px;
    height: 45px;
    vertical-align: middle;
  }
  &--bell {
    background: url('../images/ib/bell.svg') no-repeat;
    height: 20px;
    width: 20px;
  }
  &--big-cat {
    background: url('../images/kreditka/big-cat.svg') no-repeat;
    width: 60px;
    height: 60px;
    background-size: 100%;
  }
  &--big-pc {
    background: url('../images/kreditka/big-pc.svg') no-repeat;
    width: 60px;
    height: 60px;
    background-size: 100%;
  }
  &--big-spoon {
    background: url('../images/kreditka/big-spoon.svg') no-repeat;
    width: 60px;
    height: 60px;
    background-size: 100%;
  }
  &--big-tenis {
    background: url('../images/kreditka/big-tenis.svg') no-repeat;
    width: 60px;
    height: 60px;
    background-size: 100%;
  }
  &--big-house {
    background: url('../images/kreditka/big-house.svg') no-repeat;
    width: 60px;
    height: 60px;
    background-size: 100%;
  } //c
  &--cards {
    background: url('../images/ib/cards.svg') no-repeat;
    height: 19px;
    width: 31px;
  }
  &--clock {
    background: url('../images/kreditka/clock.svg') no-repeat;
    height: 60px;
    width: 60px;
    background-size: 100%;
  }
  &--close__small--white {
    background: url('../images/ib/close-white.svg') no-repeat;
    width: 10px;
    height: 10px;
    margin-left: 10px;
    background-size: 100%;
  }
  &--close__small--berry {
    background: url('../images/ib/cross-small-berry.svg') no-repeat;
    width: 16px;
    height: 16px;
    vertical-align: middle;
  }
  &--combine-shape {
    background: url('../images/kreditka/combine-shape.svg') no-repeat;
    width: 33px;
    height: 30px;
    vertical-align: middle;
  } //d
  &--dashboard {
    background: url('../images/ib/dashboard.svg') no-repeat;
    height: 26px;
    width: 30px;
  }
  &--delete-small-white {
    background: url('../images/ib/delete-small-white.svg') no-repeat;
    background-position: 3px -2px;
    width: 16px;
    height: 16px;
    vertical-align: middle;
  } //e
  &--exchange {
    background: url('../images/ib/exchange.svg') no-repeat;
    height: 19px;
    width: 31px;
  }
  &--eye-visible {
    background: url('../images/ib/eye-visible.svg') no-repeat;
    width: 24px;
    height: 24px;
    vertical-align: middle;
  }
  &--eye-big {
    background: url('../images/kreditka/eye.svg') no-repeat;
    width: 102px;
    height: 61px;
    vertical-align: middle;
  } //f
  &--form-big {
    background: url('../images/kreditka/form.svg') no-repeat;
    width: 71px;
    height: 71px;
    vertical-align: middle;
  } //g
  &--gift {
    background: url('../images/kreditka/gift.svg') no-repeat;
    height: 30px;
    width: 30px;
    background-size: 100%;
    vertical-align: middle;
  }
  &--gpay {
    background: url('../images/kreditka/gpay.svg') no-repeat;
    height: 30px;
    width: 30px;
    background-size: 100%;
    vertical-align: -webkit-baseline-middle;
  } //h
  &--hamburger {
    background: url('../images/hamburger.svg') no-repeat;
    width: 30px;
    height: 25px;
    vertical-align: middle;
    position: relative;
    top: 2px;
    right: 10px;
    background-size: 80%;
  }
  &--hand {
    background: url('../images/kreditka/hand.svg') no-repeat;
    height: 30px;
    width: 30px;
    background-size: 100%;
    vertical-align: middle;
  }
  &--home {
    background: url('../images/kreditka/home.svg') no-repeat;
    height: 30px;
    width: 30px;
    background-size: 100%;
    vertical-align: middle;
  } //ch
  &--check-white {
    background: url('../images/ib/check-white.svg') no-repeat;
    height: 35px;
    width: auto;
  } //i
  //j
  //k
  &--kontokorent {
    background: url('../images/ib/icon-kontokorent.svg') no-repeat;
    height: 33px;
    width: 41px;
    vertical-align: middle;
  }
  &--kreditka {
    background: url('../images/kreditka/kreditka.svg') no-repeat;
    width: 114px;
    height: 84px;
    vertical-align: middle;
  } //l
  &--location-ico {
    background: url('../images/icon-lab5/location-ico.svg') no-repeat;
    height: 120px;
    width: 80px;
    background-size: 100%;
  }
  &--logout {
    background: url('../images/ib/logout.svg') no-repeat;
    height: 19px;
    width: 14px;
  }
  &--logo-auto {
    background: url('../images/ib/logo-auto.svg') no-repeat; // idealni pomer
    height: 45px;
    width: 320px;
    fill: #fff;
  } //m
  &--moneta-ico-white {
    background: url('../images/icon-lab5/moneta-ico-white.svg') no-repeat;
    background-size: 100%;
    height: 50px;
    width: 40px;
  }
  &--moneta_simple_logo {
    background: url('../images/ib/moneta-simple-logo.svg') no-repeat;
    width: 50px;
    height: 50px;
  }
  &--money-hand {
    background: url('../images/nwp-icon/money-hand.svg') no-repeat;
    background-size: 100%;
    vertical-align: middle;
    width: 72px;
    height: 70px;
  } //n
  //o
  &--online-doc {
    background: url('../images/nwp-icon/online-doc.svg') no-repeat;
    background-size: 100%;
    width: 54px;
    height: 70px;
    vertical-align: middle;
  } //p
  &--pig {
    background: url('../images/ib/icon-pig.svg') no-repeat;
    height: 34px;
    width: 33px;
    vertical-align: middle;
  }
  &--phone {
    background: url('../images/icon-lab5/phone.svg') no-repeat;
    background-size: 100%;
    width: 30px;
    height: 30px;
  }
  &--phone-ring {
    background: url('../images/nwp-icon/phone-ring.svg') no-repeat;
    background-size: 100%;
    width: 40px;
    height: 45px;
    vertical-align: middle;
  }
  &--photo {
    background: url('../images/kreditka/photo.svg') no-repeat;
    width: 100px;
    height: 80px;
    vertical-align: middle;
  }
  &--plane {
    background: url('../images/kreditka/plane.svg') no-repeat;
    height: 30px;
    width: 30px;
    vertical-align: middle;
    background-size: 100%;
  }
  &--plus {
    background: url('../images/ib/plus.svg') no-repeat;
    background-size: 100%;
    width: 24px;
    height: 24px;
  } //q
  //r
  &--refinancing {
    background: url('../images/ib/refinancing.svg') no-repeat;
    height: 23px;
    width: 31px;
  } //s
  &--savings {
    background: url('../images/ib/savings.svg') no-repeat;
    height: 29px;
    width: 31px;
  }
  &--search {
    background: url('../images/ib/search-passive.svg') no-repeat;
    height: 24px;
    width: 24px;
  }
  &--search-active {
    background: url('../images/ib/search-active.svg') no-repeat;
    height: 24px;
    width: 24px;
  }
  &--send {
    background: url('../images/kreditka/send.svg') no-repeat;
    height: 30px;
    width: 30px;
    background-size: 100%;
    vertical-align: middle;
  }
  &--state-ok {
    background: url('../images/ib/checked.svg') no-repeat;
  }
  &--state-x {
    background: url('../images/ib/close.svg') no-repeat;
  }
  &--settings {
    background: url('../images/ib/icon-settings.svg') no-repeat;
    height: 23px;
    width: 30px;
    background-size: 100%;
    vertical-align: middle;
    margin-right: 5px;
  }
  &--sad-face {
    background: url('../images/icon-lab5/sad-face.svg') no-repeat;
    height: 60px;
    width: 60px;
    background-size: 100%;
    float: left;
    margin-right: 15px;
  }
  &--shield-logo {
    background: url('../images/icon-lab5/shield-logo.svg') no-repeat;
    background-size: 100%;
    height: 100px;
    width: 81px;
  }
  &--shield {
    background: url('../images/icon-lab5/shield.svg') no-repeat;
    background-size: 100%;
    height: 100px;
    width: 81px;
  }
  &--shield-outline {
    background: url('../images/icon-lab5/shield-outline.svg') no-repeat;
    width: 25px;
    height: 39px;
    background-size: 100%;
    vertical-align: middle;
  } //t
  &--tooltip-16 {
    background: url('../images/ib/tooltip.svg') no-repeat;
    height: 16px;
    width: 16px;
    vertical-align: middle;
  } //u
  &--uver {
    background: url('../images/kreditka/uver.svg') no-repeat;
    width: 141px;
    height: 114px;
    vertical-align: middle;
  }
  &--user {
    background: url('../images/ib/user.svg') no-repeat;
    height: 35px;
    width: 35px;
    vertical-align: middle;
  }
}

//vyhledavani podle abecedy ctrl F nebo command F hledej podle //pismeno abecedy
/// patternlab Icony
.icon {
  display: inline-block;
  margin: 0 auto; //a
  &--accounts {
    background: url('../images/pl-icon/accounts.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--arr-back {
    background: url('../images/pl-icon/arr-back.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 18px;
  height: 14px;
  }
  &--arr-down {
    background: url('../images/pl-icon/arr-down.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 13px;
  }
  &--arr-left {
    background: url('../images/pl-icon/arr-left.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--arr-right {
    background: url('../images/pl-icon/arr-right.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--arr-up {
    background: url('../images/pl-icon/arr-up.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 13px;
  }
  &--applicant {
    background: url('../images/pl-icon/zadatele.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  &--auto {
    background: url('../images/pl-icon/auto.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //b
  &--back-active {
    background: url('../images/pl-icon/back-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--back-inactive {
    background: url('../images/pl-icon/back-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //c
  &--calculator {
    background: url('../images/pl-icon/calculator.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--calendar {
    background: url('../images/pl-icon/calendar.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--camera {
    background: url('../images/pl-icon/camera.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--camera-active {
    background: url('../images/pl-icon/camera-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--camera-person {
    background: url('../images/pl-icon/camera-person.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--camera-person-active {
    background: url('../images/pl-icon/camera-person-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--card {
    background: url('../images/pl-icon/card.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--close {
    background: url('../images/pl-icon/close.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--confirmation {
    background: url('../images/pl-icon/potvrzeni.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--credit {
    background: url('../images/pl-icon/credit.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--creditcard {
    background: url('../images/pl-icon/creditcard.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //d
  &--document {
    background: url('../images/pl-icon/dokumenty.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--documents {
    background: url('../images/pl-icon/doklady.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--documents-active {
    background: url('../images/pl-icon/documents-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--documents-inactive {
    background: url('../images/pl-icon/documents-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--done-green {
    background: url('../images/pl-icon/done-green.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--delete {
    background: url('../images/pl-icon/delete.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--dovolena {
    background: url('../images/pl-icon/dovolena.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--download {
    background: url('../images/pl-icon/download.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--dropdown {
    background: url('../images/pl-icon/dropdown.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  } //e
  &--edit {
    background: url('../images/pl-icon/edit.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--exchange {
    background: url('../images/pl-icon/exchange.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--expand {
    background: url('../images/pl-icon/expand.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--email {
    background-image: url('../images/pl-icon/email.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--elektroinstalace {
    background-image: url('../images/pl-icon/elektroinstalace.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--elektronika-SIB {
    background-image: url('../images/pl-icon/elektronika-SIB.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--eye-open {
    background-image: url('../images/pl-icon/eye-open.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 15px;
  }
  &--eye-closed {
    background-image: url('../images/pl-icon/eye-closed.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 15px;
  }
  //f
  &--faq {
    background: url('../images/pl-icon/faqs.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--favorite {
    background: url('../images/pl-icon/favorite.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  } //g
  //h
  &--history {
    background: url('../images/pl-icon/history.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--home {
    background: url('../images/pl-icon/home.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  //ch
  &--chat {
    background: url('../images/pl-icon/chat.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--check {
    background: url('../images/pl-icon/check.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--check-filled {
    background: url('../images/pl-icon/check-filled.svg');
    background-size: 99%;
    background-repeat: no-repeat;
    border-radius: 1000px;
    width: 25px;
    height: 25px;
  }
  &--checkbox-checked {
    background: url('../images/pl-icon/checkbox-checked.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--checkbox {
    background: url('../images/pl-icon/checkbox.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //i
  &--income {
    background: url('../images/pl-icon/prijem.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  &--info {
    background: url('../images/pl-icon/info.svg');
    background-size: 100%;
    width: 16px;
    height: 16px;
    vertical-align: middle;
  }
  &--info_SIB {
    background: url('../images/pl-icon/info_SIB.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--info-bubble {
    background: url('../images/pl-icon/info-bubble.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  //j
  //k
  //l
  &--like {
    background: url('../images/pl-icon/like.svg');
    width: 16px;
    height: 15px;
    background-size: 100%;
  }
  &--lock {
    background: url('../images/pl-icon/lock.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--list-bullet-icon {
    background: url('../images/pl-icon/list-bullet-icon.svg');
    background-size: 100%;
    background-position: 0 -2px;
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  &--loan {
    background: url('../images/pl-icon/loan.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--logout-active {
    background: url('../images/pl-icon/logout-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--logout-inactive {
    background: url('../images/pl-icon/logout-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //m
  &--message-active {
    background: url('../images/pl-icon/message-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--message-inactive {
    background: url('../images/pl-icon/message-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--money {
    background: url('../images/pl-icon/obchody.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--more {
    background: url('../images/pl-icon/more.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--menu {
    background: url('../images/pl-icon/menu.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--message {
    background: url('../images/pl-icon/message.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--minus {
    background: url('../images/pl-icon/minus.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //n
  &--nabytek {
    background-image: url('../images/pl-icon/nabytek.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--new-window {
    background: url('../images/pl-icon/open-link.svg');
    width: 25px;
    height: 16px;
    position: relative;
    top: -6px;
  }
  //o
  &--old-tick {
    background: url('../images/pl-icon/old-tick.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--ongoing {
    background: url('../images/pl-icon/ongoing.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--other {
    background-image: url('../images/pl-icon/other.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--outcome {
    background: url('../images/pl-icon/vydaj.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  &--outgoing {
    background: url('../images/pl-icon/outgoing.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //p
  &--pay-me {
    background: url('../images/pl-icon/pay-me.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--pay {
    background: url('../images/pl-icon/pay.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--pdf-SIB {
    background: url('../images/pl-icon/PDF_SIB.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--phone {
    background: url('../images/pl-icon/phone.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--phone-IB {
    background: url('../images/pl-icon/phone_IB.svg');
    background-size: 100%;
    width: 24px;
    height: 24px;
  }
  &--phone-SIB {
    background: url('../images/pl-icon/phone_SIB.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--phone-blue {
    background: url('../images/pl-icon/phone-blue.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--photogalery {
    background: url('../images/pl-icon/fotogalerie.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--pdf {
    background: url('../images/pl-icon/PDF.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--pin {
    background: url('../images/pl-icon/pin.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--plus {
    background: url('../images/pl-icon/plus.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--person {
    background: url('../images/pl-icon/zadatel.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--person-active {
    background: url('../images/pl-icon/person-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--person-inactive {
    background: url('../images/pl-icon/person-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--pledge {
    background: url('../images/pl-icon/zastava.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--pojisteni {
    background-image: url('../images/pl-icon/pojisteni.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //q
  //r
  &--radio-checked {
    background: url('../images/pl-icon/radio-checked.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--radio {
    background: url('../images/pl-icon/radio.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--red-cross {
    background: url('../images/pl-icon/red-cross.svg');
    background-size: 100%;
    width: 16px;
    height: 16px;
  }
  &--refresh {
    background: url('../images/pl-icon/refresh.svg');
    background-size: 100%;
    width: 16px;
    height: 16px;
  }
  &--rekonstrukce {
    background-image: url('../images/pl-icon/rekonstrukce.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--rezerva {
    background-image: url('../images/pl-icon/rezerva.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //s
  &--saving-account {
    background: url('../images/pl-icon/saving-account.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--search {
    background: url('../images/pl-icon/search.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--settings {
    background: url('../images/pl-icon/settings.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--sign-out {
    background: url('../images/pl-icon/sign-out.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--sipo {
    background: url('../images/pl-icon/SIPO.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--smartbanka {
    background: url('../images/pl-icon/smartbanka.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--smartphone {
    background: url('../images/pl-icon/smartphone.svg');
    background-size: 100%;
    width: 40px;
    background-repeat: no-repeat;
    height: 60px;
  }
  &--sms {
    background: url('../images/pl-icon/SMS.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--sort {
    background: url('../images/pl-icon/sort.svg');
    width: 8px;
    background-repeat: no-repeat;
    height: 19px;
    &:hover {
      background: url('../images/pl-icon/sort-hover.svg');
      background-repeat: no-repeat;
    }
  }
  &--sort-ascending {
    background: url('../images/pl-icon/sort-ascending.svg');
    background-size: 100%;
    width: 8px;
    background-repeat: no-repeat;
    height: 19px;
  }

  &--sort-descending {
    background: url('../images/pl-icon/sort-descending.svg');
    background-size: 100%;
    width: 8px;
    background-repeat: no-repeat;
    height: 19px;
  }
  &--standing-order {
    background: url('../images/pl-icon/standing-order.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--stopwatch {
    background: url('../images/pl-icon/stopky.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
  }
  &--studium {
    background-image: url('../images/pl-icon/studium.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //t
  &--tick-old {
    background: url('../images/pl-icon/tick.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--tick-done {
    background: url('../images/pl-icon/tick-done.svg');
    background-size: 98%;
    background-repeat: no-repeat;
    width: 25px;
    height: 28px;
    border-radius: 1000px;
  }
  &--tick-ok {
    background: url('../images/pl-icon/tick-green.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //u
  &--upload {
    background: url('../images/pl-icon/upload.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--usa {
    background: url('../images/pl-icon/usa.svg');
    background-size: 100%;
    width: 24px;
    height: 24px;
  }
  &--user-active {
    background: url('../images/pl-icon/user-active.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  &--user-inactive {
    background: url('../images/pl-icon/user-inactive.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  } //v
  &--vybaveni {
    background-image: url('../images/pl-icon/vybaveni.svg');
    background-size: 100%;
    width: 25px;
    height: 25px;
  }
  //w
  //x
  //y
  //z
}

.menu-left {
  .icon {
    display: block;
  }
}

.collapse {
  ul {
    .icon {
      float: left;
      position: absolute;
      left: 0;
    }
  }
}

.login-logo {
  @extend .mb-4;
  @extend .mb-4;
  @extend .text-center;
}

.icon--sm {
  width: 15px;
  height: 15px;
}
.icon--md {
  width: 35px;
  height: 35px;
}
.icon--lg {
  width: 45px;
  height: 45px;
  vertical-align: middle;
}
.icon-va-b {
  vertical-align: text-bottom;
}
.icon-va-sub {
  vertical-align: sub;
}