/*
   Color theme

   Loxysoft colors (blue):
   dark:       rgb(44, 62, 80)
   middle:     rgb(0, 114, 171)
   light blue: rgb(62, 163, 220)

   Light yellow : r gb(237, 222, 147);
   Other : # F0AE00;

*/

.color_dark {
   background-color: rgb(44, 62, 80);
}

.color_medium {
   background-color: rgb(0, 114, 171);
}

.color_light {
   background-color: rgb(237, 222, 147);
}

.color_other {
   background-color: #F0AE00;
}

body {
   background-color: white;
}

p {
   margin-top: 0;
}

h2 {
   margin: 1em 0 0.3em 0;
}

h3 {
   margin: 1em 0 0.3em 0;
}

th {
   height: 20px;
}

td {
   height: 16px;
}

label {
   color: rgb(0, 114, 171);
}

.button {
   background-color: rgb(0, 114, 171);
   -moz-box-shadow: rgb(44, 62, 80) 0px 2px 1px;
   -webkit-box-shadow: rgb(44, 62, 80) 0px 2px 1px;
   box-shadow: rgb(44, 62, 80) 0px 2px 1px;
}

   .button:hover {
      background-color: #F0AE00;
   }

.wrapper {
   width: 100%;
   margin: auto;
   border-radius: 0;
}

.outerwrapper {
   margin: 0px;
}

#header {
   border-radius: 0;
}

#headercontainer {
   background-color: rgb(44, 62, 80);
}

#content {
   width: auto;
   border-radius: 0;
   margin-right: 0;
   background-color: white;
}

#leftsidebar {
   border-radius: 0;
}

#sidebar {
   border-radius: 0;
   width: auto;
   float: right;
   background-color: white;
}

#footer {
   border-radius: 0px;
   color: darkgray;
}

.background {
   background-color: white;
}

.page {
   background-color: rgb(0, 114, 171);
}

.layoutbox {
   background-color: white;
   box-shadow: 0px 0px 0px;
}

.groupbox-solid {
   border: none;
   background-color: white;
}

.groupbox-solid-header {
   background: none;
   color: rgb(0, 114, 171);
   text-align: left;
   font-size: 150%;
}

.taskheader {
   border-bottom: 1px rgb(0, 114, 171) dotted;
   margin-left: 15px;
}

.table-medium {
   border: 1px solid rgb(192,192,192);
   border-radius: 3px;
   font-size: 120%;
}

   .table-medium tbody tr[data-main='true'][data-even] {
      border-top: 1px solid #c3c3c3;
      border-bottom: 1px solid #c3c3c3;
   }

   .table-medium tbody tr[data-sub='true'] {
      background-color: rgb(252, 252, 252);
      border-top: 1px solid #c3c3c3;
      border-bottom: 1px solid #c3c3c3;
   }

   .table-medium th {
      color: white;
      background-color: rgb(0, 114, 171);
      font-size: 80%;
      font-weight: 700;
      padding: 10px 8px;
      line-height: 130%;
   }

      .table-medium th a {
         color: white;
      }

      .table-medium th[data-sort]:hover {
         background-color: #F0AE00;
      }

   .table-medium td {
      font-size: 80%;
      font-weight: 700;
      padding: 10px 8px;
      line-height: 110%;
   }

.ver-minimalist tr:hover td {
   color: black;
   background-color: #eee;
   padding-right: 30px;
}

.tblbottom {
   line-height: 130%;
   color: rgb(0, 114, 171);
}

   .tblbottom a {
      color: rgb(0, 114, 171);
   }

.tblpagesize select {
   color: rgb(0, 114, 171);
   border: 1px solid rgb(0, 114, 171);
   border-radius: 4px;
}

.tblpages a {
   color: rgb(0, 114, 171);
}

   .tblpages a.selectedtblpage {
      border: 1px solid rgb(0, 114, 171);
   }

.table-vertical td:before {
   color: rgb(0, 114, 171);
}

.taskitems .taskitem {
   background-color: white !important;
   border: 1px solid rgb(192,192,192) !important;
   border-radius: 3px !important;
   box-shadow: 0px 0px 0px !important;
   float: left;
   margin: 0px 10px 10px 0px;
   position: relative;
   width: 200px;
   height: 40px;
   overflow: hidden;
}

.taskitem:hover {
   background-color: #eee !important;
}

.taskicon {
   margin-left: 8px;
   margin-top: 3px;
   vertical-align: bottom;
}

.taskitems .taskitem-h4 {
   color: black !important;
   background-color: transparent !important;
   font-size: 90%;
   margin: 10px 0 0 5px;
   display: inline;
   position: static;
}

.paidbreaktaskbutton {
   background-image: url('../../../Content/images/register/Coffee.png'), url('../../../Content/images/register/Coins.png');
}


.userMessages {
   background-color: rgb(0, 114, 171);
   width: 20px;
   height: 20px;
   position: relative;
   text-align: center;
   color: white;
   font-weight: bold;
   margin-top: 15px;
   left: -40px;
}

.taskitem-image {
   width: 100%;
}

.taskitem-header {
   display: inline;
   padding-top: 0;
   padding-bottom: 0;
   line-height: 200%;
   vertical-align: baseline;
}

.table-medium .worktask {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -126px -119px;
   background-size: auto;
}

.table-medium .paidbreaktask {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -382px -310px;
   background-size: auto;
}

.table-medium .unpaidbreaktask {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -94px -439px;
   background-size: auto;
}

.table-medium .sicktask {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -286px -22px;
   background-size: auto;
}

.table-medium .vacationtask {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -61px -54px;
   background-size: auto;
}

.taskitem .registerin {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -288px -336px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}

.taskitem .registerout {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -240px -336px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}

.taskitem .vacationtaskbutton {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -96px -96px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}

.taskitem .sicktaskbutton {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -432px -48px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}

.taskitem .paidbreaktaskbutton {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -576px -480px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
   background-size: auto;
}

.taskitem .unpaidbreaktaskbutton {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -144px -672px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}

.taskitem .worktaskbutton {
   margin-left: 8px;
   margin-top: 4px;
   vertical-align: bottom;
   background-position: -192px -192px;
   display: inline-block;
   width: 32px;
   height: 32px;
   background-image: url('icons/sprites32.svg');
   background-repeat: no-repeat;
}



.table-medium .register-comment {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -190px -1px;
   background-size: auto;
   border: 1px solid #fff;
   background-color: #fff;
   border-radius: 3px;
}

.table-medium .register-hascomment-edit {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: 0 -63px;
   background-size: auto;
   border: 1px solid #fff;
   background-color: #fff;
   border-radius: 3px;
}

.table-medium .today-deletetps {
   background-image: url('icons/sprites16.svg');
   background-repeat: no-repeat;
   background-position: -352px -224px;
   background-size: auto;
   border: 1px solid #fff;
   border-radius: 3px;
}

.iconbutton {
   border: 1px solid #fff;
   vertical-align: middle;
   background-color: #FFF;
   border-radius: 3px;
}

   .table-medium .today-deletetps:hover, .table-medium .register-comment:hover, .register-hascomment-edit:hover, .iconbutton:hover {
      background-color: #eee;
      border: 1px solid #eee;
   }


/* TEST TO GET BETTER WRAPPING ON FILTER */
.filterenable {
   width: 100%;
}

.filterenablebutton {
   float: left;
   background-color: rgb(0, 114, 171);
}

.filterenableheader {
   width: calc(100% - 50px);
}

.filterenableheaderitem div {
   display: block;
}

.filterdivider {
   background-color: rgb(0, 114, 171);
}


/*ShiftTarget*/
.TimeWebShiftTargets table.table-medium.static tr:first-child td:first-child {
   border-top: solid 1px #c3c3c3;
}

.filtercontainer input[type="checkbox"] {
   margin-right: 10px;
}

.filtercontainer label.after {
   width: auto;
}

.filtercontainer label {
   color: rgb(44, 62, 80);
}

.filteritem {
   display: inline-block;
   border-top: 1px rgb(0, 114, 171) solid;
   border-bottom: 1px rgb(0, 114, 171) solid;
   border-right: 1px rgb(0, 114, 171) solid;
}

.tabmenuitem {
   background-color: rgb(237, 222, 147);
   border-right: 1px solid rgb(0, 114, 171);
}

.user-info-content a:link, .user-info-content a:visited {
   color: #F0AE00;
}

.user-info-content a:active, .user-info-content a:hover {
   color: rgb(44, 62, 80);
}

.tblbottom {
   color: rgb(0, 114, 171);
}

.tblpagesize select {
   color: rgb(0, 114, 171);
   border: 1px solid rgb(0, 114, 171);
}

[class*="icon-16-"] {
   background-image: url(icons/sprites16.svg);
}

[class*="icon-32-"] {
   background-image: url(icons/sprites32.svg);
}

[class*="icon-64-"] {
   background-image: url(icons/sprites64.svg);
}

.optionButton {
   background: white url('icons/sprites16.svg') no-repeat -27px -28px;
}

.groupbox-solid-header {
   color: rgb(0, 114, 171);
}

.periodtabnumbers li.active a {
   color: rgb(0, 114, 171);
}