{# <!--
    College header
--> #}

<div>
    {% if isBannerExist %}
    <div style="text-align: center; margin-bottom: 20px;">
        <img src="{{college.bannerImage}}" style="width: auto; max-width: 100%; height: 170px;" id="collegeBannerHeader">
    </div>
    {% else %}
    <div style="display: flex; justify-content: center; align-items: center; gap: 24px; page-break-inside: avoid; margin-bottom: 20px;">
        <div style="flex: 0 0 auto;">
            <img src="{{college.collegeLogo}}" style="width: auto; height: 100px;">
        </div>
        <div class="headerText" style="text-align: center;">
            <h3 class="m-0" style="font-size: 22px;">{{college.name|upper}}</h3>
            {% if college.affliate %}
            <h4 class="m-0" style="font-size: 16px; font-weight: normal;">{{college.affliate}}</h4>
            {% endif %}
            {% if college.address1 %}
            <div style="font-size: 13px;">{{college.address1}}</div>
            {% endif %}
            {% if college.address2 or college.collegeAddress2 %}
            <div style="font-size: 13px;">{{college.address2}} {{college.collegeAddress2}}</div>
            {% endif %}
        </div>
    </div>
    {% endif %}
</div>