/*
Icon classes can be used entirely standalone. They are named after their original file names.

```html
<!-- `display: block` sprite -->
<div class="icon-home"></div>

<!-- `display: inline-block` sprite -->
<img class="icon-home" />
```
*/
.icon-site-de {
  display: inline-block;
  vertical-align: -16%;
  background-image: url(../sprites/site.png);
  background-position: 0px 0px;
  width: 25px;
  height: 14px;

  @media (-webkit-min-device-pixel-ratio: 2),
         (min-resolution: 192dpi) {
      background-image: url(../sprites/site@2x.png);
      background-size: 50px 28px;
    }
}
.icon-site-int {
  display: inline-block;
  vertical-align: -16%;
  background-image: url(../sprites/site.png);
  background-position: -25px 0px;
  width: 25px;
  height: 14px;

  @media (-webkit-min-device-pixel-ratio: 2),
         (min-resolution: 192dpi) {
      background-image: url(../sprites/site@2x.png);
      background-size: 50px 28px;
    }
}
.icon-site-uk {
  display: inline-block;
  vertical-align: -16%;
  background-image: url(../sprites/site.png);
  background-position: 0px -14px;
  width: 25px;
  height: 14px;

  @media (-webkit-min-device-pixel-ratio: 2),
         (min-resolution: 192dpi) {
      background-image: url(../sprites/site@2x.png);
      background-size: 50px 28px;
    }
}
.icon-site-us {
  display: inline-block;
  vertical-align: -16%;
  background-image: url(../sprites/site.png);
  background-position: -25px -14px;
  width: 25px;
  height: 14px;

  @media (-webkit-min-device-pixel-ratio: 2),
         (min-resolution: 192dpi) {
      background-image: url(../sprites/site@2x.png);
      background-size: 50px 28px;
    }
}
