<div class="page-wrapper efl-article-page">
    <section class="efl-hero-banner session" data-behavior="efl-hero-banner">
        <div class="efl-hero-banner__wrapper">
            <picture>
                <source media="(max-width: 819px)" srcset="/assets/example-content/hero-banner-2.jpg">
                <source media="(min-width: 820px)" srcset="/assets/example-content/hero-banner-1.jpg">
                <img src="/assets/example-content/hero-banner-1.jpg" alt="">
            </picture>
            <div class="efl-hero-banner__overlay">
                <div class="efl-hero-banner__overlay--wrapper">
                    <div class="category-tag">SESSIONS</div>
                    <h1><span class="jumpTohide">Receiving under pressure</span></h1>
                    <div class="efl-hero-banner-copy">
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer efficitur velit non mi tincidunt, sit amet blandit ante commodo.
                    </div>
                    <div class="efl-hero-banner-cta">
                        <a href="/" class="cta cta--primary  " tabindex="0">Primary CTA</a>

                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="efl-page-content">
        <div class="efl-page-content__tray">
            <!--  two column block  -->
            <div class="efl-column-layout efl-column-layout--two">
                <div class="efl-column-layout__col">
                    <!--  left column content  -->
                    <div class="efl-article-info">
                        <div class="article-header">
                            <div class="article-header__category" data-category="Get Started">Interview</div>
                            <h1><span class="jumpTohide">Gareth Southgate: I want the players to play with freedom</span></h1>
                            <p>Gareth Southgate tells Peter Glynn that he wants young english players to have the freedom to express themselves</p>
                        </div>
                        <div class="tag-cloud--container">
                            <div class="tag-cloud">
                                <div class="tag-cloud__item">
                                    <span>Article</span>
                                </div>
                                <div class="tag-cloud__item">
                                    <span>All ages</span>
                                </div>
                                <div class="tag-cloud__item">
                                    <span>Guide</span>
                                </div>
                                <div class="tag-cloud__item">
                                    <span>Physical</span>
                                </div>
                                <div class="tag-cloud__item">
                                    <span>Psychological</span>
                                </div>
                                <div class="tag-cloud__item">
                                    <span>Social</span>
                                </div>
                            </div>
                        </div>
                        <div class="article-author article-author--crest">
                            <div class="article-author__inner">
                                <h4>William Dalton</h4>
                                <p>10 min read - 10 Mar 2020</p>
                            </div>
                        </div>
                        <div class="efl-learner-profile-in-page-bookmark" data-behavior="in-page-bookmark" data-user-fan-id="123456" data-bookmark-page-id="" data-bookmark-category="Article">
                            <div class="efl-learner-profile-in-page-bookmark__wrapper">
                                <a class="efl-learner-profile-in-page-bookmark__download" href="/" tabindex="0" aria-label="download"></a>
                                <button class="efl-learner-profile-in-page-bookmark__link logged-in" aria-label="bookmark this page"><span>Bookmark</span></button>
                                <button class="efl-learner-profile-in-page-bookmark__share-button" aria-label="share this page"></button>
                                <div class="efl-learner-profile-in-page-bookmark__list hidden">
                                    <p class="title" data-bookmark-title-add="Add to list" data-bookmark-title-remove="Remove bookmark from">Add to list</p>
                                    <a class="bookmark-remove-all hidden" tabindex="0">Remove from all</a>
                                    <div class="bookmark-list">
                                        <div aria-checked="true" class="bookmark-list--item">
                                            <input type="checkbox" id="checkbox--my-bookmark-list" value="My Bookmark list" class="">
                                            <label for="checkbox--my-bookmark-list">My Bookmark list</label>
                                        </div>
                                        <div aria-checked="false" class="bookmark-list--item">
                                            <input type="checkbox" id="checkbox--attacking-list" value="Attacking list" class="">
                                            <label for="checkbox---attacking-list">Attacking list</label>
                                        </div>
                                        <div aria-checked="false" class="bookmark-list--item">
                                            <input type="checkbox" id="checkbox--defending-list" value="Defending list" class="">
                                            <label for="checkbox---defending-list">Defending list</label>
                                        </div>
                                        <div aria-checked="false" class="bookmark-list--item">
                                            <input type="checkbox" id="checkbox--defending-list" value="coaching" class="">
                                            <label for="checkbox---coaching">Coaching</label>
                                        </div>
                                    </div>
                                    <a class="bookmark-create-list" tabindex="0">Create a new bookmark list</a>
                                    <a class="bookmark-done">Done</a>
                                    <a href="#" class="cta cta--primary  view-all-bookmarks" tabindex="0">View all bookmarks</a>

                                </div>
                                <div class="efl-learner-profile-in-page-bookmark__share--popup hidden jump-to-hide">
                                    <div class="efl-learner-profile__social-links__list">
                                        <div>
                                            <div class="copy" data-copied-text="Link Copied!" data-copy-url="http://www.google.co.uk/" role="button" aria-label="Copy link" tabindex="0">
                                                <img src=/assets/example-content/learner-profile/copy.svg>
                                            </div>
                                            <p>Copy link</p>
                                        </div>
                                        <div>
                                            <a href="#" aria-label="Facebook">
                                                <img src=/assets/example-content/learner-profile/facebook.svg>
                                            </a>
                                            <p>Facebook</p>
                                        </div>
                                        <div>
                                            <a href="#" aria-label="Twitter">
                                                <img src=/assets/example-content/learner-profile/twitter.svg>
                                            </a>
                                            <p>Twitter</p>
                                        </div>
                                        <div>
                                            <a href="#" aria-label="Linkedin">
                                                <img src=/assets/example-content/learner-profile/linkedin.svg>
                                            </a>
                                            <p>Linkedin</p>
                                        </div>
                                        <div>
                                            <a href="#" aria-label="Whatsapp">
                                                <img src=/assets/example-content/learner-profile/whatsapp.svg>
                                            </a>
                                            <p>Whatsapp</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="efl-learner-profile-in-page-bookmark__signin-popup hidden">
                                <h3><span class="jumpTohide">SIGN IN</span></h3>
                                <div class="popup-copy">
                                    In order to bookmark this article, please Sign In or Create an EFL Account.
                                </div>
                                <a href="#" class="cta cta--primary  in-page-bookmark-login" tabindex="0">Login</a>

                                <a href="#" class="cta cta--primary  in-page-bookmark-signup" tabindex="0">Sign up</a>

                            </div>
                            <div class="efl-learner-profile__section efl-learner-profile-bookmark__popup hidden">
                                <div class="steps step1">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="create-bookmark-list" data-create-heading="Create list" data-edit-heading="Rename list">Create list</h4>
                                    </div>
                                    <div class="efl-learner-profile-bookmark__popup--copy" data-create-text="Give your list a name, then select 'create'." data-update-text="Give your list a name, then select 'save'.">
                                        Give your list a name, then select 'create'.
                                    </div>
                                    <div class="efl-learner-profile-bookmark__popup--form">
                                        <label>List name</label>
                                        <input type="text" placeholder="Prompt text" maxlength="100" class="bookmark-list-name" aria-label="list name" />
                                        <p><span class="bookmark-list-name-count">0</span>/100</p>
                                        <div class="bookmark-desc-wrapper hidden">
                                            <label>List description</label>
                                            <textarea placeholder="Prompt text" maxlength="500" class="bookmark-list-desc" aria-label="list description"></textarea>
                                            <p><span class="bookmark-list-desc-count">0</span>/500</p>
                                        </div>
                                        <div class="bookmark-add-desc" role="button" tabindex="0" data-add-text="Optional - add list description" data-cancel-text="Cancel adding list description" aria-label="Optional - add list description">Optional - add list description</div>
                                        <button class="cta cta--primary create-new-bookmark" aria-label="create new bookmark">
                                            <span>create</span>
                                            <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                                <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                                <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                                <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                            </svg>
                                        </button>
                                        <button class="cta cta--primary edit-bookmark-list hidden" aria-label="save bookmark list">
                                            <span>save</span>
                                            <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                                <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                                <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                                <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                </rect>
                                            </svg>
                                        </button>
                                        <button class="cta cta--primary cancel-create-bookmark" aria-label="cancel create bookmark">cancel</button>
                                        <input type="hidden" class="bookmark-list-article-link" value="/articles">
                                        <input type="hidden" class="bookmark-list-session-link" value="/sessions">
                                    </div>
                                </div>
                                <div class="steps step2 hidden">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="exist">List already exists</h4>
                                    </div>
                                    <div class="efl-learner-profile__section--nocourse-copy">
                                        The name you've chosen for this list already exists.
                                    </div>
                                    <button class="cta cta--primary  edit-bookmark-name" aria-label="edit name bookmark">Edit name</button>
                                </div>
                                <div class="steps step3 hidden">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="exist">Delete list</h4>
                                    </div>
                                    <div class="efl-learner-profile__section--nocourse-copy no-border">
                                        Are you sure you want to delete this list?
                                    </div>
                                    <button class="cta cta--primary  delete-bookmark-list" aria-label="yes, delete this list">
                                        <span>Yes, delete this list</span>
                                        <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                            <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                            </rect>
                                            <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                            </rect>
                                            <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                            </rect>
                                        </svg>
                                    </button>
                                    <button class="cta cta--primary  cancel-bookmark-delete" aria-label="no, return to list">no, return to list</button>
                                </div>
                                <div class="steps step4 hidden">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="exist">Remove Bookmark</h4>
                                    </div>
                                    <div class="efl-learner-profile__section--nocourse-copy no-border">
                                        Are you sure you want to remove this bookmark?
                                    </div>
                                    <button class="cta cta--primary  remove-bookmark-item" aria-label="yes, remove bookmark item">Yes, remove this bookmark</button>
                                    <button class="cta cta--primary  cancel-remove-bookmark" aria-label="no, return to list">No, return to list</button>
                                </div>
                                <div class="steps step5 hidden">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="exist">Innapropriate content</h4>
                                    </div>
                                    <div class="efl-learner-profile__section--nocourse-copy">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    </div>
                                    <button class="cta cta--primary  error-bookmark-name" aria-label="edit name error bookmark">Edit name</button>
                                </div>
                                <div class="steps step6 hidden">
                                    <div class="efl-learner-profile__section--header">
                                        <h4 class="exist">Error</h4>
                                    </div>
                                    <div class="efl-learner-profile__section--nocourse-copy">
                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    </div>
                                    <button class="cta cta--primary  server-error-bookmark" aria-label="try again bookmark">Try again</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="efl-column-layout__col">
                    <!--  right column content  -->
                    <div class="jump-to-section--container">
                        <section class="jump-to-section" data-behaviour="jump-to-section" aria-expanded="false" aria-controls="jump-to-section-minimize">
                            <div class="jump-to-section--header" tabindex="0" role="button" aria-label="On this page">
                                <h6 class="efl-heading-5">On this page</h6>
                                <div type="button" id="jump-to-section-minimize" class="jump-to-section-minimize" href="#" tabindex="-1">
                                    <canvas id="jump-to-section-collapse-animation" width="25" height="48"></canvas>
                                </div>
                            </div>
                            <div class="jump-to-section__inner" data-share-collapse="false" data-bookmark-collapse="false">
                                <div class="jump-to-section__content">
                                    <ul class="jump-to-section__links"></ul>
                                </div>
                                <div class="jump-to-section__actions">
                                    <div class="jump-to-section__actions-group">
                                        <div class="efl-learner-profile-in-page-bookmark" data-behavior="in-page-bookmark" data-user-fan-id="123456" data-bookmark-page-id="" data-bookmark-category="Article">
                                            <div class="efl-learner-profile-in-page-bookmark__wrapper">
                                                <a class="efl-learner-profile-in-page-bookmark__download" href="/" tabindex="0" aria-label="download"></a>
                                                <button class="efl-learner-profile-in-page-bookmark__link logged-in" aria-label="bookmark this page"><span>Bookmark</span></button>
                                                <button class="efl-learner-profile-in-page-bookmark__share-button" aria-label="share this page"></button>
                                                <div class="efl-learner-profile-in-page-bookmark__list hidden">
                                                    <p class="title" data-bookmark-title-add="Add to list" data-bookmark-title-remove="Remove bookmark from">Add to list</p>
                                                    <a class="bookmark-remove-all hidden" tabindex="0">Remove from all</a>
                                                    <div class="bookmark-list">
                                                        <div aria-checked="true" class="bookmark-list--item">
                                                            <input type="checkbox" id="checkbox--my-bookmark-list" value="My Bookmark list" class="">
                                                            <label for="checkbox--my-bookmark-list">My Bookmark list</label>
                                                        </div>
                                                        <div aria-checked="false" class="bookmark-list--item">
                                                            <input type="checkbox" id="checkbox--attacking-list" value="Attacking list" class="">
                                                            <label for="checkbox---attacking-list">Attacking list</label>
                                                        </div>
                                                        <div aria-checked="false" class="bookmark-list--item">
                                                            <input type="checkbox" id="checkbox--defending-list" value="Defending list" class="">
                                                            <label for="checkbox---defending-list">Defending list</label>
                                                        </div>
                                                        <div aria-checked="false" class="bookmark-list--item">
                                                            <input type="checkbox" id="checkbox--defending-list" value="coaching" class="">
                                                            <label for="checkbox---coaching">Coaching</label>
                                                        </div>
                                                    </div>
                                                    <a class="bookmark-create-list" tabindex="0">Create a new bookmark list</a>
                                                    <a class="bookmark-done">Done</a>
                                                    <a href="#" class="cta cta--primary  view-all-bookmarks" tabindex="0">View all bookmarks</a>

                                                </div>
                                                <div class="efl-learner-profile-in-page-bookmark__share--popup hidden jump-to-hide">
                                                    <div class="efl-learner-profile__social-links__list">
                                                        <div>
                                                            <div class="copy" data-copied-text="Link Copied!" data-copy-url="http://www.google.co.uk/" role="button" aria-label="Copy link" tabindex="0">
                                                                <img src=/assets/example-content/learner-profile/copy.svg>
                                                            </div>
                                                            <p>Copy link</p>
                                                        </div>
                                                        <div>
                                                            <a href="#" aria-label="Facebook">
                                                                <img src=/assets/example-content/learner-profile/facebook.svg>
                                                            </a>
                                                            <p>Facebook</p>
                                                        </div>
                                                        <div>
                                                            <a href="#" aria-label="Twitter">
                                                                <img src=/assets/example-content/learner-profile/twitter.svg>
                                                            </a>
                                                            <p>Twitter</p>
                                                        </div>
                                                        <div>
                                                            <a href="#" aria-label="Linkedin">
                                                                <img src=/assets/example-content/learner-profile/linkedin.svg>
                                                            </a>
                                                            <p>Linkedin</p>
                                                        </div>
                                                        <div>
                                                            <a href="#" aria-label="Whatsapp">
                                                                <img src=/assets/example-content/learner-profile/whatsapp.svg>
                                                            </a>
                                                            <p>Whatsapp</p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="efl-learner-profile-in-page-bookmark__signin-popup hidden">
                                                <h3><span class="jumpTohide">SIGN IN</span></h3>
                                                <div class="popup-copy">
                                                    In order to bookmark this article, please Sign In or Create an EFL Account.
                                                </div>
                                                <a href="#" class="cta cta--primary  in-page-bookmark-login" tabindex="0">Login</a>

                                                <a href="#" class="cta cta--primary  in-page-bookmark-signup" tabindex="0">Sign up</a>

                                            </div>
                                            <div class="efl-learner-profile__section efl-learner-profile-bookmark__popup hidden">
                                                <div class="steps step1">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="create-bookmark-list" data-create-heading="Create list" data-edit-heading="Rename list">Create list</h4>
                                                    </div>
                                                    <div class="efl-learner-profile-bookmark__popup--copy" data-create-text="Give your list a name, then select 'create'." data-update-text="Give your list a name, then select 'save'.">
                                                        Give your list a name, then select 'create'.
                                                    </div>
                                                    <div class="efl-learner-profile-bookmark__popup--form">
                                                        <label>List name</label>
                                                        <input type="text" placeholder="Prompt text" maxlength="100" class="bookmark-list-name" aria-label="list name" />
                                                        <p><span class="bookmark-list-name-count">0</span>/100</p>
                                                        <div class="bookmark-desc-wrapper hidden">
                                                            <label>List description</label>
                                                            <textarea placeholder="Prompt text" maxlength="500" class="bookmark-list-desc" aria-label="list description"></textarea>
                                                            <p><span class="bookmark-list-desc-count">0</span>/500</p>
                                                        </div>
                                                        <div class="bookmark-add-desc" role="button" tabindex="0" data-add-text="Optional - add list description" data-cancel-text="Cancel adding list description" aria-label="Optional - add list description">Optional - add list description</div>
                                                        <button class="cta cta--primary create-new-bookmark" aria-label="create new bookmark">
                                                            <span>create</span>
                                                            <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                                                <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                                <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                                <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                            </svg>
                                                        </button>
                                                        <button class="cta cta--primary edit-bookmark-list hidden" aria-label="save bookmark list">
                                                            <span>save</span>
                                                            <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                                                <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                                <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                                <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                    <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                    <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                </rect>
                                                            </svg>
                                                        </button>
                                                        <button class="cta cta--primary cancel-create-bookmark" aria-label="cancel create bookmark">cancel</button>
                                                        <input type="hidden" class="bookmark-list-article-link" value="/articles">
                                                        <input type="hidden" class="bookmark-list-session-link" value="/sessions">
                                                    </div>
                                                </div>
                                                <div class="steps step2 hidden">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="exist">List already exists</h4>
                                                    </div>
                                                    <div class="efl-learner-profile__section--nocourse-copy">
                                                        The name you've chosen for this list already exists.
                                                    </div>
                                                    <button class="cta cta--primary  edit-bookmark-name" aria-label="edit name bookmark">Edit name</button>
                                                </div>
                                                <div class="steps step3 hidden">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="exist">Delete list</h4>
                                                    </div>
                                                    <div class="efl-learner-profile__section--nocourse-copy no-border">
                                                        Are you sure you want to delete this list?
                                                    </div>
                                                    <button class="cta cta--primary  delete-bookmark-list" aria-label="yes, delete this list">
                                                        <span>Yes, delete this list</span>
                                                        <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="20px" viewBox="0 0 24 30" style="enable-background:new 0 0 50 50;" xml:space="preserve">
                                                            <rect x="0" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0s" dur="0.6s" repeatCount="indefinite"></animate>
                                                            </rect>
                                                            <rect x="8" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.15s" dur="0.6s" repeatCount="indefinite"></animate>
                                                            </rect>
                                                            <rect x="16" y="10" width="4" height="10" fill="#fff" opacity="0.2">
                                                                <animate attributeName="opacity" attributeType="XML" values="0.2; 1; .2" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="height" attributeType="XML" values="10; 20; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                                <animate attributeName="y" attributeType="XML" values="10; 5; 10" begin="0.3s" dur="0.6s" repeatCount="indefinite"></animate>
                                                            </rect>
                                                        </svg>
                                                    </button>
                                                    <button class="cta cta--primary  cancel-bookmark-delete" aria-label="no, return to list">no, return to list</button>
                                                </div>
                                                <div class="steps step4 hidden">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="exist">Remove Bookmark</h4>
                                                    </div>
                                                    <div class="efl-learner-profile__section--nocourse-copy no-border">
                                                        Are you sure you want to remove this bookmark?
                                                    </div>
                                                    <button class="cta cta--primary  remove-bookmark-item" aria-label="yes, remove bookmark item">Yes, remove this bookmark</button>
                                                    <button class="cta cta--primary  cancel-remove-bookmark" aria-label="no, return to list">No, return to list</button>
                                                </div>
                                                <div class="steps step5 hidden">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="exist">Innapropriate content</h4>
                                                    </div>
                                                    <div class="efl-learner-profile__section--nocourse-copy">
                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                                    </div>
                                                    <button class="cta cta--primary  error-bookmark-name" aria-label="edit name error bookmark">Edit name</button>
                                                </div>
                                                <div class="steps step6 hidden">
                                                    <div class="efl-learner-profile__section--header">
                                                        <h4 class="exist">Error</h4>
                                                    </div>
                                                    <div class="efl-learner-profile__section--nocourse-copy">
                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                                    </div>
                                                    <button class="cta cta--primary  server-error-bookmark" aria-label="try again bookmark">Try again</button>
                                                </div>
                                            </div>
                                        </div>
                                        <hr>
                                        <button class="jump-to-section-share-button" id="jump-to-section-share-button" aria-label="Share this page">Share</button>
                                    </div>
                                    <div class="jump-to-section__social-links">
                                        <button class="efl-profile-left-popup__back" aria-label="go back to share"></button>
                                        <div class="efl-learner-profile__social-links__list">
                                            <div>
                                                <div class="copy" data-copy-url="http://www.google.co.uk/" role="button" aria-label="Copy link" tabindex="0">
                                                    <img src=/assets/example-content/learner-profile/copy.svg>
                                                </div>
                                            </div>
                                            <div>
                                                <a href="#" aria-label="Facebook">
                                                    <img src=/assets/example-content/learner-profile/facebook.svg>
                                                </a>
                                            </div>
                                            <div>
                                                <a href="#" aria-label="Twitter">
                                                    <img src=/assets/example-content/learner-profile/twitter.svg>
                                                </a>
                                            </div>
                                            <div>
                                                <a class="linkedin" href="#" aria-label="Linkedin">
                                                    <img src=/assets/example-content/learner-profile/linkedin.svg>
                                                </a>
                                            </div>
                                            <div>
                                                <a href="#" aria-label="Whatsapp">
                                                    <img src=/assets/example-content/learner-profile/whatsapp.svg>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </section>
                        <div class="efl-survey" data-behavior="efl-survey" data-survey-page-id="0adce9dc54d9477c9b4dec27d2cb92a3" data-fanid="1112">
                            <div class="efl-survey__header">
                                <canvas id="efl-survey__header--icon" width="48" height="48"></canvas>
                                <button class="efl-survey__close" aria-label="close efl survey"></button>
                            </div>
                            <div class="efl-survey__questions">
                                <div class="efl-survey__questions--steps step1" data-question-id="5f85f9e1837e411b958e2bddb39c2d6a">
                                    <div class="steps-no">1/2</div>
                                    <h4>Is this session plan useful?</h4>
                                    <a class="cta cta--primary survey-useful-yes" data-answer-id="44fb0a97693d47d38451c5a6e9c48b1e">Yes</a>
                                    <a class="cta cta--primary survey-useful-no" data-answer-id="686ebe8efb0c45899f38b81fc3c4c060">No</a>
                                </div>
                                <div class="efl-survey__questions--steps step2 hidden" data-question-id="8a861add140447789f420198d5b5b231">
                                    <div class="steps-no">2/2</div>
                                    <h4>Have you / will you use this in practise?</h4>
                                    <a class="cta cta--primary survey-practise-yes" data-answer-id="b50384d2a5e544d4beb632298199a572">Yes</a>
                                    <a class="cta cta--primary survey-practise-no" data-answer-id="f26b0939d09e4e369357888710e2202f">No</a>
                                </div>
                                <div class="efl-survey__questions--steps step3 hidden" data-question-id="c8c250f4df23408695deb10a2cce5345">
                                    <h4>Thanks! Your feedback help us to improve our content!</h4>
                                </div>
                                <div class="efl-survey__questions--steps step4 hidden" data-question-id="9cdf4b8f4882465cb85462f83c0dba0e">
                                    <div class="steps-no">2/2</div>
                                    <h4>Why not?</h4>
                                    <a class="cta cta--primary survey-not-needed" data-answer-id="03aa8fb7d8274e5faf07c020a469de53">Not needed at the moment</a>
                                    <a class="cta cta--primary survey-complicated" data-answer-id="e31a4944ae1d45698b1556c8128c4c4f">To complicated</a>
                                    <a class="cta cta--primary survey-not-useful" data-answer-id="d8dbbbcd88474b1b809728f889f3a373">Dont find it useful</a>
                                    <a class="cta cta--primary survey-other-reason" data-answer-id="11929ea39f1e4763af2934eeb1be5d35">Other reason</a>
                                </div>
                                <div class="efl-survey__questions--steps step5 hidden">
                                    <h4>Would you like to tell us more?</h4>
                                    <textarea maxlength="500" placeholder="Leave your feedback here..."></textarea>
                                    <div class="survey-reason-note">
                                        <p><span class="character-count">0</span>/500 characters</p>
                                        <a class="clear-text" href="#">Clear Text</a>
                                    </div>
                                    <a class="cta cta--primary survey-submit-reason">SUBMIT</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="efl-page-content__dynamic-placeholder">
        <!-- below placeholders are dynamic we need to update based on component-->
        <!--  full width column block  -->
        <div class="efl-column-layout efl-column-layout--one full-width">
            <section class="session-setup">
                <div class="session-setup__inner">
                    <h2>Session setup</h2>
                    <p class="session-setup__subtitle">To set up this session make sure to have these tools and rules in places for your players</p>
                </div>
                <div class="session-setup__grid">
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=1 Ball loading="lazy">
                        <p>1 Ball</p>
                    </div>
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=1 Ball loading="lazy">
                        <p>1 Ball</p>
                    </div>
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=4 Cones loading="lazy">
                        <p>4 Cones</p>
                    </div>
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=15 Mins loading="lazy">
                        <p>15 Mins</p>
                    </div>
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=Half Pitch loading="lazy">
                        <p>Half Pitch</p>
                    </div>
                    <div class="session-setup__grid__item">
                        <img class="session-setup__icon" src=/assets/example-content/cog-icon.svg alt=15 Mins loading="lazy">
                        <p>15 Mins</p>
                    </div>
                </div>
            </section>
            <section class="running-the-session">
                <div class="running-the-session__inner">
                    <h3>Running the Session</h3>
                    <p>Put this session into practice by following our <strong class="darkblue-text">4</strong> setup guidelines.</p>
                </div>
                <div class="running-the-session__section warm-up_section">
                    <p class="running-the-session__subheading running-the-session__warm-up">Warm Up</p>
                </div>

                <article class="running-the-session__section">
                    <!-- Mobile Version (Step) -->
                    <div class="running-the-session__step">
                        <p class="running-the-session__subheading">step <span class="bold">01</span></p>
                    </div>
                    <figure href="#" role="button" data-behaviour="gif" tabindex="0">
                        <img src="/assets/example-content/running-the-session.jpg" data-alt="/assets/example-content/running-the-session.gif" alt="football" />
                        <figcaption class="running-the-session__section__caption">
                            <div>0:10</div>
                            <div>GIF</div>
                        </figcaption>
                    </figure>
                    <div>
                        <!-- Desktop Version (Step) -->
                        <p class="running-the-session__subheading running-the-session__step-desktop">step <span class="bold">01</span></p>
                        <p class="running-the-session__paragraph">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</p>
                    </div>
                </article>
                <article class="running-the-session__section">
                    <!-- Mobile Version (Step) -->
                    <div class="running-the-session__step">
                        <p class="running-the-session__subheading">step <span class="bold">02</span></p>
                    </div>
                    <figure href="#" role="button" data-behaviour="gif" tabindex="0">
                        <img src="/assets/example-content/running-the-session.jpg" data-alt="/assets/example-content/running-the-session.gif" alt="football" />
                        <figcaption class="running-the-session__section__caption">
                            <div>0:10</div>
                            <div>GIF</div>
                        </figcaption>
                    </figure>
                    <div>
                        <!-- Desktop Version (Step) -->
                        <p class="running-the-session__subheading running-the-session__step-desktop">step <span class="bold">02</span></p>
                        <p class="running-the-session__paragraph">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</p>
                    </div>
                </article>
                <article class="running-the-session__section">
                    <!-- Mobile Version (Step) -->
                    <div class="running-the-session__step">
                        <p class="running-the-session__subheading">step <span class="bold">03</span></p>
                    </div>
                    <figure href="#" role="button" data-behaviour="gif" tabindex="0">
                        <img src="/assets/example-content/running-the-session.jpg" data-alt="/assets/example-content/running-the-session.gif" alt="football" />
                        <figcaption class="running-the-session__section__caption">
                            <div>0:10</div>
                            <div>GIF</div>
                        </figcaption>
                    </figure>
                    <div>
                        <!-- Desktop Version (Step) -->
                        <p class="running-the-session__subheading running-the-session__step-desktop">step <span class="bold">03</span></p>
                        <p class="running-the-session__paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </article>
                <article class="running-the-session__section">
                    <!-- Mobile Version (Step) -->
                    <div class="running-the-session__step">
                        <p class="running-the-session__subheading">step <span class="bold">04</span></p>
                    </div>
                    <figure href="#" role="button" data-behaviour="gif" tabindex="0">
                        <img src="/assets/example-content/running-the-session.jpg" data-alt="/assets/example-content/running-the-session.gif" alt="football" />
                        <figcaption class="running-the-session__section__caption">
                            <div>0:10</div>
                            <div>GIF</div>
                        </figcaption>
                    </figure>
                    <div>
                        <!-- Desktop Version (Step) -->
                        <p class="running-the-session__subheading running-the-session__step-desktop">step <span class="bold">04</span></p>
                        <p class="running-the-session__paragraph">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </article>
                <div class="running-the-session__section no-after">
                    <p class="running-the-session__subheading running-the-session__cool-down">Cool Down</p>
                </div>
                <footer>
                    <div class="article-author article-author--crest">
                        <div class="article-author__inner">
                            <h4>William Dalton</h4>
                            <p>10 min read - 10 Mar 2020</p>
                        </div>
                    </div>
                    <div class="share">
                        <div class="share__fallback" data-behavior="share-fallback">
                            <p>Share:</p>
                            <ul class="share__options">
                                <li>
                                    <button data-behavior="copy-url" aria-label="Copy page link"><img src="/assets/images/share-copy-icon.svg" />
                                        <span class="tooltip">Copy page link</span>
                                    </button>
                                </li>

                                <li><a href="https://www.facebook.com/sharer.php?u=https://www.thefa.com/" aria-label="Facebook. Opens in a new tab" target="_blank" class="fb-button"><img src="/assets/images/share-facebook-icon.svg" alt="Facebook" /><span class="tooltip">Share on Facebook. Opens in a new tab</span></a></li>
                                <li><a href="https://twitter.com/intent/tweet?url=https://www.thefa.com/" aria-label="Twitter. Opens in a new tab" target="_blank" class="twitter-button"><img src="/assets/images/share-twitter-icon.svg" alt="Twitter" /><span class="tooltip">Share on Twitter. Opens in a new tab</span></a></li>
                                <li><a href="https://wa.me/?text=https://www.thefa.com/" aria-label="Whatsapp. Opens in new Tab" target="_blank" class="whatsapp-button"><img src="/assets/images/share-whatsapp-icon.svg" alt="WhatsApp" /><span class="tooltip">Share on Whatsapp</span></a></li>
                            </ul>
                        </div>

                        <button class="share__native" data-behavior="share-native"><span>Share:</span><img src="/assets/images/share-icon.svg" /></button>
                    </div>
                </footer>
            </section>
            <section class="carousel-widget container">
                <div class="container__content">
                    <div class="container__header">
                        <h2 class="heading-section ">This is the heading used to top a section</h2>
                    </div>
                    <div class="carousel-widget__content">
                        <div class="tabbed-carousel" data-behavior="tabs-with-carousel">
                            <div class="tabbed-carousel__navigation">
                                <div class="tabbed-carousel__tab-list" role="tablist" aria-label="">
                                    <a href="#panel-related-article" role="tab" aria-selected="true" aria-controls="panel-related-article" id="tab-related-article" tabindex="0" data-behavior="related-article">
                                        related article
                                    </a>
                                </div>
                                <div class="tabbed-carousel__select-list">
                                    <select data-behavior="tabbed-carousel-select-list">
                                        <option selected value="related-article">related article</option>
                                    </select>
                                </div>
                            </div>

                            <div class="tabbed-carousel__tab-panels">
                                <div id="panel-related-article" role="tabpanel" tabindex="0" aria-labelledby="tab-related-article" data-tab-label="related article">
                                    <div class="carousel" data-behavior="carousel-related-article">
                                        <div>
                                            <button class="content-card content-card--video" id="video-dialog-label" data-behavior="video-lightbox" data-video-id="M7lc1UVf-VE" data-poster-image="/assets/example-content/womens-hero-600.png">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">02.04 <span>video</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Sponsored</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </button>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <button class="content-card content-card--video" id="video-dialog-label" data-behavior="vimeo-video-lightbox" data-video-id="545863177" data-poster-image="/assets/example-content/autoplay-hero-error.png">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">02.04 <span>video</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Sponsored</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </button>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                        </div>
                                        <div>
                                            <a target="_blank" href="https://www.youtube.com/watch?v=H11o250_xCA" class="content-card content-card--video">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/video-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">Video Card - 1</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="https://www.youtube.com/watch?v=H11o250_xCA" class="content-card content-card--video">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/video-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">Video Card - 1</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                        </div>
                                        <div>
                                            <a target="_blank" href="https://www.youtube.com/watch?v=H11o250_xCA" class="content-card content-card--video">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/video-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">Video Card - 1</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="https://www.youtube.com/watch?v=H11o250_xCA" class="content-card content-card--video">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/video-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">Video Card - 1</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                            <a target="_blank" href="/" class="content-card content-card--article">
                                                <div class="content-card__image-bg">
                                                    <img src="/assets/example-content/article-card-image.png" />
                                                </div>
                                                <div class="time">5 min <span>read</span></div>
                                                <div class="content-card__content">
                                                    <div class="content-card__content--dark-gradient">
                                                        <div class="sponsor-logo">
                                                            <img src="/assets/example-content/content-card-sponsor.svg" alt="sponsor">
                                                        </div>
                                                    </div>
                                                    <div class="content-card__content--info">
                                                        <div class="sponsored-label">Men's Senior</div>
                                                        <p class="title">head &amp; shoulders present: Jack grealish, The heard yeards</p>
                                                        <hr />
                                                        <div class="dateduration-wrap">
                                                            <span class="date">11 Oct 2020</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </a>

                                        </div>

                                    </div>
                                </div>

                                <div class="carousel-nav-block">
                                    <div class="carousel-nav-wrapper">
                                        <div class="tabbed-carousel__navigation-bottom">
                                            <div role="tablist" class="tabbed-carousel__pagination carousel__pagination"></div>
                                        </div>
                                        <div class="tabbed-carousel__arrows-wrap">
                                            <button aria-label="Previous" class="carousel__cta carousel__prev tabbed-carousel__prev disabled">
                                                <span class="visually-hidden">Previous page</span>
                                                <svg fill="none" viewBox="0 0 10 17" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="m9.2722 9.3355-6.75 6.75c-0.46089 0.4609-1.2087 0.4609-1.6706 0-0.46089-0.4609-0.46089-1.2097 0-1.6706l5.9146-5.9146-5.9146-5.9146c-0.46089-0.46089-0.46089-1.2097 0-1.6706 0.46194-0.46089 1.2097-0.46089 1.6706 0l6.75 6.75c0.46194 0.46089 0.46194 1.2097 0 1.6706v-1.4e-4z" fill="currentColor" />
                                                </svg>
                                            </button>
                                            <button aria-label="Next" class="carousel__cta carousel__next tabbed-carousel__next">
                                                <span class="visually-hidden">Next page</span>
                                                <svg fill="none" viewBox="0 0 10 17" xmlns="http://www.w3.org/2000/svg">
                                                    <path d="m9.2722 9.3355-6.75 6.75c-0.46089 0.4609-1.2087 0.4609-1.6706 0-0.46089-0.4609-0.46089-1.2097 0-1.6706l5.9146-5.9146-5.9146-5.9146c-0.46089-0.46089-0.46089-1.2097 0-1.6706 0.46194-0.46089 1.2097-0.46089 1.6706 0l6.75 6.75c0.46194 0.46089 0.46194 1.2097 0 1.6706v-1.4e-4z" fill="currentColor" />
                                                </svg>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </section>

        </div>

        <!--  minimum width column block  -->
        <div class="efl-column-layout efl-column-layout--one">
            <!-- minimum width content -->
        </div>

        <!--  two column block  -->
        <div class="efl-column-layout efl-column-layout--two">
            <div class="efl-column-layout__col">
                <!--  left column content  -->
                <div class="global-rte-content">
                    <h1>Lorem ipsum dolor sit amet, consectetur adipiscing elit</h1>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
                    <a href="#">Hyperlink text to access the next page</a>

                    <ul>
                        <li>Lorem ipsum dolor sit amet, consectetur</li>
                        <li>Lorem ipsum dolor sit amet, consectetur</li>
                        <li>Lorem ipsum dolor sit amet, consectetur</li>
                        <li>Lorem ipsum dolor sit amet, consectetur</li>
                    </ul>
                    <p><em>Lorem ipsum dolor sit amet, consectetur</em></p>

                    <table>
                        <tbody>
                            <tr>
                                <td>
                                    <p><strong>Objective</strong></p>
                                </td>
                                <td>
                                    <p><strong>Space</strong></p>
                                </td>
                                <td>
                                    <p><strong>Task</strong></p>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <p>Play forward</p>
                                </td>
                                <td>
                                    <p>A narrow and long area, split into halves.</p>
                                </td>
                                <td>
                                    <p><span data-contrast="none" class="TextRun SCXW222114590 BCX0" style="background-color: #ffffff; margin: 0px; padding: 0px; line-height: 17.2667px; color: #000000;"><span class="NormalTextRun SCXW222114590 BCX0" style="margin: 0px; padding: 0px;">Score as many goals as
                                                possible. If you score, the number of one-touch passes made before the goal equates to the number of
                                                points you’re awarded. For example, five one-touch passes equal five goals. &nbsp;</span></span></p>
                                </td>
                            </tr>
                    </table>
                    <p></p>
                </div>
            </div>
            <div class="efl-column-layout__col">
                <!--  right column content  -->
            </div>
        </div>
    </div>
</div>

No notes defined.

/* No context defined. */
<div class="page-wrapper efl-article-page">
    {{render '@efl-hero-banner'}}
    <div class="efl-page-content">
        <div class="efl-page-content__tray">
            <!--  two column block  -->
            <div class="efl-column-layout efl-column-layout--two">
                <div class="efl-column-layout__col">
                    <!--  left column content  -->
                   {{render '@efl-article-info'}}
                </div>
                <div class="efl-column-layout__col">
                    <!--  right column content  -->
                    {{render '@jump-to-section'}}
                </div>
            </div>
        </div>
    </div>

    <div class="efl-page-content__dynamic-placeholder">
        <!-- below placeholders are dynamic we need to update based on component-->
        <!--  full width column block  -->
        <div class="efl-column-layout efl-column-layout--one full-width">
            {{render '@session-setup'}}
            {{render '@running-the-session'}}
            {{render '@carousel-widget'}}
            
        </div>

        <!--  minimum width column block  -->
        <div class="efl-column-layout efl-column-layout--one">
            <!-- minimum width content -->
        </div>

        <!--  two column block  -->
        <div class="efl-column-layout efl-column-layout--two">
            <div class="efl-column-layout__col">
                <!--  left column content  -->
                {{render '@global-rte--h1'}}
            </div>
            <div class="efl-column-layout__col">
                <!--  right column content  -->
            </div>
        </div>
    </div>
</div>