@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{
    width: 150px;
    top: 26px;
    position: relative;
    left: 31px;
}
.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%
}
.time{
    font-size: 22px;
    position: absolute;
    bottom: 16px;
    left: 33px;
    display: none;
}
.time .hours{
    font-size:20px;
}
.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 */