.aaa {
    background-color: #aaa;
}

.bbb {
    background-color: #bbb;
}

.ccc {
    background-color: #ccc;
}

.ddd {
    background-color: #ddd;
}

.eee {
    background-color: #fff; /* #eee */
}

.fff {
    background-color: #fff;
}

.mt-50 {
    margin-top: 50px;
}

.mt-100 {
    margin-top: 100px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-100 {
    margin-bottom: 100px;
}

.bg-light-blue {
    background-color: #A2E4F9;
}

.bg-medium-blue {
    background-color: #54C6EB;
}

.bg-dark-blue {
    background-color: #0278B8;
}

.bg-darker-blue {
    background-color: #55808E;
}

.overflow-hidden {
    overflow: hidden;
}

.box-shadow {
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, .05);
}

/*bootstrap buttons color override*/
.btn:focus {
    box-shadow: none !important;
}

.btn-primary, .btn-success {
    border: none;
}

.btn-primary, .btn-primary:visited {
    background-color: #006CB7 !important;
}

.btn-primary:hover, .btn-primary:active {
    background-color: #005FA3 !important;
}

.btn-success, .btn-success:visited {
    background-color: #007860 !important;
}

.btn-success:hover, .btn-success:active {
    background-color: #006853 !important;
}

.btn-outline-success, .btn-outline-success:visited {
    border-color: #007860 !important;
    color: #007860;
}

.btn-outline-success:hover, .btn-outline-success:active {
    background-color: #007860 !important;
    color: #fff;
}

.btn-danger, .btn-danger:visited {
    background-color: #D7262D !important;
}

.btn-danger:hover, .btn-danger:active {
    background-color: #BE2227 !important;
}

/*bootstrap buttons color override end*/

.b-shadow {
    border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;

    position: relative;
    z-index: 1;
}

.border-top-custom {
    border-top: 1px solid #e8e8e8;
}

.border-bottom-custom {
    border-bottom: 1px solid #e8e8e8;

}

.img-shadow {
    box-shadow: 0 3px 40px 0 rgba(0, 0, 0, 0.20), 0 1px 3px 0 rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1;
}

.overlay-color {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: 0.4s ease all;
}

.overlay-background {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.overlay-text {
    z-index: 3;
}

.o-hoverable:hover {
    opacity: 0 !important;
}

.o-hover-10:hover, .o-hover-10:focus, .o-hover-10:active {
    opacity: 1;
}

.o-hover-8:hover, .o-hover-8:focus, .o-hover-8:active {
    opacity: 0.8;
}

.o-0 {
    opacity: 0;
}

.o-1 {
    opacity: 0.1;
}

.o-2 {
    opacity: 0.2;
}

.o-3 {
    opacity: 0.3;
}

.o-4 {
    opacity: 0.4;
}

.o-5 {
    opacity: 0.5;
}

.o-6 {
    opacity: 0.6;
}

.o-7 {
    opacity: 0.7;
}

.o-8 {
    opacity: 0.8;
}

.o-9 {
    opacity: 0.9;
}

.o-10 {
    opacity: 1;
}

.decoration-none, .decoration-none:hover, .decoration-none a, .decoration-none a:hover {
    text-decoration: none;
}

* {
    outline: none;
}

.text-underline-0 {
    text-decoration: none !important;
}

.text-underline-0:hover {
    text-decoration: none !important;
}

.hover-darken * {
    filter: brightness(100%);
    transition: all ease 0.2s;
}

.hover-darken:hover * {
    filter: brightness(80%);
}

html, body {
    font-family: "bodyFont";
    width: 100%;
    overflow-x: hidden;
}

big {
    font-size: larger;
}

.f-mt, h1, h2, h3, h4, h5, h6 {
    font-family: "casafont";
}

/*header*/
.top-header {
    height: 30px;
    position: relative;
    z-index: 22;
    transition: all 0.3s ease;
}

.top-header .tiny-logo {
    height: 15px;
}

.top-header .list-inline-item:hover, .top-header .list-inline-item.active {
    border-bottom: 1px solid #CD0C29;
    height: 30px;
}

.top-header .list-inline-item > a {
    color: #333;
    text-decoration: none;
    font-size: 90%;
    line-height: 30px;
}

.top-header .language-selector {
    border: none;
    background-color: transparent;
    font-size: 90%;
    height: 100%;
    color: #333;
}

.slide-up-top-header {
    transform: translateY(0);
}

.slide-down-top-header {
    transform: translateY(0);
}

.black-bg-section .height-40 {
    height: 40em;
}

.header-container {
    transition: all 0.3s ease;
    position: fixed;
    width: 100%;
    z-index: 99;
    top: 0;
    /*height: 66px;*/
}

.sticky-anchor {
    width: 100%;
    height: 66px;
    background: transparent;
}

.sidebar-projects a {
    color: var(--secondary);
    transition: color ease 0.1s;
}

.sidebar-projects h3 {
    font-size: 10pt;
}

.sidebar-projects a:hover {
    color: var(--dark);
}

.project-description-list {
    margin: 2em 0;
    padding: 1em 0;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-color: #eee;
}

.project-description-list li {
    border-right: 1px solid;
    border-color: #eee;
    display: inline-block;
    padding: 0 2em 0 1.5rem;
    margin: 10px 0;
}

.project-description-list li:last-child {
    border-right: none;
}

.project-description-list li span {
    color: var(--secondary);
    font-weight: bold;

}

.project-description-list li p {
    color: var(--dark);
    margin: 0.2em 0;
    font-size: 11pt;
}

.project-content-container {
    padding: 1.5rem;
}

.project-content-container span {
    color: var(--secondary);
    font-weight: bold;
}

.project-img {
    width: 260px;
    height: 100%;
}

.parking-project-list {
    right: 0;
}

.parking-project-list li {
    margin: 5px 0;
}

.white-bg {
    background-color: white;
}

.header {
    background-color: white;
}

.gps-control-header.header {
    background: white;
}

.img-white {
    filter: grayscale(0) brightness(100%);
}

.gps-control-header.header .navbar-nav .nav-item .nav-link {
    color: var(--dark) !important;
}

.gpsctrl-video {
    margin-top: 64px;
}

@media (min-width: 576px) {
    .gps-control-header.header {
        background: white !important;
    }

    .img-white {
        filter: grayscale(0) brightness(100%);
    }

    .header-container {
        top: 0;
    }

    .gpsctrl-video {
        margin-top: 64px;
    }
}

@media (min-width: 768px) {
    .gps-control-header.header {
        background: white !important;
    }

    .img-white {
        filter: grayscale(0) brightness(100%);
    }

    .header-container {
        top: 0;
    }

    .gpsctrl-video {
        margin-top: 64px;
    }

}

@media (min-width: 992px) {
    .gps-control-header.header {
        background: none !important;
    }

    .img-white {
        filter: grayscale(1) brightness(400%);
    }

    .header-container {
        top: 30px;
    }

    .slide-up-top-header {
        transform: translateY(-30px);
    }

    .slide-down-top-header {
        transform: translateY(30px);
    }

    .gps-control-header.header .navbar-nav .nav-item .nav-link {
        /*color: #f8f9fa !important;*/
    }

    .sticky-anchor {
        height: 96px;
    }

    .gpsctrl-video {
        margin-top: 0;
    }

}

@media (min-width: 1200px) {
    .gps-control-header.header {
        background: none !important;
    }

    .img-white {
        filter: grayscale(1) brightness(400%);
    }

    .header-container {
        top: 30px;
    }

    .slide-up-top-header {
        transform: translateY(-30px);
    }

    .slide-down-top-header {
        transform: translateY(30px);
    }
    .gps-control-header.header .navbar-nav .nav-item .nav-link {
        /*color: #f8f9fa !important;*/
        color: #343a40 !important;
    }

    .sticky-anchor {
        height: 96px;
    }

    .gpsctrl-video {
        margin-top: 0;
    }

}

.header-shadow {
    box-shadow: 0 1px 1px rgba(0, 0, 0, .15);
}

.last-update {
    font-size: 10pt;
    color: #ffffff94;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #6c757d !important;
}

.header .navbar-brand {
    height: 50px;
    max-width: 202px;
    display: flex;
}

.header .navbar-brand img {
    height: 100%;
    max-width: 100%;
}

.header .navbar-nav {
    margin: -0.5rem 0;
}

.header .navbar-nav .nav-item .nav-link {
    height: 66px;
    line-height: calc(66px + 4px);
    padding: 0;
    margin: 0 1rem;
    font-weight: bold;
}

.gps-control-header.text-dark.header .navbar-nav .nav-item .nav-link {
    color: var(--dark) !important;
}

.white-bg .gps-control-header.header .navbar-nav .nav-item .nav-link {
    color: #343a40 !important
}

.header .navbar-nav .nav-item .nav-link:hover, .header .navbar-nav .nav-item.active .nav-link {
    border-bottom: 2px solid #CD0C29;
}

.header .navbar-nav .nav-item .action-button {
    margin-top: 15px;
}

.header .navbar-nav .dropdown-menu {
    border-radius: 0;
    border: none;
    margin: 0 1rem;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .25);
    padding: 0;
}

.header .navbar-nav .dropdown-menu .dropdown-item {
    padding: 0.8rem 1.8rem;
}

.header .navbar-nav .dropdown-menu .dropdown-item:active {
    background-color: #1d1d1d;
    color: #eeeeeee;
}

.gps-control-truck {
    position: relative;
}

#cloud {
    position: absolute;
    top: 80px;
    left: 30px;
}

#truck {
    position: absolute;
    top: 20.4rem;
}

#road {
    position: absolute;
    width: 200%;
    top: 32rem;
    left: -50%;
}

.park-control-box {
    background-image: url(/system/view/site/layout/img/box.png);
    background-repeat: no-repeat;
    background-position: center 1em;
    background-size: cover;
    background-attachment: fixed;
}

.park-control-box .description {
    color: #dedfe0;
}

/*header end*/

/*banner*/
.banner .svg-container {
    padding: 0;
}

.index-more-button {
    font-size: 15pt;
    z-index: 20;
}

.index-blog-img-container {
    height: 12em;
    overflow: hidden;
}

.index-blog-img-container img {
    height: 100%;
    min-width: 100%;
}

.banner .description {
    letter-spacing: 2px;
    color: #4e4e4e;
    width: 50%;
    margin: 0 auto;
    font-size: 14pt;
}

/*banner end*/

/*we offer*/
.we-offer .title {
    font-size: 30px;
    letter-spacing: 0.2px;
    line-height: 1.3;
}

.we-offer .split-screen {
    height: 500px;
}

.we-offer .split-screen > .col {
    background-size: cover;
    background-repeat: no-repeat;
}

.we-offer .split-screen > .gps-control {
    background-image: url("/system/view/site/layout/img/gps.jpg");
    /*background-position: 0% 65%;*/
    /*background-color:darkgrey;*/
    /*background-size: 100em;*/
    background-size: cover;
}

.we-offer .split-screen > .park-control {
    background-image: url("/system/view/site/layout/img/parking.jpg");
    background-position: 0% 50%;
    /*background-color:grey;*/

}

.grey {
    filter: grayscale(50%);
}

.grey-client {
    filter: grayscale(100%);
    transition: filter ease 0.3s;
}

.grey-client:hover {
    filter: grayscale(10%);
}

.not-grey {
    filter: grayscale(0%) !important;
}

.we-offer .split-screen .gps-control .info-box {
    /*background-color: #006E92;*/
    color: #fff;
}

.we-offer .split-screen .park-control .info-box {
    /*background-color: #0073C2;*/
    color: #fff;
}

.we-offer .split-screen .info-box {
    width: 300px;
    margin-top: calc(500px - 350px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .25);
    position: relative;
    z-index: 20;
    background-color: rgba(0, 0, 0, 0.76);
    border: 1px solid rgba(255, 255, 255, 0.71);
    transition: all ease 0.3s

}

.parking-section-index ul li {
    /*color: #cf092c;*/
}

.parking-section-texts p {
    line-height: 1.8;
}

.parking-section-index ul li span {
    color: #343a40;
}

.parking-section-index h2 {
    font-size: 42px;
}

.parking-section-index .img-container img {
    max-height: 40em;
}

.we-offer .split-screen .info-box:hover {
    background-color: rgba(0, 0, 0, 0.95);

}

.we-offer .split-screen .info-box.hovered {
    background-color: rgba(0, 0, 0, 0.95);
}

.we-offer .split-screen .info-box img {
    height: 45px;
}

.we-offer .split-screen .info-box ul li {
    margin: 10px 0;
    font-size: 14pt
}

.we-offer .split-screen .info-box ul li a {
    color: #fff;
}

/*we offer end*/

/*clients list*/
.clients-list {

}

.carousel-indicators {
    bottom: -40px;
    opacity: 0.7;
}

.carousel-indicators li {
    background: var(--secondary);
    cursor: pointer;
}

.carousel-indicators .active {
    background: var(--dark);
}

.carousel-item .row div {
    text-align: center;
}

.clients-list > div {
    display: block;
    overflow: hidden;
    height: 50px;
    margin-top: 50px;
}

.clients-list > div:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.clients-list > div > img {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    max-width: 80%;
    height: auto;
    max-height: 100%;
    opacity: 1;
    cursor: pointer;
}

.clients-list > div > img:hover {
    opacity: 1;
}

/*clients list end*/
/*partners*/

.partners {
    background-color: #1d2125;
}

.footer-dark {
    background-color: #1f1f1f;
}

.text-semi-light {
    color: #a7aaad;
}

a.text-semi-light:hover {
    color: #bcc0c3;

}

.border-semi-light {
    border-color: #a7aaad;
}

.social-media-icons li a i {
    font-size: 20pt;
}

.footer-darker {
    background-color: #0c0c0c;
}

.golden {
    color: #ffd700;
}

.partners .partner-logos .partners-img {
    opacity: 0.6;
    /*transition:opacity 0.3s ease;*/
}

.partners .partner-logos .partners-img:hover {
    opacity: 0.99;
}

.partners .partner-logos a:hover {
    text-decoration: none;
}

/* partners end*/
/*usage area*/
.usage-areas {

}

.parking-black-bg-text span {
    background: #000000a6;
    padding: 5px 10px 9px 10px;
    display: inline-block;
    line-height: 40px;
    margin: 4px 0;
    /*font-size: 24pt;*/
}

.custom-tabs {
    border-bottom: 1px solid #dedede;

}

.parking-bg-img {
    background-image: url('/system/view/site/layout/img/slide3.jpg');
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
}

.bg-black {
    background-color: #000;
}

.custom-tabs .nav-item .nav-link {
    padding: 5px 3px;
    color: var(--gray);
}

.custom-tabs .nav-item .nav-link.active {
    color: var(--gray-dark);

    border-bottom: 4px solid var(--gray-dark);
    font-weight: bold;
}

.usage-areas .usage-list .rounded-circle {
    /*background-color: #008267;*/
    transition: 0.5s ease all;
}

.usage-areas .usage-list .rounded-circle img {
    padding: 2.2rem !important;
}

.usage-areas .usage-list > div {
    perspective: 500px;
}

.usage-areas .row {
    perspective: 500px;
}

.skew {
    transform: skew(-8deg);
    transform: scale(1.16) skew(-5deg);
}

.usage-area {

    height: 25em;
    background-repeat: no-repeat;
    background-position: 65% center;
    background-size: cover;
}

.usage-area.dist {
    background-image: url(/system/view/site/layout/img/usage-areas2/distribution.jpg);
}

.usage-area.police {
    background-image: url(/system/view/site/layout/img/dav-pol2.jpg);
}

.usage-area.airport {
    background-image: url(/system/view/site/layout/img/usage-areas2/airport.jpg);
}

.usage-area.truck {
    background-image: url(/system/view/site/layout/img/ambulance2.jpg);
}

.usage-area.excavation {
    background-image: url(/system/view/site/layout/img/usage-areas2/excavation.jpg);
}

.bog-icon {
    max-width: none !important;
    width: 10em;
}

/*usage area end*/

/*features slider*/
.features-carousel .carousel-inner {
    height: 650px;
    width: 100%;
}

.features-carousel .carousel-indicators {
    bottom: 0;
    margin-bottom: 0;
}

.features-carousel .carousel-item .row {
    height: 80%;
}

.features-carousel .carousel-indicators li {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #ddd;
    cursor: pointer;
}

.overflow-visible {
    /*overflow: visible !important;*/
}

.features-carousel .carousel-indicators .active {
    background-color: #343a40 !important;
}

.carousel-item.first img {
    position: absolute;
    width: 70em;
    lefT: -35em;
    top: -4em;
    z-index: 1;
}

.carousel-item.second img {
    position: absolute;
    width: 85em;
    lefT: -46em;
    top: -5em;
    z-index: 1;
}

.carousel-item.third img {
    position: absolute;
    width: 80em;
    lefT: -38em;
    top: -13em;
    z-index: 1;
}

.carousel-item.fourth img {
    position: absolute;
    width: 80em;
    lefT: -40em;
    top: -8em;
    z-index: 1;
}

.carousel-item .col-md-6 {
    z-index: 20;
}

.carousel-item .col-md-6 h3, .carousel-item .col-md-6 p {
    padding: 2px 3px;
    /*background: rgba(238, 238, 238, 0.67);*/
}

/*features slider end*/

/* demo form */
.demo-form-container input:hover {
    /*background:red;*/

}

* input:active, * input:focus {
    box-shadow: none !important;
    outline: none !important;
    border-color: var(--secondary) !important;
}

/* demo form end */
.blogpost-link, .blogpost-link * {
    transition: all 0.2s ease;
}

.blogpost-link img {
    filter: brightness(100%);

}

.blogpost-link:hover {
    text-decoration: none;
}

.blogpost-link:hover .post-title {
    color: var(--dark);
}

.blogpost-link:hover .category-date span {
    color: black;
}

.blogpost-link:hover img {
    filter: brightness(70%);
}

.blog-socmedia li {
    display: inline-block;
    margin: 0 1.3rem;
    text-align: center;
    justify-content: center;
}

.blog-socmedia li i {
    font-size: 16pt;
}

div.row.small-posts .col-lg-4 {
    padding: 0 1em;
}

div.row.small-posts .col-lg-4:not(:nth-child(3n)) {
    border-right: 1px solid #e2e2e2;
}

/*several blog posts*/
.several-blog-posts .thumbnail {
    width: 100%;
    height: 0;
    padding-bottom: 60%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.parkomats {
    background: url("/system/view/site/layout/img/boxes.png");
    background-repeaT: no-repeat;
    background-size: 28em;
    background-position: 68vw 4em;

    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99;
}

.parkomats-container {
    top: unset;
    height: 25em;
}

#blog-search:active, #blog-search:focus {
    border-right: none;
    border-color: #ced4da !important;
}

/*several blog posts end*/

/* gps control video header */
.container-gps {
    height: 40px;
}

.container-gps ul li {
    font-size: 22pt;
}

.gpsctrl-video {
    height: 64vh;
}

.gpsctrl-video .video-container {
    position: absolute;
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: -1;
}

.gpsctrl-video .video {
    width: 100%;
    height: 100%;
}

@media only screen and (min-width: 1400px){
    .gpsctrl-video .video{
        object-fit: cover;
    }
}

/* gps control video header end   */

/*gps control intro */
.road-line {
    width: 100%;
    height: 7em;
    background: url(/system/view/site/layout/img/road-line2.png);
    background-position: 50% 100%;
    background-repeat: no-repeat;
    background-size: 200em;
}

/*gps control intro end*/

/*pricing*/
h2.card-title {
    font-size: 30pt;

    font-weight: 800;
    text-shadow: 0px 3px 1px rgba(0, 0, 0, 0.10);

}

.pricing-card-title {
    font-size: 60pt;
    text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.15);
    position: relative;

    display: inline-block;
}

.pricing-card-description {
    color: #dadada;
}

.pricing-card-shadow {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);

}

.pricing-card-title sup {
    font-size: 25pt;
    font-weight: normal;
    position: absolute;
    top: 30px;
    left: -20px;
}

.card-rounded {
    border-radius: 2%;
}

.tick-color {
    color: #359dba;
}

.bg-white {
    background-color: #fff;
}

/*pricing end*/

/*trackers */
.trackers .tracker {
    border: 1px solid rgba(255, 255, 255, 0);
}

.trackers .tracker:hover {
    border: 1px solid #dbdbdb;
    text-decoration: none;
}

/* trackers end*/

/*helper*/
.spacer {
    height: 20em;
}

.btn-hovered {
    background: var(--light) !important;
    color: var(--dark)
}

/*helper end*/

/*gps features list header*/
.gps-features-list-header {

}

.viewpost img {
    width: 100%;
    height: auto;
}

.gps-features-list-header .gps-features-list .feature {
    color: #333;
    cursor: pointer;
}

.gps-features-list-header .gps-features-list .feature:hover, .gps-features-list-header .gps-features-list .feature.active {
    background-color: #0086B0;
}

.gps-features-list-header .gps-features-list .feature a {
    text-decoration: none;
    color: #333;
}

.gps-features-list-header .gps-features-list .feature:hover a, .gps-features-list-header .gps-features-list .feature.active a {
    color: #fff;
}

.gps-features-list-header .gps-features-list .feature svg {
    fill: #333;
}

.gps-features-list-header .gps-features-list .feature:hover svg, .gps-features-list-header .gps-features-list .feature.active svg {
    fill: #fff;
}

.gps-features-list-header .gps-features-list svg {
    width: 65px;
}

.gps-features-list-header .gps-features-list h2 {
    font-size: 18px;
    text-decoration: none;
}

/*gps features list header end*/

.img-badge {
    position: absolute;
    left: 15px;
    top: 15px;
}

.small-blog-img {
    height: 100%;
    min-width: 100%;
}

.blog-img-container {
    position: relative;
    height: 12em;
    overflow: hidden;
}

/*gps features*/

.feature-body img {
    max-width: 100%;
    height: auto;
}

.width-25-em {
    width: 25em;
}

ul.sublist {
    margin: 12px 0 0 0;
    padding-left: 0px;
    list-style: none;
}

ul.sublist li {
    font-size: 10pt;
    vertical-align: middle;
    padding-left: 1em;
    text-indent: -.7em;
}

ul.sublist li::before {
    content: "• ";
    color: grey; /* or whatever color you prefer */
    font-size: 18pt;
}

ul.sublist li.active::before {
    content: "• ";
    color: #cf092c; /* or whatever color you prefer */
}

ul.sublist li a.sublist-link {
    vertical-align: super;
}

.products-nav ul {
    font-size: 10pt;
}

.products-nav ul.side-column > li {
    padding: 8px 15px;
    border-left: 5px solid rgba(46, 46, 46, 0.58);
}

.products-nav ul.side-column > li a {
    color: rgb(46, 46, 46);
}

.products-nav ul.side-column > li.active {
    border-left-color: #cf092c;
}

.products-nav li.active > a {
    font-weight: bold;
}

.products-nav ul.side-column > li.active:hover {
    border-left-color: #b20827;
}

.products-nav ul.side-column > li:hover {
    border-left-color: rgba(46, 46, 46, 0.91);
}

.products-nav ul.side-column > li:hover a {
    text-decoration: none;
}

.product a:hover span.text-dark.small {
    text-decoration: none !important;
}

.feature-body img {
    max-width: 100%;
    height: auto;
}

.categories {
    margin-top: 2em;
}

.features-nav ul {
    font-size: 10pt;
}

.features-nav ul li {
    padding: 8px 15px;
    border-left: 5px solid rgba(46, 46, 46, 0.58);
    /*border-bottom:1px solid #e2e2e2;*/
}

.features-nav ul li:last-child {
    border-bottom: none;

}

.features-nav ul li a {
    color: rgb(46, 46, 46);
}

.features-nav ul li.active {
    border-left-color: #cf092c;
}

.features-nav ul li.active a {
    font-weight: bold;
}

.features-nav ul li.active:hover {
    border-left-color: #b20827;
}

.features-nav ul li:hover {
    border-left-color: rgba(46, 46, 46, 0.91);
}

.features-nav ul li:hover a {
    text-decoration: none;
}

.categories {
    margin-top: 2em;
}

.features-nav ul {
    font-size: 10pt;
}

.features-nav ul li {
    padding: 8px 15px;
    border-left: 5px solid rgba(46, 46, 46, 0.58);
    /*border-bottom:1px solid #e2e2e2;*/
}

.features-nav ul li:last-child {
    border-bottom: none;

}

.features-nav ul li a {
    color: rgb(46, 46, 46);
}

.features-nav ul li.active {
    border-left-color: #cf092c;
}

.features-nav ul li.active a {
    font-weight: bold;
}

.features-nav ul li.active:hover {
    border-left-color: #b20827;
}

.features-nav ul li:hover {
    border-left-color: rgba(46, 46, 46, 0.91);
}

.features-nav ul li:hover a {
    text-decoration: none;
}

.feature-screen .feature-image {
    height: 500px;
}

/*gps features end*/

/*imac block*/
.imac-block {
    background-image: url("/system/view/site/layout/img/imac/imac-bg-vector.svg");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.imac-block .screenshot {
    position: absolute;
    z-index: 1;
    top: 4.65%; /* do not change this values */
    left: 3.95%; /* do not change this values */
    width: 92.1%; /* do not change this values */
}

.imac-block .light {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    z-index: 2;
}

/*imac block end*/

/*contact line*/
.contact-line {
    background-color: #122636;
}

/*contact line end*/

/*tarifs table*/
.tarifs-table td {
    vertical-align: middle;
}

.tarifs-table thead td h2 {
    font-size: 20px;
}

.tarifs-table thead td p {
    opacity: 0.8;
}

.tarifs-table tbody td:first-child {
    text-align: left;
}

.tarifs-table tbody td {
    text-align: center;
    border-right: 1px solid #ccc;
}

/*tarifs table end*/

/* PARKING PROJECTS */
.collapse-button {
    font-size: 13pt;
    padding: 1em;
}

.parking-projects-img {
    width: 100%;
    height: 10em;
    border-bottom: 2px solid;
    border-color: #cf092c;
}

.parking-project-count {
    border-left: 5px solid #cf092c;
    padding-left: 30px;
}

.aparature-view-more {
    vertical-align: middle;
    line-height: 16px;
}

.my-custom-class-for-label {
    width: 50px;
    height: 20px;

    border: 1px solid #005da7;
    border-radius: 5px;

    background: #fff;
    color: #005da7;
    text-align: center;
    line-height: 20px;

    font-weight: bold;
    font-size: 14px;
}

#map {
    height: 40vh;
}

.project-img {
    width: 200px;
    min-height: 120px;
    height: 100%;
}

.labels {
    font-size: 32pt !important;
}

.parking-project-list {
    right: 0;
}

.parking-project-list li {
    margin: 5px 0;
}

.parking-project-list li span {
    font-size: 10pt;
    /*background: var(--dark);*/
    color: var(--dark);
    padding: 1px 5px 1px 10px;
}

.parking-project-list li:last-child span {
    font-size: 10pt;
    background: var(--dark);
    color: var(--light);
    padding: 1px 5px 1px 10px;
}

.map-list-switch a.active {
    color: #cf092c !important;
    text-decoration: underline;
}

.sidebar > div {
    box-shadow: #0000006e 0px 1px 3px;
}

/* PARKING PROJECTS END*/

/* PARKING PRODUCTS*/

.product-item {
    height: 200px;
    text-align: center;
    font-size: 0;
    letter-spacing: -5px;
    padding: 10px;
    display: block;
}

.product {
    background: white;
    transition: all ease 0.3s;
}

.product .product-name {
    color: var(--secondary);
}

.product:hover .product-name {
    color: var(--dark);
    text-decoration: underline;
}

.products-row .column:not(:last-child) {
    border-right: 1px solid #e4e4e4;
}

.products-row .column:nth-child(4n) {
    border-right: none;
}

.product-item:before {
    content: '';
    height: 100%;
    width: 0;
    display: inline-block;
    vertical-align: middle;
}

.parking-first-screen .tab-content {
    min-height: 20em;
}

.product-item:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    /*border: 1px solid #fff;*/
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    z-index: 20;
}

.product-item-img {
    display: inline-block;
    vertical-align: middle;
    max-height: 99%;
    max-width: 99%;
}

/* PARKING PRODUCTS END*/
/*parking first screen*/
.parking-first-screen .parking-boxes {
    margin-top: -200px;
}

/*parking first screen end*/

/*park control video header*/
.parking-video {
    height: 70vh;
    background: url('/system/view/site/layout/img/parking-header.png');
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom: 5px solid #cf092c
}

.parking-video .video-container {
    position: absolute;
    height: 100%;
    width: 100%;
    overflow: hidden;
    z-index: -1;
    background-color: #0e0b04;
}

/*gps control video header end*/

/*view tracker*/
.view-tracker .nav-tabs li a {
    color: #6c757d !important;
}

.view-tracker .nav-tabs li a.active {
    background: #eee;
    color: #343a40 !important;
}

/*view tracker end*/

/*sensors page*/
.sensors-header {
    height: 20em;
    background-position: center 45%;
}

/*sensors page end*/

/*trackers header*/
.trackers-header {
    height: 20em;
    background-position: center 45%;
}

/*trackers header end*/

/*trackers list */
.trackers-list .tracker {
    display: block;
}

.trackers-list .tracker button.btn-primary {
    width: 100%;
}

.trackers-list .tracker .tracker-features li {
    margin: 5px 0;
}

/*trackers list end */

/*parking portfolio*/
.parking-photos .photo {
    height: auto;
    max-height: 500px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.parking-photos .photo img {
    transition: transform .3s ease-out .1s;
}

.parking-photos .photo:hover img {
    transform: scale(1.1);
}

.parking-photos .photo p {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .5);
    font-size: 15px;
}

/*parking portfolio end*/

/*parking solutions banner*/
.parking-solutions-banner {
    height: 35em;
}

/*parking solutions banner end*/

/*section image left*/
.image-left {
    position: relative;
}

.image-left img {
    position: absolute;
    right: 15px;
    top: 0;
}

/*section image left end*/

/* ABOUT US TIMELINE */
.tmln {
    padding: 5rem 0;
}

.timeline-controls {
    width: 99vw;
    position: relative;
    z-index: 30
}

.timeline-controls div {
    position: absolute;
    height: 15em;
    display: flex;
    align-items: center;
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, .7) 80%, rgba(255, 255, 255, 0) 100%);
}

.timeline-controls div:nth-child(2) {
    right: 0;
    background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, .7) 80%, rgba(255, 255, 255, 0) 100%);
}

.timeline-controls div i {
    font-size: 28pt;
    margin: 0 25px;
}

.timeline-container {
    width: 300vw;
    position: relative;
    border-bottom: 1px solid black;
}

.timeline-year {
    display: inline-block;
    border-left: 1px solid black;
    position: relative;
    transition: all 0.1s ease;

}

.scroll {
    position: relative;
    left: 25vw;

}

.year-number {
    position: absolute;
    top: -1.2em;
    left: -1.1em;
}

.year-container {
    padding: 0 2em;
}

.year-event-list {
    list-style: none;
    height: 15em;
    padding: 0;
    margin: 0;
}

.year-event-list li {
    display: inline-block;
    position: relative;
    width: 14em;
    margin: 0 3em;

}

.year-event-list li a {
    position: absolute;
    width: 14em;
    height: 10em;
}

.year-event-list li:nth-child(2n) a {
    top: -3em;
}

.years-list {
    list-style: none;
}

.years-list li {
    display: inline-block;
    margin: 0 2em;
}

.years-list li a {

}

/* ABOUT US TIMELINE END*/
/*about us*/
.about-us-banner {
    height: 35em;
    background-image: url(/system/view/site/layout/img/about-us.jpg);
    background-position: center 20%;
    background-repeat: no-repeat;
    background-size: cover;
}

.about-us-red-text-container {
    background: rgba(207, 9, 44, 0.8);
    box-shadow: 0 7px 15px 0 rgba(0, 0, 0, 0.26), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.about-us-red-text-container p {
    font-size: 17pt;
}

/*about us end*/

/*history fragment*/
.history-fragment .rounded-circle {
    width: 90px;
    height: 90px;
    text-align: center;
    line-height: 90px;
}

/*history fragment end*/

/*instagram feed*/
.instagram-feed .photo:hover p {
    display: block;
}

.instagram-feed .photo p {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.5);
}

/*instagram feed end*/

/* parking variants */
.variants-header {
    height: 20em;
}

.solutions-already-implemented {
    height: 30em;
}

.solution-used {
    /*height:inherit;*/
    z-index: 2;
    position: absolute;
    width: 100%;
}

.solutions-already-implemented:hover .o-hoverable {
    opacity: 0 !important;
}

/* parking variants end */

/* black bg section */

.black-bg-section {
    height: 40em;
    background-image: url(/system/view/site/layout/img/gps-hand-cut3.jpg);
    background-color: #121212;
    background-repeat: no-repeat;
    background-position: 85% 110%;
    background-size: 35em;

}

/* black bg section end*/

.gps-first-screen .image {
    max-width: 160% !important;
}

.gps-first-screen .col-lg-3 p {
    font-size: 11pt;
}

.chosen .card-body {
    padding: 50px 1.5rem !important;
}

.chosen .b-shadow {
    box-shadow: 1px 1px 20px #c8c6c6, -1px -1px 20px #c8c6c6
}

.black-bg-section .title {
    letter-spacing: -3.5px;
    line-height: 70px;
}

.features-carousel .carousel-indicators {
    bottom: 0;
}

.features-carousel .carousel-item {
    height: 650px;
    align-items: center;
}

.cases-list-tabs {
    width: 100%;
}

/* =============== Responsive Media Queries ================ */

/* Extra large devices (large desktops, 1200px and up) */
@media (max-width: 1200px) {
    .cases-list-tabs li {
        width: auto;
    }

    .features-carousel .carousel-item {
        height: 650px;
    }

    .features-carousel .carousel-indicators {
        bottom: 0;
    }

    .features-carousel .carousel-inner {
        height: 650px;
    }

    /*gps*/
    .gpsctrl-video {
        height: 80vh;
    }

    /*gps end*/
    /*parking*/
    .parking-video {
        height: 25em;
    }

    .black-bg-section .title {
        letter-spacing: -3.5px;
        line-height: 70px;
    }

    /*parking end*/

}

/* min-width: 1200 end */

/* Large devices (desktops, 992px and up) */
@media (max-width: 991px) {
    .cases-list-tabs li {
        width: auto;
    }

    .features-carousel .carousel-item {
        height: 650px;
    }

    .features-carousel .carousel-indicators {
        bottom: 0;
    }

    .features-carousel .carousel-inner {
        height: 650px;
    }

    .black-bg-section .title {
        font-size: 4.5rem;
    }

    /*common styles*/
    section .title {
        font-size: 1.8rem;
    }

    /*common styles end*/
    /*header*/
    .header .navbar-nav .nav-item:not(:last-child) {
        border-bottom: 1px solid #eee;
    }

    .header .navbar-nav .nav-item .nav-link, .header .navbar-nav .nav-item.active .nav-link, .header .navbar-nav .nav-item .nav-link:hover {
        border: none;
        margin: 0;
        height: 40px;
        line-height: 40px;
    }

    .header .navbar-nav .nav-item .action-button {
        margin: 0 !important;
        margin-top: 15px !important;
        width: 100%;
    }

    .header .navbar-nav .dropdown-menu {
        box-shadow: none;
    }

    .header .navbar-nav .dropdown-menu .dropdown-item {
        padding: 0.5rem 1.5rem;
        color: #777;
    }

    .header .navbar-nav .dropdown-menu .dropdown-item:hover {
        background-color: transparent;
        color: #333;
    }

    .header .navbar-nav .dropdown-menu .dropdown-item:active {
        background-color: transparent;
        color: #333;
    }

    /*header end*/
    /*landing*/
    .we-offer .split-screen {
        height: auto;
    }

    .we-offer .split-screen .info-box {
        margin: 0;
    }

    /*landing end*/
    /*gps*/
    .gpsctrl-video {
        height: 50vh;
    }

    .gpsctrl-video .description {
        font-size: 1rem;
    }

    .gps-first-screen .image {
        width: 100%;
    }

    /*gps end*/
    /*gps features*/
    .gps-features-list-header .gps-features-list h2 {
        font-size: 1rem;
        word-break: break-all;
    }

    .feature-screen .feature-image {
        height: auto;
    }

    .feature-screen .feature-image img {
        width: 100%;
        height: auto !important;
    }

    .feature-screen .image-left img {
        position: static;
    }

    .feature-screen .title {
        font-size: 1.5rem;
    }

    /*gps features end*/
    /*parking*/
    .parking-video {
        height: 20em;
    }

    .parking-side-image {
        width: 100%;
    }

    /*parking end*/

}

/* min-width: 992 end */

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (max-width: 768px) {
    .cases-list-tabs li {
        width: 100%;
    }

    .features-carousel .carousel-indicators {
        bottom: -20px;
    }

    .features-carousel .carousel-item {
        height: 550px;
    }

    .features-carousel .carousel-inner {
        height: 550px;
    }

    .black-bg-section .title {
        letter-spacing: 0px;
        line-height: 45px;
        font-size: 2rem;
    }

    /*landing*/
    .main-banner .title {
        font-size: 1.5em;
    }

    .main-banner .description {
        font-size: 1em;
    }

    .we-offer .title {
        font-size: 1.2em;
    }

    /*landing end*/
    /*gps*/
    .gpsctrl-video .video {
        height: 100%;
    }

    /*.features-carousel .carousel-item .content {*/
    /*height: 400px;*/
    /*}*/
    .features-carousel .title {
        font-size: 1.4rem;
    }

    .pricing .card-title {
        font-size: 1.8rem;
    }

    /*gps end*/
    /*parking solution*/
    .solutions-already-implemented {
        height: 20em;
    }

    .solutions-already-implemented h3 {
        font-size: 1.5rem;
    }

    .solutions-already-implemented h2 {
        font-size: 2.5rem;
    }

    /*parking solution end*/

}

/* min-width: 768 end */

/* Mobile devices landscape (landscape phones, 544px and up) */
@media (max-width: 544px) {
    .cases-list-tabs li {
        width: 100%;
    }

    .features-carousel .carousel-indicators {
        bottom: -20px;
    }

    .features-carousel .carousel-item {
        height: 550px;
    }

    .features-carousel .carousel-inner {
        height: 550px;
    }

    .black-bg-section .title {
        letter-spacing: 0px;
        line-height: 45px;
        font-size: 2rem;
    }

    /*header*/
    .header .navbar-brand {
        width: 60%;
    }

    /*header end*/
    /*gps*/
    .gpsctrl-video .video {
        width: 100%;
        height: 100%;
    }

    /*gps end*/

}

/* min-width: 544 end */

/* Mobile devices (portrait phones, 480px and up) */
@media (max-width: 480px) {

}

/* min-width: 480 end */

/* =============== Responsive Media Queries END ================ */
.z-index-10 {
    z-index: 10;
}

ul.blog-categories li {
    display: inline-block;
    margin: 0 3px;

}

ul.blog-categories li a {
    padding: 3px 15px;
    color: var(--dark);
}

ul.blog-categories li a.active {
    background: #eee;
}


.tarifs-table th, .tarifs-table td{
    padding: 0.6rem;
}

.gps-video-overlay{
    opacity: 0;
    background-color: #000000 !important;
}

html {
    scroll-behavior: smooth;
}
.pricing .card-body{
    padding-bottom: 29px !important;
}

.galaxy-screen-vid{
    margin-top: 45px !important;
    width: 99% !important;
    margin-left: 6px !important;
}


.imac-screen-vid {
    width: 990px;
    height: 440px;
}

.imac-screen-vid video{
    width: 46.8% !important;
    margin-left: 18.5% !important;
    margin-top: 2.8% !important;
}
.imac-screen-vid img{
    position: absolute;
}


@media screen and (max-width: 1200px) {
    .galaxy-screen-vid{
        margin-top: 45px !important;
        width: 97% !important;
        margin-left: 6px !important;
    }
}


@media screen and (max-width: 992px) {

    .galaxy-screen-vid{
        margin-top: 38px !important;
        width: 97% !important;
        margin-left: 6px !important;
    }

    .imac-screen-vid {
        width: 680px;
        height: 300px;
    }
    .imac-screen-vid img{
        width: 680px;
    }
}

@media screen and (max-width: 768px) {

    .imac-screen-vid {
        width: 380px;
        height: 160px;
    }
    .imac-screen-vid img{
        width: 380px;
    }
}
@media screen and (max-width: 400px) {

    .imac-screen-vid {
        width: 265px;
        height: 120px;
    }
    .imac-screen-vid img{
        width: 265px;
    }
}

section.pricing{
    display: none;
}

section.partners{
    display: none;
}



#tarifs-section .nav-tabs {
	border-bottom: 0;
	margin-top: 20px;
	margin-bottom: 80px;
	text-align: center;
	display: block !important;
}

#tarifs-section .nav-tabs > li, #tarifs-section .nav-pills > li {
    float:none;
    display:inline-block;
}

#tarifs-section .nav-tabs .nav-link {
	font-family: "casafont";
	font-size: 25px;
	border-bottom: 2px solid #949494;
	color: #949494 !important;
}

#tarifs-section .nav-tabs .nav-link:hover, #tarifs-section .nav-tabs .nav-link:focus {
	border-color: #ffffff #ffffff #949494;
}

#tarifs-section .nav-tabs .nav-link.active, #tarifs-section .nav-tabs .nav-item.show .nav-link {
	border: 0;
	border-bottom: 2px solid #cd0c29;
	color: #212529 !important;
}

.tarifs-nav-item {
        width: 350px;
        line-height: 2;
        color: #949494;
        border-bottom: 2px solid #949494;
		font-size: 25px;
		font-family: "casafont";
		display: inline-block;
		text-decoration: none !important;
}

.tarifs-nav-item.active{
        color: #414141; 
        border-bottom: 2px solid #cd0c29;
		cursor: pointer !important;
}


/*---------Changes----------*/


/*header ul -> li -> a tag margin*/

/*@media (max-width: 1163px) and (min-width: 992px){*/
    .navbar-item-size .navbar-nav .nav-item .nav-link
    {
        margin: 0 0.68rem;
        font-size: 15px;
    }
/*}*/

/*header ul -> li -> a tag margin*/

/* top header navbar font-size 1086px */
@media (max-width: 1086px) and (min-width: 992px){
    .header-navbar .row .list-inline .list-inline-item a{
        font-size: 12px;
    }
    .header-navbar .row .language-selector{
        font-size: 12px;
    }
}
/* top header navbar font-size 1086px */

/*gps control page galaxy-phone gif*/
@media (max-width: 991px) and (min-width: 768px){
    .galaxy-screen-vid{
        margin-top: -40px !important;
        width: 72% !important;
    }
}
/*gps control page galaxy-screen gif*/

/*park control project sidepage card's text*/
@media (max-width: 575px){
    .container-card-pos .row .col-lg-10{
        margin-left: 0 !important;
    }
}
  /*park control project side page floating-window*/
     .container-types-content .row .col-lg-2 .floating-window{
         width: fit-content;
     }
  /*park control project side page floating-window*/


/*blogside page name and chudle*/

 /*  blog page card responsive text*/
     @media (max-width: 767px) and (min-width: 576px){
         .blog-component .small-posts .col-lg-4 h4{
             font-size: 1.3rem;
         }
     }
 /*  blog page card responsive text*/

/*blogside page name and chudle*/


/*---------Changes----------*/


