/**
 *	This element is created inside your target element
 *	It is used so that your own element will not need to be altered
 **/
.time_circles {
    position: relative;
    width: 100%;
    height: 100%;
}

/**
 *	This is all the elements used to house all text used
 * in time circles
 **/
.time_circles > div {
    position: absolute;
    text-align: center;
}

/**
 *	Titles (Days, Hours, etc)
 **/
.time_circles > div > i {
    margin: 13px 0 0 0;
    padding: 0;
    text-align: center;
    font-family:'Roboto-Regular';
    font-size: 14px;
    font-style: normal;
    display: block;
}

/**
 *	Time numbers, ie: 12
 **/
.time_circles > div > span {
    width: 37px;
    height: 37px;
    margin: -9px 0 0 13.4px;
    padding: 0;
    display: block;
    text-align: center;
    font-family:'Roboto-Bold';
    line-height: 40px;
    color: #ff6600;
    font-size: 22px;
    font-weight: bold;
    -webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;
    background: #f3f3f3;
}