body {
    height: auto;
    min-width: 1900px;
    background: #f7f7f7;
    color: #474d51;
    display: inline-block;
    margin: 0px auto;
}

.ui.white {
    background: #fff
}

.ui.menu.fixed {
    min-width: 1900px;
}

h2.ui.dividing.header {
    margin: 0;
    padding: 15px;
    font-size: 1.5rem;
    font-weight: 100;
    cursor: default;
}

h2.ui.header:hover, h3.ui.header:hover {
    border-bottom: 1px solid #479761;
}

h3.ui.dividing.header {
    margin: 0;
    padding: 10px;
    font-size: 1.25rem;
    font-weight: 100;
    cursor: default;
}

.ui.menu .item
{
    padding: 1.5em 1.2em;
}

#topfilter {
top:69px;
border-top: none;
z-index: 1;
}

#topfilter .ui.header, .ui.header:first-child {
    margin: 1em;
}

#topfilter .ui.filterElement {
    height: 26px;
    margin-top: 6px;
}

#topfilter .ui.dropdown .scrolling.menu>.item.item.item, #topfilter hr
{
    border-left: none;
}

#topfilter .ui.toggle.checkbox
{
    margin-top: 8px;
}

#topfilter hr {
    margin: 0 0.5em;
    height: 39px;
    border-right: 1px solid #ddd;
}

#topfilter #search{
    width: 205px;
    margin: 0 0 0 10px;
    height: 25px;
}

.dayInfo {
    float: left;
    padding: 0 15px;
    font-size: 12px;
    text-align: center;
}

.dayInfo h5 {
    margin: 0;
}

.dayInfo p {
    margin: 5px 0 15px;
}

#workingTimes th
{
    text-align: center;
}

#workingTimes input[type=date]
{
    width:95px
}

#workingTimes input[type=time]
{
    width:85px
}

#workingTimes .wtTele
{
    background: #f3f3f3;
}

#workingTimes .wtMan
{
    background: #ededed;
}

#workingTimes tr:first-child .wtCard
{
    border-bottom: 3px solid #2382cf;
}

#workingTimes input.wtCard
{
    border: 1px solid #2382cf;
    background: #fff;
}

#workingTimes tr:first-child .wtTele
{
    border-bottom: 3px solid #fae73d;
}

#workingTimes input.wtTele
{
    border: 1px solid #fae73d;
    background: #fff;
}

#workingTimes tr:first-child .wtMan
{
    border-bottom: 3px solid #e31e3a;
}

#workingTimes input.wtMan
{
    border: 1px solid #e31e3a;
    background: #fff;
}

.ui.compact.table th {
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.ui.content {
    margin: 45px 0 0 !important;
    background: #fff;
}

.ui.content.topMargin {
    margin: 110px 0 0 !important;
}

.ui.grid {
    margin: 0;
}

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

.ui.button, .ui.table, .ui.label, .ui.accordion, .ui.form input, .ui.form textarea, .ui.input>input,
.ui.dropdown, .ui.tabular.menu .active.item, .ui.fluid.card, .ui.segment, .ui.message, .ui.cards>.card,
.ui.table thead tr:first-child>th:first-child, .ui.table thead tr:first-child>th:last-child {
    border-radius: 0px !important;
}

.ui.basic.button, .ui.basic.buttons .button {
    -webkit-box-shadow: 0 0 0 1px #6fb985 inset!important;
    box-shadow: 0 0 0 1px #6fb985 inset!important;
    color: #6fb985!important;
}

.ui.basic.button:hover, .ui.basic.buttons .button:hover {
    -webkit-box-shadow: 0 0 0 1px #479761 inset!important;
    box-shadow: 0 0 0 1px #479761 inset!important;
    color: #479761!important;
}

thead input {
    width: 100%;
    margin-top: 5px;
    padding: 5px;
    box-sizing: border-box;
    border: 1px solid rgba(34,36,38,.15);
    border-radius: .28571429rem;
}

#rangestart input, #rangeend input {
    width: 145px;
    height: 26px;
    color:hwb(0 0% 100% / 0.6);
}

.dataTables_paginate {
    float: right;
}

#expensesViewer .small.button {
    padding: .55em 1.0em .45em;
}

.ui.table .date
{
    font-size: 1.1em;
}

.ui.labeled.icon.button.filter {
    background-color: #fff;
    box-sizing: border-box;
    padding-top: 0.35em;
    padding-bottom: 0.35em;
    border: 1px solid #22242626;
    border-radius: .28571429rem;
    font-weight: 400;
}

.ui.grid>.row>.sixteen.column {
    padding: 0;
}

#dashboard div.row:not(div.dt-table) {
    padding: 0;
    height: 0;
}

.dataTables_length div.dropdown {
    width: 55px;
}

table.dataTable.table thead th.sorting:after, table.dataTable.table thead td.sorting:after {
    color: #aaa;
}

#driversList {
    padding: 1px 10px;
    margin: 0 0 0 5px;
    max-height:80%;
    overflow-y: scroll;
}

/* dcard */
.driverCard{
    border: 1px solid #d7d7d7;
    margin: 0.5em 0;
    padding: 0.25em;
    cursor: pointer;
    display: flow-root;
}

 .ui.form {
    font-size: 0.85em;
}

.driverCard .name
{
    font-size: 1rem;
    padding: 3px 0;
}

.driverCard .name span
{
    font-weight: 800;
}

.driverCard .meta i.icon, i.icons {
 margin-left: 1em;
}

.driverCard .download
{
    text-align: right;
}

.driverCard .download span
{
    padding: 3px 6px 3px 0px;
    background: #d7d7d7;
}

.driverCard.active{
    border: 1px solid #6fb985;
    background: #ebffec;
}

/* dcard end */

p span#newElement, p span#allDrivers{
    margin-right: 5px;
    font-size: 18px;
}

p span#newElement:hover, p span#allDrivers:hover {
    display: inline-block;
    transform: scale(1.1);
}

#attestationForm .ui.dropdown{
    width:100%
}

/* HOME */
#dashboard {
    padding-top: 20px;
    background: #f7f7f7;
}

#dashboard .ui.grid>.column {
    padding: 0;
}

#dashboard .bcal {
    width: 14%;
    margin: 2% 0 0 2%;
    display: inline-block;
}

.bcal .ui.header, .bcal .ui.header:first-child {
    padding: calc(1rem - 0.14285714em) 0 1rem;
    margin: 0;
}

#dashboard .ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
    background: #eee;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
}

.ui.card>.content a:not(.ui)
{
    display: block;
    width: 100%;
    padding: 15px 0;
    text-align: center;
    font-size: 1em;
}

.ui.card>.content, .ui.cards>.card>.content {
    padding: 0;
}

.ui .grid .bigBlock, .ui .grid .doubleBlock {
    height: 100%;
}

.ui .grid .bigBlock
{
    margin: 0 10px;
    background-color: #fff;
}

#dashboard div.mediumBlock{
    margin: 0 10px;
    height: 100%;
    width: calc(50% - 20px) !important;
    background-color: #fff;
}


#dashboard .mediumBlock .ui.button {
    padding-top: 26px;
}

.smallBlock {
    display: inline-block;
    margin: 0 10px;
    width: calc(100% - 20px) !important;
    background-color: #fff;
}

.up
{
    margin-bottom: 10px;
}

.down
{
    margin-top: 10px;
}

.smallBlock a {
    display: block;
    text-align:center;
    font-size: 70px;
    line-height: 70px;
    color:black
}

.donutChart {
    height: 200px;
}

#dashboard .ui.grid>.column .chartLegend {
    padding: 0.5rem 1.8rem 0.5rem 1.8rem
}

#dashboard p
{
    margin: 0.8rem 0;
}

h2 span.newElement, p span#newElement{
    float: right;
    color: #ee741d;
    cursor: default;
}

.redIcon i {
    color: #e31e3a;
}


.yellowIcon i {
    color: #fae73d;
}

.greenIcon i, h2 span.greenIcon, p span.greenIcon{
    color: #32b167 !important;
}

.blueIcon i {
    color: #2382cf;
}

.orange i {
    color: #ee741d;
}

.ui.header .icon:only-child {
    margin-right: 5px;
}

#dashboard .ui.button {
    margin: 0;
    padding-top:0;
    width: 100%;
    background: #fff;
    color: #474d51;
    font-size: 16px;
    font-weight: 600;
    text-align: right;
}

#driverActivities {
    margin-top: 60px;
}

#driverActivities .ui.button {
    margin: 0;
    background: #fff;
    color: #474d51;
    font-size: 13px;
    font-weight: 400;
    text-align: left;
}

#driverActivities .dropdown.icon {
    width: 15px;
    height: 15px;
    padding: 1px;
}

#driverActivities .ui.accordion .content
{
    margin: 0px 113px;
    padding: 0 5px;
    width: 1245px;
}

#dashboard div.dataTables_wrapper {
    margin-top: 10px;
}


/* HOME END */


/* ADMIN */
#adminArea, #adminArea .ui.segment, #licenceControl, #driversPage
{
    background: #f7f7f7;
}

#adminArea .ui.grid>.column, #adminArea .ui.grid>.column:not(.row),
#licenceControl .ui.grid>.column, #licenceControl .ui.grid>.column:not(.row) {
    padding: 10px 20px;
    background: #fff;
}

/* END ADMIN */

@media only screen and (min-width: 1200px) {
    .ui.content {
        width: 100%;
        min-height: 775px;
    }
}

@media only screen and (max-width: 1410px) {
    body {
        overflow-x: auto;
    }
}

@media only screen and (min-width: 1920px) {
    .ui.modal {
        width: 1150px;
    }
}

.wrapped{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

 .ui.column.grid>[class*="one wide"].column,
 .ui.grid>.column.row>[class*="one wide"].column, 
 .ui.grid>.row>[class*="one wide"].column,
 .ui.grid>[class*="one wide"].column {
    width: 10%!important;
}

#filter {
    max-width: 1400px;
}

#reports {
    margin: 1px 0.7rem;
}

label.required:before {
    content: "* ";
}

.ui.pointing.menu .active.item:after {
    visibility: hidden;
}

.ui.segment {
    box-shadow: 0 1px 2px 0 #6fb985;
    border: 1px solid #6fb985;
}

.ui.segment.noborder {
    margin: 0;
    padding: 20px 0;
    border: none;
    box-shadow: 0 2px 2px -1px #6fb985;
}

h1{
    text-align: center;
}

.red{
    color: red;
}

.redF{
    width: 100%;
    color: red;
    font-size: 1.15em;
}

.ui.table td.positive, .ui.table tr.positive {
    background: #f3ffd7!important;
}

.ui.selectable.table tr.positive:hover,
.ui.table tr td.selectable.positive:hover,
.ui.selectable.table tr:hover td.positive {
  background: #e7f9bd !important;
}

.ui.selectable.table, #driversMenu span, p span#newElement {
    cursor: pointer;
}

.ui.selectable.table, .ui.tiny.header {
    cursor: default;
}

.ui.form input:not([type]), .ui.form input[type=text], .ui.form input[type=email], .ui.form input[type=search], .ui.form input[type=password],
.ui.form input[type=date], .ui.form input[type=datetime-local], .ui.form input[type=tel],
.ui.form input[type=time], .ui.form input[type=file], .ui.form input[type=url], .ui.form input[type=number], .ui.selection.dropdown
{
    padding: 0.35em 0.5em;
}

#expenses .ui.input input  {
    padding: .27857143em 0.21em;
}

#expenses .selection.dropdown  {
    min-width: 125px;;
}

select.ui.dropdown {
    height: auto;
    padding: 0.27em 0.5em;
}
.ui.selection.dropdown
{
    min-height: 2.1em;
}
.ui.selection.dropdown>.delete.icon, .ui.selection.dropdown>.dropdown.icon, .ui.selection.dropdown>.search.icon{
    padding: 0.5em;
}

.ui.dividing.header {
    border-bottom: 1px solid #6fb985;
}

.ui.header.notfirst {
    margin: calc(1rem - .14285714em) 0 1rem;
}

.ui.header, .ui.header:first-child {
    margin: calc(1rem - .14285714em) 0 1rem;
}

.rightborder {
    border-right: solid 1px #6fb985;
}

.ui.form .field :disabled {
    border: none;
    opacity: 0.8;
}

.ui.menu .active.item, .ui.menu .selected.item {
    background-color: #6fb985;
    color: #fff;
    border-bottom: 3px solid #6fb985;
}

.ui.tabular.menu .active.item, .ui.tabular.menu {
    margin: 0;
    padding-top: 1rem;
    padding-left: 0.7rem;
    border-color: #6fb985;
}

.ui.tabular.menu {
    margin-bottom: 0.7rem;
}

.ui.vertical.tabular.menu .active.item{
    border-color: #6fb985;
    border-radius: 0px !important;
    color: #fff;
    background: #6fb985;
}

.ui.vertical.tabular.menu .item 
{
    background: #f7f7f7;
    margin: 5px 0;
    padding: 0.5em;
    font-size: 0.855em;
}

.ui.vertical.tabular.menu {
    border-right: none;
}

.ui.calendar .ui.input input {
    padding-top: 0.25em;
    padding-bottom: 0.35em;
}

.lightgrey {
    background-color: #fdfdfd;
}

footer {
    padding-top: 3px;
    background: #474747;
}

footer .segment {
    height: 3.5rem;
    padding-top: 1em;
    background-color: #fff;
}

footer a {
    margin: 0 2em;
}

footer a:hover {
    color: #6fb985;
}

.ui.sticky.menu {
    border-top: 3px solid #6fb985;
}

.ui.table {
    border-top: 0.2em solid #6fb985;
}

.ui.menu:not(.vertical) a.hidden, .ui.inline.loader.active.hidden, .ui.grid>.column.hidden, #filter.hidden, #topfilter div.hidden, #driversList form.hidden, #driversList form.searchHidden{
    display: none;
}

.ui.compact.table td {
    padding: .2em .5em;
}

.ui.table,
.ui.form input:not([type]),
.ui.form input[type=text],
.ui.form input[type=email],
.ui.form input[type=search],
.ui.form input[type=password],
.ui.form input[type=date],
.ui.form input[type=datetime-local],
.ui.form input[type=tel],
.ui.form input[type=time],
.ui.form input[type=file],
.ui.form input[type=url],
.ui.form input[type=number] {
    font-size: 10px;
}

.edited td:not(:first-child){
    color: #bbb;
}

/* data tables start */
.tableinfo {
    height: 1.8em;
    margin: 1em 0; 
}

.tableinfo_footer {
    height: 3.6em;
}

.tableinfo .dataTables_filter , 
.tableinfo .dataTables_info {
    float:left;
}

.tableinfo .dataTables_length, 
.tableinfo .dataTables_paginate {
    float:right;
}

.tableinfo .ui.dropdown .text,
.tableinfo .ui.form input[type=search] {
    margin-right: 1em;
    font-size: 1em;
}

.tableinfo label {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.88em;
}

div.dataTables_wrapper div.dataTables_length .ui.selection.dropdown {
    min-width: 3.5em;
}

.tableinfo .ui.selection.dropdown .menu>.item {
    font-size: 0.85em;
}

div.dataTables_wrapper div.dataTables_length .ui.selection.dropdown {
    min-width: 3.5em;
}

.tableinfo .ui.input, div.dataTables_wrapper div.dataTables_length .ui.selection.dropdown {
    margin: 0 1em;
}
/* data tables end */

#fileUpload, #fileUpload #file  {
    padding-bottom: 10px;
    width: 50%;
}

#vacationFormManual div.dropdown,
#reassignVehicle .ui.selection.dropdown,
#reassignDriver .ui.selection.dropdown {
    width: 100%;
}

.ui.table td.active, .ui.table tr.active{
    background: #fff !important; 
}

.ui #selectVehicle div.dropdown {
    width: 100%;
}

.ui.table td.odoTable {
    padding:10px;
    text-align: center;
    font-size: 9pt;
}

.bold
{
    font-weight: bold;
}

.ui.floating.label {
    top: 0;
    right: 15%;
    z-index: 0;
}

.hide {
    display: none !important;
}

.ui.menu #company {
    margin:auto;
    color: #888;
}
.ui.menu #company:before {
    background: none;
}

.ui.toggle.checkbox .box:before, .ui.toggle.checkbox label:before {
    background-color: #ccc;
}

#expensesViewer p span,
#docketComplete p span,
#docket p span,
#violationsList p span,
#fileHistory p span {
    display: inline-block;
    width: 20px;
}

.ui.table thead th {
    background: #eee;
}

tr.cweek {
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    background: #f9f9f9;
}

tr.total, td.total {
    text-transform: uppercase;
    font-weight: 700;
    background: #f9f9f9;
}

#filter .dropdown {
    width: 100%;
}

.ui.attached.tabular.menu {
    padding-left: 2px;
}

.ui.attached:not(.message)+.ui.attached.segment:not(.top) {
    border: none;
}

.ui.form textarea {
    
    padding:0;
}

#expensesViewer .ui.grid>.column:not(.row) {
    padding-top:0;
    padding-bottom:0;
}

div.inputDatetime {
    display: flex;
    width: 100%;
    font-size: 1.2em;
}

.ui.form input[type=date]{
    margin: 0 0.1em;
}

.fluid.accordion, .ui.fluid.accordion .accordion {
    margin-bottom: 1em;
}

#timeManageForm input[type=number] {
    width: 5em;
    text-align: right;
}

.dot {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    display: block;
}

.red {
    background-color: #e31e3a;
}

.green {
    background-color: #32b167;
}

.yellow {
    background-color: #fae73d;
}

.grey {
    background-color: rgb(244, 244, 244);
}

/* SVG start */
svg:not(:root) {
    margin-top: 3px;
}

svg {
    display: block;
}
path, line {
    fill: none;
    stroke: black;
    stroke-dasharray: none;}

.axes, .xM {
    stroke-width: 2;
    stroke: black;}
.date {
    padding: 0.5em 0;
    font-family: Lato,'Helvetica Neue',Arial,Helvetica,sans-serif;
    font-size: 14px;
    color: #474d51;}
.xN {
    stroke-width: 0;
    stroke: black;
    font-size: 1.2em;
    font-family: Arial;
    text-anchor: middle;}
.a0 {
    fill: #68af68;
    stroke-width: 0;
    height: 10px}
.a1 {
    fill: #a54343;
    stroke-width: 0;
    height: 20px;}
.a2 {
    fill: #f7f771;
    stroke-width: 0;
    height: 40px ;}
.a3 {
    fill: #5252e7;
    stroke-width: 0;
    height: 60px;}
.a4 {
    fill: #f3b075;
    stroke-width: 0;
    height: 10px;}
.bni { 
    fill: #d36dff;
    stroke-width: 0;}
.blockIntercalendary {
    fill: #ff6ac8;
    stroke-width: 0;}
.rest {
    fill: #86eb86;
    stroke-width: 0;}
.attest {
    fill: #8544a6;
    stroke-width: 0;
}
#legend {
    position: fixed;
    background: #fff;
    top: 115px;
    width: 1380px;
    padding-left: 100px;
    box-shadow: 0 1px 2px 0 rgb(34 36 38 / 15%);
    border-bottom: 1px solid rgba(34,36,38,.15);
}
#legend .a0 {
    border-bottom: 3px solid #68af68;}
#legend .a1 {
    border-bottom: 3px solid #a54343;;}
#legend .a2 {
    border-bottom: 3px solid #f7f771;}
#legend .a3 {
    border-bottom: 3px solid #5252e7;}
#legend .a4 {
    border-bottom: 3px solid #f3b075;}
#legend .bni {
    border-bottom: 3px solid #d36dff;}
#legend .blockIntercalendary {
    border-bottom: 3px solid #ff6ac8;}
#legend .rest {
    border-bottom: 3px solid #86eb86;}
#legend .attest {
    border-bottom: 3px solid #8544a6;}

#legend .a0, #legend .a1, #legend .a2, #legend .a3, #legend .a4,
#legend .bni, #legend .blockIntercalendary, #legend .rest, #legend .attest
{
    margin: 14px 10px;
    padding: 0;
    height: 20px;
}

#legend button{
    margin: 10px;
    height: 30px;
}
.red {
    fill: red;
    stroke-width: 0;}
.vRed {
    fill: #db0808;
    stroke-width: 0;
    font-size:1.2em;}
.wvRed {
    fill: #e21212;
    stroke-width: 0;}
.dvRed {
    fill: #ff5e5e;
    stroke-width: 0;}
.avOr {
    fill: #ffb24a;
    stroke-width: 0;
}
.restLine {
    stroke: rgb(255,0,0);
    stroke-width: 1;
}
.team {
    fill: silver;
    stroke-width: 0;
    height: 10px;}
.kw {
    fill: whitesmoke;
}
.kwText {
    font-size: 2em;
}

/*    SVG end    */
text {
    color: black;
    font-size: 10px;
    font-family: Arial;
    stroke: black;
    stroke-width: 0;
    background-color: white;}

rect,text {stroke-width: 0;}
.d1{fill:YellowGreen;}
.d2{fill:Orange;}
.d3{fill:Teal;}
.d4{fill:Sienna;}
.d5{fill:Aquamarine;}
.d6{fill:Olive;}
.d7{fill:Tan;}
.d8{fill:Orchid;}
.d9{fill:PaleGoldenrod;}
.d10{fill:SteelBlue;}
.d11{fill:Wheat;}
.d12{fill:Turquoise;}
.d13{fill:Pink;}
.d14{fill:SkyBlue;}
.d15{fill:SlateBlue;}
.d16{fill:SlateGray;}
.d17{fill:SandyBrown;}
.d18{fill:SpringGreen;}
.d19{fill:RosyBrown;}
.d20{fill:RoyalBlue;}
.d21{fill:Purple;}
.d22{fill:Plum;}
.d23{fill:Peru;}
.d24{fill:PaleVioletRed;}
.d25{fill:Thistle;}
.d26{fill:OliveDrab;}
.d27{fill:Salmon;}
.d28{fill:NavajoWhite;}
.d29{fill:Navy;}
.d30{fill:MediumVioletRed;}
.d31{fill:MediumSlateBlue;}
.d32{fill:LimeGreen;}
.d33{fill:LightPink;}
.d34{fill:Khaki;}
.d35{fill:Lavender;}
.d36{fill:Gray;}
.d37{fill:Green;}
.d38{fill:Gold;}
.d39{fill:Brown;}
.d40{fill:DarkOrange;}

.gr{fill:lightgray;}
.rd{fill:red;}

/*vehicle completeness start*/
table#completeness{
width:1200px;
}
table#completeness td {
    border-collapse: collapse;
    border: 4px solid white;
}
table#completeness td:hover {
    opacity: 0.5;
}
.compl_green {
    background-color: rgb(70, 165, 70);
    fill: rgb(70, 165, 70);
    width: 35px;
}
.compl_orange {
    background-color: rgb(236, 168, 40);
    fill: rgb(236, 168, 40);
    width: 35px;
}
.compl_yellow {
    background-color: rgb(241, 238, 32);
    fill: rgb(241, 238, 32);
    width: 35px;
}
.compl_grey {
    background-color: grey;
    fill: grey;
    width: 35px;
}
.compl_red {
    background-color: rgb(223, 41, 41);
    fill: rgb(223, 41, 41);
    width: 35px;
}
.compl_blue {
    background-color: rgb(47, 47, 218);
    fill: rgb(47, 47, 218);
    width: 35px;
}
#completeness .circle{
    background-color:rgb(47, 47, 218);
    display:block;
    height:10px;
    width:10px;
    border-radius:50%;
    margin:auto;
}
/*vehicle completeness end*/

#uploadField
{
    width: 600px;
    height: 300px;
    overflow-y: scroll;
}

.fileElement
{
    padding: 8px 8px 8px 0;
}

.ui.attached.tab
{
    margin: 0;
}

.ui.grid.nopadding>.column:not(.row) {
padding:0;
}

.ui.form .fields div, .ui.form .field div,
.ui.form .field p
{
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.ui.form .fields .dropdown div, .ui.form .fields .field .ui.input {
    padding: 0;
    font-size: 0.8em;
}

#licencesWithoutNFCTags .ui.form .fields .dropdown div {
width: auto;
}

.ui.form.toppad {
    padding-top: 0.7em;
}

.ui.negative.message {
    z-index: 1;
    
}

#legend {
    z-index: 0;
}

#feedbackMessage, #licenceFeedbackMessage, #costFeedbackMessage,
#feedbackUpdateMessage, #qualificationFeedbackMessage{
   color:black; 
   border-radius: 10px;
   margin: 20px 0;
}

 
#feedbackMessage.FeedbackPositive,
#licenceFeedbackMessage.FeedbackPositive,
#costFeedbackMessage.FeedbackPositive,
#feedbackUpdateMessage.FeedbackPositive,
#qualificationFeedbackMessage.FeedbackPositive {
   color:black;
   background-color: #00c71422;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5), 0 6px 20px rgba(0, 0, 0, 0.5);
   border-radius: 10px;
   margin: 20px 0;
}

#feedbackMessage.FeedbackNegative,
#licenceFeedbackMessage.FeedbackNegative,
#costFeedbackMessage.FeedbackNegative,
#feedbackUpdateMessage.FeedbackNegative,
#qualificationFeedbackMessage.FeedbackNegative {
   color:black;
   background-color: #ff0a00aa;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5), 0 6px 20px rgba(0, 0, 0, 0.5);
   border-radius: 10px;
   margin: 20px 0;
}

/************************************ KGneu*****************************************************/

.tooltip-wrap .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: #fff;
    color:black;
    text-align: center;
    border-radius: 0px;
    padding: 5px 0;
  
    /* Position the tooltip */
    position: absolute;  
    
    z-index: 1;

}

.tooltip-wrap .tooltiptext {
    width: 250px;
    bottom: 100%;
    right: 50%;
    margin-left: 10px; 
    visibility: collapse;
}

.tooltip-wrap:hover .tooltiptext {
    visibility: visible;
}
.tooltip-wrap .tooltiptext {
    width: 250px;
    bottom: 100%;
    left: 50%;
    margin-left: -50px; 
    visibility: collapse;
    }

#driversMenu{
    display: flex;
    flex-direction: row;
    justify-content : space-between;
    width:90%;
    background:#fff;
    padding: 0 5px 10px 0;  
    margin-left:15px;
    margin-bottom: 5px;
    height: 40px;    
}

#leftDriverMenu{
    width: 130px; 
    padding: 0;
    margin-top:10px;   
    margin-left:6px;
}

#inactiveButton{
    background-color: #fff;
    border: 1px solid darkgrey;
}

#showButtons{
    margin-top: 5px;
    display: flex;
    flex-direction: row;
    justify-content : space-between;
    width: 80px;
    height:30px;  
}
#driverfiles{
    margin-top: 5px;
    display: flex;
    flex-direction: row;
    justify-content : space-between;
    width: 80px;
    height:30px;  
}
#inactiveIcon{
    color: darkgray;
    
}

#inactiveCount{
    color: darkgray;
}

#activeButton{
    background-color: #fff;
    border: 1px solid green;
    
}
#activeCount{
    color: green;
}
#activeIcon{
    color: blue;
}
#filesIcon{
    color: #434343;   
}
#allButton{
    background-color: #fff;
    border: 1px solid darkgrey;
    margin-left: 5px;
}
#guseDrivers{
    background-color:white; 
    width: 15px;
    height:15px;
    border:1px solid black;  
    margin-left: 5px;

}

#allIcon{
    color: darkgray;
    
}

#allCount{
    color: darkgray;
}

.vsmall{
    width: 20px;
    height:15px;       
}

.countPos{
    position:relative; 
        top: -0.2em;
        left:-0.9em;
}

.allCountPos{
    position:relative; 
        top: -0.2em;
        left:-1.8em;
}
.countPosFiles{
    position:relative; 
        top: -0.5 em;
        left:-0.7em;
}

.labelPosition{
    position:relative;
        top: -1.6em; 
        left: 0.4em;
}


#iconMenu{
    width:130px;
    position:relative; 
        top:-1.5em; 
        left:0em; 
}

.iconPosition{ 
    position:relative;
        top:-0.4em; 
        left:-0.7em;
}

.iconPosition2{ 
    position:relative;
        top:-1.5em; 
        left:-1.5em;
    
}

/********************************************* Führerschein erfassen/anzeigen **********************************/
/*********************************************************************************************/
.licenceDivContainer{
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: 1;
    grid-template-areas: 
   "   dl_1 dl_2 ";
 }
 .leftSide {
    background-color: #f8f8f9;
    grid-area: dl_1;
 }
 .rightSide {
    grid-area: dl_2;
    margin-top: 150 px;
 }
 
 .submitButton{
    width:350px;
    height:50px;
    background-color: lightgreen; 
    margin:20px;
 }
 .submitButton:hover{
    background-color: rgb(60,90,60);
    color: white;
 }
 .updateButton{
    width:350px;
    height:50px;
    background-color: lightblue; 
    margin:20px;
 }
 .updateButton:hover {
    background-color: rgb(60,120,240);
    color: white;
 }
 .resetButton{
    width:350px;
    height:50px;
    background-color: white; 
    margin:20px;
 }
 .controlButton{
    width:350px;
    height:50px;
    background-color: lightgoldenrodyellow; 
    margin:20px;
 }
 .addNewButton{
    width:350px;
    height:50px;
    background-color: lightgreen; 
    margin:20px;
 }
 .tooltip-wrap {
    position: relative;
    
  }
  .tooltip-wrap .tooltip-content {
    display: none;
    position: absolute;
    bottom: 5%;
    left: 5%;
    right: 5%;
    background-color: #f0f0f8;
    padding: .5em;
    width:100em;
    
  }
  .tooltip-wrap:hover .tooltip-content {
    display: block;
  }
  .licencebox {
    text-align: left; 
    margin:0 auto;
    max-width:80%;
    align-items: center;
 }
 .licenceContainer{
    background-color: #f0f0f0;
    padding: 20px;
 }
 .hiddenRow{
    visibility: collapse;
 }
 .licenceButton{
    padding: 5px 10px 5px 10px;
    font-size: 1.3rem;
    margin: 0px 3px 0px 3px;
    background-color: #f0f0f0;
    border-radius: 8%;
 }
 .hiddenContainer{
    visibility: collapse;
 }
 #hideInfo{
    visibility: visible;
 }
 #divs div {
    display:none;
 }
 .hiddenInfo {
    display:none;
 }

.middle {
    display: table-cell;
    vertical-align: middle;
}

/* Führerschein Kontrolle */
.lastcontrolWarning {
    border: 2px solid  rgba(255, 0, 0, 1) !important;
    text-align: center !important;
}
.lastcontrolAttention{
    border: 2px solid rgba(255, 255, 0, 1) !important;
    text-align: center !important;
}
.lastcontrol{
    border: 2px solid rgba(0, 255, 0, 1) !important;
    text-align: center !important;
}






/* Neue css angaben für Terminverwaltung*/
/* Add padding and center-align text to the container */
.container {
    display:flexbox;
    padding: 16px;
    text-align: center;  
  }
  
  

  
  #appointment-title {
    font-size: 16px;
    margin-bottom: 10px;
  }

#termin div, input, h3 {
    margin: 5px;
}
#termin textarea{
    max-height: 80px;
    margin: 5px;
}


#week-table-body td {
    border: 1px solid black;
    padding: 10px;
    background-color: white;
  }
  
  #week-table-body th {
    border: 1px solid black;
    font-size: 10px;
    padding: 10px;
    font-weight: bold;
  }
  
  .time-row {
    height: 50px;
  }
  
  .middle-row {
    height: 150px;
  }
 
/* Add your CSS styles here as needed */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .modal-content {
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    max-width: 400px;
  }
  .modal-content1 {
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    max-width: 800px;
  }
  
  .modal h2 {
    margin-top: 0;
  }
  
  .modal hr {
    margin: 10px 0;
  }
  
  .modal ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .modal ul li {
    margin-bottom: 5px;
  }
  
  #speedDataText{
    display:none;
    border:2px solid orange;
    margin:10px;
    padding:10px;
  }
  #legend2 {
    position: fixed;
    background: rgba( 144, 238, 144, 0.5 );
    top:260px;
    left:1190px;
    z-index: 10;
    padding-left: 10px;
    box-shadow: 0 1px 2px 0 rgb(34 36 38 / 15%);
    border-bottom: 1px solid rgba(34,36,38,.15);
    display: flex; 
    justify-content: space-between; 
    align-items: center;
}