/* Core */

.smart-timer-and-counter .stc-group-label.stc-label-top {
    margin-top: 3px;
    margin-bottom: 7px
}

.smart-timer-and-counter .stc-group-label.stc-label-bottom {
   /* margin-top: 7px;*/
    margin-bottom: 3px
}

.smart-timer-and-counter .stc-digit {
    display: inline-block
}

.smart-timer-and-counter .stc-divider-dot,
.smart-timer-and-counter .stc-divider-space,
.smart-timer-and-counter .stc-divider-period,
.smart-timer-and-counter .stc-divider-line,
.smart-timer-and-counter .stc-divider-colon,
.smart-timer-and-counter .stc-divider-comma {
    position: relative
}

.smart-timer-and-counter .stc-divider-dot:after,
.smart-timer-and-counter .stc-divider-period:after,
.smart-timer-and-counter .stc-divider-colon:before,
.smart-timer-and-counter .stc-divider-colon:after {
    opacity: 1;
    background-color: #000;
    border-radius: 50%;
    content: "";
    height: 5px;
    width: 5px;
    left: 50%;
    top: 66%;
    margin-left: -3px;
    position: absolute
}

.smart-timer-and-counter .stc-divider-comma:after {
    border-color: #000 transparent;
    border-radius: 3px 3px 0 0;
    border-style: solid;
    border-width: 6px 6px 0 0;
    content: "";
    height: 1px;
    left: 50%;
    margin-left: -5px;
    opacity: 1;
    position: absolute;
    top: 66%;
    transform: rotate(90deg);
    width: 3px
}

.smart-timer-and-counter .stc-divider-dot:before {
    top: 50%
}

.smart-timer-and-counter .stc-divider-colon:before {
    top: 33%
}

.smart-timer-and-counter .stc-divider-line:after {
    opacity: 1;
    background-color: #000;
    border-radius: 100%;
    content: "";
    height: 50%;
    width: 2px;
    left: 50%;
    top: 25%;
    margin-left: -1px;
    position: absolute
}

.smart-timer-and-counter .stc-divider-dot.stc-off:after,
.smart-timer-and-counter .stc-divider-dot.stc-off:before,
.smart-timer-and-counter .stc-divider-period.stc-off:after,
.smart-timer-and-counter .stc-divider-colon.stc-off:before,
.smart-timer-and-counter .stc-divider-colon.stc-off:after,
.smart-timer-and-counter .stc-divider-line.stc-off:after,
.smart-timer-and-counter .stc-divider-comma.stc-off:after {
    opacity: .1
}


/* Skins */

.stc-skin-simple {
    font-size: 10px;
    line-height: 21px
}

.stc-skin-simple .sct-after {
    clear: both
}

.stc-skin-simple .stc-group,
.stc-skin-simple .stc-divider {
    float: left;
    text-align: center;
	padding-left: 7px;
}

.stc-skin-simple .stc-group-digits,
.stc-skin-simple .stc-group-label {
    clear: both
}

.stc-skin-simple .stc-group-digits {
    /*padding: 15px 0 0 0;*/
}

.stc-skin-simple .stc-divider-dot,
.stc-skin-simple .stc-divider-space,
.stc-skin-simple .stc-divider-period,
.stc-skin-simple .stc-divider-colon,
.stc-skin-simple .stc-divider-line,
.stc-skin-simple .stc-divider-comma {
    height: 5em
}

.stc-skin-simple .stc-digit {
    font-size: 1em
}

.stc-skin-simple.stc-style-plain-white {
    color: #222
}

.stc-skin-simple.stc-style-plain-white .stc-group-digits {
    background-color: #fff
}

.stc-skin-simple.stc-style-plain-white .stc-group-label {
    background-color: #fff;
    font-size: .8em;
    line-height: 1.5em;
    margin-left: .75em;
    margin-right: .75em
}

.stc-skin-simple.stc-style-elegant-white {
    font-weight: 700;
    color: #222
}

.stc-skin-simple.stc-style-elegant-white .stc-group-digits {
    background-color: #fff;
    box-shadow: 0 0 2px rgba(64, 64, 64, .5);
    border-radius: 5px
}

.stc-skin-simple.stc-style-elegant-white .stc-group-label {
    background-color: #fff;
    box-shadow: 0 0 2px rgba(64, 64, 64, .5);
    border-radius: 5px;
    font-size: .8em;
    line-height: 1.5em;
    margin-left: .75em;
    margin-right: .75em
}

.stc-skin-simple.stc-style-elegant-white .stc-divider-dot:after,
.stc-skin-simple.stc-style-elegant-white .stc-divider-period:after,
.stc-skin-simple.stc-style-elegant-white .stc-divider-colon:before,
.stc-skin-simple.stc-style-elegant-white .stc-divider-colon:after,
.stc-skin-simple.stc-style-elegant-white .stc-divider-line:after {
    background-color: #fff;
    box-shadow: 0 0 2px rgba(64, 64, 64, .7)
}

.stc-skin-simple.stc-style-crystal-light {
    font-weight: 600;
    color: #111;
	margin:0 auto;
}

.stc-skin-simple.stc-style-crystal-light .stc-group-digits {
    border-radius: 6px 6px 0 0;
    border: 1px solid #919191;
    border-bottom: 0;
	line-height:0;
}

.stc-skin-simple.stc-style-crystal-light .stc-group-label {
    border-radius: 0 0 6px 6px;
    border: 1px solid #919191;
	border-top:0;
    margin: 0!important;
    padding: .3em .3em 0 .3em;
	color: #919191;
}

.stc-skin-simple.stc-style-crystal-dark {
    font-weight: 700;
    color: #fff
}

.stc-skin-simple.stc-style-crystal-dark .stc-group-digits {
    border-radius: 6px 6px 0 0;
    background-color: rgba(32, 32, 32, .6);
    padding: .5em 1.5em
}

.stc-skin-simple.stc-style-crystal-dark .stc-group-label {
    border-radius: 0 0 6px 6px;
    border-top: 1px solid rgba(32, 32, 32, .9);
    margin: 0!important;
    padding: .3em;
    background-color: rgba(32, 32, 32, .8)
}

.stc-skin-simple.stc-style-chrome-light {
    font-weight: 700;
    color: #000
}

.stc-skin-simple.stc-style-chrome-light .stc-group-digits {
    text-shadow: 1px 1px 0 hsla(0, 0, 100%, .7);
    border-radius: 6px;
    border: 3px solid #000;
    padding: .5em 1.2em;
    background: #fff;
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(241, 241, 241, 1) 50%, rgba(225, 225, 225, 1) 51%, rgba(246, 246, 246, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(50%, rgba(241, 241, 241, 1)), color-stop(51%, rgba(225, 225, 225, 1)), color-stop(100%, rgba(246, 246, 246, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(241, 241, 241, 1) 50%, rgba(225, 225, 225, 1) 51%, rgba(246, 246, 246, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(241, 241, 241, 1) 50%, rgba(225, 225, 225, 1) 51%, rgba(246, 246, 246, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(241, 241, 241, 1) 50%, rgba(225, 225, 225, 1) 51%, rgba(246, 246, 246, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(241, 241, 241, 1) 50%, rgba(225, 225, 225, 1) 51%, rgba(246, 246, 246, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#f6f6f6", GradientType=0)
}

.stc-skin-simple.stc-style-chrome-dark {
    font-weight: 700;
    color: #fff
}

.stc-skin-simple.stc-style-chrome-dark .stc-group-digits {
    text-shadow: 1px 1px 0 rgba(128, 128, 128, .8);
    border-radius: 6px;
    border: 3px solid #fff;
    padding: .5em 1.2em;
    background: #171717;
    background: -moz-linear-gradient(top, rgba(23, 23, 23, 1) 0%, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 51%, rgba(17, 17, 17, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(23, 23, 23, 1)), color-stop(50%, rgba(34, 34, 34, 1)), color-stop(51%, rgba(0, 0, 0, 1)), color-stop(100%, rgba(17, 17, 17, 1)));
    background: -webkit-linear-gradient(top, rgba(23, 23, 23, 1) 0%, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 51%, rgba(17, 17, 17, 1) 100%);
    background: -o-linear-gradient(top, rgba(23, 23, 23, 1) 0%, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 51%, rgba(17, 17, 17, 1) 100%);
    background: -ms-linear-gradient(top, rgba(23, 23, 23, 1) 0%, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 51%, rgba(17, 17, 17, 1) 100%);
    background: linear-gradient(to bottom, rgba(23, 23, 23, 1) 0%, rgba(34, 34, 34, 1) 50%, rgba(0, 0, 0, 1) 51%, rgba(17, 17, 17, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#171717", endColorstr="#111111", GradientType=0)
}

.stc-skin-simple.stc-style-chrome-green {
    font-weight: 700;
    color: #013700
}

.stc-skin-simple.stc-style-chrome-green .stc-group-digits {
    text-shadow: 1px 1px 0 hsla(0, 0, 100%, .7);
    border-radius: 6px;
    border: 3px solid #013700;
    padding: .5em 1.2em;
    background: #bfd255;
    background: -moz-linear-gradient(top, rgba(191, 210, 85, 1) 0%, rgba(142, 185, 42, 1) 50%, rgba(114, 170, 0, 1) 51%, rgba(158, 203, 45, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(191, 210, 85, 1)), color-stop(50%, rgba(142, 185, 42, 1)), color-stop(51%, rgba(114, 170, 0, 1)), color-stop(100%, rgba(158, 203, 45, 1)));
    background: -webkit-linear-gradient(top, rgba(191, 210, 85, 1) 0%, rgba(142, 185, 42, 1) 50%, rgba(114, 170, 0, 1) 51%, rgba(158, 203, 45, 1) 100%);
    background: -o-linear-gradient(top, rgba(191, 210, 85, 1) 0%, rgba(142, 185, 42, 1) 50%, rgba(114, 170, 0, 1) 51%, rgba(158, 203, 45, 1) 100%);
    background: -ms-linear-gradient(top, rgba(191, 210, 85, 1) 0%, rgba(142, 185, 42, 1) 50%, rgba(114, 170, 0, 1) 51%, rgba(158, 203, 45, 1) 100%);
    background: linear-gradient(to bottom, rgba(191, 210, 85, 1) 0%, rgba(142, 185, 42, 1) 50%, rgba(114, 170, 0, 1) 51%, rgba(158, 203, 45, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#bfd255", endColorstr="#9ecb2d", GradientType=0)
}

.stc-skin-simple.stc-style-chrome-sky {
    font-weight: 700;
    color: #003b71
}

.stc-skin-simple.stc-style-chrome-sky .stc-group-digits {
    text-shadow: 1px 1px 0 hsla(0, 0, 100%, .7);
    border-radius: 6px;
    border: 3px solid #003b71;
    padding: .5em 1.2em;
    background: #b8e1fc;
    background: -moz-linear-gradient(top, rgba(184, 225, 252, 1) 0%, rgba(169, 210, 243, 1) 10%, rgba(144, 186, 228, 1) 25%, rgba(144, 188, 234, 1) 37%, rgba(144, 191, 240, 1) 50%, rgba(107, 168, 229, 1) 51%, rgba(162, 218, 245, 1) 83%, rgba(189, 243, 253, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(184, 225, 252, 1)), color-stop(10%, rgba(169, 210, 243, 1)), color-stop(25%, rgba(144, 186, 228, 1)), color-stop(37%, rgba(144, 188, 234, 1)), color-stop(50%, rgba(144, 191, 240, 1)), color-stop(51%, rgba(107, 168, 229, 1)), color-stop(83%, rgba(162, 218, 245, 1)), color-stop(100%, rgba(189, 243, 253, 1)));
    background: -webkit-linear-gradient(top, rgba(184, 225, 252, 1) 0%, rgba(169, 210, 243, 1) 10%, rgba(144, 186, 228, 1) 25%, rgba(144, 188, 234, 1) 37%, rgba(144, 191, 240, 1) 50%, rgba(107, 168, 229, 1) 51%, rgba(162, 218, 245, 1) 83%, rgba(189, 243, 253, 1) 100%);
    background: -o-linear-gradient(top, rgba(184, 225, 252, 1) 0%, rgba(169, 210, 243, 1) 10%, rgba(144, 186, 228, 1) 25%, rgba(144, 188, 234, 1) 37%, rgba(144, 191, 240, 1) 50%, rgba(107, 168, 229, 1) 51%, rgba(162, 218, 245, 1) 83%, rgba(189, 243, 253, 1) 100%);
    background: -ms-linear-gradient(top, rgba(184, 225, 252, 1) 0%, rgba(169, 210, 243, 1) 10%, rgba(144, 186, 228, 1) 25%, rgba(144, 188, 234, 1) 37%, rgba(144, 191, 240, 1) 50%, rgba(107, 168, 229, 1) 51%, rgba(162, 218, 245, 1) 83%, rgba(189, 243, 253, 1) 100%);
    background: linear-gradient(to bottom, rgba(184, 225, 252, 1) 0%, rgba(169, 210, 243, 1) 10%, rgba(144, 186, 228, 1) 25%, rgba(144, 188, 234, 1) 37%, rgba(144, 191, 240, 1) 50%, rgba(107, 168, 229, 1) 51%, rgba(162, 218, 245, 1) 83%, rgba(189, 243, 253, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#b8e1fc", endColorstr="#bdf3fd", GradientType=0)
}

.stc-skin-simple.stc-style-metallic-orange {
    font-weight: 700
}

.stc-skin-simple.stc-style-metallic-orange .stc-group-digits {
    border: solid 1px #f90;
    border-radius: 5px;
    padding: .5em 1.5em;
    text-shadow: 0 1px 1px #8c4a04;
    color: #fff;
    background-image: -webkit-linear-gradient(top, #ffbb34 0%, #ffa734 25%, #ff8d02 55%, #ff7002 100%);
    background-image: -moz-linear-gradient(top, #ffbb34 0%, #ffa734 25%, #ff8d02 55%, #ff7002 100%);
    background-image: -ms-linear-gradient(top, #ffbb34 0%, #ffa734 25%, #ff8d02 55%, #ff7002 100%);
    background-image: -o-linear-gradient(top, #ffbb34 0%, #ffa734 25%, #ff8d02 55%, #ff7002 100%);
    background-image: linear-gradient(top, #ffbb34 0%, #ffa734 25%, #ff8d02 55%, #ff7002 100%);
    box-shadow: 0 1px 0 0 #ffebba, 0 5px 0 0 #d56000, 0 6px 3px 0 #7a7a7a
}

.stc-skin-simple.stc-style-metallic-orange .stc-group-label {
    color: #d53100;
    font-size: 1.2em
}

.stc-skin-simple.stc-style-metallic-blue {
    font-weight: 700
}

.stc-skin-simple.stc-style-metallic-blue .stc-group-digits {
    border: solid 1px #007bff;
    border-radius: 5px;
    padding: .5em 1.5em;
    text-shadow: 0 1px 1px #042a8a;
    color: #fff;
    background-image: -webkit-linear-gradient(top, #36bfff 5%, #36a1ff 25%, #03a7ff 55%, #03afff 100%);
    background-image: -moz-linear-gradient(top, #36bfff 5%, #36a1ff 25%, #03a7ff 55%, #03afff 100%);
    background-image: -ms-linear-gradient(top, #36bfff 5%, #36a1ff 25%, #03a7ff 55%, #03afff 100%);
    background-image: -o-linear-gradient(top, #36bfff 5%, #36a1ff 25%, #03a7ff 55%, #03afff 100%);
    background-image: linear-gradient(top, #36bfff 5%, #36a1ff 25%, #03a7ff 55%, #03afff 100%);
    box-shadow: 0 1px 0 0 #badbff, 0 5px 0 0 #0066d4, 0 6px 3px 0 #7a7a7a
}

.stc-skin-simple.stc-style-metallic-blue .stc-group-label {
    color: #0031d5;
    font-size: 1.2em
}

.stc-skin-simple.stc-style-metallic-red {
    font-weight: 700
}

.stc-skin-simple.stc-style-metallic-red .stc-group-digits {
    border: solid 1px red;
    border-radius: 5px;
    padding: .5em 1.5em;
    text-shadow: 0 1px 1px #8a0404;
    color: #fff;
    background-image: -webkit-linear-gradient(top, #fa4949 5%, #f53831 25%, #f52323 55%, #ff1403 100%);
    background-image: -moz-linear-gradient(top, #fa4949 5%, #f53831 25%, #f52323 55%, #ff1403 100%);
    background-image: -ms-linear-gradient(top, #fa4949 5%, #f53831 25%, #f52323 55%, #ff1403 100%);
    background-image: -o-linear-gradient(top, #fa4949 5%, #f53831 25%, #f52323 55%, #ff1403 100%);
    background-image: linear-gradient(top, #fa4949 5%, #f53831 25%, #f52323 55%, #ff1403 100%);
    box-shadow: 0 1px 0 0 #fc9c9c, 0 5px 0 0 #b00000, 0 6px 3px 0 #7a7a7a
}

.stc-skin-simple.stc-style-metallic-red .stc-group-label {
    color: #b00000;
    font-size: 1.2em
}

.stc-skin-simple.stc-style-metallic-gray {
    font-weight: 700
}

.stc-skin-simple.stc-style-metallic-gray .stc-group-digits {
    border: solid 1px #cfcfcf;
    border-color: #cfcfcf #bdbdbd #f0f0f0 #bdbdbd;
    padding: .5em 1.5em;
    border-radius: 5px;
    color: #646464;
    text-shadow: 0 1px 0 #fff;
    background-color: #fff;
    background-image: -webkit-linear-gradient(top, #f0f0f0 16%, #d1d1d1 100%);
    background-image: -moz-linear-gradient(top, #f0f0f0 16%, #d1d1d1 100%);
    background-image: -ms-linear-gradient(top, #f0f0f0 16%, #d1d1d1 100%);
    background-image: -o-linear-gradient(top, #f0f0f0 16%, #d1d1d1 100%);
    background-image: linear-gradient(top, #f0f0f0 16%, #d1d1d1 100%);
    box-shadow: 0 5px 0 0 #a1a1a1, 0 5px 0 0 #ebebeb, 0 6px 3px 0 #dbdbdb
}

.stc-skin-simple.stc-style-metallic-gray .stc-group-label {
    color: #646464;
    font-size: 1.2em
}

.stc-skin-simple.stc-style-round-gray .stc-group-digits {
    background-color: #f7f7f7;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
    background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
    height: 4em;
    width: 4em;
    line-height: 4em;
    border-radius: 50%;
    box-shadow: 0 2px 6px #878787, inset 0 2px 2px #fff;
    padding: 1em;
    margin: 1em;
    position: relative
}

.stc-skin-simple.stc-style-round-gray .stc-group-digits:before {
    background: none repeat scroll 0 0 #eee;
    border-radius: 50% 50% 50% 50%;
    border-top: 2px solid #ddd;
    bottom: -1em;
    box-shadow: 0 6px 32px #ddd inset;
    content: "";
    display: block;
    left: -1em;
    position: absolute;
    right: -1em;
    top: -1em;
    z-index: -1
}

.stc-skin-simple.stc-style-round-gray .stc-digit {
    font-size: 2.2em;
    font-weight: 700
}

.stc-skin-simple.stc-style-round-gray .stc-divider-dot,
.stc-skin-simple.stc-style-round-gray .stc-divider-space,
.stc-skin-simple.stc-style-round-gray .stc-divider-period,
.stc-skin-simple.stc-style-round-gray .stc-divider-colon,
.stc-skin-simple.stc-style-round-gray .stc-divider-line {
    height: 8em
}

.stc-skin-simple.stc-style-round-gray {
    padding: 1em;
    background-color: #f8f8f8;
    border-radius: 1em;
    z-index: 0;
    position: relative;
    border: 4px solid #878787;
    overflow: hidden
}

.stc-skin-simple.stc-style-round-gray .stc-digits-3 .stc-digit {
    font-size: 1.8em
}

.stc-skin-simple.stc-style-round-gray .stc-digits-4 .stc-digit {
    font-size: 1.5em
}

.stc-skin-simple.stc-style-round-gray .stc-group:before {
    border-bottom: 4px solid #878787;
    content: "";
    display: block;
    height: 1px;
    margin-left: -1em;
    position: absolute;
    top: 50%;
    width: 11em;
    z-index: -1
}

.stc-skin-simple.stc-style-round-gray .stc-group-label {
    font-size: .8em;
    position: absolute;
    width: 10.2em;
    z-index: 2;
    color: #878787
}

.stc-skin-simple.stc-style-round-gray .stc-group-label.stc-label-top {
    margin-bottom: 0;
    margin-top: 0;
    top: 3.6em
}

.stc-skin-simple.stc-style-round-gray .stc-group-label.stc-label-bottom {
    margin-top: -4.1em;
    margin-bottom: 0
}


/* Responsive */

@media screen and (max-width: 960px) {
    .stc-skin-simple,
    .stc-skin-circular,
    .stc-skin-animated,
    .stc-skin-custom,
    .stc-skin-plain {
        font-size: 13px
    }
}

@media screen and (max-width: 800px) {
    .stc-skin-simple,
    .stc-skin-animated,
    .stc-skin-custom,
    .stc-skin-plain {
        font-size: 11px
    }
    .stc-skin-circular {
        font-size: 12px
    }
}

@media screen and (max-width: 480px) {
    .stc-skin-simple,
    .stc-skin-animated,
    .stc-skin-custom,
    .stc-skin-plain {
        font-size: 9px
    }
    .stc-skin-circular {
        font-size: 11px
    }
}

@media screen and (max-width: 320px) {
    .stc-skin-simple,
    .stc-skin-animated,
    .stc-skin-custom,
    .stc-skin-plain {
        font-size: 8px
    }
    .stc-skin-circular {
        font-size: 10px
    }
}