<div class="DV-annotation <%= orderClass %> DV-<%= access %>" style="top:<%= top %>px;" id="DV-annotation-<%= id %>">

  <div class="DV-annotationTab">
    <div class="DV-annotationClose DV-trigger"></div>
  </div>

  <div class="DV-annotationRegion" style="margin-left:<%= excerptMarginLeft %>px; height:<%= excerptHeight %>px; width:<%= excerptWidth %>px;">
    <div class="<%= access == 'public' ? 'DV-ownerVisible' : 'DV-contributorVisible' %>">
      <div class="DV-annotationEdge DV-annotationEdgeTop"></div>
      <div class="DV-annotationEdge DV-annotationEdgeRight"></div>
      <div class="DV-annotationEdge DV-annotationEdgeBottom"></div>
      <div class="DV-annotationEdge DV-annotationEdgeLeft"></div>
      <div class="DV-annotationCorner DV-annotationCornerTopLeft"></div>
      <div class="DV-annotationCorner DV-annotationCornerTopRight"></div>
      <div class="DV-annotationCorner DV-annotationCornerBottomLeft"></div>
      <div class="DV-annotationCorner DV-annotationCornerBottomRight"></div>
    </div>
  </div>


  <div class="DV-annotationContent">

    <div class="DV-annotationHeader clearfix">
      <div class="DV-pagination DV-editHidden">
        <span class="DV-trigger DV-annotationPrevious" title="Previous Annotation">Previous</span>
        <span class="DV-trigger DV-annotationNext" title="Next Annotation">Next</span>
      </div>
      <% if (access == 'private') { %>
        <div class="DV-annotationWarning DV-editVisible">This private note is only visible to you.</div>
      <% } else { %>
        <div class="DV-annotationWarning DV-editVisible">All viewers of this document can see this public note.</div>
      <% } %>
      <div class="DV-annotationGoto DV-editHidden"><div class="DV-trigger">p. <%= pageNumber %></div></div>
      <div class="DV-annotationTitle DV-editHidden"><%= title %></div>
      <input class="DV-annotationTitleInput DV-editVisible" type="text" placeholder="Annotation Title" value="<%= title %>" />
      <% if (access == 'private') { %>
        <div class="DV-privateLock DV-editHidden" title="Private note"></div>
      <% } %>
      <div class="DV-showEdit DV-editHidden <%= access == 'public' ? 'DV-ownerVisible' : 'DV-contributorVisible' %>"></div>
    </div>


    <div class="DV-annotationExcerpt" style="height:<%= excerptHeight %>px;">
      <div class="DV-annotationExcerptImageTop" style="height:<%= excerptHeight %>px; width:<%= excerptWidth %>px;left:<%= excerptMarginLeft %>px;">

        <img src="<%= image %>" style="left:-<%= excerptMarginLeft %>px; top:-<%= imageTop %>px;" width="<%= imageWidth %>" />

      </div>
      <div class="DV-annotationExcerptImage" style="height:<%= excerptHeight %>px;">
        <img src="<%= image %>" style="top:-<%= imageTop - 2 %>px;" width="<%= imageWidth %>" />
      </div>
    </div>

    <div class="DV-annotationBody DV-editHidden">
      <%= text %>
    </div>
    <textarea class="DV-annotationTextArea DV-editVisible" style="width: <%= bWidth %>px;"><%= text %></textarea>

    <div class="DV-annotationEditControls DV-editVisible">
      <div class="<%= access == 'public' ? 'DV-ownerVisible' : 'DV-contributorVisible' %> clearfix">
        <div class="minibutton warn DV-deleteAnnotation float_left">Delete</div>
        <div class="minibutton default DV-saveAnnotation float_right">Save</div>
        <div class="minibutton DV-cancelEdit float_right">Cancel</div>
      </div>
    </div>
  </div>
</div>


