.timer {
    /*margin-top: 10px;*/
    position: relative;
    display: none;
}

.timer .days-wrapper,
.timer .hours-wrapper,
.timer .minutes-wrapper,
.timer .seconds-wrapper {
    /*border:5px solid red;*/
    display: inline-block;
    width: 22%;
    height: content-box;
    margin: 0 .2%;
    padding-top: 20px;
    border: 1px solid red;
    font-size: .6em;
    -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;
    cursor: pointer;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

.timer .days-wrapper:hover,
.timer .hours-wrapper:hover,
.timer .minutes-wrapper:hover,
.timer .seconds-wrapper:hover {
    background: #e8643e;
    border: 1px solid #e8643e;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

.timer .days,
.timer .hours,
.timer .minutes,
.timer .seconds {
    font-size: 1em !important;
    font-weight: 100;
    line-height: 1;/**/
}
/*

@media (min-width: 992px) and (max-width: 1199px) {

}

@media (min-width: 768px) and (max-width: 991px) {

    .timer .days-wrapper, .timer .hours-wrapper, .timer .minutes-wrapper, .timer .seconds-wrapper {
        width: 140px; height: 140px; margin: 0 7px; padding-top: 20px;
    }
    .timer .days, .timer .hours, .timer .minutes, .timer .seconds { font-size: 60px; line-height: 70px; }
   
}

@media (max-width: 991px) {

}

@media (max-width: 767px) {

    .timer .days-wrapper, .timer .hours-wrapper, .timer .minutes-wrapper, .timer .seconds-wrapper {
        width: 140px; height: 140px; margin: 7px; padding-top: 20px;
    }
    .timer .days, .timer .hours, .timer .minutes, .timer .seconds { font-size: 60px; line-height: 70px; }
    
}

@media (max-width: 400px) {

}
*/