﻿.ft {
    display: flex;
    /*font-family: Verdana, Geneva, Tahoma, sans-serif;*/
    font-size: 45px;
    font-weight: normal;
    line-height: 53px;
}

.ft-light .ft-digit {
    background: linear-gradient(to bottom, #FFF 38%,#CCC 100%);
    color: #000;
}

.ft-dark .ft-digit {
    background: #F0E0B6;
    color: #783C27;
    border-radius: 5px;
    margin: 3px;
    height: 42px !important;
}

.ft-warn.ft-light .ft-digit {
    background: linear-gradient(to bottom, #FFF 35%,#E17373 100%);
}

.ft-warn.ft-dark .ft-digit {
    background: linear-gradient(to bottom, #A74444 0%,#3F0000 67%);
}

.ft-digits {
    display: inline-block;
    margin: 0;
    padding: 0;
}

.ft-digit {
    border: 1px solid #783C27;
    border-left: none;
    display: inline-block;
    overflow: hidden;
}

    .ft-digit:first-child {
        border-left: 1px solid silver;
    }

.ft-space {
    display: inline-block;
    width: 11px;
}
.ft-delimiter {
    color: #fff;
}
.ft-delimiter::before {
    content: ':';
    display: inline-block;
}

.ft-shifter {
    list-style: none;
    margin: 0;
    padding:0px 10px;
    position: relative;
    top: -100%;
}

.ft-transit {
    top: 0;
    transition: top 400ms linear;
}

.ft-reverse .ft-shifter {
    top: -8px;
}

.ft-reverse .ft-transit {
    top: -100%;
}

.ft-caption {
    font-size: 25px;
    font-weight: 400;
    line-height: 0.2;
    text-align: center;
    color: #fff;
}
