/* Get the bourbon mixin from http://bourbon.io */
/* Reset */
 body{
     margin:0;
}
 img{
     max-width:100%;
     height:auto;
}
 @font-face {
     font-family: 'freshmannormal';
     src: url('../fonts/freshman-webfont.woff2') format('woff2'), url('../fonts/freshman-webfont.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
 .cdtwrapper{
     width:100% !important;
     max-width:900px !important;
     height:149px;
     margin:0 auto;
     background:url(../img/bck.jpg);
     background-size: cover !important;
}
 .flip-clock-wrapper * {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     -ms-box-sizing: border-box;
     -o-box-sizing: border-box;
     box-sizing: border-box;
     -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     -ms-backface-visibility: hidden;
     -o-backface-visibility: hidden;
     backface-visibility: hidden;
}
 .flip-clock-wrapper a {
     cursor: pointer;
     text-decoration: none;
     color: #ccc;
}
 .flip-clock-wrapper a:hover {
     color: #fff;
}
 .flip-clock-wrapper ul {
     list-style: none;
}
 .flip-clock-wrapper.clearfix:before, .flip-clock-wrapper.clearfix:after {
     content: " ";
     display: table;
}
 .flip-clock-wrapper.clearfix:after {
     clear: both;
}
 .flip-clock-wrapper.clearfix {
     *zoom: 1;
}
/* Main */
 .flip-clock-wrapper {
     font-family: 'freshmannormal';
     -webkit-user-select: none;
}
 .flip-clock-meridium {
     background: none !important;
     box-shadow: 0 0 0 !important;
     font-size: 36px !important;
}
 .flip-clock-meridium a {
     color: #313333;
}
 .flip-clock-wrapper {
     text-align: center;
     position: relative;
     width: 48%;
     float:right;
     top:19px;
    /*margin: 1em;
     */
}
 .flip-clock-wrapper:before, .flip-clock-wrapper:after {
     content: " ";
    /* 1 */
     display: table;
    /* 2 */
}
 .flip-clock-wrapper:after {
     clear: both;
}
/* Skeleton */
 .flip-clock-wrapper ul {
     position: relative;
     float: left;
     margin: 2px;
     width: 40px;
     height: 60px;
     font-size: 50px;
     font-weight: bold;
     line-height: 67px;
     border-radius: 10px;
     background: #000;
}
 .flip-clock-wrapper ul li {
     z-index: 1;
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     line-height: 65px;
     text-decoration: none !important;
}
 .flip-clock-wrapper ul li:first-child {
     z-index: 2;
}
 .flip-clock-wrapper ul li a {
     display: block;
     height: 100%;
     -webkit-perspective: 200px;
     -moz-perspective: 200px;
     perspective: 200px;
     margin: 0 !important;
     overflow: visible !important;
     cursor: default !important;
}
 .flip-clock-wrapper ul li a div {
     z-index: 1;
     position: absolute;
     left: 0;
     width: 100%;
     height: 50%;
     font-size: 80px;
     overflow: hidden;
     outline: 1px solid transparent;
}
 .flip-clock-wrapper ul li a div .shadow {
     position: absolute;
     width: 100%;
     height: 100%;
     z-index: 2;
}
 .flip-clock-wrapper ul li a 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;
}
 .flip-clock-wrapper ul li a div.up:after {
     content: "";
     position: absolute;
     top: 44px;
     left: 0;
     z-index: 5;
     width: 100%;
     height: 3px;
     background-color: #000;
     background-color: rgba(0, 0, 0, 0.4);
}
 .flip-clock-wrapper ul li a div.down {
     -webkit-transform-origin: 50% 0;
     -moz-transform-origin: 50% 0;
     -ms-transform-origin: 50% 0;
     -o-transform-origin: 50% 0;
     transform-origin: 50% 0;
     bottom: 0;
     border-bottom-left-radius: 6px;
     border-bottom-right-radius: 6px;
}
 .flip-clock-wrapper ul li a div div.inn {
     position: absolute;
     left: 0;
     z-index: 1;
     width: 100%;
     height: 200%;
     color: #f0f0f0;
     text-shadow: 0 1px 2px #000;
     text-align: center;
     background-color: #333;
     border-radius: 10px;
     font-size: 40px;
}
 .flip-clock-wrapper ul li a div.up div.inn {
     top: 0;
}
 .flip-clock-wrapper ul li a div.down div.inn {
     bottom: 0;
}
/* PLAY */
 .flip-clock-wrapper ul.play li.flip-clock-before {
     z-index: 3;
}
 .flip-clock-wrapper .flip {
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
}
 .flip-clock-wrapper ul.play li.flip-clock-active {
     -webkit-animation: asd 0.5s 0.5s linear both;
     -moz-animation: asd 0.5s 0.5s linear both;
     animation: asd 0.5s 0.5s linear both;
     z-index: 5;
}
 .flip-clock-divider {
     float: left;
     display: inline-block;
     position: relative;
     width: 20px;
     height: 100px;
}
 .flip-clock-divider:first-child {
     width: 0;
}
 .flip-clock-dot {
     display: block;
     background: #f4f4f4;
     width: 10px;
     height: 10px;
     position: absolute;
     border-radius: 50%;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
     left: 5px;
}
 .flip-clock-divider .flip-clock-label {
     position: absolute;
     top: 4.2em;
     right: -68px;
     color: white;
     text-shadow: none;
}
 .flip-clock-divider.minutes .flip-clock-label {
     right: -80px;
}
 .flip-clock-divider.seconds .flip-clock-label {
     right: -80px;
}
 .flip-clock-dot.top {
     top: 18px;
}
 .flip-clock-dot.bottom {
     bottom: 45px;
}
 @-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;
    }
}
 .flip-clock-wrapper ul.play li.flip-clock-active .down {
     z-index: 2;
     -webkit-animation: turn 0.5s 0.5s linear both;
     -moz-animation: turn 0.5s 0.5s linear both;
     animation: turn 0.5s 0.5s linear both;
}
 @-webkit-keyframes turn {
     0% {
         -webkit-transform: rotateX(90deg);
    }
     100% {
         -webkit-transform: rotateX(0deg);
    }
}
 @-moz-keyframes turn {
     0% {
         -moz-transform: rotateX(90deg);
    }
     100% {
         -moz-transform: rotateX(0deg);
    }
}
 @-o-keyframes turn {
     0% {
         -o-transform: rotateX(90deg);
    }
     100% {
         -o-transform: rotateX(0deg);
    }
}
 @keyframes turn {
     0% {
         transform: rotateX(90deg);
    }
     100% {
         transform: rotateX(0deg);
    }
}
 .flip-clock-wrapper ul.play li.flip-clock-before .up {
     z-index: 2;
     -webkit-animation: turn2 0.5s linear both;
     -moz-animation: turn2 0.5s linear both;
     animation: turn2 0.5s linear both;
}
 @-webkit-keyframes turn2 {
     0% {
         -webkit-transform: rotateX(0deg);
    }
     100% {
         -webkit-transform: rotateX(-90deg);
    }
}
 @-moz-keyframes turn2 {
     0% {
         -moz-transform: rotateX(0deg);
    }
     100% {
         -moz-transform: rotateX(-90deg);
    }
}
 @-o-keyframes turn2 {
     0% {
         -o-transform: rotateX(0deg);
    }
     100% {
         -o-transform: rotateX(-90deg);
    }
}
 @keyframes turn2 {
     0% {
         transform: rotateX(0deg);
    }
     100% {
         transform: rotateX(-90deg);
    }
}
 .flip-clock-wrapper ul li.flip-clock-active {
     z-index: 3;
}
/* SHADOW */
 .flip-clock-wrapper ul.play li.flip-clock-before .up .shadow {
     background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
     background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
     background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
     -webkit-animation: show 0.5s linear both;
     -moz-animation: show 0.5s linear both;
     animation: show 0.5s linear both;
}
 .flip-clock-wrapper ul.play li.flip-clock-active .up .shadow {
     background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, black));
     background: linear, top, rgba(0, 0, 0, 0.1) 0%, black 100%;
     background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, black 100%);
     background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, black 100%;
     -webkit-animation: hide 0.5s 0.3s linear both;
     -moz-animation: hide 0.5s 0.3s linear both;
     animation: hide 0.5s 0.3s linear both;
}
/*DOWN*/
 .flip-clock-wrapper ul.play li.flip-clock-before .down .shadow {
     background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
     background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
     background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
     -webkit-animation: show 0.5s linear both;
     -moz-animation: show 0.5s linear both;
     animation: show 0.5s linear both;
}
 .flip-clock-wrapper ul.play li.flip-clock-active .down .shadow {
     background: -moz-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, black), color-stop(100%, rgba(0, 0, 0, 0.1)));
     background: linear, top, black 0%, rgba(0, 0, 0, 0.1) 100%;
     background: -o-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: -ms-linear-gradient(top, black 0%, rgba(0, 0, 0, 0.1) 100%);
     background: linear, to bottom, black 0%, rgba(0, 0, 0, 0.1) 100%;
     -webkit-animation: hide 0.5s 0.3s linear both;
     -moz-animation: hide 0.5s 0.3s linear both;
     animation: hide 0.5s 0.2s linear both;
}
 @-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;
    }
}
/*------------------responsive---------------------------*/
 @media (max-width:854px) {
     .cdtwrapper{
         width:100% !important;
         max-width:854px !important;
         height:141px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:46.5% !important;
         float:right !important;
         top:40px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -4px !important;
         width: 50px !important;
         height: 65px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 32px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 8px !important;
         height: 8px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -12px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.2em !important;
         right: -57px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 16px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -62px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -62px !important;
    }
     .flip-clock-dot.top {
         top: -1px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 80px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:800px) {
     .cdtwrapper{
         width:100% !important;
         max-width:800px !important;
         height:132px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:48% !important;
         float:right !important;
         top:40px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -4px !important;
         width: 50px !important;
         height: 65px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 32px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 8px !important;
         height: 8px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -12px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.2em !important;
         right: -57px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 16px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -62px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -62px !important;
    }
     .flip-clock-dot.top {
         top: -1px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 80px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:768px) {
     .cdtwrapper{
         width:100% !important;
         max-width:768px !important;
         height:127px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:45% !important;
         float:right !important;
         top:35px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 50px !important;
         height: 65px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 35px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 8px !important;
         height: 8px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -11px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2em !important;
         right: -46px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 16px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -54px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -56px !important;
    }
     .flip-clock-dot.top {
         top: -1px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 80px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:732px) {
     .cdtwrapper{
         width:100% !important;
         max-width:732px !important;
         height:121px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:45% !important;
         float:right !important;
         top:35px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 50px !important;
         height: 65px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 35px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 8px !important;
         height: 8px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -11px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2em !important;
         right: -46px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 16px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -54px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -56px !important;
    }
     .flip-clock-dot.top {
         top: -1px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 80px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:667px) {
     .cdtwrapper{
         width:100% !important;
         max-width:667px !important;
         height:110px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:41% !important;
         float:right !important;
         top:28px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 40px !important;
         height: 60px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 30px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.5em !important;
         right: -33px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 12px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -41px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -42px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:640px) {
     .cdtwrapper{
         width:100% !important;
         max-width:640px !important;
         height:106px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:41% !important;
         float:right !important;
         top:28px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 40px !important;
         height: 60px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 30px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.5em !important;
         right: -33px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 12px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -41px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -42px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:600px) {
     .cdtwrapper{
         width:100% !important;
         max-width:600px !important;
         height:100px !important;
         margin:0 auto;
         background:url(../img/bck.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:43% !important;
         float:right !important;
         top:24px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 40px !important;
         height: 60px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 30px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.5em !important;
         right: -33px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 12px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -41px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -42px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:428px) {
     .cdtwrapper{
         width:100% !important;
         max-width:428px !important;
         height:88px !important;
         margin:0 auto;
         background:url(../img/bck2.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:58% !important;
         float:right !important;
         top:22px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -8px !important;
         width: 40px !important;
         height: 60px !important;
         font-size: 50px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 5px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 20px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.5em !important;
         right: -33px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 12px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -41px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -42px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:393px) {
     .cdtwrapper{
         width:100% !important;
         max-width:393px !important;
         height:85px !important;
         margin:0 auto;
         background:url(../img/bck2.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat !important;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:58% !important;
         float:right !important;
         top:22px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -9px !important;
         width: 20px !important;
         height: 55px !important;
         font-size: 30px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 3px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 15px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.2em !important;
         right: -30px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 11px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -37px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -38px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:390px) {
     .cdtwrapper{
         width:100% !important;
         max-width:390px !important;
         height:85px !important;
         margin:0 auto;
         background:url(../img/bck2.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat !important;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:58% !important;
         float:right !important;
         top:22px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -9px !important;
         width: 20px !important;
         height: 55px !important;
         font-size: 30px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 3px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 15px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2.2em !important;
         right: -30px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 11px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -37px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -38px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:384px) {
     .cdtwrapper{
         width:100% !important;
         max-width:384px !important;
         height:85px !important;
         margin:0 auto;
         background:url(../img/bck2.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat !important;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:58% !important;
         float:right !important;
         top:20px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -10px !important;
         width: 20px !important;
         height: 55px !important;
         font-size: 30px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 3px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 15px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2em !important;
         right: -30px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 11px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -37px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -38px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
 @media (max-width:360px) {
     .cdtwrapper{
         width:100% !important;
         max-width:360px !important;
         height:76px !important;
         margin:0 auto;
         background:url(../img/bck2.jpg)!important;
         background-size: contain !important;
         background-repeat:no-repeat;
         overflow: hidden !important;
    }
     .flip-clock-wrapper {
         text-align: center !important;
         position: relative !important;
         width:58% !important;
         float:right !important;
         top:20px !important;
        /*margin: 1em;
         */
    }
     .flip-clock-wrapper ul {
         position: relative !important;
         float: left !important;
         margin: -10px !important;
         width: 20px !important;
         height: 55px !important;
         font-size: 30px !important;
         font-weight: bold !important;
         line-height: 67px !important;
         border-radius: 3px !important;
         background: none !important;
    }
     .flip-clock-wrapper ul li a div div.inn {
         position: absolute;
         left: 0;
         z-index: 1;
         width: 60% !important;
         height: 200%;
         color: #f0f0f0;
         text-shadow: 0 1px 2px #000;
         text-align: center;
         background-color: #333;
         border-radius: 5px !important;
         font-size: 15px !important;
    }
     .flip-clock-wrapper ul li {
         z-index: 1;
         position: absolute;
         left: 0;
         top: 0;
         width: 100% !important;
         height: 60% !important;
         line-height: 35px !important;
         text-decoration: none !important;
    }
     .flip-clock-wrapper ul li a div .shadow {
         position: absolute !important;
         width: 62% !important;
         height: 100% !important;
         z-index: 2 !important;
    }
     .flip-clock-divider {
         float: left !important;
         display: inline-block !important;
         position: relative !important;
         width: 10px !important;
         height: 100px !important;
    }
     .flip-clock-dot {
         display: block !important;
         background: #f4f4f4 !important;
         width: 4px !important;
         height: 4px !important;
         position: absolute !important;
         border-radius: 50% !important;
         box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
         left: -5px !important;
    }
     .flip-clock-divider .flip-clock-label {
         position: absolute !important;
         top: 2em !important;
         right: -30px !important;
         color: white !important;
         text-shadow: none !important;
         font-size: 11px !important;
    }
     .flip-clock-divider.minutes .flip-clock-label {
         right: -37px !important;
    }
     .flip-clock-divider.seconds .flip-clock-label {
         right: -38px !important;
    }
     .flip-clock-dot.top {
         top: 2px !important;
    }
     .flip-clock-dot.bottom {
         bottom: 84px !important;
    }
     .flip-clock-wrapper .flip {
         box-shadow: none !important;
    }
}
/*-------------------responsive--------------------------*/