{# Template For BLISc SHRIST Collage  #}
<style>
    @media print {
        #printBtnDiv { display : none !important; }
    }
	.primary-table {
		border-collapse: collapse !important;
		page-break-inside: auto;
		width: 100% !important;
	}

	.primary-table th {
		text-align: center;
		background: none !important;
		height: 4mm !important;
		border: 1px solid #000 !important;
		padding: 1mm !important;
	}
	.primary-table td {
		padding: 3px;
		line-height: 20px !important;
		height: 4mm !important;
		height: 4mm !important;
		border: 1px solid #000;
		text-align: center;
		vertical-align: middle !important;
	}
	#succesRateReportHeader {
		width: 100% !important;
		height: 4mm !important;
	}

	#succesRateReportHeader td {
		padding: 2mm;
		line-height: 15px !important;
		height: 4mm !important;
		border: 1px solid #000;
		vertical-align: middle !important;
	}
	#subjectHeader {
		width: 100% !important;
	}
	#subjectHeader td {
		padding: 2mm;
		line-height: 15px !important;
		height: 4mm !important;
		vertical-align: middle !important;
		text-align: center !important;
	}
	.no-border {
		border-left: 1px solid #fff !important;
		border-right: 1px solid #fff !important;
		border-top: 1px solid #fff !important;
        border-bottom: 1px solid #fff !important;
	}
	.college-header {
		height: 35mm;
		width: auto;
		margin: 0 10%;
	}
    .text-left{
        text-align:left!important;
    }
    .text-center{
        text-align:center!important;
    }
    .text-right{
        text-align:right!important;
    }
    .p-t-20{
        padding-top:10px!important;
    }
	.p-t-50{
        padding-top:50px!important;
    }
	
    .p-b-10{
        padding-bottom:10px!important;
    }
    .p-20{
        padding:20px!important;
    }
    .outer-border {
        border: 1px solid black;
        border-collapse: collapse;
    }
    .center {
        margin-left: auto;
        margin-right: auto;
    }
    .abbr-table td{
        padding: 2mm 10mm 2mm 10mm;
		line-height: 14px !important;
		margin-top:5mm;
    }
	.removeTdBorder{
		border-left:1px solid #fff !important;
		border-right:1px solid #fff !important;
		border-bottom:1px solid #fff !important;
		border-top:1px solid #fff !important;
	}
	.tabular-table {
		border-collapse: collapse !important;
		page-break-inside: auto;
		/* page-break-after:always; */
		width: 100% !important;
		border: 1px solid #000 !important;
	}

	.tabular-table th {
		text-align: center;
		background: none !important;
		height: 3mm !important;
		/* border: 1px solid #000 !important; */
		padding: 1mm !important;
		font-size:12px;
	}
	.tabular-table-border{
		border: 1px solid #000 !important;
	}
	.tabular-table td {
		padding: 8px 2px;
		line-height: 18px !important;
		height: 8mm !important;
		border: 1px solid #000;
		text-align: center;
		vertical-align: middle !important;
		/* page-break-after:always; */
	}
	.tabular-table tr{
		/* page-break-after:always; */
		height: 8mm !important;
	}
	.tabular-table tbody tr:last-child td {
		border-bottom: 1px solid #000 !important;
	}
	.small-font{
		font-weight: normal !important;
		font-size: 15px !important;
	}
	.failed{
		background-color:#c0c0c0 !important; 
	}
	@media screen {
	.sticky-column {
		position: sticky;
		left: 0;
		background-color: white !important;
		z-index: 3; 
		border: 1px solid #000 !important;

	}

	/* 2. Specific column adjustments */
	.sticky-column-1 { 
		left: 0;
		min-width: 40px;
		max-width: 40px;
	}
	.sticky-column-2 { 
		left: 40px;
		min-width: 50px;
		max-width: 50px;
	}
	.sticky-column-3 { 
		left: 90px;
		min-width: 140px;
		max-width: 140px;
	}
	.sticky-column-4 { 
		left: 230px;
		min-width: 200px;
		max-width: 200px;
	}
	.tabular-table {
		border-collapse: separate !important;
		border-spacing: 0 !important;
	}
	.tabular-table td {
		border-bottom: 1px solid #000 !important;
	}

	.tabular-table thead th.sticky-header {
		position: sticky;
		top: 0;
		z-index: 4; 
		background-color: white !important;
		border: 1px solid #000 !important;
		box-shadow: 0 1px 0 #000;
		}
	}
	
    .stud-row td{
		font-size: 18px !important;
	}
</style>
<div class="page" style="width:100%;" id="sem-wise-result-sheet" data-cols-width="10,40">
{# FIRST PAGE #}
    <table id="subjectHeader">
        <tr style="padding-top:300px!important">
			<td data-f-bold='true' colspan="3"><img src="{{data.collegeData.collegeHeader}}" class="college-header"></td>
		</tr>
        <tr>
			<td data-f-bold='true' colspan="3"><b style="font-size: 18px;">{{data.examRegistrationData.name}}</br></td>
		</tr>
        <tr>
			<td data-f-bold='true' colspan="3"><b style="font-size: 18px;">TABULATION REGISTER</br></td>
		</tr>
    </table>
    <table style="width:100%!important;">
        <tr>
            <th colspan="3" data-f-bold='true' class="text-left">Programme : {{data.examRegistrationData.streamDescription| raw}}</th>
            <th data-f-bold='true' class="text-right">&nbsp;</th>
        </tr>
        <tr>
            <th colspan="3" data-f-bold='true' class="text-left">Academic Year :  {{data.examRegistrationData.academicExamYear}} </th>
            <th data-f-bold='true' class="text-right">Semester : {{data.examRegistrationData.academicTermName}}</th>
        </tr>
		<tr style="display: none;">
			<td></td>
		</tr>

    </table>
    <br>
    <!-- start index tables   -->
    {% set subject_count = data.examRegistrationData.subjects|length %}
    {% set split_table = subject_count > 20 %}
    {% set mid_index = (subject_count // 2) + (subject_count is odd ? 1 : 0) %}
    
    {% macro render_subjects(subjects) %}
        {% for subject in subjects %}
            <tr>
                <td style='font-size: 18px;' class="text-left">{{ subject.code | raw }}</td>
                <td style='font-size: 18px;' class="text-left">{{ subject.name | raw }}</td>
                <td style='font-size: 18px;'>{{ subject.credit }}</td>
                <td style='font-size: 18px;'>{{ subject.internalMaxMark }}</td>
                <td style='font-size: 18px;'>{{ subject.externalMaxMark }}</td>
                <td style='font-size: 18px;'>{{ subject.totalMarks }}</td>
            </tr>
        {% endfor %}
    {% endmacro %}
    
    {% macro render_table(subjects) %}
        <table class="primary-table" style="width: 100%;">
            <tr>
                <th data-f-bold='true' style="width:15%" rowspan="2">Course Code</th>
                <th data-f-bold='true' style="width:45%" rowspan="2">Course</th>
                <th data-f-bold='true' style="width:10%" rowspan="2">Credit</th>
                <th data-f-bold='true' style="width:30%" colspan="3">Max Marks</th>
            </tr>
            <tr>
                <th data-f-bold='true' style="width:5%">IA</th>
                <th data-f-bold='true' style="width:5%">ESE</th>
                <th data-f-bold='true' style="width:5%">Total</th>
            </tr>
            {{ _self.render_subjects(subjects) }}
        </table>
    {% endmacro %}
    
    {% if split_table %}
        <div style="width: 100%; overflow: hidden;">
            <div style="float: left; width: 48%;">
                {{ _self.render_table(data.examRegistrationData.subjects[:mid_index]) }}
            </div>
            <div style="float: right; width: 48%;">
                {{ _self.render_table(data.examRegistrationData.subjects[mid_index:]) }}
            </div>
        </div>
    {% else %}
        {{ _self.render_table(data.examRegistrationData.subjects) }}
    {% endif %}
    
    <!-- end index table -->

    <br>
    <table class="primary-table center" style="width:20%!important;">
        <tr>
            <td><b>Total Credit :</b></td>
            <td><b>{{data.examRegistrationData.totalCredit}}</b></td>
        </tr>
    </table>
    <br>
    <table class="center outer-border abbr-table" style="width:60%!important;">
		<tr style="display: none;">
			<td></td>
		</tr>
        <tr>
            <td class="text-center" colspan="3"><b>Abbreviations :</b></td>
        </tr>
        <tr>
            <td class="text-left">C => Credit</td>
            <td class="text-left">P => Practical</td>
            <td class="text-left">AB => ABSENT</td>
        </tr>
        <tr>
            <td class="text-left">T => Theory</td>
            <td class="text-left">D => Project / Dissertation</td>
            <td class="text-left">V => Viva</td>
        </tr>
        <tr>
            <td class="text-left">IA => Internal Mark</td>
            <td class="text-left">G => Grade</td>
            <td class="text-left">IC => Incomplete</td>
        </tr>
        <tr>
            <td class="text-left">Tot => Total Marks</td>
            <td class="text-left">ESE => External Mark</td>
            <td class="text-left">EC => Exam Cancelled</td>
        </tr>
        <tr>    
            <td class="text-left">CP => Credit Point</td> 
            <td class="text-left">GP => Grade Point</td>  
            <td></td>
        </tr>
    </table>
    <br>
    {% if data.isPrint == 1 %}
        <table style="width:100%!important; page-break:before: avoid !important" class="footer-table">
            <tr>
                <td colspan="100" class="no-border p-t-50" style="font-weight: bold !important; padding-top:85px !important">
                    <span style="float:left!important; width:25%">Prepared by</span>
                    <span style="float:left!important; width:25%">Checked by</span>
                    <span style="float:left!important; width:25%">Controller of Examinations</span>
                    <span style="float:left!important; width:25%">Principal</span>
                </td>
            </tr>
        </table>
    {% endif %}
{# FIRST PAGE END #}

{# TABLUTION REGISTER STARTS #}
	{# Split categories: first category on first half, remaining on second half #}
	{% set firstCatList = [data.examRegistrationData.headerCategories|first] %}
	{% set remainingCatList = data.examRegistrationData.headerCategories|slice(1) %}

	{# Column counts for first category split #}
	{% set firstCatSubjectCount = firstCatList[0].subjects|length %}
	{% set firstCatColumnCount = firstCatSubjectCount * 5 %}
	{% set firstCatHeadCount = 1 %}

	{# Column counts for remaining categories split #}
	{% set remainingCatSubjectCount = 0 %}
	{% for cat in remainingCatList %}
		{% set remainingCatSubjectCount = remainingCatSubjectCount + cat.subjects|length %}
	{% endfor %}
	{% set remainingCatColumnCount = remainingCatSubjectCount * 5 %}
	{% set remainingCatHeadCount = remainingCatList|length + 1 %}

	{% macro render_table_header(data, catColumnCount, catCount, categories, showOverallTotal) %}
	<table id="subjectHeader" style="width:100%!important;page-break-before: always">
        <tr>
			<td data-f-bold='true' colspan="3"><img src="{{data.collegeData.collegeHeader}}" class="college-header"></td>
		</tr>
        <tr>
			<td><b style="font-size: 18px;">{{data.examRegistrationData.name}}</br></td>
		</tr>
        <tr>
			<td><b style="font-size: 18px;">TABULATION REGISTER</br></td>
		</tr>
    </table>
    <table style="width:100%!important;">
        <tr>
            <th data-f-bold='true' class="text-left">Programme : {{data.examRegistrationData.streamDescription| raw}}</th>
            <th data-f-bold='true' class="text-right">&nbsp;</th>
        </tr>
        <tr>
            <th data-f-bold='true' class="text-left">Academic Year :  {{data.examRegistrationData.academicExamYear}} </th>
            <th data-f-bold='true' class="text-right">Semester : {{data.examRegistrationData.academicTermName}}</th>
        </tr>
    </table>
    <table class="tabular-table" id="tabulationRegisterReportExcel">
    <thead>
        <tr>
            {% if data.isPrint == 0 %}
                <th data-f-bold='true' data-exclude="true" class="tabular-table-border sticky-column sticky-column-1 sticky-header" style="width:2%" rowspan="4">Select</th>
            {% endif %}
            <th data-f-bold='true' class="tabular-table-border sticky-column sticky-column-2 sticky-header" style="width:2%" rowspan="4">Sl No</th>
			<th data-f-bold='true' class="tabular-table-border sticky-column sticky-column-3 sticky-header" style="width:16%" rowspan="4"><div style="width:50mm!important">Register No.</div></th>
			<th data-f-bold='true' class="tabular-table-border sticky-column sticky-column-4 sticky-header" style="width:20%; padding-left:15px !important; padding-right:15px !important" rowspan="4">Name</th>
			<th data-f-bold='true' data-a-h="center" colspan="{{ catColumnCount + catCount }}" class="tabular-table-border" >
				{{ data.examRegistrationData.programName }}
			</th>
		</tr>
		<tr>
            {% set bpedSubCols = 3 %}
            {% if data.displayContentOptions.rules.showModerationMark %}{% set bpedSubCols = bpedSubCols + 1 %}{% endif %}
            {% if data.displayContentOptions.rules.showGraceMark %}{% set bpedSubCols = bpedSubCols + 1 %}{% endif %}
            {% for category in categories %}
				<th data-f-bold='true' data-a-h="center"  class="tabular-table-border text-center" colspan="{{(category.subjects|length) * bpedSubCols + 1}}" style="width:20%"> {{category.name|raw}}</th>
		    {% endfor %}
            {% if showOverallTotal %}
                <th data-f-bold='true' data-a-h="center"  class="tabular-table-border text-center" style="width:2%" rowspan="2">Overall Total</th>
            {% endif %}
		</tr>
		<tr>
            {% for category in categories %}
				{% for subject in category.subjects %}
					<th data-f-bold='true' data-a-h="center"  class="tabular-table-border text-center" colspan="{{bpedSubCols}}" style="width:18%">{{subject.code | raw}} <br> {{subject.name|raw}}
				{% endfor %}
	            <th data-f-bold='true' class="tabular-table-border text-center" style="width:2%">{{category.name}} Total</th>
			{% endfor %}
        </tr>
        <tr>
            {% for category in categories %}
				{% for subject in category.subjects %}
					{% if data.displayContentOptions.rules.showModerationMark %}
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">MDN</th>
					{% endif %}
					{% if data.displayContentOptions.rules.showGraceMark %}
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">GRM</th>
					{% endif %}
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">INT</span> <br>Max: <br>{{subject.isExternal == 1 ? subject.internalMaxMark : '0'}}</th>
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">EXT</span>  <br>Max: <br>{{subject.isExternal == 1 ? subject.externalMaxMark : '0'}}</th>
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">TOTL</span>  <br>Max: <br>{{subject.totalMarks}}</th>
            	{% endfor %}
					<th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">TOTL</span>  <br>Max: {{category.totalMarks}}</th>
            {% endfor %}
            {% if showOverallTotal %}
                <th data-f-bold='true' class="tabular-table-border text-center" style="font-size:10px; width:2%"><span style="padding-left:7px;padding-right:7px;">TOTL</span>  <br>Max: {{data.examRegistrationData.semesterTotalMarks}}</th>
            {% endif %}
        </tr>
    </thead>
	<tbody class="text-center">
	{% endmacro %}

	{% macro render_footer() %}
		<table style="width:100%!important; page-break:before: avoid !important" class="footer-table">
			<tr>
				<td colspan="100" class="no-border p-t-50" style="font-weight: bold !important; padding-top:85px !important">
					<span style="float:left!important; width:25%">Prepared by</span>
					<span style="float:left!important; width:25%">Checked by</span>
					<span style="float:left!important; width:25%">Controller of Examinations</span>
					<span style="float:left!important; width:25%">Principal</span>
				</td>
			</tr>
		</table>
	{% endmacro %}

	{% set studentsPerPage = 17 %}

	{# ===== FIRST HALF: First category only ===== #}
	{% for student in data.studentData %}
		{% if loop.index0 % studentsPerPage == 0 %}
			{% if loop.index0 > 0 %}
				</tbody>
				</table>
				{% if data.isPrint == 1 %}
					{{ _self.render_footer() }}
				{% endif %}
			{% endif %}
			{{ _self.render_table_header(data, firstCatColumnCount, firstCatHeadCount, firstCatList, false) }}
		{% endif %}
		<tr class="stud-row">
			{% set academicTerm = student.academicTerms|first %}
			{% if data.isPrint == false %}
				<td data-exclude="true" class="text-center tabular-table-border sticky-column sticky-column-1"><input type="checkbox" class="studentName" value='{{student.id}}'/></td>
			{% endif %}
			<td class="text-center sticky-column sticky-column-2">{{loop.index}}</td>
			<td class="text-center sticky-column sticky-column-3" style="font-size: 18px;">{{student.registerNo}}</td>
			<td class="text-left sticky-column sticky-column-4">{{student.name}}</td>
			{% for category in firstCatList %}
				{% for subject in category.subjects %}
					{% set isEntered = false %}
					{% for studentSubject in academicTerm.subjects %}
						{% if studentSubject.id == subject.id %}
							{% set displayHeadCount = displayHeadCount + 1 %}
							{% if studentSubject.attendanceStatus == "ABSENT" %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td class="failed">{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td class="failed">{{studentSubject.graceMark}}</td>{% endif %}
								<td class="failed">{{studentSubject.isInternal == 1 ? studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark : "-"}}</td>
								<td class="failed">AB</td>
								<td class="failed b-r-t">-</td>
							{% elseif studentSubject.attendanceStatus == "MALPRACTICE" %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td class="failed">{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td class="failed">{{studentSubject.graceMark}}</td>{% endif %}
								<td class="failed">{{studentSubject.isInternal == 1 ? studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark : "-"}}</td>
								<td class="failed">MAL</td>
								<td class="failed b-r-t">-</td>
							{% else %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td>{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td>{{studentSubject.graceMark}}</td>{% endif %}
								{% if studentSubject.isInternal== 1 %}
									<td>{{studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark}}</td>
								{% else %}
									<td class="failed">-</td>
								{% endif %}
								{% if studentSubject.isExternal== 1 %}
									<td>{{studentSubject.externalMark|round}}</td>
								{% else %}
									<td class="failed">-</td>
								{% endif %}
								<td class="b-r-t">{{studentSubject.markObtained}}</td>
							{% endif %}
							{% set isEntered = true %}
						{% endif %}
					{% endfor %}
					{% if isEntered == false %}
						{% if data.displayContentOptions.rules.showModerationMark %}<td></td>{% endif %}
						{% if data.displayContentOptions.rules.showGraceMark %}<td></td>{% endif %}
						<td></td>
						<td></td>
						<td class="b-r-t"></td>
					{% endif %}
				{% endfor %}
				<td class="b-r-t">{{academicTerm.category[category.categoryId].isFailed == 1 ? '-' : academicTerm.category[category.categoryId].totalMarks ?? 0}}</td>
			{% endfor %}
		</tr>
	{% endfor %}
	</tbody>
	</table>
	{% if data.isPrint == 1 %}
		{{ _self.render_footer() }}
	{% endif %}

	{# ===== SECOND HALF: Remaining categories + Overall Total ===== #}
	{% for student in data.studentData %}
		{% if loop.index0 % studentsPerPage == 0 %}
			{% if loop.index0 > 0 %}
				</tbody>
				</table>
				{% if data.isPrint == 1 %}
					{{ _self.render_footer() }}
				{% endif %}
			{% endif %}
			{{ _self.render_table_header(data, remainingCatColumnCount, remainingCatHeadCount, remainingCatList, true) }}
		{% endif %}
		<tr class="stud-row">
			{% set academicTerm = student.academicTerms|first %}
			{% if data.isPrint == false %}
				<td data-exclude="true" class="text-center tabular-table-border sticky-column sticky-column-1"><input type="checkbox" class="studentName" value='{{student.id}}'/></td>
			{% endif %}
			<td class="text-center sticky-column sticky-column-2">{{loop.index}}</td>
			<td class="text-center sticky-column sticky-column-3" style="font-size: 18px;">{{student.registerNo}}</td>
			<td class="text-left sticky-column sticky-column-4">{{student.name}}</td>
			{% for category in remainingCatList %}
				{% for subject in category.subjects %}
					{% set isEntered = false %}
					{% for studentSubject in academicTerm.subjects %}
						{% if studentSubject.id == subject.id %}
							{% set displayHeadCount = displayHeadCount + 1 %}
							{% if studentSubject.attendanceStatus == "ABSENT" %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td class="failed">{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td class="failed">{{studentSubject.graceMark}}</td>{% endif %}
								<td class="failed">{{studentSubject.isInternal == 1 ? studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark : "-"}}</td>
								<td class="failed">AB</td>
								<td class="failed b-r-t">-</td>
							{% elseif studentSubject.attendanceStatus == "MALPRACTICE" %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td class="failed">{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td class="failed">{{studentSubject.graceMark}}</td>{% endif %}
								<td class="failed">{{studentSubject.isInternal == 1 ? studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark : "-"}}</td>
								<td class="failed">MAL</td>
								<td class="failed b-r-t">-</td>
							{% else %}
								{% if data.displayContentOptions.rules.showModerationMark %}<td>{{studentSubject.moderationMark}}</td>{% endif %}
								{% if data.displayContentOptions.rules.showGraceMark %}<td>{{studentSubject.graceMark}}</td>{% endif %}
								{% if studentSubject.isInternal== 1 %}
									<td>{{studentSubject.internalAttendanceStatus == 'ABSENT' ? 'AB' : studentSubject.internalMark}}</td>
								{% else %}
									<td class="failed">-</td>
								{% endif %}
								{% if studentSubject.isExternal== 1 %}
									<td>{{studentSubject.externalMark|round}}</td>
								{% else %}
									<td class="failed">-</td>
								{% endif %}
								<td class="b-r-t">{{studentSubject.markObtained}}</td>
							{% endif %}
							{% set isEntered = true %}
						{% endif %}
					{% endfor %}
					{% if isEntered == false %}
						{% if data.displayContentOptions.rules.showModerationMark %}<td></td>{% endif %}
						{% if data.displayContentOptions.rules.showGraceMark %}<td></td>{% endif %}
						<td></td>
						<td></td>
						<td class="b-r-t"></td>
					{% endif %}
				{% endfor %}
				<td class="b-r-t">{{academicTerm.category[category.categoryId].isFailed == 1 ? '-' : academicTerm.category[category.categoryId].totalMarks ?? 0}}</td>
			{% endfor %}
			<td>{{academicTerm.failedStatus == 'PASSED' ? academicTerm.semesterMarkObtained : '-'}}</td>
		</tr>
	{% endfor %}
	</tbody>
	</table>
	{% if data.isPrint == 1 %}
		{{ _self.render_footer() }}
	{% endif %}
</div>