<div class="uichallenge">
        <div class="header">
            <div class="header_content">
                <button class="btn go-back">
                    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                    width="30" height="30"
                    viewBox="0 0 172 172"
                    style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#ffffff"><path d="M93.16667,42.49609l-43.50391,43.50391l43.50391,43.5039l10.75,-10.75l-32.75391,-32.7539l32.75391,-32.75391z"></path></g></g></svg>
                </button>
                <div class="header_text">
                <h1 class="header_text_title">Full body</h1>
                <p class="header_text_intro">
                    Activate every muscle group to get the results you've always wanted
                </p>
            </div>
            <div class="header_cta">
                <button class="btn">
                    Easy
                </button>
                <button class="btn">
                    12 mins
                </button>
            </div>
            <button class="btn play_btn">
                <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
width="30" height="30"
viewBox="0 0 172 172"
style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#ffffff"><path d="M34.4,17.2c-3.16643,0 -5.73333,2.5669 -5.73333,5.73333c-0.00001,0.00747 -0.00001,0.01493 0,0.0224v63.04427v63.04427c-0.00001,0.00746 -0.00001,0.01493 0,0.02239c0,3.16643 2.5669,5.73333 5.73333,5.73333c1.19346,-0.00345 2.3561,-0.37925 3.32578,-1.075l0.0112,0.0112l113.71485,-62.52917c2.03773,-0.93223 3.34559,-2.96619 3.34817,-5.20703c0.00115,-2.30642 -1.37987,-4.38898 -3.50495,-5.28542l-113.55807,-62.45078h-0.0112c-0.97102,-0.69177 -2.13354,-1.06362 -3.32578,-1.0638z"></path></g></g></svg>
            </button>
            </div>
        </div>

        <div class="menu">
            <h3 class="menu_title">
                Exercises
            </h3>
            <ul class="list_item_wrapper">
                <li class="list_item list_bicep">
                    <button class="btn list_button">
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M33.0025,13.78688c-0.99861,-0.03842 -2.04158,0.0086 -3.13094,0.15453c-8.10856,1.08428 -14.59396,7.2096 -19.17531,11.65703c-0.00224,0 -0.00448,0 -0.00672,0c-6.9097,6.71291 -10.68694,15.06188 -10.67609,27.72156c0,2.38305 0.03561,4.95957 0.22172,7.73328c0.74964,11.22753 1.67485,33.02852 12.53047,61.61765c0,0.00224 0,0.00448 0,0.00672c3.80604,10.01844 10.87338,18.64966 17.45531,24.91313c3.29096,3.13173 6.46092,5.65955 9.1375,7.46453c1.33829,0.90249 2.54799,1.62252 3.655,2.16344c1.10701,0.54075 1.92024,1.02125 3.55422,1.02125c2.81548,0 4.82198,-1.07456 7.30328,-1.89469c2.4813,-0.82013 5.1824,-1.54531 8.04906,-1.54531c5.22689,0 12.73437,3.44 27.52,3.44c21.58025,0 35.63857,-12.07811 43.86,-23.8314c7.17347,-10.25514 9.78235,-19.18543 10.45437,-21.63438c2.16293,-0.64907 7.10099,-2.28511 13.05453,-6.56422c7.45557,-5.35869 15.1911,-14.68689 15.1911,-28.81c0,-10.0539 -3.09676,-19.84763 -9.22485,-27.25797c-6.12808,-7.41034 -15.41118,-12.30203 -26.89515,-12.30203c-13.05968,0 -23.15387,4.69119 -29.7775,11.85187c-6.22908,6.73414 -9.13856,15.52567 -9.4936,24.34203c-2.36474,-0.87924 -5.13868,-1.7939 -8.8889,-1.7939c-14.98054,0 -23.81976,7.0323 -28.11797,14.84172c-1.53573,2.79026 -2.10341,5.48548 -2.78156,8.15656c-3.02938,-5.74475 -6.99868,-11.88736 -14.21015,-18.57063c-9.27519,-8.5939 -12.71864,-17.39217 -14.04219,-20.74078c0,-0.00224 0,-0.00448 0,-0.00672c0.18723,0.4702 -0.33311,-1.19214 -0.60469,-2.365c-0.13579,-0.58643 -0.2629,-1.16838 -0.34937,-1.60578c-0.02339,-0.11823 -0.01367,0.03061 -0.02688,-0.09406c0.1725,-0.16701 0.51991,-0.4544 1.11531,-0.84656c0.27533,-0.18134 0.72448,-0.70611 1.06156,-0.91375c1.85637,2.79105 4.50331,4.945 8.06922,4.945c1.40681,0 2.85867,-0.26003 4.52172,-0.98765c0.83153,-0.36381 1.70725,-0.84792 2.52625,-1.69985c0.1043,-0.1085 0.10125,-0.35195 0.20156,-0.47703c1.40754,-0.30214 2.65663,-0.9148 3.73562,-1.7939c0.89474,-0.72898 1.71808,-1.63486 2.2911,-2.85547c0.05948,-0.1267 -0.0187,-0.32794 0.0336,-0.4636c1.48758,-0.58488 2.77335,-1.5023 3.55422,-2.59344c0.8369,-1.16945 1.33126,-2.46703 1.55203,-3.85656c0.1548,-0.12305 0.40169,-0.10366 0.5375,-0.24187c0.91812,-0.9345 1.33997,-2.03206 1.5386,-2.96297c0.39724,-1.86182 0.1138,-3.2908 -0.215,-4.43437c-1.49203,-5.15719 -5.36723,-8.01477 -10.29984,-11.53609c-2.22421,-1.58917 -4.30904,-3.55901 -7.12188,-5.16c-2.10963,-1.20074 -4.69041,-2.07506 -7.68625,-2.19031zM32.80094,20.62656c1.81138,0.03088 3.08702,0.53284 4.48813,1.33031c1.86814,1.06329 3.85643,2.87116 6.5239,4.77703c4.87826,3.48252 6.87338,5.03765 7.68625,7.8475c0.03165,0.11376 0.0289,0.29763 0.04703,0.52406c-1.58718,0.67258 -2.43158,2.41596 -1.97531,4.07828c-0.14751,-0.53634 -0.11978,0.49113 -0.47031,0.98094c-0.16223,0.2267 -0.19149,0.29361 -0.18813,0.3225c-1.11984,-0.25171 -2.29145,0.07162 -3.12368,0.86205c-0.83224,0.79042 -1.21548,1.94382 -1.02178,3.07514c-0.05834,0.08043 -0.11141,0.17245 -0.29563,0.3225c-0.50844,0.41425 -1.50786,0.25143 -0.49719,0.55094c-0.89032,-0.26339 -1.8493,-0.15574 -2.65907,0.29849c-0.80977,0.45423 -1.40156,1.21647 -1.64093,2.11354c0,0.00224 0,0.00448 0,0.00672c-0.0463,0.02546 -0.01309,0.00676 -0.0739,0.03359c-0.54629,0.23873 -1.68432,0.40985 -1.76703,0.40985c-2.08127,0 -3.43328,-1.35371 -3.43328,-3.44c-0.0003,-1.52474 -1.00417,-2.8674 -2.46656,-3.29897c-1.46239,-0.43158 -3.0344,0.15089 -3.8625,1.43116c-0.29509,0.45653 -1.52619,1.33066 -3.15781,2.40531c-0.81581,0.53733 -1.72371,1.14845 -2.59344,2.12313c-0.86972,0.97467 -1.67969,2.51809 -1.67969,4.21937c0,1.11412 0.11362,1.13293 0.22172,1.67969c0.1081,0.54676 0.24753,1.18456 0.39641,1.8275c0.29775,1.28588 0.4238,2.12222 0.91375,3.35266c1.31272,3.32124 5.37051,13.62521 15.76219,23.25359c10.76585,9.9773 14.21672,18.44235 17.35453,26.21656c0.61603,1.52893 2.22995,2.40608 3.848,2.09132c1.61804,-0.31476 2.78546,-1.73295 2.78341,-3.38132c0,-2.99567 0.38118,-10.18114 3.71547,-16.23922c3.33429,-6.05808 9.11507,-11.28078 22.08453,-11.28078c6.72074,0 9.89,2.6875 9.89,2.6875c1.03283,0.82657 2.44811,0.98774 3.64034,0.41455c1.19223,-0.57319 1.95021,-1.7792 1.94966,-3.10205v-3.44c0,-7.826 2.64613,-15.57257 7.955,-21.31187c5.30887,-5.73931 13.27468,-9.64813 24.725,-9.64813c9.58603,0 16.64293,3.83038 21.58735,9.80937c4.94441,5.979 7.65265,14.24188 7.65265,22.87063c0,11.67689 -6.02448,18.68869 -12.3289,23.22c-6.30443,4.53131 -12.58422,6.12078 -12.58422,6.12078c-1.23803,0.31 -2.20272,1.27986 -2.50609,2.51953c0,0 -2.61842,10.60439 -10.03781,21.21109c-7.41939,10.6067 -19.1665,20.8886 -38.22297,20.8886c-13.67693,0 -19.84689,-3.44 -27.52,-3.44c-4.01333,0 -7.48322,0.99482 -10.20578,1.89469c-2.6192,0.86571 -4.61807,1.43824 -4.95172,1.48485c-0.15668,-0.04219 -0.41752,-0.10825 -0.73235,-0.26203c-0.69328,-0.33877 -1.68454,-0.91491 -2.82859,-1.6864c-2.2881,-1.54301 -5.21602,-3.86424 -8.24391,-6.74563c-6.05577,-5.76277 -12.50591,-13.80211 -15.76219,-22.37344c-10.49303,-27.63423 -11.32979,-48.19355 -12.09375,-59.63563c0,-0.00224 0,-0.00448 0,-0.00672c-0.17165,-2.55813 -0.20828,-4.96746 -0.20828,-7.26969c-0.00979,-11.42031 2.69929,-17.06387 8.59328,-22.79c4.36265,-4.23513 10.39019,-9.11271 15.29859,-9.76906c0.74674,-0.10003 1.41183,-0.14467 2.01562,-0.13437z"></path></g></g></svg>
                        <p class="list_text">Bicep</p>
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M57.27734,22.87734c-2.33303,0.00061 -4.43307,1.41473 -5.31096,3.57628c-0.8779,2.16155 -0.3586,4.6395 1.31331,6.26669l53.27969,53.27969l-53.27969,53.27969c-1.49777,1.43802 -2.10111,3.5734 -1.57733,5.58259c0.52378,2.0092 2.09283,3.57825 4.10203,4.10203c2.0092,0.52378 4.14457,-0.07956 5.58259,-1.57733l57.33333,-57.33333c2.23811,-2.23904 2.23811,-5.86825 0,-8.10729l-57.33333,-57.33333c-1.07942,-1.10959 -2.56162,-1.73559 -4.10963,-1.73568z"></path></g></g></svg>
                    </button>
                </li>
                <li class="list_item list_body-back">
                    <button class="btn list_button">
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M63.54818,8.38444v1.66569c0,2.13635 -0.83965,4.18634 -2.33757,5.71094v0.014l-0.02799,0.014c-3.28368,3.33891 -7.26897,5.74343 -11.49186,6.76074h-0.014c-2.53628,0.61646 -5.16511,0.93783 -7.81055,0.93783c-11.56556,0 -21.38592,8.80906 -22.63379,20.31022l-6.88672,54.92578v0.02799c-1.00423,8.68572 1.01158,17.45462 5.69694,24.83138l15.69108,24.94335l-1.6377,2.82748h3.34538c-0.18213,1.31546 -1.02181,2.47056 -1.02181,3.80729v7.5306h14.33333v-7.5306c0,-2.59462 0.68766,-5.12379 1.98763,-7.36263c9.62736,-16.57867 11.57237,-36.53195 5.361,-54.65983l-6.48079,-18.92448l-13.56348,4.64713l6.49479,18.92448c4.0681,11.87276 3.59518,24.70007 -1.0498,36.18327l-11.33789,-18.02865l-0.014,-0.014c-2.93471,-4.60808 -4.19362,-10.08157 -3.56934,-15.50911v-0.014l6.88672,-54.99577l0.014,-0.05599c0.47213,-4.35151 4.01133,-7.5306 8.38444,-7.5306c3.77589,0 7.52819,-0.45521 11.18392,-1.34375c5.73989,-1.38588 10.34208,-4.8992 14.69727,-8.52441h1.58171l2.08561,-2.1276l0.014,-0.014c4.13511,-4.20876 6.4528,-9.87075 6.4528,-15.76107v-1.66569zM94.11849,8.38444v1.66569c0,5.89032 2.31771,11.55233 6.4528,15.76107l0.014,0.014l2.08561,2.1276h1.56771c4.35594,3.628 8.95956,7.137 14.69726,8.52441c3.65572,0.88854 7.40803,1.34375 11.18392,1.34375c4.36881,0 7.92251,3.1843 8.39844,7.5306l0.014,0.05599l6.88672,55.00977c0.62429,5.42755 -0.63468,10.90065 -3.56934,15.50911l-0.014,0.014l-11.3379,18.02865c-4.64498,-11.48319 -5.1179,-24.31051 -1.0498,-36.18327l6.49479,-18.92448l-13.56348,-4.64713l-6.4808,18.92448c-6.21137,18.12788 -4.26636,38.08116 5.361,54.65983c1.29997,2.23884 1.98763,4.76801 1.98763,7.36263v7.5306h14.33333v-7.5306c0,-1.33673 -0.8397,-2.49183 -1.02181,-3.80729h3.34537l-1.63769,-2.82748l15.69108,-24.94335c4.68536,-7.37676 6.70117,-16.14566 5.69694,-24.83138v-0.02799l-6.88672,-54.92578c-1.2584,-11.49204 -11.07793,-20.31022 -22.64778,-20.31022c-2.64544,0 -5.26028,-0.32137 -7.79655,-0.93783h-0.014c-4.21538,-1.01678 -8.20814,-3.42187 -11.49186,-6.76074c-0.00788,-0.00781 -0.02012,-0.00619 -0.028,-0.014v-0.014c-1.49796,-1.52498 -2.33756,-3.57459 -2.33757,-5.71094v-1.66569z"></path></g></g></svg>
                        <p class="list_text">Body-back</p>
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M57.27734,22.87734c-2.33303,0.00061 -4.43307,1.41473 -5.31096,3.57628c-0.8779,2.16155 -0.3586,4.6395 1.31331,6.26669l53.27969,53.27969l-53.27969,53.27969c-1.49777,1.43802 -2.10111,3.5734 -1.57733,5.58259c0.52378,2.0092 2.09283,3.57825 4.10203,4.10203c2.0092,0.52378 4.14457,-0.07956 5.58259,-1.57733l57.33333,-57.33333c2.23811,-2.23904 2.23811,-5.86825 0,-8.10729l-57.33333,-57.33333c-1.07942,-1.10959 -2.56162,-1.73559 -4.10963,-1.73568z"></path></g></g></svg>
                    </button>
                </li>
                <li class="list_item list_body-butt">
                    <button class="btn list_button">
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M118.96667,136.16667c-12.18333,0 -23.65,-4.3 -32.25,-12.9c-8.6,7.88333 -20.78333,12.9 -33.68333,12.9c-25.08333,0 -45.86667,-18.63333 -45.86667,-42.28333c0,-32.25 21.5,-53.75 30.1,-61.63333l1.43333,-1.43333l10.03333,10.03333l-1.43333,1.43333c-7.16667,7.16667 -25.8,25.08333 -25.8,51.6c0,15.76667 14.33333,27.95 31.53333,27.95c10.75,0 21.5,-5.01667 26.51667,-12.9l5.73333,-9.31667l6.45,8.6c5.73333,8.6 15.76667,13.61667 26.51667,13.61667c17.91667,0 31.53333,-12.18333 31.53333,-27.95c0.71667,-26.51667 -17.2,-43.71667 -24.36667,-50.88333c-0.71667,-0.71667 -1.43333,-1.43333 -2.15,-2.15l10.03333,-10.03333l1.43333,1.43333c7.88333,7.88333 29.38333,28.66667 29.38333,61.63333c0.71667,23.65 -20.06667,42.28333 -45.15,42.28333z"></path></g></g></svg>
                        <p class="list_text">Body-butt</p>
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M57.27734,22.87734c-2.33303,0.00061 -4.43307,1.41473 -5.31096,3.57628c-0.8779,2.16155 -0.3586,4.6395 1.31331,6.26669l53.27969,53.27969l-53.27969,53.27969c-1.49777,1.43802 -2.10111,3.5734 -1.57733,5.58259c0.52378,2.0092 2.09283,3.57825 4.10203,4.10203c2.0092,0.52378 4.14457,-0.07956 5.58259,-1.57733l57.33333,-57.33333c2.23811,-2.23904 2.23811,-5.86825 0,-8.10729l-57.33333,-57.33333c-1.07942,-1.10959 -2.56162,-1.73559 -4.10963,-1.73568z"></path></g></g></svg>
                    </button>
                </li>
                <li class="list_item list_legs">
                    <button class="btn list_button">
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M82.2375,0c-0.645,0.12094 -1.23625,0.41656 -1.72,0.86c-8.84187,7.98188 -20.02187,26.29719 -23.3275,40.635c-3.35937,3.84313 -5.33469,8.12969 -5.4825,12.5775c-0.16125,4.75688 1.46469,9.36594 4.3,14.19c3.10406,5.25406 2.43219,12.51031 4.3,21.285c1.59906,7.39063 5.71094,14.31094 7.955,20.3175c0,0.04031 0,0.06719 0,0.1075c2.67406,7.13531 5.33469,14.71406 6.7725,21.1775c1.43781,6.46344 1.33031,11.75781 0.3225,13.545c-1.63937,2.92938 -3.07719,3.62813 -5.375,4.4075c-2.29781,0.77938 -5.59,1.26313 -9.46,2.9025c-6.94719,2.96969 -11.27406,4.20594 -13.545,4.6225c-3.53406,0.65844 -5.11969,0.95406 -6.88,2.15c-0.88687,0.59125 -1.86781,1.86781 -2.0425,2.9025c-0.17469,1.03469 0,1.42438 0,1.3975c0,5.14656 4.52844,8.815 9.3525,8.815c1.70656,0 3.26531,-0.60469 4.8375,-1.1825c2.29781,1.03469 4.70313,1.29 6.665,1.29c9.71531,0 14.47219,-0.49719 17.7375,-0.9675c3.26531,-0.47031 4.515,-0.86 7.8475,-0.86c0.80625,0 3.19813,0.40313 6.02,0.86c2.82188,0.45688 6.235,0.9675 9.9975,0.9675c4.28656,0 7.80719,-1.74687 9.89,-4.3c2.08281,-2.55312 2.795,-5.53625 2.795,-8.2775c0,-4.90469 -2.33812,-8.26406 -4.515,-12.5775c-2.17687,-4.31344 -4.6225,-10.05125 -6.1275,-20.5325c-3.14437,-21.83594 3.21156,-34.49406 1.3975,-46.01c-1.24969,-7.99531 -4.24625,-13.63906 -6.7725,-17.5225c-1.26312,-1.94844 -2.45906,-3.52062 -3.1175,-4.515c-0.16125,-0.24187 -0.14781,-0.26875 -0.215,-0.43c0.20156,-0.48375 0.72563,-1.70656 2.0425,-3.1175c1.505,-1.6125 3.58781,-3.37281 6.02,-4.515c3.85656,-1.81406 13.20906,-7.26969 23.005,-15.265c9.79594,-7.99531 19.94125,-18.28844 24.1875,-30.315c0.65844,-1.81406 -0.28219,-3.80281 -2.09625,-4.46125c-1.81406,-0.65844 -3.80281,0.28219 -4.46125,2.09625c-3.49375,9.89 -12.63125,19.83375 -21.93,27.4125c-9.29875,7.57875 -18.75875,12.95375 -21.6075,14.2975c-3.34594,1.58563 -6.11406,3.80281 -8.17,6.02c-2.05594,2.21719 -3.5475,4.3 -4.085,6.7725c-0.57781,2.66063 0.73906,3.95063 1.6125,5.2675c0.87344,1.31688 1.89469,2.70094 3.01,4.4075c2.23063,3.42656 4.73,8.10281 5.805,14.9425c1.20938,7.67281 -4.77031,22.4675 -1.3975,45.9025c1.6125,11.19344 4.42094,18.00625 6.7725,22.6825c2.35156,4.67625 3.7625,6.82625 3.7625,9.46c0,1.505 -0.49719,2.99656 -1.29,3.9775c-0.79281,0.98094 -1.85437,1.72 -4.515,1.72c-3.17125,0 -6.235,-0.43 -8.9225,-0.86c-2.6875,-0.43 -4.91812,-0.9675 -7.095,-0.9675c-3.89687,0 -5.85875,0.5375 -8.815,0.9675c-2.95625,0.43 -7.26969,0.86 -16.77,0.86c-2.23062,0 -3.44,-0.08062 -4.4075,-0.7525c-1.075,-0.76594 -2.49937,-0.84656 -3.655,-0.215c-0.69875,0.40313 -2.28437,0.86 -3.44,0.86c-0.86,0 -0.95406,-0.645 -1.3975,-1.075c0.71219,-0.215 0.5375,-0.215 2.2575,-0.5375c3.07719,-0.56437 7.69969,-1.94844 14.9425,-5.0525c2.88906,-1.23625 5.805,-1.58562 9.03,-2.6875c3.225,-1.10187 6.74563,-3.35937 9.1375,-7.6325c2.82188,-5.02562 1.89469,-11.31437 0.3225,-18.3825c-1.57219,-7.06812 -4.27312,-14.88875 -6.9875,-22.145c-2.53969,-6.79937 -6.36937,-13.61219 -7.6325,-19.35c-0.01344,-0.04031 0.01344,-0.06719 0,-0.1075c-1.55875,-7.43094 -0.645,-15.57406 -5.16,-23.22c-2.44562,-4.15219 -3.42656,-7.57875 -3.3325,-10.535c0.09406,-2.95625 1.20938,-5.75125 4.1925,-8.9225c0.43,-0.44344 0.72563,-1.00781 0.86,-1.6125c2.52625,-11.95937 14.39156,-31.41687 21.3925,-37.7325c1.1825,-0.99437 1.55875,-2.67406 0.90031,-4.07156c-0.65844,-1.41094 -2.16344,-2.20375 -3.69531,-1.94844z"></path></g></g></svg>
                        <p class="list_text">Legs and core</p>
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M57.27734,22.87734c-2.33303,0.00061 -4.43307,1.41473 -5.31096,3.57628c-0.8779,2.16155 -0.3586,4.6395 1.31331,6.26669l53.27969,53.27969l-53.27969,53.27969c-1.49777,1.43802 -2.10111,3.5734 -1.57733,5.58259c0.52378,2.0092 2.09283,3.57825 4.10203,4.10203c2.0092,0.52378 4.14457,-0.07956 5.58259,-1.57733l57.33333,-57.33333c2.23811,-2.23904 2.23811,-5.86825 0,-8.10729l-57.33333,-57.33333c-1.07942,-1.10959 -2.56162,-1.73559 -4.10963,-1.73568z"></path></g></g></svg>
                    </button>
                </li>
                <li class="list_item list_pectoral">
                    <button class="btn list_button">
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="none" stroke-linecap="none" stroke-linejoin="none" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"></path><g><path d="M86,164.83333v0c-7.91917,0 -14.33333,-6.41417 -14.33333,-14.33333v-14.33333c0,-7.91917 6.41417,-14.33333 14.33333,-14.33333v0c7.91917,0 14.33333,6.41417 14.33333,14.33333v14.33333c0,7.91917 -6.41417,14.33333 -14.33333,14.33333z" fill="none" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="butt" stroke-linejoin="round"></path><path d="M50.16667,129c0,0 7.16667,7.16667 21.5,0" fill="none" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="round" stroke-linejoin="round"></path><path d="M64.5,100.33333c0,-11.87412 9.62588,-21.5 21.5,-21.5c11.87412,0 21.5,9.62588 21.5,21.5c0,11.87412 -9.62588,21.5 -21.5,21.5c-11.87412,0 -21.5,-9.62588 -21.5,-21.5z" fill="none" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="round" stroke-linejoin="round"></path><g fill="#c5c3c3" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" opacity="0.3"><path d="M71.66667,136.16667v14.33333c0,7.91917 6.41417,14.33333 14.33333,14.33333c7.91917,0 14.33333,-6.41417 14.33333,-14.33333v-14.33333c0,-7.91917 -6.41417,-14.33333 -14.33333,-14.33333c-7.91917,0 -14.33333,6.41417 -14.33333,14.33333z"></path><circle cx="12" cy="14" transform="scale(7.16667,7.16667)" r="3"></circle></g><circle cx="9" cy="11" transform="scale(7.16667,7.16667)" r="2" fill="#c5c3c3" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"></circle><circle cx="15" cy="11" transform="scale(7.16667,7.16667)" r="2" fill="#c5c3c3" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"></circle><path d="M50.16667,163.4c0,0 7.16667,5.73333 21.5,-5.73333" fill="#ffffff" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="round" stroke-linejoin="round"></path><path d="M121.83333,129c0,0 -7.16667,7.16667 -21.5,0" fill="none" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="round" stroke-linejoin="round"></path><path d="M121.83333,163.4c0,0 -7.16667,5.73333 -21.5,-5.73333" fill="#ffffff" stroke="#c5c3c3" stroke-width="14.33333" stroke-linecap="round" stroke-linejoin="round"></path><path d="M121.83333,21.5h-28.66667v-21.5h-14.33333v21.5h-28.66667l-35.83333,35.83333v28.66667v7.16667v7.16667l21.5,7.16667v-14.33333l-7.16667,-2.3865v-26.28017l28.66667,-21.5h57.33333l28.66667,21.5v26.28017l-7.16667,2.3865v14.33333l21.5,-7.16667v-7.16667v-7.16667v-28.66667z" fill="#c5c3c3" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"></path></g></g></svg>
                        <p class="list_text">Pectoral machine</p>
                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
                        width="20" height="20"
                        viewBox="0 0 172 172"
                        style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#c5c3c3"><path d="M57.27734,22.87734c-2.33303,0.00061 -4.43307,1.41473 -5.31096,3.57628c-0.8779,2.16155 -0.3586,4.6395 1.31331,6.26669l53.27969,53.27969l-53.27969,53.27969c-1.49777,1.43802 -2.10111,3.5734 -1.57733,5.58259c0.52378,2.0092 2.09283,3.57825 4.10203,4.10203c2.0092,0.52378 4.14457,-0.07956 5.58259,-1.57733l57.33333,-57.33333c2.23811,-2.23904 2.23811,-5.86825 0,-8.10729l-57.33333,-57.33333c-1.07942,-1.10959 -2.56162,-1.73559 -4.10963,-1.73568z"></path></g></g></svg>
                    </button>
                </li>
            </ul>
        </div>

    </div>
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

@import url('https://fonts.googleapis.com/css2?family=Spline+Sans:[email protected];400&display=swap');

a, p, h1, h2, h3, h4, h5, h6, li, button{
    font-family: 'Spline Sans', sans-serif;
}

:root{
    --fs-l: 1.2rem;
    --fs-m: 0.9rem;
    --fs-s: 0.7rem;
}

body{
  padding: 10px 0;
  background-color: rgb(36, 36, 36);
}

button{
    border: none;
    background: none;
    cursor: pointer;
}

li{
    list-style: none;
}

.uichallenge{
    margin: auto;
    width: 362px;
    height: 675px;
    border-radius: 30px;
    background-color: rgb(12, 12, 19);
    color: white;
    overflow: hidden;
}

.header{
    text-align: center;
    padding: 50px 0;
    position: relative;
    z-index: 2;
}

.header::after{
    content: "";
    width: 100%;
    height: 100%;
    background-image: url(https://images.unsplash.com/photo-1615716272018-7c5b1216e262?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80);
    background-repeat: no-repeat;
    background-size: 150%;
    background-position: center;
    position: absolute;
    top: -30%;
    left: 0;
    border-radius: 0 0 200px 200px;
    transform: scale(1.6);
    z-index: -1;
}

.go-back{
    margin-top: 20px;
    margin-left: 25px;
    display: flex;
    justify-content: left;
}

.go-back svg{
    width: 45px;
    height: 45px;
    padding: 5px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
}


.header_text{
    width: 100%;
    margin: auto;
    padding: 10px 0 20px 0;
    line-height: 1.5;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(1fr, 2);
}

.header_text_title{
    font-size: var(--fs-l);
    padding-bottom: 3px;
}

.header_text_intro{
    font-size: var(--fs-m);
    width: 63%;
    justify-self: center;
}

.header_cta{
    padding: 0 30px;
    display: flex;
    justify-content: center;
}

.header_cta .btn{
    background-color: rgb(235, 235, 235);
    padding: 10px;
    border-radius: 10px;
    box-shadow: 2px 2px 5px grey;
    margin: 0 5px;
}

.play_btn{
    background-image: linear-gradient(120deg, #a6c0fe 0%, #f68084 100%);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    position: absolute;
    bottom: -20%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, -50%);
}

.menu{
    margin-top: 60px;
    padding: 0 20px;
}

.menu_title{
    font-size: var(--fs-m);
    color: rgb(92, 91, 91);
    padding-left: 15px;
}

.list_item_wrapper{
    margin-top: 10px;
}

.list_item{
    border-bottom: 1px solid rgba(155, 154, 154, 0.1);
}

.list_item:last-child{
    border-bottom: none;
}

.list_button{
    padding: 13px 0;
    color: rgb(197, 195, 195);
    display: grid;
    grid-template-columns: 1fr 4fr 1fr;
    grid-template-rows: 1fr;
    width: 100%;
    align-items: center;
}

.list_item svg{
    justify-self: center;
}

.list_text{
    text-align: left;
    font-size: var(--fs-s);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.