    <style>

        .card-body .fas:hover {
            color: white !important;
        }

        #main {
            background-color: #F8F9FA;
        }


        .row {
            display: flex;
        }

        .card {
            display: flex;
            flex-direction: column;
            height: 100%;
            transition: background-color 0.3s ease-in-out;

        }

        .card-title {
            font-size: 34px;
            color: #364432;
            text-align: center;
        }

        .card-body {
            flex-grow: 1;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: 34px;
            border: 1px solid rgb(204, 216, 191);
        }

        .card a i {
            color: #708090;
            transition: color 0.3s ease-in-out;
        }

        .card:hover a i {
            color: white !important;
        }

        .all-article {
            text-align: center;
        }

        .green-bar {
            background-color: #BBDDD2
        }

        .btn-cards {
            line-height: 26px;
            width: 80%;
            height: 54px;
            margin: 0 auto;
            border: 2px solid #4C8B7F;
            color: #4C8B7F !important;
            background-color: white !important;
            cursor: pointer;
        }

        .btn-cards:hover {
            background-color: #4C8B7F !important;
            color: white !important;
        }

        .benefit-section {
            background-color: #E7EDE3;
            border-radius: 3px;
            margin: 0px auto;
            margin-top: 10px;
        }

        .benefit-title h5 {
            text-align: center;
        }

        .benefit-title {
            margin: 0 auto;
            padding: 30px 50px 50px 50px;
        }

        .benefit-circle {
            display: flex;
            background-color: #D2DDC8;
            border-radius: 50%;
            width: 140px;
            height: 140px;
            margin: 0 auto;
        }

        .benefit-circle img {
            width: 64px;
            margin: 0 auto;
            text-align: center;
        }

        .card-text {
            padding: 10px
        }

        .go-paperless{
            text-decoration: underline;
            color: #6B9160;
            font-weight: bold;
            font-size: 20px;
        }

        .paperless-body{
            margin-top: 20px;
        }



        @media (max-width: 991px) {

            .benefit-title {
                padding: 32px 16px;
                ;
            }

            .benefit-title h5 {
                font-size: 30px;
            }

            .card-body-first {
                border: 1px solid #B6D1CB;
                border-radius: 3px;
                background-color: #EAEFE5;
            }

            .learningcenter-hero .container {
                padding-bottom: 8px !important;
            }

            .all-article {
                text-align: left;
            }

            .card-title-mobile {
                display: flex;
                justify-content: space-between;
            }

            .card-text {
                margin-top: 0px;
                padding: 0px 0px !important;
                font-size: 16px;
                line-height: 22px;
            }

            .all-article .col-sm-4 {
                flex: 0 0 auto;
                max-width: none;
                margin-bottom: 20px;
            }

            .card {
                width: 100%;
                margin: 0 auto;
            }

            .card-body {
                padding: 25px
            }

            .btn-cards {
                width: 80%;
            }

            .row {
                justify-content: center;
            }

            .cta-container {
                margin-top: 0px !important
            }

            .card-body:hover .icon-con {
                filter: brightness(0) invert(1) !important;
            }

            .breadcrumb-item:last-of-type {
                max-width: 240px;
            }
        }

        @media (max-width: 768px) {
            .paperless-body{
                display: none;
            }
            .btn-cards {
                width: 100%;
            }

            .card-body {
                padding: 15px 12px;
            }
            .card-title {
                font-size: 28px;
            }

            .benefit-circle {
                width: 100px;
                height: 100px;
            }
            .ksp-items{
                width: 200px !important;
                margin: 0 auto;
            }
        }
    </style>