/* ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com */*,::after,::before {box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}::after,::before{--tw-content:''}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:Figtree, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*, ::before, ::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.absolute{position:absolute}.relative{position:relative}.-left-20{left:-5rem}.top-0{top:0px}.-bottom-16{bottom:-4rem}.-left-16{left:-4rem}.-mx-3{margin-left:-0.75rem;margin-right:-0.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-video{aspect-ratio:16 / 9}.size-12{width:3rem;height:3rem}.size-5{width:1.25rem;height:1.25rem}.size-6{width:1.5rem;height:1.5rem}.h-12{height:3rem}.h-40{height:10rem}.h-full{height:100%}.min-h-screen{min-height:100vh}.w-full{width:100%}.w-\[calc\(100\%\+8rem\)\]{width:calc(100% + 8rem)}.w-auto{width:auto}.max-w-\[877px\]{max-width:877px}.max-w-2xl{max-width:42rem}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-2{gap:0.5rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.self-center{align-self:center}.overflow-hidden{overflow:hidden}.rounded-\[10px\]{border-radius:10px}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.rounded-sm{border-radius:0.125rem}.bg-\[\#FF2D20\]\/10{background-color:rgb(255 45 32 / 0.1)}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.bg-gradient-to-b{background-image:linear-gradient(to bottom, var(--tw-gradient-stops))}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.via-white{--tw-gradient-to:rgb(255 255 255 / 0)  var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #fff var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-white{--tw-gradient-to:#fff var(--tw-gradient-to-position)}.stroke-\[\#FF2D20\]{stroke:#FF2D20}.object-cover{object-fit:cover}.object-top{object-position:top}.p-6{padding:1.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.px-3{padding-left:0.75rem;padding-right:0.75rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.pt-3{padding-top:0.75rem}.text-center{text-align:center}.font-sans{font-family:Figtree, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-sm\/relaxed{font-size:0.875rem;line-height:1.625}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-semibold{font-weight:600}.text-black{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.underline{-webkit-text-decoration-line:underline;text-decoration-line:underline}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow-\[0px_14px_34px_0px_rgba\(0\2c 0\2c 0\2c 0\.08\)\]{--tw-shadow:0px 14px 34px 0px rgba(0,0,0,0.08);--tw-shadow-colored:0px 14px 34px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.ring-transparent{--tw-ring-color:transparent}.ring-white\/\[0\.05\]{--tw-ring-color:rgb(255 255 255 / 0.05)}.drop-shadow-\[0px_4px_34px_rgba\(0\2c 0\2c 0\2c 0\.06\)\]{--tw-drop-shadow:drop-shadow(0px 4px 34px rgba(0,0,0,0.06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-\[0px_4px_34px_rgba\(0\2c 0\2c 0\2c 0\.25\)\]{--tw-drop-shadow:drop-shadow(0px 4px 34px rgba(0,0,0,0.25));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-300{transition-duration:300ms}.selection\:bg-\[\#FF2D20\] *::selection{--tw-bg-opacity:1;background-color:rgb(255 45 32 / var(--tw-bg-opacity))}.selection\:text-white *::selection{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.selection\:bg-\[\#FF2D20\]::selection{--tw-bg-opacity:1;background-color:rgb(255 45 32 / var(--tw-bg-opacity))}.selection\:text-white::selection{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.hover\:text-black:hover{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))}.hover\:text-black\/70:hover{color:rgb(0 0 0 / 0.7)}.hover\:ring-black\/20:hover{--tw-ring-color:rgb(0 0 0 / 0.2)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)}.focus-visible\:ring-\[\#FF2D20\]:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(255 45 32 / var(--tw-ring-opacity))}@media (min-width: 640px){.sm\:size-16{width:4rem;height:4rem}.sm\:size-6{width:1.5rem;height:1.5rem}.sm\:pt-5{padding-top:1.25rem}}@media (min-width: 768px){.md\:row-span-3{grid-row:span 3 / span 3}}@media (min-width: 1024px){.lg\:col-start-2{grid-column-start:2}.lg\:h-16{height:4rem}.lg\:max-w-7xl{max-width:80rem}.lg\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.lg\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.lg\:flex-col{flex-direction:column}.lg\:items-end{align-items:flex-end}.lg\:justify-center{justify-content:center}.lg\:gap-8{gap:2rem}.lg\:p-10{padding:2.5rem}.lg\:pb-10{padding-bottom:2.5rem}.lg\:pt-0{padding-top:0px}.lg\:text-\[\#FF2D20\]{--tw-text-opacity:1;color:rgb(255 45 32 / var(--tw-text-opacity))}}@media (prefers-color-scheme: dark){.dark\:block{display:block}.dark\:hidden{display:none}.dark\:bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))}.dark\:bg-zinc-900{--tw-bg-opacity:1;background-color:rgb(24 24 27 / var(--tw-bg-opacity))}.dark\:via-zinc-900{--tw-gradient-to:rgb(24 24 27 / 0)  var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #18181b var(--tw-gradient-via-position), var(--tw-gradient-to)}.dark\:to-zinc-900{--tw-gradient-to:#18181b var(--tw-gradient-to-position)}.dark\:text-white\/50{color:rgb(255 255 255 / 0.5)}.dark\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.dark\:text-white\/70{color:rgb(255 255 255 / 0.7)}.dark\:ring-zinc-800{--tw-ring-opacity:1;--tw-ring-color:rgb(39 39 42 / var(--tw-ring-opacity))}.dark\:hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.dark\:hover\:text-white\/70:hover{color:rgb(255 255 255 / 0.7)}.dark\:hover\:text-white\/80:hover{color:rgb(255 255 255 / 0.8)}.dark\:hover\:ring-zinc-700:hover{--tw-ring-opacity:1;--tw-ring-color:rgb(63 63 70 / var(--tw-ring-opacity))}.dark\:focus-visible\:ring-\[\#FF2D20\]:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(255 45 32 / var(--tw-ring-opacity))}.dark\:focus-visible\:ring-white:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(255 255 255 / var(--tw-ring-opacity))}}

.main-background {
    background-color: #E6E6E6;
}
.py-10.homepage-main {
    padding:0;
}
.main-background .card {
    border: none;
}
.main-background .card main {
    padding: 30px;
}
.homepage-main-div {
    justify-content: normal;
    background-color: #E6E6E6;
    align-items: center;
}
.tables.vehicletemplates {
    position:relative;
}
.homepagerelative .tables.vehicletemplates {
    position: static;
    overflow-y: scroll;
    height: 80vh;   
    padding-top: 50px; 
}
#addOrEditUnfall #photo-previewaddUnfall {
    display: none;
    max-width: 185px;
    margin: auto;    
    max-height: 120px;
}

#addOrEditUnfall input {
    margin-bottom: 0;
}
#addOrEditUnfall label {

}
nav a {
    padding: 0;
    font-size: 10px;
}
nav a:hover {
    color: white;
}
nav a img {
    width: 30px;
    display: flex;
    margin: auto;    
}
.tables.vehicletemplates .scrollgrid {
    position: absolute;
    height: 100%;
    width: fit-content;
    overflow: scroll;
    scroll-behavior: smooth;   
    padding-bottom: 260px; 
}
.tables.vehicletemplates .scrollgrid::-webkit-scrollbar,
.homepage-main .rightsidepopup .rightSide::-webkit-scrollbar,
.tables.vehicletemplates::-webkit-scrollbar {
    display: none;  
}
.vehicletemplates .paginator {
    position: fixed;
    background-color: white;
    bottom: 20px;
    width: 54rem;    
}
.homepage-main-div .relative {
    width: auto;
    border-radius: 15px;
    background-color: white;
    padding-bottom: 50px;
    min-width: 70rem;
    margin-bottom: 50px;
    color: #02283E; 
}
.unfallOrServiceDataPhoto {
    height: 150px;
    overflow: hidden;  
	display: grid;
    align-items: center;
    justify-content: center;	
}
.homepage-main-div.onlyhomepage .relative {
    margin-top: 120px;
    position: absolute;
    overflow: scroll;
    height: 100%;    
    padding-top: 30px;
}
.vehicletemplatespage {
    margin-top: 30px;
}
.vehicletemplatespage form {
    height: 78vh;
    overflow: hidden;    
}
.homepage-main-div .relative::-webkit-scrollbar {
    display: none;  /* Chrome, Safari, Opera */
}
.homepage-main-div .relative.homepagerelative {
    width:65%;
    min-width: 65%;
    height: 35rem;
}
#addOrEditTemplate label strong {

}
.homepage-main-div .relative .top {
    padding: 0;
    border-bottom: solid 1px #D8E8F2;
    padding-bottom: 25px;
}
.homepage-main-div.onlyhomepage .relative .top {
    position: fixed;
    background-color: white;
    width: 63%;
    top: 120px;
    z-index: 2;    
    padding-top: 10px;
    padding-bottom: 10px;    
}
.homepage-main-div.onlyhomepage .relative .top img {
    width: 20px;
    margin-right: 10px;
}
.unfallPopup .top img {
    width: 35px!important;
    margin-right: 0!important;
}
.homepage-main-div .relative .top h3 {
    color: #005688;
    font-size: x-large;
    padding-left: 15px;
}
.homepage-main-div .relative .top a {
    justify-self: end;
    background-color: #005688;
    color: white;
    border-radius: 15px;
    padding: 5px 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: max-content;    
}
.unfallPopup .addNewUnfall {
    margin-right: 50px;
}
.homepage-main-div .relative .itemcontent {
    grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
    border-radius: 15px;
    background-color: white;
    padding: 15px;
    margin-top: 0px;    
    align-items: unset;
    border-bottom: solid 1px #dbe9ff;
    padding-top:0;
}
.homepage-main-div .relative .itemcontent.homecontent .tablescontent {

}
.centerElements {
    display: flex;
    justify-content: center;
    align-items: center;
}
.vehicletemplate_details {
    padding: 10px 15px;
    background-color: #E8F7FF;
    border-radius: 15px;
    cursor: pointer;
}
.vehicletemplate_details .data {
    margin-top: 10px;
    text-align: center;
}
.vehicletemplate_details .data .btn-primary {
    padding: 6px 0px;
    border-radius: 20px;
    background-color: #00B9B3;
    width: max-content;
    display: flex;
    justify-self: center;
    margin: auto;    
}
.vehicletemplate_details .data .btn-primary img {
    width: 30px;
}
.vehicletemplate_details .data h3 {
    font-weight: bold;
    padding-left: 10px;
}
.vehicletemplate_details .data p {
    align-self: center;
    background-color: white;
    border-radius: 15px;
    width: 100%;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 10px;
    padding: 2px 15px;    
}
.paginator .relative {
    min-width: 2rem;
    margin-top: 10px;
    margin-bottom: 10px;
    padding-bottom: 0;
    padding-left: 15px;
    padding-right: 15px;
}
.paginator .sm\:justify-between {
    justify-content: center;
}
.paginator .sm\:justify-between p {
    padding-left: 10px;
    padding-right: 10px;
}
.vehicletemplate_details .title {
    margin-bottom: 10px;
} 
.vehicletemplate_details .title a {
    background-color: #ff6d6d;
    justify-self: end;
    padding: 4px 0px;
    font-size: 10px;
    border-radius: 20px;
} 
.vehicletemplate_details .title a img {
    width: 25px;
}
.vehicletemplate_details.unfallAndServices .title a {
    padding: 5px 2px;
    width: max-content;
    height: max-content;
}

.vehicletemplate_details .title a:hover {
    background-color: #FF2D20;
}
.vehicletemplate_details .thumb {

    overflow: hidden;

}

.vehicletemplate_details .thumb img {
    width: 15rem;
    height: 8rem;
    border: solid 1px #151583;
    border-radius: 10px;
}

.homepage-main-div .relative .itemcontent table {
    width: 100%;
    text-align: left;    
    table-layout: fixed;
}
.homepage-main-div .relative .itemcontent table.table-vehicle td span, 
.homepage-main-div .relative .itemcontent table.table-vehicle td input {
    border-style: solid;
    border-radius: 20px;
    border-width: thin;
    padding: 5px 15px;
    border-color: #004771;
    width: 90%;
    float: left; 
    overflow-x: scroll;   
}
.homepage-main-div .relative .itemcontent table.table-vehicle td span::-webkit-scrollbar {
    display: none;
}
header {
    background-color: #005688;
    padding-top: 5px!important;
    padding-bottom: 5px!important;
    padding:5px 40px;
}
header .-mx-3 {
    margin-right: 0;
}
header a {
    color: #fff;
}
.homepage-main {
    padding-top: 0;
    padding-bottom: 0;
}
.mainpageleft {
    float: left;
    width: 100px;
    /*padding-left: 15px;*/
    position: fixed !important;
    background-color: white;
    z-index: 1; 
}
footer {
    padding: 0;
    padding-top: 15px;
    padding-bottom: 15px;  
    background-color: #005688;
    color: white; 
}

.logotip {
    width: 20rem;
    color: blue;
}
.mainpageleft a {
    text-align: center;
    width: 5rem;
    margin: auto;    
}
.leftsidenavi {
    grid-column: span 1;
    height: 100%;
}
.leftsidenavi div {
    width: 6rem;
    background-color: white;
    height: 100vh;
    padding-left: 15px;
    padding-right: 15px;    
    display: flex;
}
.leftsidenavi div a {
    margin:auto;
}
.vehicletemplate_details:hover {
    background-color: #98CCEB;
}
.addVehicle {
    position: relative;
    height: 70vh;
}
.addVehicle h3 {
    text-align: center;
}
.vehicleTemplateData {
    width: 100%;
    float: left;
    padding: 15px;
    border: solid 1px;
    border-radius: 15px;
}
.vehicleData {
    position: fixed;
    bottom: 0;
    background-color: white;
    top: 200px;
    overflow-y: hidden;
    padding-bottom: 20px;
    width: 18rem;
    overflow-x: hidden;
    height: 70vh;
}
.vehicleData .actionsTab {
    margin-top: 15px;
}
.vehicleData img {
    display: block;
    max-width: 120px;
    margin: auto;    
}
.vehicleData::-webkit-scrollbar {
    display: none;
}

.vehicleData .mb-3, #addOrEditTemplate .mb-3 {
    margin-bottom: 5px!important;    
}
#addOrEditTemplate .mb-3 label {
    margin-bottom: 2px;
}
.vehicleData label {
    margin-bottom: 2px;    
}
.vehicleData h3 {
    color: #005688;
    font-size: medium;
    font-weight: 600;    
}
.vehicleData input {
    border-radius: 25px;
    border-color: #00659F;
    color: #00659F;   
    padding: 3px 0.75rem;
}
.vehicleTemplateData .dataat div {
    width: 50%;
    float: left;
} 
.vehicleData button {
    color: black;
}
.createform {
    width: 40rem;
    margin-bottom: 40px;
}
.vehicletemplates input[type="radio"]:checked + label .vehicletemplate_details {
    background-color: #98CCEB; /* Change this color to whatever you prefer */
}

.popup {
    display: none; /* Hidden by default */
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Popup content */
.popup-content {
    background-color: #fefefe;
    margin: 7% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 30rem;
    border-radius: 20px;
    padding-bottom: 70px;
    height: auto;
}

.popup-content h3 {
    text-align: center;
    margin-bottom: 45px;
    margin-top: 15px;
    font-size: 30px;
    color: #216B97;
}
.popup-content h3.popup_title {
    width: max-content;
    margin: 0;
    padding: 0;
    margin-top: 30px;
    margin-left: 60px;    
}
.popup-content .data h3 {
    text-align: left;
    margin-bottom: 15px;
    font-size: 12px;
}
.unfallPopup .tables .data h3 {
    margin: 0;
    margin-top: 10px;    
}
.popup-content .data p {
    align-self: center;
    background-color: white;
    border-radius: 15px;
    width: 100%;
    margin: auto;
    margin-top: 0;
    margin-bottom: 10px;
    padding: 2px 15px;    
}
#newVehicleTemplatePopup .popup-content div {
    display:grid;
}
.popup-content div {
    text-align: center;
    
}
.vehicletemplate_details div, .popup-content div label, .popup-content div input {
    text-align: left;
    width: 100%;

}
.popup-content button {
    font-size: 20px;
    background-color: #005688;
    color: white;
    padding: 10px;
    width: 15rem;
    border-radius: 30px;
    margin-bottom: 20px;    
}

.popup-content button:hover {
    background-color: #0c6498;
}
#addOrEditTemplate button {
    background-color: #009E4A;
    width: max-content;
}
.actionsTab button img, #addOrEditTemplate button img {
    width: 3rem;
    float:left;
}
#addOrEditTemplate button:hover {
    background-color: #14b660;
}
/* Close button */
.close, .back {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close {
    width: 2rem;
    padding: 0px 10px;
    height: 2rem;
    border: solid 1px red;
    color: red;
    font-size: 20px;
    border-radius: 25px;    
}
.back {
    float: left;
    width: 3rem;
    position: absolute;
}
.popupAbsoluteTopClos {
    position: absolute;
    width: 67rem;
    z-index: 10;    
}
.popupAbsoluteTopClos .back {
    position: relative;
}
.close:hover,
.close:focus {
    color: #f55959;
    text-decoration: none;
    cursor: pointer;
    border-color: #f55959;
}

.unfallPopup .popup-content {
    width: 70rem;
    height:85vh;
    overflow: hidden;
    overflow-y: hidden;
}
.unfallPopup .popup-content::-webkit-scrollbar {
    display: none;
}
.actions .history button {
    border-radius: 50px;
    background-color: #005688;
    width: 3rem;
    padding: 10px;
    color: white;
    margin-top: 20%;
    font-size: 8px;  
    justify-self: end;
}
.actions .history button img {
    width: 90%;
    margin: auto;
}
.actions .history button:hover {
    background-color: #1777af;
}

.id_item {
    grid-column: span 1;
    text-align: center;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    /* border: 1px solid #000; */
    padding: 0; 
}
.id_item span {
    flex-grow: 1;
    display: flex;
    align-items: center;
    padding-top: 35px;
}

.id_item button {
    
    padding: 6px 0px;
    border-radius: 20px;
    background-color: #0F7D74;
    width: max-content;
    display: flex;
    justify-self: center;
    margin: auto;    
    opacity: 0;
}
.id_item button:hover {
    background-color: #0DB2AC;
}
.id_item button img {
    width: 30px;
}
.createform button {
    color:black;
}
.tables table th {
    color: #4685A9;
    font-size: smaller;
}
.tables table td {
    font-size: x-large;    
}
table.table-vehicle td {
    font-size: medium;
    padding-top: 5px;
}
.warning {
    width: 20px;
    height: 20px;
    background-color: red;
    border-radius: 20px;
    margin-right: 0px;
    position: absolute;
    margin-left: 15px;    
}
.actionsTab a {
    width: max-content;
    padding: 4px 10px;
    height: max-content;
    border: solid 1px red;
    color: red;
    border-radius: 25px;
}
.unfallPopup .actionsTab a {
    width: 4rem;
    padding: none;
    height: auto;
    border: none;
    border-radius: 0%;
}
.actionsTab button {
    background-color: #009E4A;
    justify-self: end;
    color: white;
    border-radius: 20px;   
    display: flex;
    justify-content: center;
    align-items: center;
    width: max-content;     
    padding: 2px 10px; 
}
.actionsTab button:hover {
    background-color: #0db45b;
}

.uploadPhotoLabel {
    justify-self: center;
    padding: 2px 20px;
    background-color: #216B97;
    border-radius: 25px;
    color: white!important;
    cursor: pointer;    
    width: max-content !important;  
    display: flex;
    justify-content: center;
    align-items: center;  
    font-size: 15px;    
}
.unfallPopup .popup-content.addVehicleTemplateForm {
    width: 25rem;
}
.unfallPopup .popup-content.addVehicleTemplateForm h3 {
    margin-bottom: 10px!important;
    margin-top: 10px!important;    
}
.addVehicleTemplateForm label {
    color: #005688;
    text-align: left;    
}
.addVehicleTemplateForm input {
    border: solid 1px #7FA2B7;
    color: #7FA2B7;
    border-radius: 30px;
}
.addNewUnfall {
    justify-self: end;
    margin-top: 35px;
    margin-right: 25px;
    background-color: #216B97;
    height: max-content;
    padding: 5px 15px;
    border-radius: 30px;
    color: white; 
}
.addNewUnfall img, .addnewvehicletemplatebutton img {
    width: 2rem;
    float: left;
    margin-top: 2px;    
}
.uploadPhotoLabel img {
    float: left;
    width: 50px;    
}
.uploadPhotoLabel:hover {
    background-color: #2f82b4;
}
.homepage-main-div .relative .top a:hover {
    background-color: #106ca2;
}
.homepage-main-div .relative .top a .fa-plus {
    border: solid 1px;
    border-radius: 30px;
    padding: 3px;
    font-weight: 100;
    margin-right: 5px;    
}
.form-label {
padding-left: 10px;
}
.addUnfallFormPopup {
    margin: 4% auto;
    height: 90vh !important;
}
.addUnfallFormPopup h3.popup_title {
    width: 100%;
    margin-left: 0;
    margin-top: 10px;
    margin-bottom: 15px;
    font-size: x-large;    
}
.addUnfallFormPopup label {
    width: 100%;
    float: left;
    text-align: center;
    margin-bottom: 5px;
    font-weight: lighter;    
}
.addUnfallFormPopup input {
    margin-bottom: 5px;
    line-height: 10px;
    font-size: 12px; 
}
.addUnfallFormPopup textarea {
    resize: vertical;
    border: solid 1px;
    width: 80%;
    margin-bottom: 10px;
    min-height: 4rem;
    border-radius: 5px;
    padding: 10px;   
    width: 100%; 
}
.profile-header {
    background-color: white;    
}
.addUnfallFormPopup label.uploadPhotoLabel {
    color: white;
    width: max-content;
    margin: auto;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.homepage-main .rightsidepopup {
    position: absolute;
    width: 100%;
    height: 92vh;
    max-height: 892px;
    overflow: hidden;    
}
.homepage-main .rightsidepopup .rightSide {
    width: 15%;
    justify-self: end;
    z-index: 1;
    margin-top: 120px;
    background-color: white;
    margin-right: 17px;
    padding: 10px;
    border-radius: 10px;    
    overflow-y: scroll;
}
.homepage-main .rightsidepopup .rightSide .photo {
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 15px;  
}
.homepage-main .rightsidepopup .rightSide h3 {
    margin-bottom: 25px;
    float: left;
    margin-top: 15px;    
}
.homepage-main .rightsidepopup .close {
    position: absolute;
    justify-self: end;
    height: max-content;
    padding: 0;    
    width: 2rem;
    display: flex;
    justify-content: center;    
}
.fixedTop {
    position: fixed;
    top: 0;
    /* left: 0; */
    z-index: 1000;
    background-color: white;
}
.unfallPopup .top {
    top: 124px !important;
    width: 70% !important;
}
.unfallPopup .top.listOfUnfallsOrServicesTop {
    top: 15% !important;
    width: 67rem !important;    
}
.fixedTop a {
    margin-top:10px;
}
.vehicleData.fixedTop {
    width: -webkit-fill-available;
    margin-right: 4rem;
    padding-right: 15px;    
}
.top.homepage.fixedTop {
    width: 48rem;
}
.top.vehicletemplates.fixedTop {
    width: 46rem;
}
header {
    position: fixed;
    width: 100%;
    z-index: 2;  
}
body {
    height: 100%;
    overflow: hidden;    
}
#photo-previewaddVehiclePhoto {
    display: none;
    max-width: 150px;
    justify-self: center;
    margin: auto;
    margin-top: 10px;   
}
#addVehiclePhoto {
    position: absolute;
}
.addPhotoForVehicleForm {

    justify-content: center;
    border-radius: 10px;
}
.hidden {
    display: none;
}
.addPhotoImgAndButton .actionsTab {
    display: grid;
    padding-top: 10px;    
}
.addPhotoImgAndButton {
    position: absolute;
    width: 120%;    
}
.addPhotoImgAndButton .actionsTab button {
    width: max-content;
    padding: 3px 15px;
    justify-self: center;    
    display: none;
}
nav a {
    padding: 0!important;
    font-size: 10px;
}
nav a:hover {
    color: white!important;
}
nav a img {
    width: 30px;
    display: flex;
    margin: auto;    
}

.profilePageContent {
    overflow-y: scroll;
    height: 100vh;
    margin-top: 50px;
    padding-bottom: 100px;    
} 
#newVehicleTemplatePopup .popup-content div.vehicleTemplateIcons {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.vehicleTemplateIcons label {
    flex: 1 1 23%;
    margin: 1%;
    cursor: pointer;
}
.vehicleTemplateIcons input {
    display: none;
}
.vehicleTemplateIcons img {
    width: 5rem;
    border: solid 1px;
    border-radius: 12px;
    height: 3rem;
}
.vehicleTemplateIcons object {
    width: 5rem;
    height: 3rem;   
}

.vehicleTemplateIcons label.selected img {
    filter: brightness(0) saturate(100%) invert(32%) sepia(87%) saturate(426%) hue-rotate(186deg) brightness(98%) contrast(96%);
    /* Add your desired CSS filter or fill color here */
}
.alert-success {
    position: absolute;
    width: 55vw;
    display: flex;
    justify-content: center;
    background-color: white;
    border: none;
    padding: 0;
}
.alert-success img {
    width: 4rem;
    position: absolute;
}
#buttonForAddingNewPhoto {
    margin-top: 15px;
}
#buttonForAddingNewPhoto label {
    text-align: left;
    width: 100%;
    float: right;    
}
#buttonForAddingNewPhoto button {
    width: max-content;
    padding: 2px 16px;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    margin-right: 10px;
    float: right;
    display: none;
    background-color: #0db45b;
}
#buttonForAddingNewPhoto button img {
    width: 35px !important;
    margin-right: 0 !important;    
}
#mainPhotoOfUnfallOrService {
    width: 100%;
    display: grid;
    justify-content: center;
    overflow: hidden;
    height: 55%;
    margin-top: 50px;
}
#mainPhotoOfUnfallOrService .photo {
    width: 70%;
    display: flex;
    justify-self: center;
    
}
#mainPhotoOfUnfallOrService .photo img {
    border: solid 1px blue;
    border-radius: 10px;
	height: max-content;
}
#trackPhotosOfUnfallOrService {
    display: flex;
    width: 100%;
    justify-content: l;
    gap: 10px;
}
#trackPhotosOfUnfallOrService .photo {
    width: 15%;
    max-height: 15vh;
    overflow: hidden;
    margin-top: 20px;
    border: solid 1px #94b4ff;
    border-radius: 12px;
}
* {
    caret-color: transparent;
} 
input,textarea {
    caret-color: rgb(3, 3, 84);
} 
#loginForm input {
color:black;
}