<link rel="stylesheet" href="./templates/dnd_activity/dnd_activity.css" />
<div class="clickIntHolder" id="clickIntHolder">
  <div id="mainContainer" class="textImageShadow bg_image">
    <div id="dndContentHolder">
      <h2 class="pagetitle">Learning Objectives</h2>
      <div id="dropDesc">
        <p class="blueTxt">
          David is a new hire at Employbridge. He is supposed to handle a
          project which involves sensitive data. Therefore, he needs guidance on
          handling sensitive information. Can you help him classify the given
          options into Dos and Don’ts.
        </p>
        <p class="instTxt">
          Drag and drop the options in the appropriate category and click the
          <b>Submit</b> button.
        </p>
      </div>
      <!-- <div class="data_icon"></div> -->
      <div class="contentwrapper">
        <div id="dndContainer" class="dragDropWrap">
          <div class="containment"></div>
          <div class="innerContent">
            <!--  <div id="questionTxt" class="quesTxt"></div> -->
            <div class="rhtColumn">
              <div class="box_1">
                <div class="title">Dos</div>
                <div id="dropHolder1" class="dropWrap">
                  <p class="InstrutationText InstrutationText2">
                    Drag the client debt issues that should be escalated to the
                    manager and partner here.
                  </p>
                </div>
              </div>
              <div class="box_2">
                <div class="title">Don’ts</div>
                <div id="dropHolder2" class="dropWrap"></div>
              </div>
              <div class="btn_sec">
                <div class="submitBtn" id="buttonReset">Reset</div>
                <div id="submitBtn" class="submitBtn">Submit</div>
                <!-- <div class="contBtn" id="buttonCont">Continue</div> -->
                <!-- <div id="solutionBtn" class="solutionBtn">
                                    <div>Solution</div>
                                </div> -->
              </div>
            </div>
            <!--  <div class="clearFix"></div> -->
            <div class="lftColumn">
              <div class="titleOpt">Options</div>
              <div id="dragHolder" class="dragWrap disabled-dragging"></div>
            </div>

            <div id="dndFeedbackBox1" tabindex="1" class="feedbackWrap">
              <div id="feedbackHeader" class="titleTxt">
                <span>Feedback</span>
                <div
                  tabindex="1"
                  role="button"
                  id="feedbackClose"
                  class="popupClose"
                ></div>
              </div>
              <div id="dndFeedbackContent" class="contentSec">
                <div class="row tempFeedback">
                  <div id="contentHolder" class="txtBlock">
                    <div id="content" class="feedbackTxt"></div>
                  </div>
                </div>
              </div>
            </div>
            <div id="debrief" class="debriefBox">
              <div id="debriefHeader" class="titleTxt">
                <span>Solution:</span>
                <div
                  tabindex="1"
                  role="button"
                  id="debriefClose"
                  class="popupClose"
                ></div>
              </div>
              <div id="dnddebriefContent" class="dnddebriefContent">
                <div id="debriefContentHolder" class="debriefBlock">
                  <div id="debriefTxt" class="debriefTxt">
                    <p>Click continue to debrief.</p>
                  </div>
                </div>
              </div>
            </div>
            <div class="clear"></div>
          </div>

          <div class="clear"></div>

          <div class="dragItem noselect tempDragOption" tabindex="1">
            <div id="dragContent" class="textStripe">
              <span>Lorem Ipsum</span>
            </div>
          </div>
        </div>

        <div class="clear"></div>
      </div>
    </div>
  </div>
</div>

<script src="./templates/dnd_activity/EventManager.js"></script>
<script src="./templates/dnd_activity/Feedback.js"></script>
<script src="./templates/dnd_activity/SubmitButton.js"></script>
<script src="./templates/dnd_activity/dnd_activity.js"></script>
