body {box-sizing:border-box;background:transparent;}
#content {mardin:0; padding:0;}
.header {display:flex;align-items:center;position:relative;min-height:120px;box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;}
.header .left {display:flex;align-items:center;position:absolute;left:10px;}
.header .left .printerstate {margin-left:10px;}
.header .center {display:flex;align-items:center;margin:0 auto;text-align:center;}
.header .center .name {margin-left:10px;}
.header .right {display:flex;align-items:center;position:absolute;right:10px;top:10px;}
.circle-container {display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-height:100px;min-width:100px;}
.header .clock {font-size:24px;min-width:100px;min-height:100px;position:relative;display:flex;justify-content:center;align-items:center;}
.clockoutline {position: relative; width: 100px; height: 100px; border-radius: 50%; background: conic-gradient(#ddd 0%, #ddd 50%, #ddd 50%, #ddd 100%);}
.clockoutline::before { content: "";position: absolute;top: 10px;left: 10px;width: 80px; height: 80px; border-radius: 50%; background: #ffffff; }
.header .logo img {width:30px;height:auto;}

canvas {position: absolute;top: 0;right: 0;border-radius: 50%;}
.clock canvas {position: absolute;top: 0;right: unset;left:0;border-radius: 50%;}
.time-text {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 24px;color: #333;}
#clocktime {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 24px;color: #333;}

.viewordersbody {padding:15px;max-width:1200px;margin:0 auto;font-size:20px;line-height:30px;}
.viewordersbody tr td {width:33%;}
.oneorderline {display:inline-block;padding-right:30px;}
.printok {background:url("/css/images/print_ok.png") no-repeat right center;background-size:18px auto;}
.printfailed {background:url("/css/images/print_failed.png") no-repeat right center;background-size:18px auto;}
.inpreparation {background:url("/css/images/processing-green.png") no-repeat right center;background-size:18px auto;}
.served {background:url("/css/images/served-green.png") no-repeat right center;background-size:18px auto;}




@media (max-width: 768px) {
    .header {flex-direction: column;align-items: flex-start;    }
    .center {margin-top: 10px;justify-content: flex-start;}
}


