.icon-pin, .icon-clock {

  float: left;

  margin-right: 18px;

}

.icon-pin {

  background-image: url(../img/spritesheet.png);

  background-position: 0px -240px;

  width: 18px;

  height: 19px;

  display: block;

}

.icon-clock {

  background-image: url(../img/spritesheet.png);

  background-position: -250px -141px;

  width: 18px;

  height: 18px;

  display: block;

  margin-bottom: 2rem;

}

.city-icon {

  width: 144px;

  height: 144px;

  display: block;

  margin: 24px auto;

  background-size: 100% auto;

  background-position: center center;

}

.city-icon-perth {

  background-image: url('../img/icons/city-icon-perth.jpg');

}

.city-icon-sydney {

  background-image: url('../img/icons/city-icon-sydney.jpg');

}

.city-icon-adelaide {

  background-image: url('../img/icons/city-icon-adelaide.jpg');

}

.city-icon-melbourne {

  background-image: url('../img/icons/city-icon-melbourne.jpg');

}

.city-icon-brisbane {

  background-image: url('../img/icons/city-icon-brisbane.jpg');

}

.city-icon-singapore {

  background-image: url('../img/icons/city-icon-singapore.jpg');

}

.btn-style {

  width: 32px;

  height: 32px;

  display: block;

  background-image: url(../img/spritesheet.png);

  float: left;

  margin-right: 2px;

}

.btn-style-f {

  background-position: 0px -188px;

}

.btn-style-t {

  background-position: -203px -89px;

}

.btn-style-li {

  background-position: -52px -188px;

}

/* -------------------------------------------------- Retina and other higher than standard dpi screens */

/* 1.25 dpr */

@media

(-webkit-min-device-pixel-ratio: 1.25),

(min-resolution: 120dpi){

  .icon-pin {

    background-image: url(../img/spritesheet-2x.png);

    background-size: 272px 259px;

  }

  .icon-clock {

    background-image: url(../img/spritesheet-2x.png);

    background-size: 272px 259px;

  }

  .btn-style {

    background-image: url(../img/spritesheet-2x.png);

    background-size: 272px 259px;

  }

}