/* 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;
}

/* 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;
        background-image: url(/Content/Jumbotron_2023_3.jpg);
        background-size: 100% 100%;
    }

        .jumbotron h1,
        .jumbotron .h1 {
            color: White
        }

        .jumbotron p {
            margin-bottom: 15px;
            font-size: 21px;
            font-weight: 200;
            color: white;
        }

    .body-content {
        padding: 0;
    }
}

.label-fixed40 {
    width: 40px;
    height: 21px;
}

.label-fixed70 {
    width: 70px;
    height: 21px;
}

.label-fixed50 {
    width: 50px;
    height: 21px;
}

.label-fixed100 {
    width: 100px;
    height: 21px;
}

.label-fixed100c {
    width: 100px;
    height: 21px;
    text-align: center
}

.label-fixed110 {
    width: 110px;
    height: 21px;
}

.label-fixed110c {
    width: 110px;
    height: 21px;
    text-align: center
}

.label-fixed120 {
    width: 120px;
    height: 21px;
}

.label-fixed150 {
    width: 150px;
    height: 21px;
}

.label-fixed180 {
    width: 180px;
    height: 21px;
}

.label-fixed200 {
    width: 200px;
    height: 21px;
}

.label-danger-fixed150 {
    width: 150px;
    height: 21px;
    color: red
}

.label-danger-fixed200 {
    width: 200px;
    height: 21px;
    color: red
}

.label-fixed300 {
    width: 300px;
    height: 21px;
}

.label-fixed400 {
    width: 400px;
    height: 21px;
}

.label-plain {
    font-weight: 100
}

.infoblue {
    color: Blue;
    border-color: White;
    border-style: none;
    background-color: white;
    margin-bottom: 0px;
    text-align: center;
}

.infoblueleft {
    color: Blue;
    border-color: White;
    border-style: none;
    background-color: white;
    margin-bottom: 0px;
    text-align: left;
}

.infobluecenter {
    color: Blue;
    border-color: White;
    border-style: none;
    background-color: white;
    margin-bottom: 0px;
    text-align: center;
}


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

.text-left-small {
    text-align: left;
    font-size: x-small;
}

.text-right-small {
    text-align: right;
    font-size: x-small;
}

.text-center-small {
    text-align: center;
    font-size: x-small;
}

.text-danger-large {
    text-align: left;
    font-size: x-large;
    color: #a94442;
}

.text-blue-large {
    text-align: left;
    font-size: x-large;
    color: #1105f2;
}

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

.GridView1 {
    -moz-border-radius: 25px;
    border-radius: 25px;
}

th.rotate {
    height: 140px;
    white-space: nowrap;
}

    th.rotate > div {
        transform: translate(25px, 51px) rotate(315deg);
        width: 30px
    }

        th.rotate > div > span {
            border-bottom: 1px solid #ccc;
            padding: 5px 10px;
        }

.cssPager td {
    padding-left: 4px;
    padding-right: 4px;
}

.panel-custom-red {
    border-color: #ff0000;
}

    .panel-custom-red > .panel-heading {
        background: #ff0000;
        color: #ffffff;
        border-color: #ff0000;
    }


.panel-custom-green {
    border-color: #0F400e;
}

    .panel-custom-green > .panel-heading {
        background: #0F400e;
        color: #ffffff;
        border-color: #0F400e;
    }

.panel-custom-magenta {
    border-color: #A41c80;
}

    .panel-custom-magenta > .panel-heading {
        background: #A41c80;
        color: #ffffff;
        border-color: #A41c80;
    }

.panel-custom-teal {
    border-color: #7662a1;
}

    .panel-custom-teal > .panel-heading {
        background: #7662a1;
        color: #ffffff;
        border-color: #7662a1;
    }

.panel-custom-gray {
    border-color: #7a797a;
}

    .panel-custom-gray > .panel-heading {
        background: #7a797a;
        color: #ffffff;
        border-color: #7a797a;
    }

.panel-custom-ltblue {
    border-color: #07cff2;
}

    .panel-custom-ltblue > .panel-heading {
        background: #07cff2;
        color: #000000;
        border-color: #07cff2;
    }

.panel-custom-dkblue {
    border-color: #00ae7c;
}

    .panel-custom-dkblue > .panel-heading {
        background: #00ae7c;
        color: #ffffff;
        border-color: #00ae7c;
    }

.panel-custom-sales {
    border-color: #00ae7c;
}

    .panel-custom-sales > .panel-heading {
        background: #00ae7c;
        color: #ffffff;
        border-color: #00ae7c;
    }

.panel-custom-orders {
    border-color: #7be3c5;
}

    .panel-custom-orders > .panel-heading {
        background: #7be3c5;
        color: #000000;
        border-color: #7be3c5;
    }

.panel-custom-allowance {
    border-color: #7bbbe3;
}

.panel-custom-allowance > .panel-heading {
    background: #7bbbe3;
    color: #000000;
    border-color: #7bbbe3;
}

.panel-custom-formula {
    border-color: #e3d07b;
}

    .panel-custom-formula > .panel-heading {
        background: #e3d07b;
        color: #000000;
        border-color: #e3d07b;
    }

/* Styles for wrapping the search box */

.main {
    width: 99%;
    margin: 5px auto;
}

/* Bootstrap 3 text input with search icon */

.has-search .form-control-feedback {
    right: initial;
    left: 0;
    color: #ccc;
}

.has-search .form-control {
    padding-right: 12px;
    padding-left: 34px;
}

.divider {
    width: 5px;
    height: auto;
    display: inline-block;
}

.text-justify-xs {
    text-align: justify;
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .text-justify-sm {
        text-align: justify;
    }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .text-justify-md {
        text-align: justify;
    }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .text-justify-lg {
        text-align: justify;
    }
}