@extends('layouts.front-master')
@section('content')
    <main>
        <style data-emotion="css 5cqqik">
            .css-5cqqik {
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-flex-direction: column;
                -ms-flex-direction: column;
                flex-direction: column;
                width: 100%;
                box-sizing: border-box;
                -webkit-flex-shrink: 0;
                -ms-flex-negative: 0;
                flex-shrink: 0;
                position: -webkit-sticky;
                position: sticky;
                z-index: 1100;
                top: 0;
                left: auto;
                right: 0;
                background-color: #f5f5f5;
                color: rgba(0, 0, 0, 0.87);
                background-image: none;
                background-color: #FFFFFF;
                box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.08);
            }
        </style>
        <style data-emotion="css xgag6u">
            .css-xgag6u {
                background-color: #00040E;
                -webkit-background-size: cover;
                background-size: cover;
                background-repeat: no-repeat;
                -webkit-background-position: center;
                background-position: center;
                background-image: url("/save-bg-xs.webp");
                height: 240px;
            }

            @media (min-width:768px) {
                .css-xgag6u {
                    background-image: url("/save-bg-md.webp");
                    height: 280px;
                }
            }

            @media (min-width:1200px) {
                .css-xgag6u {
                    background-image: url("/save-bg-lg.webp");
                }
            }

            @media (min-width:1536px) {
                .css-xgag6u {
                    background-image: url("/save-bg-xl.webp");
                }
            }
        </style>
        <style data-emotion="css j14jub">
            .css-j14jub {
                background-color: #00040E;
                -webkit-background-size: cover;
                background-size: cover;
                background-repeat: no-repeat;
                -webkit-background-position: center;
                background-position: center;
                background-image: url("images/save-bg-lg.png");
                height: 240px;
            }

            @media (min-width:768px) {
                .css-j14jub {
                    background-image: url("images/save-bg-lg.png");
                    height: 280px;
                }
            }

            @media (min-width:1200px) {
                .css-j14jub {
                    background-image: url("images/save-bg-lg.png");
                }
            }

            @media (min-width:1536px) {
                .css-j14jub {
                    background-image: url("images/save-bg-lg.png");
                }
            }
        </style>
        <div class="MuiBox-root css-j14jub"></div>
        <style data-emotion="css i6bazn">
            .css-i6bazn {
                overflow: hidden;
            }
        </style>
        <style data-emotion="css rycext">
            .css-rycext {
                background-color: #FFFFFF;
                color: rgba(0, 0, 0, 0.87);
                -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                box-shadow: none;
                overflow: hidden;
            }
        </style>
        <div class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 css-rycext">
            <style data-emotion="css 1a6bt1h">
                .css-1a6bt1h {
                    margin-top: 80px;
                    margin-bottom: 120px;
                    padding-left: 24px;
                    padding-right: 24px;
                    text-align: center;
                }

                @media (min-width:428px) {
                    .css-1a6bt1h {
                        padding-right: 24px;
                    }
                }
            </style>
            <style data-emotion="css cxxm1f">
                .css-cxxm1f {
                    width: 100%;
                    margin-left: auto;
                    box-sizing: border-box;
                    margin-right: auto;
                    display: block;
                    padding-left: 16px;
                    padding-right: 16px;
                    padding-left: 24px;
                    padding-right: 24px;
                    margin-top: 80px;
                    margin-bottom: 120px;
                    padding-left: 24px;
                    padding-right: 24px;
                    text-align: center;
                }

                @media (min-width:428px) {
                    .css-cxxm1f {
                        padding-left: 24px;
                        padding-right: 24px;
                    }
                }

                @media (min-width:428px) {
                    .css-cxxm1f {
                        max-width: 428px;
                    }
                }

                @media (min-width:768px) {
                    .css-cxxm1f {
                        max-width: 768px;
                    }
                }

                @media (min-width:1200px) {
                    .css-cxxm1f {
                        max-width: 1200px;
                    }
                }

                @media (min-width:1536px) {
                    .css-cxxm1f {
                        max-width: 1536px;
                    }
                }

                @media (min-width:1200px) {
                    .css-cxxm1f {
                        max-width: 1200px;
                    }
                }

                @media (min-width:768px) {
                    .css-cxxm1f {
                        padding-left: 40px;
                        padding-right: 40px;
                    }
                }

                @media (min-width:1200px) {
                    .css-cxxm1f {
                        padding-left: 80px;
                        padding-right: 80px;
                    }
                }

                @media (min-width:428px) {
                    .css-cxxm1f {
                        padding-right: 24px;
                    }
                }
            </style>
            <div class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed css-cxxm1f">
                <style data-emotion="css z2jyos">
                    .css-z2jyos {
                        padding: 0px;
                    }

                    @media (min-width:768px) {
                        .css-z2jyos {
                            padding: 16px;
                        }
                    }

                    @media (min-width:1200px) {
                        .css-z2jyos {
                            padding-left: 200px;
                            padding-right: 200px;
                        }
                    }

                    @media (min-width:1536px) {
                        .css-z2jyos {
                            padding-left: 200px;
                            padding-right: 200px;
                        }
                    }
                </style>
                <style data-emotion="css 6ibvzh">
                    .css-6ibvzh {
                        padding: 0px;
                    }

                    @media (min-width:768px) {
                        .css-6ibvzh {
                            padding: 16px;
                        }
                    }

                    @media (min-width:1200px) {
                        .css-6ibvzh {
                            padding-left: 200px;
                            padding-right: 200px;
                        }
                    }

                    @media (min-width:1536px) {
                        .css-6ibvzh {
                            padding-left: 200px;
                            padding-right: 200px;
                        }
                    }
                </style>
                <div class="MuiBox-root css-6ibvzh">
                    <style data-emotion="css vjefvb">
                        .css-vjefvb {
                            padding-top: 40px;
                            padding-bottom: 40px;
                            padding-left: 24px;
                            padding-right: 24px;
                        }

                        @media (min-width:768px) {
                            .css-vjefvb {
                                padding-bottom: 56px;
                            }
                        }
                    </style>
                    <style data-emotion="css 1o4drlu">
                        .css-1o4drlu {
                            padding-top: 40px;
                            padding-bottom: 40px;
                            padding-left: 24px;
                            padding-right: 24px;
                        }

                        @media (min-width:768px) {
                            .css-1o4drlu {
                                padding-bottom: 56px;
                            }
                        }
                    </style>
                    <div class="MuiBox-root css-1o4drlu">
                        <style data-emotion="css 1q7gyzr">
                            .css-1q7gyzr {
                                margin: 0;
                                font-size: 30px;
                                line-height: 1.333;
                                font-weight: bold;
                                font-family: Poppins, Noto Sans Thai, sans-serif;
                            }

                            @media (min-width:768px) {
                                .css-1q7gyzr {
                                    font-size: 40px;
                                    line-height: 1.2;
                                }
                            }
                        </style><span class="MuiTypography-root MuiTypography-h3 css-1q7gyzr"
                            data-testid="save-sec-2-title">
                            <style data-emotion="css 1cj8yo0">
                                .css-1cj8yo0 {
                                    margin: 0;
                                    font-size: 40px;
                                    line-height: 1.1;
                                    font-weight: bold;
                                    font-family: Poppins, Noto Sans Thai, sans-serif;
                                    color: #00CA45;
                                    margin-top: 8px;
                                    padding: 0px;
                                }

                                @media (min-width:768px) {
                                    .css-1cj8yo0 {
                                        font-size: 72px;
                                        line-height: 1;
                                    }
                                }
                            </style>
                            <h2 class="MuiTypography-root MuiTypography-h2 css-1cj8yo0"
                                data-testid="save-sec-2-hightlight-title">CPALL! Save</h2>High-Interest Savings Account
                        </span>
                    </div>
                    <style data-emotion="css 1vgf6t">
                        .css-1vgf6t {
                            margin: auto;
                            max-width: 100%;
                            padding-left: 38px;
                            padding-right: 38px;
                        }
                    </style>
                    <style data-emotion="css c4po8a">
                        .css-c4po8a {
                            margin: auto;
                            max-width: 100%;
                            padding-left: 38px;
                            padding-right: 38px;
                        }
                    </style>
                    <div class="MuiBox-root css-c4po8a">
                        <style data-emotion="css 1tmli6w">
                            .css-1tmli6w {
                                margin: 0;
                                font-size: 14px;
                                line-height: 1.714;
                                font-weight: 400;
                                font-family: Poppins, Noto Sans Thai, sans-serif;
                            }

                            @media (min-width:768px) {
                                .css-1tmli6w {
                                    font-size: 16px;
                                    line-height: 1.75;
                                }
                            }
                        </style>
                        <p class="MuiTypography-root MuiTypography-body1 css-1tmli6w" data-testid="have_no_directus"><span
                                class="MuiTypography-root MuiTypography-body1 css-1tmli6w"
                                data-testid="save-sec-2-desc">Save now and earn up to 3% interest by KKP Bank. Transact
                                anytime, anywhere. No minimum.</span></p>
                    </div>
                </div>
            </div>
        </div>
        <style data-emotion="css 12kwd43">
            .css-12kwd43 {
                padding: 16px;
                padding-top: 80px;
                padding-bottom: 80px;
                overflow: hidden;
                background-color: #66bb6a;
                -webkit-background-size: cover;
                background-size: cover;
                background-repeat: no-repeat;
                -webkit-background-position: center;
                background-position: center;
                background-image: url("/save-interest-bg-xs.webp");
            }

            @media (min-width:768px) {
                .css-12kwd43 {
                    background-image: url("/save-interest-bg-md.webp");
                }
            }

            @media (min-width:1200px) {
                .css-12kwd43 {
                    background-image: url("/save-interest-bg-lg.webp");
                }
            }

            @media (min-width:1536px) {
                .css-12kwd43 {
                    background-image: url("/save-interest-bg-xl.webp");
                }
            }
        </style>
        <style data-emotion="css 1nhhda4">
            .css-1nhhda4 {
                background-color: #111111;
                color: #fff;
                -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                box-shadow: none;
                background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
                padding: 16px;
                padding-top: 80px;
                padding-bottom: 80px;
                overflow: hidden;
                background-color: #66bb6a;
                -webkit-background-size: cover;
                background-size: cover;
                background-repeat: no-repeat;
                -webkit-background-position: center;
                background-position: center;
                background-image: url("/save-interest-bg-xs.webp");
            }

            @media (min-width:768px) {
                .css-1nhhda4 {
                    background-image: url("/save-interest-bg-md.webp");
                }
            }

            @media (min-width:1200px) {
                .css-1nhhda4 {
                    background-image: url("/save-interest-bg-lg.webp");
                }
            }

            @media (min-width:1536px) {
                .css-1nhhda4 {
                    background-image: url("/save-interest-bg-xl.webp");
                }
            }
        </style>
        <div class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 css-1nhhda4">
            <style data-emotion="css 1ydepa1">
                .css-1ydepa1 {
                    padding: 0;
                }

                @media (min-width:768px) {
                    .css-1ydepa1 {
                        padding: 0px;
                    }
                }

                @media (min-width:1200px) {
                    .css-1ydepa1 {
                        padding: 0px 40px;
                    }
                }

                @media (min-width:1536px) {
                    .css-1ydepa1 {
                        padding: 0px 80px;
                    }
                }
            </style>
            <style data-emotion="css 1lsil8c">
                .css-1lsil8c {
                    width: 100%;
                    margin-left: auto;
                    box-sizing: border-box;
                    margin-right: auto;
                    display: block;
                    padding-left: 16px;
                    padding-right: 16px;
                    padding-left: 24px;
                    padding-right: 24px;
                    padding: 0;
                }

                @media (min-width:428px) {
                    .css-1lsil8c {
                        padding-left: 24px;
                        padding-right: 24px;
                    }
                }

                @media (min-width:1200px) {
                    .css-1lsil8c {
                        max-width: 1200px;
                    }
                }

                @media (min-width:768px) {
                    .css-1lsil8c {
                        padding-left: 40px;
                        padding-right: 40px;
                    }
                }

                @media (min-width:1200px) {
                    .css-1lsil8c {
                        padding-left: 80px;
                        padding-right: 80px;
                    }
                }

                @media (min-width:768px) {
                    .css-1lsil8c {
                        padding: 0px;
                    }
                }

                @media (min-width:1200px) {
                    .css-1lsil8c {
                        padding: 0px 40px;
                    }
                }

                @media (min-width:1536px) {
                    .css-1lsil8c {
                        padding: 0px 80px;
                    }
                }
            </style>
            <div class="MuiContainer-root MuiContainer-maxWidthLg css-1lsil8c">
                <style data-emotion="css 16y1i0r">
                    .css-16y1i0r {
                        margin: 0;
                        font-size: 30px;
                        line-height: 1.333;
                        font-weight: bold;
                        font-family: Poppins, Noto Sans Thai, sans-serif;
                        text-align: center;
                    }

                    @media (min-width:768px) {
                        .css-16y1i0r {
                            font-size: 40px;
                            line-height: 1.2;
                        }
                    }
                </style>
                <h3 class="MuiTypography-root MuiTypography-h3 css-16y1i0r" data-testid="save-sec-interest-title">
                    <style data-emotion="css 6heq0z">
                        .css-6heq0z {
                            margin: 0;
                            font-size: 30px;
                            line-height: 1.333;
                            font-weight: bold;
                            font-family: Poppins, Noto Sans Thai, sans-serif;
                            color: #5DF591;
                        }

                        @media (min-width:768px) {
                            .css-6heq0z {
                                font-size: 40px;
                                line-height: 1.2;
                            }
                        }
                    </style><span class="MuiTypography-root MuiTypography-h3 css-6heq0z">Earn up to 3%</span> Interest.
                    <style data-emotion="css 10ib5jr">
                        .css-10ib5jr {
                            margin-bottom: 40px;
                        }
                    </style>
                    <div class="MuiBox-root css-10ib5jr"></div>
                </h3>
                <style data-emotion="css n2hvci">
                    .css-n2hvci {
                        margin: 0;
                        font-size: 18px;
                        line-height: 1.333;
                        font-weight: bold;
                        font-family: Poppins, Noto Sans Thai, sans-serif;
                        text-align: center;
                    }

                    @media (min-width:768px) {
                        .css-n2hvci {
                            font-size: 22px;
                            line-height: 1.273;
                        }
                    }
                </style>
                <h5 class="MuiTypography-root MuiTypography-h5 css-n2hvci" data-testid="save-sec-interest-desc">Earn high
                    interest from your first baht powered by KKP Bank – calculated daily and paid every six months on June
                    30th and December 31st.</h5>
                <style data-emotion="css 4n5rmm">
                    .css-4n5rmm {
                        margin-top: 56px;
                        padding: 0px;
                    }
                </style>
                <style data-emotion="css blx8ux">
                    .css-blx8ux {
                        width: 100%;
                        margin-left: auto;
                        box-sizing: border-box;
                        margin-right: auto;
                        display: block;
                        padding-left: 16px;
                        padding-right: 16px;
                        padding-left: 24px;
                        padding-right: 24px;
                        margin-top: 56px;
                        padding: 0px;
                    }

                    @media (min-width:428px) {
                        .css-blx8ux {
                            padding-left: 24px;
                            padding-right: 24px;
                        }
                    }

                    @media (min-width:1200px) {
                        .css-blx8ux {
                            max-width: 1200px;
                        }
                    }

                    @media (min-width:768px) {
                        .css-blx8ux {
                            padding-left: 40px;
                            padding-right: 40px;
                        }
                    }

                    @media (min-width:1200px) {
                        .css-blx8ux {
                            padding-left: 80px;
                            padding-right: 80px;
                        }
                    }
                </style>
                <div class="MuiContainer-root MuiContainer-maxWidthLg css-blx8ux">
                    <style data-emotion="css 1ae9kzf">
                        .css-1ae9kzf {
                            margin-bottom: 12px;
                        }

                        .css-1ae9kzf:first-of-type {
                            background-color: #111111;
                        }
                    </style>
                    <style data-emotion="css wo0toz">
                        .css-wo0toz {
                            overflow: hidden;
                            border-radius: 12px;
                            box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);
                            margin-bottom: 12px;
                        }

                        @media (min-width:768px) {
                            .css-wo0toz {
                                border-radius: 20px;
                            }
                        }

                        .css-wo0toz:first-of-type {
                            background-color: #111111;
                        }
                    </style>
                    <style data-emotion="css mk364g">
                        .css-mk364g {
                            background-color: #FFFFFF;
                            color: rgba(0, 0, 0, 0.87);
                            -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                            transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                            border-radius: 4px;
                            box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
                            overflow: hidden;
                            border-radius: 12px;
                            box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);
                            margin-bottom: 12px;
                        }

                        @media (min-width:768px) {
                            .css-mk364g {
                                border-radius: 20px;
                            }
                        }

                        .css-mk364g:first-of-type {
                            background-color: #111111;
                        }
                    </style>
                    <div
                        class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation8 MuiCard-root css-mk364g">
                        <style data-emotion="css 1ysxa3i">
                            .css-1ysxa3i {
                                display: grid;
                                grid-template-columns: 1.8fr 0.2fr 1fr;
                            }

                            .css-1ysxa3i:last-child {
                                padding: 20px 24px;
                            }

                            @media (min-width:428px) {
                                .css-1ysxa3i:last-child {
                                    padding: 20px 40px;
                                }
                            }

                            @media (min-width:768px) {
                                .css-1ysxa3i {
                                    grid-template-columns: 1.3fr 0.2fr 1fr;
                                }
                            }

                            @media (min-width:1200px) {
                                .css-1ysxa3i {
                                    grid-template-columns: 1.5fr 0fr 1.3fr;
                                }
                            }

                            @media (min-width:1536px) {
                                .css-1ysxa3i {
                                    grid-template-columns: 1.5fr 0fr 1.25fr;
                                }
                            }
                        </style>
                        <style data-emotion="css 1n6bowz">
                            .css-1n6bowz {
                                padding: 16px;
                                display: grid;
                                grid-template-columns: 1.8fr 0.2fr 1fr;
                            }

                            .css-1n6bowz:last-child {
                                padding-bottom: 24px;
                            }

                            .css-1n6bowz:last-child {
                                padding: 20px 24px;
                            }

                            @media (min-width:428px) {
                                .css-1n6bowz:last-child {
                                    padding: 20px 40px;
                                }
                            }

                            @media (min-width:768px) {
                                .css-1n6bowz {
                                    grid-template-columns: 1.3fr 0.2fr 1fr;
                                }
                            }

                            @media (min-width:1200px) {
                                .css-1n6bowz {
                                    grid-template-columns: 1.5fr 0fr 1.3fr;
                                }
                            }

                            @media (min-width:1536px) {
                                .css-1n6bowz {
                                    grid-template-columns: 1.5fr 0fr 1.25fr;
                                }
                            }
                        </style>
                        <div class="MuiCardContent-root css-1n6bowz">
                            <style data-emotion="css mypo7y">
                                .css-mypo7y.first-col-interest-title {
                                    color: #FFFFFF;
                                }

                                .css-mypo7y.second-col-interest-title {
                                    color: #FFFFFF;
                                    margin: auto;
                                }

                                .css-mypo7y.second-col-interest-desc {
                                    text-align: end;
                                    margin-right: 16px;
                                }

                                @media (min-width:768px) {
                                    .css-mypo7y.first-col-interest-title {
                                        margin: auto;
                                    }

                                    .css-mypo7y.first-col-interest-desc {
                                        margin: auto;
                                    }

                                    .css-mypo7y.second-col-interest-desc {
                                        text-align: center;
                                        margin-right: 0;
                                    }
                                }
                            </style>
                            <style data-emotion="css 1d4puyr">
                                .css-1d4puyr {
                                    margin: 0;
                                    font-size: 14px;
                                    line-height: 2.143;
                                    font-weight: bold;
                                    font-family: Poppins, Noto Sans Thai, sans-serif;
                                }

                                @media (min-width:768px) {
                                    .css-1d4puyr {
                                        font-size: 18px;
                                        line-height: 2.222;
                                    }
                                }

                                .css-1d4puyr.first-col-interest-title {
                                    color: #FFFFFF;
                                }

                                .css-1d4puyr.second-col-interest-title {
                                    color: #FFFFFF;
                                    margin: auto;
                                }

                                .css-1d4puyr.second-col-interest-desc {
                                    text-align: end;
                                    margin-right: 16px;
                                }

                                @media (min-width:768px) {
                                    .css-1d4puyr.first-col-interest-title {
                                        margin: auto;
                                    }

                                    .css-1d4puyr.first-col-interest-desc {
                                        margin: auto;
                                    }

                                    .css-1d4puyr.second-col-interest-desc {
                                        text-align: center;
                                        margin-right: 0;
                                    }
                                }
                            </style>
                            <h6 class="MuiTypography-root MuiTypography-h6 first-col-interest-title css-1d4puyr"
                                data-testid="first-col-title">Saving Balance</h6>
                            <div class="MuiBox-root css-0"></div>
                            <h6 class="MuiTypography-root MuiTypography-h6 second-col-interest-title css-1d4puyr"
                                data-testid="second-col-title">Interest Rate (p.a.)</h6>
                        </div>
                    </div>
                    <div
                        class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation8 MuiCard-root css-mk364g">
                        <div class="MuiCardContent-root css-1n6bowz">
                            <style data-emotion="css 343dpd">
                                .css-343dpd {
                                    margin: 0;
                                    font-size: 14px;
                                    line-height: 1.714;
                                    font-weight: 400;
                                    font-family: Poppins, Noto Sans Thai, sans-serif;
                                }

                                @media (min-width:768px) {
                                    .css-343dpd {
                                        font-size: 16px;
                                        line-height: 1.75;
                                    }
                                }

                                .css-343dpd.first-col-interest-title {
                                    color: #FFFFFF;
                                }

                                .css-343dpd.second-col-interest-title {
                                    color: #FFFFFF;
                                    margin: auto;
                                }

                                .css-343dpd.second-col-interest-desc {
                                    text-align: end;
                                    margin-right: 16px;
                                }

                                @media (min-width:768px) {
                                    .css-343dpd.first-col-interest-title {
                                        margin: auto;
                                    }

                                    .css-343dpd.first-col-interest-desc {
                                        margin: auto;
                                    }

                                    .css-343dpd.second-col-interest-desc {
                                        text-align: center;
                                        margin-right: 0;
                                    }
                                }
                            </style>
                            <p class="MuiTypography-root MuiTypography-body1 first-col-interest-desc css-343dpd"
                                data-testid="first-col-desc">The portion not exceeding 10,000 THB</p>
                            <div class="MuiBox-root css-0"></div>
                            <h6 class="MuiTypography-root MuiTypography-h6 second-col-interest-desc css-1d4puyr"
                                data-testid="second-col-desc">3.00%</h6>
                        </div>
                    </div>
                    <div
                        class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation8 MuiCard-root css-mk364g">
                        <div class="MuiCardContent-root css-1n6bowz">
                            <p class="MuiTypography-root MuiTypography-body1 first-col-interest-desc css-343dpd"
                                data-testid="first-col-desc">The portion over 10,000 THB but not exceeding 1,000,000 THB
                            </p>
                            <div class="MuiBox-root css-0"></div>
                            <h6 class="MuiTypography-root MuiTypography-h6 second-col-interest-desc css-1d4puyr"
                                data-testid="second-col-desc">1.50%</h6>
                        </div>
                    </div>
                    <div
                        class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation8 MuiCard-root css-mk364g">
                        <div class="MuiCardContent-root css-1n6bowz">
                            <p class="MuiTypography-root MuiTypography-body1 first-col-interest-desc css-343dpd"
                                data-testid="first-col-desc">The portion over 1,000,000 THB</p>
                            <div class="MuiBox-root css-0"></div>
                            <h6 class="MuiTypography-root MuiTypography-h6 second-col-interest-desc css-1d4puyr"
                                data-testid="second-col-desc">0.50%</h6>
                        </div>
                    </div>
                </div>
                <style data-emotion="css poyypo">
                    .css-poyypo {
                        margin: 0;
                        font-size: 14px;
                        line-height: 2.143;
                        font-weight: bold;
                        font-family: Poppins, Noto Sans Thai, sans-serif;
                        text-align: center;
                    }

                    @media (min-width:768px) {
                        .css-poyypo {
                            font-size: 18px;
                            line-height: 2.222;
                        }
                    }
                </style>
                <h6 class="MuiTypography-root MuiTypography-h6 css-poyypo" style="margin-top:32px"
                    data-testid="save-sec-interest-see-more-desc">This savings account is a tiered-rate account, where
                    different rates apply to different balance levels. Learn about how your interest is calculated below.
                </h6><a href="https://dime.co.th/en/articles/how-to-calculate-dime-save-interest" target="_blank"
                    rel="noreferrer" style="text-decoration:none"><a aria-label="Manage page"
                        style="text-decoration:none;display:flex;justify-content:center;margin-top:12px">
                        <style data-emotion="css q4zdoq">
                            .css-q4zdoq {
                                text-transform: none;
                                font-size: 14px;
                                font-weight: 600;
                                line-height: 1.714;
                                font-family: Poppins, Noto Sans Thai, sans-serif;
                                min-width: 64px;
                                padding: 6px 16px;
                                border-radius: 4px;
                                -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                                transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                                color: #111111;
                                background-color: #5DF591;
                                box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
                                border-radius: 8px;
                                width: 200px;
                            }

                            .css-q4zdoq:hover {
                                -webkit-text-decoration: none;
                                text-decoration: none;
                                background-color: rgb(65, 171, 101);
                                box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
                            }

                            @media (hover: none) {
                                .css-q4zdoq:hover {
                                    background-color: #5DF591;
                                }
                            }

                            .css-q4zdoq:active {
                                box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
                            }

                            .css-q4zdoq.Mui-focusVisible {
                                box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
                            }

                            .css-q4zdoq.Mui-disabled {
                                color: rgba(255, 255, 255, 0.3);
                                box-shadow: none;
                                background-color: rgba(255, 255, 255, 0.12);
                            }
                        </style>
                        <style data-emotion="css 123pepk">
                            .css-123pepk {
                                display: -webkit-inline-box;
                                display: -webkit-inline-flex;
                                display: -ms-inline-flexbox;
                                display: inline-flex;
                                -webkit-align-items: center;
                                -webkit-box-align: center;
                                -ms-flex-align: center;
                                align-items: center;
                                -webkit-box-pack: center;
                                -ms-flex-pack: center;
                                -webkit-justify-content: center;
                                justify-content: center;
                                position: relative;
                                box-sizing: border-box;
                                -webkit-tap-highlight-color: transparent;
                                background-color: transparent;
                                outline: 0;
                                border: 0;
                                margin: 0;
                                border-radius: 0;
                                padding: 0;
                                cursor: pointer;
                                -webkit-user-select: none;
                                -moz-user-select: none;
                                -ms-user-select: none;
                                user-select: none;
                                vertical-align: middle;
                                -moz-appearance: none;
                                -webkit-appearance: none;
                                -webkit-text-decoration: none;
                                text-decoration: none;
                                color: inherit;
                                text-transform: none;
                                font-size: 14px;
                                font-weight: 600;
                                line-height: 1.714;
                                font-family: Poppins, Noto Sans Thai, sans-serif;
                                min-width: 64px;
                                padding: 6px 16px;
                                border-radius: 4px;
                                -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                                transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                                color: #111111;
                                background-color: #5DF591;
                                box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
                                border-radius: 8px;
                                width: 200px;
                            }

                            .css-123pepk::-moz-focus-inner {
                                border-style: none;
                            }

                            .css-123pepk.Mui-disabled {
                                pointer-events: none;
                                cursor: default;
                            }

                            @media print {
                                .css-123pepk {
                                    -webkit-print-color-adjust: exact;
                                    color-adjust: exact;
                                }
                            }

                            .css-123pepk:hover {
                                -webkit-text-decoration: none;
                                text-decoration: none;
                                background-color: rgb(65, 171, 101);
                                box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
                            }

                            @media (hover: none) {
                                .css-123pepk:hover {
                                    background-color: #5DF591;
                                }
                            }

                            .css-123pepk:active {
                                box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
                            }

                            .css-123pepk.Mui-focusVisible {
                                box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
                            }

                            .css-123pepk.Mui-disabled {
                                color: rgba(255, 255, 255, 0.3);
                                box-shadow: none;
                                background-color: rgba(255, 255, 255, 0.12);
                            }
                        </style><button
                            class="MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButtonBase-root  css-123pepk"
                            tabindex="0" type="button" style="opacity:0;transform:translate3d(0,150px,0)">
                            <style data-emotion="css qkd41n">
                                .css-qkd41n {
                                    margin: 0;
                                    font-size: 14px;
                                    line-height: 2.143;
                                    font-weight: bold;
                                    font-family: Poppins, Noto Sans Thai, sans-serif;
                                }

                                @media (min-width:768px) {
                                    .css-qkd41n {
                                        font-size: 18px;
                                        line-height: 2.222;
                                    }
                                }
                            </style>
                            <h6 class="MuiTypography-root MuiTypography-h6 css-qkd41n"
                                data-testid="save-sec-interest-see-more-button">How to Calculate</h6>
                        </button>
                    </a></a>
            </div>
        </div>
        <style data-emotion="css i6bazn">
            .css-i6bazn {
                overflow: hidden;
            }
        </style>
        <style data-emotion="css rycext">
            .css-rycext {
                background-color: #FFFFFF;
                color: rgba(0, 0, 0, 0.87);
                -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                box-shadow: none;
                overflow: hidden;
            }
        </style>
        <div class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 css-rycext">
            <style data-emotion="css 1j5121h">
                .css-1j5121h {
                    padding: 56px 0px 0px;
                }

                @media (min-width:768px) {
                    .css-1j5121h {
                        padding: 64px 0px 0px;
                    }
                }

                @media (min-width:1200px) {
                    .css-1j5121h {
                        padding: 88px 0px 0px;
                    }
                }
            </style>
            <style data-emotion="css ivpfq7">
                .css-ivpfq7 {
                    width: 100%;
                    margin-left: auto;
                    box-sizing: border-box;
                    margin-right: auto;
                    display: block;
                    padding-left: 16px;
                    padding-right: 16px;
                    padding-left: 24px;
                    padding-right: 24px;
                    padding: 56px 0px 0px;
                }

                @media (min-width:428px) {
                    .css-ivpfq7 {
                        padding-left: 24px;
                        padding-right: 24px;
                    }
                }

                @media (min-width:428px) {
                    .css-ivpfq7 {
                        max-width: 428px;
                    }
                }

                @media (min-width:768px) {
                    .css-ivpfq7 {
                        max-width: 768px;
                    }
                }

                @media (min-width:1200px) {
                    .css-ivpfq7 {
                        max-width: 1200px;
                    }
                }

                @media (min-width:1536px) {
                    .css-ivpfq7 {
                        max-width: 1536px;
                    }
                }

                @media (min-width:1200px) {
                    .css-ivpfq7 {
                        max-width: 1200px;
                    }
                }

                @media (min-width:768px) {
                    .css-ivpfq7 {
                        padding-left: 40px;
                        padding-right: 40px;
                    }
                }

                @media (min-width:1200px) {
                    .css-ivpfq7 {
                        padding-left: 80px;
                        padding-right: 80px;
                    }
                }

                @media (min-width:768px) {
                    .css-ivpfq7 {
                        padding: 64px 0px 0px;
                    }
                }

                @media (min-width:1200px) {
                    .css-ivpfq7 {
                        padding: 88px 0px 0px;
                    }
                }
            </style>
            <div class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed css-ivpfq7">
                <div class="MuiBox-root css-0" data-testid="dime-save-highlight-feature">
                    <style data-emotion="css gvwwm">
                        .css-gvwwm {
                            padding-top: 24px;
                        }

                        @media (min-width:768px) {
                            .css-gvwwm {
                                padding-top: 48px;
                            }
                        }

                        @media (min-width:1200px) {
                            .css-gvwwm {
                                padding-top: 56px;
                            }
                        }
                    </style>
                    <style data-emotion="css 1bae91e">
                        .css-1bae91e {
                            padding-top: 24px;
                        }

                        @media (min-width:768px) {
                            .css-1bae91e {
                                padding-top: 48px;
                            }
                        }

                        @media (min-width:1200px) {
                            .css-1bae91e {
                                padding-top: 56px;
                            }
                        }
                    </style>
                    <div class="MuiBox-root css-1bae91e">
                        <style data-emotion="css ywcth2">
                            .css-ywcth2 {
                                padding-bottom: 56px;
                                text-align: center;
                            }

                            @media (min-width:1200px) {
                                .css-ywcth2 {
                                    display: grid;
                                    grid-template-columns: 1fr 1fr;
                                    gap: 40px;
                                    padding: 0px;
                                    text-align: left;
                                }

                                .css-ywcth2.image-right {
                                    grid-template-columns: 1fr 1fr;
                                }
                            }
                        </style>
                        <style data-emotion="css u40d4r">
                            .css-u40d4r {
                                padding-bottom: 56px;
                                text-align: center;
                            }

                            @media (min-width:1200px) {
                                .css-u40d4r {
                                    display: grid;
                                    grid-template-columns: 1fr 1fr;
                                    gap: 40px;
                                    padding: 0px;
                                    text-align: left;
                                }

                                .css-u40d4r.image-right {
                                    grid-template-columns: 1fr 1fr;
                                }
                            }
                        </style>
                        <div class="image-right MuiBox-root css-u40d4r">
                            <style data-emotion="css 2f6ydt">
                                .css-2f6ydt {
                                    width: 295px;
                                    height: 524.5px;
                                    position: relative;
                                    padding: 0px 16px;
                                    margin: auto;
                                }

                                @media (min-width:768px) {
                                    .css-2f6ydt {
                                        width: 350px;
                                        height: 622px;
                                    }
                                }

                                @media (min-width:1200px) {
                                    .css-2f6ydt {
                                        -webkit-align-self: start;
                                        -ms-flex-item-align: start;
                                        align-self: start;
                                        width: 468px;
                                        height: 832px;
                                    }

                                    .css-2f6ydt.image-right {
                                        grid-column: 2/3;
                                    }
                                }
                            </style>
                            <style data-emotion="css eu30ki">
                                .css-eu30ki {
                                    width: 295px;
                                    height: 524.5px;
                                    position: relative;
                                    padding: 0px 16px;
                                    margin: auto;
                                }

                                @media (min-width:768px) {
                                    .css-eu30ki {
                                        width: 350px;
                                        height: 622px;
                                    }
                                }

                                @media (min-width:1200px) {
                                    .css-eu30ki {
                                        -webkit-align-self: start;
                                        -ms-flex-item-align: start;
                                        align-self: start;
                                        width: 468px;
                                        height: 832px;
                                    }

                                    .css-eu30ki.image-right {
                                        grid-column: 2/3;
                                    }
                                }
                            </style>
                            <div class="image-right MuiBox-root css-eu30ki">
                                <style data-emotion="css bej6eo">
                                    .css-bej6eo {
                                        position: absolute;
                                        margin-right: 16px;
                                    }
                                </style>
                                <style data-emotion="css 1yico7t">
                                    .css-1yico7t {
                                        position: absolute;
                                        margin-right: 16px;
                                    }
                                </style>
                                <div class="MuiBox-root css-1yico7t"><span
                                        style="box-sizing:border-box;display:inline-block;overflow:hidden;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;position:relative;max-width:100%"><span
                                            style="box-sizing:border-box;display:block;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;max-width:100%"><img
                                                style="display:block;max-width:100%;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0"
                                                alt="" aria-hidden="true"
                                                src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTA4MSIgaGVpZ2h0PSIxOTIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIvPg==" /></span><img
                                            alt="animation background"
                                            src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"
                                            decoding="async" data-nimg="intrinsic"
                                            style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%" /><noscript><img
                                                alt="animation background"
                                                srcSet="/_next/image?url=%2Fanimation-bg.webp&amp;w=1200&amp;q=75 1x, /_next/image?url=%2Fanimation-bg.webp&amp;w=3840&amp;q=75 2x"
                                                src="/_next/image?url=%2Fanimation-bg.webp&amp;w=3840&amp;q=75"
                                                decoding="async" data-nimg="intrinsic"
                                                style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%"
                                                loading="lazy" /></noscript></span>
                                </div><span
                                    style="box-sizing:border-box;display:inline-block;overflow:hidden;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;position:relative;max-width:100%"><span
                                        style="box-sizing:border-box;display:block;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;max-width:100%">
                                        <img
                                            style="display:block;max-width:100%;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0"
                                            alt="" aria-hidden="true"
                                            src="{{ asset('images/save-cash.gif') }}" /></span>
                                            <img
                                        alt="Save Cash Image" data-testid="save-highlight-feature-image-1"
                                        src="{{ asset('images/save-cash.gif') }}"
                                        decoding="async" data-nimg="intrinsic"
                                        style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%" /><noscript><img
                                            alt="Save Cash Image" data-testid="save-highlight-feature-image-1"
                                            srcSet="{{ asset('images/save-cash.gif') }}"
                                            src="{{ asset('images/save-cash.gif') }}" decoding="async"
                                            data-nimg="intrinsic"
                                            style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%"
                                            loading="lazy" /></noscript></span>
                            </div>
                            <style data-emotion="css es3tky">
                                .css-es3tky {
                                    color: #898989;
                                    margin: auto;
                                }

                                @media (max-width:767.95px) {
                                    .css-es3tky {
                                        padding: 0px 16px;
                                    }
                                }

                                @media (min-width:768px) {
                                    .css-es3tky.image-right {
                                        padding-left: 16px;
                                        grid-row-start: 1;
                                        grid-column: 1/2;
                                    }
                                }

                                @media (min-width:1200px) {
                                    .css-es3tky.image-right {
                                        padding-left: 72px;
                                    }
                                }
                            </style>
                            <style data-emotion="css 5o8v0t">
                                .css-5o8v0t {
                                    color: #898989;
                                    margin: auto;
                                }

                                @media (max-width:767.95px) {
                                    .css-5o8v0t {
                                        padding: 0px 16px;
                                    }
                                }

                                @media (min-width:768px) {
                                    .css-5o8v0t.image-right {
                                        padding-left: 16px;
                                        grid-row-start: 1;
                                        grid-column: 1/2;
                                    }
                                }

                                @media (min-width:1200px) {
                                    .css-5o8v0t.image-right {
                                        padding-left: 72px;
                                    }
                                }
                            </style>
                            <div class="image-right MuiBox-root css-5o8v0t">
                                <style data-emotion="css 1tmli6w">
                                    .css-1tmli6w {
                                        margin: 0;
                                        font-size: 14px;
                                        line-height: 1.714;
                                        font-weight: 400;
                                        font-family: Poppins, Noto Sans Thai, sans-serif;
                                    }

                                    @media (min-width:768px) {
                                        .css-1tmli6w {
                                            font-size: 16px;
                                            line-height: 1.75;
                                        }
                                    }
                                </style>
                                <p class="MuiTypography-root MuiTypography-body1 css-1tmli6w"
                                    data-testid="hf-hightlight-desc">
                                    <style data-emotion="css 9gkufl">
                                        .css-9gkufl {
                                            color: #111111;
                                        }
                                    </style>
                                    <style data-emotion="css 17xkqdb">
                                        .css-17xkqdb {
                                            margin: 0;
                                            font-size: 30px;
                                            line-height: 1.333;
                                            font-weight: bold;
                                            font-family: Poppins, Noto Sans Thai, sans-serif;
                                            color: #111111;
                                        }

                                        @media (min-width:768px) {
                                            .css-17xkqdb {
                                                font-size: 40px;
                                                line-height: 1.2;
                                            }
                                        }
                                    </style>
                                <h3 class="MuiTypography-root MuiTypography-h3 css-17xkqdb"
                                    data-testid="hf-hightlight-title">Transact Anytime, Anywhere.</h3>
                                <h3 class="MuiTypography-root MuiTypography-h3 css-17xkqdb"
                                    data-testid="hf-hightlight-title">
                                    <style data-emotion="css 1rreq7x">
                                        .css-1rreq7x {
                                            background: linear-gradient(180deg, transparent 50%, #5DF591 50% 90%, rgba(0, 0, 0, 0) 90%);
                                        }
                                    </style><span class="css-1rreq7x">No Minimum.</span>
                                </h3>
                                <style data-emotion="css i3pbo">
                                    .css-i3pbo {
                                        margin-bottom: 24px;
                                    }
                                </style>
                                <div class="MuiBox-root css-i3pbo"></div>Deposit, transfer, or make payments
                                <style data-emotion="css 89xtcw">
                                    .css-89xtcw {
                                        margin: 0;
                                        font-size: 14px;
                                        line-height: 1.714;
                                        font-weight: 600;
                                        font-family: Poppins, Noto Sans Thai, sans-serif;
                                    }

                                    @media (min-width:428px) {
                                        .css-89xtcw {
                                            font-size: 16px;
                                            line-height: 1.75;
                                        }
                                    }
                                </style><span class="MuiTypography-root MuiTypography-subtitle1 css-89xtcw">via CPALL!
                                    application</span> anytime, from anywhere. No minimum required for any transaction.</p>
                            </div>
                        </div>
                        <div class=" MuiBox-root css-u40d4r">
                            <div class=" MuiBox-root css-eu30ki">
                                <div class="MuiBox-root css-1yico7t"><span
                                        style="box-sizing:border-box;display:inline-block;overflow:hidden;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;position:relative;max-width:100%"><span
                                            style="box-sizing:border-box;display:block;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;max-width:100%"><img
                                                style="display:block;max-width:100%;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0"
                                                alt="" aria-hidden="true"
                                                src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTA4MSIgaGVpZ2h0PSIxOTIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIvPg==" /></span><img
                                            alt="animation background"
                                            src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"
                                            decoding="async" data-nimg="intrinsic"
                                            style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%" /><noscript><img
                                                alt="animation background"
                                                srcSet="/_next/image?url=%2Fanimation-bg.webp&amp;w=1200&amp;q=75 1x, /_next/image?url=%2Fanimation-bg.webp&amp;w=3840&amp;q=75 2x"
                                                src="/_next/image?url=%2Fanimation-bg.webp&amp;w=3840&amp;q=75"
                                                decoding="async" data-nimg="intrinsic"
                                                style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%"
                                                loading="lazy" /></noscript></span>
                                </div><span
                                    style="box-sizing:border-box;display:inline-block;overflow:hidden;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;position:relative;max-width:100%"><span
                                        style="box-sizing:border-box;display:block;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0;max-width:100%"><img
                                            style="display:block;max-width:100%;width:initial;height:initial;background:none;opacity:1;border:0;margin:0;padding:0"
                                            alt="" aria-hidden="true"
                                            src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTA4MCIgaGVpZ2h0PSIxOTIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIvPg==" /></span><img
                                        alt="Save Meme Image" data-testid="save-highlight-feature-image-2"
                                        src="{{ asset('images/save-meme.gif') }}"
                                        decoding="async" data-nimg="intrinsic"
                                        style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%" /><noscript><img
                                            alt="Save Meme Image" data-testid="save-highlight-feature-image-2"
                                            srcSet="{{ asset('images/save-meme.gif') }}"
                                            src="{{ asset('images/save-meme.gif') }}" decoding="async"
                                            data-nimg="intrinsic"
                                            style="position:absolute;top:0;left:0;bottom:0;right:0;box-sizing:border-box;padding:0;border:none;margin:auto;display:block;width:0;height:0;min-width:100%;max-width:100%;min-height:100%;max-height:100%"
                                            loading="lazy" /></noscript></span>
                            </div>
                            <div class=" MuiBox-root css-5o8v0t">
                                <p class="MuiTypography-root MuiTypography-body1 css-1tmli6w"
                                    data-testid="hf-hightlight-desc">
                                <h3 class="MuiTypography-root MuiTypography-h3 css-17xkqdb"
                                    data-testid="hf-hightlight-title"><span class="css-1rreq7x">Dress up the slip for fun.
                                        unique</span></h3>
                                <h3 class="MuiTypography-root MuiTypography-h3 css-17xkqdb"
                                    data-testid="hf-hightlight-title"> Your Style.</h3>
                                <div class="MuiBox-root css-i3pbo"></div>Add color to your money transfers. Just decorate the slip to be fun and unique. before sending to friends</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection