<div id="{{ tray_id }}" class="tray">

    <div class="tray-resources js-tray_resources">
        <!-- Progress Bar Item -->
        <div class="tray-item js-tray_item js-tray_progress_bar_item">
            <div class="tray-item-row js-title"></div>
            <div class="tray-item-row">
                <div class="tray-progress-bar">
                  <div class="bar js-bar"></div>
                </div>
            </div>
        </div>
        <!-- Tray item row -->
        <div class="tray-item-row js-tray_item_row"></div>
        <!-- Tray item row right aligned -->
        <div class="tray-item-row tray-text-right-align js-tray_item_row-right-align "></div>
        <!-- Message Item -->
        <div class="tray-item js-tray_item js-tray_message_item">
            <div class="tray-item-row tray-message-title js-title"></div>
            <div class="js-tray_container_for_messages"></div>
            <div class="tray-item-row tray-text-right-align js-footer"></div>
        </div>
    </div>

    <div class="tray-row tray-header js-tray_header">
        <div class="tray-header-title js-tray_header_title"></div>
    </div>
    <div class="tray-row tray-body js-tray_body">
        <div class="tray-col js-tray_body_col">
        </div>
    </div>
    <div class="tray-row tray-footer js-tray_footer"></div>
</div>