/**
 * title:      AHS-SS
 * created:    08/04/2026
 * author:     Development Team <info@optiva.co.uk>
 * copyright:  Optiva Ltd

 * ========================================================================== */

body { font-family: 'Open Sans', sans-serif; font-weight: 400; overflow-x: hidden; scroll-behavior: smooth; position: relative; }

h1 { color: #2d2d2d; font-size: 50px; line-height: 58px; font-weight: 300; }
h2 { color: #2d2d2d; font-size: 50px; line-height: 58px; font-weight: 300; }
h3 { color: #2d2d2d; font-size: 40px; line-height: 48px; font-weight: 300; }
h4 { color: #2d2d2d; font-size: 30px; line-height: 38px; font-weight: 300; }
h5 { color: #2d2d2d; font-size: 24px; line-height: 32px; font-weight: 300; }
h6 { color: #2d2d2d; font-size: 18px; line-height: 26px; font-weight: 300; }
p { color: #666666; font-size: 18px; line-height: 26px; font-weight: 300; }
li { color: #666666; font-size: 18px; line-height: 26px; font-weight: 300; }

.h1 { font-size: 50px; line-height: 58px; font-weight: 300; }
.h2 { font-size: 50px; line-height: 58px; font-weight: 300; }
.h3 { font-size: 40px; line-height: 48px; font-weight: 300; }
.h4 { font-size: 30px; line-height: 38px; font-weight: 300; }
.h5 { font-size: 24px; line-height: 32px; font-weight: 300; }
.h6 { font-size: 18px; line-height: 26px; font-weight: 300; }


.container { max-width: 1220px; }

.no-pad-below + * { padding-top: 0px!important; }

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

.uppercase { text-transform: uppercase; }

a { color: #333333; text-decoration: none; }
a:link { text-decoration: none; }
a:hover { color: #00a651; text-decoration: none; }
a:active { text-decoration: none; }
a:visited { text-decoration: none; }

.btn { font-size: 18px; line-height: 20px; font-weight: 400; padding: 13px 24px; color: #333333; border: 1px #333333 solid; border-radius: 10px; filter: drop-shadow(0px); box-shadow: none; transition: 0.2s; transition-timing-function: ease-in; }
.btn:hover { transition: 0.2s; transition-timing-function: ease-in; }
.btn:focus { transition: 0.2s; transition-timing-function: ease-in; }

.btn.large { font-size: 21px; line-height: 23px; padding: 10px 45px; }

.btn-blue { background: #01a1dd; border-color: #01a1dd; color: #ffffff; }
.btn-blue:hover { background: #0a91c3!important; border-color: #0a91c3!important; color: #ffffff!important; }
.btn-blue:focus { background: #0a91c3; border-color: #0a91c3; color: #ffffff; }
.btn-blue:active { background: #0a91c3!important; border-color: #0a91c3!important; color: #ffffff!important; }

.btn-green { background: #00a651; border-color: #00a651; color: #ffffff; }
.btn-green:hover { background: #04964b!important; border-color: #04964b!important; color: #ffffff!important; }
.btn-green:focus { background: #04964b; border-color: #04964b; color: #ffffff; }
.btn-green:active { background: #04964b!important; border-color: #04964b!important; color: #ffffff!important; }

.btn-blue-keyline { background: none; border-color: #01a1dd; color: #ffffff; }
.btn-blue-keyline:hover { background: #01a1dd!important; border-color: #01a1dd!important; color: #ffffff!important; }
.btn-blue-keyline:focus { background: #01a1dd; border-color: #0a91c3; color: #ffffff; }
.btn-blue-keyline:active { background: #01a1dd!important; border-color: #01a1dd!important; color: #ffffff!important; }

.btn-white-keyline { background: none; border-color: #ffffff; color: #ffffff; }
.btn-white-keyline:hover { background: #ffffff!important; border-color: #ffffff!important; color: #00a651!important; }
.btn-white-keyline:focus { background: #ffffff; border-color: #ffffff; color: #ffffff; }
.btn-white-keyline:active { background: #ffffff!important; border-color: #ffffff!important; color: #00a651!important; }


/**
 * Dark Theme
 * ========================================================================== */

[dark-mode] h1 { color: #ffffff; }
[dark-mode] h2 { color: #ffffff; }
[dark-mode] h3 { color: #ffffff; }
[dark-mode] h4 { color: #ffffff; }
[dark-mode] h5 { color: #ffffff; }
[dark-mode] h6 { color: #ffffff; }
[dark-mode] p { color: #cccccc; }
[dark-mode] li { color: #cccccc; }

/**
 * Main Header/Navigation
 * ========================================================================== */	

header .header { background: #ffffff; padding: 18px 15px 20px 15px; position: fixed; top: 0px; width: 100%; margin: auto; z-index: 5000; transition: 0.3s; transition-timing-function: ease-in; }
    header .header .col { font-size: 0px; }
    header .header img { width: 171px; margin-top: 0px; float: left; transition: 0.3s; transition-timing-function: ease-in; }
    header .header .nav { margin-top: 0px; margin-bottom: 0px; top: 22px; list-style: none; float: right; position: relative; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav .nav-item { font-size: 22px; font-weight: 400; display: inline-block; height: 78px; margin-top: 9px; margin-right: 60px; vertical-align: top; position: relative; }
        header .header .nav .nav-item a { color: #333333; padding: 15px 0px; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav .nav-item a:hover { color: #00a651; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav .nav-item.dropdown:hover a { color: #00a651; background: #fff!important; }
        header .header .nav .btn { height: 48px; }

    header .header .nav ul { margin: 0px; }

    header .header .nav-elements { display: none; margin-top: 10px; margin-left: 0px; float: right; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav-elements .nav-icon { color: #333333; border: 1px #333333 solid; border-radius: 50%; height: 45px; width: 45px; font-size: 23px; padding-top: 5px; margin-left: 12px; text-align: center; float: right; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav-elements .nav-icon:hover { background: #01a1dd; border-color: #01a1dd; color: #ffffff; cursor: pointer; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .nav-elements .btn { margin-left: 15px; }


    header .header .navigation-dropdown { background: #ffffff; width: 100%; max-width: 1920px; left: 0px; right: 0px; border-radius: 0px; padding: 35px 10px 35px 10px; margin: auto; top: 127px; position: fixed; opacity: 0; visibility: hidden; z-index: unset; transition: 0.3s; transition-timing-function: ease-in; }
        header .header .navigation-dropdown.active { display: block; }

            header .header .nav ul li.dropdown:hover .navigation-dropdown { opacity: 1; visibility: visible; z-index: 1200; transition: 0.3s; transition-timing-function: ease-in;  }

            header .header .navigation-dropdown li { height: auto!important; padding-top: 0px!important; }
            header .header .navigation-dropdown .list-items { padding-left: 0px; }
            header .header .navigation-dropdown.two .list-items { padding-left: 0px; }
            header .header .navigation-dropdown.two { min-width: 580px; }
            header .header .navigation-dropdown.three .list-items { padding-left: 0px; }
            
            header .header .nav ul .navigation-dropdown ul { list-style: none; padding: 0px; margin: 0px; }
                header .header .nav ul .navigation-dropdown ul li.title { color: #333333; font-size: 18px; line-height: 26px; font-weight: 500; margin-bottom: 12px; }
                    header .header .nav ul .navigation-dropdown ul li.title a { color: #333333!important; }
                    header .header .nav ul .navigation-dropdown ul li.title a:hover { color: #00a651!important; }
                header .header .nav ul .navigation-dropdown ul li { font-size: 18px; line-height: 26px; font-weight: 300; padding-right: 0px; margin-right: 0px; margin-bottom: 12px; height: auto; display: block; } 
                header .header .nav ul .navigation-dropdown ul li.bold { font-weight: 600; }
                header .header .nav ul .navigation-dropdown ul li a { color: #666666!important; padding: 0px; display: block; border-radius: 0px; }
                header .header .nav ul .navigation-dropdown ul li a:hover { color: #01a1dd!important; cursor: pointer!important; }
                header .header .nav ul .navigation-dropdown ul li a::after { opacity: 0; display: inline; margin-left: 6px; font-family: "Font Awesome 5 Pro"; content: "\f054"!important; transform: none!important; }
                header .header .nav ul .navigation-dropdown ul li a:hover::after { opacity: 1; }

            header .header .navigation-dropdown .nav-feature-box { background: #00a651; background-size: cover; background-position: right 50%; padding: 20px; border-radius: 10px; width: 280px; height: 96%; float: right; position: relative; }
                header .header .navigation-dropdown .nav-feature-box .cta-circle { width: 60px; height: 60px; }
                header .header .navigation-dropdown .nav-feature-box h5 { color: #ffffff; font-size: 22px; }
                header .header .navigation-dropdown .nav-feature-box p { color: #ffffff; font-size: 16px; line-height: 22px; }

            header .header .navigation-dropdown .nav-text-feature { padding-right: 105px; display: block; cursor: pointer!important; }
            header .header .navigation-dropdown.two { padding-top: 42px; padding-bottom: 42px; }
                header .header .navigation-dropdown.two .nav-text-feature { padding-right: 10px; }
            header .header .navigation-dropdown.three { padding-top: 38px; padding-bottom: 42px; }
            header .header .navigation-dropdown .nav-text-feature::after { display: none!important; }
            header .header .navigation-dropdown .nav-text-feature h5 { color: #2d2d2d; font-size: 17px; line-height: 23px; font-weight: 500; margin-bottom: 8px; }
            header .header .navigation-dropdown .nav-text-feature h5::after { opacity: 0; display: inline; margin-left: 6px; font-family: "Font Awesome 5 Pro"; content: "\f054"!important; transition: 0.3s; transition-timing-function: ease; }
            header .header .navigation-dropdown .nav-text-feature:hover h5::after { opacity: 1; transition: 0.3s; transition-timing-function: ease; }
            header .header .navigation-dropdown .nav-text-feature p { color: #666666; font-size: 14px; line-height: 20px; margin: 0px; }
            header .header .navigation-dropdown .nav-text-feature:hover h5 { color: #d10a11; }

                header .header .dropdown .navigation-dropdown .col { top: -30px; position: relative; opacity: 0; visibility: hidden; transition: 0.3s; transition-timing-function: ease; transition-delay: 0.1s; }
                header .header .dropdown.active .navigation-dropdown .col { top: 0px; opacity: 1; visibility: visible; transition: 0.3s; transition-timing-function: ease; transition-delay: 0.4s;  }
            
                header .header .dropdown .navigation-dropdown .col:nth-child(2) { transition-delay: 0.1s; }
                header .header .dropdown.active .navigation-dropdown .col:nth-child(2) { transition-delay: 0.5s; }
            
                header .header .dropdown .navigation-dropdown .col:nth-child(3) { transition-delay:  0.1s; }
                header .header .dropdown.active .navigation-dropdown .col:nth-child(3) { transition-delay: 0.6s; }
            
                header .header .dropdown .navigation-dropdown .col:nth-child(4) { transition-delay: 0.1s; }
                header .header .dropdown.active .navigation-dropdown .col:nth-child(4) { transition-delay: 0.7s; }
            
                header .header .dropdown .navigation-dropdown .col:nth-child(5) { transition-delay: 0.1s; }
                header .header .dropdown.active .navigation-dropdown .col:nth-child(5) { transition-delay: 0.8s; }



header .header.scrolled { background: #ffffff; padding: 15px 15px 17px 15px; transition: 0.3s; transition-timing-function: ease-in; }
    header .header.scrolled img { width: 140px; transition: 0.3s; transition-timing-function: ease-in;  }
    header .header.scrolled .nav { margin-top: -14px; top: 27px; transition: 0.3s; transition-timing-function: ease-in; }
    header .header.scrolled .nav-elements { transition: 0.3s; transition-timing-function: ease-in; }

    header .header .navigation-dropdown.scrolled { top: 105px; transition: 0.3s; transition-timing-function: ease; transition-timing-function: ease-in; }


header .red-line { background: #c4161c; height: 3px; width: 100%;
    bottom: 0px; left: 0px; right: 0px;
 position: absolute;
  clip-path: inset(0 0 0 100%); /* start hidden on the right */
  animation: wipe-right-to-left 1.5s forwards ease-in-out;
}

@keyframes wipe-right-to-left {
  to {
    clip-path: inset(0 0 0 0); /* fully revealed */
  }
}

header + * { margin-top: 127px; }

.overlay-bg { transition: 0.3s; transition-timing-function: ease; }
    .overlay-bg.active { background-color: #000; opacity: 0.5; height: 100%; width: 100%; position: absolute; z-index: 1000; transition: 0.3s; transition-timing-function: ease; }

        

/* === Menu Modal =============================== */

.menu-modal { background: #ffffff; opacity: 0; visibility: hidden; position: fixed; width: 100%; height: 100%; min-height: 100vh; padding: 0px 0px 0px 0px; overflow: auto; top: 0px; transition: 0.4s; transition-timing-function: ease-in; z-index: 0; }
.menu-modal.active { z-index: 9998;  opacity: 1; visibility: visible; top: 0px; transition: 0.4s; transition-timing-function: ease-in; }

    .menu-modal .header-content { padding: 15px 27px 17px 27px; }
    .menu-modal.scrolled .header-content { padding-top: 18px; padding-bottom: 18px; }
        .menu-modal .header-content .logo { width: 120px; float: left; transition: 0.2s; transition-timing-function: ease-in; }

        .menu-modal .buttons { margin-top: 0px; }
            .menu-modal .buttons .icon-circle { width: 45px; height: 45px; border: 1px #333333 solid; border-radius: 50%; margin-top: 10px; margin-left: 15px; text-align: center; float: right; overflow: hidden; position: relative; transition: 0.2s; transition-timing-function: ease-in; }
            .menu-modal .buttons .icon-circle:hover { background: #01a1dd; border-color: #01a1dd; }
            .menu-modal .buttons .icon-circle i { color: #333333; font-size: 26px; top: 8px; left: 0px; right: 0px; position: absolute; transition: 0.2s; transition-timing-function: ease-in; } 
            .menu-modal .buttons .icon-circle:hover i { color: #ffffff; transition: 0.2s; transition-timing-function: ease-in; } 

            
    .menu-modal .link-content { padding: 0px 30px 20px 30px; }
    .menu-modal .link-content .accordion { background: none; border-radius: 0px; margin-bottom: 25px; }
        .menu-modal .link-content .accordion .accordion-item { background: none; border: 0px; border-bottom: 1px #7f7f7f solid; border-radius: 0px; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header { background: none; font-size: 22px; line-height: 26px; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header .accordion-button { background: none; color: #333333; font-size: 19px; line-height: 24px; font-weight: 600; box-shadow: none; padding: 15px 0px; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header .accordion-button:hover { color: #01a1dd; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header .accordion-button::after { background: none!important; font-family: "Font Awesome 5 Pro"; content: "\2b"; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header .accordion-button:not(.collapsed)::after { background: none!important; font-family: "Font Awesome 5 Pro"; content: "\f068"; }
        .menu-modal .link-content .accordion .accordion-item .accordion-header .accordion-button.link::after { display: none!important; }
        .menu-modal .link-content .accordion .accordion-item .accordion-body { padding: 0px 0px 25px 0px; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul { list-style: none; padding: 0px; margin: 0px; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li { font-size: 17px; line-height: 23px; padding: 5px 0px; font-weight: 300; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li a { color: #333333;}
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li a:hover { color: #01a1dd; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li.title { font-size: 18px; line-height: 24px; padding-top: 15px!important; margin-top: 15px; border-top: 1px #cccccc solid; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li.title a { color: #01a1dd; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li.title:first-child { border: 0px; padding-top: 5px!important; margin-top: 0px!important; }
            .menu-modal .link-content .accordion .accordion-item .accordion-body ul li:first-child { padding-top: 0px; }

        .menu-modal .link-content .btn { width: 100%; max-width: 400px; font-size: 18px; line-height: 19px; padding: 12px 18px; }

        .menu-modal .link-content .social-icons { margin: 38px 0px 0px 0px; }
            .menu-modal .link-content .social-icons li a { border-color: #ffffff; }
            .menu-modal .link-content .social-icons li a i { color: #ffffff; }
            .menu-modal .link-content .social-icons li a:hover { background: #ffffff; border-color: #ffffff; }
            .menu-modal .link-content .social-icons li a:hover i { color: #333333; }


/**
 * Hero Panel
 * ========================================================================== */

.hero-panel { background-color: #2b3b45; background-position: bottom center; background-repeat: no-repeat; padding: 70px 20px 140px 20px; mask: url('../assets/hero-panel-mask.svg') bottom center no-repeat; -webkit-mask: url('../assets/hero-panel-mask.svg') bottom center no-repeat; mask-size: 3000px; -webkit-mask-size: 3000px; position: relative; }
    .hero-panel .container { z-index: 1; position: relative; }
    .hero-panel .content h1 { color: #ffffff;  }
    .hero-panel .content h1 + h5 { margin-top: 30px; }
    .hero-panel .content h1 + p { margin-top: 20px; }
    .hero-panel .content .buttons { margin-top: 35px; }
    .hero-panel .content .buttons .btn + .btn { margin-left: 20px; }
    .hero-panel .content p + .buttons { margin-top: 28px; }
    .hero-panel .content .icon { color: #ffffff; font-size: 66px; margin-bottom: 15px; }

    .hero-panel.internal { padding-top: 60px; padding-bottom: 110px; }

/**
 * Content Panel
 * ========================================================================== */

.content-panel { padding: 90px 20px 90px 20px; position: relative; overflow: hidden; }
    .content-panel .container.boxes { max-width: 1246px; }
    .content-panel .text-content.contained { max-width: 980px; margin: auto; }

    .container.boxes.box-mb .col { margin-bottom: 40px; }
    .container.boxes.box-mb .col:nth-child(n+4) { margin-bottom: 0px; }

    .content-panel .side-square-img { width: 100%; height: 100%; max-width: 420px; border-radius: 10px; overflow: hidden; float: right; position: relative; }
        .content-panel .side-square-img img { height: 105%; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; }


    .content-panel .logos-list { max-width: 800px; margin: auto; position: relative; }
    .content-panel .logos-list .logo-item { min-height: 100px; display: inline-block; position: relative; }
    .content-panel .logos-list.grey .logo-item img { filter: grayscale(100%); }
    .content-panel .logos-list .logo-item img { max-width: 80%; max-height: 77px; top: 50%; transform: translateY(-50%); left: 0px; right: 0px; margin: auto; position: absolute; }

    .content-panel ul.ticks { list-style: none; padding: 0; margin: 0; }
        .content-panel ul.ticks li { position: relative; padding-left: 45px; margin-bottom: 20px; color: #cfd8dc; }
        .content-panel ul.ticks li::before { content: ""; position: absolute; left: 0; top: -3px; width: 32px; height: 32px; background: url('../assets/tick-icon.png') no-repeat center; background-size: contain; }
        .content-panel ul.ticks li:last-child { margin-bottom: 0px; }

    .content-panel .logo-features .logo-item { min-height: 100px; }
        .content-panel .logo-features.grey .logo-item img { filter: grayscale(100%); }
        .content-panel .logo-features .logo-item img { max-width: 70%; max-height: 46px; top: 50%; transform: translateY(-50%); left: 0px; right: 0px; margin: auto; position: absolute; }

    .info-box { background: none; padding: 22px; width: 90%; margin: auto; border: 1px #999999 solid; border-radius: 10px; position: relative; transition: 0.2s; transition-timing-function: ease-in; }
        .info-box .number-circle { width: 58px; height: 58px; font-size: 34px; font-weight: 500; color: #00a651; border: 2px #00a651 solid; border-radius: 50%; text-align: center; margin-bottom: 13px; position: relative; }
            .info-box .number-circle span { width: 100%; height: 100%; top: 50%; transform: translateY(-50%); left: 0px; right: 0px; margin: auto; position: absolute; }
        .info-box h5 { font-size: 22px; line-height: 28px; margin-bottom: 12px; }
        .info-box p { font-size: 16px; line-height: 22px; margin: 0px; }

        .container.boxes .col:nth-child(even) .info-box .number-circle { color: #01a1dd; border-color: #01a1dd; }


    .feature-box { background: #2a3b45; padding: 22px; width: 90%; height: 100%; margin: auto; border: 1px #999999 solid; border-radius: 10px; position: relative; transition: 0.2s; transition-timing-function: ease-in; }
        .feature-box .icon { height: 53px; font-size: 53px; color: #ffffff; margin-bottom: 22px; }
        .feature-box h5 { color: #ffffff; font-size: 22px; line-height: 28px; margin-bottom: 52px; }
        .feature-box p { color: #ffffff; font-size: 16px; line-height: 22px; margin-bottom: 42px; }
        .feature-box h6 { color: #01a1dd; margin: 0px; left: 22px; bottom: 22px; position: absolute; }
        .feature-box.text h5 { margin-bottom: 15px; }

        a .feature-box:hover { background: #01a1dd; border-color: #01a1dd; transition: 0.2s; transition-timing-function: ease-in; }
        a .feature-box:hover h6 { color: #ffffff!important; }  

    .container.boxes .col:nth-child(even) a .feature-box:hover { background: #00a651; border-color: #00a651; }
        .container.boxes .col:nth-child(even) .feature-box h6 { color: #00a651; }


    .article-info-box { background: #ffffff; min-height: 345px; max-width: 367px; padding: 0px; margin: auto; border-radius: 10px; overflow: hidden; position: relative; }
        .article-info-box .background { height: 110px; width: 100%; background-size: 367px; background-repeat: no-repeat; background-position: 50% center; transition: 0.3s; transition-timing-function: ease; }
        .article-info-box:hover .background { background-size: 420px; transition: 0.3s; transition-timing-function: ease; }
        .article-info-box .feature-content { padding: 25px 22px; }
            .article-info-box .feature-content h6.date { color: #d10a11; font-size: 16px; line-height: 22px; font-weight: 400; margin-bottom: 8px; }
            .article-info-box .feature-content h6 { color: #666666; }
            .article-info-box .feature-content h5 { color: #2d2d2d; font-size: 24px; line-height: 32px; max-height: 200px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 100%; margin-bottom: 15px; }
            .article-info-box .feature-content p { color: #333333; }
            .article-info-box .feature-content h6 { color: #01a1dd; font-size: 18px; line-height: 26px; margin: 0px; bottom: 25px; position: absolute; } 


    .icon-box { background: none; padding: 24px 22px; width: 94%; margin: auto; border: 1px #999999 solid; border-radius: 10px; height: 100%; position: relative; transition: 0.2s; transition-timing-function: ease-in; }
        .icon-box .icon { height: 53px; font-size: 53px; color: #01a1dd; margin-bottom: 22px; }
        .icon-box h5 { font-size: 26px; line-height: 34px; margin-bottom: 12px; }
        .icon-box p { margin: 0px 0px 45px 0px; }
        .icon-box h6 { color: #01a1dd; margin: 0px; left: 22px; bottom: 24px; position: absolute; }

        a .icon-box:hover { background: #01a1dd; border-color: #01a1dd; transition: 0.2s; transition-timing-function: ease-in; }
        a .icon-box:hover .icon { color: #ffffff!important; }
        a .icon-box:hover h5 { color: #ffffff!important; }
        a .icon-box:hover p { color: #ffffff!important; }
        a .icon-box:hover h6 { color: #ffffff!important; }

        .container.boxes .col:nth-child(even) a .icon-box:hover { background: #00a651; border-color: #00a651; }
        .container.boxes .col:nth-child(even) .icon-box .icon { color: #00a651; }


.content-panel.right-side-slider .col { position: relative; }

.content-panel.right-side-slider .slider-holder { width: 90%; height: 100%; float: right; position: relative; }
    .content-panel.right-side-slider .slider-holder .swiper-pagination { text-align: left; left: -5px; bottom: -6px; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow { color: #ffffff; font-size: 38px; bottom: -12px; z-index: 11; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow:hover { color: #01a1dd; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow.prev { left: auto; right: 45px; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow.next { right: -5px; }

    .content-panel.right-side-slider .slider-holder .swiper-wrapper { align-items: stretch; }
    .content-panel.right-side-slider .slider-holder .swiper-slide { height: auto; /* allow stretching */ display: flex; }
    .content-panel.right-side-slider .slider-holder .swiper-slide > * { flex: 1; /* make inner content fill full height */ } 

    .content-panel.right-side-slider .icon-box { width: 100%; }
    .content-panel.right-side-slider .swiper-slide:nth-child(even) a .icon-box:hover { background: #00a651; border-color: #00a651; }
        .content-panel.right-side-slider .swiper-slide:nth-child(even) .icon-box .icon { color: #00a651; }


.content-panel.cutout-bg { min-height: 828px; padding-bottom: 410px; }
.content-panel.cutout-bg .front { left: 12px; right: 0px; bottom: 0px; margin: auto; position: absolute; z-index: 1; }

.content-panel.cutout-bg .glow { width: 1px; height: 1px; background-color: #01a1dd; box-shadow: 0px 0px 440px 400px #01a1dd; position: absolute; bottom: -350px; left: 0px; right: 0px; margin: auto; transition-timing-function: ease-in; transition: 0.6s; }
.content-panel.cutout-bg .glow.green { background-color: #00a651; box-shadow: 0px 0px 440px 400px #00a651; }
.content-panel.cutout-bg .glow.left { left: 180px; right: auto; }
.content-panel.cutout-bg .glow.right { left: auto; right: 180px; }


/**
 * Case Studies Slider Panel
 * ========================================================================== */

.case-studies-slider-panel { position: relative; }
    .case-studies-slider-panel .swiper-slide { padding: 90px 20px 160px 20px; position: relative; }
    .case-studies-slider-panel .swiper-slide .text-content h5 { color: #cccccc; }
    .case-studies-slider-panel .col { position: relative; }
    .case-studies-slider-panel .swiper-pagination { bottom: 95px; left: 7px; text-align: left; }

/**
 * Article Features
 * ========================================================================== */

.articles-slider-panel.content-panel { padding-bottom: 160px; }
    .articles-slider-panel .container { width: 90%; max-width: 1160px; position: relative; }

    .articles-slider-panel .swiper-pagination { bottom: -80px; }

    .articles-slider-panel .gallery-arrow { top: 50%; transform: translateY(-50%); }

    .article-feature-box { background: #ffffff; min-height: 345px; max-width: 367px; padding: 0px; margin: auto; border: 1px #999999 solid; border-radius: 10px; overflow: hidden; position: relative; }
        .article-feature-box .background { height: 150px; width: 100%; background-size: 367px; background-repeat: no-repeat; background-position: 50% center; transition: 0.3s; transition-timing-function: ease; }
        .article-feature-box:hover .background { background-size: 420px; transition: 0.3s; transition-timing-function: ease; }
        .article-feature-box .feature-content { padding: 25px 22px; }
            .article-feature-box .feature-content h6.date { color: #d10a11; font-size: 16px; line-height: 22px; font-weight: 400; margin-bottom: 8px; }
            .article-feature-box .feature-content h6 { color: #666666; }
            .article-feature-box .feature-content h5 { color: #2d2d2d; font-size: 23px; line-height: 31px; max-height: 200px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 100%; margin-bottom: 25px; }
            .article-feature-box .feature-content h6 { color: #01a1dd; font-size: 18px; line-height: 26px; margin: 0px; bottom: 25px; position: absolute; } 



/**
 * Internal Header Panel
 * ========================================================================== */

.internal-header-panel { background-color: #2b3b45; background-position: bottom center; background-repeat: no-repeat; padding: 60px 20px 70px 20px; mask: url('../assets/hero-panel-mask.svg') bottom center no-repeat; -webkit-mask: url('../assets/hero-panel-mask.svg') bottom center no-repeat; mask-size: 3000px; -webkit-mask-size: 3000px; position: relative; }
    .internal-header-panel .container { z-index: 1; position: relative; }
    .internal-header-panel .content h1 { color: #ffffff; }
    .internal-header-panel .content h1 + p { margin-top: 20px; }
    .internal-header-panel .content h1 + h5 { margin-top: 15px; }
    .internal-header-panel .content .buttons { margin-top: 35px; }
    .internal-header-panel .content .buttons .btn + .btn { margin-left: 20px; }
    
/**
 * Internal Panel
 * ========================================================================== */   

.internal-content-panel { background: #ffffff; padding: 70px 15px; position: relative; }
    .internal-content-panel .text-content.contained { max-width: 900px; margin: auto; }
    .internal-content-panel .text-content { color: #333333; font-size: 18px; line-height: 22px; font-weight: 300; }
        .internal-content-panel .text-content h4 { color: #01a1dd; margin-bottom: 12px; }
        .internal-content-panel .text-content * + h4 { margin-top: 35px; }
        .internal-content-panel .text-content h5 { color: #01a1dd; margin-bottom: 12px; }
        .internal-content-panel .text-content h6 { color: #01a1dd; font-size: 27px; line-height: 34px; margin-bottom: 8px; }
        .internal-content-panel .text-content p + h5 { margin-top: 30px; }
        .internal-content-panel .text-content p { margin-bottom: 20px; }
        .internal-content-panel .text-content ul { padding: 0px; margin-top: 10px; margin-bottom: 20px; list-style: none; }
        .internal-content-panel .text-content ol { padding: 0px; margin-top: 10px; margin-bottom: 20px; list-style-position: inside; }
        .internal-content-panel .text-content li:first-child { border-top: 1px #cccccc solid; }
        .internal-content-panel .text-content li { border-bottom: 1px #cccccc solid; padding: 12px 0px; }
        .internal-content-panel .text-content li::marker { display: inline-block; }
        .internal-content-panel .text-content .lightgreybg { background: #eeeeee; padding: 25px; margin-bottom: 30px; margin-top: 30px; }
        .internal-content-panel .text-content .table { margin-bottom: 35px; }
        .internal-content-panel .text-content .table td { color: #666666; font-size: 16px; line-height: 22px; border: 1px #e2e2e2 solid; }
        .internal-content-panel .text-content .table td.green { background: #96ca50; border-color: #e5e5e5; color: #ffffff; font-weight: 600; }
        .internal-content-panel .text-content p + .table-responsive { margin-top: 35px; }
        .internal-content-panel.form { padding-left: 20px; padding-right: 20px; padding-bottom: 100px; }

        .internal-panel .content .btn { margin: 10px auto auto auto; }


/**
 * Footer Cta Panel
 * ========================================================================== */ 

.footer-cta-panel { background: #00a651; padding: 50px 20px; position: relative; }


/**
 * Footer
 * ========================================================================== */
 
footer .footer-top { background: #2a3b45; padding: 70px 20px; position: relative; }
    footer .footer-top .details-box { background: #ffffff; max-width: 388px; padding: 28px; border-radius: 10px; position: relative; }
        footer .footer-top .details-box img { margin-bottom: 22px; }
        footer .footer-top .details-box p { margin: 26px 0px 0px 0px }

    footer .footer-top h5.title { color: #ffffff; font-weight: 400; margin-bottom: 18px; }
    footer .footer-top h5.title a { color: #ffffff; }
    footer .footer-top h5.title a:hover { color: #01a1dd; }

    footer .footer-top .center { padding-left: 40px; }
    footer .footer-top .right .link-items { float: right; }

    footer .footer-top ul.links { list-style: none; padding: 0px; margin: 0px; }
        footer .footer-top ul.links li { font-size: 20px; line-height: 26px; margin-bottom: 18px; }
        footer .footer-top ul.links li a { color: #ffffff; }
        footer .footer-top ul.links li a:hover { color: #00a651; }

    footer .footer-top .logos { margin-top: 50px; }

footer .footer-bottom { background: #2a3b45; border-top: 3px #c4161c solid; padding: 35px 20px; position: relative; }
    footer .footer-bottom p { color: #ffffff; margin-bottom: 7px; }
    footer .footer-bottom h6 { color: #999999; margin: 0px; }
     
    footer .footer-bottom .right { margin-top: 10px; text-align: right; }
        footer .footer-bottom .right h5 { color: #ffffff; font-size: 18px; line-height: 24px; margin: 6px 0px 0px 0px; float: right; }
        footer .footer-bottom .right h5 a { color: #ffffff; }
        footer .footer-bottom .right h5 a:hover { color: #00a651; }
        footer .footer-bottom .right h5 span { padding: 0px 4px; }

    footer .footer-bottom .social-icons { margin-left: 15px; float: right; }


.social-icons { margin: 0px; padding: 0px; list-style: none; }
    .social-icons li { float: left; width: 40px; height: 40px; margin-left: 12px; border: 0px; }
    .social-icons li a { background: #00a651; border-radius: 50%; height: 40px; width: 40px; font-size: 22px; position: relative; display: block; text-align: center; }
    .social-icons li a:hover { background: #04964b; }
    .social-icons li a i { color: #ffffff; top: 50%; transform: translateY(-50%); left: 0px; right: 0px; margin: auto; position: absolute; }
    .social-icons li a:hover i { color: #ffffff; }

.gallery-arrow { color: #01a1dd; font-size: 46px; position: absolute; }
.gallery-arrow.prev { left: -50px; }
.gallery-arrow.next { right: -50px; }
.gallery-arrow:hover { color: #00a651; }

/**
 *  Resolutions
 * ========================================================================== */

@media screen and (max-width: 1750px) {

    h1 { font-size: 46px; line-height: 54px; }
    h2 { font-size: 46px; line-height: 54px; }
    h3 { font-size: 37px; line-height: 44px; }
    h4 { font-size: 28px; line-height: 36px; }
    h5 { font-size: 22px; line-height: 30px; }

    .h1 { font-size: 46px; line-height: 54px; }
    .h2 { font-size: 46px; line-height: 54px; }
    .h3 { font-size: 37px; line-height: 44px; }
    .h4 { font-size: 28px; line-height: 36px; }
    .h5 { font-size: 22px; line-height: 30px; }


    .hero-panel .content h1 { margin-bottom: 25px; }
    .hero-panel .content .buttons { margin-top: 31px; }

}


@media screen and (max-width: 1600px) {

    h1 { font-size: 43px; line-height: 50px; }
    h2 { font-size: 43px; line-height: 50px; }
    h3 { font-size: 35px; line-height: 42px; }
    h4 { font-size: 26px; line-height: 34px; }
    h5 { font-size: 21px; line-height: 29px; }

    .h1 { font-size: 43px; line-height: 50px; }
    .h2 { font-size: 43px; line-height: 50px; }
    .h3 { font-size: 35px; line-height: 42px; }
    .h4 { font-size: 26px; line-height: 34px; }
    .h5 { font-size: 21px; line-height: 29px; }

    p { font-size: 17px; line-height: 25px; }
    li { font-size: 17px; line-height: 25px; }

    .btn { font-size: 16px; line-height: 18px; padding: 11px 20px; }

    header .header .nav { top: 23px; }
    header .header .nav .nav-item { font-size: 20px; }
    header .header .nav .btn { height: 42px; }
    header .header.scrolled .nav { top: 29px; }

}

@media screen and (max-width: 1400px) {

    footer .footer-top .right .link-items { padding-right: 50px; }

}

@media screen and (max-width: 1300px) {

    .feature-box { width: 96%; }
        .feature-box h5 { font-size: 20px; line-height: 26px; }

    .info-box { width: 96%; }
        .info-box h5 { font-size: 20px; line-height: 26px; }

    .icon-box { width: 96%; }

    .icon-box h5 { font-size: 24px; line-height: 32px; }

    footer .footer-top ul.links li { font-size: 18px; line-height: 24px; margin-bottom: 18px; }
    footer .footer-top .center { padding-left: calc(var(--bs-gutter-x) * .5); }

}

@media screen and (max-width: 1230px) {

    .case-studies-slider-panel .swiper-pagination { left: 27px; }

}

@media screen and (max-width: 1199px) {

    h1 { font-size: 38px; line-height: 46px; }
    h2 { font-size: 38px; line-height: 46px; }
    h3 { font-size: 32px; line-height: 40px; }
    h4 { font-size: 25px; line-height: 32px; }

    .h1 { font-size: 38px; line-height: 46px; }
    .h2 { font-size: 38px; line-height: 46px; }
    .h3 { font-size: 32px; line-height: 40px; }
    .h4 { font-size: 25px; line-height: 32px; }


    .container.boxes.box-mb .col:nth-child(n+4) { margin-bottom: 40px; }

    .content-panel .side-square-img { max-width: 380px; }

    .content-panel.right-side-slider .text-content { max-width: 600px; text-align: center; margin: auto auto 80px auto; }
    .content-panel.right-side-slider .slider-holder { width: 100%; height: auto; float: none; margin-bottom: 110px; position: relative; }
    .content-panel.right-side-slider .slider-holder .swiper-pagination { left: 0px; bottom: -125px; text-align: center; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow { text-align: center; bottom: -60px; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow.next { width: 38px; height: 38px; left: 0px; right: -55px; margin: auto; }
    .content-panel.right-side-slider .slider-holder .gallery-arrow.prev { width: 38px; height: 38px; left: -55px; right: 0px; margin: auto; }

    .content-panel.cutout-bg { min-height: 1030px; }

    .content-panel .container.boxes { max-width: 700px; }
        .content-panel .container.boxes .col { margin-bottom: 30px; }


    .content-panel ul.ticks li { padding-left: 0; text-align: center; }
    .content-panel ul.ticks li::before { position: static; display: inline-block; margin-right: 10px; vertical-align: middle; }

    .article-feature-box .feature-content h5 { font-size: 21px; line-height: 29px; }

    footer .footer-top .details-box { margin: auto auto 20px auto; text-align: center; }
    footer .footer-top .link-items { text-align: center; margin-top: 30px; }

    footer .footer-top .col.left { order: 1; }
    footer .footer-top .col.center { order: 3; }
    footer .footer-top .col.right { order: 2; }
    footer .footer-top .right .link-items { float: none; padding-right: 0px; }

    footer .footer-bottom p { font-size: 16px; line-height: 24px; }
    footer .footer-bottom h6 { font-size: 16px; line-height: 24px; }

}

@media screen and (max-width: 1050px) {

    .gallery-arrow.prev { left: -40px; }
    .gallery-arrow.next { right: -40px; }

}

@media screen and (max-width: 991px) {

    h1 { font-size: 34px; line-height: 42px; }
    h2 { font-size: 34px; line-height: 42px; }
    h3 { font-size: 30px; line-height: 38px; }
    h4 { font-size: 24px; line-height: 30px; }

    .h1 { font-size: 34px; line-height: 42px; }
    .h2 { font-size: 34px; line-height: 42px; }
    .h3 { font-size: 30px; line-height: 38px; }
    .h4 { font-size: 24px; line-height: 30px; }

    header + * { margin-top: 94px; }

    header .header { padding: 15px 15px 17px 15px; }
    header .header.scrolled { padding: 15px 15px 17px 15px; }
        header .header .nav-elements { display: block; }
        header .header .nav { display: none; }
        header .header img { width: 120px; }
        header .header.scrolled img { width: 120px; }

    .hero-panel {padding: 60px 20px 90px 20px; }
        .hero-panel .content { text-align: center; max-width: 600px; margin: auto; }

    .content-panel .text-content { text-align: center; }
    .content-panel .side-square-img { width: 400px; height: 400px; margin: 30px auto auto auto; float: none; }

    .content-panel.cutout-bg .front { width: 600px; }
    .content-panel.cutout-bg { min-height: 960px; background-size: 1215px!important; padding-bottom: 280px; }

    footer .footer-top { padding: 50px 20px; }

    footer .footer-bottom { text-align: center; }
        footer .footer-bottom .social-icons { height: 40px; display: block; float: none; text-align: center; margin: auto auto 20px auto; }
            footer .footer-bottom .social-icons li { float: none; display: inline-block; }
        footer .footer-bottom .right { margin-top: 0px; }
            footer .footer-bottom .right h5 { display: block; float: none; text-align: center; margin-bottom: 15px; }
        footer .footer-bottom .col.left { order: 2; }
        footer .footer-bottom .col.right { order: 1; }

}

@media screen and (max-width: 767px) {

    h1 { font-size: 32px; line-height: 40px; }
    h2 { font-size: 32px; line-height: 40px; }
    h3 { font-size: 26px; line-height: 34px; }
    h4 { font-size: 23px; line-height: 30px; }
    h5 { font-size: 19px; line-height: 26px; }

    .h1 { font-size: 32px; line-height: 40px; }
    .h2 { font-size: 32px; line-height: 40px; }
    .h3 { font-size: 26px; line-height: 34px; }
    .h4 { font-size: 23px; line-height: 30px; }
    .h5 { font-size: 19px; line-height: 26px; }

    .btn { font-size: 15px; line-height: 17px; padding: 11px 16px; }

     .hero-panel { padding: 55px 10px 80px 10px; }
        .hero-panel .content h1 { margin-bottom: 20px; }
        .hero-panel.internal { padding-top: 50px; padding-bottom: 80px; }

    .internal-header-panel { padding: 45px 10px 50px 10px; }

    .content-panel { padding: 70px 10px 70px 10px; }

    .content-panel.cutout-bg .front { width: 400px; }
    .content-panel.cutout-bg { min-height: 880px; background-size: 810px !important; padding-bottom: 180px; }
    .content-panel.cutout-bg .glow.left { left: 0px; }
    .content-panel.cutout-bg .glow.right { right: 0px; }

    .case-studies-slider-panel .swiper-slide { padding: 70px 10px 140px 10px; }
    .case-studies-slider-panel .swiper-pagination { left: 17px; bottom: 80px; }

    .articles-slider-panel .container { width: 86%; }

    .footer-cta-panel { padding: 50px 10px; }

    footer .footer-top h5.title { margin-bottom: 12px; }
    footer .footer-top ul.links li { font-size: 17px; line-height: 23px; margin-bottom: 12px; }

}

@media screen and (max-width: 700px) {

    .articles-slider-panel .gallery-arrow { display: none!important; }
    .articles-slider-panel .container { width: 100%; }

}

@media screen and (max-width: 576px) {

    .content-panel .container.boxes .col:last-child { margin-bottom: 0px; }

    .content-panel.cutout-bg .front { width: 300px; }
    .content-panel.cutout-bg { min-height: 880px; padding-bottom: 170px; background-size: 610px!important; }
    .content-panel.cutout-bg .glow.left { left: -180px; }
    .content-panel.cutout-bg .glow.right { right: -180px; }

    .content-panel .side-square-img { width: 350px; height: 350px; }

}

@media screen and (max-width: 500px) {

    h1 { font-size: 28px; line-height: 36px; }
    h2 { font-size: 28px; line-height: 36px; }
    h4 { font-size: 22px; line-height: 29px; }

    .h1 { font-size: 28px; line-height: 36px; }
    .h2 { font-size: 28px; line-height: 36px; }
    .h4 { font-size: 22px; line-height: 29px; }

    .content-panel .side-square-img { width: 100%; max-width: 310px; height: 310px; }

}

@media screen and (max-width: 420px) {

    footer .footer-top .details-box p br { display: none; }

}


/**
 *  Slider
 * ========================================================================== */

 .swiper * { -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, Edge, Opera and Firefox */ }

/* Very important for having a smooth transitions. */
.swiper-free-mode > .swiper-wrapper {
    transition-timing-function: linear;
}


.swiper-pagination .swiper-pagination-bullet { background: none; opacity: 1; width: 40px; height: 12px; border: 1px #cccccc solid; border-radius: 10px; margin: 0px 5px; }
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background: #01a1dd; border-color: #01a1dd; width: 90px; height: 12px; }