Scripts/resources/[ps]/ps-mdt/ui/style.css
2024-12-29 21:28:24 +01:00

6751 lines
125 KiB
CSS

@import url('https://fonts.googleapis.com/css?family=Montserrat');
:root {
--color-1: #1E3955;
--color-2: #213F5F;
--color-3: #2C537B;
--color-4: #23405E;
--color-5: #152638;
--color-6: #121f2c;
--color-7: rgb(28, 54, 82);
--color-8: #2554cc;
--color-9: #6E707C;
--color-10: #8f741b;
}
body {
font-family: 'Montserrat', sans-serif;
overflow: hidden;
display: none;
}
textarea {
font-family: 'Montserrat', sans-serif;
}
::-webkit-scrollbar {
width: 0px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.dashboard-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.badge-logo {
margin-left: 1vh;
width: 12vh;
height: 12vh;
}
.profile-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.incidents-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.bolos-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.reports-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.penalcode-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.sop-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.dmv-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.weapons-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.stafflogs-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
overflow: auto
}
.container-load {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.header {
height: 4vh;
background-color: var(--color-1);
border: 5px solid #393B39;
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
width: 96.5%;
position: absolute;
top: 4vh;
display: flex;
align-items: center;
user-select: none;
}
.header-left {
display: flex;
flex-direction: column;
text-align: left;
margin-left: 10px;
margin-right: 0px;
}
.header-middle {
background-color: var(--color-2);
border-radius: 15px;
border: 5px solid #393B39;
width: fit-content;
height: 3.5vh;
padding: 8px;
padding-left: 20px;
padding-right: 20px;
display: flex;
flex-direction: column;
text-align: center;
align-items: normal;
color: white;
margin: auto;
margin-top: -10px;
font-size: 15px;
}
.header-right {
display: flex;
flex-direction: column;
text-align: right;
margin: auto;
margin-right: 35px;
margin-left: 0px;
}
.main-container {
border-top: 5px solid var(--color-3);
width: 100%;
height: 86%;
position: absolute;
display: flex;
bottom: 0;
}
.nav-menu {
background-color: var(--color-1);
border-right: 5px solid var(--color-3);
min-width: 22.5vh;
height: 100%;
display: flex;
flex-direction: column;
user-select: none;
border-bottom-left-radius: 15px;
}
.nav-item {
background-color: var(--color-4);
margin-top: 10px;
padding: 10px;
color: white;
font-size: 18px;
font-weight: bolder;
}
.nav-item:hover {
background-color: var(--color-3);
}
.active-nav {
background-color: var(--color-3);
}
.warrants-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
.warrants-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.fa-search {
font-size: 15px;
font-weight: normal;
}
.warrants-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 55vh;
}
.warrants-item {
background-color: var(--color-5);
width: 100%;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
}
.warrants-item:hover {
background-color: var(--color-3);
}
.warrant-image {
width: 9vh;
height: 9vh;
margin-left: 5px;
margin-top: auto;
margin-bottom: auto;
}
.warrant-title {
font-size: 16px;
font-weight: lighter;
color: white;
margin-top: 5px;
}
.warrant-item-info {
color: #cccccc;
font-size: 12px;
}
.warrant-bottom-info {
display: flex;
margin-top: 1vh;
margin-bottom: 0.75vh;
width: 100%;
}
.warrant-id {
color: white;
font-size: 12px;
}
.warrant-expiry-date {
color: white;
font-size: 12px;
margin: auto;
margin-right: 10px;
}
.quotes-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
width: 50vh;
height: 75px;
margin-top: 10px;
margin-left: 10px;
display: flex;
align-items: center;
user-select: none;
}
.quote-title {
font-size: 14px;
background-color: var(--color-4);
padding: 5px;
margin: 10px 0px 10px 10px;
text-align: center;
color: white;
font-weight: bolder;
width: 85px;
/* height: 30px; */
text-shadow: black 1px 1px;
}
.quote {
margin-right: 10px;
margin-left: 10px;
/* margin-bottom: 25px; */
width: 100%;
background-color: var(--color-5);
height: 30px;
padding: 10px;
text-align: center;
display: flex;
font-style: italic;
}
.quote-span {
margin: auto;
color: white;
font-size: 16px;
}
.bulletin-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 100%;
width: 50vh;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
user-select: none;
overflow: hidden;
}
.bulletin-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 0px;
width: 83.5%;
align-items: center;
user-select: none;
}
.bulletin-items-continer {
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
overflow: auto;
height: 100%;
display: flex;
flex-direction: column;
}
.bulletin-item {
background-color: var(--color-5);
width: 45vh;
/* min-height: 7.7vh; */
/* height: 7.7vh; */
padding: 10px;
display: flex;
flex-direction: column;
margin-bottom: 10px;
}
.bulletin-item:hover {
background-color: var(--color-3);
}
.bulletin-item-title {
color: white;
margin-left: 5px;
font-size: 20px;
text-align: left;
}
span.bulletin-item-title {
outline: none;
border: none;
}
span.bulletin-item-title[contenteditable]:empty::before {
content: 'Enter Title';
}
.bulletin-item-info {
color: #cccccc;
font-size: 15px;
margin-left: 5px;
margin-top: 10px;
text-align: left;
padding-bottom: 0.8vh;
overflow-wrap: break-word;
}
span.bulletin-item-info {
outline: none;
border: none;
}
span.bulletin-item-info[contenteditable]:empty::before {
content: 'Enter Bulletin Information';
}
.bulletin-bottom-info {
display: flex;
margin-left: 5px;
margin-bottom: 0px;
color: white;
font-size: 12px;
height: 100%;
}
.bulletin-date {
margin: auto;
margin-right: 5px;
margin-bottom: 0px;
}
.bulletin-id {
margin: auto;
margin-left: 0px;
margin-bottom: 0px;
}
.dispatch-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 81.1vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
margin-right: 15px;
}
.dispatch-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.active-unit-title {
background-color: var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 2px;
margin-left: 10px;
margin-left: 13px;
width: 57.5%;
align-items: center;
user-select: none;
}
.active-unit-count {
background-color: var(--color-3);
color: white;
font-weight: bolder;
font-size: 14px;
padding-top: 6px;
padding-bottom: 6px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 3px;
margin-left: 3px;
width: 8%;
align-items: center;
user-select: none;
border-radius: 5px;
}
.calls-title {
background-color: var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 2px;
margin-left: 10px;
margin-left: 13px;
width: 95%;
align-items: center;
user-select: none;
}
#police-count {
background-color: #093095;
}
#bcso-count {
background-color: #cc7e25;;
}
#sasp-count {
background-color: #2589cc;
}
#ems-count {
background-color: #950909;
}
#doj-count {
background-color: #525252;
}
#doc-count {
background-color: #7b25cc;
}
#pa-count {
background-color: #008080;
}
.active-unit-list {
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
overflow: auto;
height: 35vh;
display: flex;
flex-direction: column;
width: 95%;
}
.active-unit-item {
padding-top: 7.5px;
padding-bottom: 7.5px;
padding-right: 10px;
padding-left: 10px;
/* height: 3vh; */
background-color: var(--color-5);
display: flex;
align-items: center;
margin-bottom: 5px;
}
#draggedItem {
position: absolute;
z-index: 80;
-webkit-transition: opacity 0.2s ease;
-moz-transition: opacity 0.2s ease;
-ms-transition: opacity 0.2s ease;
transition: opacity 0.2s ease;
opacity: 0;
pointer-events: none;
padding: 10px;
height: 3vh;
background-color: var(--color-5);
display: flex;
align-items: center;
margin-bottom: 5px;
width: 45vh;
}
.unit-status {
width: fit-content;
padding: 5px;
padding-left: 15px;
padding-right: 15px;
color: white;
font-size: 12px;
font-weight: bolder;
margin: auto;
margin-left: 5px;
margin-right: 0px;
background-color: #0B9509;
border-radius: 10px;
}
.green-status {
background-color: #099517;
}
.yellow-status {
background-color: #958F09;
}
.unit-job {
width: fit-content;
padding: 5px;
padding-left: 15px;
padding-right: 15px;
color: white;
font-size: 12px;
font-weight: bolder;
margin: auto;
margin-left: 5px;
margin-right: 0px;
background-color: #093095;
border-radius: 10px;
}
.unit-police {
background-color: #093095;
}
.unit-ems {
background-color: #950909;
}
.unit-doc {
background-color: #7b25cc;
}
.unit-pa {
background-color: #008080;
}
.unit-name {
margin: auto;
margin-left: 10px;
margin-right: 0px;
font-size: 12px;
font-weight: bolder;
color: white;
}
.unit-radio {
margin: auto;
margin-right: 5px;
font-size: 12px;
font-weight: bolder;
color: white;
background-color: var(--color-3);
padding: 5px;
padding-left: 12.5px;
padding-right: 12.5px;
border-radius: 5px;
}
.active-calls-list {
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
overflow: auto;
height: 100%;
display: flex;
flex-direction: column;
width: 95%;
}
.active-calls-item {
height: fit-content;
background-color: var(--color-5);
display: flex;
align-items: center;
margin-bottom: 5px;
}
.active-call-inner-container {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.red-call {
background-color: #381515;
}
.call-item-top {
height: 50%;
width: 100%;
display: flex;
align-items: center;
margin: auto;
margin-top: .5vh;
}
.call-number {
background-color: #950909;
color: white;
font-size: 15px;
font-weight: bolder;
padding: 2.5px;
padding-left: 10px;
padding-right: 10px;
border-radius: 10px;
width: fit-content;
margin: auto;
margin-left: .75vh;
margin-right: 0;
}
.call-code {
background-color: #097C95;
color: white;
font-size: 15px;
font-weight: bolder;
padding: 2.5px;
padding-left: 10px;
padding-right: 10px;
border-radius: 10px;
width: fit-content;
margin: auto;
margin-left: 5px;
margin-right: 0;
}
.call-title {
color: white;
font-size: 20px;
font-weight: bolder;
padding: 2.5px;
padding-left: 0px;
padding-right: 0px;
border-radius: 10px;
width: fit-content;
margin: auto;
margin-left: 5px;
margin-right: 0;
}
.call-radio {
margin: auto;
margin-left: auto;
margin-right: .5vh;
font-size: 15px;
font-weight: bolder;
color: white;
background-color: var(--color-3);
padding: 5px;
padding-left: 12.5px;
padding-right: 12.5px;
border-radius: 5px;
}
.call-item-bottom {
height: fit-content;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
margin: auto;
margin-top: 0vh;
margin-left: .75vh;
padding-bottom: .75vh;
}
.call-bottom-info {
color: white;
font-size: 15px;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
margin-left: 0.3vh;
overflow:wrap;
white-space:normal;
}
.dispatch-line {
background-color: rgba(128, 128, 128, 0.1);
height: 0.05vh;
width: 100%;
margin-top: 0.1vh;
margin-bottom: 0.1vh
}
.call-bottom-info > .far {
margin-right: .1vh;
}
.call-bottom-information {
margin-top: 0.5vh;
}
.call-victim {
color: white;
font-size: 15px;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
margin-left: 0px;
}
a {
text-decoration: none;
}
.profile-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
.profile-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.profile-title:hover {
background-color: var(--color-3);
}
.profile-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#profile-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#profile-search-input::placeholder {
color: white;
}
.profile-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.profile-item {
background-color: var(--color-5);
width: 100%;
height: 12vh;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
}
.profile-item:hover {
background-color: var(--color-3);
}
.profile-image {
width: 10vh;
height: 10vh;
margin-left: 10px;
margin-top: auto;
margin-bottom: auto;
object-fit: cover;
}
.profile-item-title {
font-size: 16px;
font-weight: lighter;
color: white;
padding-top: 2px;
}
.profile-tags {
display: flex;
overflow-x: auto;
width: 100%;
margin-top: 10px;
margin-bottom: 5px;
}
.profile-criminal-tags {
display: flex;
overflow-x: auto;
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-tag {
margin: auto;
margin-left: 0px;
margin-right: 6px;
padding: 4px;
padding-left: 7px;
padding-right: 7px;
border-radius: 10px;
color: white;
font-size: 12px;
font-weight: bolder;
background-color: #956E09;
}
.profile-bottom-info {
display: flex;
margin: auto;
width: 100%;
}
.profile-id {
color: white;
font-size: 13px;
}
.manage-profile-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
.manage-profile-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.manage-profile-editing-title {
background-color: var(--color-3);
color: white;
font-size: 15px;
font-weight: lighter;
padding-top: 10px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 80%;
align-items: center;
user-select: none;
display: block;
}
.manage-profile-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 10px;
padding-bottom: 10px;
background-color: #1b8f25;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.manage-profile-save:hover {
background-color: #1caa28;
}
.manage-profile-info-container {
display: flex;
flex-direction: row;
width: 95%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
}
.manage-profile-pic {
width: 45%;
object-fit: cover;
}
.manage-profile-info-inner-container {
display: flex;
flex-direction: column;
width: 55%;
}
.manage-profile-citizenid {
color: white;
margin-left: 10px;
font-size: 14px;
user-select: none;
}
.manage-profile-citizenid-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-cid-pic {
color: white;
font-size: 16px;
margin-left: 10px
}
.line {
background-color: var(--color-3);
height: 2px;
margin-left: 10px;
margin-bottom: 10px;
}
.manage-profile-name {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-name-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-profile-dob {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-dob-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-profile-fingerprint {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-fingerprint-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-profile-phonenumber {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-phonenumber-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-profile-job {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-job-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.manage-profile-url {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-url-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 21.75vh;
}
.manage-profile-info {
width: 92.5%;
margin: auto;
margin-top: 10px;
margin-bottom: 15px;
border: none;
outline: none;
height: 100%;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
}
.manage-profile-active-warrant {
display: none;
margin: auto;
padding: 8px;
color: red;
font-weight: bold;
font-size: 20px;
}
.manage-profile-right-container {
display: flex;
flex-direction: column;
height: 97.9%;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
margin-right: 15px;
}
.manage-profile-licenses-container {
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
height: 20%;
}
.license-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.licenses-holder {
overflow: auto;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.license-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: rgb(255, 255, 255);
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
}
.manage-profile-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
height: 20%;
border: 2px solid var(--color-3);
margin-top: 5px;
min-height: 100px;
max-height: 200px;
overflow: scroll;
}
.tags-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
width: 84%;
align-items: center;
user-select: none;
}
.tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 5px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.tags-add-btn:hover {
background-color: var(--color-3);
}
.tags-holder {
overflow: auto;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-bottom: 5px;
margin-left: 0px;
margin-right: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
}
span.tag-input[contenteditable]:empty::before {
content: 'Input Tag';
}
.tag-input {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 5px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
.manage-profile-vehs-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
height: 20%;
border: 2px solid var(--color-3);
margin-top: 5px;
max-height: 150px;
overflow: scroll;
}
.vehs-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.vehs-holder {
overflow: auto;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.veh-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 5px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
}
.manage-profile-houses-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
height: 20%;
border: 2px solid var(--color-3);
margin-top: 5px;
max-height: 150px;
overflow: scroll;
}
.houses-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.houses-holder {
overflow: auto;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.houses-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 5px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: bolder;
background-color: white;
user-select: none;
}
.manage-profile-gallery-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
margin-top: 5px;
height: 20%;
overflow: scroll;
}
.gallery-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
width: 84%;
align-items: center;
user-select: none;
}
.gallery-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 5px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.gallery-add-btn:hover {
background-color: var(--color-3);
}
.gallery-inner-container {
overflow: auto;
white-space: nowrap;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.gallery-img {
width: 10vh;
filter: blur(5px);
object-fit: cover;
}
.convictions-known, .incidents-known {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.convictions-known-container, .incidents-known-container {
background-color: var(--color-5);
width: 95vh;
height: 45vh;
margin: auto;
margin-top: 10px;
display: flex;
flex-direction: column;
z-index: 9998;
display: none;
}
.convictions-known-title, .incidents-known-title {
background-color: var(--color-4);
color: white;
font-size: 20px;
font-weight: bolder;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
width: 95%;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
user-select: none;
}
.convictions-title {
background-color: var(--color-1);
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
width: 100%;
align-items: center;
user-select: none;
}
.convictions-title:hover {
background-color: var(--color-3);
}
.convictions-holder {
overflow: scroll;
max-height: 87%;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.profile-incidents-title {
background-color: var(--color-1);
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
width: 100%;
align-items: center;
user-select: none;
}
.profile-incidents-title:hover {
background-color: var(--color-3);
}
.profile-incidents-holder {
overflow: scroll;
max-height: 87%;
margin: auto;
margin-top: 5px;
width: 95%;
user-select: none;
}
.incident-number {
padding-right: 8px;
}
.incident-timestamp {
color: #303030;
font-size: 10px;
font-weight: 500;
}
.loader {
position: absolute;
left: 50%;
top: 50%;
z-index: 1;
width: 120px;
height: 120px;
border: 12px solid var(--color-1);
border-radius: 50%;
border-top: 12px solid var(--color-3);
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}
.profile-loader {
margin-top: 5vh;
margin-left: auto;
margin-right: auto;
z-index: 1;
width: 120px;
height: 120px;
border: 12px solid var(--color-4);
border-radius: 50%;
border-top: 12px solid var(--color-3);
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.gallery-image-enlarged {
width: 40vh;
position: absolute;
top: 20%;
left: 25%;
display: none;
z-index: 999;
}
/* Context Menu */
.contextmenu {
position: absolute;
width: fit-content;
padding: 2px;
margin: 0;
border: 1px solid var(--color-3);
background: var(--color-5);
z-index: 9999;
border-radius: 3px;
box-shadow: 1px 1px 4px rgba(0,0,0,.2);
opacity: 0;
transform: translate(0, 15px) scale(.95);
transition: transform 0.1s ease-out, opacity 0.1s ease-out;
pointer-events: none;
}
.contextmenu-item {
display: block;
position: relative;
margin: 0;
padding: 0;
white-space: nowrap;
}
.contextmenu-btn {
display: block;
color: white;
font-size: 13px;
cursor: pointer;
border: 1px solid transparent;
white-space: nowrap;
padding: 6px 8px;
border-radius: 3px;
}
.contextmenu-btn {
outline: 0 none;
text-decoration: none;
}
.contextmenu-text {
margin-left: 5px;
}
.contextmenu-btn .fa {
position: absolute;
left: 8px;
top: 50%;
transform: translateY(-50%);
}
.contextmenu-item-disabled {
opacity: .5;
pointer-events: none;
}
.contextmenu-item-disabled .contextmenu-btn {
cursor: default;
}
.contextmenu-item-submenu::after {
content: "";
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
border: 5px solid transparent;
border-left-color: #808080;
}
.contextmenu-item-submenu:hover::after {
border-left-color: #fff;
}
.contextmenu-show,
.contextmenu-item:hover > .contextmenu {
opacity: 1;
transform: translate(0, 0) scale(1);
pointer-events: auto;
}
.contextmenu-item:hover > .contextmenu {
transition-delay: 300ms;
}
.revoke-licence:hover {
background-color: #950909;
}
.give-licence:hover {
background-color: #099517;
}
.remove-image:hover {
background-color: #950909;
}
.expand-image:hover {
background-color: #099517;
}
.copy-image-link:hover {
background-color: #099517;
}
.view-incident:hover {
background-color: var(--color-3);
}
.view-incident2:hover {
background-color: var(--color-3);
}
.make-waypoint:hover {
background-color: var(--color-3);
}
.view-profile:hover {
background-color: var(--color-3);
}
.gallery-upload-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#gallery-upload-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#gallery-upload-input::placeholder {
color: white;
}
.penalcode-embed {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 96.5%;
width: 85%;
margin: auto;
overflow: hidden;
}
.penalcode-embed iframe {
height: 96.5%;
width: 98%;
margin: auto;
border: none;
outline: none;
}
.sop-embed {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 96.5%;
width: 85%;
margin: auto;
overflow: hidden;
}
.sop-embed iframe {
height: 96.5%;
width: 98%;
margin: auto;
border: none;
outline: none;
}
.incidents-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
.incidents-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.incidents-title:hover {
background-color: var(--color-3);
}
.incidents-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#incidents-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#incidents-search-input::placeholder {
color: white;
}
.incidents-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.incidents-item {
background-color: var(--color-5);
width: 100%;
height: 5.5vh;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
flex-direction: column;
}
.incidents-item:hover {
background-color: var(--color-3);
}
.incidents-top-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
}
.incidents-item-title {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
max-width: 25vh;
margin-top: 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.incedent-report-name {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-top: 5px;
}
.incidents-bottom-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
padding-top: 5px;
}
.incedent-report-id {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
margin-bottom: 5px;
}
.incedent-report-time-ago {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-bottom: 5px;
}
.manage-incidents-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
max-height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
overflow: auto;
}
.manage-incidents-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: auto;
width: 80%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.manage-incidents-title:hover {
background-color: var(--color-3);
}
.manage-incidents-create {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 5px;
padding-bottom: 5px;
align-items: center;
background-color: var(--color-4);
margin: auto;
margin-left: 5px;
margin-top: 10px;
/* margin-right: 0px; */
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.manage-incidents-create:hover {
background-color: var(--color-3);
}
.manage-incidents-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 5px;
padding-bottom: 5px;
background-color: #1b8f25;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.manage-incidents-save:hover {
background-color: #1caa28;
}
.manage-incidents-title-tag {
font-size: 16px;
font-weight: lighter;
color: white;
width: 95%;
margin: auto;
text-align: left;
margin-top: 10px;
margin-bottom: 0px;
}
.manage-incidents-title-input {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-incidents-title-input input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-incidents-reports-content {
width: 91%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
border: none;
outline: none;
min-height: 30vh;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
pointer-events: none;
}
.manage-incidents-tags-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.manage-incidents-tags-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-right: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.manage-incidents-tags-add-btn:hover {
background-color: var(--color-3);
}
.manage-incidents-tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
pointer-events: none;
}
.manage-incidents-tags-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-incidents-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-bottom: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
}
.manage-incidents-officers-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.manage-incidents-officers-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-right: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.manage-incidents-officers-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
pointer-events: none;
}
.manage-incidents-officers-add-btn:hover {
background-color: var(--color-3);
}
.manage-incidents-officers-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-incidents-civilians-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.manage-incidents-civilians-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-right: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.manage-incidents-civilians-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
pointer-events: none;
}
.manage-incidents-civilians-add-btn:hover {
background-color: var(--color-3);
}
.manage-incidents-civilians-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-incidents-evidence-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.manage-incidents-evidence-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-right: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.manage-incidents-evidence-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
pointer-events: none;
}
.manage-incidents-evidence-add-btn:hover {
background-color: var(--color-3);
}
.manage-incidents-evidence-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-incidents-evidence {
width: 10vh;
filter: blur(5px);
}
span.tag-incident-input[contenteditable]:empty::before {
content: 'Input Tag';
}
.tag-incident-input {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
.associated-incidents-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
}
.associated-incidents-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.associated-incidents-title:hover {
background-color: var(--color-3);
}
.associated-incidents-tags-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.associated-incidents-tags-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-right: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.associated-incidents-tags-add-btn:hover {
background-color: var(--color-3);
}
.associated-incidents-tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
pointer-events: none;
}
.associated-incidents-tags-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.associated-incidents-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
}
.incidents-upload-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#incidents-upload-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#incidents-upload-input::placeholder {
color: white;
}
.incidents-img {
width: 10vh;
filter: blur(5px);
object-fit: cover;
}
.bulletin-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.bulletin-add-btn:hover {
background-color: var(--color-3);
}
.associated-incidents-user-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
width: 94%;
height: fit-content;
align-items: center;
user-select: none;
}
.associated-incidents-user-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.associated-incidents-user-tags-holder {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
min-height: 3.5vh;
max-height: 14vh;
user-select: none;
display: flex;
background-color: var(--color-5);
}
.modify-charges-label {
color: white;
font-size: 13px;
font-weight: bolder;
border-bottom: 2px solid #2C537B;
padding: 2px;
margin: auto;
margin-top: 4px;
margin-bottom: -3px;
width: 95%;
align-items: center;
user-select: none;
}
.associated-incidents-user-tag {
text-decoration: none;
margin-top: auto;
margin-bottom: auto;
margin-left: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: white;
font-size: 12px;
font-weight: 600;
background-color: black;
user-select: none;
width: fit-content;
}
.associated-incidents-user-holder {
padding: 10px;
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 92%;
min-height: 3.5vh;
max-height: 37vh;
user-select: none;
}
.associated-incidents-user {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-bottom: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
}
.associated-incidents-fine-input {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.associated-incidents-fine-input input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.associated-incidents-sentence-input {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 15px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.associated-incidents-sentence-input input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.associated-incidents-controls {
justify-content: inherit;
width: 90%;
margin-top: 5px;
margin-bottom: 15px;
}
.control-button {
text-align: center;
background-color: var(--color-4);
border: 2px solid var(--color-3);
margin-bottom: 10px;
padding: 10px;
}
.control-button span {
padding-right: 8px;
}
.control-button:hover {
background-color: var(--color-3);
cursor: pointer;
}
.incidents-person-search {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
margin-top: 32.5vh;
}
.incidents-person-search-container {
background-color: var(--color-5);
width: 95vh;
height: 45vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 9998;
display: none;
}
.incidents-person-search-title {
background-color: var(--color-4);
color: white;
font-size: 20px;
font-weight: bolder;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
width: 95%;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
user-select: none;
}
.incidents-person-search-name-title {
width: 95%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
color: white;
font-size: 15px;
text-align: left;
user-select: none;
}
.incidents-person-search-name-input {
background-color: rgba(0, 0, 0, 0);
border: none;
outline: none;
color: white;
width: 100%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
text-align: left;
padding-bottom: 2.5px;
}
.incidents-person-search-holder {
overflow: auto;
height: 30vh;
width: 95%;
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
}
.incidents-person-search-item {
width: 100%;
height: 12.5vh;
display: flex;
flex-direction: row;
}
.incidents-person-search-item:hover {
background-color: var(--color-3);
}
.incidents-person-search-item-pfp {
width: 11vh;
height: 11vh;
margin-top: auto;
margin-bottom: auto;
margin-left: 10px;
}
.incidents-person-search-item-right {
display: flex;
flex-direction: column;
width: 100%;
margin-top: auto;
margin-bottom: auto;
margin-right: 10px;
margin-left: 10px;
height: 11vh;
}
.incidents-person-search-item-right-cid-title {
width: 100%;
margin: auto;
margin-top: 0px;
margin-bottom: 0px;
color: white;
font-size: 16px;
text-align: left;
user-select: none;
}
.incidents-person-search-item-right-cid-input {
width: 100%;
margin: auto;
margin-top: 5px;
margin-bottom: auto;
color: white;
font-size: 16px;
text-align: left;
padding-bottom: 2.5px;
border-bottom: 2px solid var(--color-3);
user-select: none;
}
.incidents-person-search-item-right-name-title {
width: 100%;
margin: auto;
margin-top: auto;
margin-bottom: 0px;
color: white;
font-size: 16px;
text-align: left;
user-select: none;
}
.incidents-person-search-item-right-name-input {
width: 100%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
color: white;
font-size: 16px;
text-align: left;
padding-bottom: 2.5px;
border-bottom: 2px solid var(--color-3);
}
.bolos-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
.bolos-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.bolos-title:hover {
background-color: var(--color-3);
}
.bolos-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#bolos-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#bolos-search-input::placeholder {
color: white;
}
.bolos-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.bolos-item {
background-color: var(--color-5);
width: 100%;
height: 5.5vh;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
flex-direction: column;
}
.manage-bolos-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
max-height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
overflow: auto;
}
.manage-bolos-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 10px;
width: 66%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.manage-bolos-title-tag {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 0px;
width: 84%;
align-items: center;
user-select: none;
}
.manage-bolos-title:hover {
background-color: var(--color-3);
}
.manage-bolos-create {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 5px;
padding-bottom: 5px;
align-items: center;
background-color: var(--color-4);
margin: auto;
margin-left: 5px;
margin-top: 10px;
/* margin-right: 0px; */
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.manage-bolos-create:hover {
background-color: var(--color-3);
}
.manage-bolos-input-tag {
font-size: 16px;
font-weight: lighter;
color: white;
width: 95%;
margin: auto;
text-align: left;
margin-top: 10px;
margin-bottom: 0px;
}
.manage-bolos-input-title {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-bolos-input-title input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-bolos-input-plate {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-bolos-input-plate input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-bolos-input-owner {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-bolos-input-owner input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-bolos-input-individual {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-bolos-input-individual input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-bolos-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #1b8f25;
margin: auto;
margin-left: 0px;
margin-top: 10px;
margin-right: 13px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.manage-bolos-save:hover {
background-color: #1caa28;
}
.manage-bolos-new {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #8f1b1b;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.manage-bolos-new:hover {
background-color: #aa1c1c;
}
.manage-bolos-reports-content {
width: 91%;
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
border: none;
outline: none;
height: 100%;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
}
.manage-bolos-right-container {
display: flex;
flex-direction: column;
height: 95.7%;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
margin-right: 15px;
}
.manage-bolos-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
max-height: 150px;
overflow: scroll;
}
.manage-bolos-gallery-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
margin-top: 10px;
height: 18vh;
overflow: scroll;
}
.manage-bolos-tags-holder {
overflow: auto;
margin: auto;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-officers-tags-holder {
overflow: auto;
margin: auto;
width: 95%;
max-height: 14vh;
user-select: none;
margin-top: 10px;
}
.officers-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.officers-add-btn:hover {
background-color: var(--color-3);
}
.manage-officers-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
max-height: 150px;
margin-top: 10px;
overflow: scroll;
}
.bolo-item {
background-color: var(--color-5);
width: 100%;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
flex-direction: column;
}
.bolo-item:hover {
background-color: var(--color-3);
}
.bolo-top-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
}
.bolo-item-title {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
margin-top: 5px;
}
.bolo-report-name {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-top: 5px;
}
.bolo-bottom-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
margin-top: 5px
}
.bolo-report-id {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
margin-bottom: 5px;
}
.bolo-report-time-ago {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-bottom: 5px;
}
.bolos-search-refresh {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: var(--color-10);
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.bolos-search-refresh:hover {
background-color: #aa891c;
}
.bolos-search-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 0px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 80%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.bolos-search-title:hover {
background-color: var(--color-3);
}
.manage-bolos-tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.manage-bolos-tags-add-btn:hover {
background-color: var(--color-3);
}
span.tag-bolo-input[contenteditable]:empty::before {
content: 'Input Tag';
}
.tag-bolo-input {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
span.officer-tag-bolo-input[contenteditable]:empty::before {
content: 'Input Tag';
}
.officer-tag-bolo-input {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
.bolo-gallery-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.bolo-gallery-add-btn:hover {
background-color: var(--color-3);
}
.bolo-gallery-upload-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#bolo-gallery-upload-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#bolo-gallery-upload-input::placeholder {
color: white;
}
.bolo-img {
width: 10vh;
filter: blur(5px);
object-fit: cover;
}
.bolo-gallery-inner-container {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-bolos-editing-title {
background-color: var(--color-3);
color: white;
font-size: 15px;
font-weight: lighter;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 10px;
width: 95%;
align-items: center;
user-select: none;
}
.reports-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
}
#home-reports-container {
height: 50%;
}
#home-warrants-container {
height: 50%;
}
.dispatch-comms-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 46.5%;
width: 50vh;
margin-top: 1vh;
margin-left: 10px;
}
.reports-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.reports-title:hover {
background-color: var(--color-3);
}
.reports-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#reports-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#reports-search-input::placeholder {
color: white;
}
.reports-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.dispatch-item {
height: auto;
padding: auto;
margin-top: 1vh;
}
.dispatch-item:hover {
background-color: var(--color-7);
}
.dispatch-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 94%;
height: 100%;
}
.dispatch-message-profilepic {
width: 2.8vh;
height: 2.8vh;
object-fit: cover;
float: left;
border-radius: 50%;
}
.dispatch-item-info {
float:left;
font-size: 14px;
font-weight: bold;
padding-left: 0.75vh;
color: var(--color-8);
}
.dispatch-info-job-lspd {
color: #2554cc;
}
.dispatch-info-job-bcso {
color: #cc7e25;
}
.dispatch-info-job-sast {
color: #2589cc;
}
.dispatch-info-job-sasp {
color: #2589cc;
}
.dispatch-info-job-doc {
color: #7b25cc;
}
.dispatch-info-job-sapr {
color: #5acc25;
}
.dispatch-info-job-pa {
color: #008080;
}
.dispatch-info-job-ambulance {
color: #cc2525;
}
.dispatch-info-job-doj {
color: #FFEAB9;
}
.active-info-job-lspd {
background-color: #2554cc;
}
.active-info-job-bcso {
background-color: #cc7e25;
}
.active-info-job-sast {
background-color: #2589cc;
}
.active-info-job-sasp {
background-color: #2589cc;
}
.active-info-job-doc {
background-color: #7b25cc;
}
.active-info-job-sapr {
background-color: #5acc25;
}
.active-info-job-pa {
background-color: #008080;
}
.active-info-job-ambulance {
background-color: #cc2525;
}
.active-info-job-doj {
background-color: #525252;
}
.active-info-job-unk {
background-color: #6E707C;
}
.dispatch-item-message {
float:left;
font-size: 14px;
font-weight: lighter;
color: white;
width: 100%;
overflow:wrap;
white-space:normal;
padding-left: 0.80vh;
padding-top: 0.2vh;
}
.dispatch-item-msg {
padding-left: 2.8vh;
padding-bottom: 0vh;
}
.dispatch-item-msg:hover {
background-color: var(--color-7);
}
.dispatch-item-grid {
display:grid;
}
.dispatch-input {
min-width: 90%;
max-width: 90%;
min-height: 0.1vh;
margin-left: 1.1vh;
margin-bottom: 1vh;
border: none;
padding: 12px 20px;
background-color: var(--color-7);
color: #bebec2;
}
.dispatch-input:focus {
outline:none!important;
}
.reports-search-refresh {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: var(--color-10);
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.reports-search-refresh:hover {
background-color: #aa891c;
}
.dispatch-comms-refresh {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: var(--color-10);
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.dispatch-comms-refresh:hover {
background-color: #aa891c;
}
.reports-search-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 0px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 80%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.reports-search-title:hover {
background-color: var(--color-3);
}
.manage-reports-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
max-height: 80.7vh;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
overflow: auto;
}
.manage-reports-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: auto;
margin-left: 10px;
width: 80%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.manage-reports-title-tag {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 0px;
width: 84%;
align-items: center;
user-select: none;
}
.manage-reports-title:hover {
background-color: var(--color-3);
}
.manage-reports-create {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 5px;
padding-bottom: 5px;
align-items: center;
background-color: var(--color-4);
margin: auto;
margin-left: 5px;
margin-top: 10px;
/* margin-right: 0px; */
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.manage-reports-create:hover {
background-color: var(--color-3);
}
.manage-reports-input-tag {
font-size: 16px;
font-weight: lighter;
color: white;
width: 95%;
margin: auto;
text-align: left;
margin-top: 10px;
margin-bottom: 0px;
}
.manage-reports-input-title {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-reports-input-title input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-reports-input-type {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-reports-input-type input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-reports-input-owner {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-reports-input-owner input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-reports-input-individual {
color: white;
font-weight: lighter;
width: 95%;
margin: auto;
margin-top: 5px;
margin-bottom: 0px;
align-items: center;
display: flex;
border-bottom: 2px solid var(--color-3);
}
.manage-reports-input-individual input {
border: none;
outline: none;
margin-left: 5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.manage-reports-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #1b8f25;
margin: auto;
margin-left: 0px;
margin-top: 10px;
margin-right: 13px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.manage-reports-save:hover {
background-color: #1caa28;
}
.manage-reports-new {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #8f1b1b;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.manage-reports-new:hover {
background-color: #aa1c1c;
}
.incidents-remove-normal-tag:hover {
background-color: #aa1c1c;
}
.incidents-remove-normal-civ:hover {
background-color: #aa1c1c;
}
.incidents-remove-tag:hover {
background-color: #aa1c1c;
}
.incidents-remove-officer-tag:hover {
background-color: #aa1c1c;
}
.remove-tag:hover {
background-color: #aa1c1c;
}
.manage-reports-editing-title {
background-color: var(--color-3);
color: white;
font-size: 15px;
font-weight: lighter;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 10px;
width: 95%;
align-items: center;
user-select: none;
display: block;
}
.manage-reports-reports-content {
width: 91%;
margin: auto;
margin-top: 15px;
margin-bottom: 15px;
border: none;
outline: none;
height: 100%;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
}
.manage-reports-right-container {
display: flex;
flex-direction: column;
height: 95.7%;
width: 50vh;
margin-top: 10px;
margin-left: 10px;
margin-right: 15px;
}
.manage-reports-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
max-height: 150px;
overflow: scroll;
}
.manage-reports-gallery-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
margin-top: 10px;
height: 18vh;
overflow: scroll;
}
.manage-reports-tags-holder {
overflow: auto;
margin: auto;
width: 95%;
max-height: 14vh;
user-select: none;
}
.reports-officers-tags-holder {
overflow: auto;
margin: auto;
width: 95%;
max-height: 14vh;
user-select: none;
margin-top: 10px;
}
.reports-officers-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.reports-officers-add-btn:hover {
background-color: var(--color-3);
}
.reports-officers-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
max-height: 150px;
margin-top: 10px;
overflow: scroll;
}
.reports-gallery-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.reports-gallery-add-btn:hover {
background-color: var(--color-3);
}
.reports-gallery-upload-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#reports-gallery-upload-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#reports-gallery-upload-input::placeholder {
color: white;
}
.reports-img {
width: 10vh;
filter: blur(5px);
object-fit: cover;
}
.reports-gallery-inner-container {
overflow: auto;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.manage-reports-tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.manage-reports-tags-add-btn:hover {
background-color: var(--color-3);
}
.reports-civilians-tags-container {
display: flex;
flex-direction: column;
background-color: var(--color-1);
width: 100%;
border: 2px solid var(--color-3);
max-height: 150px;
margin-top: 10px;
overflow: scroll;
}
.reports-civilians-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7px;
padding-bottom: 7px;
margin: auto;
margin-top: 10px;
margin-left: 5px;
margin-bottom: 0px;
width: 10%;
text-align: center;
}
.reports-civilians-add-btn:hover {
background-color: var(--color-3);
}
.reports-civilians-tags-holder {
overflow: auto;
margin: auto;
width: 95%;
max-height: 14vh;
user-select: none;
margin-top: 10px;
}
.reports-item {
background-color: var(--color-5);
width: 100%;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
flex-direction: column;
}
.reports-item:hover {
background-color: var(--color-3);
}
.reports-top-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
}
.reports-item-title {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
margin-top: 5px;
max-width: 25vh;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.reports-report-name {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-top: 5px
}
.reports-bottom-holder {
width: 100%;
height: 50%;
display: flex;
align-items: center;
margin-top: 5px;
}
.reports-report-id {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-left: 5px;
margin-bottom: 5px;
}
.reports-report-time-ago {
font-size: 14px;
font-weight: lighter;
color: white;
margin: auto;
margin-right: 5px;
margin-bottom: 5px;
}
span.tag-reports-input[contenteditable]:empty::before {
content: 'Input Tag';
}
.tag-reports-input {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-top: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
.dmv-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50%;
margin-top: 10px;
margin-left: 10px;
}
.dmv-search-refresh {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: var(--color-10);
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.dmv-search-refresh:hover {
background-color: #aa891c;
}
.dmv-search-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.dmv-search-title:hover {
background-color: var(--color-3);
}
.dmv-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#dmv-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#dmv-search-input::placeholder {
color: white;
}
.dmv-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.vehicle-information-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50%;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
}
.vehicle-information-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #1b8f25;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.vehicle-information-save:hover {
background-color: #1caa28;
}
.add-charge:hover {
background-color: #1caa28;
}
.vehicle-information-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 0px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 81%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.dmv-item {
background-color: var(--color-5);
width: 100%;
height: 9vh;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
}
.dmv-item:hover {
background-color: var(--color-3);
}
.dmv-image {
width: 7vh;
height: 7vh;
margin-left: 10px;
margin-top: auto;
margin-bottom: auto;
object-fit: cover;
}
.dmv-item-title {
font-size: 16px;
font-weight: lighter;
color: white;
padding-top: 2px;
}
.dmv-tags {
display: flex;
overflow-x: auto;
width: 98%;
margin-top: 10px;
margin-bottom: 5px;
}
.dmv-tag {
margin: auto;
margin-left: 0px;
margin-right: 6px;
padding: 4px;
padding-left: 7px;
padding-right: 7px;
border-radius: 10px;
color: white;
font-size: 12px;
font-weight: bolder;
background-color: #956E09;
}
.dmv-bottom-info {
display: flex;
margin: auto;
width: 100%;
}
.dmv-id {
color: white;
font-size: 13px;
}
.vehicle-info-stuff {
display: flex;
flex-direction: row;
width: 95%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
}
.vehicle-info-image {
width: 444px;
height: 269px;
object-fit: cover;
}
.vehicle-info-inner-container {
display: flex;
flex-direction: column;
width: 55%;
}
.vehicle-info-plate {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.vehicle-info-plate-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.vehicle-info-owner {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.vehicle-info-owner-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.vehicle-info-class {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.vehicle-info-class-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.vehicle-info-model {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.vehicle-info-model-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.vehicle-info-imageurl {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.vehicle-info-imageurl-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.vehicle-info-icon {
color: white;
font-size: 16px;
margin-left: 10px
}
.vehicle-info-line {
background-color: var(--color-3);
height: 2px;
margin-left: 10px;
margin-bottom: 10px;
}
.vehicle-info-tags-container {
display: flex;
flex-direction: column;
border: 2px solid var(--color-3);
color: white;
font-size: 18px;
font-weight: bolder;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
height: fit-content;
align-items: center;
user-select: none;
}
.vehicle-info-tags-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.vehicle-info-tags-add-btn:hover {
background-color: var(--color-3);
}
.vehicle-info-tags-add-btn {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 7.25px;
padding-bottom: 7.25px;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
margin-left: 5px;
margin-right: 0px;
width: 10%;
text-align: center;
}
.vehicle-info-tags-holder {
overflow: auto;
margin: auto;
margin-top: 7px;
margin-bottom: 7px;
width: 95%;
max-height: 14vh;
user-select: none;
}
.vehicle-info-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-bottom: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
}
.vehicle-info-content {
width: 93%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
border: none;
outline: none;
min-height: 26.9vh;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
}
.vehicle-tags {
display: flex;
overflow-x: auto;
width: 98%;
margin-top: 5px;
margin-bottom: 5px;
}
.vehicle-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
padding: 4px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: white;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
outline: none;
border: none;
}
.stafflogs-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 66%;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
overflow: auto;
}
.stafflogs-box {
display: flex;
flex-direction: column;
height: 80.7vh;
width: 100%;
margin-top: 2px;
margin-left: 1px;
margin-right: 1px;
overflow: auto;
}
.stafflogs-box > p {
color: white;
font-size: 1.3vh;
padding-left: 1vh;
}
.stafflogs-box-title {
align-self: center;
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-left: 10px;
margin-right: 10px;
width: 97.5%;
height: 25px;
align-items: center;
user-select: none;
}
.leaderboard-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 33%;
margin-top: 10px;
margin-left: 4px;
margin-right: 10px;
overflow: auto;
}
.leaderboard-box {
display: flex;
flex-direction: column;
height: 80.7vh;
width: 100%;
margin-top: 2px;
margin-left: 1px;
margin-right: 1px;
overflow: auto;
}
.leaderboard-box-test {
margin: 0;
padding-top:0.8vh;
color: white;
font-size: 1.3vh;
padding-left: 1vh;
}
.leaderboard-title {
align-self: center;
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-left: 10px;
margin-right: 10px;
width: 95.5%;
height: 25px;
align-items: center;
user-select: none;
}
/* Vehicle Colors :( so long lol */
.black-color {
background-color: #0e0e0e;
color: white;
}
.darksilver-color {
background-color: #333333;
color: white;
}
.silver-color {
background-color: #333333;
color: white;
}
.bluesilver-color { background-color: #c4d4e0; }
.matteblack-color {
background-color: #141414;
color: white;
}
.gray-color {
background-color: #808080;
color: white;
}
.lightgray-color { background-color: #D3D3D3; }
.utilgunmetal-color { background-color: #39434d; }
.red-color { background-color: #c00e1a; }
.torinored-color { background-color: #da1918; }
.formulared-color { background-color: #b6111b; }
.blazered-color { background-color: #a51e23; }
.gracefulred-color { background-color: #7b1a22; }
.garnetred-color { background-color: #8e1b1f; }
.desertred-color { background-color: #6f1818; }
.cabernetred-color { background-color: #49111d; }
.candyred-color { background-color: #b60f25; }
.orange-color { background-color: #f78616; }
.gold-color { background-color: #c2944f; }
.mattedarkred-color { background-color: #732021; }
.matteyellow-color { background-color: #ffc91f; color: black }
.brightred-color { background-color: #de0f18; }
.darkgreen-color { background-color: #132428; }
.racingreen-color { background-color: #122e2b; }
.seagreen-color { background-color: #12383c; }
.olivegreen-color { background-color: #31423f; }
.green-color { background-color: #155c2d; }
.gasolinebluegreen-color { background-color: #1b6770; }
.mattelimegreen-color { background-color: #66b81f; }
.seawash-color { background-color: #65867f; }
.midnightblue-color { background-color: #222e46; }
.darkblue-color { background-color: #233155; }
.saxonyblue-color { background-color: #304c7e; }
.blue-color { background-color: #345df3; }
.diamondblue-color { background-color: #d6e7f1; }
.brightblue-color { background-color: #0b9cf1; }
.purpleblue-color { background-color: #2f2d52; }
.ultrablue-color { background-color: #2354a1; }
.lightningblue-color { background-color: #2446a8; }
.mattedarkblue-color { background-color: #1f2852; }
.matteblue-color { background-color: #253aa7; }
.yellow-color { background-color: #fbe212; color: black }
.bronze-color { background-color: #916532; }
.lime-color { background-color: #98d223; }
.champagne-color { background-color: #9b8c78; }
.beige-color { background-color: #F5F5DC; }
.darkivory-color { background-color: #473f2b; }
.brown-color { background-color: #3a2a1b; }
.lightbrown-color { background-color: #b5a079; }
.beechwood-color { background-color: #a4965f; }
.chocoorange-color { background-color: #752b19; }
.cream-color { background-color: #f7edd5; }
.white-color { background-color: #f0f0f0; color: black }
.steel-color { background-color: #6a747c; }
.blacksteel-color { background-color: #354158; }
.aluminium-color { background-color: #9ba0a8; }
.chrome-color { background-color: #5870a1; }
.wornwhite-color { background-color: #eae6de; color: black }
.offwhite-color { background-color: #dfddd0; color: black }
.lightorange-color { background-color: #f9a458; }
.pink-color { background-color: #f21f99; }
.blackblue-color { background-color: #0a0c17; }
.blackpurple-color { background-color: #0c0d18; }
.blackred-color { background-color: #0e0d14; }
.darkpurple-color { background-color: #621276; }
.olivedrab-color { background-color: #696748; }
.tan-color { background-color: #c3b492; }
.reports-remove-image:hover {
background-color: #950909;
}
.bolo-remove-image:hover {
background-color: #950909;
}
.incidents-delete:hover {
background-color: #950909;
}
.bolo-delete:hover {
background-color: #950909;
}
.weapons-delete:hover {
background-color: #950909;
}
.reports-delete:hover {
background-color: #950909;
}
.remove-bulletin:hover {
background-color: #950909;
}
.search-vehicle:hover {
background-color: #956E09;
}
.mark-code-5:hover {
background-color: #0B9509;
}
.remove-code-5:hover {
background-color: #950909;
}
.mark-stolen:hover {
background-color: #0B9509;
}
.remove-stolen:hover {
background-color: #950909;
}
.toggle-duty:hover {
background-color: #956E09;
}
.set-callsign:hover {
background-color: #0B9509;
}
.set-radio:hover {
background-color: #09956b;
}
.incidents-ghost-holder {
overflow: auto;
max-height: 80vh;
margin-top: 10px;
margin-bottom: 10px;
}
.incidents-charges-table {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
margin: auto;
margin-top: -25vh;
}
.incidents-charges-table-container {
background-color: var(--color-5);
width: 155vh;
height: 85vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 9998;
user-select: none;
}
.incidents-charges-title-container {
width: 95%;
height: 11vh;
background-color: var(--color-4);
margin: auto;
margin-top: 1.5vh;
margin-bottom: 0vh;
display: flex;
flex-direction: column;
border: 2px solid var(--color-4);
}
.incidents-charges-title {
color: white;
margin: auto;
text-align: center;
align-items: center;
font-size: 22px;
font-weight: bolder;
margin-top: 1vh;
}
.incidents-charges-title span {
color: #B4A684;
font-size: 19px;
}
.incidents-charges-title-description {
color: white;
margin: auto;
background-color: var(--color-5);
text-align: left;
font-size: 17px;
padding: .5vh;
width: 97%;
margin-bottom: 1.5vh;
}
.manage-incidents-editing-title {
background-color: var(--color-3);
color: white;
font-size: 15px;
font-weight: lighter;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 10px;
width: 95%;
align-items: center;
user-select: none;
}
.current-charges-container {
width: 95%;
border: 2px solid var(--color-4);
margin: auto;
margin-top: 1.5vh;
margin-bottom: 0vh;
display: flex;
}
.current-charges-inner-container {
background-color: var(--color-4);
width: 35vh;
height: fit-content;
margin: auto;
margin-left: 1vh;
margin-right: 0vh;
text-align: center;
display: flex;
}
.current-charges-title {
color: white;
font-size: 19px;
font-weight: bolder;
padding: .25vh;
padding-left: 6vh;
padding-right: 6vh;
margin: auto;
}
#current-charges-holder {
display: flex;
margin: auto;
width: 110vh;
margin-left: 1vh;
margin-right: 1vh;
overflow: hidden;
}
.current-charges-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
padding: 5px;
padding-left: 7px;
padding-right: 7px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
background-color: white;
color: black;
white-space: nowrap;
}
.offenses-title-container {
width: fit-content;
height: fit-content;
background-color: var(--color-4);
margin-left: 3.75vh;
margin-top: 1.5vh;
margin-bottom: 0vh;
display: flex;
border: 2px solid var(--color-4);
}
.offenses-title {
color: white;
padding: .7vh;
padding-right: 3vh;
font-weight: bolder;
font-size: 1.4vh;
}
.offenses-prepend-holder {
width: 95%;
background-color: var(--color-4);
margin: auto;
margin-top: 1.5vh;
margin-bottom: 0vh;
border: 2px solid var(--color-4);
display: grid;
grid-template-columns: auto auto auto auto;
grid-template-rows: auto auto auto auto;
row-gap: 0vh;
overflow: auto;
}
.offense-item {
background-color: #0B9509;
border: 1.5px solid black;
height: 5.0vh;
margin: .5vh;
flex-direction: column;
color: white;
display: inline-block;
overflow: auto;
transition: all 0.15s ease-in-out;
}
.offense-item:hover {
transform: scale(1.02);
transition: all 0.15s ease-in-out;
}
.offense-item-offense {
margin: auto;
margin-left: .5vh;
margin-top: .5vh;
color: white;
font-size: 1.2vh;
font-weight: bold;
}
.offfense-item-name {
margin: auto;
margin-right: .5vh;
margin-top: .5vh;
color: white;
font-size: 1.2vh;
font-weight: bold;
}
.offense-item-id {
margin: auto;
margin-left: .5vh;
margin-bottom: .5vh;
color: white;
font-size: 1.2vh;
font-weight: bold;
}
.offfense-item-months {
margin: auto;
margin-right: .5vh;
margin-bottom: .5vh;
color: white;
font-size: 1.2vh;
font-weight: bold;
}
.offenses-main-container {
overflow: auto;
margin: auto;
margin-top: 1vh;
margin-bottom: 1vh;
width: 100%;
}
.callsign-container {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
margin-top: 40.5vh;
}
.radio-container {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
margin-top: 40.5vh;
}
.radio-inner-container {
background-color: var(--color-5);
width: 30vh;
height: 17.5vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 9998;
border: .45vh solid white;
}
.radio-title {
color: white;
font-size: 2vh;
font-weight: bold;
margin: auto;
margin-top: 2vh;
margin-bottom: 0vh;
}
.radio-input {
width: 20vh;
margin: auto;
margin-top: 1.5vh;
margin-bottom: 0vh;
background-color: var(--color-6);
border: none;
outline: none;
font-size: 2vh;
color: white;
text-align: center;
padding: 1vh;
}
.radio-buttons {
width: 20vh;
margin: auto;
margin-top: 1.5vh;
display: flex;
flex-direction: row;
}
.radio-cancel {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #D77A0D;
border-radius: 1vh;
margin: auto;
user-select: none;
}
.radio-cancel:hover {
background-color: #f18f1e;
}
.radio-submit {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #0B9509;
border-radius: 1vh;
margin: auto;
user-select: none;
}
.radio-submit:hover {
background-color: #15ac12;
}
.callsign-inner-container {
background-color: var(--color-5);
width: 30vh;
height: 17.5vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 9998;
border: .45vh solid white;
}
.callsign-title {
color: white;
font-size: 2vh;
font-weight: bold;
margin: auto;
margin-top: 2vh;
margin-bottom: 0vh;
}
.callsign-input {
width: 20vh;
margin: auto;
margin-top: 1.5vh;
margin-bottom: 0vh;
background-color: var(--color-6);
border: none;
outline: none;
font-size: 2vh;
color: white;
text-align: center;
padding: 1vh;
}
.callsign-buttons {
width: 20vh;
margin: auto;
margin-top: 1.5vh;
display: flex;
flex-direction: row;
}
.callsign-cancel {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #D77A0D;
border-radius: 1vh;
margin: auto;
user-select: none;
}
.callsign-cancel:hover {
background-color: #f18f1e;
}
.callsign-submit {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #0B9509;
border-radius: 1vh;
margin: auto;
user-select: none;
}
.callsign-submit:hover {
background-color: #15ac12;
}
/* Keep At Bottom */
.red-tag {
background-color: #950909;
}
.orange-tag {
background-color: #956E09;
}
.green-tag {
background-color: #0B9509;
}
.white-tag {
display: inline-block;
text-decoration: none;
margin: auto;
margin-left: 0px;
margin-right: 10px;
margin-bottom: 6px;
padding: 7px;
padding-left: 8px;
padding-right: 8px;
border-radius: 10px;
color: black;
font-size: 12px;
font-weight: 600;
background-color: white;
user-select: none;
width: fit-content;
background-color: white;
color: black;
}
.orange-penal-code {
background-color: #D77A0D;
}
.green-penal-code {
background-color: #0B9509;
}
.red-penal-code {
background-color: #950909;
}
.header-pin {
padding-right: 5px;
}
.priority-1 {
background-color: #bb0404;
}
.priority-2 {
background-color: #ce7808;
}
.call-bottom-info > span {
padding-right: 0.5vh;
}
.call-attach:hover {
background-color: #1caa28;
}
.Set-Waypoint:hover {
background-color: #f18f1e;
}
.call-detach:hover {
background-color: #950909;
}
.remove-blip:hover {
background-color: #950909;
}
.dispatch-attached-units {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.active-unit-item:hover {
background-color: var(--color-3);
}
.active-calls-item:hover {
background-color: var(--color-3);
}
.dispatch-attached-units-container {
background-color: var(--color-1);
width: 92vh;
height: 46vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 1;
border: 2px solid #FFFFFF;
display: none;
margin-top: 32.5vh;
}
.dispatch-attached-units-title {
background-color: var(--color-4);
color: white;
font-size: 20px;
font-weight: bolder;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
width: 95%;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
user-select: none;
}
.dispatch-attached-units-holder {
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
overflow: auto;
height: 37.8vh;
display: flex;
flex-direction: column;
width: 95%;
}
.dispatch-attached-unit-item {
padding: 10px;
height: 3vh;
background-color: var(--color-5);
display: flex;
align-items: center;
margin-bottom: 5px;
}
.attached-units:hover {
background-color: rgb(156, 156, 156);
}
.Set-Dispatch-Waypoint:hover {
background-color: #f18f1e;
}
.call-dispatch-detach:hover {
background-color: #950909;
}
.incidents-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 0px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 80%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.incidents-title:hover {
background-color: var(--color-3);
}
.incidents-search-refresh {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: var(--color-10);
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
}
.incidents-search-refresh:hover {
background-color: #aa891c;
}
.respond-calls {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
margin-top: 32.5vh;
}
.respond-calls-container {
background-color: var(--color-5);
width: 70vh;
min-height: 30vh;
max-height: 40vh;
margin: auto;
display: flex;
flex-direction: column;
z-index: 9998;
overflow: auto;
}
.respond-calls-title {
background-color: var(--color-4);
color: white;
font-size: 20px;
font-weight: bolder;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
width: 95%;
margin: auto;
margin-top: 15px;
margin-bottom: 0px;
user-select: none;
}
.respond-calls-input {
width: 92.5%;
margin-top: 10px;
margin-bottom: 10px;
outline: solid 3px var(--color-4);
margin-left: 27px;
min-height: 21.5vh;
max-height: 21.5vh;
border: none;
padding: 10px 10px;
background-color: transparent;
color: #dadada;
resize: none;
font-size: 16px;
}
.respond-calls-input:focus {
outline: solid 3px var(--color-4);
}
.respond-calls-responses {
width: 95%;
margin-left: 1.7vh
}
.respond-calls-response {
color: #dadada;
margin-top: 0.5vh;
padding: 0.5vh;
background-color: rgba(32, 32, 32, 0.5);
color: #FFFFFF;
}
.offenses-search-area {
width: 95%;
border: 2px solid var(--color-4);
height: 3vh;
margin: 1.5vh auto 0vh;
display: flex;
}
.offenses-search {
background: transparent;
border: none;
outline: none;
font-size: 1.2vh;
color: rgb(255, 255, 255);
font-family: Roboto, sans-serif;
font-style: normal;
font-weight: normal;
margin-left: 1vh;
padding-top: 10px;
padding-bottom: 10px;
}
.impound-form {
display: flex;
flex-direction: column;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 750px;
height: 375px;
background: var(--color-5);
border: 1px solid white;
}
.impound-form > form {
position: absolute;
left: 10%;
width: 73%;
height: 100%;
}
.impound-form > form > input {
border: none;
outline: none;
font-size: 24px;
color: white;
background: transparent;
border: 1px solid rgb(168, 168, 168);
width: 100%;
height: 13.5%;
margin-top: 20px;
padding-left: 10%;
}
.impound-form > form > i {
position: absolute;
color: white;
font-size: 24px;
margin-top: 37.5px;
margin-left: 12.6px;
}
.impound-buttons {
position: absolute;
margin: auto;
display: flex;
flex-direction: row;
bottom: 6%;
left: 10%;
}
.impound-cancel {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #D77A0D;
border-radius: 1vh;
margin: auto;
user-select: none;
}
.impound-cancel:hover {
background-color: #f18f1e;
}
.impound-submit {
color: white;
padding: .5vh;
padding-left: 1vh;
padding-right: 1vh;
background-color: #0B9509;
border-radius: 1vh;
margin: auto;
user-select: none;
margin-left: 10px;
}
.impound-submit:hover {
background-color: #15ac12;
}
.status-impound:hover {
background-color: #ac8312;
}
.remove-impound:hover {
background-color: #ac1212;
}
.impound-vehicle:hover {
background-color: #12ac1f;
}
.impound-fee {
color: white;
}
.dispatch-reply:hover {
background-color: var(--color-1);
}
.display_hidden{
display: none;
}
.cams-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
overflow: auto
}
.cams-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 100%;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
overflow: auto;
}
.cams-item {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-auto-flow: row;
gap: 15px 15px;
overflow: auto;
margin-bottom: 10px;
}
.cams-items {
background-color: var(--color-5);
height: auto;
padding: 10px;
text-align: center;
margin: 10px;
color: white;
font-size: 20px;
color: white;
overflow: visible;
}
.cams-image {
height:125px;
width: auto;
margin: 10px;
}
.cams-items:hover {
background-color: var(--color-3);
}
.weapons-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50%;
margin-top: 10px;
margin-left: 10px;
}
.weapons-search-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.weapons-search-title:hover {
background-color: var(--color-3);
}
.weapons-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#weapons-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#weapons-search-input::placeholder {
color: white;
}
.weapons-items {
display: flex;
flex-direction: column;
overflow: auto;
margin: auto;
margin-top: 10px;
width: 95%;
height: 100%;
margin-bottom: 15px;
}
.weapon-information-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 50%;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
}
.weapon-information-new {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #8f1b1b;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.weapon-information-new:hover {
background-color: #aa1c1c;
}
.weapon-information-save {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #1b8f25;
margin: auto;
margin-left: 5px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.weapon-information-save:hover {
background-color: #1caa28;
}
.weapon-information-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 0px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-right: 0px;
width: 81%;
/* width: 66%; */
align-items: center;
user-select: none;
}
.weapon-info-stuff {
display: flex;
flex-direction: row;
width: 95%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
}
.weapon-info-image {
width: 444px;
height: 269px;
object-fit: cover;
}
.weapon-info-imageurl {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-imageurl-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.weapon-info-inner-container {
display: flex;
flex-direction: column;
width: 55%;
}
.weapon-info-serial {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-serial-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.weapon-info-icon {
color: white;
font-size: 16px;
margin-left: 10px
}
.weapon-info-line {
background-color: var(--color-3);
height: 2px;
margin-left: 10px;
margin-bottom: 10px;
}
.weapon-info-model {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-model-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.weapon-info-owner {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-owner-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.weapon-info-class {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-class-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
width: 80%;
}
.weapon-info-imageurl {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.weapon-info-imageurl-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
.weapon-info-content {
width: 93%;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
border: none;
outline: none;
min-height: 30.9vh;
resize: none;
background-color: var(--color-5);
color: white;
font-size: 16px;
padding: 10px;
}
.weapons-item-title {
font-size: 16px;
font-weight: lighter;
color: white;
padding-top: 2px;
}
.weapons-image {
width: 7vh;
height: 7vh;
margin-left: 10px;
margin-top: auto;
margin-bottom: auto;
object-fit: cover;
}
.weapons-item-title {
font-size: 16px;
font-weight: lighter;
color: white;
padding-top: 2px;
}
.weapons-bottom-info {
display: flex;
margin: auto;
width: 100%;
}
.weapons-id {
color: white;
font-size: 13px;
}
.weapons-item {
background-color: var(--color-5);
width: 100%;
height: 9vh;
margin: auto;
margin-bottom: 10px;
margin-top: 0px;
display: flex;
user-select: none;
}
.weapons-item:hover {
background-color: var(--color-3);
}
.weapons-image {
width: 7vh;
height: 7vh;
margin-left: 10px;
margin-top: auto;
margin-bottom: auto;
object-fit: cover;
}
.weapons-item-title {
font-size: 16px;
font-weight: lighter;
color: white;
padding-top: 2px;
}
.vehicle-info-points {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
margin-top: 5px;
}
input[type="range"].vehicle-info-points-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 5px;
color: white;
width: 80%;
}
input[type="range"].vehicle-info-points-input::-moz-range-thumb {
box-shadow: none;
border: 2px solid grey;
height: 16px;
width: 16px;
border-radius: 16px;
background: white;
}
input[type="range"].vehicle-info-points-input::-moz-range-track {
width: 100%;
height: 2px;
box-shadow: none;
background: var(--color-8);
border-radius: 0px;
border: 0px;
}
.manage-profile-apartment {
color: white;
margin-left: 10px;
font-size: 15px;
user-select: none;
}
.manage-profile-apartment-input {
border: none;
outline: none;
margin-left: 2.5px;
font-size: 16px;
margin-top: 2px;
color: white;
background-color: rgba(0, 0, 0, 0);
}
/* Charges Hover */
.ccontextmenu {
position: absolute;
width: fit-content;
padding: 2px;
margin: 0;
border: 1px solid var(--color-3);
background: var(--color-5);
z-index: 100;
border-radius: 3px;
box-shadow: 1px 1px 4px rgba(0,0,0,.2);
opacity: 0;
transform: translate(0, 15px) scale(.95);
transition: transform 0.1s ease-out, opacity 0.1s ease-out;
pointer-events: none;
}
.ccontextmenu-item {
display: block;
position: relative;
margin: 0;
padding: 0;
/* white-space: nowrap; */
max-width: 34ch;
word-wrap:break-word;
}
.ccontextmenu-text {
display: block;
color: white;
font-size: 13px;
cursor: pointer;
border: 1px solid transparent;
/* white-space: nowrap; */
padding: 6px 8px;
border-radius: 3px;
max-width: 34ch;
word-wrap:break-word;
}
.ccontextmenu-text {
outline: 0 none;
text-decoration: none;
}
.ccontextmenu-text .fa {
position: absolute;
left: 8px;
top: 50%;
transform: translateY(-50%);
}
.ccontextmenu-item-disabled {
opacity: .5;
pointer-events: none;
}
.ccontextmenu-item-disabled .ccontextmenu-text {
cursor: default;
}
.ccontextmenu-item-submenu::after {
content: "";
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
border: 5px solid transparent;
border-left-color: #808080;
}
.ccontextmenu-item-submenu:hover::after {
border-left-color: #fff;
}
.ccontextmenu-show,
.ccontextmenu-item:hover > .ccontextmenu {
opacity: 1;
transform: translate(0, 0) scale(1);
pointer-events: auto;
z-index: 9999;
}
.map-page-container {
background-color: var(--color-9);
border-radius: 15px;
position: absolute;
width: 96.5%;
height: 96.5%;
left: 2.0%;
top: 1.5%;
display: none;
}
.calls-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 30%;
margin-top: 10px;
margin-left: 10px;
}
.calls-search-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
}
.calls-search-title:hover {
background-color: var(--color-3);
}
.calls-search-input {
background-color: var(--color-3);
color: white;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
width: 95%;
align-items: center;
user-select: none;
display: none;
}
#calls-search-input {
outline: none;
border: none;
width: 95%;
color: white;
font-size: 15px;
background-color: rgba(0, 0, 0, 0);
margin: auto;
}
#calls-search-input::placeholder {
color: white;
}
.map-container {
background-color: var(--color-1);
border: 2px solid var(--color-3);
display: flex;
flex-direction: column;
height: 80.7vh;
width: 70%;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
}
.map-clear {
width: 13.7%;
font-size: 15px;
font-weight: lighter;
padding-top: 7px;
padding-bottom: 7px;
background-color: #8f1b1b;
margin: auto;
margin-left: 5px;
margin-right: 10px;
margin-top: 10px;
margin-bottom: 0px;
color: white;
text-align: center;
user-select: none;
display: block;
}
.map-clear:hover {
background-color: #aa1c1c;
}
.map-title {
background-color: var(--color-4);
color: white;
font-size: 18px;
font-weight: bolder;
padding-top: 5px;
padding-bottom: 5px;
text-align: center;
margin: auto;
margin-top: 10px;
margin-bottom: 0px;
margin-left: 10px;
margin-right: 5px;
width: 98%;
align-items: center;
user-select: none;
}
.map-item {
border: 2px solid var(--color-3);
position: absolute;
width: 58%;
height: 88.5%;
left: 40.6%;
top: 8%;
margin-bottom: 15px;
}
.leaflet-marker-pane {
z-index: 600;
}
.leaflet-tooltip-pane {
z-index: 650;
}
.leaflet-tooltip-right {
margin-left: 6px;
}