﻿/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
/*input,
select,
textarea {
    max-width: 280px;
}
*/

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }
}


/* 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 widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 500px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }
}



.menuTreeContent {
    background-image: linear-gradient(lightgray, whitesmoke);
}

.badge-info {
    background: linear-gradient(to right,#3b3f4d,#788199);
}

/*Modals Styles*/
.modal-header {
    background: linear-gradient(to right,#3b3f4d,#788199);
    color: white;
}

.modal-body {
    overflow-y: auto;
    max-height: calc(100vh - 200px);
}

.modal-title {
    color: white;
}

.modal-content {
    background-color: whitesmoke;
}

.modal-footer {
    background-color: white;
}

.changeColor {
    background-color: lightgray;
    color: white;
    font-size: 16px;
}

.chartContainer:hover {
    transition-delay: 1s; /* delays for 1 second */
    -webkit-transition-delay: 1s; /* for Safari & Chrome */
}

.panelContent {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 15px 15px 15px 15px;
    margin-top: -5px;
}

.panel {
    margin-top: 10PX;
    margin-left: 10px;
    margin-right: 10px;
}

.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}

.grid-header-mod {
    background: linear-gradient(#3b3f4d,#788199);
    color: whitesmoke;
    text-align-last: center;
}


.contentFilter {
    position: sticky;
    top: 50px;
    z-index: 1;
}

paddingLeft {
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 5px;
    padding-right: 0;
}

paddingRight {
    padding-bottom: 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 5px;
}

.divLoading {
    position: fixed;
    text-align: center;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    left: 0;
    z-index: 9999999;
    vertical-align: central;
}

.loadingImage {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 30em;
    height: 18em;
    margin-top: -9em; /*set to a negative number 1/2 of your height*/
    margin-left: -15em; /*set to a negative number 1/2 of your width*/
    opacity: 0.8;
}

.panel-danger > .panel-heading {
    background-color: #ca3838;
    border-color: #ca3838;
}

.panel-danger {
    border-color: #ca3838;
    border-width: 2px;
}

.panel-success > .panel-heading {
    background-color: #60bd49;
    border-color: #60bd49;
}

.panel-success {
    border-color: #60bd49;
    border-width: 2px;
}

.panel-warning > .panel-heading {
    background-color: #ea7f2f;
    border-color: #ea7f2f;
}

.panel-warning {
    border-color: #ea7f2f;
    border-width: 2px;
}

.panel-primary > .panel-heading {
    background-color: #65727c;
    border-color: #65727c;
}

.panel-primary {
    border-color: #65727c;
    border-width: 2px;
}

.clientName {
    font-size: 24px;
    font-weight: bolder;
    vertical-align: -webkit-baseline-middle;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
}

.imgContainer {
    overflow-y: auto;
    max-height: calc(100vh - 150px);
}

.carouselChart {
    position: absolute;
    top: 8%;
    left: 8%;
}


/* YOUR CSS Carousel Fade */
.carousel-inner > .item > img, .carousel-inner > .item > a > img {
    display: block;
    height: auto;
    width: 100%;
    line-height: 1;
}

/*Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb*/
.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
    opacity: 1;
}

    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
        left: 0;
        opacity: 0;
        z-index: 1;
    }

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}

/*WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

        .carousel-fade .carousel-inner > .item.next.left,
        .carousel-fade .carousel-inner > .item.prev.right,
        .carousel-fade .carousel-inner > .item.active {
            opacity: 1;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }
}

.heightAjustable {
    overflow-y: auto;
    max-height: calc(100vh - 200px);
}


.ajax__calendar_container {
    padding: 4px;
    position: absolute;
    cursor: default;
    width: 170px;
    font-size: 11px;
    text-align: center;
    font-family: tahoma,verdana,helvetica;
    z-index: 100003;
   
}
