[data-bs-theme=light] {
    --color-pagetitle: #cab57b;
    --color-pagetitle-secondary: #cab57b;
    --bg-servicesandsupport-category: #012350;
    --bg-servicesandsupport-category-active: #f5f5f5;
    --color-servicesandsupport-category-icon: #3d4c65;
    --color-servicesandsupport-category-title: white;
    --color-servicesandsupport-category-description: #6d84a6;
    --bg-servicesandsupport-software-strength: #152e56;
    --color-servicesandsupport-software-strength-title-main: #ddddb3;
    --color-servicesandsupport-software-strength-secondarytitle-main: white;
    --color-servicesandsupport-software-strength-description-main: #c7d8ed;
    --bg-servicesandsupport-software-strength-content: rgba(255,255,255,0.2);
    --color-servicesandsupport-software-strength-title-content: #ddddb3;
    --color-servicesandsupport-software-strength-secondarytitle-content: white;
    --color-servicesandsupport-software-strength-description-content: white;
    --bg-servicesandsupport-software-process-button: white;
    --bg-servicesandsupport-software-process-button-special: #13579e;
    --color--servicesandsupport-software-process-button: black;
    --color-servicesandsupport-software-process-button-special: white;
    --stroke-servicesandsupport-software-process-button: #e9e9e9;
    --stroke-servicesandsupport-software-process-button-special: #13579e;
    --bg-servicesandsupport-software-coverage-card: #2f568a;
    --color-servicesandsupport-software-coverage-card: white;
    --color-Maintenance-h: #66ccff;
    --bg-Maintenance-card: white;
    --color-Maintenance-card-title: #012350;
    --color-Maintenance-card-description: #666;
    --color-Lease-advantage-card-title: #6b96b2;
    --bg-Lease-advantage-card-title-secondary: #125684;
    --color-Lease-advantage-card-title-secondary: #ccebff;
    --color-Lease-advantage-card-description: white;
    --color-Lease-ways-h: #1b578d;
    --color-Lease-ways-card-title: #012350;
    --color-Lease-ways-card-description: black;
}

body {
    background: var(--bg-main) url(/Images/bg-nav-servicesandsupport.png) center top/100% 280px no-repeat;
}

header {
    background: var(--bg-nav) url(/Images/bg-nav-servicesandsupport-small.png) center top/100% 80px no-repeat;
}

    header nav {
        background-color: transparent;
    }

main .PageTitle {
    color: var(--color-pagetitle);
}

main .PageSecondarytitle {
    color: var(--color-pagetitle-secondary);
}

main #divServicesAndSupport a.Image {
    background-repeat: no-repeat;
    background-position: center;
    /*background-size: 100% 100%;*/
    background-size: contain;
}

    main #divServicesAndSupport a.Image:hover {
        transform: scale(1.1);
        transition: all .2s linear;
    }

main #divServicesAndSupport h2.PartTitle {
    color: #16275d;
}

main #divServicesAndSupport .PartSecondarytitle {
    color: #9a9a9a;
}

@media (min-width: 0px) {
    main #divServicesAndSupport #divSoftware .Process {
        margin: 3em 2em 0em 2em;
    }

        main #divServicesAndSupport #divSoftware .Process button {
            min-width: 3em;
            min-height: 3em;
        }

            main #divServicesAndSupport #divSoftware .Process button:last-child {
                min-width: 6em;
                min-height: 6em;
            }
}

@media (min-width: 576px) {
    main #divServicesAndSupport #divSoftware .Process {
        margin: 6em 4em 0em 3em;
    }

        main #divServicesAndSupport #divSoftware .Process button {
            min-width: 8em;
            min-height: 8em;
        }

            main #divServicesAndSupport #divSoftware .Process button:last-child {
                min-width: 12em;
                min-height: 12em;
            }
}

@media (min-width: 992px) {
    main #divServicesAndSupport #divSoftware .Process {
        margin: 8em 6em 0em 4em;
    }

        main #divServicesAndSupport #divSoftware .Process button {
            min-width: 10em;
            min-height: 10em;
        }

            main #divServicesAndSupport #divSoftware .Process button:last-child {
                min-width: 16em;
                min-height: 16em;
            }
}

main #divServicesAndSupport div.TitleMargin,
main #divServicesAndSupport div.Categories {
    height: 100px;
}

    main #divServicesAndSupport div.Categories .nav-link {
        background-color: var(--bg-servicesandsupport-category);
        color: var(--color-servicesandsupport-category-title);
        margin-right: 0.05em;
    }

        main #divServicesAndSupport div.Categories .nav-link.active {
            background-color: var(--bg-servicesandsupport-category-active);
            color: var(--bg-servicesandsupport-category);
            text-decoration: underline;
            text-underline-offset: 6px;
        }

main #divServicesAndSupport #divSoftware .Strength,
main #divServicesAndSupport #divSystem .Strength {
    background: var(--bg-servicesandsupport-software-strength) url(/Images/bg-services-software-strength.png) center top/100% 100% no-repeat;
}

    main #divServicesAndSupport #divSoftware .Strength .main .title,
    main #divServicesAndSupport #divSystem .Strength .main .title {
        color: var(--color-servicesandsupport-software-strength-title-main);
    }

    main #divServicesAndSupport #divSoftware .Strength .main .secondarytitle,
    main #divServicesAndSupport #divSystem .Strength .main .secondarytitle {
        color: var(--color-servicesandsupport-software-strength-secondarytitle-main);
    }

    main #divServicesAndSupport #divSoftware .Strength .main .description,
    main #divServicesAndSupport #divSystem .Strength .main .description {
        background: linear-gradient(to right,#6081a9,transparent);
        color: var(--color-servicesandsupport-software-strength-description-main);
    }

    main #divServicesAndSupport #divSoftware .Strength .content .col div,
    main #divServicesAndSupport #divSystem .Strength .content .col div {
        background-color: var(--bg-servicesandsupport-software-strength-content)
    }

    main #divServicesAndSupport #divSoftware .Strength .content .title,
    main #divServicesAndSupport #divSystem .Strength .content .title {
        color: var(--color-servicesandsupport-software-strength-title-content);
    }

    main #divServicesAndSupport #divSoftware .Strength .content .secondarytitle,
    main #divServicesAndSupport #divSystem .Strength .content .secondarytitle {
        color: var(--color-servicesandsupport-software-strength-secondarytitle-content);
    }

    main #divServicesAndSupport #divSoftware .Strength .content .description,
    main #divServicesAndSupport #divSystem .Strength .content .description {
        color: var(--color-servicesandsupport-software-strength-description-content);
    }

main #divServicesAndSupport #divSoftware .Process {
    min-height: 6em;
}

    main #divServicesAndSupport #divSoftware .Process .progress {
        height: 4px;
    }

    main #divServicesAndSupport #divSoftware .Process button {
        background-color: var(--bg-servicesandsupport-software-process-button);
        border: solid 1px var(--stroke-servicesandsupport-software-process-button);
    }

        main #divServicesAndSupport #divSoftware .Process button:last-child {
            color: white;
            background-color: var(--bg-servicesandsupport-software-process-button-special);
            border: solid 1px var(--stroke-servicesandsupport-software-process-button-special);
        }

main #divServicesAndSupport #divSoftware .Coverage .card,
main #divServicesAndSupport #divSystem .Coverage .card {
    background-color: var(--bg-servicesandsupport-software-coverage-card);
    color: var(--color-servicesandsupport-software-coverage-card);
}

    main #divServicesAndSupport #divSoftware .Coverage .card svg,
    main #divServicesAndSupport #divSystem .Coverage .card svg {
        fill: var(--color-servicesandsupport-software-coverage-card);
    }

main #divServicesAndSupport #divMaintenance .bg-Maintenance {
    background: url(/Images/bg-maintenance.png) center top/100% 290px no-repeat;
}

main #divServicesAndSupport #divMaintenance .contact {
    color: white;
}

    main #divServicesAndSupport #divMaintenance .contact h4 {
        color: var(--color-Maintenance-h);
    }

main #divServicesAndSupport #divMaintenance .card {
    min-height: 230px;
    max-height: 240px;
}

    main #divServicesAndSupport #divMaintenance .card .title {
        color: var(--color-Maintenance-card-title);
        text-decoration: underline;
        text-underline-offset: 6px;
    }

    main #divServicesAndSupport #divMaintenance .card .description {
        color: var(--color-Maintenance-card-description);
    }

main #divServicesAndSupport #divLease .bg-Lease-1 {
    background: url(/Images/bg-lease-1.png) center top/100% 100% no-repeat;
}

main #divServicesAndSupport #divLease .bg-Lease-2 {
    background: url(/Images/bg-lease-2.png) center top/100% 100% no-repeat;
}

main #divServicesAndSupport #divLease .bg-Lease-3 {
    background: url(/Images/bg-lease-3.png) center top/100% 100% no-repeat;
}

main #divServicesAndSupport #divLease .bg-Lease-4 {
    background: url(/Images/bg-lease-4.png) center top/100% 100% no-repeat;
}

main #divServicesAndSupport #divLease .advantage .card {
    height: 90px;
}

    main #divServicesAndSupport #divLease .advantage .card .title {
        color: transparent;
        font-size: 3em;
        -webkit-text-stroke: 1px var(--color-Lease-advantage-card-title);
        /*text-shadow: 0 -1px var(--color-Lease-card-title),1px -1px var(--color-Lease-card-title), 1px 0 var(--color-Lease-card-title), 1px 1px var(--color-Lease-card-title), 0 1px var(--color-Lease-card-title), -1px 0 var(--color-Lease-card-title), -1px -1px var(--color-Lease-card-title);*/
    }

        main #divServicesAndSupport #divLease .advantage .card .title.secondary {
            color: var(--color-Lease-advantage-card-title-secondary);
            background-color: var(--bg-Lease-advantage-card-title-secondary);
            font-size: 0.8em;
            border-radius: 5px;
            padding: 4px 2px;
            -webkit-text-stroke: unset;
        }

    main #divServicesAndSupport #divLease .advantage .card .description {
        color: var(--color-Lease-advantage-card-description);
    }

main #divServicesAndSupport #divLease .contact {
}

main #divServicesAndSupport #divLease .ways .contact h4 {
    color: var(--color-Lease-ways-h);
}

main #divServicesAndSupport #divLease .ways .card {
    background: linear-gradient(to right,#e7edf3, white);
    border: solid 1px #6c778c !important;
    min-height: 228px;
}

    main #divServicesAndSupport #divLease .ways .card .row {
        border-bottom: solid 1px #6c778c !important;
    }

    main #divServicesAndSupport #divLease .ways .card .title {
        color: var(--color-Lease-ways-card-title);
    }

        main #divServicesAndSupport #divLease .ways .card .title.secondary {
            font-size: 0.5em;
            border-radius: 5px;
            padding: 4px 2px;
            -webkit-text-stroke: unset;
        }

    main #divServicesAndSupport #divLease .ways .card .description {
        color: var(--color-Lease-card-description);
    }
