example-hero-homestyle-with-video

show code

<section class="content-section">
    <div class="hero-slider hero-slider-with-video js-hero-slider-with-video">
        <div>
            <div class="video-wrapper js-hero-video-slider">
                <iframe class="z-index-1" src="https://www.youtube.com/embed/IEmkRR1yDcg?rel=0&amp;controls=0&amp;showinfo=0" width="560" height="315" frameborder="0" allowfullscreen=""></iframe>
            </div>
        </div>
        <div>
            <a href="{{store url=''}}"><img class="lazyload" data-src="http://placehold.it/640x360/00aeef/fff?text=Compex+CTA+1" alt=""></a>
        </div>
        <div>
            <a href="{{store url=''}}"><img class="lazyload" data-src="http://placehold.it/640x360/236e9b/fff?text=Compex+CTA+2" alt=""></a>
        </div>
    </div>
    <div class="hero-text-container js-hero-text-container text-center">
        <div class="contained">
            <h1 class="hero-heading all-caps font-family-secondary font-style-italic font-weight-3">The Best Tool for Your Peak Performance</h1>
            <p class="hero-subheading">Get stronger, faster, without working harder.</p>
            <a class="hero-cta" href="{{store url='products'}}">Shop Now</a>
        </div>
    </div>
    <div class="hero hero-with-video">
        <div class="hero-left-container">
            <div class="video-wrapper video-wrapper-has-overlay js-hero-video">
                <iframe class="z-index-1" src="https://www.youtube.com/embed/IEmkRR1yDcg?rel=0&amp;controls=0&amp;showinfo=0" width="560" height="315" frameborder="0" allowfullscreen=""></iframe>
            </div>
        </div>
        <div class="hero-right-container">
            <div>
                <a href="{{store url=''}}"><img class="lazyload" data-src="http://placehold.it/640x270/00aeef/fff?text=Compex+CTA+1" alt=""></a>
            </div>
            <div>
                <a href="{{store url=''}}"><img class="lazyload" data-src="http://placehold.it/640x270/236e9b/fff?text=Compex+CTA+2" alt=""></a>
            </div>
        </div>
    </div>
</section>

The Best Tool for Your Peak Performance

Get stronger, faster, without working harder.

Shop Now

example-block-left-aligned-paragraph

show code

<section class="content-section">
    <div class="cms-block-centered-content section-has-bg cms-block-beige text-left">
        <div class="contained">
            <div class="width-75 margin-0">
                <div class="inner-text">
                    <p class="text-color-gray">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proi dent, sut in culpa qui officia deserunt mollit anim id est laborum.</p>
                </div>
            </div>
        </div>
    </div>
</section>

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proi dent, sut in culpa qui officia deserunt mollit anim id est laborum.

example-block-centered-with-heading-and-subheading

show code

<section class="content-section">
    <div class="cms-block-centered-content with-heading">
        <div class="contained">
            <div class="width-80">
                <h2 class="content-heading smaller-on-mobile-only">Benefits of Muscle Stimulation</h2>
                <h4 class="content-subheading with-divider">Get stronger, faster, without working harder.</h4>
                <div class="inner-text smaller">
                    <p class="text-color-gray">From warming up, working out and cooling down, Compex electric muscle stimulator will help to accelerate your fitness results. With pre-designed programs, you can activate hard-to-reach muscle fibers quicker than your regular training regimen and with less stress on your body. Providing major benefits across all areas of performance, whether you're a newbie or elite, here's the down and dirty of what Compex muscle stimulation can deliver.</p>
                </div>
            </div>
        </div>
    </div>
</section>

Benefits of Muscle Stimulation

Get stronger, faster, without working harder.

From warming up, working out and cooling down, Compex electric muscle stimulator will help to accelerate your fitness results. With pre-designed programs, you can activate hard-to-reach muscle fibers quicker than your regular training regimen and with less stress on your body. Providing major benefits across all areas of performance, whether you're a newbie or elite, here's the down and dirty of what Compex muscle stimulation can deliver.

example-block-centered-with-heading-and-button

show code

<section class="content-section">
    <div class="cms-block-centered-content with-heading section-has-bg cms-block-beige">
        <div class="contained">
            <h2 class="content-heading smaller-on-mobile-only">Value Statement Goes Here</h2>
            <a class="content-button" href="{{store url='products'}}">Shop All Products</a>
        </div>
    </div>
</section>

Value Statement Goes Here

Shop All Products

example-icon-strip

show code

<section class="content-section">
    <div class="cms-block-icon-strip">
        <div class="contained">
            <ul class="list flex flex-wrap flex-lg-nowrap items-center justify-center text-xs-center">
                <li class="item flex-half flex-sm-third flex-lg-fifth margin-bottom-1 margin-lg-bottom-0">
                    <div class="item-inner display-table">
                        <div class="icon-wrapper display-table-cell vertical-align-middle">
                            <svg class="icon fill-blue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 470.9 250.3" width="61" height="32">
                                <title>Increase Explosive Strength</title>
                                <rect x="162.8" y="101.3" width="145.3" height="47.7" />
                                <path d="M9.7 101.3h11.5l0 0V149l0 0H9.7c-5.4 0-9.7-4.3-9.7-9.7V111C0 105.6 4.3 101.3 9.7 101.3L9.7 101.3z" />
                                <path d="M122.9 0L122.9 0c13.2 0 23.9 10.7 23.9 23.9v202.5c0 13.2-10.7 23.9-23.9 23.9h0c-13.2 0-23.9-10.7-23.9-23.9V23.9C99 10.7 109.7 0 122.9 0z" />
                                <path d="M70.5 36.4h12l0 0v177.5l0 0h-12c-18.3 0-33.2-14.9-33.2-33.2l0 0V69.5C37.3 51.2 52.1 36.4 70.5 36.4z" />
                                <path d="M449.7 101.3h11.5c5.4 0 9.7 4.3 9.7 9.7v28.3c0 5.4-4.3 9.7-9.7 9.7h-11.5V101.3z" />
                                <path d="M348 250.3L348 250.3c-13.2 0-23.9-10.7-23.9-23.9V23.9C324.2 10.7 334.8 0 348 0h0c13.2 0 23.9 10.7 23.9 23.9v202.5C371.9 239.6 361.2 250.3 348 250.3z" />
                                <path d="M400.4 213.9h-12l0 0V36.4l0 0h12c18.3 0 33.2 14.9 33.2 33.2l0 0v111.2C433.6 199 418.8 213.9 400.4 213.9z" />
                            </svg>
                        </div>
                        <div class="title-wrapper display-table-cell vertical-align-middle">
                            <p class="title font-size-medium font-weight-3 margin-bottom-0 text-color-gray text-left">Increase Explosive Strength</p>
                        </div>
                    </div>
                </li>
                <li class="item flex-half flex-sm-third flex-lg-fifth margin-bottom-1 margin-lg-bottom-0">
                    <div class="item-inner display-table">
                        <div class="icon-wrapper display-table-cell vertical-align-middle">
                            <svg class="icon fill-blue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 291.1 355.7" width="37" height="46">
                                <title>Reduce Muscle &amp; Joint Damage</title>
                                <path d="M251.1 0h15.8c12.1 0 16.8 12.1 12.9 23.6 -6.5 19.6-10 24.7-16.8 41 -11.3 26.8-1.4 46.6 8.5 60.8s21.2 62.2-25.4 80.5 -81.9-11.3-87.6-36.7 -1.8-61.3 49.5-118.7c21.7-24.3 23.6-31.3 28.7-40C240 4.7 244.6 0 251.1 0z" />
                                <path d="M148.6 195.9c12.7 17 59.3 79.2 122.9 15.6 17-19.8 33.9 2.8 0 42.3 -23.1 26.9-19.6 43.9-15 72 3.5 21.9-6.8 29.8-22.3 29.8h-14c-12.3 0-17.7-9.2-23.5-21.7 -1.2-2.6-4.8-9.6-19.8-27.9C153.3 277.5 87.9 194.5 148.6 195.9z" />
                                <path d="M153.2 84c4.8-1.7 8.8 4.2 5.3 8 -11.7 12.2-23.5 38.5-18.8 53.1 9.9 30.9-26.8 53.7-26.8 9.9C112.8 121.4 136.6 89.9 153.2 84z" />
                                <path d="M75.8 84.3L20.2 45.1c-0.6-0.4-1.4-0.3-1.8 0.2 -0.3 0.4-0.4 0.9-0.2 1.3l33.3 89.8H17.7c-0.7 0-1.3 0.6-1.3 1.3 0 0.4 0.2 0.9 0.6 1.1l34.5 21.9L0.6 193.3c-0.6 0.4-0.8 1.2-0.4 1.8 0.2 0.4 0.6 0.6 1 0.6 13.7 0.5 56.6 1.8 59.5-0.2s-16.1 29.6-23 41.1c-0.4 0.6-0.2 1.4 0.4 1.8 0.4 0.2 0.9 0.2 1.3 0l60.4-26.9c2.6-1.4 3.6-4.6 2.4-7.3C67.8 129.2 114 82.2 135 69.9c2.6-1.5 3.5-4.7 2.1-7.3 -6.8-12.9-31.3-41.8-38-54.6 -0.3-0.6-1.1-0.9-1.8-0.5 -0.4 0.2-0.7 0.7-0.7 1.2v67.7L77.9 52.9c-0.4-0.6-1.3-0.7-1.8-0.2 -0.3 0.3-0.5 0.6-0.5 1L75.8 84.3z" />
                            </svg>
                        </div>
                        <div class="title-wrapper display-table-cell vertical-align-middle">
                            <p class="title font-size-medium font-weight-3 margin-bottom-0 text-color-gray text-left">Reduce Muscle &amp; Joint Damage</p>
                        </div>
                    </div>
                </li>
                <li class="item flex-half flex-sm-third flex-lg-fifth margin-bottom-1 margin-lg-bottom-0">
                    <div class="item-inner display-table">
                        <div class="icon-wrapper display-table-cell vertical-align-middle">
                            <svg class="icon fill-blue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 442.8 297.9" width="59" height="40">
                                <title>Avoid Training Fatigue</title>
                                <path d="M441 152.1L441 152.1C406.9 61.1 318.6 0 221.4 0S36 61.1 1.8 152.1c-5.7 15.4 2.2 32.4 17.6 38.1 15.2 5.6 32.1-2.1 37.9-17.2 4-10.7 9-20.9 15.1-30.6l-27.8-21.8c-4.3-3.4-5.1-9.6-1.7-13.9s9.6-5.1 13.9-1.7l27 21.1c13.5-17.1 30.1-31.5 48.9-42.6l-13.6-28.5c-2.4-4.9-0.3-10.8 4.7-13.2 4.9-2.4 10.8-0.3 13.2 4.7l13.4 28c19.3-8.7 40.1-13.7 61.3-14.9v-30c0-5.5 4.4-9.9 9.9-9.9s9.9 4.4 9.9 9.9v30c21.2 1.2 41.9 6.3 61.3 14.9l13.4-28c2.4-4.9 8.3-7 13.2-4.7 4.9 2.4 7 8.3 4.7 13.2l-13.6 28.5c18.8 11.1 35.4 25.5 48.9 42.6l27-21.1c4.3-3.4 10.5-2.6 13.9 1.7s2.6 10.5-1.7 13.9l-27.8 21.8c6 9.7 11.1 19.9 15.1 30.6 5.8 15.3 23 23 38.3 17.1C438.9 184.2 446.6 167.3 441 152.1z" />
                                <path d="M322 131.1c-1.7-0.9-3.8-0.9-5.4 0l-64.3 35.7c10.2 4.6 19.6 13.5 11.2 30.7 -11.1-12.4-27.2-20.3-45.1-20.3 -33.3 0-60.3 27-60.3 60.3s27 60.3 60.3 60.3 60.3-27 60.3-60.3c0-4.4-0.5-8.8-1.4-12.9l46.9-85.9C325.7 136 324.7 132.6 322 131.1z" />
                            </svg>
                        </div>
                        <div class="title-wrapper display-table-cell vertical-align-middle">
                            <p class="title font-size-medium font-weight-3 margin-bottom-0 text-color-gray text-left">Avoid Training Fatigue</p>
                        </div>
                    </div>
                </li>
                <li class="item flex-half flex-sm-third flex-lg-fifth margin-bottom-1 margin-sm-bottom-0">
                    <div class="item-inner display-table">
                        <div class="icon-wrapper display-table-cell vertical-align-middle">
                            <svg class="icon fill-blue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 423.1 266.7" width="57" height="37">
                                <title>Faster Recovery</title>
                                <circle cx="380.3" cy="42.3" r="33.7" />
                                <path d="M411 122.2l-47.5-1.9 -18-44.4L285.1 6.3c-3.5-4-8.5-6.3-13.8-6.3h-62.5c-6.8 0-12.2 5.5-12.2 12.2s5.5 12.2 12.2 12.2l57.8 1.8 15.8 22.7 -68.2 63.4 0 0c-10.7 9.1-12.6 24.8-4.4 36.2l0 0 0.3 0.4c0.4 0.5 0.8 1 1.1 1.4l47.1 58.4L194.1 227l0 0c-9 2.5-14.2 11.9-11.7 20.9 2.4 8.6 11.2 13.9 20 11.9l0 0 99.9-22.1 0 0h0.2l0 0c9.1-2 14.9-11 12.9-20.1 -0.6-2.6-1.7-5-3.4-7.1l0 0 -44.7-62.2 55.1-41.1 17 30.2c3.2 5.7 9.3 9.3 15.9 9.3h55.5c6.8 0 12.2-5.5 12.2-12.2s-5.5-12.2-12.2-12.2L411 122.2z" />
                                <path d="M92.8 261.5l112.1-81.8c-11.2-13.8-21.5-20-20.5-38.6L71.1 235.8c-1 0.7-1.9 1.4-2.8 2.3l0 0 0 0c-6.5 6.7-6.3 17.4 0.4 23.9 5.1 5 12.8 6.2 19.1 3.1l0 0L88 265C89.8 264.1 91.4 262.9 92.8 261.5z" />
                                <path d="M198.6 82h-84.2c-5.9-0.2-10.5-5.1-10.4-11 0.2-5.7 4.7-10.2 10.4-10.4h84.2c5.9-0.2 10.8 4.5 11 10.4 0.2 5.9-4.5 10.8-10.4 11C199 82 198.8 82 198.6 82z" />
                                <path d="M143.6 132.9H59.4c-5.9-0.2-10.5-5.1-10.4-11 0.2-5.7 4.7-10.2 10.4-10.4h84.2c5.9 0.2 10.5 5.1 10.4 11C153.8 128.2 149.2 132.8 143.6 132.9z" />
                                <path d="M95.2 183.4H11c-5.9 0.2-10.8-4.5-11-10.4 -0.2-5.9 4.5-10.8 10.4-11 0.2 0 0.4 0 0.7 0h84.2c5.9 0.2 10.5 5.1 10.4 11C105.4 178.6 100.9 183.2 95.2 183.4z" />
                            </svg>
                        </div>
                        <div class="title-wrapper display-table-cell vertical-align-middle">
                            <p class="title font-size-medium font-weight-3 margin-bottom-0 text-color-gray text-left">Faster Recovery</p>
                        </div>
                    </div>
                </li>
                <li class="item flex-half flex-sm-third flex-lg-fifth">
                    <div class="item-inner display-table">
                        <div class="icon-wrapper display-table-cell vertical-align-middle">
                            <svg class="icon fill-blue" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 322.1 297.6" width="42" height="39">
                                <title>Pain Management</title>
                                <path d="M236.4 61.8c-6.2 0-11.1-5-11.1-11.2V22.3H96.8v28.3C97 56.8 92.2 61.9 86 62.1c-6.2 0.2-11.3-4.7-11.5-10.8 0-0.2 0-0.4 0-0.7V11.2C74.5 5 79.5 0 85.7 0h150.7c6.2 0 11.1 5 11.1 11.2v39.5C247.6 56.8 242.6 61.8 236.4 61.8 236.4 61.8 236.4 61.8 236.4 61.8z" />
                                <path d="M298.6 78.6H23.4C10.5 78.6 0 89.1 0 102v172.1c0 13 10.5 23.4 23.4 23.4h275.2c13 0 23.4-10.5 23.4-23.4V102C322.1 89.1 311.6 78.6 298.6 78.6zM202.9 202.5h-27.4v27.4c0 8-6.4 14.5-14.4 14.5 -8 0-14.5-6.4-14.5-14.4 0 0 0 0 0-0.1v-27.4h-27.4c-8 0-14.4-6.5-14.4-14.4 0-8 6.5-14.5 14.4-14.5h27.4v-27.4c0-8 6.4-14.5 14.4-14.5 8 0 14.5 6.4 14.5 14.4 0 0 0 0 0 0.1v27.4h27.4c8 0 14.4 6.5 14.4 14.5C217.3 196 210.8 202.5 202.9 202.5z" />
                            </svg>
                        </div>
                        <div class="title-wrapper display-table-cell vertical-align-middle">
                            <p class="title font-size-medium font-weight-3 margin-bottom-0 text-color-gray text-left">Pain Management</p>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</section>

Increase Explosive Strength
Reduce Muscle & Joint Damage
Avoid Training Fatigue
Faster Recovery
Pain Management

example-image-with-overlay

show code

<section class="content-section">
    <div class="cms-block-image-with-overlay">
        <div class="contained">
            <a href="{{store url='products'}}">
                <figure class="figure">
                    <img class="image" src="{{view url='images/electrodes.jpg'}}" alt="Compex electrodes on a person's elbow">
                    <figcaption class="overlay font-weight-4"><span>Electrodes &amp; Accessories</span></figcaption>
                </figure>
            </a>
        </div>
    </div>
</section>

Compex electrodes on a person's elbow — Electrodes & Accessories

example-image-with-overlay-cta

show code

<section class="content-section">
    <div class="contained">
        <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
            <figure class="figure">
                <img class="image" src="{{view url='images/athletes/mat-fraser.jpg'}}" alt="">
                <figcaption class="overlay text-color-white">
                    <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Mat Fraser</h4>
                    <span class="subheading">Crossfitter</span>
                    <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                    <a class="button" href="{{store url=''}}">About Mat</a>
                </figcaption>
            </figure>
        </div>
    </div>
</section>

Mat Fraser
Crossfitter "Everyday is an opportunity for greatness" About Mat

example-image-with-overlay-cta-grid

show code

<section class="content-section">
    <div class="contained">
        <div class="cms-block-image-with-overlay-cta-grid">
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/mat-fraser.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Mat Fraser</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Mat</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/sara-sigmundsdottir.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Sara Sigmundsdottir</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Sara</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/phil-heath.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Phil Heath</h4>
                        <span class="subheading">Body Builder</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Phil</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/lauren-fisher.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Lauren Fisher</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Lauren</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/brooke-wells.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Brooke Wells</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Brooke</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/garret-fisher.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Garret Fisher</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Garret</a>
                    </figcaption>
                </figure>
            </div>
            <div class="cms-block-image-with-overlay-cta js-image-with-overlay-cta">
                <figure class="figure">
                    <img class="image" src="{{view url='images/athletes/sarah-loogman.jpg'}}" alt="">
                    <figcaption class="overlay text-color-white">
                        <h4 class="heading all-caps font-family-secondary font-style-italic font-weight-3 text-color-white">Sarah Loogman</h4>
                        <span class="subheading">Crossfitter</span>
                        <span class="content font-weight-2">"Everyday is an opportunity for greatness"</span>
                        <a class="button" href="{{store url=''}}">About Sarah</a>
                    </figcaption>
                </figure>
            </div>
        </div>
    </div>
</section>

Sara Sigmundsdottir
Crossfitter "Everyday is an opportunity for greatness" About Sara

Phil Heath
Body Builder "Everyday is an opportunity for greatness" About Phil

Lauren Fisher
Crossfitter "Everyday is an opportunity for greatness" About Lauren

Brooke Wells
Crossfitter "Everyday is an opportunity for greatness" About Brooke

Garret Fisher
Crossfitter "Everyday is an opportunity for greatness" About Garret

Sarah Loogman
Crossfitter "Everyday is an opportunity for greatness" About Sarah

example-image-with-overlay-slider

show code

<section class="content-section">
    <div class="cms-block-image-with-overlay-slider">
        <div class="contained">
            <div class="js-image-with-overlay-slider">
                <div class="cms-block-image-with-overlay">
                    <a href="{{store url='products'}}">
                        <figure class="figure">
                            <img class="image lazyload" data-src="{{view url='images/tens.jpg'}}" alt="A man exercising while using a Compex TENS Wrap Unit">
                            <figcaption class="overlay font-weight-4"><span>TENS Wrap Units</span></figcaption>
                        </figure>
                    </a>
                </div>
                <div class="cms-block-image-with-overlay">
                    <a href="{{store url='products'}}">
                        <figure class="figure">
                            <img class="image lazyload" data-src="{{view url='images/wearables.jpg'}}" alt="A woman wearing a Compex wearable around her waist">
                            <figcaption class="overlay font-weight-4"><span>Wearables</span></figcaption>
                        </figure>
                    </a>
                </div>
                <div class="cms-block-image-with-overlay">
                    <a href="{{store url='products'}}">
                        <figure class="figure">
                            <img class="image lazyload" data-src="{{view url='images/electrodes.jpg'}}" alt="Compex electrodes on a person's elbow">
                            <figcaption class="overlay font-weight-4"><span>Electrodes &amp; Accessories</span></figcaption>
                        </figure>
                    </a>
                </div>
                <div class="cms-block-image-with-overlay">
                    <a href="{{store url='products'}}">
                        <figure class="figure">
                            <img class="image lazyload" data-src="{{view url='images/apparel.jpg'}}" alt="A woman wearing a Compex sweater">
                            <figcaption class="overlay font-weight-4"><span>Apparel</span></figcaption>
                        </figure>
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>

A man exercising while using a Compex TENS Wrap Unit — TENS Wrap Units

A woman wearing a Compex wearable around her waist — Wearables

A woman wearing a Compex sweater — Apparel

example-image-with-overlay-stack

show code

<section class="content-section">
    <div class="cms-block-image-with-overlay-stack">
        <div class="contained">
            <div class="bootstrap">
                <div class="row clearfix">
                    <div class="col-lg-3 col-md-6 col-xs-12">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='products'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/292x195" alt="">
                                    <figcaption class="overlay font-weight-4"><span>TENS Wrap Units</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-xs-12">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='products'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/292x195" alt="">
                                    <figcaption class="overlay font-weight-4"><span>TENS Wrap Units</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-xs-12">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='products'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/292x195" alt="">
                                    <figcaption class="overlay font-weight-4"><span>TENS Wrap Units</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-xs-12">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='products'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/292x195" alt="">
                                    <figcaption class="overlay font-weight-4"><span>TENS Wrap Units</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

example-image-with-overlay-grid

show code

<section class="content-section">
    <div class="cms-block-image-with-overlay-grid js-image-with-overlay-grid">
        <div class="contained">
            <div class="bootstrap">
                <div class="row clearfix">
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='deltoid'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Deltoid</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='abdominal-muscle'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Abdominal Muscle</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='biceps'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Biceps</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='flexor-wrist-fingers'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Flexor of Wrist and Fingers</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='peroneous-muscle'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Peroneous Muscle</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='erector-spinalis'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Erector Spinalis</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='gluteus'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Gluteus</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='quadriceps'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Quadriceps</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='hamstrings'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Hamstrings</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='tibialis-anterior'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Tibialis Anterior</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='trapezius'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Trapezius</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='triceps'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Triceps</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='extensors-wrist-fingers'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Extensors of Wrist and Fingers</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='low-back-muscles'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Lower Back Muscle</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                    <div class="col-xs-6 col-sm-3 col-lg-2">
                        <div class="cms-block-image-with-overlay">
                            <a href="{{store url='calf-muscles'}}">
                                <figure class="figure">
                                    <img class="image" src="http://placehold.it/200x200" alt="">
                                    <figcaption class="overlay font-weight-4"><span>Calf Muscle</span></figcaption>
                                </figure>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

example-informational

show code

<section class="content-section">
    <div class="contained">
        <div class="cms-block-informational has-shadow display-inline-block margin-right-3">
            <div class="cms-block-informational-inner">
                <div class="informational-header lazyload text-center" data-bg="{{view url='images/informational/explosive-strength.jpg'}}">
                    <div class="informational-header-inner">
                        <svg class="icon fill-white explosive-strength" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 470.9 250.3" width="56" height="29">
                            <title>Increase Explosive Strength</title>
                            <rect x="162.8" y="101.3" width="145.3" height="47.7" />
                            <path d="M9.7 101.3h11.5l0 0V149l0 0H9.7c-5.4 0-9.7-4.3-9.7-9.7V111C0 105.6 4.3 101.3 9.7 101.3L9.7 101.3z" />
                            <path d="M122.9 0L122.9 0c13.2 0 23.9 10.7 23.9 23.9v202.5c0 13.2-10.7 23.9-23.9 23.9h0c-13.2 0-23.9-10.7-23.9-23.9V23.9C99 10.7 109.7 0 122.9 0z" />
                            <path d="M70.5 36.4h12l0 0v177.5l0 0h-12c-18.3 0-33.2-14.9-33.2-33.2l0 0V69.5C37.3 51.2 52.1 36.4 70.5 36.4z" />
                            <path d="M449.7 101.3h11.5c5.4 0 9.7 4.3 9.7 9.7v28.3c0 5.4-4.3 9.7-9.7 9.7h-11.5V101.3z" />
                            <path d="M348 250.3L348 250.3c-13.2 0-23.9-10.7-23.9-23.9V23.9C324.2 10.7 334.8 0 348 0h0c13.2 0 23.9 10.7 23.9 23.9v202.5C371.9 239.6 361.2 250.3 348 250.3z" />
                            <path d="M400.4 213.9h-12l0 0V36.4l0 0h12c18.3 0 33.2 14.9 33.2 33.2l0 0v111.2C433.6 199 418.8 213.9 400.4 213.9z" />
                        </svg>
                        <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Increase Explosive <br>Strength</h3>
                    </div>
                </div>
                <div class="informational-body text-center">
                    <p>Activate more of your muscle fibers.</p>
                    <p>The Compex Strength program is intended to increase the maximum strength of muscle contraction.</p>
                    <p>Takes less time to stimulate muscle growth than a typical workout.</p>
                </div>
            </div>
        </div>
        <div class="cms-block-informational has-shadow display-inline-block">
            <div class="cms-block-informational-inner">
                <div class="informational-header text-center">
                    <div class="informational-header-inner">
                        <svg class="icon fill-white explosive-strength" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 470.9 250.3" width="56" height="29">
                            <title>Increase Explosive Strength</title>
                            <rect x="162.8" y="101.3" width="145.3" height="47.7" />
                            <path d="M9.7 101.3h11.5l0 0V149l0 0H9.7c-5.4 0-9.7-4.3-9.7-9.7V111C0 105.6 4.3 101.3 9.7 101.3L9.7 101.3z" />
                            <path d="M122.9 0L122.9 0c13.2 0 23.9 10.7 23.9 23.9v202.5c0 13.2-10.7 23.9-23.9 23.9h0c-13.2 0-23.9-10.7-23.9-23.9V23.9C99 10.7 109.7 0 122.9 0z" />
                            <path d="M70.5 36.4h12l0 0v177.5l0 0h-12c-18.3 0-33.2-14.9-33.2-33.2l0 0V69.5C37.3 51.2 52.1 36.4 70.5 36.4z" />
                            <path d="M449.7 101.3h11.5c5.4 0 9.7 4.3 9.7 9.7v28.3c0 5.4-4.3 9.7-9.7 9.7h-11.5V101.3z" />
                            <path d="M348 250.3L348 250.3c-13.2 0-23.9-10.7-23.9-23.9V23.9C324.2 10.7 334.8 0 348 0h0c13.2 0 23.9 10.7 23.9 23.9v202.5C371.9 239.6 361.2 250.3 348 250.3z" />
                            <path d="M400.4 213.9h-12l0 0V36.4l0 0h12c18.3 0 33.2 14.9 33.2 33.2l0 0v111.2C433.6 199 418.8 213.9 400.4 213.9z" />
                        </svg>
                        <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Increase Explosive <br>Strength</h3>
                    </div>
                </div>
                <div class="informational-body text-center">
                    <p>Activate more of your muscle fibers.</p>
                    <p>The Compex Strength program is intended to increase the maximum strength of muscle contraction.</p>
                    <p>Takes less time to stimulate muscle growth than a typical workout.</p>
                </div>
            </div>
        </div>
    </div>
</section>

Increase Explosive
Strength

Activate more of your muscle fibers.

The Compex Strength program is intended to increase the maximum strength of muscle contraction.

Takes less time to stimulate muscle growth than a typical workout.

Increase Explosive
Strength

Activate more of your muscle fibers.

The Compex Strength program is intended to increase the maximum strength of muscle contraction.

Takes less time to stimulate muscle growth than a typical workout.

example-informational-slider

show code

<section class="content-section">
    <div class="contained">
        <div class="cms-block-informational-slider js-informational-slider">
            <div class="cms-block-informational has-shadow">
                <div class="cms-block-informational-inner">
                    <div class="informational-header lazyload text-center" data-bg="{{view url='images/informational/pain-management.jpg'}}">
                        <div class="informational-header-inner">
                            <svg class="icon fill-white pain-management" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 322.1 297.6" width="40" height="37">
                                <title>Pain Management</title>
                                <path d="M236.4 61.8c-6.2 0-11.1-5-11.1-11.2V22.3H96.8v28.3C97 56.8 92.2 61.9 86 62.1c-6.2 0.2-11.3-4.7-11.5-10.8 0-0.2 0-0.4 0-0.7V11.2C74.5 5 79.5 0 85.7 0h150.7c6.2 0 11.1 5 11.1 11.2v39.5C247.6 56.8 242.6 61.8 236.4 61.8 236.4 61.8 236.4 61.8 236.4 61.8z" />
                                <path d="M298.6 78.6H23.4C10.5 78.6 0 89.1 0 102v172.1c0 13 10.5 23.4 23.4 23.4h275.2c13 0 23.4-10.5 23.4-23.4V102C322.1 89.1 311.6 78.6 298.6 78.6zM202.9 202.5h-27.4v27.4c0 8-6.4 14.5-14.4 14.5 -8 0-14.5-6.4-14.5-14.4 0 0 0 0 0-0.1v-27.4h-27.4c-8 0-14.4-6.5-14.4-14.4 0-8 6.5-14.5 14.4-14.5h27.4v-27.4c0-8 6.4-14.5 14.4-14.5 8 0 14.5 6.4 14.5 14.4 0 0 0 0 0 0.1v27.4h27.4c8 0 14.4 6.5 14.4 14.5C217.3 196 210.8 202.5 202.9 202.5z" />
                            </svg>
                            <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Pain Management</h3>
                        </div>
                    </div>
                    <div class="informational-body text-center">
                        <p>Lorem Ipsum Fusce dapibus, tellus ac cursus commodo, tortor mauris.</p>
                        <p>Nibh ut fermentum massa justo sit amet risus. Sed posuere consectetur est at lobortis. Donec sed odio dui.</p>
                    </div>
                </div>
            </div>
            <div class="cms-block-informational has-shadow">
                <div class="cms-block-informational-inner">
                    <div class="informational-header lazyload text-center" data-bg="{{view url='images/informational/explosive-strength.jpg'}}">
                        <div class="informational-header-inner">
                            <svg class="icon fill-white explosive-strength" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 470.9 250.3" width="56" height="29">
                                <title>Increase Explosive Strength</title>
                                <rect x="162.8" y="101.3" width="145.3" height="47.7" />
                                <path d="M9.7 101.3h11.5l0 0V149l0 0H9.7c-5.4 0-9.7-4.3-9.7-9.7V111C0 105.6 4.3 101.3 9.7 101.3L9.7 101.3z" />
                                <path d="M122.9 0L122.9 0c13.2 0 23.9 10.7 23.9 23.9v202.5c0 13.2-10.7 23.9-23.9 23.9h0c-13.2 0-23.9-10.7-23.9-23.9V23.9C99 10.7 109.7 0 122.9 0z" />
                                <path d="M70.5 36.4h12l0 0v177.5l0 0h-12c-18.3 0-33.2-14.9-33.2-33.2l0 0V69.5C37.3 51.2 52.1 36.4 70.5 36.4z" />
                                <path d="M449.7 101.3h11.5c5.4 0 9.7 4.3 9.7 9.7v28.3c0 5.4-4.3 9.7-9.7 9.7h-11.5V101.3z" />
                                <path d="M348 250.3L348 250.3c-13.2 0-23.9-10.7-23.9-23.9V23.9C324.2 10.7 334.8 0 348 0h0c13.2 0 23.9 10.7 23.9 23.9v202.5C371.9 239.6 361.2 250.3 348 250.3z" />
                                <path d="M400.4 213.9h-12l0 0V36.4l0 0h12c18.3 0 33.2 14.9 33.2 33.2l0 0v111.2C433.6 199 418.8 213.9 400.4 213.9z" />
                            </svg>
                            <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Increase Explosive <br>Strength</h3>
                        </div>
                    </div>
                    <div class="informational-body text-center">
                        <p>Activate more of your muscle fibers.</p>
                        <p>The Compex Strength program is intended to increase the maximum strength of muscle contraction.</p>
                        <p>Takes less time to stimulate muscle growth than a typical workout.</p>
                    </div>
                </div>
            </div>
            <div class="cms-block-informational has-shadow">
                <div class="cms-block-informational-inner">
                    <div class="informational-header lazyload text-center" data-bg="{{view url='images/informational/joint-damage.jpg'}}">
                        <div class="informational-header-inner">
                            <svg class="icon fill-white joint-damage" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 291.1 355.7" width="40" height="46">
                                <title>Reduce Muscle &amp; Joint Damage</title>
                                <path d="M251.1 0h15.8c12.1 0 16.8 12.1 12.9 23.6 -6.5 19.6-10 24.7-16.8 41 -11.3 26.8-1.4 46.6 8.5 60.8s21.2 62.2-25.4 80.5 -81.9-11.3-87.6-36.7 -1.8-61.3 49.5-118.7c21.7-24.3 23.6-31.3 28.7-40C240 4.7 244.6 0 251.1 0z" />
                                <path d="M148.6 195.9c12.7 17 59.3 79.2 122.9 15.6 17-19.8 33.9 2.8 0 42.3 -23.1 26.9-19.6 43.9-15 72 3.5 21.9-6.8 29.8-22.3 29.8h-14c-12.3 0-17.7-9.2-23.5-21.7 -1.2-2.6-4.8-9.6-19.8-27.9C153.3 277.5 87.9 194.5 148.6 195.9z" />
                                <path d="M153.2 84c4.8-1.7 8.8 4.2 5.3 8 -11.7 12.2-23.5 38.5-18.8 53.1 9.9 30.9-26.8 53.7-26.8 9.9C112.8 121.4 136.6 89.9 153.2 84z" />
                                <path d="M75.8 84.3L20.2 45.1c-0.6-0.4-1.4-0.3-1.8 0.2 -0.3 0.4-0.4 0.9-0.2 1.3l33.3 89.8H17.7c-0.7 0-1.3 0.6-1.3 1.3 0 0.4 0.2 0.9 0.6 1.1l34.5 21.9L0.6 193.3c-0.6 0.4-0.8 1.2-0.4 1.8 0.2 0.4 0.6 0.6 1 0.6 13.7 0.5 56.6 1.8 59.5-0.2s-16.1 29.6-23 41.1c-0.4 0.6-0.2 1.4 0.4 1.8 0.4 0.2 0.9 0.2 1.3 0l60.4-26.9c2.6-1.4 3.6-4.6 2.4-7.3C67.8 129.2 114 82.2 135 69.9c2.6-1.5 3.5-4.7 2.1-7.3 -6.8-12.9-31.3-41.8-38-54.6 -0.3-0.6-1.1-0.9-1.8-0.5 -0.4 0.2-0.7 0.7-0.7 1.2v67.7L77.9 52.9c-0.4-0.6-1.3-0.7-1.8-0.2 -0.3 0.3-0.5 0.6-0.5 1L75.8 84.3z" />
                            </svg>
                            <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Reduce Muscle &amp; <br>Joint Damage</h3>
                        </div>
                    </div>
                    <div class="informational-body text-center">
                        <p>Warm up muscles under five minutes (*Data on File).</p>
                        <p>Contractions and frequencies help muscles to recover.</p>
                    </div>
                </div>
            </div>
            <div class="cms-block-informational has-shadow">
                <div class="cms-block-informational-inner">
                    <div class="informational-header lazyload text-center" data-bg="{{view url='images/informational/pain-management.jpg'}}">
                        <div class="informational-header-inner">
                            <svg class="icon fill-white pain-management" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 322.1 297.6" width="40" height="37">
                                <title>Pain Management</title>
                                <path d="M236.4 61.8c-6.2 0-11.1-5-11.1-11.2V22.3H96.8v28.3C97 56.8 92.2 61.9 86 62.1c-6.2 0.2-11.3-4.7-11.5-10.8 0-0.2 0-0.4 0-0.7V11.2C74.5 5 79.5 0 85.7 0h150.7c6.2 0 11.1 5 11.1 11.2v39.5C247.6 56.8 242.6 61.8 236.4 61.8 236.4 61.8 236.4 61.8 236.4 61.8z" />
                                <path d="M298.6 78.6H23.4C10.5 78.6 0 89.1 0 102v172.1c0 13 10.5 23.4 23.4 23.4h275.2c13 0 23.4-10.5 23.4-23.4V102C322.1 89.1 311.6 78.6 298.6 78.6zM202.9 202.5h-27.4v27.4c0 8-6.4 14.5-14.4 14.5 -8 0-14.5-6.4-14.5-14.4 0 0 0 0 0-0.1v-27.4h-27.4c-8 0-14.4-6.5-14.4-14.4 0-8 6.5-14.5 14.4-14.5h27.4v-27.4c0-8 6.4-14.5 14.4-14.5 8 0 14.5 6.4 14.5 14.4 0 0 0 0 0 0.1v27.4h27.4c8 0 14.4 6.5 14.4 14.5C217.3 196 210.8 202.5 202.9 202.5z" />
                            </svg>
                            <h3 class="informational-heading all-caps font-family-secondary font-size-large font-style-italic font-weight-3 margin-bottom-0 margin-top-0 text-color-white">Lorem Ipsum</h3>
                        </div>
                    </div>
                    <div class="informational-body text-center">
                        <p>Lorem Ipsum Fusce dapibus, tellus ac cursus commodo, tortor mauris.</p>
                        <p>Nibh ut fermentum massa justo sit amet risus. Sed posuere consectetur est at lobortis. Donec sed odio dui.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

Pain Management

Lorem Ipsum Fusce dapibus, tellus ac cursus commodo, tortor mauris.

Nibh ut fermentum massa justo sit amet risus. Sed posuere consectetur est at lobortis. Donec sed odio dui.

Increase Explosive
Strength

Activate more of your muscle fibers.

The Compex Strength program is intended to increase the maximum strength of muscle contraction.

Takes less time to stimulate muscle growth than a typical workout.

Reduce Muscle &
Joint Damage

Warm up muscles under five minutes (*Data on File).

Contractions and frequencies help muscles to recover.

Lorem Ipsum

Lorem Ipsum Fusce dapibus, tellus ac cursus commodo, tortor mauris.

Nibh ut fermentum massa justo sit amet risus. Sed posuere consectetur est at lobortis. Donec sed odio dui.

example-select-dropdown-navigation

show code

<section class="content-section">
    <div class="cms-block-select-dropdown-navigation">
        <div class="contained">
            <div class="text-center">
                <label class="label font-size-small text-color-gray-light" for="select-dropdown-navigation">Select Motion</label>
                <select class="select js-select-dropdown-navigation" id="select-dropdown-navigation">
                    <option value="">Select Motion</option>
                    <option value="{{store url='training/performance/increase-vertical-jump'}}">Vertical Jump</option>
                    <option value="{{store url='training/performance/increase-40-yard-dash'}}">40-Yard Dash</option>
                    <option value="{{store url='training/performance/run-longer-build-endurance'}}">Endurance</option>
                    <option value="{{store url='training/performance/increase-squat'}}">Squat</option>
                    <option value="{{store url='training/performance/increase-lower-body-strength'}}">Lower Body Strength</option>
                    <option value="{{store url='training/performance/increase-deadlift'}}">Deadlift</option>
                </select>
            </div>
        </div>
    </div>
</section>

example-select-slider

show code

<section class="content-section">
    <div class="cms-block-select-dropdown-navigation select-is-paired-with-slider select-has-bg select-beige">
        <div class="contained">
            <div class="text-center">
                <select class="select js-select-dropdown-navigation" id="select-dropdown-navigation">
                    <option value="">Select Athlete</option>
                    <option value="/athletes/brooke-wells">Brooke Wells</option>
                    <option value="/athletes/garret-fisher">Garret Fisher</option>
                    <option value="/athletes/sarah-loogman">Sarah Loogman</option>
                    <option value="/athletes/mat-fraser">Mat Fraser</option>
                    <option value="/athletes/sara-sigmundsdottir">Sara Sigmundsdottir</option>
                    <option value="/athletes/phil-heath">Phil Heath</option>
                    <option value="/athletes/lauren-fisher">Lauren Fisher</option>
                </select>
            </div>
        </div>
    </div>
    <div class="select-slider select-slider-is-paired-with-dropdown select-slider-has-bg select-slider-beige">
        <div class="contained">
            <div class="js-select-slider">
                <div class="tab">
                    <a href="{{store url='athletes/brooke-wells'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Brooke <br>Wells</span>
                    </a>
                </div>
                <div class="tab">
                    <a href="{{store url='athletes/garret-fisher'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Garret <br>Fisher</span>
                    </a>
                </div>
                <div class="tab">
                    <a href="{{store url='athletes/sarah-loogman'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Sarah <br>Loogman</span>
                    </a>
                </div>
                <div class="tab active-tab">
                    <a href="{{store url='athletes/mat-fraser'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Mat <br>Fraser</span>
                    </a>
                </div>
                <div class="tab">
                    <a href="{{store url='athletes/sara-sigmundsdottir'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Sara <br>Sigmundsdottir</span>
                    </a>
                </div>
                <div class="tab">
                    <a href="{{store url='athletes/phil-heath'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Phil <br>Heath</span>
                    </a>
                </div>
                <div class="tab">
                    <a href="{{store url='athletes/lauren-fisher'}}">
                        <img src="http://placehold.it/87x87" alt="">
                        <span>Lauren <br>Fisher</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="content-section">
    <div class="cms-block-container cms-block-image-left cms-block-beige">
        <div class="contained clearfix">
            <div class="image left">
                <img class="lazyload" data-src="http://placehold.it/552x369" alt="">
            </div>
            <div class="copy">
                <div class="copy-inner">
                    <h3 class="copy-heading margin-bottom-0">Mat Fraser</h3>
                    <p class="copy-subheading with-divider all-caps font-weight-4">Crossfit Athlete</p>
                    <ul class="list-reset">
                        <li><span class="font-weight-3">Age: </span>26</li>
                        <li><span class="font-weight-3">Height: </span>5'7"</li>
                        <li><span class="font-weight-3">From: </span>Colchester, VT</li>
                        <li><span class="font-weight-3">Honors: </span>2017 Fittest Man on Earth</li>
                    </ul>
                    <div class="actions-toolbar left">
                        <p class="action-heading all-caps font-weight-4">Follow Mat Fraser</p>
                        <ul class="action-social-list clearfix list-reset">
                            <li class="float-left">
                                <a href="https://www.facebook.com/matfras" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>Facebook</title>
                                        <path d="M472.6 2H28.4C13.2 2 1 13.9 1 29.1v444.1C1 488.4 13.2 501 28.4 501H269V307h-65v-75h65v-55.5c0-64.5 39.4-99.6 96.9-99.6 27.6 0 52.1 2.1 58.1 3v67.4l-39.8 0c-31.3 0-37.2 14.9-37.2 36.7v48h74.8l-9.7 75H347v194h125.6c15.2 0 27.4-12.6 27.4-27.8V29.1C500 13.9 487.8 2 472.6 2z"></path>
                                    </svg>
                                </a>
                            </li>
                            <li class="float-left">
                                <a href="https://twitter.com/mathewfras" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>Twitter</title>
                                        <path d="M158.4 452.3c187.8 0 290.5-155.6 290.5-290.5 0-4.4-0.1-8.8-0.3-13.2 19.9-14.4 37.3-32.4 50.9-52.9 -18.3 8.1-38 13.6-58.6 16.1 21.1-12.6 37.3-32.6 44.9-56.5 -19.7 11.7-41.6 20.2-64.8 24.8 -18.6-19.8-45.2-32.3-74.5-32.3 -56.4 0-102.1 45.7-102.1 102.1 0 8 0.9 15.8 2.6 23.3 -84.9-4.3-160.1-44.9-210.5-106.7 -8.8 15.1-13.8 32.6-13.8 51.3 0 35.4 18 66.7 45.4 85 -16.7-0.5-32.5-5.1-46.3-12.8 0 0.4 0 0.9 0 1.3 0 49.5 35.2 90.7 81.9 100.1 -8.6 2.3-17.6 3.6-26.9 3.6 -6.6 0-13-0.7-19.2-1.8 13 40.6 50.7 70.1 95.4 70.9 -35 27.4-79 43.7-126.8 43.7 -8.2 0-16.4-0.5-24.4-1.4C47.1 435.3 100.8 452.3 158.4 452.3"></path>
                                    </svg>
                                </a>
                            </li>
                            <li class="float-left">
                                <a href="https://www.instagram.com/mathewfras" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>Instagram</title>
                                        <path d="M252.7 45.2c67 0 74.9 0.3 101.4 1.5 24.5 1.1 37.7 5.2 46.6 8.6 11.7 4.6 20.1 10 28.8 18.8 8.8 8.8 14.2 17.1 18.8 28.8 3.4 8.8 7.5 22.1 8.6 46.6 1.2 26.5 1.5 34.4 1.5 101.4s-0.3 74.9-1.5 101.4c-1.1 24.5-5.2 37.7-8.6 46.6 -4.6 11.7-10 20.1-18.8 28.8 -8.8 8.8-17.1 14.2-28.8 18.8 -8.8 3.4-22.1 7.5-46.6 8.6 -26.5 1.2-34.4 1.5-101.4 1.5s-74.9-0.3-101.4-1.5c-24.5-1.1-37.7-5.2-46.6-8.6 -11.7-4.6-20.1-10-28.8-18.8 -8.8-8.8-14.2-17.1-18.8-28.8 -3.4-8.8-7.5-22.1-8.6-46.6 -1.2-26.5-1.5-34.4-1.5-101.4s0.3-74.9 1.5-101.4c1.1-24.5 5.2-37.7 8.6-46.6 4.6-11.7 10-20.1 18.8-28.8 8.8-8.8 17.1-14.2 28.8-18.8 8.8-3.4 22.1-7.5 46.6-8.6C177.8 45.5 185.7 45.2 252.7 45.2M252.7 0C184.6 0 176 0.3 149.3 1.5 122.6 2.7 104.3 7 88.4 13.2c-16.5 6.4-30.5 15-44.4 28.9C30 56.1 21.4 70 15 86.5c-6.2 16-10.4 34.2-11.7 60.9 -1.2 26.8-1.5 35.3-1.5 103.4 0 68.1 0.3 76.7 1.5 103.4C4.6 381 8.8 399.3 15 415.2c6.4 16.5 15 30.5 28.9 44.4 13.9 13.9 27.9 22.5 44.4 28.9 16 6.2 34.2 10.4 60.9 11.7 26.8 1.2 35.3 1.5 103.4 1.5s76.7-0.3 103.4-1.5c26.7-1.2 44.9-5.5 60.9-11.7 16.5-6.4 30.5-15 44.4-28.9 13.9-13.9 22.5-27.9 28.9-44.4 6.2-16 10.4-34.2 11.7-60.9 1.2-26.8 1.5-35.3 1.5-103.4s-0.3-76.7-1.5-103.4c-1.2-26.7-5.5-44.9-11.7-60.9 -6.4-16.5-15-30.5-28.9-44.4 -13.9-13.9-27.9-22.5-44.4-28.9 -16-6.2-34.2-10.4-60.9-11.7C329.4 0.3 320.8 0 252.7 0L252.7 0z"></path>
                                        <path d="M252.7 122.1c-71.2 0-128.8 57.7-128.8 128.8s57.7 128.8 128.8 128.8S381.5 322 381.5 250.9 323.9 122.1 252.7 122.1zM252.7 334.5c-46.2 0-83.6-37.4-83.6-83.6s37.4-83.6 83.6-83.6 83.6 37.4 83.6 83.6S298.9 334.5 252.7 334.5z"></path>
                                        <circle cx="386.6" cy="117" r="30.1"></circle>
                                    </svg>
                                </a>
                            </li>
                            <!--
                            <li class="float-left">
                                <a href="https://www.youtube.com" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>YouTube</title>
                                        <path d="M494 150.2c0 0-4.9-34.4-19.8-49.5 -19-19.9-40.2-20-50-21.1 -69.8-5-174.6-5-174.6-5h-0.2c0 0-104.7 0-174.6 5 -9.8 1.2-31 1.3-50 21.1C9.9 115.9 5 150.2 5 150.2S0 190.6 0 231v37.9c0 40.4 5 80.8 5 80.8s4.9 34.4 19.8 49.5c19 19.9 43.9 19.2 55 21.3 39.9 3.8 169.6 5 169.6 5s104.8-0.2 174.7-5.2c9.8-1.2 31-1.3 50-21.1 15-15.1 19.8-49.5 19.8-49.5s5-40.4 5-80.8V231C499 190.6 494 150.2 494 150.2zM198 314.7l0-140.2 134.8 70.3L198 314.7z"></path>
                                    </svg>
                                </a>
                            </li>
                            -->
                            <!--
                            <li class="float-left">
                                <a href="https://www.pinterest.com" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>Pinterest</title>
                                        <path d="M248.9 1C111.5 1 0 112.4 0 249.9c0 105.5 65.6 195.5 158.2 231.8 -2.2-19.7-4.1-49.9 0.9-71.4 4.5-19.4 29.2-123.7 29.2-123.7s-7.4-14.9-7.4-37c0-34.6 20.1-60.5 45-60.5 21.2 0 31.5 15.9 31.5 35.1 0 21.4-13.6 53.3-20.6 82.9 -5.9 24.8 12.4 45 36.9 45 44.2 0 78.3-46.7 78.3-114 0-59.6-42.8-101.3-104-101.3 -70.8 0-112.4 53.1-112.4 108 0 21.4 8.2 44.3 18.5 56.8 2 2.5 2.3 4.6 1.7 7.1 -1.9 7.9-6.1 24.8-6.9 28.2 -1.1 4.6-3.6 5.5-8.3 3.3C109.4 325.9 90 280.4 90 243.9 90 165.4 147 93.3 254.4 93.3c86.4 0 153.5 61.5 153.5 143.8 0 85.8-54.1 154.8-129.2 154.8 -25.2 0-48.9-13.1-57.1-28.6 0 0-12.5 47.5-15.5 59.2 -5.6 21.6-20.8 48.7-30.9 65.3 23.3 7.2 48 11.1 73.7 11.1 137.5 0 248.9-111.5 248.9-248.9C497.9 112.4 386.4 1 248.9 1z"></path>
                                    </svg>
                                </a>
                            </li>
                            -->
                            <!--
                            <li class="float-left">
                                <a href="https://www.linkedin.com" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>LinkedIn</title>
                                        <path d="M463 0H37.3C17 0 0.5 16.1 0.5 36v427.4c0 19.9 16.5 36 36.8 36H463c20.4 0 37-16.2 37-36V36C500 16.1 483.4 0 463 0zM148.7 425.6H74.5V187.3h74.2V425.6zM111.6 154.7c-23.8 0-43-19.2-43-43 0-23.7 19.2-43 43-43 23.7 0 42.9 19.2 42.9 43C154.6 135.4 135.3 154.7 111.6 154.7zM426.2 425.6h-74.1V309.7c0-27.6-0.5-63.2-38.5-63.2 -38.5 0-44.4 30.1-44.4 61.2v117.9h-74V187.3h71v32.6h1c9.9-18.7 34.1-38.5 70.1-38.5 75 0 88.9 49.4 88.9 113.6V425.6z"></path>
                                    </svg>
                                </a>
                            </li>
                            -->
                            <!--
                            <li class="float-left">
                                <a href="#" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>RSS</title>
                                        <path d="M134.2 433.2c0 36.7-29.7 66.4-66.4 66.4 -36.7 0-66.4-29.7-66.4-66.4s29.7-66.4 66.4-66.4C104.5 366.8 134.2 396.6 134.2 433.2z"/>
                                        <path d="M1.5 265.8c62.2 0 120.7 24.3 164.7 68.5 44 44.2 68.3 103.1 68.3 165.8h95.9c0-182-147.5-330.1-328.8-330.1V265.8z"/>
                                        <path d="M1.7 95.9c221.7 0 402.1 181.4 402.1 404.3h95.9C499.7 224.4 276.3 0 1.7 0V95.9z"/>
                                    </svg>
                                </a>
                            </li>
                            -->
                            <!--
                            <li class="float-left">
                                <a href="#" target="_blank">
                                    <svg class="fill-gray" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" width="28">
                                        <title>Google Plus</title>
                                        <path d="M0.8 241.3C2.1 159.4 77.5 87.6 159.4 90.3c39.2-1.8 76.1 15.3 106.2 39.2 -12.8 14.6-26.1 28.6-40.3 41.8 -36.1-25-87.5-32.1-123.7-3.3 -51.7 35.8-54.1 120.2-4.3 158.7 48.4 43.9 139.8 22.1 153.1-45.1 -30.3-0.5-60.7 0-91-1 -0.1-18.1-0.2-36.1-0.1-54.2 50.6-0.2 101.3-0.2 152 0.2 3 42.5-2.6 87.8-28.7 122.9 -39.6 55.6-119 71.9-180.9 48.1C39.6 373.9-4.5 308.2 0.8 241.3z"/>
                                        <path d="M410.1 180.8c15 0 30.1 0 45.2 0 0.1 15.1 0.2 30.3 0.3 45.4 15.1 0.2 30.3 0.2 45.4 0.3 0 15 0 30.1 0 45.2 -15.1 0.2-30.2 0.2-45.4 0.4 -0.2 15.2-0.2 30.3-0.3 45.4 -15.1 0-30.1 0-45.2 0 -0.2-15.1-0.2-30.2-0.3-45.3 -15.1-0.2-30.3-0.3-45.4-0.5 0-15 0-30.1 0-45.2 15.1-0.2 30.2-0.2 45.4-0.3C409.8 211.1 410 195.9 410.1 180.8z"/>
                                    </svg>
                                </a>
                            </li>
                            -->
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

Mat Fraser

Crossfit Athlete

Age: 26
Height: 5'7"
From: Colchester, VT
Honors: 2017 Fittest Man on Earth

example-video-slider

show code

<section class="content-section">
    <div class="contained">
        <div class="cms-block-video-slider">
            <h3 class="video-thumbnail-slider-heading all-caps font-size-medium">Related Videos</h3>
            <div class="video-thumbnail-slider js-video-thumbnail-slider">
                <div class="video-thumbnail-slide">
                    <div class="video-thumbnail-placeholder-container">
                        <img class="video-thumbnail-placeholder" data-youtube-id="EjU63hpSaZQ" src="http://placehold.it/600x338" alt="">
                    </div>
                    <span class="video-thumbnail-counter">1/27</span>
                    <h4 class="video-thumbnail-heading font-weight-4">Compex Muscle Stim: Pad Placement for Trapezius</h4>
                    <p class="video-thumbnail-description">Trapezius Muscles Electrode Placement for Compex Muscle Stimulators</p>
                    <a class="video-thumbnail-cta" href="{{store url=''}}">Learn More</a>
                </div>
                <div class="video-thumbnail-slide">
                    <div class="video-thumbnail-placeholder-container">
                        <img class="video-thumbnail-placeholder" data-youtube-id="EjU63hpSaZQ" src="http://placehold.it/600x338" alt="">
                    </div>
                    <span class="video-thumbnail-counter">2/27</span>
                    <h4 class="video-thumbnail-heading font-weight-4">Compex Muscle Stim: Pad Placement for Hamstring Muscle</h4>
                    <p class="video-thumbnail-description">Hamstring Muscles Electrode Placement for Compex Muscle Stimulators</p>
                    <a class="video-thumbnail-cta" href="{{store url=''}}">Learn More</a>
                </div>
                <div class="video-thumbnail-slide">
                    <div class="video-thumbnail-placeholder-container">
                        <img class="video-thumbnail-placeholder" data-youtube-id="EjU63hpSaZQ" src="http://placehold.it/600x338" alt="">
                    </div>
                    <span class="video-thumbnail-counter">3/27</span>
                    <h4 class="video-thumbnail-heading font-weight-4">Compex Muscle Stim: Pad Placement for Calf Muscle</h4>
                    <p class="video-thumbnail-description">Calf Muscles Electrode Placement for Compex Muscle Stimulators</p>
                    <a class="video-thumbnail-cta" href="{{store url=''}}">Learn More</a>
                </div>
                <div class="video-thumbnail-slide">
                    <div class="video-thumbnail-placeholder-container">
                        <img class="video-thumbnail-placeholder" data-youtube-id="EjU63hpSaZQ" src="http://placehold.it/600x338" alt="">
                    </div>
                    <span class="video-thumbnail-counter">4/27</span>
                    <h4 class="video-thumbnail-heading font-weight-4">Compex Muscle Stim: Pad Placement for Quads</h4>
                    <p class="video-thumbnail-description">Quad Muscles Electrode Placement for Compex Muscle Stimulators</p>
                    <a class="video-thumbnail-cta" href="{{store url=''}}">Learn More</a>
                </div>
                <div class="video-thumbnail-slide">
                    <div class="video-thumbnail-placeholder-container">
                        <img class="video-thumbnail-placeholder" data-youtube-id="EjU63hpSaZQ" src="http://placehold.it/600x338" alt="">
                    </div>
                    <span class="video-thumbnail-counter">5/27</span>
                    <h4 class="video-thumbnail-heading font-weight-4">Compex Muscle Stim: Pad Placement for IT Band</h4>
                    <p class="video-thumbnail-description">IT Band Muscles Electrode Placement for Compex Muscle Stimulators</p>
                    <a class="video-thumbnail-cta" href="{{store url=''}}">Learn More</a>
                </div>
            </div>
        </div>
    </div>
</section>

example-schedule-table

show code

<section class="content-section">
    <div class="cms-block-schedule-table">
        <div class="contained">
            <table class="schedule-table mobile-width-30-70 text-center">
                <caption>Workout Schedule</caption>
                <colgroup>
                    <col class="col" span="1">
                    <col class="col" span="1">
                    <col class="col" span="1">
                    <col class="col" span="1">
                    <col class="col" span="1">
                </colgroup>
                <thead class="schedule-table-head">
                    <tr class="schedule-table-row js-schedule-table-head-slider">
                        <th class="schedule-table-header"></th>
                        <th class="schedule-table-header all-caps">Week 1</th>
                        <th class="schedule-table-header all-caps">Week 2</th>
                        <th class="schedule-table-header all-caps">Week 3</th>
                        <th class="schedule-table-header all-caps">Week 4</th>
                    </tr>
                </thead>
                <tbody class="schedule-table-body">
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Mon</div>
                            <div>Monday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Static Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Static Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Tues</div>
                            <div>Tuesday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Wed</div>
                            <div>Wednesday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Static Calves</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Thurs</div>
                            <div>Thursday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Fri</div>
                            <div>Friday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Static Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Static Quads</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Warm Up</li>
                                    <li>Dynamic Quads</li>
                                    <li>Dynamic Calves</li>
                                    <li>Static Hamstring</li>
                                    <li>Active Recovery</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Sat</div>
                            <div>Saturday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Abs</li>
                                    <li>Glutes</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header all-caps border-top-0 font-weight-2">
                            <div class="show-for-mobile">Sun</div>
                            <div>Sunday</div>
                        </th>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <p>Rest Day</p>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <p>Rest Day</p>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <p>Rest Day</p>
                            </div>
                        </td>
                        <td class="schedule-table-cell border-top-0">
                            <div>
                                <p>Rest Day</p>
                            </div>
                        </td>
                    </tr>
                    <tr class="schedule-table-row">
                        <th class="schedule-table-header schedule-table-cell-dark all-caps border-top-0 font-weight-2">
                            <div>Active Recovery</div>
                        </th>
                        <td class="schedule-table-cell schedule-table-cell-dark border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Upper Body</li>
                                    <li>Lower Body</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell schedule-table-cell-dark border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Upper Body</li>
                                    <li>Lower Body</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell schedule-table-cell-dark border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Upper Body</li>
                                    <li>Lower Body</li>
                                </ol>
                            </div>
                        </td>
                        <td class="schedule-table-cell schedule-table-cell-dark border-top-0">
                            <div>
                                <ol class="list-reset">
                                    <li>Upper Body</li>
                                    <li>Lower Body</li>
                                </ol>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</section>

Workout Schedule
	Week 1	Week 2	Week 3	Week 4
Mon Monday	Warm Up Static Quads Static Calves Static Hamstring Active Recovery	Warm Up Static Quads Static Calves Static Hamstring Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery
Tues Tuesday	Abs Glutes	Abs Glutes	Abs Glutes	Abs Glutes
Wed Wednesday	Warm Up Static Quads Active Recovery	Warm Up Static Quads Static Calves Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery
Thurs Thursday	Abs Glutes	Abs Glutes	Abs Glutes	Abs Glutes
Fri Friday	Warm Up Static Quads Static Calves Static Hamstring Active Recovery	Warm Up Static Quads Static Hamstring Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery	Warm Up Dynamic Quads Dynamic Calves Static Hamstring Active Recovery
Sat Saturday	Abs Glutes	Abs Glutes	Abs Glutes	Abs Glutes
Sun Sunday	Rest Day	Rest Day	Rest Day	Rest Day
Active Recovery	Upper Body Lower Body	Upper Body Lower Body	Upper Body Lower Body	Upper Body Lower Body

example-tiled-module

show code

<section class="content-section">
    <div class="cms-block-tiled-module js-tiled-module lazyload" data-bg="{{view url='images/section-backgrounds/triangle-texture-fade-bg.jpg'}}" data-mage-init='{"tiledModule":{}}'>
        <div class="contained">
            <div class="tiled-module-left">
                <div class="tiled-module-left-top">
                    <div class="tile js-tile">
                        <div class="overlay-tile">
                            <a class="overlay-tile-anchor text-color-white" href="{{store url=''}}">
                                <div class="overlay-tile-inner">
                                    <div class="overlay-tile-image-container">
                                        <img class="overlay-tile-image" src="{{view url='images/tiles/mat-fraser.jpg'}}" alt="">
                                    </div>
                                    <div class="overlay-tile-text-container">
                                        <span class="overlay-tile-title all-caps font-family-secondary font-style-italic font-weight-3">Mat Fraser</span>
                                        <span class="overlay-tile-description">Fittest Man on Earth</span>
                                    </div>
                                    <div class="overlay-tile-cta-container">
                                        <span class="overlay-tile-cta all-caps font-weight-3">Meet Mat Fraser</span>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="tiled-module-left-top-stacked">
                        <div class="tile js-tile">
                            <div class="animated-tile display-none display-sm-block">
                                <video class="js-animated-tile-video" src="{{view url='images/tiles/electrodes.mp4'}}" poster="{{view url='images/tiles/electrodes.jpg'}}" width="239" height="239" loop></video>
                            </div>
                        </div>
                        <div class="tile js-tile">
                            <div class="image-tile">
                                <img src="{{view url='images/tiles/weightlifter.jpg'}}" alt="A woman wearing Compex electrodes while lifting weights">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tiled-module-left-bottom">
                    <div class="tile js-tile">
                        <div class="animated-tile display-none display-sm-block">
                            <video class="js-animated-tile-video" src="{{view url='images/tiles/electrodes-2.mp4'}}" poster="{{view url='images/tiles/electrodes-2.jpg'}}" width="239" height="239" loop></video>
                        </div>
                    </div>
                    <div class="tile js-tile">
                        <div class="overlay-tile overlay-tile-has-video js-overlay-tile-video text-color-white">
                            <div class="overlay-tile-inner">
                                <div class="overlay-tile-image-container">
                                    <img class="overlay-tile-image js-overlay-tile-video-placeholder" src="{{view url='images/tiles/video-placeholder.jpg'}}" data-youtube-id="6Pkeue0_9ec" alt="">
                                </div>
                                <div class="overlay-tile-text-container">
                                    <span class="overlay-tile-title all-caps font-family-secondary font-style-italic font-weight-3">Video Title</span>
                                </div>
                                <div class="overlay-tile-cta-container">
                                    <span class="overlay-tile-cta all-caps font-weight-3">Play Video</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tiled-module-right">
                <div class="tile js-tile">
                    <div class="overlay-tile">
                        <a class="overlay-tile-anchor text-color-white" href="{{store url=''}}">
                            <div class="overlay-tile-inner">
                                <div class="overlay-tile-image-container">
                                    <img class="overlay-tile-image" src="{{view url='images/tiles/product.jpg'}}" alt="">
                                </div>
                                <div class="overlay-tile-text-container">
                                    <span class="overlay-tile-title all-caps font-family-secondary font-style-italic font-weight-3">Featured Something</span>
                                </div>
                                <div class="overlay-tile-cta-container">
                                    <span class="overlay-tile-cta all-caps font-weight-3">Shop Now</span>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="tile js-tile">
                    <div class="overlay-tile">
                        <a class="overlay-tile-anchor text-color-white" href="{{store url=''}}">
                            <div class="overlay-tile-inner">
                                <div class="overlay-tile-image-container">
                                    <img class="overlay-tile-image" src="{{view url='images/tiles/electrodes-on-shoulder.jpg'}}" alt="">
                                </div>
                                <div class="overlay-tile-text-container">
                                    <span class="overlay-tile-title all-caps font-family-secondary font-style-italic font-weight-3">Fight Muscle Fatigue</span>
                                    <span class="overlay-tile-description">With the latest Compex lineup</span>
                                </div>
                                <div class="overlay-tile-cta-container">
                                    <span class="overlay-tile-cta all-caps font-weight-3">Read More</span>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

Mat Fraser Fittest Man on Earth

Meet Mat Fraser

A woman wearing Compex electrodes while lifting weights

Video Title

Play Video

Featured Something

Shop Now

Fight Muscle Fatigue With the latest Compex lineup

example-read-more

show code

<section class="content-section">
    <div class="contained">
    <p class="read-more" data-text-more="Read More" data-text-less="Read Less" data-text-limit="50" data-text-ellipses="...">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce suscipit lectus at felis dignissim, et eleifend arcu varius. Aenean fringilla ullamcorper mi, et condimentum turpis gravida quis. Nunc interdum tristique orci a lobortis. Phasellus ornare convallis vulputate. Nunc tempus nisi neque, eget sodales mauris aliquet a. Etiam ut porta purus, non vestibulum erat. Nunc interdum condimentum quam.
    </p>
    <br><br><br><br><br>
    <div class="read-more-block">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce suscipit lectus at felis dignissim, et eleifend arcu varius.</p>
        <p>
            <a href="#" class="read-more-block-link" data-text-less="Read Less &#9650;">Read More &#9660;</a>
        </p>
        <div class="read-more-block-content">
            <p>Aenean fringilla ullamcorper mi, et condimentum turpis gravida quis. Nunc interdum tristique orci a lobortis. Phasellus ornare convallis vulputate. Nunc tempus nisi neque, eget sodales mauris aliquet a. Etiam ut porta purus, non vestibulum erat. Nunc interdum condimentum quam.</p>
        </div>
    </div>
    </div>
</section>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce suscipit lectus at felis dignissim, et eleifend arcu varius. Aenean fringilla ullamcorper mi, et condimentum turpis gravida quis. Nunc interdum tristique orci a lobortis. Phasellus ornare convallis vulputate. Nunc tempus nisi neque, eget sodales mauris aliquet a. Etiam ut porta purus, non vestibulum erat. Nunc interdum condimentum quam.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce suscipit lectus at felis dignissim, et eleifend arcu varius.

Free Ground Shipping

example-hero-homestyle-with-video

The Best Tool for Your Peak Performance

example-block-left-aligned-paragraph

example-block-centered-with-heading-and-subheading

Benefits of Muscle Stimulation

Get stronger, faster, without working harder.

example-block-centered-with-heading-and-button

Value Statement Goes Here

example-icon-strip

example-image-with-overlay

example-image-with-overlay-cta

Mat Fraser

example-image-with-overlay-cta-grid

Mat Fraser

Sara Sigmundsdottir

Phil Heath

Lauren Fisher

Brooke Wells

Garret Fisher

Sarah Loogman

example-image-with-overlay-slider

example-image-with-overlay-stack

example-image-with-overlay-grid

example-informational

Increase Explosive Strength

Increase Explosive Strength

example-informational-slider

Pain Management

Increase Explosive Strength

Reduce Muscle & Joint Damage

Lorem Ipsum

example-select-dropdown-navigation

example-select-slider

Mat Fraser

example-video-slider

Related Videos

Compex Muscle Stim: Pad Placement for Trapezius

Compex Muscle Stim: Pad Placement for Hamstring Muscle

Compex Muscle Stim: Pad Placement for Calf Muscle

Compex Muscle Stim: Pad Placement for Quads

Compex Muscle Stim: Pad Placement for IT Band

example-schedule-table

example-tiled-module

example-read-more

Increase Explosive
Strength

Increase Explosive
Strength

Increase Explosive
Strength

Reduce Muscle &
Joint Damage