.bingo p son-payments {
filter: grayscale(1);
}
.bingo mark {
background-color: #fff;
text-transform: uppercase;
}
.bingo h2 {
color: #024087;
font-size: 3rem;
line-height: 1.2;
padding-bottom: 1.25rem;
}
.bingo h2:first-line {
font-size: 1.3rem;
color: #000;
}
.bingo h2 + p {
font-size: 1.25rem;
}
        #index.bingo header {
            min-height: 510px;
                background-size:
                    auto clamp(min(10vw, 20rem), 450px, 100%),
                    auto clamp(min(10vw, 20rem), 450px, 100%),
                    100% auto, 100% auto, 100% auto;
background-position: 10% 100%, 90% 100%, 0 0, 50% calc(100% + 2px), 50% 40%;
        }
        #index.bingo #phone,
#index.bingo #bingowinner {
            padding: 0 1rem;
            width: calc(100% - 2rem);
            text-align: center;
        }
        #index.bingo #phone img,
#index.bingo #bingowinner img {
            width: inherit;
            height: inherit;
            max-width: 150px;
            user-select: none;
        }
#index.bingo #bingowinner img {
max-width: 600px;
position: absolute;
left: 50%;
top: -3rem;
transform: translate(-50%,50%);
}
        #index.bingo #main {
            padding: 0 1rem;
font-size: 0.9rem;
        }
        .bingo article {
            margin: 0 auto;
text-align: center;
        }
.bingo .summerbingo {
padding: 2rem;
border: 2px dashed #51a9c4;
border-radius: 1rem;
max-width: 640px;
margin: 0 auto 5rem auto !important;
}

.bingo .summerbingo p,
.bingo .summerbingo ul,
.bingo .summerbingo ol,
.bingo .summerbingo h2,
.bingo .summerbingo h3,
.bingo .summerbingo h4 {
text-align: left;
}

.bingo .summerbingo p.text-center {
text-align: center;
}

.bingo .summerbingo p.text-center a.button {
font-size: 1rem !important;
}
        .bingo-cta {
            font-size: 1.5rem;
        }
        .bingo-cta a {
            white-space: nowrap;
            color: #fff;
            text-decoration: none;
            background: #06810c;
            display: block;
            max-width: 300px;
            text-align: center;
            border-radius: 2rem;
            padding: 0.3rem 2rem;
            margin: 0 auto;
        }
        .bingo-cta a:hover,
        .bingo-cta a:focus,
        .bingo-cta a:active {
            text-decoration: none;
            color: gold;
            background: #038009;
        }
        .bingo .example .bingo-cta a {
            font-weight: bold;
            background: #fff;
            color: #06810c;
            border: 4px solid #06810c;
        }
        .bingo-cta a:after {
            content: ' \00BB';
        }
        .bingo .intro,
        .bingo .outro {
            text-align: center;
            max-width: 640px;
            margin: 0 auto;
            padding: 3rem 1rem;
        }


        .bingo #main h3 {
            text-align: center;
        }
        .bingo .example {
            display: inline-block;
            width: 49%;
            max-width: 400px;
            padding: 0 3rem 2rem 3rem;
            vertical-align: top;
text-align: left;
        }
        .bingo .example div {
            float: left;
            padding: 0.5rem 1rem;
            display: block;
            overflow: hidden;
            max-width: calc(250px - 2rem);
        }
        .bingo .example h4,
        .bingo .example h5 {
            padding: 0;
            font-size: 1.25rem;
            font-weight: bold;
            position: relative;
        }
        .bingo .example b {
            position: absolute;
            left: -0.5rem;
            bottom: 1rem;
            font-weight: normal;
            display: inline-block;
            padding: 0.1rem 2rem;
            background: #ff8705;
            border-radius: 1rem;
            color: #fff;
        }
        .bingo .example b span {
            display: none;
        }
        .bingo .example h5 {
            padding-bottom: 0.5rem;
        }
        .bingo .example img {
            width: auto;
            height: auto;
            max-width: calc(100% - 1rem - 2px);
            border: 1px solid #ddd;
            border-radius: 2rem;
            padding: 0.75rem;
            background: #f4f5f7;
        }
        .bingo .example .bingo-cta {
            text-align: right;
            padding: 1.5rem 0 0 0;
            font-size: 0.9rem;
            white-space: nowrap;
            display: inline-block;
        }
        .bingo .outro {
            display: block;
            clear: both;
        }
        .bingo .outro p:last-of-type {
            padding: 5rem 1rem;
        }
        .bingo .outro p:last-of-type img {
            max-width: 250px;
            height: auto;
            width: 100%;
        }
.bingo .offer .bingo-cta a {
max-width: 200px;
}
.bingo p.offer {
font-size: 0.9rem;
}
.bingo p.offer img {
width: auto;
height: auto;
max-width: 150px;
margin-top: 0.5rem;
}

        @media (max-width: 1300px) {
            .bingo .example {
                display: block;
                width: 100%;
                max-width: 500px;
                padding: 0;
            }
            .bingo .example div {
                max-width: calc(350px - 2rem);
            }
        }
        @media (max-width: 1100px) {
            #index.summer.bingo header {
                min-height: 300px;
                background-size:
                    auto clamp(min(10vw, 20rem), 230px, 100%),
                    auto clamp(min(10vw, 20rem), 230px, 100%),
                    100% auto, 100% auto, 100% auto;
background-position: 5% 100%, 95% 100%, 0 0, 50% calc(100% + 2px), 50% 0;
            }
        #index.bingo #phone img {
            max-width: 100px;
        }
#index.bingo #bingowinner img {
max-width: 400px;
}
        }
        @media (max-width: 660px) {
            #index.summer.bingo header {
                min-height: 280px;
                background-size:
                    auto clamp(min(10vw, 20rem), 200px, 100%),
                    auto clamp(min(10vw, 20rem), 200px, 100%),
                    100% auto, 100% auto, 100% auto;
background-position: 0 100%, 100% 100%, 0 0, 50% calc(100% + 2px), 50% 100%;
padding-bottom: 0;
            }
            #index.bingo #phone,
#index.bingo #bingowinner {
                padding-top: 2rem;
position: relative;
            }
            #index.bingo #phone img,
#index.bingo #bingowinner img {
                max-width: 80px;

            }
#index.bingo #bingowinner  {
padding-top: 0;
}
#index.bingo #bingowinner img {
max-width: 300px;
top: -5rem;
}
            .bingo .intro h2 {
                font-size: 2rem;
            }

        .bingo .outro.offer h5 strong {
            left: -5rem;
        }
        .bingo .intro.offer h2 span,
        .bingo .outro.offer h5 span {
            padding-left: 6rem;
        }

            .bingo .intro h2 strong {
                font-size: 5rem;
                left: -2rem;
top: 0.5rem;
            }

            .bingo .example div {
                max-width: calc(250px - 2rem);
                padding-right: 0;
            }
            .bingo .example .bingo-cta {
                padding: 1rem 0;
                display: block;
                clear: both;
                font-size: 1.2rem;
            }
            .bingo .example .bingo-cta a {
                padding: 0.3rem 1rem;
                max-width: calc(100% - 5rem);
            }
            #index.bingo .intro {
                padding-top: 1rem;
            }
        }
@media (max-width: 560px) {
#index.bingo #bingowinner img {
max-width: 200px;
top: 1rem;
}
}
@media (max-width: 360px) {

}