@import url('https://fonts.googleapis.com/css?family=Rationale');
/* this import should be first line in css file else add as <link> in html*/
.widget-clock.blue-light .digital {
    text-align: center;
}

.widget-clock.blue-light .time {
    font-family: 'Rationale', sans-serif;
    font-size: 3.0em;
    color: #1da4eb;
}

.widget-clock .digital {
    text-align: center
}

.widget-clock .time {
    font-family: 'Syncopate',sans-serif;
    font-size: 2.5em;
    margin: 0
}

.widget-clock .square {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%
}

.widget-clock svg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0
}

.widget-clock .clock-face {
    stroke: #333;
    fill: #fff
}

.widget-clock .minor {
    stroke: #999;
    stroke-width: .5
}

.widget-clock .major {
    stroke: #333;
    stroke-width: 1
}

.widget-clock .hour {
    stroke: #333
}

.widget-clock .minute {
    stroke: #666
}

.widget-clock .second {
    stroke: #1076ed
}

.widget-clock .second-counterweight {
    stroke: #1076ed;
    stroke-width: 3
}

.widget-clock.dark .clock-face {
    fill: #111
}

.widget-clock.dark .hour {
    stroke: #666
}

.widget-clock.dark .minute {
    stroke: #999
}
/*# sourceMappingURL=angular-clock.css.map */