#punchBackgroundImage{
    z-index:-1;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    position:fixed;
    background-repeat:no-repeat;
    opacity:0.1;
    background-size:auto 40%;
    background-position:bottom 30px right 30px;
}

.punchUserStatus{}
.punchUserStatus>label{font-weight:bold;text-transform:uppercase;font-size:14px;}
.punchUserStatus>label:after{content:":";padding:0px 5px;}
.punchTimeSpan{padding-top:5px;}
.punchTimeSpan>label{font-weight:bold;text-transform:uppercase;font-size:14px;}
.punchTimeSpan>label:after{content:":";padding:0px 5px;}

#punchEventErrorZone{padding:20px 0px 0px 0px;color:#990000;}
#punchEventErrorZone:empty{display:none;}

.addonPunchTimeCounter{display:inline-block;}
#punchEventActions{padding-top:20px;}

.punchBranchTitle{font-weight:300;padding-bottom:5px;padding-top:20px;font-size:16px;line-height:20px;}

#addonPunchDepartmentTab{margin-right:0px;}
#addonPunchDashboardOptions div.field{display:inline-block;vertical-align:top;margin:0px 15px 15px 0px;}
#addonPunchDashboardOptions div.field label{display: block;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: bold;
    padding-bottom: 3px;
    height: auto;
    line-height: 14px;}

#addonPunchDashboardOutput div.user{display:inline-block;vertical-align:top;margin:0px 15px 15px 0px;overflow:hidden;border-radius:5px;box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);}
#addonPunchDashboardOutput div.user>div.label{padding:5px 10px;background:#999;color:#FFF;font-size:16px;font-weight:bold;}
#addonPunchDashboardOutput div.user div.department:not(.running) div.ongoing{display:none;}
#addonPunchDashboardOutput div.ongoing{display:inline-block;font-size:11px;text-transform:uppercase;margin-left:5px;line-height:11px;padding:2px 3px;color:#FFF;background:#666;}
#addonPunchDashboardOutput div.total{background:rgba(0,0,0,0.1);}
#addonPunchDashboardOutput div.total>div{font-weight:bold;}
#addonPunchDashboardOutput div.content>div>div{padding:5px 10px;}