/* colors */
/* theme */
/* generic styles classes */
.center {
  text-align: center; }

.cursor-pointer {
  cursor: pointer; }

.disable {
  background-color: #F0F0F0; }

/* generic styles for all app tags*/
.glyphicon {
  margin: 0px 5px 0px 0px; }

.table {
  width: 100%;
  border-spacing: 0px;
  border-collapse: separate; }

body {
  padding-top: 20px; }

h2 {
  text-align: center;
  color: #FF0078;
  margin-top: 10px; }

label.required-true {
  padding-right: 14px;
  background-image: url("/assets/images/required-field.png");
  background-repeat: no-repeat;
  background-position: right top; }

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none; }

.login-body {
  background: url("/assets/images/abstract-pink.png") no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
  .login-body .login-form {
    margin-top: 60px;
    min-width: 300px;
    max-width: 360px; }
    .login-body .login-form h3 {
      color: #FF0078;
      text-align: center;
      margin-top: 50px; }
  .login-body form[role=login] {
    color: #5d5d5d;
    background: #ffffff;
    padding: 26px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px; }
  .login-body form[role=login] img {
    display: block;
    margin: 0 auto; }
  .login-body form[role=login] input,
  .login-body form[role=login] select,
  .login-body form[role=login] button {
    font-size: 18px;
    margin: 16px 0; }
  .login-body form[role=login] select:invalid {
    color: #999999; }
  .login-body form[role=login] > div {
    text-align: center; }
  .login-body .form-links {
    text-align: center;
    margin-top: 1em;
    margin-bottom: 50px; }
  .login-body .form-links a {
    color: #fff; }

input[type=checkbox] .form-control {
  width: 50%; }

.form-group label {
  margin-bottom: 0px; }

.form-group input[type=checkbox] {
  margin: 0px; }

.form-row-buttons .col-md-6 {
  padding-left: 5px;
  padding-right: 5px; }

button#save {
  width: 100%; }

/* autocomplete */
.typeahead ul.dropdown-menu {
  width: 90%; }
  .typeahead ul.dropdown-menu .active a {
    background-color: #FF0078; }

/* datepicker */
.ui-datepicker {
  z-index: 9999 !important;
  border: 1px solid #FF0078 !important; }
  .ui-datepicker .ui-widget-header {
    border: 1px solid #dddddd !important;
    background-color: #FF0078 !important;
    color: #ffffff !important;
    font-weight: normal; }
    .ui-datepicker .ui-widget-header .ui-state-hover {
      background: #FF0078 !important; }
    .ui-datepicker .ui-widget-header .ui-icon {
      background-image: url("/assets/plugins/jquery-ui-1.12.1/images/ui-icons_ffffff_256x240.png") !important; }
  .ui-datepicker .ui-state-active, .ui-datepicker .ui-state-highlight a {
    border: 1px solid #ffffff !important;
    background: #FF0078 !important;
    color: #ffffff !important; }
  .ui-datepicker .ui-widget-content, .ui-datepicker .ui-datepicker-week-end {
    color: #999999 !important; }
  .ui-datepicker .ui-state-default {
    color: #808080 !important; }
  .ui-datepicker .ui-state-highlight {
    border: 0px !important;
    background: #ffffff !important; }
  .ui-datepicker a.ui-state-highlight {
    border: 1px solid #ffffff !important;
    background: #c5c5c5 !important;
    color: #ffffff !important; }

/* clock */
.clockpicker-popover .popover-title .text-primary {
  color: #FF0078 !important; }

.clockpicker-popover .popover-content {
  background-color: #FF0078 !important; }
  .clockpicker-popover .popover-content .clockpicker-canvas line {
    stroke: #FF0078 !important; }
  .clockpicker-popover .popover-content .clockpicker-canvas-bearing, .clockpicker-popover .popover-content .clockpicker-canvas-fg {
    fill: #FF0078 !important; }

/* locks */
.lock {
  padding-top: 5px;
  cursor: pointer; }

.campaign-lock {
  padding-top: 5px;
  cursor: pointer; }

.campaign-field-with-lock {
  position: relative;
  left: -13px; }

.panel-heading .activity-time {
  font-weight: bolder; }

.table {
  margin-bottom: 10px; }

.table .activity-time {
  width: 100px; }

.table td.actions {
  width: 80px; }

.progress {
  margin-bottom: 0px; }

.matrix {
  overflow: auto;
  max-height: 500px; }

.modal .modal-header {
  background-color: #FF0078;
  color: #ffffff; }

.modal .btn {
  color: #ffffff; }

.activityModal .modal-dialog {
  min-width: 1000px !important; }

#listPanel select, input {
  margin-bottom: 10px; }

.daily-report > tbody > tr:nth-of-type(even) {
  background-color: #F0F0F0; }

/* navbar */
.navbar-default {
  color: #FFFFFF; }
  .navbar-default .navbar-header {
    color: #FF0078 !important;
    font-size: x-large;
    padding: 8px 30px 0px 0px; }
    .navbar-default .navbar-header .logo {
      height: 32px;
      width: 32px; }
  .navbar-default .navbar-menu li a:hover {
    background-color: #FF0078; }
  .navbar-default .dropdown-menu li a:hover {
    color: #FFFFFF !important;
    background-color: #FF0078; }
  .navbar-default .dropdown-menu li a:link, .navbar-default .dropdown-menu li a:visited {
    color: #FF0078; }
  .navbar-default .dropdown-submenu {
    position: relative; }
    .navbar-default .dropdown-submenu .dropdown-menu {
      top: 0;
      left: 100%;
      margin-top: -1px; }
  .navbar-default ul:not(dropdown-menu):not(navbar-right) li a:hover {
    color: #FFFFFF !important; }
  .navbar-default ul:not(dropdown-menu):not(navbar-right) li a:link, .navbar-default ul:not(dropdown-menu):not(navbar-right) li a:visited, .navbar-default ul:not(dropdown-menu):not(navbar-right) li a:active {
    color: #FF0078; }
  .navbar-default ul:not(dropdown-menu):not(navbar-right) li.active a {
    background-color: #FF0078 !important;
    color: #FFFFFF !important; }
  .navbar-default .navbar-nav li.open a.dropdown-toggle:hover, .navbar-default .navbar-nav li.open a.dropdown-toggle:link, .navbar-default .navbar-nav li.open a.dropdown-toggle:visited, .navbar-default .navbar-nav li.open a.dropdown-toggle:active {
    background-color: #FF0078 !important;
    color: #FFFFFF; }
  .navbar-default .navbar-nav li:not(open) a:hover {
    background-color: #FF0078 !important; }

/* panel */
.panel {
  border-color: #FF0078 !important; }
  .panel .panel-heading {
    padding: 8px 15px;
    background-color: #FF0078 !important;
    border-color: #FF0078 !important; }

/* forms */
.form-control {
  position: relative;
  font-size: 14px;
  padding: 7px; }

.form-content {
  padding: 0px 15px 15px; }

.btn {
  background-color: #FF0078 !important;
  border-color: #FF0078 !important;
  color: #FFFFFF !important; }

.btn-danger {
  background-color: red !important;
  border-color: #FF0078 !important;
  color: #FFFFFF !important; }

.btn-close {
  background-color: transparent !important; }

/* pagination */
.pagination li:not(.active) a {
  color: #FF0078 !important; }

.pagination li.active a {
  background-color: #FF0078 !important;
  border-color: #FF0078 !important;
  color: #ffffff; }

.pagination li a {
  border-color: #FF0078 !important; }

/* jquery - datatable */
.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0.5em 0; }

.dt .row {
  padding: 15px; }

.dt-filter {
  margin-bottom: 20px; }

.dt-filter select, .dt-filter input {
  width: 176px !important; }

.dt-filter-buttons {
  min-height: 34px;
  margin-bottom: 20px; }

.table-striped > tbody > tr:nth-of-type(odd),
.dataTable > tbody > tr:nth-of-type(odd),
#table-process-by-production-plant > tbody > tr:nth-of-type(even),
#table-activity-types-by-process > tbody > tr:nth-of-type(odd),
#table-drivers-to-activities > tbody > tr:nth-of-type(even) {
  background-color: #F0F0F0; }

/* unknown */
th.rotate {
  /* Something you can count on */
  height: 140px;
  white-space: nowrap; }

th.rotate > div {
  position: relative;
  top: 0px;
  left: 40px;
  /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
  height: 100%;
  -ms-transform: skew(-45deg, 0deg);
  -moz-transform: skew(-45deg, 0deg);
  -webkit-transform: skew(-45deg, 0deg);
  -o-transform: skew(-45deg, 0deg);
  transform: skew(-45deg, 0deg);
  /*overflow: hidden;
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
  border-top: 1px solid #dddddd; */ }

th.rotate > div > span {
  -ms-transform: skew(45deg, 0deg) rotate(315deg);
  -moz-transform: skew(45deg, 0deg) rotate(315deg);
  -webkit-transform: skew(45deg, 0deg) rotate(315deg);
  -o-transform: skew(45deg, 0deg) rotate(315deg);
  transform: skew(45deg, 0deg) rotate(315deg);
  position: absolute;
  bottom: 30px;
  /* 40 cos(45) = 28 with an additional 2px margin*/
  left: -25px;
  /*Because it looked good, but there is probably a mathematical link here as well*/
  display: inline-block;
  width: 85px;
  /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
  text-align: left; }