/* Minification failed. Returning unminified contents.
(4,24): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(5,18): run-time error CSS1046: Expect comma, found '0'
(5,21): run-time error CSS1046: Expect comma, found ')'
(9,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,28): run-time error CSS1039: Token not allowed after unary operator: '-BtnBackground-color'
(21,47): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(26,17): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(55,43): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(62,34): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(68,34): run-time error CSS1039: Token not allowed after unary operator: '-hover'
(73,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(74,28): run-time error CSS1039: Token not allowed after unary operator: '-BtnBackground-color'
(105,1): run-time error CSS1019: Unexpected token, found '@import'
(105,9): run-time error CSS1019: Unexpected token, found '"DesignColors.css"'
(154,17): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(158,35): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(162,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(166,17): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(167,28): run-time error CSS1039: Token not allowed after unary operator: '-BadgeBackground-Color'
(170,17): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(175,1): run-time error CSS1019: Unexpected token, found '@import'
(175,9): run-time error CSS1019: Unexpected token, found '"DesignColors.css"'
(181,17): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(185,16): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(189,16): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(193,16): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(197,16): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(201,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(205,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(209,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(261,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(270,28): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultCustomer-Color'
(271,17): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultCustomerText-Color'
(275,28): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultEmployee-Color'
(276,17): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultEmployeeText-Color'
(280,28): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultVehicle-Color'
(281,17): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultVehicleText-Color'
(285,28): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultContact-Color'
(286,17): run-time error CSS1039: Token not allowed after unary operator: '-SearchResultContactText-Color'
(360,35): run-time error CSS1039: Token not allowed after unary operator: '-TgsShadow-Color'
(360,72): run-time error CSS1039: Token not allowed after unary operator: '-TgsShadow-Color'
(360,111): run-time error CSS1039: Token not allowed after unary operator: '-TgsShadow-Color'
(364,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(366,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(367,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(368,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(370,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(372,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(373,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(374,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(375,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(376,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(378,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(379,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(380,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(382,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(383,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(384,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(385,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(388,1): run-time error CSS1019: Unexpected token, found '@import'
(388,9): run-time error CSS1019: Unexpected token, found '"DesignColors.css"'
(407,28): run-time error CSS1039: Token not allowed after unary operator: '-Spinner-Color'
(408,31): run-time error CSS1039: Token not allowed after unary operator: '-Spinner-Color'
(427,32): run-time error CSS1039: Token not allowed after unary operator: '-SpinnerBefore-Color'
(428,35): run-time error CSS1039: Token not allowed after unary operator: '-SpinnerBefore-Color'
(445,32): run-time error CSS1039: Token not allowed after unary operator: '-SpinnerAfter-Color'
(446,35): run-time error CSS1039: Token not allowed after unary operator: '-SpinnerAfter-Color'
(456,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes'
(457,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(477,1): run-time error CSS1019: Unexpected token, found '@-moz-keyframes'
(478,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(517,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(518,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(789,1): run-time error CSS1019: Unexpected token, found '@import'
(789,9): run-time error CSS1019: Unexpected token, found '"DesignColors.css"'
(796,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(801,28): run-time error CSS1039: Token not allowed after unary operator: '-customerLogCounter-Color'
(805,22): run-time error CSS1039: Token not allowed after unary operator: '-ContentBackground-Color'
(810,48): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(810,67): run-time error CSS1039: Token not allowed after unary operator: '-SpinnerBefore-Color'
(883,28): run-time error CSS1039: Token not allowed after unary operator: '-Base-Color'
(913,35): run-time error CSS1039: Token not allowed after unary operator: '-Seperator-Color'
(917,28): run-time error CSS1039: Token not allowed after unary operator: '-InputTextAreaSpan-Color'
(921,28): run-time error CSS1039: Token not allowed after unary operator: '-InputTextAreaSpan-Color'
(925,28): run-time error CSS1039: Token not allowed after unary operator: '-InputTextAreaSpan-Color'
(929,28): run-time error CSS1039: Token not allowed after unary operator: '-InputTextAreaSpan-Color'
 */
@import "DesignColors.css"; 

button.btn-tgs:hover, button.btn-tgs:focus, input.btn-tgs:hover, input.btn-tgs:focus, a.btn-tgs:hover, a.btn-tgs:focus, span.btn-tgs:hover, span.btn-tgs:focus {
    border-color: var(--hover);
    color: rgb(0 0 0);
}

.btn-tgs {
    --color: var(--Btn-color);
    --hover: var(--BtnHoover-color);
    width: auto;
    background-color: var(--BtnBackground-color);
    border-radius: 5px;
    padding: 5px;
}

    .btn-tgs:hover,
    .btn-tgs:focus {
        -webkit-animation: pulse 1s;
        animation: pulse 1s;
        box-shadow: 0 0.5em 0.5em -0.1em var(--hover);
        transform: translateY(-0.25em);
    }

a.btn-tgs, button.btn-tgs, input.btn-tgs, span.btn-tgs {
    color: var(--Base-Color);
    border: 2px solid !important;
    font: inherit;
    line-height: 1;
    margin: 0.5em;
    text-decoration: none;
    padding: 0.7em;
    transition: 0.25s;
    cursor: pointer !important;
    display: inline-block;
}

.btn-tgs.disabled,
.btn-tgs[disabled], fieldset[disabled] .btn-tgs  {
    cursor: not-allowed !important;
    filter: alpha(opacity=65);
    opacity: 0.65;
    -webkit-box-shadow: none;
    box-shadow: none;
}
a.btn-tgs.disabled,
fieldset[disabled] a.btn-tgs {
    pointer-events: none !important;
}

    .btn-tgs[disabled]:hover,
    .btn-tgs[disabled]:focus {
        -webkit-animation: none;
        animation: none;
        box-shadow: 0 0em 0em -0.0em var(--hover);
        transform: none;
    }


@-webkit-keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 var(--hover);
    }
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 var(--hover);
    }
}

.btn-tgs-group {
    --color: rgba(7, 73, 163, 0.6);
    background-color: var(--BtnBackground-color);
}
a.btn-tgs-group, button.btn-tgs-group, input.btn-tgs-group, span.btn-tgs-group {
    color: rgb(7, 73, 163);
    /*border: 1px solid !important;*/
}

.btn-tgs-group:hover,
.btn-tgs-group:focus {
    background-color: rgba(0, 0, 0, 0.18) !important;
}

.card .customfooter {
    padding: 0px !important;
}

.customfooter .btn {
    border-radius: 0px !important;
}
.Chart {
    height: 600px;
}

.violationTypeGraphs {
    padding-top: 25px;
    max-height: 802px;
}

.employeePieCharts {
    height: 350px
}
@import "DesignColors.css"; 

th {
     padding-left: 0.75rem !important; 
}


.card-toolbar .btnmenu {
    padding-right: 5px;
}

.btn-group.space
{
    padding-right: 5px;
}

.logBtn
{
    border: thin;
}


/*.table-responsive,
.dataTables_scrollBody {
    overflow: visible !important;
}*/

.table-responsive-disabled .dataTables_scrollBody {
    overflow: hidden !important;
}


.customerlog {
    height: 500px;
    overflow-y: auto;
}

/******Signature*******/

.signaturestatus {
  height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
}



/*General styling*/
.text-active-tgs.active {
    color: var(--Base-Color) !important;
}

.nav-line-tabs .nav-item .nav-link.active, .nav-line-tabs .nav-item .nav-link:hover:not(.disabled), .nav-line-tabs .nav-item.show .nav-link {
    border-bottom: 1px solid var(--Base-Color);
}

.form-check.form-check-solid .form-check-input:checked {
    background-color: var(--Base-Color);
}

.badge-tgs {
    color: Var(--Base-Color);
    background-color: var(--BadgeBackground-Color);
}
.tgs-info-text {
    color: var(--Base-Color);
    font-weight: 600;
}


@import "DesignColors.css"; 


/*Css for _layout*/

.menu-state-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-title, .menu-state-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-title {
    color: var(--Base-Color);
}

.menu-state-icon-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g), .menu-state-icon-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: var(--Base-Color);
}

.menu-state-icon-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g), .menu-state-icon-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: var(--Base-Color);
}

.menu-state-icon-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g), .menu-state-icon-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: var(--Base-Color);
}

.menu-state-primary .menu-item.here > .menu-link .menu-icon .svg-icon svg [fill]:not(.permanent):not(g), .menu-state-primary .menu-item.show > .menu-link .menu-icon .svg-icon svg [fill]:not(.permanent):not(g) {
    fill: var(--Base-Color);
}

.menu-state-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-bullet .bullet, .menu-state-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-bullet .bullet {
    background-color: var(--Base-Color);
}

.menu-state-bullet-primary .menu-item .menu-link:hover:not(.disabled):not(.active) .menu-bullet .bullet, .menu-state-bullet-primary .menu-item.hover > .menu-link:not(.disabled):not(.active) .menu-bullet .bullet {
    background-color: var(--Base-Color);
}

btn-active-color-danger:hover {
    background-color: var(--Base-Color);
}

.menu-arrow {
    filter: invert(18%) sepia(33%) saturate(6044%) hue-rotate(207deg) brightness(96%) contrast(95%);
}

.submit-hide {
    display: none;
}

.svg-hover:hover {
    filter: invert(18%) sepia(33%) saturate(6044%) hue-rotate(207deg) brightness(96%) contrast(95%);
}

.svg-hover {
    cursor: pointer;
}

.svg-label {
    display: block;
}

.form-textarea {
    margin-top: 0px;
    margin-bottom: 0px;
    height: 130px;
}

.flex-end {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.mr-5 {
    margin-right: 5px;
}

.p-125 {
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important;
}
table.dataTable > thead .sorting:after, table.dataTable > thead .sorting_asc:after {
    opacity: 1 !important;
}

.table td:first-child, .table tr:first-child {
    padding: 0.75rem 0.75rem;
}

.scrolltop {
    background-color: var(--Base-Color);
}

/*Css for searchresult*/
.lineThrough {
    text-decoration: line-through;
}

.searchResultCustomer td {
    background-color: var(--SearchResultCustomer-Color);
    color: var(--SearchResultCustomerText-Color);
}

.searchResultEmployee td {
    background-color: var(--SearchResultEmployee-Color);
    color: var(--SearchResultEmployeeText-Color);
}

.searchResultVehicle td {
    background-color: var(--SearchResultVehicle-Color);
    color: var(--SearchResultVehicleText-Color);
}

.searchResultContact td {
    background-color: var(--SearchResultContact-Color);
    color: var(--SearchResultContactText-Color);
}

#searchresult tr {
    border-top: 1px solid white;
    border-bottom: 1px solid white;
}

/*css for tilmeld kunde*/
.adds{
    min-width: 180px;
}

/*css for translate*/
.pl-0{
    padding-left: 0;
}

.p-tr {
    padding: 9.75px !important;
}

.tr-bold {
    font-weight: bold !important;
}
.has-success {
    border: 2px solid #3c763d;
}

.has-warning {
    border: 2px solid #8a6d3b;
}

.has-error {
    border: 2px solid #a94442;
}

.table-border-grey {
    border: 2px solid #E8E8E8;
}

/*css for edit customer*/
.not-allowed {
    cursor: not-allowed;
    background-color: rgb(217, 217, 217) !important;
}

/*User Customer Index*/
.gauge svg {
    max-height: 250px;
}

.p-075 {
    padding: 0.75rem;
}

.scroll-settings::-webkit-scrollbar-thumb:vertical, .scroll-settings::-webkit-scrollbar-thumb:vertical:hover {
    background-color: rgb(217, 217, 217);
}
.mr-3 {
    margin-right: 3px;
}



/*.card  {
    border: 1px solid;
    box-shadow: 2px 2px;
    color: black;
}*/


.tgs-shadow {
    border-radius: 20px;
    box-shadow: 5px 5px 20px var(--TgsShadow-Color), 0px 5px 20px var(--TgsShadow-Color), -20px 5px 20px var(--TgsShadow-Color);
}
:root {
    /* Base */
    --Base-Color: rgb(7, 73, 163);
    /* Buttons */
    --BtnBackground-color: rgba(7, 73, 163, 0.1);
    --BtnHoover-color: rgba(7, 73, 163, 0.6);
    --Btn-color: rgba(7, 73, 163, 0.6);
    /* Customer */
    --BadgeBackground-Color: #fff5f8;
    /* Customer-Style */
    --SearchResultCustomer-Color: rgb(159, 204, 250, 0.2);
    --SearchResultEmployee-Color: rgb(109, 175, 247, 0.3);
    --SearchResultVehicle-Color: rgb(59, 145, 244, 0.4);
    --SearchResultContact-Color: rgb(9, 116, 241, 0.5);
    --TgsShadow-Color: rgba(7, 73, 163, 0.1);
    /* Loaders */
    --Spinner-Color: #858686;
    --SpinnerBefore-Color: #F42228;
    --SpinnerAfter-Color: rgba(7, 73, 163, 0.6);
    /* Main */
    --ContentBackground-Color: #E8E8E8;
    --Seperator-Color: rgba(7, 73, 163, 0.4);
    --InputTextAreaSpan-Color: rgb(242,242,242);
    --customerLogCounter-Color: rgba(7, 73, 163, 0.3);
}

@import "DesignColors.css"; 

.loader-wrapper {
    display: inherit;
    position: inherit;
    /*width: 100%;*/
    height: 100%;
    z-index: 1;
    padding-left: 40%;
    padding-bottom: 50px;
}

.loader-spinner #loader {
    position: inherit;
    left: 50%;
    top: 50%;
    height: 20vw;
    width: 20vw;
    border: 3px solid transparent;
    border-top-color: var(--Spinner-Color);
    border-bottom-color: var(--Spinner-Color);
    border-radius: 50%;
    z-index: 2;
    -webkit-animation: spin 2s linear infinite;
    -moz-animation: spin 2s linear infinite;
    -o-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}


    .loader-spinner #loader:before {
        content: "";
        position: absolute;
        top: 2%;
        bottom: 2%;
        left: 2%;
        right: 2%;
        border: 3px solid transparent;
        z-index: 2;
        border-top-color: var(--SpinnerBefore-Color);
        border-bottom-color: var(--SpinnerBefore-Color);
        border-radius: 50%;
        -webkit-animation: spin 3s linear infinite;
        -moz-animation: spin 3s linear infinite;
        -o-animation: spin 3s linear infinite;
        animation: spin 3s linear infinite;
    }

    .loader-spinner #loader:after {
        content: "";
        position: absolute;
        top: 15%;
        bottom: 15%;
        left: 15%;
        right: 15%;
        border: 3px solid transparent;
        z-index: 2;
        border-top-color: var(--SpinnerAfter-Color);
        border-bottom-color: var(--SpinnerAfter-Color);
        border-radius: 50%;
        -webkit-animation: spin 2,5s linear infinite;
        -moz-animation: spin 2,5s linear infinite;
        -o-animation: spin 2,5s linear infinite;
        animation: spin 2,5s linear infinite;
    }

/*Keyframes for spin animation */

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg); /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    50% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(180deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}


@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg); /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    50% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(180deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}

@-o-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg); /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    50% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(180deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg); /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    50% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(180deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg); /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}


/*

@import url('https://fonts.googleapis.com/css?family=Muli');

*, *:before, *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.Loadercontainer {
    display: inherit;
    position: inherit;
    width: 17rem;
    height: 10rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.loaderText {
    color: #000;
    font-size: 6rem;
    font-weight: 900;
    display: inline-block;
    position: absolute;
    bottom: 0;
    animation: loaderText 1050ms ease-in infinite;
    transform: translate(0);
}

.loaderText-t {
    left: 0rem;
    transform: translate3d(0, -4rem, 0);
    animation: loaderText-t 1050ms ease-in infinite;
}

.loaderText-a {
    left: 5.4rem;
    animation-delay: 150ms;
}

.loaderText-c {
    left: 9.6rem;
    animation-delay: 230ms;
}

.loaderText-h {
    left: 13rem;
    animation-delay: 310ms;
}
.loaderText-o {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-g {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-r {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-aa {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-f {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-s {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-e {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-r {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-v {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-i {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-i {
    left: 17.2rem;
    animation-delay: 390ms;
}
.loaderText-i {
    left: 17.2rem;
    animation-delay: 390ms;
}
.coast {
    position: absolute;
    left: 1.3rem;
    bottom: 1.7rem;
    width: 6.2rem;
    height: 2.2rem;
    display: inline-block;
    animation: coast 2100ms linear infinite;
    transform: translateZ(0);
}

.wave-rel-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    perspective: 3rem;
    perspective-origin: 0%, 50%;
}

.wave {
    position: absolute;
    width: 6.2rem;
    height: 2.2rem;
    border-radius: 1.1rem;
    background: radial-gradient(ellipse at center, rgba(116, 241, 252, 1) 0%, rgba(50, 230, 255, 1) 73%, rgba(21, 199, 250, 1) 100%);
    display: inline-block;
    animation: wave 2100ms linear infinite;
    will-change: width;
    transform: translateZ(0) scale(0);
}

.delay {
    animation-delay: 1050ms;
}

@keyframes loaderText {
    0% {
        transform: translate3d(0, 0, 0);
    }

    30% {
        transform: translate3d(0, 0, 0);
    }

    45% {
        transform: translate3d(0, -4rem, 0);
    }

    100% {
        transform: translate3d(0, 0, 0);
    }
}

@keyframes loaderText-t {
    0% {
        transform: translate3d(0, -4rem, 0);
    }

    38% {
        transform: translate3d(0, -4rem, 0);
    }

    69% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(0, -4rem, 0);
    }
}

@keyframes coast {
    0% {
        transform: translate3d(0, 0, 0);
    }

    23% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(16rem, 0, 0);
    }

    100% {
        transform: translate3d(16rem, 0, 0);
    }
}

@keyframes wave {
    0% {
        transform: scale(0);
        width: 2.2rem;
    }

    10% {
        transform: scale(1);
    }

    23% {
        width: 2.2rem;
    }

    32% {
        width: 6.1rem;
    }

    42% {
        width: 5rem;
        transform: rotateY(0deg) scale(1, 1);
    }

    51% {
        transform: rotateY(90deg) scale(0.6, 0.2);
    }

    52% {
        transform: rotateY(90deg) scale(0);
    }

    100% {
        transform: rotateY(90deg) scale(0);
    }
}
 */
.bg-login {
    background-image: linear-gradient(rgba(255,255,255,0.75), rgba(255,255,255,0.75)), url(../img/Login_truck1.jpg);
    background-size: cover;
}

.bg-loginbox {
    background-color: white;
    border-radius: 25px;
    padding: 20px;
}

.login-logo {
    height: 120px;
}

@media only screen and (max-width: 1000px) {
    .bg-loginbox {
        background-color: darkgoldenrod;
        background-color: transparent;
        border-radius: 0px;
        padding: 0px;
    }

    .login-logo {
        height: 70px;
    }
}
@import "DesignColors.css"; 

body {
    font-family: Arial;
}

.customerLogCounter {
    background-color: var(--Base-Color);
}

.customerLogCounter-light {
    color: white !important;
    background-color: var(--customerLogCounter-Color) !important;
}

.content {
    background: var(--ContentBackground-Color);
}


.backgroundImage {
    background: linear-gradient(0.25turn, var(--Base-Color), var(--SpinnerBefore-Color));
}


@media only screen and (min-width : 1200px) {

    .container-xxl {
        max-width: none;
    }
}

/*Datatable styling */
.dtrg-group td{
    font-weight: bold !important;
    font-style: italic !important;
    font-size: 14px !important;
    pointer-events: none;
    background-color: rgba(180, 180, 180, 0.4) !important;
    box-shadow: none !important;
}

.progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%);
    transition: width 0.6s ease;
}

.progress {
    display: -ms-flexbox;
    display: flex;
    height: 1.5rem;
    overflow: hidden;
    font-size: 1rem;
    background-color: #e9ecef;
    border-radius: 0.25rem;
}

.container {
    width: 100%;
    padding-top: 50px;
    padding-right: 20px;
    padding-left: 20px;
    margin-right: auto;
    margin-left: auto;
}

.pulse-ring {
    position: fixed !important;
}

td p {
    max-width: 150px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 3px 5px;
}

/* Datatables */
.dataTables_info {
    padding-top: 0.55em !important;
}

.page-item.active .page-link {
    color: white !important;
    background-color: var(--Base-Color) !important;
}

.sidebar {
    display: table;
    /*width: max-content;*/
    position: relative;
}

.innerstar {
    position: absolute;
    bottom: 0;
}

.managementlogo {
    max-width: 220px;
}

.logo-minimize-style {
    height: 45px;
}

@media (max-width: 992px) {
    .innerstar {
        position: fixed;
        bottom: 0;
    }
}

.separator {
    border-bottom: 2px solid var(--Seperator-Color) !important;
}

input[type="text"], input[type="password"], input[type="datetime"], input[type="email"], input[type="number"], input[type="tel"] {
    background-color: var(--InputTextAreaSpan-Color) !important;
}

input[type="checkbox"]:not(:checked) {
    background-color: var(--InputTextAreaSpan-Color) !important;
}

textarea {
    background-color: var(--InputTextAreaSpan-Color) !important;
}

span.select2-selection, span.select2-dropdown {
    background-color: var(--InputTextAreaSpan-Color) !important;
}

.floatCheckboxes {
    float: right;
}

.canvasStyler {
    margin: auto;
    width: 50%;
}

.InlineText {
    display: inline-block;
    width: 200px;
}