body {
  background-color: rgb(var(--high-soft-color));
}
body.light {
  --primary-color: 9, 132, 227;
  --primary-color-dark: 6, 112, 194;
  --primary-color-h: #0984E3;
  --secondary-color: 229, 0, 2;
  --main-bg-color: 247, 247, 247;
  --main-txt-color: 51,51,51;
  --soft-txt-color: 60,60,60;
  --high-contrast-color: 255, 255, 255;
  --high-soft-color: 250, 250, 250;
  --medium-color: 85, 85, 85;
  --softer-color: 102, 102, 102;
  --bg-color-1: 240, 240, 240;
  --bg-color-2: 225, 225, 225;
  --black-color: 0,0,0;
  --checkbox-bg: 238,238,238;
  --checkbox-color: 153,153,153;
  --checkbox-hover: 204, 204, 204;
  --cancel-btn-color: 236, 240, 241;
  --opcii-color: 221,221,221;
  --pozicija-light: #ACE9DD;
  --pozicija-dark: #16a186;
  --pozicija-darker: #099479;
  --nasoki-light:#ecc1fd;
  --nasoki-dark: #DD86FF;
  --nasoki-darker: #D079F2;
  --istorija-light: #BAE1FF;
  --istorija-dark: #53a6f5;
  --istorija-darker: #4699E8;
  --izvestai-light: #EFE5D9;
  --izvestai-dark: #c99e6b;
  --izvestai-darker: #BC915E;
  --adresi-light: #ECD4D6;
  --adresi-dark: #D49DA1;
  --adresi-darker: #C79094;
  --opcii-light: #8DC2D1;
  --opcii-dark: #8cc3d1;
  --opcii-darker: #7FB6C4;
  --fakturi-light: #86ffb2;
  --fakturi-dark: #4a9666;
  --backup-light: #FDABAB;
  --backup-dark: #bf6767;
}
body.dark {
  --primary-color: 9, 95, 161;
  --primary-color-dark: 15, 115, 191;
  --secondary-color: 229, 0, 2;
  --main-bg-color: 48, 48, 48;
  --main-txt-color: 247, 247, 247;
  --soft-txt-color: 244, 244, 244;
  --high-contrast-color: 30, 30, 30;
  --high-soft-color: 35, 35, 35;
  --medium-color: 170, 170, 170;
  --softer-color: 153, 153, 153;
  --bg-color-1: 34, 34, 34;
  --bg-color-2: 25, 25, 25;
  --black-color: 255,255,255;
  --checkbox-bg: 18,18,18;
  --checkbox-color: 102,102,102;
  --checkbox-hover: 46,46,46;
  --cancel-btn-color: 52, 53, 54;
  --opcii-color: 29,29,29;
}
body * {
  color: rgb(var(--main-txt-color));
}

/*/////////------RESPONSIVE------///////// */
.b-1px-solid {
  border-width: 1px;
  border-style: solid;
}

.b-2px-solid {
  border-width: 2px;
  border-style: solid;
}

.b-3px-solid {
  border-width: 3px;
  border-style: solid;
}

.b-4px-solid {
  border-width: 4px;
  border-style: solid;
}

.b-5px-solid {
  border-width: 5px;
  border-style: solid;
}

.b-6px-solid {
  border-width: 6px;
  border-style: solid;
}

.b-7px-solid {
  border-width: 7px;
  border-style: solid;
}

.b-8px-solid {
  border-width: 8px;
  border-style: solid;
}

.b-9px-solid {
  border-width: 9px;
  border-style: solid;
}

.b-10px-solid {
  border-width: 10px;
  border-style: solid;
}

.b-1px-secondary {
  border-width: 1px;
  border-style: solid;
}

.b-2px-secondary {
  border-width: 2px;
  border-style: solid;
}

.b-3px-secondary {
  border-width: 3px;
  border-style: solid;
}

.b-4px-secondary {
  border-width: 4px;
  border-style: solid;
}

.b-5px-secondary {
  border-width: 5px;
  border-style: solid;
}

.b-6px-secondary {
  border-width: 6px;
  border-style: solid;
}

.b-7px-secondary {
  border-width: 7px;
  border-style: solid;
}

.b-8px-secondary {
  border-width: 8px;
  border-style: solid;
}

.b-9px-secondary {
  border-width: 9px;
  border-style: solid;
}

.b-10px-secondary {
  border-width: 10px;
  border-style: solid;
}

.bt-1px-solid {
  border-top-width: 1px;
  border-top-style: solid;
}

.bt-2px-solid {
  border-top-width: 2px;
  border-top-style: solid;
}

.bt-3px-solid {
  border-top-width: 3px;
  border-top-style: solid;
}

.bt-4px-solid {
  border-top-width: 4px;
  border-top-style: solid;
}

.bt-5px-solid {
  border-top-width: 5px;
  border-top-style: solid;
}

.bt-6px-solid {
  border-top-width: 6px;
  border-top-style: solid;
}

.bt-7px-solid {
  border-top-width: 7px;
  border-top-style: solid;
}

.bt-8px-solid {
  border-width: 8px;
  border-top-style: solid;
}

.bt-9px-solid {
  border-top-width: 9px;
  border-top-style: solid;
}

.bt-10px-solid {
  border-top-width: 10px;
  border-top-style: solid;
}

.bb-1px-solid {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

.bb-2px-solid {
  border-bottom-width: 2px;
  border-bottom-style: solid;
}

.bb-3px-solid {
  border-bottom-width: 3px;
  border-bottom-style: solid;
}

.bb-4px-solid {
  border-bottom-width: 4px;
  border-bottom-style: solid;
}

.bb-5px-solid {
  border-bottom-width: 5px;
  border-bottom-style: solid;
}

.bb-6px-solid {
  border-bottom-width: 6px;
  border-bottom-style: solid;
}

.bb-7px-solid {
  border-bottom-width: 7px;
  border-bottom-style: solid;
}

.bb-8px-solid {
  border-bottomth: 8px;
  border-bottom-style: solid;
}

.bb-9px-solid {
  border-bottom-width: 9px;
  border-bottom-style: solid;
}

.bb-10px-solid {
  border-bottom-width: 10px;
  border-bottom-style: solid;
}

.bl-1px-solid {
  border-left-width: 1px;
  border-left-style: solid;
}

.bl-2px-solid {
  border-left-width: 2px;
  border-left-style: solid;
}

.bl-3px-solid {
  border-left-width: 3px;
  border-left-style: solid;
}

.bl-4px-solid {
  border-left-width: 4px;
  border-left-style: solid;
}

.bl-5px-solid {
  border-left-width: 5px;
  border-left-style: solid;
}

.bl-6px-solid {
  border-left-width: 6px;
  border-left-style: solid;
}

.bl-7px-solid {
  border-left-width: 7px;
  border-left-style: solid;
}

.bl-8px-solid {
  border-leftth: 8px;
  border-left-style: solid;
}

.bl-9px-solid {
  border-left-width: 9px;
  border-left-style: solid;
}

.bl-10px-solid {
  border-left-width: 10px;
  border-left-style: solid;
}

.br-1px-solid {
  border-right-width: 1px;
  border-right-style: solid;
}

.br-2px-solid {
  border-right-width: 2px;
  border-right-style: solid;
}

.br-3px-solid {
  border-right-width: 3px;
  border-right-style: solid;
}

.br-4px-solid {
  border-right-width: 4px;
  border-right-style: solid;
}

.br-5px-solid {
  border-right-width: 5px;
  border-right-style: solid;
}

.br-6px-solid {
  border-right-width: 6px;
  border-right-style: solid;
}

.br-7px-solid {
  border-right-width: 7px;
  border-right-style: solid;
}

.br-8px-solid {
  border-right: 8px;
  border-right-style: solid;
}

.br-9px-solid {
  border-right-width: 9px;
  border-right-style: solid;
}

.br-10px-solid {
  border-right-width: 10px;
  border-right-style: solid;
}

.b-primary {
  border-color: rgb(var(--primary-color));
}

.b-pozicija {
  border-color: var(--pozicija-light);
}

.b-istorija {
  border-color: var(--istorija-light);
}

.b-nasoki {
  border-color: var(--nasoki-light);
}

.b-adresi {
  border-color: var(--adresi-light);
}

.b-podesuvanja {
  border-color: var(--opcii-light);
}

.b-light {
  border-color: #ccc;
}

.b-lighter {
  border-color: #f1f1f1;
}

.hover-b-primary:focus {
  border-color: var(--primary-color);
}

.hover-b-primary:hover {
  border-color: var(--primary-color);
}

.b-primary-light {
  border-color: rgba(9, 132, 227, 0.5);
}

.b-primary-lighter {
  border-color: rgba(9, 132, 227, 0.2);
}

.b-secondary {
  border-color: #e50002;
}

.b-secondary-light {
  border-color: rgba(229, 0, 2, 0.5);
}

.b-secondary-lighter {
  border-color: rgba(229, 0, 2, 0.2);
}

.b-lightGrey {
  border-color: #666;
}

.b-lightGrey-light {
  border-color: rgba(102, 102, 102, 0.5);
}

.b-lightGrey-lighter {
  border-color: rgba(var(--softer-color), 0.15);
}

.b-darkGrey {
  border-color: #222;
}

.b-555 {
  border-color: #555;
}

.b-dark {
  border-color: #333;
}

.b-black {
  border-color: #000;
}

.b-white {
  border-color: #fff;
}

.b-facebook {
  border-color: #4267b2;
}

.b-instagram {
  border-color: #d20065;
}

.b-twitter {
  border-color: #60AADE;
}

.b-youtube {
  border-color: #f70000;
}

.b-transparent {
  border-color: transparent;
}

.bb-color-primary {
  border-bottom-color: var(--primary-color);
}

.bb-color-lights {
  border-bottom-color: #fafafa !important;
}

.bb-color-ccc {
  border-bottom-color: #ccc !important;
}

.bb-color-555 {
  border-bottom-color: #555;
}

.radius-50 {
  border-radius: 50%;
}

.radius-40 {
  border-radius: 40%;
}

.radius-30 {
  border-radius: 30%;
}

.radius-20 {
  border-radius: 20%;
}

.radius-10 {
  border-radius: 10%;
}

.radius-5 {
  border-radius: 5%;
}

.radius-1px {
  border-radius: 1px;
}

.radius-2px {
  border-radius: 2px;
}

.radius-3px {
  border-radius: 3px;
}

.radius-4px {
  border-radius: 4px;
}

.radius-5px {
  border-radius: 5px;
}

.radius-10px {
  border-radius: 10px;
}

.radius-halfRem {
  border-radius: 0.5rem;
}

.radius-1rem {
  border-radius: 1rem;
}

.radius-2rem {
  border-radius: 2rem;
}

.primary-btn {
  background-color: rgb(var(--primary-color));
  color: #fff;
  border-radius: 0.3rem;
  padding-top: 8px;
  padding-bottom: 8px;
}
.primary-btn:hover {
  background-color: #054b81;
}

.primary-outline-btn {
  background-color: transparent;
  border: 1px solid #0984E3;
  color: #222;
}

.secondary-btn {
  background-color: #e50002;
  color: #fff;
}

.secondary-outline-btn {
  background-color: transparent;
  border: 1px solid #e50002;
  color: #222;
}

.hover-effect {
  position: relative;
}
.hover-effect:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.5rem;
  background-color: #0984E3;
  transition: none;
  transform-origin: bottom;
  transform: scaleY(0);
  z-index: -1;
}
.hover-effect:hover {
  color: #fff;
  z-index: 2;
}
.hover-effect:hover:before {
  transform: scaleY(1);
  transform-origin: bottom;
  transition: 0.4s all;
}

.hover-effect-reverse {
  position: relative;
}
.hover-effect-reverse:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0984E3;
  transition: none;
  transform-origin: top;
  transform: scaleY(0);
  z-index: -1;
}
.hover-effect-reverse:hover {
  color: #fff;
  z-index: 2;
}
.hover-effect-reverse:hover:before {
  transform: scaleY(1);
  transform-origin: top;
  transition: 0.4s all;
}

.button-hover-effect-left {
  position: relative;
}
.button-hover-effect-left:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: 0.4s all;
  background-color: #B4EAE5;
  transform-origin: left;
  transform: scaleX(0);
  z-index: -1;
}
.button-hover-effect-left:hover:before {
  transform: scaleX(1);
  transform-origin: right;
  transition: 0.4s all;
}

.button-hover-effect-left-reverse {
  position: relative;
}
.button-hover-effect-left-reverse:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: 0.4s all;
  background-color: #0984E3;
  transform-origin: left;
  transform: scaleX(0);
  z-index: -1;
}
.button-hover-effect-left-reverse:hover:before {
  transform: scaleX(1);
  transform-origin: right;
  transition: 0.4s all;
}

.container-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
}

.container {
  width: 1200px;
}

@media screen and (max-width: 1240px) {
  .container {
    width: 1000px;
  }
}
@media screen and (max-width: 1000px) {
  .container {
    max-width: 95%;
    width: 95%;
  }
}
@media screen and (max-width: 780px) {
  .container {
    width: 92%;
    max-width: 92%;
  }
}
.d-block {
  display: block;
}

.d-inline {
  display: inline;
}

.f-left {
  float: left;
}

.f-right {
  float: right;
}

.f-none {
  float: none;
}

.d-flex-req {
  display: flex !important;
}

.flex-center {
  justify-content: center;
  align-items: center;
}

.flex-1 {
  flex: 1;
}

.d-flex {
  display: flex;
}
.d-flex.flex-column {
  flex-direction: column;
}
.d-flex.flex-wrap {
  flex-wrap: wrap;
}
.d-flex.col-reverse {
  flex-flow: column-reverse;
}
.d-flex.row-reverse {
  flex-flow: row-reverse;
}
.d-flex.justify-start {
  justify-content: flex-start;
}
.d-flex.justify-center {
  justify-content: center;
}
.d-flex.justify-end {
  justify-content: flex-end;
}
.d-flex.justify-between {
  justify-content: space-between;
}
.d-flex.justify-around {
  justify-content: space-around;
}
.d-flex.justify-evenly {
  justify-content: space-evenly;
}
.d-flex.align-start {
  align-items: flex-start;
}
.d-flex.align-center {
  align-items: center;
}
.d-flex.align-end {
  align-items: flex-end;
}
.d-flex.align-between {
  justify-content: space-between;
}
.d-flex.align-around {
  justify-content: space-around;
}

.d-none {
  display: none;
}

.v-hidden {
  visibility: hidden;
}

.v-visible {
  visibility: visible;
}

.d-grid {
  display: grid;
}
.d-grid .col-1-2 {
  grid-column: 1/3;
}
.d-grid.justify-center {
  justify-content: center;
}
.d-grid.justify-start {
  justify-content: flex-start;
}
.d-grid.justify-end {
  justify-content: flex-end;
}
.d-grid.justify-between {
  justify-content: space-between;
}
.d-grid.justify-around {
  justify-content: space-around;
}
.d-grid.align-center {
  align-items: center;
}
.d-grid.align-start {
  align-items: flex-start;
}
.d-grid.align-end {
  align-items: flex-end;
}
.d-grid.align-between {
  align-items: space-between;
}
.d-grid.align-around {
  align-items: space-around;
}

.flex-center {
  justify-content: center;
  align-items: center;
}

.f-weight-100 {
  font-weight: 100;
}

.f-weight-200 {
  font-weight: 200;
}

.f-weight-300 {
  font-weight: 300;
}

.f-weight-400 {
  font-weight: 400;
}

.f-weight-500 {
  font-weight: 500;
}

.f-weight-600 {
  font-weight: 600;
}

.f-weight-700 {
  font-weight: 700;
}

.f-weight-800 {
  font-weight: 800;
}

.f-weight-900 {
  font-weight: 900;
}

.f-size-1 {
  font-size: 0.0625rem;
}

.f-size-2 {
  font-size: 0.125rem;
}

.f-size-3 {
  font-size: 0.1875rem;
}

.f-size-4 {
  font-size: 0.25rem;
}

.f-size-5 {
  font-size: 0.3125rem;
}

.f-size-6 {
  font-size: 0.375rem;
}

.f-size-7 {
  font-size: 0.4375rem;
}

.f-size-8 {
  font-size: 0.5rem;
}

.f-size-9 {
  font-size: 0.5625rem;
}

.f-size-10 {
  font-size: 0.625rem;
}

.f-size-11 {
  font-size: 0.6875rem;
}

.f-size-12 {
  font-size: 0.75rem;
}

.f-size-13 {
  font-size: 0.8125rem;
}

.f-size-14 {
  font-size: 0.875rem;
}

.f-size-15 {
  font-size: 0.9375rem;
}

.f-size-16 {
  font-size: 1rem;
}

.f-size-17 {
  font-size: 1.0625rem;
}

.f-size-18 {
  font-size: 1.125rem;
}

.f-size-19 {
  font-size: 1.1875rem;
}

.f-size-20 {
  font-size: 1.25rem;
}

.f-size-21 {
  font-size: 1.3125rem;
}

.f-size-22 {
  font-size: 1.375rem;
}

.f-size-23 {
  font-size: 1.4375rem;
}

.f-size-24 {
  font-size: 1.5rem;
}

.f-size-25 {
  font-size: 1.5625rem;
}

.f-size-26 {
  font-size: 1.625rem;
}

.f-size-27 {
  font-size: 1.6875rem;
}

.f-size-28 {
  font-size: 1.75rem;
}

.f-size-29 {
  font-size: 1.8125rem;
}

.f-size-30 {
  font-size: 1.875rem;
}

.f-size-31 {
  font-size: 1.9375rem;
}

.f-size-32 {
  font-size: 2rem;
}

.f-size-33 {
  font-size: 2.0625rem;
}

.f-size-34 {
  font-size: 2.125rem;
}

.f-size-35 {
  font-size: 2.1875rem;
}

.f-size-36 {
  font-size: 2.25rem;
}

.f-size-37 {
  font-size: 2.3125rem;
}

.f-size-38 {
  font-size: 2.375rem;
}

.f-size-39 {
  font-size: 2.4375rem;
}

.f-size-40 {
  font-size: 2.5rem;
}

.f-size-41 {
  font-size: 2.5625rem;
}

.f-size-42 {
  font-size: 2.625rem;
}

.f-size-43 {
  font-size: 2.6875rem;
}

.f-size-44 {
  font-size: 2.75rem;
}

.f-size-45 {
  font-size: 2.8125rem;
}

.f-size-46 {
  font-size: 2.875rem;
}

.f-size-47 {
  font-size: 2.9375rem;
}

.f-size-48 {
  font-size: 3rem;
}

.f-size-49 {
  font-size: 3.0625rem;
}

.f-size-50 {
  font-size: 3.125rem;
}

.family-primary {
  font-family: "Gilroy", sans-serif;
}

.family-secondary {
  font-family: "Montserrat", sans-serif;
}

.family-third {
  font-family: "Roboto Slab", serif;
}

.family-fourth {
  font-family: "Nunito", sans-serif;
}

.m-0 {
  margin: 0;
}

.m-1 {
  margin: 1%;
}

.m-2 {
  margin: 2%;
}

.m-3 {
  margin: 3%;
}

.m-4 {
  margin: 4%;
}

.m-5 {
  margin: 5%;
}

.m-1px {
  margin: 1px;
}

.m-2px {
  margin: 2px;
}

.m-3px {
  margin: 3px;
}

.m-4px {
  margin: 4px;
}

.m-5px {
  margin: 5px;
}

.m-6px {
  margin: 6px;
}

.m-7px {
  margin: 7px;
}

.m-8px {
  margin: 8px;
}

.m-9px {
  margin: 9px;
}

.m-10px {
  margin: 10px;
}

.mt-auto {
  margin-top: auto;
}

.mb-auto {
  margin-bottom: auto;
}

.mx-auto {
  margin: 0 auto;
}

.mx-0 {
  margin-left: 0;
  margin-right: 0;
}

.mx-1 {
  margin-left: 1%;
  margin-right: 1%;
}

.mx-2 {
  margin-left: 2%;
  margin-right: 2%;
}

.mx-3 {
  margin-left: 3%;
  margin-right: 3%;
}

.mx-4 {
  margin-left: 4%;
  margin-right: 4%;
}

.mx-5 {
  margin-left: 5%;
  margin-right: 5%;
}

.mx-1px {
  margin-left: 1px;
  margin-right: 1px;
}

.mx-2px {
  margin-left: 2px;
  margin-right: 2px;
}

.mx-3px {
  margin-left: 3px;
  margin-right: 3px;
}

.mx-4px {
  margin-left: 4px;
  margin-right: 4px;
}

.mx-5px {
  margin-left: 5px;
  margin-right: 5px;
}

.mx-6px {
  margin-left: 6px;
  margin-right: 6px;
}

.mx-7px {
  margin-left: 7px;
  margin-right: 7px;
}

.mx-8px {
  margin-left: 8px;
  margin-right: 8px;
}

.mx-9px {
  margin-left: 9px;
  margin-right: 9px;
}

.mx-10px {
  margin-left: 10px;
  margin-right: 10px;
}

.mx-15px {
  margin-left: 15px;
  margin-right: 15px;
}

.mx-20px {
  margin-left: 20px;
  margin-right: 20px;
}

.mx-25px {
  margin-left: 25px;
  margin-right: 25px;
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.my-1 {
  margin-top: 1%;
  margin-bottom: 1%;
}

.my-2 {
  margin-top: 2%;
  margin-bottom: 2%;
}

.my-3 {
  margin-top: 3%;
  margin-bottom: 3%;
}

.my-4 {
  margin-top: 4%;
  margin-bottom: 4%;
}

.my-5 {
  margin-top: 5%;
  margin-bottom: 5%;
}

.my-1px {
  margin-top: 1px;
  margin-bottom: 1px;
}

.my-2px {
  margin-top: 2px;
  margin-bottom: 2px;
}

.my-3px {
  margin-top: 3px;
  margin-bottom: 3px;
}

.my-4px {
  margin-top: 4px;
  margin-bottom: 4px;
}

.my-5px {
  margin-top: 5px;
  margin-bottom: 5px;
}

.my-6px {
  margin-top: 6px;
  margin-bottom: 6px;
}

.my-7px {
  margin-top: 7px;
  margin-bottom: 7px;
}

.my-8px {
  margin-top: 8px;
  margin-bottom: 8px;
}

.my-9px {
  margin-top: 9px;
  margin-bottom: 9px;
}

.my-10px {
  margin-top: 10px;
  margin-bottom: 10px;
}

.my-12px {
  margin-top: 12px;
  margin-bottom: 12px;
}

.my-15px {
  margin-top: 15px;
  margin-bottom: 15px;
}

.my-25px {
  margin-top: 25px;
  margin-bottom: 25px;
}

.ml-0 {
  margin-left: 0;
}

.ml-1 {
  margin-left: 1%;
}

.ml-2 {
  margin-left: 2%;
}

.ml-3 {
  margin-left: 3%;
}

.ml-4 {
  margin-left: 4%;
}

.ml-5 {
  margin-left: 5%;
}

.ml-1px {
  margin-left: 1px;
}

.ml-2px {
  margin-left: 2px;
}

.ml-3px {
  margin-left: 3px;
}

.ml-4px {
  margin-left: 4px;
}

.ml-5px {
  margin-left: 5px;
}

.ml-6px {
  margin-left: 6px;
}

.ml-7px {
  margin-left: 7px;
}

.ml-8px {
  margin-left: 8px;
}

.ml-9px {
  margin-left: 9px;
}

.ml-10px {
  margin-left: 10px;
}

.ml-15px {
  margin-left: 15px;
}

.ml-20px {
  margin-left: 20px;
}

.ml-25px {
  margin-left: 25px;
}

.mr-0 {
  margin-right: 0;
}

.mr-1 {
  margin-right: 1%;
}

.mr-2 {
  margin-right: 2%;
}

.mr-3 {
  margin-right: 3%;
}

.mr-4 {
  margin-right: 4%;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

.mt-0 {
  margin-top: 0;
}

.mt-1 {
  margin-top: 1%;
}

.mt-2 {
  margin-top: 2%;
}

.mt-3 {
  margin-top: 3%;
}

.mt-4 {
  margin-top: 4%;
}

.mt-5 {
  margin-top: 5%;
}

.mt-6 {
  margin-top: 6%;
}

.mt-1px {
  margin-top: 1px;
}

.mt-2px {
  margin-top: 2px;
}

.mt-3px {
  margin-top: 3px;
}

.mt-4px {
  margin-top: 4px;
}

.mt-5px {
  margin-top: 5px;
}

.mt-6px {
  margin-top: 6px;
}

.mt-7px {
  margin-top: 7px;
}

.mt-8px {
  margin-top: 8px;
}

.mt-9px {
  margin-top: 9px;
}

.mt-10px {
  margin-top: 10px;
}

.mt-12px {
  margin-top: 12px;
}

.mt-15px {
  margin-top: 15px;
}

.mt-20px {
  margin-top: 20px;
}

.mt-25px {
  margin-top: 25px;
}

.mt-30px {
  margin-top: 30px;
}

.mt-50px {
  margin-top: 50px;
}

.mb-0 {
  margin-bottom: 0;
}

.mb-1 {
  margin-bottom: 1%;
}

.mb-2 {
  margin-bottom: 2%;
}

.mb-3 {
  margin-bottom: 3%;
}

.mb-4 {
  margin-bottom: 4%;
}

.mb-5 {
  margin-bottom: 5%;
}

.mb-1px {
  margin-bottom: 1px;
}

.mb-2px {
  margin-bottom: 2px;
}

.mb-3px {
  margin-bottom: 3px;
}

.mb-4px {
  margin-bottom: 4px;
}

.mb-5px {
  margin-bottom: 5px;
}

.mb-6px {
  margin-bottom: 6px;
}

.mb-7px {
  margin-bottom: 7px;
}

.mb-8px {
  margin-bottom: 8px;
}

.mb-9px {
  margin-bottom: 9px;
}

.mb-10px {
  margin-bottom: 10px;
}

.mb-12px {
  margin-bottom: 12px;
}

.mb-15px {
  margin-bottom: 15px;
}

.mb-20px {
  margin-bottom: 20px;
}

.mb-50px {
  margin-bottom: 50px;
}

.px-2 {
  padding-left: 2%;
  padding-right: 2%;
}

.p-1px {
  padding: 1px;
}

.p-2px {
  padding: 2px;
}

.p-3px {
  padding: 3px;
}

.p-4px {
  padding: 4px;
}

.p-5px {
  padding: 5px;
}

.p-6px {
  padding: 6px;
}

.p-7px {
  padding: 7px;
}

.p-8px {
  padding: 8px;
}

.p-9px {
  padding: 9px;
}

.p-10px {
  padding: 10px;
}

.p-11px {
  padding: 11px;
}

.p-12px {
  padding: 12px;
}

.p-13px {
  padding: 13px;
}

.p-14px {
  padding: 14px;
}

.p-15px {
  padding: 15px;
}

.p-16px {
  padding: 16px;
}

.p-17px {
  padding: 17px;
}

.p-18px {
  padding: 18px;
}

.p-19px {
  padding: 19px;
}

.p-20px {
  padding: 20px;
}

.px-1px {
  padding-left: 1px;
  padding-right: 1px;
}

.px-2px {
  padding-left: 2px;
  padding-right: 2px;
}

.px-3px {
  padding-left: 3px;
  padding-right: 3px;
}

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

.px-5px {
  padding-left: 5px;
  padding-right: 5px;
}

.px-6px {
  padding-left: 6px;
  padding-right: 6px;
}

.px-7px {
  padding-left: 7px;
  padding-right: 7px;
}

.px-8px {
  padding-left: 8px;
  padding-right: 8px;
}

.px-9px {
  padding-left: 9px;
  padding-right: 9px;
}

.px-10px {
  padding-left: 10px;
  padding-right: 10px;
}

.px-11px {
  padding-left: 11px;
  padding-right: 11px;
}

.px-12px {
  padding-left: 12px;
  padding-right: 12px;
}

.px-13px {
  padding-left: 13px;
  padding-right: 13px;
}

.px-14px {
  padding-left: 14px;
  padding-right: 14px;
}

.px-15px {
  padding-left: 15px;
  padding-right: 15px;
}

.px-16px {
  padding-left: 16px;
  padding-right: 16px;
}

.px-17px {
  padding-left: 17px;
  padding-right: 17px;
}

.px-18px {
  padding-left: 18px;
  padding-right: 18px;
}

.px-19px {
  padding-left: 19px;
  padding-right: 19px;
}

.px-20px {
  padding-left: 20px;
  padding-right: 20px;
}

.px-21px {
  padding-left: 21px;
  padding-right: 21px;
}

.px-22px {
  padding-left: 22px;
  padding-right: 22px;
}

.px-23px {
  padding-left: 23px;
  padding-right: 23px;
}

.px-24px {
  padding-left: 24px;
  padding-right: 24px;
}

.px-25px {
  padding-left: 25px;
  padding-right: 25px;
}

.px-26px {
  padding-left: 26px;
  padding-right: 26px;
}

.px-27px {
  padding-left: 27px;
  padding-right: 27px;
}

.px-28px {
  padding-left: 28px;
  padding-right: 28px;
}

.px-29px {
  padding-left: 29px;
  padding-right: 29px;
}

.px-30px {
  padding-left: 30px;
  padding-right: 30px;
}

.py-1px {
  padding-top: 1px;
  padding-bottom: 1px;
}

.py-2px {
  padding-top: 2px;
  padding-bottom: 2px;
}

.py-3px {
  padding-top: 3px;
  padding-bottom: 3px;
}

.py-4px {
  padding-top: 4px;
  padding-bottom: 4px;
}

.py-5px {
  padding-top: 5px;
  padding-bottom: 5px;
}

.py-6px {
  padding-top: 6px;
  padding-bottom: 6px;
}

.py-7px {
  padding-top: 7px;
  padding-bottom: 7px;
}

.py-8px {
  padding-top: 8px;
  padding-bottom: 8px;
}

.py-9px {
  padding-top: 9px;
  padding-bottom: 9px;
}

.py-10px {
  padding-top: 10px;
  padding-bottom: 10px;
}

.py-11px {
  padding-top: 11px;
  padding-bottom: 11px;
}

.py-12px {
  padding-top: 12px;
  padding-bottom: 12px;
}

.py-13px {
  padding-top: 13px;
  padding-bottom: 13px;
}

.py-14px {
  padding-top: 14px;
  padding-bottom: 14px;
}

.py-15px {
  padding-top: 15px;
  padding-bottom: 15px;
}

.py-16px {
  padding-top: 16px;
  padding-bottom: 16px;
}

.py-17px {
  padding-top: 17px;
  padding-bottom: 17px;
}

.py-18px {
  padding-top: 18px;
  padding-bottom: 18px;
}

.py-19px {
  padding-top: 19px;
  padding-bottom: 19px;
}

.py-20px {
  padding-top: 20px;
  padding-bottom: 20px;
}

.pl-1px {
  padding-left: 1px;
}

.pl-2px {
  padding-left: 2px;
}

.pl-3px {
  padding-left: 3px;
}

.pl-4px {
  padding-left: 4px;
}

.pl-5px {
  padding-left: 5px;
}

.pl-6px {
  padding-left: 6px;
}

.pl-7px {
  padding-left: 7px;
}

.pl-8px {
  padding-left: 8px;
}

.pl-9px {
  padding-left: 9px;
}

.pl-10px {
  padding-left: 10px;
}

.pl-11px {
  padding-left: 11px;
}

.pl-12px {
  padding-left: 12px;
}

.pl-13px {
  padding-left: 13px;
}

.pl-14px {
  padding-left: 14px;
}

.pl-15px {
  padding-left: 15px;
}

.pl-16px {
  padding-left: 16px;
}

.pl-17px {
  padding-left: 17px;
}

.pl-18px {
  padding-left: 18px;
}

.pl-19px {
  padding-left: 19px;
}

.pl-20px {
  padding-left: 20px;
}

.pr-1px {
  padding-right: 1px;
}

.pr-2px {
  padding-right: 2px;
}

.pr-3px {
  padding-right: 3px;
}

.pr-4px {
  padding-right: 4px;
}

.pr-5px {
  padding-right: 5px;
}

.pr-6px {
  padding-right: 6px;
}

.pr-7px {
  padding-right: 7px;
}

.pr-8px {
  padding-right: 8px;
}

.pr-9px {
  padding-right: 9px;
}

.pr-10px {
  padding-right: 10px;
}

.pr-11px {
  padding-right: 11px;
}

.pr-12px {
  padding-right: 12px;
}

.pr-13px {
  padding-right: 13px;
}

.pr-14px {
  padding-right: 14px;
}

.pr-15px {
  padding-right: 15px;
}

.pr-16px {
  padding-right: 16px;
}

.pr-17px {
  padding-right: 17px;
}

.pr-18px {
  padding-right: 18px;
}

.pr-19px {
  padding-right: 19px;
}

.pr-20px {
  padding-right: 20px;
}

.pt-1px {
  padding-top: 1px;
}

.pt-2px {
  padding-top: 2px;
}

.pt-3px {
  padding-top: 3px;
}

.pt-4px {
  padding-top: 4px;
}

.pt-5px {
  padding-top: 5px;
}

.pt-6px {
  padding-top: 6px;
}

.pt-7px {
  padding-top: 7px;
}

.pt-8px {
  padding-top: 8px;
}

.pt-9px {
  padding-top: 9px;
}

.pt-10px {
  padding-top: 10px;
}

.pt-11px {
  padding-top: 11px;
}

.pt-12px {
  padding-top: 12px;
}

.pt-13px {
  padding-top: 13px;
}

.pt-14px {
  padding-top: 14px;
}

.pt-15px {
  padding-top: 15px;
}

.pt-16px {
  padding-top: 16px;
}

.pt-17px {
  padding-top: 17px;
}

.pt-18px {
  padding-top: 18px;
}

.pt-19px {
  padding-top: 19px;
}

.pt-20px {
  padding-top: 20px;
}

.pb-1px {
  padding-bottom: 1px;
}

.pb-2px {
  padding-bottom: 2px;
}

.pb-3px {
  padding-bottom: 3px;
}

.pb-4px {
  padding-bottom: 4px;
}

.pb-5px {
  padding-bottom: 5px;
}

.pb-6px {
  padding-bottom: 6px;
}

.pb-7px {
  padding-bottom: 7px;
}

.pb-8px {
  padding-bottom: 8px;
}

.pb-9px {
  padding-bottom: 9px;
}

.pb-10px {
  padding-bottom: 10px;
}

.pb-11px {
  padding-bottom: 11px;
}

.pb-12px {
  padding-bottom: 12px;
}

.pb-13px {
  padding-bottom: 13px;
}

.pb-14px {
  padding-bottom: 14px;
}

.pb-15px {
  padding-bottom: 15px;
}

.pb-16px {
  padding-bottom: 16px;
}

.pb-17px {
  padding-bottom: 17px;
}

.pb-18px {
  padding-bottom: 18px;
}

.pb-19px {
  padding-bottom: 19px;
}

.pb-20px {
  padding-bottom: 20px;
}

.py-60px {
  padding-top: 60px;
  padding-bottom: 60px;
}

.py-50px {
  padding-top: 50px;
  padding-bottom: 50px;
}

.py-45px {
  padding-top: 45px;
  padding-bottom: 45px;
}

.py-40px {
  padding-top: 40px;
  padding-bottom: 40px;
}

.py-30px {
  padding-top: 30px;
  padding-bottom: 30px;
}

.pt-40px {
  padding-top: 40px;
}

.pb-50px {
  padding-bottom: 50px;
}

.pb-45px {
  padding-bottom: 45px;
}

.px-21px {
  padding-left: 21px;
  padding-right: 21px;
}

.px-24px {
  padding-left: 24px;
  padding-right: 24px;
}

.px-30px {
  padding-left: 30px;
  padding-right: 30px;
}

.w-10 {
  width: 10%;
}

.h-10 {
  height: 10%;
}

.w-20 {
  width: 20%;
}

.h-20 {
  height: 20%;
}

.w-30 {
  width: 30%;
}

.h-30 {
  height: 30%;
}

.w-40 {
  width: 40%;
}

.h-40 {
  height: 40%;
}

.w-50 {
  width: 50%;
}

.h-50 {
  height: 50%;
}

.w-60 {
  width: 60%;
}

.h-60 {
  height: 60%;
}

.w-70 {
  width: 70%;
}

.h-70 {
  height: 70%;
}

.w-80 {
  width: 80%;
}

.h-80 {
  height: 80%;
}

.w-90 {
  width: 90%;
}

.h-90 {
  height: 90%;
}

.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.w-110 {
  width: 110%;
}

.h-110 {
  height: 110%;
}

.w-px-1 {
  width: 1px;
}

.w-px-2 {
  width: 2px;
}

.w-px-3 {
  width: 3px;
}

.w-px-4 {
  width: 4px;
}

.w-px-5 {
  width: 5px;
}

.w-px-6 {
  width: 6px;
}

.w-px-7 {
  width: 7px;
}

.w-px-8 {
  width: 8px;
}

.w-px-9 {
  width: 9px;
}

.w-px-10 {
  width: 10px;
}

.w-px-11 {
  width: 11px;
}

.w-px-12 {
  width: 12px;
}

.w-px-13 {
  width: 13px;
}

.w-px-14 {
  width: 14px;
}

.w-px-15 {
  width: 15px;
}

.w-px-16 {
  width: 16px;
}

.w-px-17 {
  width: 17px;
}

.w-px-18 {
  width: 18px;
}

.w-px-19 {
  width: 19px;
}

.w-px-20 {
  width: 20px;
}

.w-px-21 {
  width: 21px;
}

.w-px-22 {
  width: 22px;
}

.w-px-23 {
  width: 23px;
}

.w-px-24 {
  width: 24px;
}

.w-px-25 {
  width: 25px;
}

.w-px-26 {
  width: 26px;
}

.w-px-27 {
  width: 27px;
}

.w-px-28 {
  width: 28px;
}

.w-px-29 {
  width: 29px;
}

.w-px-30 {
  width: 30px;
}

.w-px-31 {
  width: 31px;
}

.w-px-32 {
  width: 32px;
}

.h-px-1 {
  height: 1px;
}

.h-px-2 {
  height: 2px;
}

.h-px-3 {
  height: 3px;
}

.h-px-4 {
  height: 4px;
}

.h-px-5 {
  height: 5px;
}

.h-px-6 {
  height: 6px;
}

.h-px-7 {
  height: 7px;
}

.h-px-8 {
  height: 8px;
}

.h-px-9 {
  height: 9px;
}

.h-px-10 {
  height: 10px;
}

.h-px-11 {
  height: 11px;
}

.h-px-12 {
  height: 12px;
}

.h-px-13 {
  height: 13px;
}

.h-px-14 {
  height: 14px;
}

.h-px-15 {
  height: 15px;
}

.h-px-16 {
  height: 16px;
}

.h-px-17 {
  height: 17px;
}

.h-px-18 {
  height: 18px;
}

.h-px-19 {
  height: 19px;
}

.h-px-20 {
  height: 20px;
}

.h-px-21 {
  height: 21px;
}

.h-px-22 {
  height: 22px;
}

.h-px-23 {
  height: 23px;
}

.h-px-24 {
  height: 24px;
}

.h-px-25 {
  height: 25px;
}

.h-px-26 {
  height: 26px;
}

.h-px-27 {
  height: 27px;
}

.h-px-28 {
  height: 28px;
}

.h-px-29 {
  height: 29px;
}

.h-px-30 {
  height: 30px;
}

.h-px-31 {
  height: 31px;
}

.h-px-32 {
  height: 32px;
}

.h-px-33 {
  height: 33px;
}

.h-px-34 {
  height: 34px;
}

.h-px-35 {
  height: 35px;
}

.h-px-36 {
  height: 36px;
}

.h-px-37 {
  height: 37px;
}

.h-px-38 {
  height: 38px;
}

.h-px-39 {
  height: 39px;
}

.h-px-40 {
  height: 40px;
}

.h-px-41 {
  height: 41px;
}

.h-px-42 {
  height: 42px;
}

.h-px-43 {
  height: 43px;
}

.h-px-44 {
  height: 44px;
}

.h-px-45 {
  height: 45px;
}

.h-px-46 {
  height: 46px;
}

.h-px-47 {
  height: 47px;
}

.h-px-48 {
  height: 48px;
}

.h-px-49 {
  height: 49px;
}

.h-px-50 {
  height: 50px;
}

.h-px-51 {
  height: 51px;
}

.h-px-52 {
  height: 52px;
}

.h-px-53 {
  height: 53px;
}

.h-px-54 {
  height: 54px;
}

.h-px-55 {
  height: 55px;
}

.h-px-56 {
  height: 56px;
}

.h-px-57 {
  height: 57px;
}

.h-px-58 {
  height: 58px;
}

.h-px-59 {
  height: 59px;
}

.h-px-60 {
  height: 60px;
}

.h-px-61 {
  height: 61px;
}

.h-px-62 {
  height: 62px;
}

.h-px-63 {
  height: 63px;
}

.h-px-64 {
  height: 64px;
}

.w-px-40 {
  width: 40px;
}

.w-px-35 {
  width: 35px;
}

.w-px-36 {
  width: 36px;
}

.w-px-96 {
  width: 96px;
}

.w-px-160 {
  width: 160px;
}

.w-px-43 {
  width: 43px;
}

.w-px-250 {
  width: 250px;
}

.w-px-300 {
  width: 300px;
}

.h-px-300 {
  height: 300px;
}

.h-px-150 {
  height: 150px;
}

.col-1-3 {
  grid-column: 1/4;
}

.col-w-1 {
  width: 8.333%;
}

.col-w-2 {
  width: 16.667%;
}

.col-w-3 {
  width: 25%;
}

.col-w-4 {
  width: 33.333%;
}

.col-w-5 {
  width: 41.666%;
}

.col-w-6 {
  width: 50%;
}

.col-w-7 {
  width: 58.333%;
}

.col-w-8 {
  width: 66.667%;
}

.col-w-9 {
  width: 75%;
}

.col-w-10 {
  width: 83.333%;
}

.col-w-11 {
  width: 91.666%;
}

.col-w-12 {
  width: 100%;
}

@media screen and (max-width: 1366px) {
  .col-w-mdd-1 {
    width: 8.333%;
  }
  .col-w-mdd-2 {
    width: 16.667%;
  }
  .col-w-mdd-3 {
    width: 25%;
  }
  .col-w-mdd-4 {
    width: 33.333%;
  }
  .col-w-mdd-5 {
    width: 41.666%;
  }
  .col-w-mdd-6 {
    width: 50%;
  }
  .col-w-mdd-7 {
    width: 58.333%;
  }
  .col-w-mdd-8 {
    width: 66.667%;
  }
  .col-w-mdd-9 {
    width: 75%;
  }
  .col-w-mdd-10 {
    width: 83.333%;
  }
  .col-w-mdd-11 {
    width: 91.666%;
  }
  .col-w-mdd-12 {
    width: 100%;
  }
}
@media screen and (max-width: 1024px) {
  .col-w-smd-1 {
    width: 8.333%;
  }
  .col-w-smd-2 {
    width: 16.667%;
  }
  .col-w-smd-3 {
    width: 25%;
  }
  .col-w-smd-4 {
    width: 33.333%;
  }
  .col-w-smd-5 {
    width: 41.666%;
  }
  .col-w-smd-6 {
    width: 50%;
  }
  .col-w-smd-7 {
    width: 58.333%;
  }
  .col-w-smd-8 {
    width: 66.667%;
  }
  .col-w-smd-9 {
    width: 75%;
  }
  .col-w-smd-10 {
    width: 83.333%;
  }
  .col-w-smd-11 {
    width: 91.666%;
  }
  .col-w-smd-12 {
    width: 100%;
  }
}
@media screen and (max-width: 992px) {
  .col-w-lgt-1 {
    width: 8.333%;
  }
  .col-w-lgt-2 {
    width: 16.667%;
  }
  .col-w-lgt-3 {
    width: 25%;
  }
  .col-w-lgt-4 {
    width: 33.333%;
  }
  .col-w-lgt-5 {
    width: 41.666%;
  }
  .col-w-lgt-6 {
    width: 50%;
  }
  .col-w-lgt-7 {
    width: 58.333%;
  }
  .col-w-lgt-8 {
    width: 66.667%;
  }
  .col-w-lgt-9 {
    width: 75%;
  }
  .col-w-lgt-10 {
    width: 83.333%;
  }
  .col-w-lgt-11 {
    width: 91.666%;
  }
  .col-w-lgt-12 {
    width: 100%;
  }
}
@media screen and (max-width: 780px) {
  .col-w-mdt-1 {
    width: 8.333%;
  }
  .col-w-mdt-2 {
    width: 16.667%;
  }
  .col-w-mdt-3 {
    width: 25%;
  }
  .col-w-mdt-4 {
    width: 33.333%;
  }
  .col-w-mdt-5 {
    width: 41.666%;
  }
  .col-w-mdt-6 {
    width: 50%;
  }
  .col-w-mdt-7 {
    width: 58.333%;
  }
  .col-w-mdt-8 {
    width: 66.667%;
  }
  .col-w-mdt-9 {
    width: 75%;
  }
  .col-w-mdt-10 {
    width: 83.333%;
  }
  .col-w-mdt-11 {
    width: 91.666%;
  }
  .col-w-mdt-12 {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .col-w-mb-1 {
    width: 8.333%;
  }
  .col-w-mb-2 {
    width: 16.667%;
  }
  .col-w-mbt-3 {
    width: 25%;
  }
  .col-w-mb-4 {
    width: 33.333%;
  }
  .col-w-mbt-5 {
    width: 41.666%;
  }
  .col-w-mb-6 {
    width: 50%;
  }
  .col-w-mb-7 {
    width: 58.333%;
  }
  .col-w-mbt-8 {
    width: 66.667%;
  }
  .col-w-mb-9 {
    width: 75%;
  }
  .col-w-mbt-10 {
    width: 83.333%;
  }
  .col-w-mb-11 {
    width: 91.666%;
  }
  .col-w-mb-12 {
    width: 100%;
  }
}
.col-1 {
  grid-template-columns: repeat(1, 1fr);
}

.col-2 {
  grid-template-columns: repeat(2, 1fr);
}

.col-3 {
  grid-template-columns: repeat(3, 1fr);
}

.col-4 {
  grid-template-columns: repeat(4, 1fr);
}

.col-5 {
  grid-template-columns: repeat(5, 1fr);
}

.col-6 {
  grid-template-columns: repeat(6, 1fr);
}

.col-7 {
  grid-template-columns: repeat(7, 1fr);
}

.col-8 {
  grid-template-columns: repeat(8, 1fr);
}

.col-9 {
  grid-template-columns: repeat(9, 1fr);
}

.col-10 {
  grid-template-columns: repeat(10, 1fr);
}

.col-11 {
  grid-template-columns: repeat(11, 1fr);
}

.col-12 {
  grid-template-columns: repeat(12, 1fr);
}

@media screen and (max-width: 1366px) {
  .col-mdd-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .col-mdd-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .col-mdd-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .col-mdd-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .col-mdd-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .col-mdd-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .col-mdd-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .col-mdd-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .col-mdd-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .col-mdd-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .col-mdd-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .col-mdd-12 {
    grid-template-columns: repeat(12, 1fr);
  }
}
@media screen and (max-width: 1024px) {
  .col-smd-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .col-smd-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .col-smd-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .col-smd-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .col-smd-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .col-smd-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .col-smd-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .col-smd-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .col-smd-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .col-smd-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .col-smd-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .col-smd-12 {
    grid-template-columns: repeat(12, 1fr);
  }
}
@media screen and (max-width: 992px) {
  .col-lgt-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .col-lgt-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .col-lgt-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .col-lgt-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .col-lgt-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .col-lgt-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .col-lgt-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .col-lgt-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .col-lgt-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .col-lgt-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .col-lgt-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .col-lgt-12 {
    grid-template-columns: repeat(12, 1fr);
  }
}
@media screen and (max-width: 780px) {
  .col-md-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .col-md-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .col-md-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .col-md-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .col-md-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .col-md-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .col-md-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .col-md-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .col-md-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .col-md-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .col-md-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .col-md-12 {
    grid-template-columns: repeat(12, 1fr);
  }
}
@media screen and (max-width: 480px) {
  .col-mb-1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .col-mb-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .col-mb-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .col-mb-4 {
    grid-template-columns: repeat(4, 1fr);
  }
  .col-mb-5 {
    grid-template-columns: repeat(5, 1fr);
  }
  .col-mb-6 {
    grid-template-columns: repeat(6, 1fr);
  }
  .col-mb-7 {
    grid-template-columns: repeat(7, 1fr);
  }
  .col-mb-8 {
    grid-template-columns: repeat(8, 1fr);
  }
  .col-mb-9 {
    grid-template-columns: repeat(9, 1fr);
  }
  .col-mb-10 {
    grid-template-columns: repeat(10, 1fr);
  }
  .col-mb-11 {
    grid-template-columns: repeat(11, 1fr);
  }
  .col-mb-12 {
    grid-template-columns: repeat(12, 1fr);
  }
}
.grid-gap-1 {
  grid-gap: 1px;
}

.grid-gap-2 {
  grid-gap: 2px;
}

.grid-gap-3 {
  grid-gap: 3px;
}

.grid-gap-4 {
  grid-gap: 4px;
}

.grid-gap-5 {
  grid-gap: 5px;
}

.grid-gap-6 {
  grid-gap: 6px;
}

.grid-gap-7 {
  grid-gap: 7px;
}

.grid-gap-8 {
  grid-gap: 8px;
}

.grid-gap-9 {
  grid-gap: 9px;
}

.grid-gap-10 {
  grid-gap: 10px;
}

.grid-gap-11 {
  grid-gap: 11px;
}

.grid-gap-12 {
  grid-gap: 12px;
}

.grid-gap-13 {
  grid-gap: 13px;
}

.grid-gap-14 {
  grid-gap: 14px;
}

.grid-gap-15 {
  grid-gap: 15px;
}

.grid-gap-16 {
  grid-gap: 16px;
}

.grid-gap-17 {
  grid-gap: 17px;
}

.grid-gap-18 {
  grid-gap: 18px;
}

.grid-gap-19 {
  grid-gap: 19px;
}

.grid-gap-20 {
  grid-gap: 20px;
}

.grid-gap-21 {
  grid-gap: 21px;
}

.grid-gap-22 {
  grid-gap: 22px;
}

.grid-gap-23 {
  grid-gap: 23px;
}

.grid-gap-24 {
  grid-gap: 24px;
}

.grid-gap-25 {
  grid-gap: 25px;
}

.grid-gap-26 {
  grid-gap: 26px;
}

.grid-gap-27 {
  grid-gap: 27px;
}

.grid-gap-28 {
  grid-gap: 28px;
}

.grid-gap-29 {
  grid-gap: 29px;
}

.grid-gap-30 {
  grid-gap: 30px;
}

.grid-gap-31 {
  grid-gap: 31px;
}

.grid-gap-32 {
  grid-gap: 32px;
}

.grid-gap-33 {
  grid-gap: 33px;
}

.grid-gap-34 {
  grid-gap: 34px;
}

.grid-gap-35 {
  grid-gap: 35px;
}

.grid-gap-36 {
  grid-gap: 36px;
}

.grid-gap-37 {
  grid-gap: 37px;
}

.grid-gap-38 {
  grid-gap: 38px;
}

.grid-gap-39 {
  grid-gap: 39px;
}

.grid-gap-40 {
  grid-gap: 40px;
}

.grid-gap-41 {
  grid-gap: 41px;
}

.grid-gap-42 {
  grid-gap: 42px;
}

.grid-gap-43 {
  grid-gap: 43px;
}

.grid-gap-44 {
  grid-gap: 44px;
}

.grid-gap-45 {
  grid-gap: 45px;
}

.grid-gap-46 {
  grid-gap: 46px;
}

.grid-gap-47 {
  grid-gap: 47px;
}

.grid-gap-48 {
  grid-gap: 48px;
}

.grid-gap-49 {
  grid-gap: 49px;
}

.grid-gap-50 {
  grid-gap: 50px;
}

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

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

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

.text-primary-dark {
  color: #0876ca;
}

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

.text-uppercase {
  text-transform: uppercase;
}

.text-lowercase {
  text-transform: lowercase;
}

.text-pozicija {
  color: var(--pozicija-dark);
}

.text-capitalize {
  text-transform: capitalize;
}

.decoration-none {
  text-decoration: none;
}

.text-linkedin {
  color: #0274B3;
}

.text-primary {
  color: #141521;
}

.text-secondary {
  color: #fafafa;
}

.text-white {
  color: #fff;
}

.text-light {
  color: #fdfdfd;
}

.text-yellow {
  color: #f1c40f;
}

.text-ddd {
  color: #ddd;
}

.text-black {
  color: var(--high-contrast-color);
}

.text-dark-primary {
  color: #bcc3c9;
}

.text-dark {
  color: rgb(var(--main-txt-color));
}

.text-red {
  color: #ee5253;
}

.text-facebook {
  color: #4267b2;
}

.text-instagram {
  color: #d20065;
}

.text-twitter {
  color: #60AADE;
}

.text-youtube {
  color: #f70000;
}

.text-b6 {
  color: #b6b6b6;
}

.text-pr-light {
  color: #fa2135 !important;
}

.text-555 {
  color: rgb(var(--softer-color));
}

.text-333 {
  color: rgb(var(--text-color-3));
}

.text-111 {
  color: rgb(var(--main-txt-color));
}

.text-primary-col {
  color: #0984E3;
}

.text-secondary-col {
  color: #e50002;
}

.text-third-col {
  color: #737373;
}

.text-fourth-col {
  color: #B4EAE5;
}

.hover-text-primary:hover {
  color: #0984E3;
}

.title {
  position: relative;
  display: inline-block;
  color: #0984E3;
}
.title::after {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  margin: 0 auto;
  width: 50%;
  height: 2px;
  background: #333;
  content: "";
}

.bg-primary {
  background-color: rgb(var(--primary-color));
}

.bg-primary-light {
  background-color: #299df6;
}

.bg-secondary {
  background-color: var(--secondary-color);
}

.bg-yellow {
  background-color: #f1c40f;
}

.bg-youtube {
  background-color: #f70000;
}

.bg-third {
  background-color: #737373;
}

.bg-primary-dark {
  background-color: #0767b2;
}

.bg-secondary-dark {
  background-color: #cc0002;
}

.bg-fourth {
  background-color: #B4EAE5;
}

.bg-333 {
  background-color: #333;
}

.bg-555 {
  background-color: #555;
}

.bg-lightGrey-lighter {
  background-color: rgba(102, 102, 102, 0.2);
}

.hover-bg-primary:hover {
  background-color: #0984E3;
}

.bg-dark {
  background-color: rgb(var(--medium-color));
}

.bg-darker {
  background-color: rgb(var(--soft-txt-color));
}

.bg-transparent {
  background-color: transparent;
}

.bg-dark-tran {
  background-color: rgba(51, 51, 51, 0.8);
}

.bg-dark-light {
  background-color: rgba(51, 51, 51, 0.5);
}

.bg-darker {
  background-color: #0D0D0D;
}

.bg-dark-lighter {
  background-color: rgba(51, 51, 51, 0.3);
}

.bg-light {
  background-color: rgb(var(--bg-color-1));
}

.bg-light-1 {
  background-color: rgb(var(--bg-color-2));
}

.bg-light-darker {
  background-color: #ccc;
}

.bg-cf {
  background-color: #cfcfcf;
}

.bg-lighter {
  background-color: rgb(var(--main-bg-color));
}

.bg-light-dark {
  background-color: rgba(255, 255, 255, 0.3);
}

.bg-black {
  background-color: black !important;
}

.bg-black-light {
  background-color: rgba(0, 0, 0, 0.5);
}

.bg-black-lighter {
  background-color: rgba(0, 0, 0, 0.3);
}

.bg-white {
  background-color: rgb(var(--high-contrast-color));
}

.bg-high-soft {
  background-color: rgb(var(--high-soft-color));
}

.bg-222 {
  background-color: #222;
}

.bg-pr-text {
  background-color: #0c0c0c;
}

.bg-sc-text {
  background-color: #fafafa;
}

.bg-green {
  background-color: #10ac84;
}

.bg-purple {
  background-color: #341f97;
}

.bg-red {
  background-color: #ee5253;
}

.bg-fb {
  background-color: #4267b2;
  transition: 0.6s all;
}
.bg-fb:hover {
  background-color: rgba(66, 103, 178, 0.1);
}

.hover-bg-fb-dark:hover {
  background-color: #34518d;
}

.bg-tw {
  background-color: #60AADE;
  transition: 0.6s all;
}
.bg-tw:hover {
  background-color: #3693d5;
}

.hover-bg-tw-dark:hover {
  background-color: #3693d5;
}

.bg-insta {
  background-color: #d20065;
  transition: 0.6s all;
}
.bg-insta:hover {
  background-color: #9f004c;
}

.hover-bg-insta-dark:hover {
  background-color: #9f004c;
}

.bg-in {
  background-color: #0274B3;
  transition: 0.6s all;
}
.bg-in:hover {
  background-color: #015381;
}

.hover-bg-in-dark:hover {
  background-color: #015381;
}

.bg-444 {
  background-color: #333;
}

.bg-dark-image-4 {
  background-color: rgba(0, 0, 0, 0.4);
  background-blend-mode: darken;
}

.bg-dark-image-6 {
  background-color: rgba(0, 0, 0, 0.6);
  background-blend-mode: darken;
}

.pointer {
  cursor: pointer;
}

.transition-std {
  transition: 0.5s all;
}

.transition-none {
  transition: none !important;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.top-0 {
  top: 0;
}

.left-0 {
  left: 0;
}

.right-0 {
  right: 0;
}

.bottom-0 {
  bottom: 0;
}

.top-5 {
  top: 5%;
}

.left-5 {
  left: 5%;
}

.right-5 {
  right: 5%;
}

.bottom-5 {
  bottom: 5%;
}

.top-10 {
  top: 10%;
}

.left-10 {
  left: 10%;
}

.right-10 {
  right: 10%;
}

.bottom-10 {
  bottom: 10%;
}

.top-50 {
  top: 50%;
}

.left-50 {
  left: 50%;
}

.right-50 {
  right: 50%;
}

.bottom-50 {
  bottom: 50%;
}

.top-100 {
  top: 100%;
}

.bottom-100 {
  bottom: 100%;
}

.left-100 {
  left: 100%;
}

.right-100 {
  right: 100%;
}

.boxshadow-modal {
  box-shadow: 0 0 8px 7px rgba(85, 85, 85, 0.5);
}

.box-shadow-std {
  box-shadow: 0 0 6px 3px rgba(var(--main-txt-color), 0.2);
}

.box-shadow-light {
  box-shadow: 0 0 3px 1px rgba(var(--medium-color), 0.2);
}

.box-shadow-lg {
  box-shadow: 0 0 6px 6px rgba(var(--main-txt-color), 0.6);
}

.hover-bg-white:hover {
  background-color: white;
}

.hover-bg-primary:hover {
  background-color: #0984E3 !important;
}

.hover-bg-primary-dark:hover {
  background-color: #065999;
}

.hover-b-transparent:hover {
  border-color: transparent;
}

.hover-bg-dark:hover {
  background-color: #333;
}

.hover-opacity-1:hover {
  opacity: 1;
}

.hover-text-primary-dark:hover {
  color: #0767b2;
}

.hover-text-red:hover {
  color: #ee5253;
}

.hover-bg-secondary:hover {
  background-color: #e50002 !important;
}

.hover-bg-secondary-dark:hover {
  background-color: #b20002;
}

.focus-b-secondary:focus {
  border-color: #e50002;
}

.hover-text-white:hover {
  color: white !important;
}

.hover-text-light-dark:hover {
  color: rgb(var(--opcii-color));
}

.hover-text-primary:hover {
  color: #0984E3;
}

.hover-text-primary-lighter:hover {
  color: #299df6;
}

.hover-text-secondary:hover {
  color: #e50002;
}

.hover-bg-secondary-darker:hover {
  background-color: #b20002;
}

.hover-bg-light:hover {
  background-color: rgb(var(--opcii-color));
}

.hover-bg-lighter:hover {
  background-color: rgb(var(--high-soft-color));
}

.hover-shadow-lg:hover {
  box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.6);
}

.hover-text-facebook:hover {
  color: #4267b2 !important;
}

.hover-text-viber:hover {
  color: #7D539F !important;
}

.hover-bg-facebook:hover {
  background-color: #4267b2 !important;
}

.hover-bg-instagram:hover {
  background-color: #d20065 !important;
}

.hover-bg-twitter:hover {
  background-color: #60AADE !important;
}

.hover-bg-youtube:hover {
  background-color: #f70000;
}

.hover-bg-youtube-dark:hover {
  background-color: #de0000;
}

.hover-text-instagram:hover {
  color: #d20065;
}

.hover-text-twitter:hover {
  color: #60AADE;
}

.hover-text-linkedin:hover {
  color: #0274B3;
}

.hover-bg-linkedin:hover {
  background-color: #0274B3;
}

.hover-text-youtube:hover {
  color: #f70000;
}

.hover-b-facebook:hover {
  border-color: #4267b2;
}

.hover-b-instagram:hover {
  border-color: #d20065;
}

.hover-b-twitter:hover {
  border-color: #60AADE;
}

.hover-b-youtube:hover {
  border-color: #f70000;
}

.focus-bb-primary:focus {
  border-bottom-color: #0984E3;
}

.focus-b-primary:focus {
  border-color: rgb(var(--primary-color));
}

.focus-b-1px-solid:focus {
  border-width: 1px;
  border-style: solid;
}

.hover-b-secondary:hover {
  border-color: #e50002;
}

.z-1 {
  z-index: 1;
}

.z-2 {
  z-index: 2;
}

.z-3 {
  z-index: 3;
}

.z-4 {
  z-index: 4;
}

.z-5 {
  z-index: 5;
}

.z-6 {
  z-index: 6;
}

.z-7 {
  z-index: 7;
}

.z-8 {
  z-index: 8;
}

.z-9 {
  z-index: 9;
}

.z-10 {
  z-index: 10;
}

.opacity-1 {
  opacity: 0.1;
}

.opacity-2 {
  opacity: 0.2;
}

.opacity-3 {
  opacity: 0.3;
}

.opacity-4 {
  opacity: 0.4;
}

.opacity-5 {
  opacity: 0.5;
}

.opacity-6 {
  opacity: 0.6;
}

.opacity-7 {
  opacity: 0.7;
}

.opacity-8 {
  opacity: 0.8;
}

.opacity-9 {
  opacity: 0.9;
}

.opacity-full {
  opacity: 1;
}

.lh-1 {
  line-height: 1px;
}

.lh-2 {
  line-height: 2px;
}

.lh-3 {
  line-height: 3px;
}

.lh-4 {
  line-height: 4px;
}

.lh-5 {
  line-height: 5px;
}

.lh-6 {
  line-height: 6px;
}

.lh-7 {
  line-height: 7px;
}

.lh-8 {
  line-height: 8px;
}

.lh-9 {
  line-height: 9px;
}

.lh-10 {
  line-height: 10px;
}

.lh-11 {
  line-height: 11px;
}

.lh-12 {
  line-height: 12px;
}

.lh-13 {
  line-height: 13px;
}

.lh-14 {
  line-height: 14px;
}

.lh-15 {
  line-height: 15px;
}

.lh-16 {
  line-height: 16px;
}

.lh-17 {
  line-height: 17px;
}

.lh-18 {
  line-height: 18px;
}

.lh-19 {
  line-height: 19px;
}

.lh-20 {
  line-height: 20px;
}

.lh-21 {
  line-height: 21px;
}

.lh-22 {
  line-height: 22px;
}

.lh-23 {
  line-height: 23px;
}

.lh-24 {
  line-height: 24px;
}

.lh-25 {
  line-height: 25px;
}

.lh-26 {
  line-height: 26px;
}

.lh-27 {
  line-height: 27px;
}

.lh-28 {
  line-height: 28px;
}

.lh-29 {
  line-height: 29px;
}

.lh-30 {
  line-height: 30px;
}

.lh-31 {
  line-height: 31px;
}

.lh-32 {
  line-height: 32px;
}

.lh-33 {
  line-height: 33px;
}

.lh-34 {
  line-height: 34px;
}

.lh-35 {
  line-height: 35px;
}

.lh-36 {
  line-height: 36px;
}

.lh-37 {
  line-height: 37px;
}

.lh-38 {
  line-height: 38px;
}

.lh-39 {
  line-height: 39px;
}

.lh-40 {
  line-height: 40px;
}

.lh-41 {
  line-height: 41px;
}

.lh-42 {
  line-height: 42px;
}

.lh-43 {
  line-height: 43px;
}

.lh-44 {
  line-height: 44px;
}

.lh-45 {
  line-height: 45px;
}

.lh-46 {
  line-height: 46px;
}

.lh-47 {
  line-height: 47px;
}

.lh-48 {
  line-height: 48px;
}

.lh-49 {
  line-height: 49px;
}

.lh-50 {
  line-height: 50px;
}

.lh-51 {
  line-height: 51px;
}

.lh-52 {
  line-height: 52px;
}

.lh-53 {
  line-height: 53px;
}

.lh-54 {
  line-height: 54px;
}

.lh-55 {
  line-height: 55px;
}

.lh-56 {
  line-height: 56px;
}

.lh-57 {
  line-height: 57px;
}

.lh-58 {
  line-height: 58px;
}

.lh-59 {
  line-height: 59px;
}

.lh-60 {
  line-height: 60px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Gilroy", sans-serif;
}

html {
  max-width: 100%;
}

a {
  text-decoration: none;
  transition: 0.6s ease-in-out;
  color: rgb(var(--main-txt-color));
}

i {
  transition: 0.6s ease-in-out;
}

a i {
  transition: none !important;
}

input, option, textarea, button {
  border: none;
  outline: none;
  transition: 0.6s ease-in-out;
  font-family: "Gilroy", sans-serif;
  appearance: none !important;
  -webkit-appearance: none !important;
  border-radius: none !important;
}

textarea {
  resize: none;
}

button {
  cursor: pointer;
}

select {
  -webkit-appearance: none;
  appearance: none;
  border: none;
  outline: none;
  font-size: 16px;
}

ul {
  list-style-type: none;
}

.logo {
  cursor: pointer;
}

.fa-phone {
  transform: rotate(90deg);
}

html {
  overflow-y: scroll;
}

.gmnoprint.gm-bundled-control.gm-bundled-control-on-bottom {
  top: 19px !important;
  left: 2px !important;
  bottom: auto !important;
  right: auto !important;
}

input[type=text],
input[type=number],
textarea {
  border-radius: 4px !important;
}

.text-green {
  color: #10ac84;
}

.maf-broj {
  position: absolute;
  z-index: 10;
  right: 15px;
  bottom: 140px;
  width: 200px;
}

.call-maf:hover .maf-broj {
  display: flex !important;
}

.arrow-down {
  position: absolute;
  top: 80px;
  left: 150px;
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid rgb(var(--high-contrast-color));
}

body {
  height: 100vh;
}
body input,
body textarea,
body select {
  -moz-user-select: auto !important;
  -webkit-user-select: auto !important;
  user-select: auto !important;
}
body.sidebar-show {
  position: relative;
}
body.sidebar-show::before {
  content: "";
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.3);
  height: 100vh;
  width: 100%;
  z-index: 12;
  position: absolute;
}

* {
  -webkit-tap-highlight-color: transparent;
  tap-highlight-color: transparent;
}

_::-webkit-full-page-media,
_:future,
:root .safari-ios-padding {
  padding-bottom: 120px;
}

@media screen and (max-width: 600px) {
  .space {
    display: none;
  }
}

.c-datepicker-picker__sidebar {
  display: none !important;
}

.c-datepicker-picker__body {
  margin-left: 0px !important;
}

.c-datepicker-date-range-picker__time-header {
  display: flex !important;
  flex-direction: column !important;
}
.c-datepicker-date-range-picker__time-header .kxiconfont.icon-right {
  display: none !important;
}

input:invalid,
textarea:invalid {
  box-shadow: none !important;
}

@media screen and (max-width: 480px) {
  .mobile-full {
    width: 100%;
  }
}

.overflow-none-imp {
  overflow-y: hidden !important;
}

.loader-outer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgb(var(--main-bg-color));
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}
.loader-outer img {
  transition: 0.5s ease-in-out;
}

@-webkit-keyframes scaleUp {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
@-moz-keyframes scaleUp {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes scaleUp {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
/* *@include keyframes(background) {
* *    0% {
* *        background: white;
* *    }
* *    50% {
* *        background: lightblue;
* *    }
* *    100% {
* *        background: royalblue;
* *}
* *} */
.nav-logo {
  cursor: pointer;
}

.transform-180deg {
  transform: rotate(180deg);
}

.p-sticky-filter {
  position: sticky !important;
  top: 76px;
  left: 0;
  height: 100%;
  max-height: 100vh;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  z-index: 4 !important;
}

.full-h-t-b {
  overflow-y: scroll;
}

.p-sticky-filter-top {
  position: sticky !important;
  top: 76px;
  left: 0;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  z-index: 4 !important;
  background-color: white;
}

.select-bg {
  background-image: url("../images/icons/down-arrow.png");
  background-repeat: no-repeat;
  background-size: 12px 12px;
  background-position: calc(100% - 5px) center;
}
.select-bg:not(.w-fs) {
  font-size: 16px !important;
}
.select-bg:not(.w-pr) {
  padding-right: 50px;
}

body.dark .select-bg {
  background-image: url("../images/icons/down-arrow-white.png") !important;
}

.select-styled {
  background: rgb(var(--main-bg-color));
  border: 1px solid rgb(var(--main-txt-color));
  padding: 4px 30px 4px 8px;
  border-radius: 0.2rem;
  background-image: url("../images/icons/down-arrow.png");
  background-position: calc(100% - 8px) center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  font-weight: 500;
}
.select-styled.bg-white {
  background-color: rgb(var(--high-contrast-color));
}

.rotate-invert {
  transform: rotate(-180deg);
}

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Old versions of Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

.lightSlider.lSSlide {
  height: 100% !important;
  padding-bottom: 1% !important;
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.no-arrows::-webkit-outer-spin-button,
.no-arrows::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.no-arrows {
  -moz-appearance: textfield !important;
}

.transform-center {
  transform: translate(-50%, -50%);
}

.resp-txt {
  font-size: calc(1em + 0.5vw);
}

::selection {
  background: #0984E3;
  color: white;
  /* WebKit/Blink Browsers */
}

::-moz-selection {
  background: #0984E3;
  color: white;
  /* Gecko Browsers */
}

.bg-primary-7 {
  background-color: rgba(9, 132, 227, 0.8);
}

.bg-fourth-7 {
  background-color: rgba(180, 234, 229, 0.8);
}

.img-fit-cover {
  object-fit: cover;
}

.button-bottom-primary {
  position: relative;
  overflow: hidden;
}
.button-bottom-primary::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-origin: top;
  transform: scaleY(0);
  background-color: #0984E3;
  transition: 0.5s transform;
}
.button-bottom-primary:hover {
  border-color: #0984E3;
}
.button-bottom-primary:hover::before {
  transform: scaleY(1);
}
.button-bottom-primary:hover span {
  position: relative;
  color: white;
  z-index: 1;
}

.button-bottom-dark {
  position: relative;
  overflow: hidden;
}
.button-bottom-dark::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-origin: top;
  transform: scaleY(0);
  background-color: #333;
  transition: 0.5s transform;
}
.button-bottom-dark:hover::before {
  transform: scaleY(1);
}
.button-bottom-dark:hover span {
  position: relative;
  color: white;
  z-index: 1;
}

.divider-decor {
  position: relative;
}
.divider-decor::before {
  content: "";
  width: 36px;
  height: 1px;
  opacity: 0.6;
  background-color: #777777;
  position: absolute;
  top: 0;
  left: 0;
}
.divider-decor::after {
  content: "";
  width: 36px;
  height: 1px;
  opacity: 0.6;
  background-color: #777777;
  position: absolute;
  top: 4px;
  left: 4px;
}

ul.styled-list li {
  position: relative;
  padding-left: 25px;
}
ul.styled-list li::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-size: 18px 18px;
  background-image: url("../images/icons/send.png");
}

.fotorama__nav {
  text-align: left;
}

.input-box .imgs-wrap {
  width: 96vw !important;
  overflow-x: auto;
}
.input-box .imgs-wrap .img-wrap {
  margin-left: 4px;
  margin-right: 4px;
}

.numInputWrapper .numInput {
  -moz-user-select: initial !important;
  -webkit-user-select: initial !important;
  user-select: initial !important;
}

body .box {
  display: inline-block;
  border-radius: 3px;
  font-size: 30px;
  padding: 1em;
  position: relative;
  margin-bottom: 0.25em;
  vertical-align: top;
  transition: 0.3s color, 0.3s border, 0.3s transform, 0.3s opacity;
}
body .box:hover {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.1);
  font-size: 0;
  padding: 0;
  border-width: 3px;
  line-height: 200px;
  opacity: 1;
  transform: scale(1.2);
  z-index: 2;
}
body .box:hover [class*=loader-] {
  font-size: 70px;
  line-height: 200px;
}
body .loader-18 {
  display: inline-block;
  width: 1em;
  height: 1em;
  color: inherit;
  vertical-align: middle;
  pointer-events: none;
  position: relative;
}
body .loader-18:before, body .loader-18:after {
  content: "";
  display: block;
  position: absolute;
  border-radius: 50%;
  border: 0.1em solid transparent;
  border-bottom-color: rgb(var(--primary-color));
  top: 0;
  left: 0;
  animation: 1s loader-18 linear infinite;
}
body .loader-18:before {
  width: 1em;
  height: 1em;
}
body .loader-18:after {
  width: 0.8em;
  height: 0.8em;
  top: 0.1em;
  left: 0.1em;
  animation-direction: reverse;
}
@keyframes loader-18 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

svg.switchColor {
  fill: rgb(var(--main-txt-color)) !important;
}
svg.switchColor path {
  fill: rgb(var(--main-txt-color)) !important;
}

.sidebar svg {
  fill: rgb(var(--main-txt-color)) !important;
}
.sidebar svg path {
  fill: rgb(var(--main-txt-color)) !important;
}

body.dark .switchImg {
  filter: invert(1);
}

body.dark .gm-control-active {
  background-color: rgb(var(--high-contrast-color)) !important;
}
body.dark .gm-control-active img {
  filter: brightness(0) invert(1) !important;
}
body.dark #gRoadBtn {
  color: rgb(var(--main-txt-color)) !important;
  background-color: rgb(var(--high-contrast-color)) !important;
  box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 4px -1px !important;
}
body.dark #gSatBtn {
  color: rgb(var(--main-txt-color)) !important;
  background-color: rgb(var(--high-contrast-color)) !important;
  box-shadow: rgba(255, 255, 255, 0.3) 0px 1px 4px -1px !important;
}

.close-contentBottom {
  margin-right: -35px;
  cursor: pointer;
  background-color: var(--izvestai-dark);
  width: 35px;
  height: 50px;
  padding-right: 5px;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.4s all;
  opacity: 0.1;
}
.close-contentBottom.close-contentBottom--istorija {
  background-color: var(--istorija-dark);
  opacity: 0.5;
  z-index: 4;
}
.close-contentBottom.close-contentBottom--istorija:hover {
  background: var(--istorija-dark);
}
.close-contentBottom:hover {
  opacity: 1;
  background-color: var(--izvestai-dark);
}
.close-contentBottom span {
  color: rgb(var(--main-bg-color));
  font-size: 17px;
}

.dcTooltip {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  min-width: 123px;
  display: none;
  visibility: hidden;
  background-color: rgba(0, 0, 0, 0.65);
  border: 2px solid black;
  color: white;
  border-radius: 0.25rem;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.dcTooltip * {
  text-align: center;
  justify-content: center;
  align-items: center;
  color: white;
}
.dcTooltip.top::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid #000;
}
.dcTooltip.bottom::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #000;
}

textarea {
  background-color: rgb(var(--high-contrast-color));
}

.jconfirm-box.jconfirm-hilight-shake.jconfirm-type-green.jconfirm-type-animated {
  background-color: rgb(var(--main-bg-color));
}

.izvestuvanja-wrap {
  top: 25px;
  right: 20px;
  position: fixed;
  z-index: 9999;
}
@media screen and (max-width: 480px) {
  .izvestuvanja-wrap {
    width: 100%;
    right: 0px;
    left: 0px;
  }
}

@media screen and (max-width: 480px) {
  .izvestuvanja {
    width: 100%;
  }
}
.izvestuvanja .izvestuvanje {
  padding-top: 13px;
  padding-bottom: 13px;
  width: 400px;
  position: relative;
  z-index: 9999;
  margin-bottom: 8px;
  animation-name: scaleUp;
  animation-duration: 0.5s;
  align-items: flex-start;
}
@media screen and (max-width: 480px) {
  .izvestuvanja .izvestuvanje {
    left: 10px;
    right: 10px;
    width: calc(100% - 20px) !important;
  }
}
.izvestuvanja .izvestuvanje .izv-icon {
  width: 40px;
  height: 40px;
  margin-top: 8px;
}
@media screen and (max-width: 480px) {
  .izvestuvanja .izvestuvanje .izv-icon {
    width: 34px;
    height: 34px;
  }
}
.izvestuvanja .izvestuvanje .izv-name {
  width: calc(100% - 40px);
  padding-right: 20px;
  max-height: 300px;
  overflow-y: auto;
}
@media screen and (max-width: 480px) {
  .izvestuvanja .izvestuvanje .izv-name {
    width: calc(100% - 34px);
    padding-right: 10px;
  }
}

.call-maf {
  position: fixed;
  bottom: 75px;
  right: 20px;
  z-index: 8;
  width: 50px;
  height: 50px;
  cursor: pointer;
}

.non-exportable {
  position: relative;
  transitions: 300ms all;
}

.non-exportable:hover {
  background: #d6d6d6 !important;
}

.non-exportable span {
  display: none;
}

.non-exportable:hover span {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  background: rgb(var(--primary-color));
  padding: 4px;
  display: block;
  min-width: 120px;
  color: rgb(var(--high-contrast-color));
  border-radius: 4px;
}

.custom-check {
  width: 40px;
  height: 17px;
  background-color: rgb(var(--primary-color));
  border-radius: 0.5rem;
  position: relative;
  cursor: pointer;
}
.custom-check::before {
  content: "";
  position: absolute;
  top: 3px;
  bottom: 3px;
  left: 3px;
  right: auto !important;
  width: 9px;
  border-radius: 50%;
  height: 9px;
  border: 1px solid rgb(var(--high-contrast-color));
  transition: 0.32s ease-in-out;
}
.custom-check.checked::before {
  left: 25px;
}
.custom-check:not(.checked):not(.checkirano-3):not(.checkirano-2)::before {
  background-color: red;
}
.custom-check.checkirano-3::before {
  left: 25px;
}
.custom-check.checkirano-1::before {
  background-color: red;
}
.custom-check.checkirano-2::before {
  background-color: yellow;
  left: 15px;
}

.noUi-base, .noUi-connects {
  height: 5px !important;
}

.noUi-horizontal {
  height: 5px !important;
}

.noUi-target {
  box-shadow: none !important;
  border: 0px !important;
}

.noUi-horizontal .noUi-handle {
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.noUi-horizontal .noUi-handle::before, .noUi-horizontal .noUi-handle::after {
  display: none;
}

html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
  right: -4px;
}

.noUi-connect {
  background-color: var(--istorija-dark) !important;
}

.opacity-action {
  position: relative;
}
.opacity-action .opacity-input {
  display: none;
  position: absolute;
  top: -58px;
  right: -62px;
  padding: 4px;
  background: white;
  border: 1px solid rgb(var(--primary-color));
  border-bottom: none;
}
.opacity-action .opacity-input input {
  -webkit-appearance: auto !important;
  appearance: auto !important;
}

.fa-satellite-dish {
  transform: rotate(180deg);
}

.click-icon {
  transition: 0.32s ease-in-out;
}

.autozoom-toggler {
  position: absolute;
  left: 12px;
  width: 40px;
  height: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 2;
  top: 143px;
}
.autozoom-toggler.ops {
  top: 77px;
}
.autozoom-toggler span {
  line-height: 9px;
  padding-bottom: 4px;
}
.autozoom-toggler.on-status {
  background-color: #0C84E3;
}
.autozoom-toggler.on-status * {
  color: white;
}
.autozoom-toggler.on-status .on-auto {
  display: flex !important;
}
.autozoom-toggler.on-status .off-auto {
  display: none;
}

.info-toggler {
  position: absolute;
  left: 12px;
  width: 40px;
  height: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 2;
  top: 185px;
}
.info-toggler.ops {
  top: 77px;
}
.info-toggler span {
  line-height: 9px;
  padding-bottom: 4px;
}
.info-toggler.on-status {
  background-color: #0C84E3;
}
.info-toggler.on-status * {
  color: white;
}
.info-toggler.on-status .on-auto {
  display: flex !important;
}
.info-toggler.on-status .off-auto {
  display: none;
}

.opacity-0 {
  opacity: 0;
}

@-webkit-keyframes button-animation {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@-moz-keyframes button-animation {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes button-animation {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
/* *@include keyframes(background) {
* *    0% {
* *        background: white;
* *    }
* *    50% {
* *        background: lightblue;
* *    }
* *    100% {
* *        background: royalblue;
* *}
* *} */
@-webkit-keyframes button-animation-out {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@-moz-keyframes button-animation-out {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
@keyframes button-animation-out {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
/* *@include keyframes(background) {
* *    0% {
* *        background: white;
* *    }
* *    50% {
* *        background: lightblue;
* *    }
* *    100% {
* *        background: royalblue;
* *}
* *} */
@-webkit-keyframes rotating {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes rotating {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* *@include keyframes(background) {
* *    0% {
* *        background: white;
* *    }
* *    50% {
* *        background: lightblue;
* *    }
* *    100% {
* *        background: royalblue;
* *}
* *} */
.section-padding {
  padding-top: 90px;
  padding-bottom: 90px;
}
@media screen and (max-width: 1366px) {
  .section-padding {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding {
    padding-top: 65px;
    padding-bottom: 65px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.section-padding-sm {
  padding-top: 45px;
  padding-bottom: 45px;
}
@media screen and (max-width: 1366px) {
  .section-padding-sm {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding-sm {
    padding-top: 32.5px;
    padding-bottom: 32.5px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding-sm {
    padding-top: 25px;
    padding-bottom: 25px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding-sm {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

.section-padding-md {
  padding-top: 60px;
  padding-bottom: 60px;
}
@media screen and (max-width: 1366px) {
  .section-padding-md {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding-md {
    padding-top: 35px;
    padding-bottom: 35px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding-md {
    padding-top: 25px;
    padding-bottom: 25px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding-md {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

.section-padding-b {
  padding-bottom: 90px;
}
@media screen and (max-width: 1366px) {
  .section-padding-b {
    padding-bottom: 80px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding-b {
    padding-bottom: 65px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding-b {
    padding-bottom: 50px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding-b {
    padding-bottom: 30px;
  }
}

.section-padding-sm-y {
  padding-top: 45px;
  padding-bottom: 90px;
}

.section-padding-y {
  padding-top: 90px;
}
@media screen and (max-width: 1366px) {
  .section-padding-y {
    padding-top: 80px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding-y {
    padding-top: 65px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding-y {
    padding-top: 50px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding-y {
    padding-top: 30px;
  }
}

.section-padding-y-sm {
  padding-top: 60px;
}
@media screen and (max-width: 1366px) {
  .section-padding-y-sm {
    padding-top: 50px;
  }
}
@media screen and (max-width: 1024px) {
  .section-padding-y-sm {
    padding-top: 38px;
  }
}
@media screen and (max-width: 780px) {
  .section-padding-y-sm {
    padding-top: 30px;
  }
}
@media screen and (max-width: 480px) {
  .section-padding-y-sm {
    padding-top: 18px;
  }
}

.section-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
.section-header::before {
  content: attr(data-header);
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  width: 100%;
  opacity: 0.15;
  font-size: 5.5rem;
  font-weight: 800;
  line-height: 1.4rem;
  color: #777;
}
@media screen and (max-width: 1440px) {
  .section-header::before {
    font-size: 5rem;
  }
}
@media screen and (max-width: 1366px) {
  .section-header::before {
    font-size: 4.8rem;
  }
}
@media screen and (max-width: 1200px) {
  .section-header::before {
    font-size: 4.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .section-header::before {
    font-size: 4rem;
  }
}
@media screen and (max-width: 850px) {
  .section-header::before {
    font-size: 3.6rem;
  }
}
@media screen and (max-width: 780px) {
  .section-header::before {
    font-size: 2.8rem;
  }
}
@media screen and (max-width: 480px) {
  .section-header::before {
    font-size: 1.6rem;
  }
}
.section-header h4 {
  font-size: 2.5rem;
  text-align: center;
}
@media screen and (max-width: 1440px) {
  .section-header h4 {
    font-size: 2.2rem;
  }
}
@media screen and (max-width: 1024px) {
  .section-header h4 {
    font-size: 2rem;
  }
}
.section-header span {
  font-size: 1.1rem;
  margin-top: 1.4rem;
  font-weight: 500;
  color: var(--soft-txt-color);
  text-align: center;
  line-height: 31px;
}
@media screen and (max-width: 1024px) {
  .section-header span {
    margin-top: 1.2rem;
  }
}
@media screen and (max-width: 780px) {
  .section-header span {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 480px) {
  .section-header span {
    font-size: 1rem;
    margin-top: 0.75rem;
    line-height: 26px;
  }
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  .styled-checkbox input[type=checkbox],
.styled-checkbox input[type=radio] {
    --active: rgb(var(--primary-color));
    --active-inner: rgb(var(--high-contrast-color));
    --focus: 2px rgb(var(--primary-color));
    --border: rgb(var(--medium-color));
    --border-hover: rgb(var(--primary-color));
    --background: rgb(var(--high-contrast-color));
    --disabled: rgb(var(--high-soft-color));
    --disabled-inner: rgb(var(--bg-color-2));
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 21px;
    outline: none;
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--bc, var(--border));
    background: var(--b, var(--background));
    transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
  }
  .styled-checkbox input[type=checkbox]:after,
.styled-checkbox input[type=radio]:after {
    content: "";
    display: block;
    left: 0;
    top: 0;
    position: absolute;
    transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
  }
  .styled-checkbox input[type=checkbox]:checked,
.styled-checkbox input[type=radio]:checked {
    --b: var(--active);
    --bc: var(--active);
    --d-o: .3s;
    --d-t: .6s;
    --d-t-e: cubic-bezier(.2, .85, .32, 1.2);
  }
  .styled-checkbox input[type=checkbox]:disabled,
.styled-checkbox input[type=radio]:disabled {
    --b: var(--disabled);
    cursor: not-allowed;
    opacity: 0.9;
  }
  .styled-checkbox input[type=checkbox]:disabled:checked,
.styled-checkbox input[type=radio]:disabled:checked {
    --b: var(--disabled-inner);
    --bc: var(--border);
  }
  .styled-checkbox input[type=checkbox]:disabled + label,
.styled-checkbox input[type=radio]:disabled + label {
    cursor: not-allowed;
  }
  .styled-checkbox input[type=checkbox]:not(.switch),
.styled-checkbox input[type=radio]:not(.switch) {
    width: 21px;
  }
  .styled-checkbox input[type=checkbox]:not(.switch):after,
.styled-checkbox input[type=radio]:not(.switch):after {
    opacity: var(--o, 0);
  }
  .styled-checkbox input[type=checkbox]:not(.switch):checked,
.styled-checkbox input[type=radio]:not(.switch):checked {
    --o: 1;
  }
  .styled-checkbox input[type=checkbox] + label,
.styled-checkbox input[type=radio] + label {
    font-size: 14px;
    line-height: 22px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    margin-left: 4px;
  }
  .styled-checkbox input[type=checkbox]:not(.switch) {
    border-radius: 7px;
  }
  .styled-checkbox input[type=checkbox]:not(.switch):after {
    width: 5px;
    height: 9px;
    border: 2px solid var(--active-inner);
    border-top: 0;
    border-left: 0;
    left: 6px;
    top: 3px;
    transform: rotate(var(--r, 20deg));
  }
  .styled-checkbox input[type=checkbox]:not(.switch):checked {
    --r: 43deg;
  }
  .styled-checkbox input[type=checkbox].switch {
    width: 38px;
    border-radius: 11px;
  }
  .styled-checkbox input[type=checkbox].switch:after {
    left: 2px;
    top: 2px;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    background: var(--ab, var(--border));
    transform: translateX(var(--x, 0));
  }
  .styled-checkbox input[type=checkbox].switch:checked {
    --ab: var(--active-inner);
    --x: 17px;
  }
  .styled-checkbox input[type=checkbox].switch:disabled:not(:checked):after {
    opacity: 0.6;
  }
  .styled-checkbox input[type=radio] {
    border-radius: 50%;
  }
  .styled-checkbox input[type=radio]:after {
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--active-inner);
    opacity: 0;
    transform: scale(var(--s, 0.7));
  }
  .styled-checkbox input[type=radio]:checked {
    --s: .5;
  }
}

.onoffswitch {
  position: relative;
  width: 65px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
@media screen and (max-width: 1500px) {
  .onoffswitch {
    width: 56px !important;
  }
}

.onoffswitch-checkbox {
  display: none;
}

.onoffswitch-label {
  display: block;
  overflow: hidden;
  cursor: pointer;
  border-radius: 20px;
}

.onoffswitch-inner {
  display: block;
  width: 200%;
  margin-left: -100%;
  transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before, .onoffswitch-inner:after {
  display: block;
  float: left;
  width: 50%;
  height: 23px;
  padding: 0;
  padding-top: 1px;
  line-height: 23px;
  font-size: 12px;
  color: rgb(var(--main-txt-color));
  font-weight: 600;
  box-sizing: border-box;
}

.onoffswitch-inner::before {
  content: attr(data-on);
  padding-left: 10px;
  background-color: rgb(var(--primary-color));
  color: white;
}

.onoffswitch-inner.istorija:before {
  background-color: #53a6f5;
}

.onoffswitch-inner.kontakt:before {
  background-color: #f1c40f;
}

.onoffswitch-inner.vreme:before {
  background-color: rgb(243, 164, 51);
}

.onoffswitch-inner.izvestai:before {
  background-color: #c99e6b;
}

.onoffswitch-inner.brzina:before {
  background-color: rgb(0, 128, 0);
}

.onoffswitch-inner.senzor1:before,
.onoffswitch-inner.boja1:before {
  background-color: #007dfa;
}

.onoffswitch-inner.senzor2:before,
.onoffswitch-inner.boja2:before {
  background-color: #5fafff;
}

.onoffswitch-inner.senzor12:before {
  background-color: rgb(0, 0, 255);
}

.onoffswitch-inner.akumulator:before {
  background-color: rgb(255, 0, 0);
}

.onoffswitch-inner.gorivo:before {
  background-color: rgb(255, 0, 255);
}

.onoffswitch-inner.temp1:before {
  background-color: rgb(210, 142, 245);
}

.onoffswitch-inner.temp2:before {
  background-color: rgb(196, 120, 235);
}

.onoffswitch-inner.temperatura:before {
  background-color: rgb(128, 0, 128);
}

.onoffswitch-inner.obrtometar:before {
  background-color: #cc2f4b;
}

.onoffswitch-inner.bg-green:before {
  background-color: #008001;
}

.onoffswitch-inner.bg-red:before {
  background-color: #c0392b;
}

.onoffswitch-inner.bg-brown:before {
  background-color: #007dfa;
}

.onoffswitch-inner.bg-purple:before {
  background-color: #8e44ad;
}

.onoffswitch-inner.bg-orange:before {
  background-color: #e67e22;
}

.onoffswitch-inner.bg-black:before {
  background-color: #000;
}

.onoffswitch-inner:after {
  content: attr(data-off);
  padding-right: 10px;
  background-color: rgb(var(--checkbox-bg));
  text-align: right;
}

.onoffswitch-switch {
  display: block;
  width: 11px;
  margin: 6px;
  background: white;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 42px;
  border-radius: 20px;
  transition: all 0.3s ease-in 0s;
}
@media screen and (max-width: 1500px) {
  .onoffswitch-switch {
    right: 34px;
  }
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
  margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
  right: 0px;
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  .switch-outer input[type=checkbox],
.switch-outer input[type=radio] {
    --active: #275EFE;
    --active-inner: #fff;
    --focus: 2px rgba(39, 94, 254, .3);
    --border: #BBC1E1;
    --border-hover: #275EFE;
    --background: rgb(var(--main-bg-color));
    --disabled: #F6F8FF;
    --disabled-inner: #E1E6F9;
    -webkit-appearance: none;
    -moz-appearance: none;
    height: 21px;
    outline: none;
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 0;
    cursor: pointer;
    border: 1px solid var(--bc, var(--border));
    background: var(--b, var(--background));
    transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
  }
  .switch-outer input[type=checkbox]:after,
.switch-outer input[type=radio]:after {
    content: "";
    display: block;
    left: 0;
    top: 0;
    position: absolute;
    transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
  }
  .switch-outer input[type=checkbox]:checked,
.switch-outer input[type=radio]:checked {
    --b: var(--active);
    --bc: var(--active);
    --d-o: .3s;
    --d-t: .6s;
    --d-t-e: cubic-bezier(.2, .85, .32, 1.2);
  }
  .switch-outer input[type=checkbox]:disabled,
.switch-outer input[type=radio]:disabled {
    --b: var(--disabled);
    cursor: not-allowed;
    opacity: 0.9;
  }
  .switch-outer input[type=checkbox]:disabled:checked,
.switch-outer input[type=radio]:disabled:checked {
    --b: var(--disabled-inner);
    --bc: var(--border);
  }
  .switch-outer input[type=checkbox]:disabled + label,
.switch-outer input[type=radio]:disabled + label {
    cursor: not-allowed;
  }
  .switch-outer input[type=checkbox]:not(.switch),
.switch-outer input[type=radio]:not(.switch) {
    width: 21px;
  }
  .switch-outer input[type=checkbox]:not(.switch):after,
.switch-outer input[type=radio]:not(.switch):after {
    opacity: var(--o, 0);
  }
  .switch-outer input[type=checkbox]:not(.switch):checked,
.switch-outer input[type=radio]:not(.switch):checked {
    --o: 1;
  }
  .switch-outer input[type=checkbox] + label,
.switch-outer input[type=radio] + label {
    font-size: 14px;
    line-height: 21px;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    margin-left: 4px;
  }
  .switch-outer input[type=checkbox]:not(.switch) {
    border-radius: 7px;
  }
  .switch-outer input[type=checkbox]:not(.switch):after {
    width: 5px;
    height: 9px;
    border: 2px solid var(--active-inner);
    border-top: 0;
    border-left: 0;
    left: 7px;
    top: 4px;
    transform: rotate(var(--r, 20deg));
  }
  .switch-outer input[type=checkbox]:not(.switch):checked {
    --r: 43deg;
  }
  .switch-outer input[type=checkbox].switch {
    width: 38px;
    border-radius: 11px;
  }
  .switch-outer input[type=checkbox].switch:after {
    left: 2px;
    top: 2px;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    background: var(--ab, var(--border));
    transform: translateX(var(--x, 0));
  }
  .switch-outer input[type=checkbox].switch:checked {
    --ab: var(--active-inner);
    --x: 17px;
  }
  .switch-outer input[type=checkbox].switch:disabled:not(:checked):after {
    opacity: 0.6;
  }
  .switch-outer input[type=radio] {
    border-radius: 50%;
  }
  .switch-outer input[type=radio]:after {
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: var(--active-inner);
    opacity: 0;
    transform: scale(var(--s, 0.7));
  }
  .switch-outer input[type=radio]:checked {
    --s: .5;
  }
}

.contact-box {
  position: relative;
}
.contact-box label {
  position: absolute;
  left: 6px;
  top: 13px;
  color: #555;
  z-index: 1;
  pointer-events: none;
  transition: 0.5s all;
}
.contact-box label::before {
  content: attr(data-dodatok);
  position: absolute;
  left: 100%;
  padding-left: 5px;
}
.contact-box input,
.contact-box textarea {
  position: relative;
  z-index: 1;
}
.contact-box input:focus, .contact-box input:valid,
.contact-box textarea:focus,
.contact-box textarea:valid {
  border-color: #0767b2;
}
.contact-box input:focus ~ label, .contact-box input:valid ~ label,
.contact-box textarea:focus ~ label,
.contact-box textarea:valid ~ label {
  z-index: 2;
  top: -12px;
  background-color: white;
  color: #0767b2;
}
.contact-box input:focus ~ label.lighter, .contact-box input:valid ~ label.lighter,
.contact-box textarea:focus ~ label.lighter,
.contact-box textarea:valid ~ label.lighter {
  background-color: #fafafa;
}
.contact-box input:focus ~ label::before, .contact-box input:valid ~ label::before,
.contact-box textarea:focus ~ label::before,
.contact-box textarea:valid ~ label::before {
  display: none;
}
.contact-box textarea {
  height: 140px;
}
.contact-box button {
  position: relative;
}
.contact-box button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #0984E3;
  transform: scaleY(0);
  transition: 0.5s transform;
  transform-origin: top;
}
.contact-box button span {
  position: relative;
  z-index: 2;
}
.contact-box button:hover::before {
  transform: scaleY(1);
}
.contact-box button:hover span {
  color: white;
}
@media screen and (max-width: 800px) {
  .contact-box button.contact-btn {
    width: 100%;
  }
}
@media screen and (max-width: 800px) {
  .contact-box button.book-btn {
    width: 100%;
  }
}

.button-primary-dark {
  position: relative;
  background-color: #0984E3;
  color: rgb(252, 252, 252);
  border-radius: 4px;
  overflow: hidden;
  transition: 0.5s all;
  padding: 0.75rem 1.5rem;
}
.button-primary-dark span {
  position: relative;
  z-index: 3;
}
.button-primary-dark::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0767b2;
  z-index: 2;
  transform: translateX(-100%);
  transition: 0.6s ease-in;
  animation-name: button-animation-out;
  animation-duration: 400ms;
  animation-fill-mode: forwards;
}
.button-primary-dark::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0984E3;
  z-index: 1;
  transform: translateX(0%);
  transition: 0.6s transform;
}
.button-primary-dark:hover {
  color: white;
}
.button-primary-dark:hover::before {
  animation-name: button-animation;
  transition: 0.6s ease-in-out;
}

.button-secondary-dark {
  position: relative;
  background-color: #e50002;
  color: #333;
  border-radius: 4px;
  overflow: hidden;
  transition: 0.5s all;
  padding: 0.75rem 1.5rem;
}
.button-secondary-dark span {
  position: relative;
  z-index: 3;
}
.button-secondary-dark::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #b20002;
  z-index: 2;
  transform: translateX(-100%);
  transition: 0.6s ease-in;
  animation-name: button-animation-out;
  animation-duration: 400ms;
  animation-fill-mode: forwards;
}
.button-secondary-dark::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #e50002;
  z-index: 1;
  transform: translateX(0%);
  transition: 0.6s transform;
}
.button-secondary-dark:hover {
  color: black;
}
.button-secondary-dark:hover::before {
  animation-name: button-animation;
  transition: 0.6s ease-in-out;
}

.button-blue-black {
  position: relative;
  background-color: #e50002;
  color: rgb(252, 252, 252);
  border-radius: 4px;
  overflow: hidden;
  transition: 0.5s all;
}
.button-blue-black span {
  position: relative;
  z-index: 3;
}
.button-blue-black::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #0767b2;
  z-index: 2;
  transform: translateX(-100%);
  transition: 0.6s ease-in;
  animation-name: button-animation-out;
  animation-duration: 400ms;
  animation-fill-mode: forwards;
}
.button-blue-black::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #e50002;
  z-index: 1;
  transform: translateX(0%);
  transition: 0.6s transform;
}
.button-blue-black:hover {
  color: white;
}
.button-blue-black:hover::before {
  animation-name: button-animation;
  transition: 0.6s ease-in-out;
}

.btn-primary {
  padding: 0.75rem 1.5rem;
  background-color: #0984E3;
  font-weight: 500;
  border-radius: 0.25rem;
  color: white;
  transition: 0.5s ease-in-out;
}
.btn-primary:hover {
  background-color: #e50002;
  color: #444;
}

.btn-secondary {
  padding: 0.75rem 1.5rem;
  background-color: #e50002;
  font-weight: 500;
  border-radius: 0.25rem;
  color: #444;
  transition: 0.5s ease-in-out;
}
.btn-secondary:hover {
  background-color: #0984E3;
  color: #fff;
}

.btn-light {
  background-color: rgb(var(--cancel-btn-color));
  padding: 10px 14px;
  border-radius: 4px;
}
.btn-light:hover {
  background-color: rgb(var(--checkbox-hover));
}
.btn-light span {
  color: rgb(var(--main-txt-color));
}

.btn-primary {
  background-color: rgb(var(--primary-color));
  padding: 10px 14px;
  border-radius: 3px;
}
.btn-primary:hover {
  background-color: rgb(var(--primary-color-dark));
}
.btn-primary span {
  color: white;
}

.button-primary {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  font-weight: 600;
}
.button-primary span {
  font-weight: 600;
}
.button-primary.btn-primary-top span {
  position: relative;
  top: 2px;
}
.button-primary:hover {
  background-color: rgb(var(--primary-color-dark));
}
.button-primary.loading::before {
  content: "\f1ce";
  position: absolute;
  top: 0;
  left: 0;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: white;
  z-index: 4;
  background-color: transparent;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: rotating 1s infinite;
  font-size: 20px;
}
.button-primary.loading span {
  visibility: hidden;
}

.touch-opacity.touched {
  transition: 0.15s ease-in-out;
  background-color: rgb(var(--bg-color-2)) !important;
}
.touch-opacity.touched .veh-border__center {
  background-color: rgb(var(--bg-color-2)) !important;
}

.sidebar {
  width: 200px;
  display: flex;
  flex-direction: column;
  height: 100vh;
}
.sidebar .sidebar__link-odjava svg {
  fill: #D40000 !important;
}
.sidebar .sidebar__link-odjava svg path {
  fill: #D40000 !important;
}
.sidebar .sidebar__link-odjava svg * {
  fill: #D40000 !important;
}
.sidebar .sidebar__link {
  border: none;
}
.sidebar .sidebar__link[data-nav=nasoki].active span, .sidebar .sidebar__link[data-nav=fakturi].active span, .sidebar .sidebar__link[data-nav=pozicija].active span {
  font-weight: 600;
}
.sidebar .sidebar__link[data-nav=pozicija].active {
  background-color: rgba(var(--pozicija-light), 0.32);
  border: none;
}
.sidebar .sidebar__link[data-nav=pozicija].active .sidebar__link-icon {
  background-color: var(--pozicija-light);
}
.sidebar .sidebar__link[data-nav=pozicija].active .sidebar__link-icon svg {
  fill: var(--pozicija-dark) !important;
}
.sidebar .sidebar__link[data-nav=pozicija].active .sidebar__link-icon svg path {
  fill: var(--pozicija-dark) !important;
}
.sidebar .sidebar__link[data-nav=pozicija].active span {
  color: var(--pozicija-dark);
}
.sidebar .sidebar__link[data-nav=nasoki].active {
  background-color: rgba(var(--nasoki-light), 0.32);
  border: none;
}
.sidebar .sidebar__link[data-nav=nasoki].active .sidebar__link-icon {
  background-color: var(--nasoki-light);
}
.sidebar .sidebar__link[data-nav=nasoki].active .sidebar__link-icon svg {
  fill: var(--nasoki-dark) !important;
}
.sidebar .sidebar__link[data-nav=nasoki].active .sidebar__link-icon svg path {
  fill: var(--nasoki-dark) !important;
}
.sidebar .sidebar__link[data-nav=nasoki].active span {
  color: var(--nasoki-dark);
}
.sidebar .sidebar__link[data-nav=fakturi].active {
  background-color: rgba(var(--fakturi-dark), 0.32);
  border: none;
}
.sidebar .sidebar__link[data-nav=fakturi].active .sidebar__link-icon {
  background-color: var(--fakturi-dark);
}
.sidebar .sidebar__link[data-nav=fakturi].active .sidebar__link-icon svg {
  fill: var(--fakturi-dark) !important;
}
.sidebar .sidebar__link[data-nav=fakturi].active .sidebar__link-icon svg path {
  fill: var(--fakturi-dark) !important;
}
.sidebar .sidebar__link[data-nav=fakturi].active span {
  color: var(--fakturi-dark);
}
.sidebar .sidebar__link .sidebar__link-icon {
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.sidebar.closed {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sidebar.closed .sidebar__link.active {
  position: relative !important;
}
.sidebar.closed .sidebar__link.active::before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  height: 100%;
  width: 4px;
}
.sidebar.closed .sidebar__link.active[data-nav=pozicija]::before {
  background-color: var(--pozicija-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-subnav=istorija]::before {
  background-color: var(--istorija-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-subnav=izvestai]::before {
  background-color: var(--izvestai-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-subnav=adresi]::before {
  background-color: var(--adresi-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-nav=nasoki]::before {
  background-color: var(--nasoki-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-nav=fakturi]::before {
  background-color: var(--fakturi-dark) !important;
}
.sidebar.closed .sidebar__link.active[data-subnav=opcii]::before {
  background-color: var(--opcii-dark) !important;
}
.sidebar.closed .nav-toggle {
  margin-right: 0px;
}
.sidebar.closed .s-opened {
  display: none !important;
}
.sidebar.closed .sidebar__top {
  justify-content: center;
  align-items: center;
}
.sidebar__top {
  height: 52px;
}
.sidebar__top h4 {
  letter-spacing: 0.1rem;
}
.sidebar .sidebar-istorija.active,
.sidebar .sidebar-opcii.active,
.sidebar .sidebar-adresi.active,
.sidebar .sidebar-izvestai.active {
  position: relative;
  border-top: 1px solid rgb(var(--bg-color-2));
  border-bottom: 1px solid rgb(var(--bg-color-2));
  box-shadow: -2px 0px 0px 0px rgb(var(--main-bg-color)), 2px 0px 0px 0px rgb(var(--main-bg-color));
  position: relative;
  z-index: 2;
  background-color: rgba(var(--high-contrast-color));
}
.sidebar .sidebar-istorija.active .sidebar__link:first-of-type span,
.sidebar .sidebar-opcii.active .sidebar__link:first-of-type span,
.sidebar .sidebar-adresi.active .sidebar__link:first-of-type span,
.sidebar .sidebar-izvestai.active .sidebar__link:first-of-type span {
  font-weight: 600;
}
.sidebar__link[data-subnav] span {
  font-size: 15px;
}
.sidebar__link[data-subnav].active {
  background-color: rgb(var(--high-soft-color));
}
.sidebar__link[data-subnav=istorija] {
  display: none;
}
.sidebar__link[data-subnav=istorija] span {
  position: relative;
  top: -3px;
}
.sidebar__link[data-subnav=izvestai] {
  display: none;
}
.sidebar__link[data-subnav=izvestai] span {
  position: relative;
  top: -3px;
}
.sidebar__link[data-subnav=adresi] {
  display: none;
}
.sidebar__link[data-subnav=adresi] span {
  position: relative;
  top: -6px;
}
.sidebar__link span {
  padding-left: 5px !important;
}
.sidebar__link.active {
  width: calc(100% + 1px);
  box-shadow: -2px 0px 0px 0px rgb(var(--main-bg-color)), 2px 0px 0px 0px rgb(var(--main-bg-color));
  position: relative;
  background-color: rgb(var(--main-bg-color));
  z-index: 2;
}
.sidebar__link.active:not(.sidebar-istorija-link):not(.sidebar-adresi-link):not(.sidebar-opcii-link):not(.sidebar-izvestai-link) {
  border-top: 1px solid rgb(var(--bg-color-2));
  border-bottom: 1px solid rgb(var(--bg-color-2));
  background-color: rgb(var(--high-contrast-color));
}
.sidebar__link.active svg {
  fill: rgb(var(--primary-color)) !important;
}
.sidebar__link.active svg g,
.sidebar__link.active svg path {
  fill: rgb(var(--primary-color)) !important;
}
.sidebar__link.active span {
  color: rgb(var(--primary-color));
}
.sidebar__link svg {
  position: relative;
  top: 2px;
}
.sidebar__link svg g {
  fill: rgb(var(--main-txt-color));
}

.sidebar .sidebar__links {
  overflow-y: auto;
  overflow-x: hidden;
}
.sidebar .sidebar__links span {
  position: relative;
  top: 2px;
}
.sidebar.closed .sidebar__links {
  width: 62px;
}
.sidebar.closed .active .sidebar__link {
  display: flex !important;
  justify-content: center;
}
.sidebar.closed .sidebar__link {
  justify-content: center;
}
.sidebar.closed .sidebar__link.active {
  display: flex !important;
}

.vehicles {
  position: relative;
}
.sidebar-istorija.active .sidebar__link[data-nav=istorija] {
  background-color: rgba(var(--istorija-light), 0.32);
  border: none;
}
.sidebar-istorija.active .sidebar__link[data-nav=istorija] .sidebar__link-icon {
  background-color: var(--istorija-light);
}
.sidebar-istorija.active .sidebar__link[data-nav=istorija] .sidebar__link-icon svg {
  fill: var(--istorija-dark) !important;
}
.sidebar-istorija.active .sidebar__link[data-nav=istorija] .sidebar__link-icon svg path {
  fill: var(--istorija-dark) !important;
}
.sidebar-istorija.active .sidebar__link[data-nav=istorija] span {
  color: var(--istorija-dark);
}
.sidebar-istorija.active .sidebar__link:not([data-nav=istorija]) .sidebar__link-icon {
  background-color: rgba(var(--istorija-light), 0.5);
}
.sidebar-istorija.active .sidebar__link:not([data-nav=istorija]) .sidebar__link-icon svg {
  fill: var(--istorija-dark) !important;
}
.sidebar-istorija.active .sidebar__link:not([data-nav=istorija]) .sidebar__link-icon svg path {
  fill: var(--istorija-dark) !important;
}
.sidebar-istorija.active .sidebar__link:not([data-nav=istorija]).active {
  background-color: rgba(var(--istorija-light), 0.32);
  border: none;
}

.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] {
  background-color: rgba(var(--izvestai-light), 0.32);
  border: none;
}
.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] .sidebar__link-icon {
  background-color: var(--izvestai-light);
}
.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] .sidebar__link-icon svg {
  fill: var(--izvestai-dark) !important;
}
.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] .sidebar__link-icon svg path {
  fill: var(--izvestai-dark) !important;
}
.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] span {
  color: var(--izvestai-dark);
}
.sidebar-izvestai.active .sidebar__link:not([data-nav=izvestai]) .sidebar__link-icon {
  background-color: rgba(var(--izvestai-light), 0.5);
}
.sidebar-izvestai.active .sidebar__link:not([data-nav=izvestai]) .sidebar__link-icon svg {
  fill: var(--izvestai-dark) !important;
}
.sidebar-izvestai.active .sidebar__link:not([data-nav=izvestai]) .sidebar__link-icon svg path {
  fill: var(--izvestai-dark) !important;
}
.sidebar-izvestai.active .sidebar__link:not([data-nav=izvestai]) span {
  color: var(--izvestai-dark);
}
.sidebar-izvestai.active .sidebar__link:not([data-nav=izvestai]).active {
  background-color: rgba(var(--izvestai-light), 0.32);
  border: none;
}

.sidebar-adresi.active .sidebar__link[data-nav=adresi] {
  background-color: rgba(var(--adresi-light), 0.32);
  border: none;
}
.sidebar-adresi.active .sidebar__link[data-nav=adresi] .sidebar__link-icon {
  background-color: var(--adresi-light);
}
.sidebar-adresi.active .sidebar__link[data-nav=adresi] .sidebar__link-icon svg {
  fill: var(--adresi-dark) !important;
}
.sidebar-adresi.active .sidebar__link[data-nav=adresi] .sidebar__link-icon svg path {
  fill: var(--adresi-dark) !important;
}
.sidebar-adresi.active .sidebar__link[data-nav=adresi] span {
  color: var(--adresi-dark);
}
.sidebar-adresi.active .sidebar__link:not([data-nav=adresi]) .sidebar__link-icon {
  background-color: rgba(var(--adresi-light), 0.5);
}
.sidebar-adresi.active .sidebar__link:not([data-nav=adresi]) .sidebar__link-icon svg {
  fill: var(--adresi-dark) !important;
}
.sidebar-adresi.active .sidebar__link:not([data-nav=adresi]) .sidebar__link-icon svg path {
  fill: var(--adresi-dark) !important;
}
.sidebar-adresi.active .sidebar__link:not([data-nav=adresi]).active {
  background-color: rgba(var(--adresi-light), 0.32);
  border: none;
}

.sidebar-opcii.active .sidebar__link[data-nav=opcii] {
  background-color: rgba(var(--opcii-light), 0.25);
  border: none;
}
.sidebar-opcii.active .sidebar__link[data-nav=opcii] .sidebar__link-icon svg {
  fill: var(--opcii-dark) !important;
}
.sidebar-opcii.active .sidebar__link[data-nav=opcii] .sidebar__link-icon svg path {
  fill: var(--opcii-dark) !important;
}
.sidebar-opcii.active .sidebar__link[data-nav=opcii] span {
  color: var(--opcii-dark);
}
.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon {
  background-color: rgba(var(--opcii-light), 0.25);
}
.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon svg {
  fill: var(--opcii-dark) !important;
}
.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon svg path {
  fill: var(--opcii-dark) !important;
}
.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) span {
  color: var(--opcii-dark);
}
.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]).active {
  background-color: rgba(var(--opcii-light), 0.25);
  border: none;
}

#zacuvajAdresaBtn {
  background-color: var(--adresi-dark);
}

#otkaziAdresaBtn {
  opacity: 0.8;
}

#dobijNasokiBtn {
  background-color: var(--nasoki-dark);
}

.opcii-content .checkContainer input:checked ~ .checkmark {
  background-color: var(--opcii-light);
}
.opcii-content .onoffswitch-inner::before {
  background-color: var(--opcii-light);
}
.opcii-content button.bg-primary {
  background-color: var(--opcii-light) !important;
}
.opcii-content button.bg-primary span {
  color: white;
}

.backup-div .checkContainer input:checked ~ .checkmark {
  background-color: var(--backup-light);
}
.backup-div .onoffswitch-inner::before {
  background-color: var(--backup-light);
}
.backup-div button.bg-primary {
  background-color: var(--backup-light) !important;
}
.backup-div button.bg-primary span {
  color: white;
}

.sidebar__link {
  background-color: transparent !important;
}

.sidebar__link-icon {
  background-color: transparent !important;
}

.sidebar__link:not(.active) span {
  color: rgb(var(--main-txt-color)) !important;
}

/* //nasoki */
.sidebar__link[data-nav=nasoki].active .sidebar__link-icon {
  /* background-color: #E4DAE8 !important; */
}

.sidebar__link[data-nav=nasoki].active .sidebar__link-icon svg {
  fill: var(--nasoki-dark) !important;
  /* E4DAE8 */
}

.sidebar__link[data-nav=nasoki].active .sidebar__link-icon path {
  fill: var(--nasoki-dark) !important;
}

.sidebar__link[data-nav=nasoki].active span {
  color: var(--nasoki-dark) !important;
}

.sidebar__link[data-nav=fakturi].active .sidebar__link-icon svg {
  fill: var(--fakturi-dark) !important;
  /* E4DAE8 */
}

.sidebar__link[data-nav=fakturi].active .sidebar__link-icon path {
  fill: var(--fakturi-dark) !important;
}

.sidebar__link[data-nav=fakturi].active span {
  color: var(--fakturi-dark) !important;
}

/* istorija */
.sidebar-istorija.active .sidebar__link[data-nav=istorija] span {
  color: var(--istorija-dark) !important;
}

.sidebar-adresi.active .sidebar__link:not([data-nav=adresi]).active span {
  color: var(--adresi-dark) !important;
}

/* izvestai */
.sidebar-izvestai.active .sidebar__link[data-nav=izvestai] span {
  color: var(--izvestai-dark) !important;
}

/* adresi */
.sidebar-adresi.active .sidebar__link[data-nav=adresi] span {
  color: var(--adresi-dark) !important;
}

/* opcii */
.sidebar-opcii.active .sidebar__link[data-nav=opcii] {
  background-color: rgba(var(--opcii-dark), 0.32);
  border: none !important;
}

.sidebar-opcii.active .sidebar__link[data-nav=opcii] .sidebar__link-icon svg {
  fill: var(--opcii-dark) !important;
}

.sidebar-opcii.active .sidebar__link[data-nav=opcii] .sidebar__link-icon svg path {
  fill: var(--opcii-dark) !important;
}

.sidebar-opcii.active .sidebar__link[data-nav=opcii] span {
  color: var(--opcii-dark) !important;
}

.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon {
  border: none !important;
}

.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon svg {
  fill: var(--opcii-dark) !important;
}

.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]) .sidebar__link-icon path {
  fill: var(--opcii-dark) !important;
}

.sidebar-opcii.active .sidebar__link:not([data-nav=opcii]).active span {
  color: var(--opcii-dark) !important;
}

.sidebar__link[data-nav=pozicija] .sidebar__link-icon svg {
  fill: var(--pozicija-dark) !important;
}

.sidebar__link[data-nav=pozicija] .sidebar__link-icon path {
  fill: var(--pozicija-dark) !important;
}

.sidebar__link[data-nav=pozicija] .sidebar__link-icon g {
  fill: var(--pozicija-dark) !important;
}

.sidebar__link[data-nav=nasoki] .sidebar__link-icon svg {
  fill: var(--nasoki-dark) !important;
}

.sidebar__link[data-nav=nasoki] .sidebar__link-icon path {
  fill: var(--nasoki-dark) !important;
}

.sidebar__link[data-nav=fakturi] .sidebar__link-icon svg {
  fill: var(--fakturi-dark) !important;
}

.sidebar__link[data-nav=fakturi] .sidebar__link-icon path {
  fill: var(--fakturi-dark) !important;
}

.sidebar__link[data-nav=istorija] .sidebar__link-icon svg {
  fill: var(--istorija-dark) !important;
}

.sidebar__link[data-nav=istorija] .sidebar__link-icon path {
  fill: var(--istorija-dark) !important;
}

.sidebar__link[data-nav=izvestai] .sidebar__link-icon svg {
  fill: var(--izvestai-dark) !important;
}

.sidebar__link[data-nav=izvestai] .sidebar__link-icon path {
  fill: var(--izvestai-dark) !important;
}

.sidebar__link[data-nav=adresi] .sidebar__link-icon svg {
  fill: var(--adresi-dark) !important;
}

.sidebar__link[data-nav=adresi] .sidebar__link-icon path {
  fill: var(--adresi-dark) !important;
}

.sidebar__link[data-nav=opcii] .sidebar__link-icon svg {
  fill: var(--opcii-dark) !important;
}

.sidebar__link[data-nav=opcii] .sidebar__link-icon path {
  fill: var(--opcii-dark) !important;
}

.content {
  flex: 1;
}
.content__top {
  box-shadow: 0 8px 4px -4px rgba(119, 119, 119, 0.05);
}
.content__top .content__top-right button {
  right: 20px;
  top: 6px;
  opacity: 0.7;
}

.content__mid {
  height: 65px;
}
.content__mid .content__mid-left {
  height: 100%;
}
.content__mid .content__mid-right {
  height: 100%;
}
.content__mid .content__mid-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
.content__mid .content__mid-item.search-item {
  position: relative;
}
.content__mid .content__mid-item.search-item input {
  padding-right: 20px;
}
.content__mid .content__mid-item.search-item button {
  position: absolute;
  right: 16px;
  top: calc(50% + 2px);
  width: 20px;
}

.content__bottom {
  height: 100vh;
}
.content__bottom .content__bottom-item {
  display: flex;
  justify-content: center;
  height: 100%;
}
.content__bottom .content__bottom-item.search-item {
  position: relative;
  padding-right: 6px;
}
.content__bottom .content__bottom-item.search-item input {
  padding-right: 20px;
}
.content__bottom .content__bottom-item.search-item button {
  position: absolute;
  top: 25px;
  right: 10px;
  width: 20px;
}
.content__bottom .content__bottom-left {
  width: 540px;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.content__bottom .content__bottom-left[data-nav=pozicija] {
  border-left: 4px solid var(--pozicija-light);
}
.content__bottom .content__bottom-left[data-nav=izvestai] {
  border-left: 4px solid var(--izvestai-light);
}
.content__bottom .content__bottom-left[data-nav=istorija] {
  border-left: 4px solid var(--istorija-light);
}
.content__bottom .content__bottom-left[data-nav=adresi] {
  border-left: 4px solid var(--adresi-light);
}
.content__bottom .content__bottom-left[data-nav=nasoki] {
  border-left: 4px solid var(--nasoki-light);
}
.content__bottom .content__bottom-left[data-nav=fakturi] {
  border-left: 4px solid var(--fakturi-dark);
}
.content__bottom .content__bottom-left[data-nav=opcii] {
  border-left: 4px solid var(--opcii-light);
}
.content__bottom .content__bottom-left[data-nav=backup] {
  border-left: 4px solid var(--backup-light);
}
.content__bottom .content__bottom-left .izvestai-div {
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.content__bottom .content__bottom-left .izvestai-div .izvestai-bottom {
  flex: 1;
  overflow-y: auto;
}
.content__bottom .content__bottom-left .izvestai-div .izvestai-bottom .subuser-name {
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  background-color: rgb(var(--main-bg-color));
  z-index: 2;
  border-radius: 4px;
}
.content__bottom .content__bottom-left[data-nav=opcii] {
  position: absolute;
  left: 200px;
  width: calc(100% - 200px);
  height: 100%;
  z-index: 9;
  background-color: rgb(var(--main-bg-color));
}
.content__bottom .content__bottom-left[data-nav=opcii].s-closed {
  left: 62px;
  width: calc(100% - 62px);
}
.content__bottom .content__bottom-left[data-nav=fakturi] {
  position: absolute;
  left: 200px;
  width: calc(100% - 200px);
  height: 100%;
  z-index: 9;
  background-color: rgb(var(--main-bg-color));
}
.content__bottom .content__bottom-left[data-nav=fakturi].s-closed {
  left: 62px;
  width: calc(100% - 62px);
}
.content__bottom .content__bottom-left .vehicles {
  height: auto;
  max-height: calc(100% - 49px);
  overflow: auto;
  padding: 10px;
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 10px;
  position: relative;
}
.content__bottom .content__bottom-left .vehicles .veh-border {
  border: none;
  background-color: rgb(var(--main-bg-color)) !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border .fa-plus {
  color: #10ac84 !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border .fa-minus {
  color: #ee5253 !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-2 .veh-border__center,
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-2 .veh-border__right {
  display: none !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-2 .veh-border__left {
  width: 100% !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-1 .veh-border__center,
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-1 .veh-border__right {
  display: none !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-1 .veh-border__left {
  width: 100% !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-1 .veh-icons,
.content__bottom .content__bottom-left .vehicles .veh-border.vozilo-sirina-1 .vehicle-speed {
  display: none !important;
}
.content__bottom .content__bottom-left .vehicles .veh-border__center {
  border: none;
}
.content__bottom .content__bottom-left .vehicles .veh-border__left {
  position: relative;
}
.content__bottom .content__bottom-left .vehicles .optionsVehicle.active i {
  color: rgb(var(--primary-color));
}
.content__bottom .content__bottom-right {
  flex: 1;
}
.content__bottom .content__bottom-right .autocentar {
  right: 12px;
  top: 12px;
  width: 42px;
  height: 42px;
}
.content__bottom .content__bottom-right .autocentar.active {
  background-color: rgb(var(--primary-color));
}
.content__bottom .content__bottom-right .autocentar.active img {
  filter: brightness(0) invert(1);
}
.content__bottom .content__bottom-right[data-nav=izvestai] {
  background-color: rgb(var(--high-contrast-color));
}
.content__bottom .content__bottom-right #mapa {
  height: 100%;
}

.istorija-div {
  position: relative;
}
.vozila-tip.b-primary {
  border-color: var(--pozicija-dark);
}

.content__bottom-left[data-nav=istorija] .b-primary {
  border-color: var(--istorija-dark);
}
.content__bottom-left[data-nav=istorija] .onoffswitch-inner:not(.boja1) .onoffswitch-inner::before,
.content__bottom-left[data-nav=istorija] .onoffswitch-inner:not(.boja2) .onoffswitch-inner::before {
  background-color: var(--istorija-dark) !important;
}
.content__bottom-left[data-nav=istorija] .bg-primary {
  background-color: var(--istorija-dark);
}
.content__bottom-left[data-nav=istorija] .patuvanja .patuvanja-list .patuvanje .patuvanje-right__icon.selected {
  background-color: var(--istorija-dark) !important;
}
.content__bottom-left[data-nav=istorija] .patuvanja .patuvanja-list .patuvanje .patuvanje-line span {
  background-color: var(--istorija-dark) !important;
}
.content__bottom-left[data-nav=istorija] .patuvanja .patuvanja-list .patuvanje .patuvanje-line::before {
  background-color: var(--istorija-dark) !important;
}

.izvestai-form .onoffswitch-inner::before {
  background-color: var(--izvestai-dark) !important;
}

.adresa-div .button-primary:hover {
  background-color: var(--adresi-darker) !important;
}
.adresa-div .bg-primary-light {
  background-color: var(--adresi-darker) !important;
}
.adresa-div .onoffswitch-inner::before {
  background-color: var(--adresi-darker) !important;
}

.content__bottom-left[data-nav=nasoki] .button-primary:hover {
  background-color: var(--nasoki-darker) !important;
}
.content__bottom-left[data-nav=nasoki] .onoffswitch-inner::before {
  background-color: var(--nasoki-darker) !important;
}

.content__bottom-left[data-nav=fakturi] .button-primary:hover {
  background-color: var(--fakturi-darker) !important;
}
.content__bottom-left[data-nav=fakturi] .onoffswitch-inner::before {
  background-color: var(--fakturi-darker) !important;
}

.content__bottom-left[data-nav=opcii] .button-primary:hover {
  background-color: var(--opcii-darker) !important;
}
.content__bottom-left[data-nav=opcii] .onoffswitch-inner::before {
  background-color: var(--opcii-darker) !important;
}

.minimize-vehicle {
  margin-top: 3px;
}

.nav-toggle {
  display: flex;
  flex-direction: column;
  background-color: transparent;
}
.nav-toggle span {
  display: flex;
  width: 23px;
  height: 2px;
  background-color: rgb(var(--softer-color));
  opacity: 0.8;
}
.nav-toggle span:nth-of-type(2) {
  margin-top: 4px;
  margin-bottom: 4px;
}

.veh-border {
  transition: 600ms transform cubic-bezier(0.18, 0.89, 0.32, 1.28);
  border: 1px solid transparent;
}
.veh-border:hover {
  border: 1px solid red !important;
}
.veh-border .veh-icons-parent i {
  margin-right: 4px;
}
.veh-border .veh-icons-parent p {
  display: flex;
  align-items: center;
  margin-left: 4px;
}
.veh-border .veh-icons-parent p:first-of-type {
  margin-left: 0px;
}
.veh-border .veh-icons {
  margin-left: auto;
}
.veh-border__left {
  width: 70%;
  transition: 3500ms background-color;
}
.veh-border__left .vehicle-speed {
  padding-right: 5px;
}
.veh-border__left .vehicle-speed span {
  font-size: 13px;
  font-weight: 600;
}
.veh-border__left .veh-icons-parent {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.veh-border__center {
  background-color: rgb(var(--high-soft-color));
  width: 25%;
}
.veh-border__center .d-adresa {
  word-break: break-word;
  text-align: center;
  font-size: 13px;
  padding-left: 1px;
  padding-right: 1px;
}
.veh-border__right {
  width: 5%;
}
.veh-border__right .veh-border__check {
  margin-left: 4px;
}

.veh-icons {
  flex-wrap: nowrap !important;
}

.vehicle-speed span {
  white-space: nowrap;
}

.istorija-div {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.istorija-div .dvizenja-tbody tr:nth-of-type(2n) {
  background-color: rgb(var(--bg-color-1));
}
.istorija-div .istorija-bottom {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: auto;
}
.istorija-div .istorija-bottom .istorija-tabs-outer {
  width: 100%;
}
.istorija-div .istorija-bottom .istorija-tabs {
  width: calc(100% - 40px);
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab {
  padding: 7px 0px;
  cursor: pointer;
  transition: 0.4s ease-in-out;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 1;
  background-color: #fafafa !important;
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab span {
  font-size: 12px;
  padding-top: 1px;
  margin-top: 3px;
  font-weight: 500;
  color: #555;
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab.active {
  background-color: rgb(var(--primary-color)) !important;
  opacity: 1;
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab.active svg {
  fill: white;
  filter: brightness(0) invert(1);
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab.active span {
  color: white;
}
.istorija-div .istorija-bottom .istorija-tabs .istorija-tab:hover {
  background-color: #fafafa;
}
.istorija-div .istorija-bottom .istorija-down {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
}
.istorija-div .istorija-bottom .istorija-down:hover i {
  color: rgb(var(--primary-color));
}
.istorija-div .istorija-tabs-contents {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: auto;
}

.istorija-tab-content .polokacii-items {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 10px;
}
.istorija-tab-content .polokacii-items .polokacii-item {
  border-radius: 5px;
  background-color: rgb(var(--main-bg-color));
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0.8rem 1rem;
}
.istorija-tab-content.dvizenja .dvizenja-items {
  display: grid !important;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 10px 10px;
}
.istorija-tab-content.dvizenja .dvizenja-items .dvizenja-item {
  display: flex;
  flex-direction: column;
  background-color: rgb(var(--main-bg-color));
  border-radius: 5px;
}
.istorija-tab-content.dvizenja .dvizenja-items .dvizenja-item .dvizenja-item__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.istorija-tab-content.dvizenja .dvizenja-items .dvizenja-item .dvizenja-item__bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.istorija-tab-content.sumarno {
  padding: 10px;
}
.istorija-tab-content.sumarno .sumarno-items {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 10px 10px;
}
.istorija-tab-content.sumarno .sumarno-item {
  border-radius: 5px;
  background-color: rgb(var(--main-bg-color));
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0.8rem 1rem;
}
.istorija-tab-content.sumarno .sumarno-item p {
  font-weight: 600;
}
.istorija-tab-content.sumarno .sumarno-item span {
  margin-top: 5px;
  display: flex;
}
.gorivo-data {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 10px 10px;
  padding: 10px;
}
.gorivo-data .gorivo-data__item {
  cursor: pointer;
  border-radius: 5px;
  background-color: rgb(var(--main-bg-color));
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0.8rem 1rem;
}

.istorija-tab-content {
  border: none !important;
}

/* TABLE */
table {
  margin: 0;
  padding: 0;
  width: 100%;
  border-collapse: collapse;
}
table th {
  color: rgb(var(--black-color)) !important;
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}

thead {
  background-color: rgb(var(--main-bg-color));
  width: 100%;
  color: rgb(var(--main-bg-color));
  position: relative;
}
thead::before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 10px;
  height: 10px;
  background-color: transparent;
  border-top-left-radius: 3px;
}
thead th {
  padding-left: 5px;
  padding-right: 5px;
  color: black;
}

table tr {
  border: 1px solid rgba(var(--soft-txt-color), 0.05);
}
table tr table tr:nth-of-type(2n) {
  background-color: #f8f8f8;
}

table td {
  border-right: 1px solid rgba(var(--soft-txt-color), 0.05);
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

table th {
  font-size: 13px;
  padding-top: 7px;
  border-right: 1px solid rgba(var(--soft-txt-color), 0.15);
}

table td,
table th {
  text-align: center;
}

table th {
  letter-spacing: 0.05em;
  text-transform: uppercase;
  font-weight: 500;
  color: rgb(var(--main-bg-color));
}

@media screen and (max-width: 639px) {
  table {
    border: 0;
  }
  table thead {
    display: none;
  }
  table tr {
    display: block;
    margin-bottom: 0.625em;
  }
  table td {
    padding-left: 4px;
    padding-right: 4px;
    display: block;
    text-align: right;
  }
  table td:before {
    content: attr(data-label);
    float: left;
    text-transform: uppercase;
  }
  table td:last-child {
    border-bottom: 0;
  }
}
.fixed-header {
  position: sticky;
  position: -webkit-sticky;
  top: -2px;
  z-index: 2;
  padding-top: 13px !important;
  padding-bottom: 13px !important;
  font-weight: 600;
  background-color: rgb(var(--bg-color-1)) !important;
}

.table-outer {
  height: 100%;
}

.patuvanja {
  margin-top: 10px !important;
  border: none !important;
}
.patuvanja .patuvanja-header {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 10pxs;
  border-radius: 5px;
}
.patuvanja .patuvanja-list {
  padding: 10px;
  grid-template-columns: repeat(1, 1fr);
  display: grid;
  grid-gap: 10px;
}
.patuvanja .patuvanja-list .patuvanje {
  position: relative;
  border-radius: 5px;
  background-color: rgb(var(--main-bg-color));
  border: none !important;
  padding: 10px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-left {
  width: calc(100% - 40px);
  padding-right: 4px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-right {
  cursor: pointer;
  width: 40px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-right__icon i {
  transition: none !important;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-right__icon:hover i {
  color: rgb(var(--main-bg-color));
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-right__icon.selected {
  background-color: rgb(var(--primary-color));
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-right__icon.selected i {
  color: rgb(var(--main-bg-color));
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-top {
  position: absolute;
  right: 0px;
  top: 0px;
  margin-top: 5px;
  margin-right: 5px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-bottom__left h4 {
  line-height: 14px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line {
  position: relative;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  height: 2px;
  background-color: rgb(var(--primary-color));
  width: 100%;
  z-index: 2;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span {
  display: flex;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  color: rgb(var(--main-bg-color));
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(var(--primary-color));
  padding-top: 2px;
  font-size: 12px;
  position: relative;
  z-index: 3;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span i.blinking {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgb(219, 46, 46);
  border-radius: 50%;
  text-align: center;
  padding-top: 4px;
  animation: blink-animation 5s step-end infinite;
}
@keyframes blink-animation {
  0% {
    visibility: hidden;
  }
  30% {
    visibility: visible;
  }
  45% {
    visibility: hidden;
  }
  100% {
    visibility: hidden;
  }
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span p {
  position: absolute;
  left: 20px;
  bottom: 6px;
  color: rgb(var(--primary-color));
  font-size: 13px;
  margin-bottom: 2px;
  font-weight: 500;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span * {
  font-size: 12px;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span i {
  color: rgb(var(--main-bg-color));
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span:nth-of-type(2), .patuvanja .patuvanja-list .patuvanje .patuvanje-line span:nth-of-type(3) {
  width: 20px;
  height: 20px;
  background-color: rgb(var(--primary-color));
  padding-top: 0px !important;
  padding-left: 0px !important;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span:nth-of-type(2) i, .patuvanja .patuvanja-list .patuvanje .patuvanje-line span:nth-of-type(3) i {
  color: #fff;
  font-size: 10px !important;
}
.patuvanja .patuvanja-list .patuvanje .patuvanje-line span:nth-of-type(3) {
  padding-left: 1px !important;
}

.izvestai-div .izvestai-sidebar {
  height: calc(100vh - 63.75px - 37px);
  width: 600px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.4s all;
  opacity: 0.1;
}
.izvestai-div .izvestai-sidebar .close-izvestaiSidebar {
  margin-right: -35px;
  cursor: pointer;
  background-color: #0984E3;
  width: 35px;
  height: 50px;
  padding-right: 5px;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}
.izvestai-div .izvestai-sidebar:hover {
  opacity: 1;
  background-color: #0767b2;
}
.izvestai-div .izvestai-sidebar span {
  color: white;
  font-size: 17px;
}
.izvestai-div .izvestai-sidebar .izvestai-form {
  justify-content: center;
  align-items: center;
}
.izvestai-div .izvestai-sidebar .izvestai-subusers {
  height: calc(100vh - 328px - 37px - 63.75px - 7px);
  width: 100%;
  overflow-y: auto;
}
.izvestai-div .izvestai-sidebar .izvestai-subuser {
  margin: 7px 0;
  border: 1px solid rgba(119, 119, 119, 0.5);
}

.open-izvestaiSidebar {
  margin-right: -35px;
  cursor: pointer;
  background-color: #0984E3;
  width: 35px;
  height: 50px;
  padding-right: 5px;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  opacity: 0.1;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.4s all;
}
.open-izvestaiSidebar:hover {
  background-color: #0767b2;
  opacity: 1;
}
.open-izvestaiSidebar span {
  color: white;
  font-size: 17px;
}

.izvestai-table-container .izvestai-table__header p {
  white-space: nowrap;
}
.izvestai-table-container .izvestai-table__header span {
  white-space: nowrap;
}
.izvestai-table-container {
  display: flex;
  flex-direction: column;
}

.subuser-options {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 7px;
  margin-top: 5px;
}

.checkContainer {
  display: block;
  position: relative;
  padding-left: 26px;
  cursor: pointer;
  font-size: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.checkContainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 17px;
  width: 17px;
  border-radius: 0.1rem;
  background-color: #ddd;
  border: 1px solid transparent;
}
.checkmark.bordered {
  border-color: rgb(var(--bg-color-2)) !important;
}

.checkContainer:hover input ~ .checkmark {
  background-color: rgb(var(--checkbox-hover));
}

.checkContainer input:checked ~ .checkmark {
  background-color: #0984E3;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkContainer input:checked ~ .checkmark:after {
  display: block;
}

.checkContainer .checkmark:after {
  left: 5px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.checkContainer .checkmark.vozilo-check:after {
  top: 2px !important;
  left: 6px !important;
}

.popup-wrap {
  width: 100%;
  height: 100vh;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  z-index: 999;
}
.popup-wrap input {
  background-color: transparent;
}
.popup-wrap select {
  background-color: transparent;
}
.popup-wrap .flexdatalist-multiple.flex0 {
  height: 100%;
  display: flex;
  align-items: center;
  overflow: auto;
  padding: 8px 0px;
}
.popup-wrap .icons-wrap .icon.active {
  border: 1px solid rgb(var(--primary-color));
}
.popup-wrap .popup-nav-outer {
  width: 100%;
  border-bottom: 1px solid rgb(var(--bg-color-1));
}
.popup-wrap .popup-nav-outer .popup-nav-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 12px 0px;
  cursor: pointer;
  opacity: 0.4;
  position: relative;
  transition: 0.4s ease-in-out;
}
.popup-wrap .popup-nav-outer .popup-nav-item p {
  font-size: 16px;
  user-select: none;
}
.popup-wrap .popup-nav-outer .popup-nav-item span {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: rgb(var(--primary-color));
  position: absolute;
  bottom: 5px;
  user-select: none;
}
.popup-wrap .popup-nav-outer .popup-nav-item:hover {
  opacity: 0.7;
}
.popup-wrap .popup-nav-outer .popup-nav-item.active {
  opacity: 1;
  background-color: rgb(var(--high-contrast-color));
}
.popup-wrap .popup-nav-outer .popup-nav-item.active p {
  font-size: 16px;
  font-weight: 500;
}
.popup-wrap .popup-content {
  background-color: rgb(var(--high-contrast-color));
  max-height: 90%;
  overflow: auto;
  border-radius: 0.5rem;
  -webkit-box-shadow: -1px -2px 18px 0px rgba(0, 0, 0, 0.34);
  -moz-box-shadow: -1px -2px 18px 0px rgba(0, 0, 0, 0.34);
  box-shadow: -1px -2px 18px 0px rgba(0, 0, 0, 0.34);
}
@media screen and (max-width: 1440px) and (max-width: 630px) {
  .popup-wrap .popup-content {
    width: 95%;
  }
  .popup-wrap .popup-content .form-group {
    display: flex !important;
    flex-direction: column !important;
  }
  .popup-wrap .popup-content .color-list {
    flex-wrap: wrap;
  }
}
.popup-wrap .popup-content .popup-header button:hover span {
  color: #ee5253;
}
.popup-wrap .popup-content .color-list .color {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  position: relative;
}
.popup-wrap .popup-content .color-list .color::before {
  content: "\f00c";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: rgb(var(--high-contrast-color));
  font-size: 12px;
  transform: scale(0);
  transition: 0.4s ease-in-out;
}
.popup-wrap .popup-content .color-list .color.active::before {
  transform: scale(1);
}
.popup-wrap .popup-content .color-list .color:first-of-type {
  margin-left: 0px;
  margin-bottom: 5px;
}

.checks .check label {
  white-space: nowrap;
}

.customer-location {
  padding-bottom: 10px;
}
.customer-location:nth-of-type(2n) {
  background-color: #f7f7f7;
}

.customer-contact {
  padding-bottom: 10px;
}
.customer-contact:nth-of-type(2n) {
  background-color: #f7f7f7;
}

.project-popup textarea {
  font-size: 14px !important;
}

.grafik {
  position: absolute;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  width: 100%;
}
.grafik.grafik-3 {
  height: 100vh;
}
.grafik.grafik-3 .grafik-opcii {
  display: flex !important;
}
.grafik.grafik-2 {
  height: 66.67vh;
}
.grafik.grafik-2 .grafik-opcii {
  display: flex !important;
}
.grafik.grafik-1 {
  height: 33.333vh;
}
.grafik.grafik-1 .grafik-opcii {
  display: flex !important;
}
.grafik.grafik-min {
  height: 61px;
}
.grafik.grafik-min .grafik-opcii {
  visibility: hidden !important;
}

.grafik-opcii .grafik-opcija {
  flex-direction: column;
  align-items: flex-start !important;
  font-size: 14px !important;
}
@media screen and (max-width: 1500px) {
  .grafik-opcii .grafik-opcija label {
    font-size: 14px !important;
  }
}
.grafik-opcii .grafik-opcija .onoffswitch {
  margin-top: 4px;
}

.grafik-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 3;
  position: relative;
}
.grafik-actions .grafik-options {
  position: absolute;
  bottom: 100%;
  right: -28px;
  background-color: rgb(var(--high-contrast-color));
}
.grafik-actions .grafik-options .grafik-action {
  margin-top: 4px;
  margin-bottom: 4px;
}
.grafik-actions .grafik-action {
  padding-left: 1px;
  padding-right: 1px;
  width: 32px;
  height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-left: 3px;
  margin-right: 3px;
}
.grafik-actions .grafik-action.active {
  border: 2px solid rgb(var(--primary-color));
}
.grafik-actions .grafik-action.active .fill {
  background-color: rgb(var(--primary-color));
}
.grafik-actions .grafik-action.grafik-action-0 {
  display: flex;
  align-items: flex-end;
  width: 30px;
}
.grafik-actions .grafik-action.grafik-action-0 .fill {
  height: 3px;
  background: black;
  width: 100%;
  display: flex;
}
.grafik-actions .grafik-action.grafik-action-1 {
  display: flex;
  align-items: flex-end;
}
.grafik-actions .grafik-action.grafik-action-1 .fill {
  height: 7px;
  background: black;
  width: 100%;
  display: flex;
}
.grafik-actions .grafik-action.grafik-action-2 {
  display: flex;
  align-items: flex-end;
}
.grafik-actions .grafik-action.grafik-action-2 .fill {
  height: 14px;
  background: black;
  width: 100%;
  display: flex;
}
.grafik-actions .grafik-action.grafik-action-3 {
  display: flex;
  align-items: flex-end;
}
.grafik-actions .grafik-action.grafik-action-3 .fill {
  height: 19px;
  background: black;
  width: 100%;
  display: flex;
}
.vozilo-options-inner {
  z-index: 10;
  box-shadow: 0 0.3px 1.9px rgba(0, 0, 0, 0.021), 0 0.7px 4.3px rgba(0, 0, 0, 0.025), 0 1.3px 7.7px rgba(0, 0, 0, 0.026), 0 2.1px 12.8px rgba(0, 0, 0, 0.028), 0 3.4px 21.2px rgba(0, 0, 0, 0.033), 0 6px 37px rgba(0, 0, 0, 0.047), 0 13px 80px rgba(0, 0, 0, 0.12);
}
.vozilo-options-inner .vozilo-option {
  width: 100%;
  display: flex;
  align-items: center;
  transition: 0.32s all;
}
.vozilo-options-inner .vozilo-option:hover {
  background-color: rgba(22, 161, 134, 0.075);
}
.vozilo-options-inner .vozilo-option:hover svg {
  fill: var(--pozicija-dark) !important;
}
.vozilo-options-inner .vozilo-option:hover svg path {
  fill: var(--pozicija-dark) !important;
}
.vozilo-options-inner .vozilo-option:hover p {
  color: var(--pozicija-dark);
}
.vozilo-options-inner .vozilo-option svg {
  width: 17px;
  height: 17px;
}
.vozilo-options-inner .vozilo-option p {
  position: relative;
  top: 1px;
  font-size: 15px;
  margin-left: 6px;
  font-weight: 500;
}

#mapa {
  height: calc(100vh - 38px);
}

#mapaOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
  z-index: 999;
  display: none;
}

.marker-icon .marker-container {
  max-width: 80px;
  width: 100%;
  text-align: center;
}
.marker-icon .marker-container img {
  width: 32px;
  display: inline-block;
}
.marker-icon .marker-container label {
  display: block;
  background: white;
  font-size: 12px;
  transform: translateY(-8px);
  /* border: 1px solid #ababab; */
  color: #101010;
  padding: 3px;
  text-transform: uppercase;
  font-weight: 500;
  border-radius: 4px;
  /* -webkit-box-shadow: 0px 0px 1px #717171; */
  /* box-shadow: 0px 0px 1px #717171; */
  box-shadow: 2px 2px 6px rgba(9, 132, 227, 0.33);
  border: 1px solid rgba(9, 132, 227, 0.3490196078);
}
.marker-icon .marker-circle {
  max-width: 30px;
  width: 100%;
  text-align: center;
}
.marker-icon .marker-circle label {
  display: block;
  font-size: 14px;
  transform: translateY(0px);
  border: 1px solid black;
  color: white;
  font-weight: bold;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  box-shadow: none;
  padding: 0px;
  line-height: 30px;
  overflow: hidden;
}

.leaflet-marker-pane * {
  -webkit-transition: transform 0.3s linear;
  -moz-transition: transform 0.3s linear;
  -o-transition: transform 0.3s linear;
  -ms-transition: transform 0.3s linear;
  transition: transform 0.3s linear;
}

.labelMarkerWhite {
  background-color: #E0E0E0;
}

.labelMarkerRed {
  background: #f34230 !important;
}

.labelMarkerGreen {
  background: #2ecc71 !important;
}

.labelMarkerOrange {
  background: #f1c40f !important;
}

.labelMarkerViolet {
  background: darkviolet !important;
}

.labelMarkerBlue {
  background: #3498db !important;
}

.labelMarkerBlack {
  background: black !important;
}

.labelMarkerGrey {
  background: #7f8c8d !important;
}

.redBackgroundWithOpacity {
  background: rgba(243, 66, 48, 0.4);
}

.greenBackgroundWithOpacity {
  background: rgba(46, 204, 113, 0.4);
}

.blueBackgroundWithOpacity {
  background: rgba(52, 152, 219, 0.4);
}

.marker-gmaps .marker-container label {
  transform: translateY(0px);
}

.mapa-wrap img {
  max-height: none;
}

.side.left {
  position: relative;
  background-color: rgba(var(--primary-color), 0.13);
  overflow: hidden;
}
.side.left img {
  position: relative;
  z-index: 3;
  width: 60%;
}
.side.left::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url("../images/gps.jpg");
  background-size: cover;
  background-position: center;
  z-index: 1;
  filter: blur(10px);
}
.side.left::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 2;
}
.side.right .side-content {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.side.right .side-content .form {
  margin-top: 20px;
  margin-bottom: 20px;
}
.side.right .side-content .input {
  padding-left: 5px;
  padding-right: 5px;
}
.side.right .side-content .input.focused {
  border-color: rgb(var(--primary-color));
}
.side.right .side-content .input.focused i {
  color: rgb(var(--primary-color));
}
.side.right .side-content .input i {
  width: 26px;
}
.side.right .side-content .input input {
  flex: 1;
  font-size: 18px;
  font-weight: 500;
}
.side.right .side-content .remember {
  margin-top: 25px;
}
.side.right .side-content .buttons button {
  position: relative;
}
.side.right .side-content .buttons button .border-btn {
  position: absolute;
}
.side.right .side-content .buttons button .border-btn:nth-of-type(1) {
  width: calc(50% + 2px);
  height: calc(100% + 4px);
  top: -2px;
  left: -2px;
  background-color: black;
  z-index: 3;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.side.right .side-content .buttons button .border-btn:nth-of-type(2) {
  width: calc(50% + 2px);
  height: calc(100% + 4px);
  top: -2px;
  right: -2px;
  background-color: black;
  z-index: 3;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.side.right .side-content .buttons button .border-btn:nth-of-type(3) {
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  background-color: #fff;
  z-index: 4;
  border-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  transition: 0.32s ease-in-out;
}
.side.right .side-content .buttons button:first-of-type {
  grid-column: 1/7;
}
.side.right .side-content .buttons button:nth-of-type(2) {
  grid-column: 7/10;
}
.side.right .side-content .buttons button:nth-of-type(3) {
  grid-column: 10/13;
}
.side.right .side-content .buttons button span {
  position: relative;
  top: 1px;
  z-index: 6;
  font-size: 17px;
}
.side.right .side-content .buttons button.bg-green:hover {
  background-color: #0e7e61;
}
.side.right .side-content .buttons button.bg-white:hover .border-btn:nth-of-type(3) {
  background-color: #f3f2f2;
}
.side.right .side-content h4 {
  font-size: 2.5rem;
  font-weight: 600;
}
.side.right .side-content p {
  color: #555;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
}

.podkorisnici-inner .podkorisnici-inner-w {
  overflow-y: hidden;
}
.podkorisnici-inner .podkorisnici-inner-w .dodaj-podkorisnik-div {
  overflow: auto;
  height: 100%;
  padding-bottom: 20px;
}
.podkorisnici-inner .podkorisnici-inner-w .lista-podkorisnici-div {
  overflow: auto;
  height: 100%;
  padding-bottom: 20px;
}

.group-devices button {
  background-color: transparent;
  color: rgb(var(--soft-txt-color));
  font-weight: 600;
  border-bottom: 2px solid rgb(var(--soft-txt-color));
}
.group-devices button:not(.opacity-5) {
  border-bottom: 2px solid var(--opcii-dark);
  color: var(--opcii-dark);
}
.izvestai-div .checkContainer input:checked ~ .checkmark {
  background-color: var(--izvestai-dark);
}
.izvestai-div .button-primary {
  background-color: var(--izvestai-dark) !important;
}
.izvestai-div .button-primary:hover {
  background-color: var(--izvestai-darker) !important;
}

.content__bottom-right[data-nav=izvestai] .button-primary {
  background-color: var(--izvestai-dark) !important;
}
.content__bottom-right[data-nav=izvestai] .button-primary:hover {
  background-color: var(--izvestai-darker) !important;
}

.istorija-div .button-primary:hover {
  background-color: var(--istorija-darker) !important;
}

.posledenKlik {
  background-color: rgba(var(--primary-color), 0.14) !important;
}

.nagradna {
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgb(var(--main-bg-color));
  z-index: 9999;
}

.confetti {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: -1;
}

.confetti-piece {
  position: absolute;
  width: 8px;
  height: 16px;
  background: #ffd300;
  top: 0;
  opacity: 0;
}
.confetti-piece:nth-child(1) {
  left: 7%;
  transform: rotate(74deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 11ms;
  animation-duration: 527ms;
}
.confetti-piece:nth-child(2) {
  left: 14%;
  transform: rotate(49deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 258ms;
  animation-duration: 701ms;
}
.confetti-piece:nth-child(3) {
  left: 21%;
  transform: rotate(-45deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 118ms;
  animation-duration: 664ms;
}
.confetti-piece:nth-child(4) {
  left: 28%;
  transform: rotate(6deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 180ms;
  animation-duration: 583ms;
}
.confetti-piece:nth-child(5) {
  left: 35%;
  transform: rotate(65deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 74ms;
  animation-duration: 603ms;
}
.confetti-piece:nth-child(6) {
  left: 42%;
  transform: rotate(56deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 293ms;
  animation-duration: 746ms;
}
.confetti-piece:nth-child(7) {
  left: 49%;
  transform: rotate(-13deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 35ms;
  animation-duration: 553ms;
}
.confetti-piece:nth-child(8) {
  left: 56%;
  transform: rotate(50deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 253ms;
  animation-duration: 709ms;
}
.confetti-piece:nth-child(9) {
  left: 63%;
  transform: rotate(12deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 189ms;
  animation-duration: 638ms;
}
.confetti-piece:nth-child(10) {
  left: 70%;
  transform: rotate(46deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 110ms;
  animation-duration: 532ms;
}
.confetti-piece:nth-child(11) {
  left: 77%;
  transform: rotate(38deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 320ms;
  animation-duration: 730ms;
}
.confetti-piece:nth-child(12) {
  left: 84%;
  transform: rotate(15deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 186ms;
  animation-duration: 557ms;
}
.confetti-piece:nth-child(13) {
  left: 91%;
  transform: rotate(-44deg);
  animation: makeItRain 700ms infinite ease-out;
  animation-delay: 205ms;
  animation-duration: 719ms;
}
.confetti-piece:nth-child(odd) {
  background: #17d3ff;
}
.confetti-piece:nth-child(even) {
  z-index: 1;
}
.confetti-piece:nth-child(4n) {
  width: 5px;
  height: 12px;
  animation-duration: 1400ms;
}
.confetti-piece:nth-child(3n) {
  width: 3px;
  height: 10px;
  animation-duration: 1750ms;
  animation-delay: 700ms;
}
.confetti-piece:nth-child(4n-7) {
  background: #ff4e91;
}

@keyframes makeItRain {
  from {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  to {
    transform: translateY(100vh);
  }
}
.nagradna-broevi .nagradna-broj {
  cursor: pointer;
  transition: 0.23s ease-in-out;
  background-color: rgb(var(--bg-color-1));
  transform: scale(1);
  position: relative;
  z-index: 1;
}
.nagradna-broevi .nagradna-broj:hover {
  transform: scale(1.1);
  background-color: rgb(var(--primary-color));
  z-index: 2;
}
.nagradna-broevi .nagradna-broj:hover p {
  color: white;
}
.nagradna-broevi .nagradna-broj:nth-of-type(49) {
  grid-column: 1/5;
}
.nagradna-broevi .nagradna-broj:nth-of-type(50) {
  grid-column: 5/9;
}

/*# sourceMappingURL=main.css.map */