#mainbody411 {
        display: none;
        z-index: 10;
        position: fixed;
        top: calc(105vh/10.80);
        left: calc(14vw/19.20);
        width: calc(1460vw/19.20);
        height: calc(850vh/10.80);
}

/*-------------------------
        The clocks
--------------------------*/

#digclock1 {
        width: calc(564vw/19.20);
        height: calc(150vh/10.80);
        /*padding:calc(80vh/10.80);
        margin:calc(200vh/10.80) auto calc(120vh/10.80); */
        position: relative;
        margin: 0 auto;
        margin-top: calc(150vh/10.80);
}

/* #digclock1:after{
        content:'';
        position:absolute;
        width:calc(800vw/19.20);
        height:calc(40vh/10.80);
        border-radius:100%;
        left:50%;
        margin-left:calc(-400vw/19.20);
        bottom:calc(4vh/10.80);
        z-index:-1;
} */

#digclock1 .display {
        text-align: center;
        padding: calc(80vh/10.80) calc(40vw/19.20) calc(40vh/10.80);
        border-radius: calc(12vw/19.20);
        position: absolute;
        height: calc(208vh/10.80);
}

/*-------------------------
        Light color theme
--------------------------*/

#digclock1.light {
        background-color: #f3f3f3;
        color: #272e38;
}

#digclock1.light:after {
        box-shadow: 0 calc(8vh/10.80) calc(20vw/19.20) rgba(0, 0, 0, 0.15);
}

#digclock1.light .digits div span {
        background-color: #272e38;
        border-color: #272e38;
}

#digclock1.light .digits div.dots:before, #digclock1.light .digits div.dots:after {
        background-color: #272e38;
}

#digclock1.light .display {
        background-color: #dddddd;
        box-shadow: 0 calc(2vh/10.80) calc(2vh/10.80) rgba(0, 0, 0, 0.08) inset, 0 calc(2vh/10.80) calc(2vh/10.80) #fafafa;
}

/*-------------------------
        Dark color theme
--------------------------*/

#digclock1.dark {
        background-color: #272e38;
        color: #cacaca;
}

#digclock1.dark:after {
        box-shadow: 0 calc(8vh/10.80) calc(20vh/10.80) rgba(0, 0, 0, 0.3);
}

#digclock1.dark .digits div span {
        background-color: #cacaca;
        border-color: #cacaca;
}

#digclock1.dark .alarm {
        background: url('../img/alarm_dark.jpg');
}

#digclock1.dark .display {
        background-color: #0f1620;
        box-shadow: 0 calc(2vh/10.80) calc(2vh/10.80) rgba(0, 0, 0, 0.08) inset, 0 calc(2vh/10.80) calc(2vh/10.80) #2d3642;
}

#digclock1.dark .digits div.dots:before, #digclock1.dark .digits div.dots:after {
        background-color: #cacaca;
}

/*-------------------------
        The Digits
--------------------------*/

#digclock1 .digits div {
        text-align: left;
        position: relative;
        width: calc(56vw/19.20);
        height: calc(100vh/10.80);
        display: inline-block;
        margin: 0 calc(8vh/10.80);
}

#digclock1 .digits div span {
        opacity: 0;
        position: absolute;
        -webkit-transition: 0.25s;
        -moz-transition: 0.25s;
        transition: 0.25s;
}

#digclock1 .digits div span:before, #digclock1 .digits div span:after {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border: calc(10vh/10.80) solid transparent;
}

#digclock1 .digits .dd1 {
        height: calc(10vh/10.80);
        width: calc(32vw/19.20);
        top: 0;
        left: calc(12vw/19.20);
}

#digclock1 .digits .dd1:before {
        border-width: 0 calc(10vw/19.20) calc(10vw/19.20) 0;
        border-right-color: inherit;
        left: calc(-10vw/19.20);
}

#digclock1 .digits .dd1:after {
        border-width: 0 0 calc(10vw/19.20) calc(10vw/19.20);
        border-left-color: inherit;
        right: calc(-10vw/19.20);
}

#digclock1 .digits .dd2 {
        height: calc(10vh/10.80);
        width: calc(32vw/19.20);
        top: calc(48vh/10.80);
        left: calc(12vw/19.20);
}

#digclock1 .digits .dd2:before {
        border-width: calc(6vw/19.20) calc(8vw/19.20) calc(4vw/19.20);
        border-right-color: inherit;
        left: calc(-16vw/19.20);
}

#digclock1 .digits .dd2:after {
        border-width: calc(6vw/19.20) calc(8vw/19.20) calc(4vw/19.20);
        border-left-color: inherit;
        right: calc(-16vw/19.20);
}

#digclock1 .digits .dd3 {
        height: calc(10vh/10.80);
        width: calc(32vw/19.20);
        top: calc(96vh/10.80);
        left: calc(12vw/19.20);
}

#digclock1 .digits .dd3:before {
        border-width: calc(10vw/19.20) calc(10vw/19.20) 0 0;
        border-right-color: inherit;
        left: calc(-10vw/19.20);
}

#digclock1 .digits .dd3:after {
        border-width: calc(10vw/19.20) 0 0 calc(10vw/19.20);
        border-left-color: inherit;
        right: calc(-10vw/19.20);
}

#digclock1 .digits .dd4 {
        width: calc(10vw/19.20);
        height: calc(28vh/10.80);
        top: calc(14vh/10.80);
        left: 0;
}

#digclock1 .digits .dd4:before {
        border-width: 0 calc(10vw/19.20) calc(10vw/19.20) 0;
        border-bottom-color: inherit;
        top: calc(-10vh/10.80);
}

#digclock1 .digits .dd4:after {
        border-width: 0 0 calc(10vw/19.20) calc(10vw/19.20);
        border-left-color: inherit;
        bottom: calc(-10vh/10.80);
}

#digclock1 .digits .dd5 {
        width: calc(10vw/19.20);
        height: calc(28vh/10.80);
        top: calc(14vh/10.80);
        right: 0;
}

#digclock1 .digits .dd5:before {
        border-width: 0 0 calc(10vw/19.20) calc(10vw/19.20);
        border-bottom-color: inherit;
        top: calc(-10vh/10.80);
}

#digclock1 .digits .dd5:after {
        border-width: calc(10vw/19.20) 0 0 calc(10vw/19.20);
        border-top-color: inherit;
        bottom: calc(-10vh/10.80);
}

#digclock1 .digits .dd6 {
        width: calc(10vw/19.20);
        height: calc(28vh/10.80);
        top: calc(64vh/10.80);
        left: 0;
}

#digclock1 .digits .dd6:before {
        border-width: 0 calc(10vw/19.20) calc(10vw/19.20) 0;
        border-bottom-color: inherit;
        top: calc(-10vh/10.80);
}

#digclock1 .digits .dd6:after {
        border-width: 0 0 calc(10vw/19.20) calc(10vw/19.20);
        border-left-color: inherit;
        bottom: calc(-10vh/10.80);
}

#digclock1 .digits .dd7 {
        width: calc(10vw/19.20);
        height: calc(28vh/10.80);
        top: calc(64vh/10.80);
        right: 0;
}

#digclock1 .digits .dd7:before {
        border-width: 0 0 calc(10vw/19.20) calc(10vw/19.20);
        border-bottom-color: inherit;
        top: calc(-10vh/10.80);
}

#digclock1 .digits .dd7:after {
        border-width: calc(10vw/19.20) 0 0 calc(10vw/19.20);
        border-top-color: inherit;
        bottom: calc(-10vh/10.80);
}

/* 1 */

#digclock1 .digits div.one .dd5, #digclock1 .digits div.one .dd7 {
        opacity: 1;
}

/* 2 */

#digclock1 .digits div.two .dd1, #digclock1 .digits div.two .dd5, #digclock1 .digits div.two .dd2, #digclock1 .digits div.two .dd6, #digclock1 .digits div.two .dd3 {
        opacity: 1;
}

/* 3 */

#digclock1 .digits div.three .dd1, #digclock1 .digits div.three .dd5, #digclock1 .digits div.three .dd2, #digclock1 .digits div.three .dd7, #digclock1 .digits div.three .dd3 {
        opacity: 1;
}

/* 4 */

#digclock1 .digits div.four .dd5, #digclock1 .digits div.four .dd2, #digclock1 .digits div.four .dd4, #digclock1 .digits div.four .dd7 {
        opacity: 1;
}

/* 5 */

#digclock1 .digits div.five .dd1, #digclock1 .digits div.five .dd2, #digclock1 .digits div.five .dd4, #digclock1 .digits div.five .dd3, #digclock1 .digits div.five .dd7 {
        opacity: 1;
}

/* 6 */

#digclock1 .digits div.six .dd1, #digclock1 .digits div.six .dd2, #digclock1 .digits div.six .dd4, #digclock1 .digits div.six .dd3, #digclock1 .digits div.six .dd6, #digclock1 .digits div.six .dd7 {
        opacity: 1;
}

/* 7 */

#digclock1 .digits div.seven .dd1, #digclock1 .digits div.seven .dd5, #digclock1 .digits div.seven .dd7 {
        opacity: 1;
}

/* 8 */

#digclock1 .digits div.eight .dd1, #digclock1 .digits div.eight .dd2, #digclock1 .digits div.eight .dd3, #digclock1 .digits div.eight .dd4, #digclock1 .digits div.eight .dd5, #digclock1 .digits div.eight .dd6, #digclock1 .digits div.eight .dd7 {
        opacity: 1;
}

/* 9 */

#digclock1 .digits div.nine .dd1, #digclock1 .digits div.nine .dd2, #digclock1 .digits div.nine .dd3, #digclock1 .digits div.nine .dd4, #digclock1 .digits div.nine .dd5, #digclock1 .digits div.nine .dd7 {
        opacity: 1;
}

/* 0 */

#digclock1 .digits div.zero .dd1, #digclock1 .digits div.zero .dd3, #digclock1 .digits div.zero .dd4, #digclock1 .digits div.zero .dd5, #digclock1 .digits div.zero .dd6, #digclock1 .digits div.zero .dd7 {
        opacity: 1;
}

/* The dots */

#digclock1 .digits div.dots {
        width: calc(10vw/19.20);
}

#digclock1 .digits div.dots:before, #digclock1 .digits div.dots:after {
        width: calc(10vw/19.20);
        height: calc(10vh/10.80);
        content: '';
        position: absolute;
        left: 0;
        top: calc(28vh/10.80);
}

#digclock1 .digits div.dots:after {
        top: calc(68vh/10.80);
}

/*-------------------------
        The Alarm
--------------------------*/

#digclock1 .alarm {
        width: calc(32vw/19.20);
        height: calc(32vh/10.80);
        bottom: calc(40vh/10.80);
        position: absolute;
        opacity: 0.2;
}

#digclock1 .alarm.active {
        opacity: 1;
}

/*-------------------------
        Weekdays
--------------------------*/

#digclock1 .weekdays {
        font-size: calc(24vh/10.80);
        position: absolute;
        top: calc(20vh/10.80);
        left: 0;
        text-align: center;
}

#digclock1 .weekdays span {
        opacity: 0.2;
        padding: 0 calc(15vh/10.80);
}

#digclock1 .weekdays span.active {
        opacity: 1;
}

/*-------------------------
                AM/PM
--------------------------*/

#digclock1 .ampm {
        position: absolute;
        bottom: calc(40vh/10.80);
        right: calc(40vw/19.20);
        font-size: calc(24vh/10.80);
        display: none;
}