<!-- HOME: Academic Pillars -->
<div class="pillars">
    <div class="fs-row">
        <div class="fs-cell fs-lg-11">

            <div class="pillars_inner">
                <div class="pillars_content_wrapper">
                    <h2 class="pillars_title">Your New Path to learning begins here.</h2>
                    <span class="pillars_description">Delve into a liberal arts and science education tailored to your academic interests, career aspirations, and individual learning style. Explore the New College approach to academics:</span>
                </div>
                <figure class="pillars_figure" aria-hidden="true">
                    <span class="lazy_image_wrapper pillars_image_wrapper">
                        <img class="js-lazy js-lazyload pillars_image" data-sizes="auto" src="//images.fastspot.com/new-college-of-florida/300x169/1" data-src="//images.fastspot.com/new-college-of-florida/740x416/1" data-srcset="//images.fastspot.com/new-college-of-florida/740x416/1 740w, //images.fastspot.com/new-college-of-florida/500x282/1 500w, //images.fastspot.com/new-college-of-florida/300x169/1 300w" alt="">
                    </span>
                    <noscript>
                        <img class="pillars_image" src="https://images.fastspot.com/new-college-of-florida/300x169/1" srcset="https://images.fastspot.com/new-college-of-florida/300x169/1 300w, https://images.fastspot.com/new-college-of-florida/500x282/1 500w, https://images.fastspot.com/new-college-of-florida/740x416/1 740w" sizes="100vw" alt="">
                    </noscript>
                </figure>
            </div>

            <div class="pillars_items">
                <div class="pillar">

                    <div class="pillar_inner">
                        <div class="pillar_header">
                            <button class="pillar_link js-swap" data-swap-target=".pillar_card_body_1" data-swap-group="pillars_group" data-swap-linked="pillar_1">
                                <span class="pillar_link_inner">
                                    <span class="pillar_title">Innoative Curriculum</span>
                                    <span class="academic_pillar_link_icon">
                                        <svg class="icon icon_expand">
                                            <use href="/images/icons.svg#expand" />
                                        </svg>
                                    </span>
                                </span>
                            </button>
                        </div>
                        <div class="pillar_card_body pillar_card_body_1" aria-live="polite">
                            <button class="card_close js-swap" data-swap-target=".pillar_card_body_1" data-swap-group="pillars_group" data-swap-linked="pillar_1">
                                <span class="academic_pillar_close_label">Close</span>
                                <span class="academic_pillar_close_icon">
                                    <svg class="icon icon_close">
                                        <use href="/images/icons.svg#close" />
                                    </svg>
                                </span>
                            </button>
                            <div class="pillar_card_inner">
                                <p class="pillar_card_title">Robust & Flexible Curriculum</p>
                                <p class="pillar_card_text">An expansive curriculum grounded in the arts and sciences that you can tailor to your interests and aspirations.</p>
                                <a href="##" class="pillar_card_link">
                                    <span class="pillar_card_link_inner">
                                        <span class="pillar_card_link_label">More About the New Curriculum</span>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="pillar">

                    <div class="pillar_inner">
                        <div class="pillar_header">
                            <button class="pillar_link js-swap" data-swap-target=".pillar_card_body_2" data-swap-group="pillars_group" data-swap-linked="pillar_2">
                                <span class="pillar_link_inner">
                                    <span class="pillar_title">Experiential Learning</span>
                                    <span class="academic_pillar_link_icon">
                                        <svg class="icon icon_expand">
                                            <use href="/images/icons.svg#expand" />
                                        </svg>
                                    </span>
                                </span>
                            </button>
                        </div>
                        <div class="pillar_card_body pillar_card_body_2" aria-live="polite">
                            <button class="card_close js-swap" data-swap-target=".pillar_card_body_2" data-swap-group="pillars_group" data-swap-linked="pillar_2">
                                <span class="academic_pillar_close_label">Close</span>
                                <span class="academic_pillar_close_icon">
                                    <svg class="icon icon_close">
                                        <use href="/images/icons.svg#close" />
                                    </svg>
                                </span>
                            </button>
                            <div class="pillar_card_inner">
                                <p class="pillar_card_title">Robust & Flexible Curriculum</p>
                                <p class="pillar_card_text">An expansive curriculum grounded in the arts and sciences that you can tailor to your interests and aspirations.</p>
                                <a href="##" class="pillar_card_link">
                                    <span class="pillar_card_link_inner">
                                        <span class="pillar_card_link_label">More About the New Curriculum</span>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="pillar">

                    <div class="pillar_inner">
                        <div class="pillar_header">
                            <button class="pillar_link js-swap" data-swap-target=".pillar_card_body_3" data-swap-group="pillars_group" data-swap-linked="pillar_3">
                                <span class="pillar_link_inner">
                                    <span class="pillar_title">Personalized Career Planning</span>
                                    <span class="academic_pillar_link_icon">
                                        <svg class="icon icon_expand">
                                            <use href="/images/icons.svg#expand" />
                                        </svg>
                                    </span>
                                </span>
                            </button>
                        </div>
                        <div class="pillar_card_body pillar_card_body_3" aria-live="polite">
                            <button class="card_close js-swap" data-swap-target=".pillar_card_body_3" data-swap-group="pillars_group" data-swap-linked="pillar_3">
                                <span class="academic_pillar_close_label">Close</span>
                                <span class="academic_pillar_close_icon">
                                    <svg class="icon icon_close">
                                        <use href="/images/icons.svg#close" />
                                    </svg>
                                </span>
                            </button>
                            <div class="pillar_card_inner">
                                <p class="pillar_card_title">Robust & Flexible Curriculum</p>
                                <p class="pillar_card_text">An expansive curriculum grounded in the arts and sciences that you can tailor to your interests and aspirations.</p>
                                <a href="##" class="pillar_card_link">
                                    <span class="pillar_card_link_inner">
                                        <span class="pillar_card_link_label">More About the New Curriculum</span>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="pillar">

                    <div class="pillar_inner">
                        <div class="pillar_header">
                            <button class="pillar_link js-swap" data-swap-target=".pillar_card_body_4" data-swap-group="pillars_group" data-swap-linked="pillar_4">
                                <span class="pillar_link_inner">
                                    <span class="pillar_title">Comprehensive Student Support</span>
                                    <span class="academic_pillar_link_icon">
                                        <svg class="icon icon_expand">
                                            <use href="/images/icons.svg#expand" />
                                        </svg>
                                    </span>
                                </span>
                            </button>
                        </div>
                        <div class="pillar_card_body pillar_card_body_4" aria-live="polite">
                            <button class="card_close js-swap" data-swap-target=".pillar_card_body_4" data-swap-group="pillars_group" data-swap-linked="pillar_4">
                                <span class="academic_pillar_close_label">Close</span>
                                <span class="academic_pillar_close_icon">
                                    <svg class="icon icon_close">
                                        <use href="/images/icons.svg#close" />
                                    </svg>
                                </span>
                            </button>
                            <div class="pillar_card_inner">
                                <p class="pillar_card_title">Robust & Flexible Curriculum</p>
                                <p class="pillar_card_text">An expansive curriculum grounded in the arts and sciences that you can tailor to your interests and aspirations.</p>
                                <a href="##" class="pillar_card_link">
                                    <span class="pillar_card_link_inner">
                                        <span class="pillar_card_link_label">More About the New Curriculum</span>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </div>
    </div>
</div>
<!-- END: Academic Pillars -->
<!-- HOME: Academic Pillars -->
<div class="pillars">
	<div class="fs-row">
		<div class="fs-cell fs-lg-11">

			<div class="pillars_inner">
				<div class="pillars_content_wrapper">
					<h2 class="pillars_title">{{ title }}</h2>
					<span class="pillars_description">{{ description }}</span>
					{% if link %}
						<a href="{{ link.url }}" class="pillars_link">
							<span class="pillars_link_inner">
								<span class="pillars_link_label">{{ link.label }}</span>
							</span>
						</a>
					{% endif %}
				</div>
				{% if image %}
					<figure class="pillars_figure" aria-hidden="true">
						{% include "@partial-image" with {
							class: "pillars",
							alt: "",
							image: image,
							sources: [
								img.wide.sml,
								img.wide.xsml,
								img.wide.xxsml
							]
						} %}
					</figure>
				{% endif %}
			</div>

			<div class="pillars_items">
				{% for item in items %}
					<div class="pillar">

						<div class="pillar_inner">
							<div class="pillar_header">
								<button class="pillar_link js-swap" data-swap-target=".pillar_card_body_{{ loop.index }}" data-swap-group="pillars_group" data-swap-linked="pillar_{{ loop.index }}">
									<span class="pillar_link_inner">
										<span class="pillar_title">{{ item.title|title }}</span>
										{% if item.icon %}
											<span class="academic_pillar_link_icon">{{ icon(item.icon) }}</span>
										{% endif %}
									</span>
								</button>
							</div>
							<div class="pillar_card_body pillar_card_body_{{ loop.index }}" aria-live="polite">
								<button class="card_close js-swap" data-swap-target=".pillar_card_body_{{ loop.index }}" data-swap-group="pillars_group" data-swap-linked="pillar_{{ loop.index }}">
									<span class="academic_pillar_close_label">Close</span>
									<span class="academic_pillar_close_icon">{{ icon("close") }}</span>
								</button>
								<div class="pillar_card_inner">
									<p class="pillar_card_title">{{ item.cardTitle }}</p>
									<p class="pillar_card_text">{{ item.description }}</p>
									{% if item.cardLink %}
										<a href="{{ item.cardLink }}" class="pillar_card_link">
											<span class="pillar_card_link_inner">
												<span class="pillar_card_link_label">{{ item.cardLabel}}</span>
											</span>
										</a>
									{% endif %}
								</div>
							</div>
						</div>

					</div>
				{% endfor %}
			</div>

		</div>
	</div>
</div>
<!-- END: Academic Pillars -->

No notes defined.