<div class="card pb-1" style="border-width: 2px">
            <div class="card-header header-elements-inline justify-content-start" style="padding-top: 24px;">
                <i class="icon-arrow-left8" style="font-size: 26px; margin-left: 14px;"></i>
                <h6 class="card-title" style="font-size: 26px; margin-left: 30px;">Messaggio</h6>
                <i class="icon-shield-check" style="font-size: 32px; margin-left: 167px;"></i>
                <i class="icon-more2" style="font-size: 26px; margin-left: 26px;"></i>
            </div>
            <div class="card-body d-flex flex-column align-items-center">
                <img
                        alt=""
                        style="width: 93px; box-sizing: content-box; border: 4px solid #dddddd; border-radius: 50%;"
                        src="assets/logo.png"
                        class="mt-3"
                />
                <p style="font-size: 21px; color: #a1a6a9; text-align: center;" class="mt-3">
                    Multichannel Messaging Platform messaggio.com
                </p>
                <div class="mt-3" style="background: #d8d8d8; width: 470px; height: 2px; box-shadow: 1px 2px 4px rgba(0,0,0,0.3);"></div>
                <div class="card mt-3 flex-column align-items-center" style="border-width: 2px; border-radius: 15px; width: 450px;">
                    <img
                            alt=""
                            class="card-img mt-3"
                            src="https://www.gstatic.com/images/branding/googlelogo/1x/googlelogo_color_120x48dp.png"
                            style="width:220px"
                    />
                    <p class="card-text align-self-start ml-3" style="font-size: 24px; margin-top: 24px; color: #282828;">
                        This is a rich card.
                    </p>
                    <p class="card-text" style="font-size: 24px; margin-top: 2px; color: #282828;">
                        Hi there!
                    </p>
                    <div class="mt-1" style="background: #d8d8d8; width: 415px; height: 2px;"></div>
                    <p class="card-text" style="font-size: 24px; margin: 9px 0; color: #282828;">
                        Oh, hi.
                    </p>
                </div>
                <div style="width: 450px; margin-top: 45px;" class="d-flex align-items-center">
                    <button style="all: unset; background: #1972e8; color: #fff; border-radius: 50%; width: 53px; height: 53px; font-size: 38px;">
                        <span style="display: block; margin: -3px 0 0 16px;">+</span>
                    </button>
                    <div class="d-inline-flex" style="border: 2px solid #eeeeee; height: 60px; width: 382px; margin-left: 15px; border-radius: 30px; box-shadow: 1px 2px 4px rgba(0,0,0,0.3);">
                        <input type="text" style="all: unset; margin-left: 22px; font-size: 20px; width: 290px;" placeholder="Chat message">
                        <button class="ml-auto" style="all: unset; width: 40px; height: 40px; margin-top:8px; margin-right: 20px;">
                            <svg>
                                <path style="transform: scale(1.6);" fill="#82858a" d="M2,3v18l20,-9L2,3zM4,14l9,-2 -9,-2L4,6.09L17.13,12 4,17.91L4,14z"></path>
                            </svg>
                        </button>
                    </div>
                </div>
            </div>
        </div>