html, body, .body-content {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    /*height: auto !important;*/
    height: 100%;
    margin: 0 auto -25px; 
}

footer, .push {
    height: 25px; 
}

footer {
    text-align: right;
    font-size: 0.8em;
}

footer a {
    color: #888;
}

body {
    padding-top: 50px;
    padding-bottom: 20px;
    background: #161e29;

    background-image: url("/Content/images/fasad_blue.jpg");
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}

body.fasad-background-image {
    background-image: url("/Content/images/fasad_background.jpg");
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
}

@media (min-width: 1200px) {
    .container {
        width: 1336px;
    }
}

.navbar img.logo {
    margin-top: 3px;
    height: 44px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.input-group {
    max-width: 280px;
}

.calendar .calendar-row .calendar-xs-1 {
    border-bottom: 1px solid #000;
}

.calendar .calendar-row:first-child .calendar-xs-1 {
    border-top: 1px solid #000;
}

.calendar-xs-1 {
    border-right: 1px solid #000;
}

.calendar-row .calendar-xs-1:first-child {
    border-left: 1px solid #000;
}

.calendar .header-entry {
    text-align: center;
    padding: 10px 0;
    background: #172433;
}
    .calendar .empty-corner .header-entry {
        background-color: transparent;
    }

.calendar .booking-entry {
    text-align: center;
    margin: 0px 0;
    margin-right: 0px;
    height: 50px;
    padding: 3px;
}
    .calendar .booking-entry .hours {
        text-align: right;
        margin: 0px 3px 0px;
        font-size: 0.8em;
    }

    .calendar .booking-entry .name {
        margin: 10px 0px 0px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .calendar .booking-entry.name {
        background: #172433;
    }
   

    .calendar .booking-entry.add {
        margin: 0;
        background: #45712c;
    }

        .calendar .booking-entry.add:hover {
            background:#538835;
        }

        .calendar .booking-entry.add a {
            display: block;
            padding: 13px 0px;
            color: #c8c8c8;
            font-size: 14px;
            cursor: pointer;
        }

             .calendar .booking-entry.add a:hover {
                text-decoration: none;
            }

    .calendar .booking-entry.is-booked {
        background-color: #313e4c;
    }
        .calendar .booking-entry.is-booked:hover {
            background-color: #3c4c5d;
        }

    .calendar .booking-entry.is-booked .project.canclick {
        cursor: pointer;
    }

.calendar .calendar-row:first-child .calendar-xs-1.empty-corner {
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;
}

.calendar.compact {
    font-size: 13px;
    width: 921px;
}

.calendar.compact .calendar-col-name {
    width: 146px;
    float: left;
}

.calendar.compact .calendar-col-booking {
    width: 25px;
    float: left;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
}

.calendar.compact .calendar-col-booking.oddweek .header-entry {
    background-color: #29405b;
}

.calendar.compact .booking-entry {
    height: auto;
    padding: 0px;
}

.calendar.compact .booking-entry.add {
    background-color: #adadad;
}

.calendar.compact .oddweek .booking-entry.add {
    background-color: #e0e0e0;
}

.calendar.compact .header-entry {
    padding: 0;
}

.calendar.compact .booking-entry .name {
    margin: 0;
}

.calendar-project-legend .color-square {
    width: 20px;
    height: 20px;
    border-radius: 5px;
}

.weeknavigation h2 {
    margin: 10px 0;
    text-transform: capitalize;
}

.weeknavigation h2 .fa {
    margin: 0 1em;
    font-size: 0.8em;
}

.table-striped tr.totals td
{
    background-color: #384961;
    font-weight: bold;
}

.modal-dialog .form-group {
    max-width: 280px;
}

.modal-footer{
    text-align: left;
}

.modal-footer .btn.right-adjusted {
    float: right;
}

.reschedule-wrapper.checkbox label.toggle-on {
    padding-left: 15px;

}


/* Absolute Center Spinner */
#fullscreen-loading {
  display: none;
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: show;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
#fullscreen-loading:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
}

/* :not(:required) hides these rules from IE9 and below */
#fullscreen-loading:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

#fullscreen-loading:not(:required):after {
  content: '';
  display: block;
  font-size: 40px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: spinner 3000ms infinite linear;
  -moz-animation: spinner 3000ms infinite linear;
  -ms-animation: spinner 3000ms infinite linear;
  -o-animation: spinner 3000ms infinite linear;
  animation: spinner 3000ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
  box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


.colorpicker-2x .colorpicker-saturation {
    width: 200px;
    height: 200px;
}

.colorpicker-2x .colorpicker-hue,
.colorpicker-2x .colorpicker-alpha {
    width: 30px;
    height: 200px;
}

.colorpicker-2x .colorpicker-color,
.colorpicker-2x .colorpicker-color div {
    height: 20px;
}

.colorpicker-2x .colorpicker-selectors i {
    width: 20px;
    height: 20px;
}