.ce-countdown--theme-1 .ce-col {
display: inline-block;
margin: 0 20px;
line-height: normal;
text-align: center;
}
.ce-countdown--theme-1 .ce-days,
.ce-countdown--theme-1 .ce-dseconds,
.ce-countdown--theme-1 .ce-hours,
.ce-countdown--theme-1 .ce-minutes,
.ce-countdown--theme-1 .ce-mseconds,
.ce-countdown--theme-1 .ce-seconds {
font-size: 4.5em
}
.ce-countdown--theme-1 .ce-dseconds,
.ce-countdown--theme-1 .ce-mseconds {
display: inline-block;
width: 150px
}
.ce-countdown--theme-1 .ce-days-label,
.ce-countdown--theme-1 .ce-dseconds-label,
.ce-countdown--theme-1 .ce-hours-label,
.ce-countdown--theme-1 .ce-minutes-label,
.ce-countdown--theme-1 .ce-mseconds-label,
.ce-countdown--theme-1 .ce-seconds-label {
display: block;
text-transform: uppercase
}
@media all and (max-width:540px) {
.ce-countdown--theme-1 .ce-days,
.ce-countdown--theme-1 .ce-dseconds,
.ce-countdown--theme-1 .ce-hours,
.ce-countdown--theme-1 .ce-minutes,
.ce-countdown--theme-1 .ce-mseconds,
.ce-countdown--theme-1 .ce-seconds {
font-size: 1.5em
}
.ce-countdown--theme-1 .ce-col {
margin: 0 10px 20px;
}
}
.ce-countdown--theme-2 .ce-bar {
background: #a66600;
clear: both;
float: left;
margin: 7px 0 0 0;
width: 330px
}
.ce-countdown--theme-2 .ce-fill {
background: #ececec;
height: 5px;
width: 0%
}
.ce-countdown--theme-2 .ce-info {
float: left;
line-height: 20px
}
.ce-countdown--theme-2 .ce-text {
float: left;
margin: -14px 0 0 26px;
padding-top: 10px;
clear: none;
text-align: left
}
.ce-countdown--theme-2 strong {
font-size: 45px;
font-style: italic;
font-weight: 600;
line-height: 1.1em
}
.ce-countdown--theme-2 p {
font-size: 30px;
font-style: italic;
line-height: 1.2em;
margin: 0
}
.ce-countdown--theme-2 .ce-days,
.ce-countdown--theme-2 .ce-dseconds,
.ce-countdown--theme-2 .ce-hours,
.ce-countdown--theme-2 .ce-minutes,
.ce-countdown--theme-2 .ce-mseconds,
.ce-countdown--theme-2 .ce-seconds {
float: left;
font-size: 12px;
font-weight: 800!important;
text-align: center;
width: 40px
}
.ce-countdown--theme-2 .ce-days-label,
.ce-countdown--theme-2 .ce-dseconds-label,
.ce-countdown--theme-2 .ce-hours-label,
.ce-countdown--theme-2 .ce-minutes-label,
.ce-countdown--theme-2 .ce-mseconds-label,
.ce-countdown--theme-2 .ce-seconds-label {
color: #a76500;
float: left;
font-size: 12px;
font-weight: 400
}
@media all and (max-width:900px) {
.ce-countdown--theme-2 {
text-align: center
}
.ce-countdown--theme-2 .ce-info {
display: inline-block;
float: none
}
.ce-countdown--theme-2 .ce-text {
float: none;
margin: 0;
text-align: center;
padding-top: 20px
}
.ce-countdown--theme-2 .ce-bar {
width: 115px
}
.ce-countdown--theme-2 strong {
font-size: 25px;
font-weight: 600
}
.ce-countdown--theme-2 p {
font-size: 20px;
margin: 5px 0 0
}
}
.ce-countdown--theme-3 {
text-align: center;
line-height: normal;
}
.ce-countdown--theme-3 .ce-col {
display: inline-block;
font-size: 50px;
padding-bottom: 5px;
width: 2em;
line-height: normal;
}
.ce-countdown--theme-3 .ce-col+.ce-col {
border-left: 1px solid #ffc728
}
.ce-countdown--theme-3 .ce-days-label,
.ce-countdown--theme-3 .ce-dseconds-label,
.ce-countdown--theme-3 .ce-hours-label,
.ce-countdown--theme-3 .ce-minutes-label,
.ce-countdown--theme-3 .ce-mseconds-label,
.ce-countdown--theme-3 .ce-seconds-label {
color: #806314;
display: block;
font-size: 20px;
font-weight: 300;
text-transform: lowercase
}
@media all and (max-width:800px) {
.ce-countdown--theme-3 .ce-col {
font-size: 80px
}
.ce-countdown--theme-3 .ce-days-label,
.ce-countdown--theme-3 .ce-dseconds-label,
.ce-countdown--theme-3 .ce-hours-label,
.ce-countdown--theme-3 .ce-minutes-label,
.ce-countdown--theme-3 .ce-mseconds-label,
.ce-countdown--theme-3 .ce-seconds-label {
font-size: 16px
}
}
@media all and (max-width:600px) {
.ce-countdown--theme-3 .ce-col {
display: block;
font-size: 70px;
margin: 0 auto
}
.ce-countdown--theme-3 .ce-col+.ce-col {
border-left: 0;
border-top: 1px solid #ffc728;
margin-top: 10px
}
.ce-countdown--theme-3 .ce-days-label,
.ce-countdown--theme-3 .ce-dseconds-label,
.ce-countdown--theme-3 .ce-hours-label,
.ce-countdown--theme-3 .ce-minutes-label,
.ce-countdown--theme-3 .ce-mseconds-label,
.ce-countdown--theme-3 .ce-seconds-label {
font-size: 13px
}
}
.ce-countdown--theme-4 {
font-size: 60px;
text-align: center;
line-height: normal;
}
.ce-countdown--theme-4 span {
font-weight: 900
}
@media all and (max-width:730px) {
.ce-countdown--theme-4 {
font-size: 30px
}
}
.ce-countdown--theme-5 {
font-size: 60px;
line-height: normal;
}
@media all and (max-width:540px) {
.ce-countdown--theme-5 {
font-size: 70px
}
}
.ce-countdown--theme-6 {
background: #31facd;
color: #00bfa0;
font-family: Roboto, sans-serif;
font-size: 0;
font-weight: 400;
padding: 30px;
text-align: center
}
.ce-countdown--theme-6 .ce-col {
display: inline-block;
font-size: 24px;
margin: 0 0 0 4.513888888889%;
width: 30.324074074074%
}
.ce-countdown--theme-6 .ce-col:first-child {
margin: 0
}
.ce-countdown--theme-6 .ce-hours,
.ce-countdown--theme-6 .ce-minutes,
.ce-countdown--theme-6 .ce-seconds {
color: #fff;
display: block;
font-size: 46px;
font-weight: 300;
height: 66px;
line-height: 66px;
margin-bottom: 10px
}
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-hours,
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-minutes,
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-seconds {
-webkit-perspective: 1000;
-moz-perspective: 1000;
-ms-perspective: 1000;
perspective: 1000
}
.ce-countdown--theme-6 .ce-flip-wrap {
position: relative
}
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-flip-wrap {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: 0s;
-moz-transition: 0s;
transition: 0s
}
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-animate .ce-flip-wrap {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
transform: rotateY(180deg);
-webkit-transition: .6s;
-moz-transition: .6s;
transition: .6s
}
.ce-countdown--theme-6 .ce-flip-wrap .ce-flip-back,
.ce-countdown--theme-6 .ce-flip-wrap .ce-flip-front {
background: #00bfa0;
height: 66px;
left: 0;
position: absolute;
top: 0;
width: 100%
}
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-flip-wrap .ce-flip-back,
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-flip-wrap .ce-flip-front {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden
}
html:not([class*=ce-ie]) .ce-countdown--theme-6 .ce-flip-wrap .ce-flip-back {
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
transform: rotateY(180deg)
}
@media all and (max-width:560px) {
.ce-countdown--theme-6 .ce-col {
font-size: 12px
}
.ce-countdown--theme-6 .ce-hours,
.ce-countdown--theme-6 .ce-minutes,
.ce-countdown--theme-6 .ce-seconds {
color: #fff;
display: block;
font-size: 24px;
height: 40px;
line-height: 40px
}
.ce-countdown--theme-6 .ce-col {
margin: 0 2% 0
}
.ce-countdown--theme-6 .ce-flip-wrap .ce-flip-back,
.ce-countdown--theme-6 .ce-flip-wrap .ce-flip-front {
height: 40px
}
}
.ce-countdown--theme-7 {
font-size: 60px;
line-height: normal;
overflow: hidden
}
.ce-countdown--theme-7 .ce-digits {
display: inline-block;
min-width: 1.6em
}
.ce-countdown--theme-7 .ce-digits span {
display: inline-block;
min-width: .7em;
position: relative;
text-align: left;
-moz-transition: none;
-webkit-transition: none;
transition: none
}
.ce-countdown--theme-7 .ce-digits span:first-child {
text-align: right
}
.ce-countdown--theme-7 .ce-digits span.ce-animate {
-moz-transform: translateY(-100%);
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
-moz-transition: -moz-transform .3s;
-webkit-transition: -webkit-transform .3s;
transition: transform .3s
}
.ce-countdown--theme-7 .ce-digits span:before {
content: attr(data-old);
position: absolute;
top: -100%;
-moz-transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
@media all and (max-width:600px) {
.ce-countdown--theme-7 {
font-size: 40px
}
}
.ce-countdown--theme-8 {
line-height: normal;
}
.ce-countdown--theme-8 .ce-days {
font-size: 3em
}
.ce-countdown--theme-8 strong {
color: #c28a81;
display: block;
font-weight: 400
}
@media all and (max-width:540px) {
.ce-countdown--theme-8 {
font-size: 1.2em
}
}
.ce-countdown--theme-9 {
text-align: center;
line-height: normal;
}
.ce-countdown--theme-9 .ce-circle {
display: inline-block;
margin: -20px;
position: relative;
vertical-align: top
}
.ce-countdown--theme-9 canvas {
display: inline-block;
height: 200px;
width: 200px
}
.ce-countdown--theme-9 .ce-circle__values {
height: 70px;
margin-top: -35px;
position: absolute;
top: 50%;
width: 100%
}
.ce-countdown--theme-9 .ce-digit,
.ce-countdown--theme-9 .ce-label {
display: block;
line-height: 1
}
.ce-countdown--theme-9 .ce-digit {
display: block;
font-size: 40px
}
.ce-countdown--theme-9 .ce-label {
color: #929292;
display: block;
font-size: 15px;
margin-top: 15px;
text-transform: uppercase
}
@media all and (max-width:900px) {
.ce-countdown--theme-9 canvas {
height: 164px;
width: 164px
}
.ce-countdown--theme-9 .ce-digit {
font-size: 35px
}
}
@media all and (max-width:400px) {
.ce-countdown--theme-9 .ce-circle {
margin: -30px;
display: block
}
.ce-countdown--theme-9 canvas {
height: 134px;
width: 134px
}
.ce-countdown--theme-9 .ce-circle__values {
margin-top: -30px
}
.ce-countdown--theme-9 .ce-digit {
font-size: 30px
}
.ce-countdown--theme-9 .ce-label {
font-size: 12px;
margin-top: 8px
}
} .ce-countdown--theme-10 {
display: inline-block;
font-family: 'Unica One', cursive;
padding: 30px;
position: relative;
-webkit-user-select: none;
text-align: center
}
.ce-countdown--theme-10:after,
.ce-countdown--theme-10:before {
content: " ";
display: table
}
.ce-countdown--theme-10:after {
clear: both
}
.ce-countdown--theme-10 * {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box
}
.ce-countdown--theme-10 .ce-unit-wrap {
float: left;
margin-left: 1.25em
}
.ce-countdown--theme-10 .ce-unit-wrap:first-child {
margin-left: 0
}
.ce-countdown--theme-10 .ce-unit-wrap>div:after,
.ce-countdown--theme-10 .ce-unit-wrap>div:before {
content: " ";
display: table
}
.ce-countdown--theme-10 .ce-unit-wrap>div:after {
clear: both
}
.ce-countdown--theme-10 .ce-unit-wrap>span {
color: #929292;
display: block;
font-size: 1.5em;
margin: .66666666666667em 0 0;
text-transform: uppercase
}
.ce-countdown--theme-10 div.flip-wrap {
color: #fff;
cursor: pointer;
text-decoration: none
}
.ce-countdown--theme-10 div.flip-wrap:hover {
color: #fff
}
.ce-countdown--theme-10 div.digits {
list-style: none
}
.ce-countdown--theme-10.clearfix:after,
.ce-countdown--theme-10.clearfix:before {
content: " ";
display: table
}
.ce-countdown--theme-10.clearfix:after {
clear: both
}
.ce-countdown--theme-10 div.digits {
background: #000;
border-radius: 5px;
float: left;
font-size: 120px;
height: 150px;
line-height: 150px;
margin: 0 4px;
position: relative;
width: 70px
}
.ce-countdown--theme-10 div.digits div.digits-inner {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 1
}
.ce-countdown--theme-10 div.digits div.digits-inner:first-child {
z-index: 2
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap {
cursor: default!important;
display: block;
height: 100%;
margin: 0!important;
overflow: visible!important;
-webkit-perspective: 300px;
-moz-perspective: 300px;
perspective: 300px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div {
font-size: 120px;
height: 50%;
left: 0;
outline: 1px solid transparent;
overflow: hidden;
position: absolute;
width: 100%;
z-index: 1
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div .shadow {
height: 100%;
position: absolute;
width: 100%;
z-index: 2
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up {
-webkit-transform-origin: 50% 100%;
-moz-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%;
-o-transform-origin: 50% 100%;
transform-origin: 50% 100%;
top: 0
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up:after {
background-color: #000;
background-color: rgba(0, 0, 0, .4);
content: "";
height: 2px;
left: 0;
position: absolute;
top: 73px;
width: 100%;
z-index: 5
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.down {
bottom: 0;
-webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div div.inn {
background-color: #191919;
border-radius: 5px;
color: #fff;
font-size: 120px;
height: 200%;
left: 0;
position: absolute;
text-align: center;
text-shadow: 0 1px 2px #000;
width: 100%;
z-index: 1
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up div.inn {
background: #373737;
top: 0
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.down div.inn {
bottom: 0
}
.ce-countdown--theme-10 div.play div.digits-inner.before {
z-index: 3
}
.ce-countdown--theme-10 div.play div.digits-inner.active {
-webkit-animation: asd .5s .5s linear both;
-moz-animation: asd .5s .5s linear both;
animation: asd .5s .5s linear both;
z-index: 5
}
@-webkit-keyframes asd {
0% {
z-index: 2
}
20% {
z-index: 4
}
100% {
z-index: 4
}
}
@-moz-keyframes asd {
0% {
z-index: 2
}
20% {
z-index: 4
}
100% {
z-index: 4
}
}
@-o-keyframes asd {
0% {
z-index: 2
}
20% {
z-index: 4
}
100% {
z-index: 4
}
}
@keyframes asd {
0% {
z-index: 2
}
20% {
z-index: 4
}
100% {
z-index: 4
}
}
.ce-countdown--theme-10 div.play div.digits-inner.active .down {
-webkit-animation: turn .5s .5s linear both;
-moz-animation: turn .5s .5s linear both;
animation: turn .5s .5s linear both;
z-index: 2
}
@-webkit-keyframes turn {
0% {
-webkit-transform: rotateX(90deg)
}
100% {
-webkit-transform: rotateX(0)
}
}
@-moz-keyframes turn {
0% {
-moz-transform: rotateX(90deg)
}
100% {
-moz-transform: rotateX(0)
}
}
@-o-keyframes turn {
0% {
-o-transform: rotateX(90deg)
}
100% {
-o-transform: rotateX(0)
}
}
@keyframes turn {
0% {
transform: rotateX(90deg)
}
100% {
transform: rotateX(0)
}
}
.ce-countdown--theme-10 div.play div.digits-inner.before .up {
-webkit-animation: turn2 .5s linear both;
-moz-animation: turn2 .5s linear both;
animation: turn2 .5s linear both;
z-index: 2
}
@-webkit-keyframes turn2 {
0% {
-webkit-transform: rotateX(0)
}
100% {
-webkit-transform: rotateX(-90deg)
}
}
@-moz-keyframes turn2 {
0% {
-moz-transform: rotateX(0)
}
100% {
-moz-transform: rotateX(-90deg)
}
}
@-o-keyframes turn2 {
0% {
-o-transform: rotateX(0)
}
100% {
-o-transform: rotateX(-90deg)
}
}
@keyframes turn2 {
0% {
transform: rotateX(0)
}
100% {
transform: rotateX(-90deg)
}
}
.ce-countdown--theme-10 div div.digits-inner.active {
z-index: 3
}
.ce-countdown--theme-10 div.play div.digits-inner.before .up .shadow {
-webkit-animation: show .5s linear both;
-moz-animation: show .5s linear both;
animation: show .5s linear both;
background: -moz-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(0, 0, 0, .1)), color-stop(100%, #000));
background: linear, top, rgba(0, 0, 0, .1) 0, #000 100%;
background: -o-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: -ms-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: linear, to bottom, rgba(0, 0, 0, .1) 0, #000 100%
}
.ce-countdown--theme-10 div.play div.digits-inner.active .up .shadow {
-webkit-animation: hide .5s .3s linear both;
-moz-animation: hide .5s .3s linear both;
animation: hide .5s .3s linear both;
background: -moz-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(0, 0, 0, .1)), color-stop(100%, #000));
background: linear, top, rgba(0, 0, 0, .1) 0, #000 100%;
background: -o-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: -ms-linear-gradient(top, rgba(0, 0, 0, .1) 0, #000 100%);
background: linear, to bottom, rgba(0, 0, 0, .1) 0, #000 100%
}
.ce-countdown--theme-10 div.play div.digits-inner.before .down .shadow {
-webkit-animation: show .5s linear both;
-moz-animation: show .5s linear both;
animation: show .5s linear both;
background: -moz-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #000), color-stop(100%, rgba(0, 0, 0, .1)));
background: linear, top, #000 0, rgba(0, 0, 0, .1) 100%;
background: -o-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: -ms-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: linear, to bottom, #000 0, rgba(0, 0, 0, .1) 100%
}
.ce-countdown--theme-10 div.play div.digits-inner.active .down .shadow {
-webkit-animation: hide .5s .3s linear both;
-moz-animation: hide .5s .3s linear both;
animation: hide .5s .2s linear both;
background: -moz-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #000), color-stop(100%, rgba(0, 0, 0, .1)));
background: linear, top, #000 0, rgba(0, 0, 0, .1) 100%;
background: -o-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: -ms-linear-gradient(top, #000 0, rgba(0, 0, 0, .1) 100%);
background: linear, to bottom, #000 0, rgba(0, 0, 0, .1) 100%
}
@-webkit-keyframes show {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@-moz-keyframes show {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@-o-keyframes show {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes show {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@-webkit-keyframes hide {
0% {
opacity: 1
}
100% {
opacity: 0
}
}
@-moz-keyframes hide {
0% {
opacity: 1
}
100% {
opacity: 0
}
}
@-o-keyframes hide {
0% {
opacity: 1
}
100% {
opacity: 0
}
}
@keyframes hide {
0% {
opacity: 1
}
100% {
opacity: 0
}
}
@media all and (max-width:900px) {
.ce-countdown--theme-10 .ce-unit-wrap {
margin-left: .75em
}
.ce-countdown--theme-10 .ce-unit-wrap>span {
font-size: 1em;
margin: .66666666666667em 0 0
}
.ce-countdown--theme-10 {
margin: .75em
}
.ce-countdown--theme-10 div.digits {
font-size: 70px;
height: 100px;
line-height: 100px;
margin: 0 2px;
width: 50px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div {
font-size: 70px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up:after {
height: 2px;
top: 48px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div div.inn {
font-size: 70px;
left: 0
}
}
@media all and (max-width:650px) {
.ce-countdown--theme-10 .ce-unit-wrap {
margin-left: .5em
}
.ce-countdown--theme-10 .ce-unit-wrap>span {
font-size: 1em;
margin: .5em 0 0
}
.ce-countdown--theme-10 {
margin: .75em
}
.ce-countdown--theme-10 div.digits {
font-size: 40px;
height: 70px;
line-height: 70px;
margin: 0 2px;
width: 40px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div {
font-size: 40px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up:after {
height: 2px;
top: 33px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div div.inn {
font-size: 40px;
left: 0
}
}
@media all and (max-width:500px) {
.ce-countdown--theme-10 {
margin: .75em 0;
padding: 30px 10px
}
.ce-countdown--theme-10 .ce-unit-wrap {
margin-left: .3em
}
.ce-countdown--theme-10 .ce-unit-wrap>span {
font-size: .75em;
margin: .5em 0 0
}
.ce-countdown--theme-10 div.digits {
font-size: 30px;
height: 50px;
line-height: 50px;
margin: 0 1px;
width: 26px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div {
font-size: 30px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div.up:after {
height: 2px;
top: 24px
}
.ce-countdown--theme-10 div.digits div.digits-inner div.flip-wrap div div.inn {
font-size: 30px;
left: 0
}
}
.ce-countdown--theme-11 {
background: url(//masaz-kregoslupa.pl/wp-content/themes/hair-transplantation/assets/media/theme-11/background.png) no-repeat center center;
background-size: cover;
display: table;
font-family: Peralta, cursive;
font-size: 0;
margin: 0 auto;
position: relative;
text-align: center
}
.ce-countdown--theme-11:after {
background: url(//masaz-kregoslupa.pl/wp-content/themes/hair-transplantation/assets/media/theme-11/snow.png) repeat;
content: '';
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 2
}
.ce-countdown--theme-11 .ce-duration,
.ce-countdown--theme-11 .ce-oncomplete {
display: table-cell;
vertical-align: middle
}
.ce-countdown--theme-11 .ce-col {
color: #bb202e;
display: inline-block;
font-size: 110px;
margin: 0 .4em
}
.ce-countdown--theme-11 p,
.ce-countdown--theme-11 span {
text-shadow: -.02em .05em 0 #761d25, .08em .08em 0 #184141
}
.ce-countdown--theme-11 .ce-image {
display: inline
}
.ce-countdown--theme-11 .ce-image img {
height: auto;
margin-top: 40px;
vertical-align: top;
width: 55px
}
.ce-countdown--theme-11 .ce-days-label,
.ce-countdown--theme-11 .ce-hours-label,
.ce-countdown--theme-11 .ce-minutes-label {
display: block;
font-size: 24px;
margin-top: -10px;
text-transform: uppercase
}
.ce-countdown--theme-11 .ce-oncomplete {
color: #bb202e;
display: none;
font-size: 40px;
padding: 0 30px 60px;
text-transform: uppercase
}
.ce-countdown--theme-11 .ce-oncomplete.shake {
display: table-cell
}
.ce-countdown--theme-11 .ce-oncomplete img {
display: inline-block;
margin: 0 10px;
vertical-align: top
}
.ce-countdown--theme-11 .ce-oncomplete p {
display: inline-block;
margin: 0;
padding: 30px 0
}
.ce-countdown--theme-11 .ce-oncomplete span {
display: inline-block;
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
.ce-countdown--theme-11 .ce-oncomplete.shake span {
-webkit-animation: shake 1s infinite;
-moz-animation: shake 1s infinite;
animation: shake 1s infinite
}
@-webkit-keyframes shake {
0% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
10%,
20% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
30%,
50%,
70%,
90% {
-webkit-transform: rotate3d(0, 0, 1, -20deg);
transform: rotate3d(0, 0, 1, -20deg)
}
40%,
60%,
80% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
100% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
}
@keyframes shake {
0% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
10%,
20% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
30%,
50%,
70%,
90% {
-webkit-transform: rotate3d(0, 0, 1, -20deg);
transform: rotate3d(0, 0, 1, -20deg)
}
40%,
60%,
80% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
100% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg)
}
}
@media all and (max-width:900px) {
.ce-countdown--theme-11 .ce-col {
font-size: 60px
}
.ce-countdown--theme-11 .ce-image img {
margin-top: 15px;
width: 35px
}
.ce-countdown--theme-11 .ce-days-label,
.ce-countdown--theme-11 .ce-hours-label,
.ce-countdown--theme-11 .ce-minutes-label {
font-size: 16px
}
}
@media all and (max-width:600px) {
.ce-countdown--theme-11 .ce-col {
font-size: 35px
}
.ce-countdown--theme-11 .ce-image img {
margin-top: 10px;
width: 20px
}
.ce-countdown--theme-11 .ce-days-label,
.ce-countdown--theme-11 .ce-hours-label,
.ce-countdown--theme-11 .ce-minutes-label {
font-size: 10px;
margin-top: -5px
}
.ce-countdown--theme-11 .ce-oncomplete {
font-size: 30px
}
.ce-countdown--theme-11 .ce-oncomplete p {
display: block
}
}
.ce-ie .ce-countdown-wrap--theme-12::after {
display: none
}
@-webkit-keyframes ce-countdown-colorchange--theme-12 {
0% {
background-color: rgba(80, 0, 190, .4)
}
25% {
background-color: rgba(0, 98, 190, .4)
}
75% {
background-color: rgba(0, 156, 190, .4)
}
100% {
background-color: rgba(80, 0, 190, .4)
}
}
@-moz-keyframes ce-countdown-colorchange--theme-12 {
0% {
background-color: rgba(80, 0, 190, .4)
}
25% {
background-color: rgba(0, 98, 190, .4)
}
75% {
background-color: rgba(0, 156, 190, .4)
}
100% {
background-color: rgba(80, 0, 190, .4)
}
}
@-o-keyframes ce-countdown-colorchange--theme-12 {
0% {
background-color: rgba(80, 0, 190, .4)
}
25% {
background-color: rgba(0, 98, 190, .4)
}
75% {
background-color: rgba(0, 156, 190, .4)
}
100% {
background-color: rgba(80, 0, 190, .4)
}
}
@keyframes ce-countdown-colorchange--theme-12 {
0% {
background-color: rgba(80, 0, 190, .4)
}
25% {
background-color: rgba(0, 98, 190, .4)
}
75% {
background-color: rgba(0, 156, 190, .4)
}
100% {
background-color: rgba(80, 0, 190, .4)
}
}
.ce-countdown--theme-12 {
position: relative;
z-index: 2
}
.ce-countdown--theme-12 .ce-col {
display: inline-block;
margin: 20px 0
}
.ce-countdown--theme-12 .ce-digits {
display: inline-block;
margin: 0 18px
}
.ce-countdown--theme-12 .ce-digits span {
border-radius: 50px;
border: 1px solid #ccc;
display: inline-block;
font-size: 70px;
height: 100px;
line-height: normal;
margin: 0 7px;
position: relative;
text-align: center;
width: 100px
}
.ce-countdown--theme-12 .ce-days-label,
.ce-countdown--theme-12 .ce-dseconds-label,
.ce-countdown--theme-12 .ce-hours-label,
.ce-countdown--theme-12 .ce-minutes-label,
.ce-countdown--theme-12 .ce-mseconds-label,
.ce-countdown--theme-12 .ce-seconds-label {
display: block;
font-size: 20px;
font-weight: 400;
letter-spacing: 4px;
margin: 25px 0 0;
text-align: center;
text-transform: uppercase
}
.ce-countdown-bg-video--theme-12 {
background-size: cover;
background: url(//masaz-kregoslupa.pl/wp-content/themes/hair-transplantation/assets/media/theme-12/bg-video-fallback.jpg) no-repeat;
bottom: 0;
height: auto;
min-height: 100%;
min-width: 100%;
position: absolute;
right: 0;
width: auto;
z-index: 0
}
@media all and (max-width:820px) {
.ce-countdown--theme-12 .ce-digits {
margin: 0 15px
}
.ce-countdown--theme-12 .ce-digits span {
border-radius: 40px;
font-size: 60px;
font-weight: 100;
height: 80px;
line-height: 80px;
margin: 0 6px;
width: 80px
}
.ce-countdown--theme-12 .ce-days-label,
.ce-countdown--theme-12 .ce-dseconds-label,
.ce-countdown--theme-12 .ce-hours-label,
.ce-countdown--theme-12 .ce-minutes-label,
.ce-countdown--theme-12 .ce-mseconds-label,
.ce-countdown--theme-12 .ce-seconds-label {
font-size: 18px;
letter-spacing: 4px;
margin: 20px 0 0
}
}
@media all and (max-width:480px) {
.ce-countdown--theme-12 .ce-col {
margin: 15px 0
}
.ce-countdown--theme-12 .ce-digits span {
border-radius: 30px;
font-size: 30px;
font-weight: 400;
height: 60px;
line-height: 65px;
margin: 0 5px;
width: 60px
}
.ce-countdown--theme-12 .ce-days-label,
.ce-countdown--theme-12 .ce-dseconds-label,
.ce-countdown--theme-12 .ce-hours-label,
.ce-countdown--theme-12 .ce-minutes-label,
.ce-countdown--theme-12 .ce-mseconds-label,
.ce-countdown--theme-12 .ce-seconds-label {
font-size: 12px;
letter-spacing: 4px;
margin: 10px 0 0
}
}
.ce-clearfix:after,
.ce-clearfix:before {
content: " ";
display: table
}
.ce-clearfix:after {
clear: both
}