/*
@function mdi($name) {
  @return char(nth($hexes, index($names, $name)));
}*/
/* Global CSS */
html,
body {
  background: #edf1f5;
  color: #414141;
  font-family: "Open Sans", sans-serif; }

html {
  font-size: 62.5%; }

body {
  font-size: 12px;
  font-size: 1.2rem; }

a {
  font-size: 12px;
  font-size: 1.2rem; }

p {
  font-size: 13px;
  font-size: 1.3rem; }

h3 {
  color: #777;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 400;
  margin: 20px 0 14px 16px;
  text-transform: uppercase; }
  h3.panelTitle {
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400; }
  h3.top {
    margin-top: 0; }

button,
select,
html,
textarea,
input {
  font-family: "Open Sans", sans-serif; }

label {
  font-weight: normal;
  margin-bottom: 0; }

.fullHeight {
  height: 100%; }

.wrapper {
  height: 100%;
  overflow: hidden; }
  .wrapper .contentWrapper {
    overflow: auto; }
    .wrapper .contentWrapper .mdContentWrapper {
      background: #fafafa; }
    .wrapper .contentWrapper .padding {
      padding: 0 20px; }
      .wrapper .contentWrapper .padding.results {
        padding: 20px; }

.results .md-errors-spacer {
  min-height: 0; }

.mainHeader.user:before {
  content: "";
  display: block;
  height: 52px;
  width: 150px;
  background: #fff url(../static/img/logo.png) no-repeat center center;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -26px 0 0 -75px; }

.actionButton {
  position: fixed;
  bottom: 20px;
  right: 20px; }
  .actionButton.second {
    bottom: 90px; }

.md-list-item-text {
  font-size: 11px;
  font-size: 1.1rem; }

/* ListViews */
.searchRow {
  padding-top: 20px; }

/* Admin section styling */
.variableTable {
  width: 100%; }
  .variableTable td {
    padding: 0 20px; }
  .variableTable.ld1 td {
    width: 50%; }
    .variableTable.ld1 td:nth-child(even) {
      background: #edf1f5; }
    .variableTable.ld1 td:first-child {
      font-weight: 700; }
  .variableTable.ld3 td:nth-child(odd) {
    background: #edf1f5; }
  .variableTable th {
    padding-bottom: 20px; }
  .variableTable tr:first-child td {
    padding-top: 20px; }

/* LoginForm specific styling */
.loginForm > div {
  width: 384px;
  max-width: 384px;
  min-width: 384px; }
.loginForm h3 {
  margin: 32px 0 16px 16px; }
.loginForm ._md-label {
  font-size: 12px;
  font-size: 1.2rem; }
.loginForm .link {
  margin-bottom: 16px; }
.loginForm .md-button {
  width: 100%;
  margin: 0; }

/* resultpage custom styling */
.euro {
  position: absolute;
  top: 8px; }

.euroInput {
  padding-left: 15px !important; }

.percentage {
  position: absolute;
  top: 8px; }

.percentageInput {
  padding-right: 15px; }

.referteeis {
  margin-bottom: 0; }

.variables .sliderLabel span {
  font-size: 12px;
  font-size: 1.2rem; }
.variables .kenmerk {
  margin-bottom: 10px; }
.variables .checkbox span {
  font-size: 12px;
  font-size: 1.2rem; }
.variables .slider {
  margin-bottom: 5px; }
.variables md-select {
  margin: 0; }
.variables .worked {
  margin-bottom: 25px !important; }
.variables .layout-column > * {
  margin-bottom: 35px; }
  .variables .layout-column > *:last-child {
    margin-bottom: 15px; }
.variables .md-datepicker-input-container {
  width: auto; }
  @media (max-width: 1366px) {
    .variables .md-datepicker-input-container {
      width: 100px; } }
.variables .md-datepicker-input {
  min-width: 120px; }
  @media (max-width: 1366px) {
    .variables .md-datepicker-input {
      min-width: 100px; } }
.variables md-input-container .md-input-messages-animation {
  position: absolute;
  top: 32px;
  white-space: nowrap; }
.variables .smallColumn {
  width: 160px; }
.variables .wga_schade md-input-container {
  margin-right: 10px; }

.boldLabel {
  margin-bottom: 20px !important;
  font-weight: 700; }

/* Settings page */
.checkList {
  list-style: none;
  padding: 0; }
  .checkList li {
    margin-bottom: 20px; }
  .checkList .warn {
    color: red; }
  .checkList .check {
    color: green; }

.resetLink {
  text-decoration: underline;
  cursor: pointer; }

.matrixTable {
  width: auto;
  border: 1px solid #eee;
  font-size: 11px;
  font-size: 1.1rem; }
  .matrixTable .dates td {
    vertical-align: top; }
  .matrixTable td {
    padding: 6px;
    border: 1px solid #eee;
    text-align: center;
    position: relative;
    width: 110px;
    max-width: 110px; }
    .matrixTable td:first-child {
      text-align: left; }
    .matrixTable td.firstColumn {
      width: 300px;
      max-width: 300px; }
    .matrixTable td.totals {
      border-top: 2px solid black; }
    .matrixTable td .totalCell {
      width: 110px;
      float: right;
      text-align: center; }
    .matrixTable td .colorBlock {
      width: 10px;
      height: 27px;
      display: block;
      position: absolute;
      top: 0;
      right: 0; }
      .matrixTable td .colorBlock.lua {
        background: #376092; }
      .matrixTable td .colorBlock.ald {
        background: #95b3d7; }
        .matrixTable td .colorBlock.ald.schade {
          background: #de2020; }
      .matrixTable td .colorBlock.wga_lgu {
        background: #92d050; }
        .matrixTable td .colorBlock.wga_lgu.schade {
          background: #ff3939; }
      .matrixTable td .colorBlock.wga_la {
        background: rgba(146, 208, 80, 0.6); }
      .matrixTable td .colorBlock.wga_vvu {
        background: #d7e4bd; }
        .matrixTable td .colorBlock.wga_vvu.schade {
          background: #ff6464; }
      .matrixTable td .colorBlock.iva {
        background: rgba(246, 130, 34, 0.8); }
      .matrixTable td .colorBlock.wga_hiaat {
        background: #c4bd97; }
      .matrixTable td .colorBlock.wia_excedent {
        background: #e9bc88; }
      .matrixTable td .colorBlock.hcaanv {
        background: #ca726f; }
      .matrixTable td .colorBlock.wga_roc {
        background: #be514e; }
      .matrixTable td .colorBlock.loyalis {
        background: #9e6da1; }
      .matrixTable td .colorBlock.allaanv {
        background: #005f6a; }
      .matrixTable td .colorBlock.taf_paww {
        background: #9983b5; }
      .matrixTable td .colorBlock.taf_wia {
        background: #6fbdd1; }
      .matrixTable td .colorBlock.loyalis_vvt {
        background: #ff8a3b; }
      .matrixTable td .colorBlock.zw {
        background: #b7dee8; }
        .matrixTable td .colorBlock.zw.schade {
          background: #ff0000; }
    .matrixTable td.settlementHeader {
      font-weight: 700;
      font-size: 12px;
      font-size: 1.2rem; }
      .matrixTable td.settlementHeader.ld {
        background: rgba(140, 140, 140, 0.3); }
      .matrixTable td.settlementHeader.zw {
        background: rgba(140, 140, 140, 0.6); }
      .matrixTable td.settlementHeader.wga, .matrixTable td.settlementHeader.iva {
        background: rgba(176, 176, 176, 0.2); }

.warning_text {
  padding: 20px 10px;
  font-size: 12px;
  font-weight: 700; }
  .warning_text.red {
    color: red; }

.helpBubble {
  max-width: 256px;
  padding: 10px; }

.center {
  text-align: center; }

.minWageTable table.md-table {
  width: auto; }
  .minWageTable table.md-table .md-errors-spacer {
    min-height: 10px; }

/* Input Container customisations */
md-input-container.md-input-focused label:not(.md-no-float),
md-input-container.md-input-has-placeholder label:not(.md-no-float),
md-input-container.md-input-has-value label:not(.md-no-float) {
  transform: translate3d(0, 6px, 0) scale(1); }

md-input-container {
  margin: 9px 6px 0 0; }
  md-input-container > md-select {
    margin-bottom: 24px; }
  md-input-container .md-input {
    font-size: 13px;
    font-size: 1.3rem; }

.md-button {
  font-size: 12px;
  font-size: 1.2rem;
  padding: 0 12px;
  line-height: 35px; }

/* md-datepicker customisations */
.md-datepicker-input {
  font-size: 13px;
  font-size: 1.3rem; }

/* Side navigation */
.md-sidenav-left {
  width: 220px; }
  .md-sidenav-left.scenario {
    width: 320px; }
  .md-sidenav-left .navigation .md-button {
    text-transform: none;
    text-align: left;
    padding-left: 16px;
    height: 46px;
    line-height: 46px;
    width: 100%;
    border-radius: 0;
    margin: 0;
    font-size: 12px;
    font-size: 1.2rem; }
    .md-sidenav-left .navigation .md-button span {
      min-height: 20px;
      display: inline-block;
      height: 20px;
      line-height: 22px;
      vertical-align: middle; }
    .md-sidenav-left .navigation .md-button:hover {
      background: rgba(153, 153, 153, 0.2); }
    .md-sidenav-left .navigation .md-button.active {
      background: rgba(0, 0, 0, 0.1); }
    .md-sidenav-left .navigation .md-button md-icon {
      margin-right: 16px;
      color: #b0bec5;
      /*@include font-size(14);
      line-height: 2.2rem;
      min-width: 20px;
      min-height: 20px;
      width: 20px;
      height: 20px;*/ }

/* Tabs customisations */
md-tabs.md-default-theme.md-accent
> md-tabs-wrapper
> md-tabs-canvas
> md-pagination-wrapper
> md-tab-item:not([disabled]),
md-tabs.md-accent
> md-tabs-wrapper
> md-tabs-canvas
> md-pagination-wrapper
> md-tab-item:not([disabled]) {
  color: rgba(0, 0, 0, 0.54); }

md-tabs:not(.md-no-tab-content):not(.md-dynamic-height) {
  height: 100%; }

md-tab-content > div {
  height: 100%;
  position: relative; }

.md-track-ticks {
  display: none; }

/* Data table customisations */
table.md-table.md-row-select tbody.md-body > tr.md-row {
  cursor: pointer; }

table.md-table th.md-column md-icon {
  min-height: auto;
  min-width: auto; }

table.md-table td.md-cell {
  position: relative; }

table.md-table.md-row-select tbody.md-body > tr.md-row.warnIcon > td:first-child:before {
  font: normal normal normal 24px/1 "Material Design Icons";
  color: #e73629;
  content: mdi("alert-circle");
  position: absolute;
  left: 16px;
  top: 12px; }

/* Toast customisation */
md-toast.md-center {
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  width: 568px; }
md-toast.customToast .md-toast-content {
  width: 100%; }
  md-toast.customToast .md-toast-content > span {
    text-align: center; }

/* Loading Indicator */
.loading-indicator {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10; }

/* D3 adjustments */
.nvd3 text {
  font-family: "Open Sans", sans-serif; }

text.nv-axislabel {
  font-weight: 700; }

.nv-axis .tick line {
  display: none; }

/* Expanded margin and padding classes */
.margin-center > *:first-child {
  margin-right: 8px; }
.margin-center > *:last-child {
  margin-left: 8px; }

.margin-left > * {
  margin-right: 16px; }
  .margin-left > *:last-child {
    margin-right: 0; }

.margin-right > * {
  margin-left: 16px; }

.mb-16 {
  margin-bottom: 16px; }

.bottom-padding {
  padding-bottom: 16px !important; }

.print .layout,
.print .layout-column,
.print .layout-row {
  display: block !important; }
.print .results {
  display: none !important; }
.print .print {
  display: block; }
.print .mainHeader {
  display: none !important; }
.print .wrapper {
  display: block;
  overflow: auto;
  height: initial; }
.print .printTable {
  width: 100%; }
  .print .printTable td {
    width: 10%;
    padding: 5px 0;
    border-bottom: 1px solid #ccc; }
    .print .printTable td:first-child {
      width: 45%; }
    .print .printTable td:last-child {
      width: 45%; }

@media print {
  .print .layout,
  .print .layout-column,
  .print .layout-row {
    display: block !important; }
  .print .results {
    display: none !important; }
  .print .print {
    display: block; }
  .print .mainHeader {
    display: none !important; }
  .print .wrapper {
    display: block;
    overflow: auto;
    height: initial; }
  .print .back {
    display: none; }
  .print .printTable {
    width: 100%; }
    .print .printTable td {
      width: 10%;
      padding: 5px 0;
      border-bottom: 1px solid #ccc; }
      .print .printTable td:first-child {
        width: 45%; }
      .print .printTable td:last-child {
        width: 45%; } }
.variablesWrapper {
  max-height: 252px; }

.workerData {
  width: 100%; }
  .workerData md-input-container label:not(.md-no-float):not(.md-container-ignore) {
    white-space: normal; }

.navbar {
  border: 0;
  font-size: 1em; }
  .navbar .navbar-text {
    margin-bottom: 0;
    margin-top: 8px; }
  .navbar .navbar-right {
    font-size: 13px; }
  .navbar .navbar-nav {
    margin-left: 250px; }
    .navbar .navbar-nav li a {
      color: #997eac;
      font-weight: bold; }
    .navbar .navbar-nav li.active a {
      text-decoration: underline; }

.userName {
  font-size: 12px;
  font-size: 1.2rem;
  margin-right: 16px; }

.navbar-brand {
  display: block;
  height: 50px;
  width: 150px;
  background: #FFF url(../static/img/logo.png) no-repeat center center;
  background-size: contain;
  margin: 0 auto; }
  @media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (-webkit-min-device-pixel-ratio: 1.25), only screen and (min-resolution: 120dpi) {
    .navbar-brand {
      background: #FFF url(../static/img/logo.png) no-repeat center center;
      background-size: contain; } }
  .navbar-brand img {
    height: 40px; }

/* UI VIEW TRANSITIONS */
.animate.ng-enter {
  transition: all 0.5s linear;
  opacity: 0; }
  .animate.ng-enter.ng-enter-active {
    opacity: 1; }
.animate.ng-leave {
  opacity: 0; }
  .animate.ng-leave.ng-leave-active {
    opacity: 0; }
