Happy 80th Independence Day 🇮🇳

text and image

text and image

Tags: Liquid Codes, text and image · 09 Aug 2026

Page: Product Pages (Optimized for Conversions)

Snippet Code

<style>
        #OverlappingImages--template--14451231457366__4713b245-a7f3-4086-bc2b-30858e59764e {
                --PT: 59px;
                --PB: 60px;
                --image-offset: 60px;
        }

        .overlapping-images {
                --image-offset-negative: 60px;
                overflow: hidden;
                background: #ffffff;
        }

        .section-padding11 {
                --padding-top: 59px;
                --padding-bottom: 60px;
                padding-top: 59px;
                padding-bottom: 60px;
        }

        .wrapper11 {
                width: 1440px;
                margin: 0 auto;
                max-width: 100%;
        }

        .overlapping-images__block {
                margin: 0 auto;
        }

        .overlapping-images__images--single-mobile {
                padding-bottom: 0;
        }

        .overlapping-images__images {
                position: relative;
                width: 100%;
                padding: 0;
        }

        .overlapping-images__images-inner--single {
                width: 100%;
                margin: 0;
        }

        .overlapping-images__images-inner {
                display: flex;
                flex-flow: row wrap;
                align-items: flex-start;
        }

        .body--rounded-corners .overlapping-images__image {
                border-radius: 8px;
                overflow: hidden;
        }

        .overlapping-images__image {
                position: relative;
                flex: 1 0 50%;
                max-height: 560px;
                background-color: #ffffff;
        }

        .overlapping-images__image-bg {
                position: relative;
                max-height: inherit;
                background: center center / cover no-repeat;
        }

        .bg-pos-center-center {
                background-position: center center !important;
        }

        .overlapping-images__image-bg::before {
                content: "";
                display: block;
                width: 100%;
                height: 0;
                min-height: 1px;
                font-size: 0;
                padding-top: 100.0%;
        }

        .overlapping-images__content {
                max-width: 600px;
        }

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

        .main-heading11 {
                color: #000;
                margin-bottom: 10px;
                font-size: 48px;
                line-height: 1.2;
                font-family: "Instrument Sans", sans-serif;
                font-weight: 400;
                font-style: normal;
                margin: 0 0 24.48px;
        }

        .overlapping-images__text {
                font-size: 21.12px;
                margin: 0;
        }

        .main-text11 {
                display: block;
                color: #000;
                font-family: "Instrument Sans", sans-serif;
                font-weight: 400;
                font-style: normal;
        }

        .rte :last-child {
                margin-bottom: 0;
        }

        .overlapping-images__text ul {
                margin-left: 0;
                list-style-type: none;
        }

        ul {
                margin: 0 0 60px 20px;
                padding: 0;
        }

        .overlapping-images__text ul li {
                position: relative;
                padding-left: 38.4px;
                font-size: 17px;
        }

        .rte li {
                margin-bottom: 7px;
        }

        .overlapping-images__text ul li::marker {
                content: "";
        }

        .overlapping-images__text ul li::before {
                content: "";
                display: block;
                position: absolute;
                top: 9px;
                left: 8px;
                border-style: solid;
                border-width: 0 0 1px 1px;
                border-color: #000;
                width: 9.25px;
                height: 5.25px;
                transform: rotate(-45deg);
                list-style-type: none;
        }

        .wrapper11:after {
                display: table;
                content: "";
                clear: both;
        }

        @media only screen and (min-width: 768px) {
                .overlapping-images__block {
                        display: grid;
                        align-items: center;
                        grid-template-columns: repeat(2, minmax(0, 1fr));
                }

                .overlapping-images__block--reverse .overlapping-images__images {
                        order: 1;
                }
        }

        @media only screen and (min-width: 1024px) {
                .wrapper11 {
                        padding: 0 60px;
                }
        }

        @media only screen and (min-width: 1440px) {
                .overlapping-images__block {
                        gap: 60px;
                }

                .overlapping-images__block--reverse .overlapping-images__images {
                        margin: 0 auto 0 0;
                }

                .overlapping-images__block--reverse .overlapping-images__content {
                        margin: 0 0 0 auto;
                }

                .overlapping-images__content {
                        width: 75%;
                }
        }

        @media only screen and (max-width: 767px) {
                .section-padding11 {
                        --padding-top: 59px;
                        --padding-bottom: 60px;
                }

                .overlapping-images__images--single-mobile .overlapping-images__images-inner {
                        width: 100%;
                        margin-left: 0;
                }

                .overlapping-images__content {
                        padding-top: 30px;
                        margin-bottom: -15px;
                }

                .main-heading11 {
                        font-size: 36px;
                }
        }
</style>

<div id="shopify-section-template--14451231457366__4713b245-a7f3-4086-bc2b-30858e59764e" class="shopify-section">
        <section id="OverlappingImages--template--14451231457366__4713b245-a7f3-4086-bc2b-30858e59764e"
                class="section-padding11 overlapping-images"
                data-section-id="template--14451231457366__4713b245-a7f3-4086-bc2b-30858e59764e"
                data-section-type="overlapping-images">
                <div class="wrapper11">
                        <div class="overlapping-images__block overlapping-images__block--reverse">
                                <div class="overlapping-images__images overlapping-images__images--single-mobile"
                                        style="max-width: 600px;">
                                        <div
                                                class="overlapping-images__images-inner overlapping-images__images-inner--single">
                                                <div class="overlapping-images__image lazy-image"
                                                        style="background-image: none;">
                                                        <div class="overlapping-images__image-bg bg-pos-center-center lazyloaded"
                                                                data-bgset="//olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_180x.jpg?v=1643902424 180w 180h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_360x.jpg?v=1643902424 360w 360h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_540x.jpg?v=1643902424 540w 540h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1.jpg?v=1643902424 600w 600h"
                                                                data-parent-fit="cover"
                                                                style="--aspect-ratio: 100.0%; background-image: url("https://olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1.jpg?v=1643902424");">
                                                                <picture style="display: none;">
                                                                        <source data-srcset="//olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_180x.jpg?v=1643902424 180w 180h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_360x.jpg?v=1643902424 360w 360h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_540x.jpg?v=1643902424 540w 540h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1.jpg?v=1643902424 600w 600h"
                                                                                sizes="593px"
                                                                                srcset="//olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_180x.jpg?v=1643902424 180w 180h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_360x.jpg?v=1643902424 360w 360h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_540x.jpg?v=1643902424 540w 540h, //olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1.jpg?v=1643902424 600w 600h">
                                                                        <img alt=""
                                                                                class="lazyautosizes lazyloaded ls-is-cached"
                                                                                data-sizes="auto"
                                                                                data-parent-fit="cover" sizes="593px">
                                                                </picture>
                                                        </div>
                                                        <noscript>
                                                                <div class="overlapping-images__image-bg bg-pos-center-center"
                                                                        style="background-image: url(//olivercompanylondon.com/cdn/shop/files/Oliver_Co._vegan_wallets_photo_1_1024x.jpg?v=1643902424); --aspect-ratio: 100.0%;">
                                                                </div>
                                                        </noscript>
                                                </div>
                                        </div>
                                </div>

                                <div class="overlapping-images__content text-left">
                                        <h2 class="overlapping-images__heading main-heading11">Crafted for Everyday Use
                                        </h2>
                                        <div class="overlapping-images__text main-text11 rte">
                                                <ul>
                                                        <li>Hand-painted edges for a refined finish</li>
                                                        <li>Reinforced spine for long-lasting durability</li>
                                                        <li>Holds up to 12 cards while staying slim</li>
                                                        <li>Built-in RFID protection to keep your cards secure</li>
                                                        <li>Quick-access pocket for bank notes or your most-used card
                                                        </li>
                                                </ul>
                                        </div>
                                </div>
                        </div>
                </div>
        </section>
</div>

Instructions

Heyy Guys 👋
Watch the video below to learn how to Import these Codes into your Shopify Ecommerce Store!

Complete Video Tutorial: