<link rel="stylesheet" href="./templates/mcss/mcss.css" type="text/css" />

<div id="temp_popupLoader" class=""> </div>

<div class="popup">
    <div class="pop_bg"></div>
    <div class="pop_icon_wrap">
        <div class="pop_icon">
            <img src="templates/mcss/top_activity.png" alt="">
        </div>
        <h1 class="pop_title">Activity</h1>
    </div>
    <section class="mainContent" id="mcmsContainer">
        <div class="left_intro">
            <div class="left_user" aria-hidden="true">
                <div class="user_img_wrap" ><img class="video_you_avatar" src="templates/mcss/user_icon.png" alt=""></div>
                <div class="user_title uName">You</div>
            </div>
        </div>
        <div class="right_wrap">
            <div class="scrollbar-2 scroll_continer">
                <div class="clickIntHolder" id="clickIntHolder">
                    <div id="mcmsHolder" class="mcssWrap">
                        <div class="pop_content">
                            <p id="mcmsScenarioTxt" class="pop_info">Hi <span class="uName"></span>! Now, it’s your turn to provide your intro.</p>
                            <div id="mcmsInstructionTxt" class="instruction">Select an option from each column and select <strong>I’m done</strong> to frame an intro for you.</div>
                        </div>
                        <div id="mcmsOptionContainer" class="optionContainer">
                            <div class="row cloneOption">
                                <div class="optionIcons">
                                    <div id="tickCross" class="tickIco correct"></div>
                                    <div id="optionBox" class="checkBox"></div>
                                </div>
                                <div class="optionText">
                                    <div id="optionTxt" class="txt">
                                        <span>option text</span>
                                    </div>
                                </div>
                            </div>
                            <div class="content_wrap">
                                <div class="option_box_wrap">
                                    <div class="group1 bx-w1 pb15 bg-4 fl">
                                        <h2 class="sr-only" aria-label="Greeting">Learner’s greeting</h2>
                                        <div class="bx_head_wrap bg-1" aria-hidden="true">Learner’s greeting</div>
                                    </div>
                                    <div class="group_Dummy1"> </div>
                                    <!-- <div class="group2 bx-w2 pb15 bg-4 fl mrl">
                                        <h2 class="sr-only" aria-label="Vibe">Learner’s greeting</h2>
                                        <div class="bx_head_wrap bg-2" aria-hidden="true">Learner’s name/vibe</div>
                                    </div>
                                    <div class="group3 bx-w3 pb15 bg-4 fl">
                                        <h2 class="sr-only" aria-label="Role">Learner’s greeting</h2>
                                        <div class="bx_head_wrap bg-3" aria-hidden="true">Role</div>
                                    </div> -->
                                </div>
                            </div>
                        </div>
                        <div class="btnCont mt15">
                            <div id="mcmsSubmitBtn" class="submitBtn confirmBtn pop_btn fr" role="button" aria-label="I’m done">
                                <span class="vcenter">I’m done</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div id="mcmsFeedbackBox" class="feedBackPopup">
        <div class="feedBackContent">
            
            <div id="feedbackHeader" class="titleTxt">
                <span class="vcenter">Feedback</span>
            </div>
            <div id="feedbackContent" class="feebackText">Answer A is correct.</div>
            <div id="feedbackClose" class="close_icon" role="button" aria-label="ok"></div>
        </div>
    </div>
</div>
<script src="./templates/mcss/event_manager.js"></script>
<script src="./templates/mcss/feedback.js"></script>
<script src="./templates/mcss/submit_button.js"></script>
<script src="./templates/mcss/option.js"></script>
<script src="./templates/mcss/mcss.js"></script>