/* Rolex Clock CSS - Minimal and Clean */

/* Rolex Font Declarations */
@font-face {
  font-family: 'rolex-light';
  font-weight: 300;
  src: url('RolexFont-Light-WebXL.woff') format("woff"), url('RolexFont-Light-WebXL.woff2') format("woff2");
}

@font-face {
  font-family: 'rolex-regular';
  font-weight: 300;
  src: url('rolexfont-regular-webfont.woff') format("woff"), url('rolexfont-regular-webfont.woff2') format("woff2");
}

/* Rolex Watch Face - Clock Background Image */
/* This is required by rolex-core.js for the watch face background */
.rolex-watch-face .clock {
  background: url("images/clock/white/70.png") no-repeat scroll 0 0 transparent;
  display: block;
  position: absolute;
  top: 50%;
  left: 25%;
  z-index: 50;
  overflow: hidden;
  width: 70px;
  height: 70px;
  margin-top: -35px;
  margin-left: -35px;
}

/* Retina display support */
@media only screen and (-webkit-min-device-pixel-ratio:2),
only screen and (min-device-pixel-ratio:2),
only screen and (min-resolution:192dpi),
only screen and (min-resolution:2dppx) {
  .rolex-watch-face .clock {
    background: url("images/clock/white/70_retina.png") no-repeat scroll 0 0 transparent;
    background-size: 100% 100%;
  }
}

/* Container styling required by rolex-core.js */
.rolex-watch-face .container {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  margin: 0;
}

.rolex-watch-face .content {
  position: relative;
  display: block;
  overflow: hidden;
  height: 100%;
  width: 100%;
}

.rolex-watch-face .content a {
  cursor: pointer;
  display: inline-block;
  position: relative;
  text-decoration: none;
  z-index: 100;
}
