teviant lip hero

<div>
                        <!-- for desktop -->
                        <div class="hero hidden-800px" style="background-image: url(images/lipbanner_group3840x1800px.jpg);">
                            <div class="hero-text" style="color:#fff; width:27%;left: inherit; top:160px; right: 140px !important; text-align: right;">
                                <span class="hero-big-text" style="font-family: 'love_hewitsregular';color:#fff;font-size: 100px;line-height: 90px;margin-bottom: 70px;">Lip Spell</span>
                                <p style="color: #fff;font-size: 18px;margin-top: -2em;margin-bottom: 2em;">Longwearing, lightweight. Unstoppable vibrancy and coverage with a single stroke.</p>
                                <a href="#" class="btn" style="background-color:#f8c1b8; color:#000000" tabindex="-1">SHOP NOW</a>
                            </div>
                        </div>
                        <!-- for ipad to mobile -->
                        <div class="hero hidden visible-800px" style="background-image: url(images/lipbanner_group3840x1800px-mobile.jpg);">
                            <div class="hero-text" style="color:#fff; width:100%;left: inherit; top:50px; right: 0; text-align: right;padding:0 26px;">
                                <span class="hero-big-text" style="font-family: 'love_hewitsregular';font-size:80px;color:#fff;margin-bottom: 30px !important; padding-bottom: 0px !important;">Lip Spell</span>
                                <p style="font-size:18px;line-height: 26px;color:#fff;margin-bottom:1em;">Longwearing, lightweight. Unstoppable vibrancy and coverage with a single stroke.</p>
                                <a href="#" class="btn" style="background-color:#f8c1b8; color:#000000" tabindex="-1">SHOP NOW</a>
                            </div>
                        </div>
                    </div>