Skip to content

ISF Style guide

Pattern e classi del tema ISF. I pattern vengono letti automaticamente da resources/patterns/. Cerca questi nomi in Inserisci blocchi → Pattern → ISF.

Spaziatura verticale

Aggiungi sul WH Container esterno (Additional CSS class). I pattern non hanno margini verticali di default.

Classe Effetto
isf-block Root pattern: azzera margini verticali
isf-py-section Padding top + bottom (~80px)
isf-pt-section Padding top
isf-pb-section Padding bottom
isf-my-section Margin top + bottom
isf-mt-section Margin top
isf-mb-section Margin bottom

Spaziature rapide

Utility Tailwind singole per margin e padding verticali. Sono safelistate anche in versione con `!important` (es. `!mt-8`, `!pb-12`).

Margin top

Classe Effetto
mt-0 / !mt-0 Margin top 0
mt-px / !mt-px Margin top 1px
mt-0.5 / !mt-0.5 Margin top 2px
mt-1 / !mt-1 Margin top 4px
mt-1.5 / !mt-1.5 Margin top 6px
mt-2 / !mt-2 Margin top 8px
mt-2.5 / !mt-2.5 Margin top 10px
mt-3 / !mt-3 Margin top 12px
mt-3.5 / !mt-3.5 Margin top 14px
mt-4 / !mt-4 Margin top 16px
mt-5 / !mt-5 Margin top 20px
mt-6 / !mt-6 Margin top 24px
mt-7 / !mt-7 Margin top 28px
mt-8 / !mt-8 Margin top 32px
mt-9 / !mt-9 Margin top 36px
mt-10 / !mt-10 Margin top 40px
mt-11 / !mt-11 Margin top 44px
mt-12 / !mt-12 Margin top 48px
mt-14 / !mt-14 Margin top 56px
mt-16 / !mt-16 Margin top 64px
mt-20 / !mt-20 Margin top 80px
mt-24 / !mt-24 Margin top 96px
mt-28 / !mt-28 Margin top 112px
mt-32 / !mt-32 Margin top 128px
mt-36 / !mt-36 Margin top 144px
mt-40 / !mt-40 Margin top 160px
mt-44 / !mt-44 Margin top 176px
mt-48 / !mt-48 Margin top 192px
mt-52 / !mt-52 Margin top 208px
mt-56 / !mt-56 Margin top 224px
mt-60 / !mt-60 Margin top 240px
mt-64 / !mt-64 Margin top 256px
mt-72 / !mt-72 Margin top 288px
mt-80 / !mt-80 Margin top 320px
mt-96 / !mt-96 Margin top 384px

Margin bottom

Classe Effetto
mb-0 / !mb-0 Margin bottom 0
mb-px / !mb-px Margin bottom 1px
mb-0.5 / !mb-0.5 Margin bottom 2px
mb-1 / !mb-1 Margin bottom 4px
mb-1.5 / !mb-1.5 Margin bottom 6px
mb-2 / !mb-2 Margin bottom 8px
mb-2.5 / !mb-2.5 Margin bottom 10px
mb-3 / !mb-3 Margin bottom 12px
mb-3.5 / !mb-3.5 Margin bottom 14px
mb-4 / !mb-4 Margin bottom 16px
mb-5 / !mb-5 Margin bottom 20px
mb-6 / !mb-6 Margin bottom 24px
mb-7 / !mb-7 Margin bottom 28px
mb-8 / !mb-8 Margin bottom 32px
mb-9 / !mb-9 Margin bottom 36px
mb-10 / !mb-10 Margin bottom 40px
mb-11 / !mb-11 Margin bottom 44px
mb-12 / !mb-12 Margin bottom 48px
mb-14 / !mb-14 Margin bottom 56px
mb-16 / !mb-16 Margin bottom 64px
mb-20 / !mb-20 Margin bottom 80px
mb-24 / !mb-24 Margin bottom 96px
mb-28 / !mb-28 Margin bottom 112px
mb-32 / !mb-32 Margin bottom 128px
mb-36 / !mb-36 Margin bottom 144px
mb-40 / !mb-40 Margin bottom 160px
mb-44 / !mb-44 Margin bottom 176px
mb-48 / !mb-48 Margin bottom 192px
mb-52 / !mb-52 Margin bottom 208px
mb-56 / !mb-56 Margin bottom 224px
mb-60 / !mb-60 Margin bottom 240px
mb-64 / !mb-64 Margin bottom 256px
mb-72 / !mb-72 Margin bottom 288px
mb-80 / !mb-80 Margin bottom 320px
mb-96 / !mb-96 Margin bottom 384px

Padding top

Classe Effetto
pt-0 / !pt-0 Padding top 0
pt-px / !pt-px Padding top 1px
pt-0.5 / !pt-0.5 Padding top 2px
pt-1 / !pt-1 Padding top 4px
pt-1.5 / !pt-1.5 Padding top 6px
pt-2 / !pt-2 Padding top 8px
pt-2.5 / !pt-2.5 Padding top 10px
pt-3 / !pt-3 Padding top 12px
pt-3.5 / !pt-3.5 Padding top 14px
pt-4 / !pt-4 Padding top 16px
pt-5 / !pt-5 Padding top 20px
pt-6 / !pt-6 Padding top 24px
pt-7 / !pt-7 Padding top 28px
pt-8 / !pt-8 Padding top 32px
pt-9 / !pt-9 Padding top 36px
pt-10 / !pt-10 Padding top 40px
pt-11 / !pt-11 Padding top 44px
pt-12 / !pt-12 Padding top 48px
pt-14 / !pt-14 Padding top 56px
pt-16 / !pt-16 Padding top 64px
pt-20 / !pt-20 Padding top 80px
pt-24 / !pt-24 Padding top 96px
pt-28 / !pt-28 Padding top 112px
pt-32 / !pt-32 Padding top 128px
pt-36 / !pt-36 Padding top 144px
pt-40 / !pt-40 Padding top 160px
pt-44 / !pt-44 Padding top 176px
pt-48 / !pt-48 Padding top 192px
pt-52 / !pt-52 Padding top 208px
pt-56 / !pt-56 Padding top 224px
pt-60 / !pt-60 Padding top 240px
pt-64 / !pt-64 Padding top 256px
pt-72 / !pt-72 Padding top 288px
pt-80 / !pt-80 Padding top 320px
pt-96 / !pt-96 Padding top 384px

Padding bottom

Classe Effetto
pb-0 / !pb-0 Padding bottom 0
pb-px / !pb-px Padding bottom 1px
pb-0.5 / !pb-0.5 Padding bottom 2px
pb-1 / !pb-1 Padding bottom 4px
pb-1.5 / !pb-1.5 Padding bottom 6px
pb-2 / !pb-2 Padding bottom 8px
pb-2.5 / !pb-2.5 Padding bottom 10px
pb-3 / !pb-3 Padding bottom 12px
pb-3.5 / !pb-3.5 Padding bottom 14px
pb-4 / !pb-4 Padding bottom 16px
pb-5 / !pb-5 Padding bottom 20px
pb-6 / !pb-6 Padding bottom 24px
pb-7 / !pb-7 Padding bottom 28px
pb-8 / !pb-8 Padding bottom 32px
pb-9 / !pb-9 Padding bottom 36px
pb-10 / !pb-10 Padding bottom 40px
pb-11 / !pb-11 Padding bottom 44px
pb-12 / !pb-12 Padding bottom 48px
pb-14 / !pb-14 Padding bottom 56px
pb-16 / !pb-16 Padding bottom 64px
pb-20 / !pb-20 Padding bottom 80px
pb-24 / !pb-24 Padding bottom 96px
pb-28 / !pb-28 Padding bottom 112px
pb-32 / !pb-32 Padding bottom 128px
pb-36 / !pb-36 Padding bottom 144px
pb-40 / !pb-40 Padding bottom 160px
pb-44 / !pb-44 Padding bottom 176px
pb-48 / !pb-48 Padding bottom 192px
pb-52 / !pb-52 Padding bottom 208px
pb-56 / !pb-56 Padding bottom 224px
pb-60 / !pb-60 Padding bottom 240px
pb-64 / !pb-64 Padding bottom 256px
pb-72 / !pb-72 Padding bottom 288px
pb-80 / !pb-80 Padding bottom 320px
pb-96 / !pb-96 Padding bottom 384px

Layout e sezioni

Classe Uso
isf-breakout Sfondo sezione a tutta larghezza (contenuto in isf-section__inner)
text-left Allinea testo a sinistra (Tailwind, Additional CSS class)
text-center Centra il testo (Tailwind, Additional CSS class)
text-right Allinea testo a destra (Tailwind, Additional CSS class)
isf-section__inner Contenuto allineato al menu (1280px + gutter)
isf-section--light Sfondo bianco, testo navy
isf-section--grey Sfondo gray-200, testo navy
isf-section--dark Sfondo navy, titoli bianchi
isf-container Max-width 1280px centrato
isf-pill Tag / pill azzurro (su paragrafo)
isf-media-text Sezione due colonne testo + immagine
isf-value-props Value proposition (righe alternate)
isf-hero Hero homepage (header)
isf-section--hero Sfondo gray-800, hero centrato
isf-hero-media Header pagina con featured (VideoContainer)
isf-breadcrumbs Striscia breadcrumb (neutra)
isf-glance Statistiche ISF at a Glance
isf-section--glance Sfondo navy, stats in riga
isf-section--faq Sfondo grigio, sezione FAQ con shortcode
isf-faq-section Wrapper pattern FAQ Section
isf-lead-magnet Lead magnet (titolo + WS Form)
isf-section--lead-magnet Sfondo navy, sezione lead magnet
isf-text-cta Testo + CTA singola (sfondo chiaro)
isf-page-blocks Due blocchi editoriali testo + immagine (chiaro)
isf-page-block-dark Blocco editoriale testo su navy
isf-cta-banner Titolo centrato + doppia CTA
isf-academics-section Sezione carosello post (cards) + shortcode
isf-archive Griglia card archivi blog/CPT
isf-gallery-section Sezione galleria immagini + shortcode [wh_gallery]
isf-gallery-logos Sezione logo strip marquee + [wh_gallery style="3"]
isf-contacts-section Sezione scheda contatti
isf-contacts-card Scheda dati aziendali (shortcode)
isf-contact-form Card contact form + WS Form
isf-section--contact-form Sfondo grigio, card form centrata
isf-ws-form--dark Utility WS Form: label/testi chiari su sfondo scuro
isf-story-masonry Storia + masonry + missione
isf-count Contatore animato al scroll (es. 540+)
isf-btn--block Bottone a larghezza piena (colonna media-text)

Colori veloci

Utility rapide per cambiare solo sfondo o solo testo. Le classi sono safelistate anche in versione con `!important` (es. `!bg-gray-200`, `!text-primary`).

Background

Classe Uso
bg-white / !bg-white Sfondo bianco
bg-primary / !bg-primary Sfondo brand navy
bg-primary-800 / !bg-primary-800 Sfondo blu scuro
bg-primary-950 / !bg-primary-950 Sfondo navy profondo
bg-secondary / !bg-secondary Sfondo giallo brand
bg-secondary-100 / !bg-secondary-100 Sfondo giallo chiaro
bg-secondary-200 / !bg-secondary-200 Sfondo giallo soft
bg-gray-50 / !bg-gray-50 Sfondo grigio molto chiaro
bg-gray-200 / !bg-gray-200 Sfondo grigio neutro
bg-gray-800 / !bg-gray-800 Sfondo grigio scuro

Testo

Classe Uso
text-primary / !text-primary Testo navy brand
text-primary-700 / !text-primary-700 Testo blu forte
text-primary-800 / !text-primary-800 Testo blu scuro
text-secondary / !text-secondary Testo giallo brand
text-secondary-500 / !text-secondary-500 Testo arancio/giallo forte
text-gray-50 / !text-gray-50 Testo quasi bianco
text-gray-600 / !text-gray-600 Testo grigio medio
text-gray-800 / !text-gray-800 Testo grigio scuro
text-gray-950 / !text-gray-950 Testo quasi nero
text-white / !text-white Testo bianco

Breadcrumb

Documentazione completa in Guida breadcrumb (menu Aspetto). In Personalizza → ISF — Documentazione tema trovi il link rapido.

Template Breadcrumb
ISF predefinito Automatico: breadcrumb sopra, poi H1 (page header).
ISF full width Automatico: breadcrumb sopra, poi H1.
ISF hero full width Integrati nella hero (testo chiaro sopra immagine o sfondo scuro), sopra H1.
ISF hero boxed Integrati nella hero (testo chiaro sopra immagine o sfondo scuro), sopra H1.
Blank Manuale: inserisci [isf_breadcrumbs] dove serve.
Homepage Nascosti (nessuna trail).

Shortcode (Blank): [isf_breadcrumbs]

Bottoni (Wh Button New)

Stili Gutenberg → Primary, Outline, Secondary, Outline secondary (+ versioni piccolo). Per la freccia: isf-btn isf-btn--arrow e la variante (es. isf-btn--primary).

  • is-style-isf-primary — Primary
  • is-style-isf-primary-sm — Primary — piccolo
  • is-style-isf-outline — Outline
  • is-style-isf-outline-sm — Outline — piccolo
  • is-style-isf-secondary — Secondary
  • is-style-isf-secondary-sm — Secondary — piccolo
  • is-style-isf-outline-secondary — Outline secondary
  • is-style-isf-outline-secondary-sm — Outline secondary — piccolo

Pattern ISF

Anteprima live di tutti i pattern registrati (esclusi quelli meta).

Bottoni — showcase

Pattern: 3

Bottoni ISF

Inserisci Wh Button New → pannello Stili → scegli Primary, Outline, Secondary o Outline secondary (versione piccolo per la taglia sm).

Primary Outline Secondary Outline secondary Primary piccolo Secondary piccolo
Classi CSS usate (13)
  • btn
  • btn-wh
  • has-body-font-size
  • has-h-3-font-size
  • is-style-isf-outline
  • is-style-isf-outline-secondary
  • is-style-isf-primary
  • is-style-isf-primary-sm
  • is-style-isf-secondary
  • is-style-isf-secondary-sm
  • py-10
  • wp-block-group
  • wp-block-heading

Header — Hero homepage

Pattern: 14

Lorem Ipsum Dolor Sit

Lorem Ipsum Dolor Sit Amet

Lorem Ipsum Dolor Sit

Lorem ipsum dolor sit amet consectetur

Lorem ipsum dolor sit amet consectetur. Ultrices metus eleifend cum facilisis id.
Lorem ipsum dolor sit amet consectetur. Ultrices metus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit

Classi CSS usate (31)
  • btn
  • btn-wh
  • has-body-xl-font-size
  • has-hero-lead-font-size
  • has-hero-title-font-size
  • is-style-isf-outline-secondary
  • is-style-isf-secondary
  • isf-block
  • isf-breakout
  • isf-hero
  • isf-hero__actions
  • isf-hero__copy
  • isf-hero__inner
  • isf-hero__lead
  • isf-hero__pills
  • isf-hero__title
  • isf-hero__trust
  • isf-hero__trust-dot
  • isf-hero__trust-dot--1
  • isf-hero__trust-dot--2
  • isf-hero__trust-dot--3
  • isf-hero__trust-dot\u002d\u002d1
  • isf-hero__trust-dot\u002d\u002d2
  • isf-hero__trust-dot\u002d\u002d3
  • isf-hero__trust-dots
  • isf-hero__trust-text
  • isf-pill
  • isf-section--hero
  • isf-section\u002d\u002dhero
  • wh-container
  • wp-block-heading

Pagina — Blocco testo (scuro)

Pattern: 20

Lorem ipsum dolor sit amet consectetur: adipiscing elit

Lorem ipsum dolor sit amet consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore. Orci varius natoque penatibus et magnis dis parturient montes.

  • Lorem ipsum: dolor sit amet consectetur adipiscing elit sed do eiusmod.
  • Lorem ipsum: ut enim ad minim veniam quis nostrud exercitation.
  • Lorem ipsum: duis aute irure dolor in reprehenderit in voluptate.
  • Lorem ipsum: ex ea commodo consequat, sunt in culpa qui officia.
  • Lorem ipsum: deserunt mollit anim id est laborum.
Classi CSS usate (13)
  • has-body-lg-font-size
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-page-block-dark
  • isf-page-block-dark__inner
  • isf-page-block-dark__title
  • isf-page-block-dark__title-accent
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • wh-container
  • wp-block-heading
  • wp-block-list

Pagina — Due blocchi testo e immagine

Pattern: 21

Lorem ipsum dolor sit amet consectetur adipiscing elit

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum.

Lorem ipsum dolor sit amet consectetur adipiscing elit:

  • Lorem ipsum: dolor sit amet consectetur adipiscing elit.
  • Lorem ipsum: sed do eiusmod tempor incididunt ut labore.
  • Lorem ipsum: ut enim ad minim veniam quis nostrud exercitation.
  • Lorem ipsum: duis aute irure dolor in reprehenderit.

Sed do eiusmod tempor incididunt ut labore et dolore

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit.

Classi CSS usate (18)
  • has-body-lg-font-size
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-media-text__content
  • isf-media-text__media
  • isf-media-text__row
  • isf-media-text__title
  • isf-page-blocks
  • isf-page-blocks__inner
  • isf-section--light
  • isf-section\u002d\u002dlight
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-block-list
  • wp-image-38

Pagina — Intro e Read more

Pattern: 24

Lorem ipsum dolor

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Sed do eiusmod tempor incididunt

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Ut labore et dolore magna aliqua

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Consectetur adipiscing elit

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint.

Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.

Lorem ipsum dolor

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.

Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur.

Integer nec odio praesent libero

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.

Nulla quis sem at nibh elementum

Maecenas mattis, egestas, arcu eros molestie erat, imperdiet imperdiet justo mi euismod ligula, id varius justo elit in magna.

Lorem ipsum: dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum: ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum: duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Classi CSS usate (29)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • has-h-4-font-size
  • is-style-isf-secondary
  • isf-block
  • isf-breakout
  • isf-media-text__content
  • isf-media-text__media
  • isf-media-text__row
  • isf-media-text__title
  • isf-page-blocks__inner
  • isf-readmore
  • isf-readmore__inner
  • isf-readmore__intro
  • isf-readmore__item
  • isf-readmore__lead
  • isf-readmore__list
  • isf-readmore__panel
  • isf-readmore__title
  • isf-readmore__toggle
  • isf-section--light
  • isf-section\u002d\u002dlight
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-image-38

Pagina — Tuition & Fees

Pattern: 27

Annual Tuition Fees

For the 2026-2027 Academic Year

Grade LevelStandard FeesCorporate Fees*
Early Years Program€14,950.00€17,190.00
Foundation - Grade 5€19,400.00€22,310.00
Middle School (Grades 6-8)€21,340.00€24,540.00
High School (Grades 9-10)€22,950.00€26,390.00
IB Diploma Programme (Grades 11-12)€26,420.00€30,370.00

*Corporate fees are applicable to those families for whom their employer pays for their children/s tuition. Please contact the Business Office via businessoffice@isfitaly.org for more details.

New Applicant Fees

For the 2026-2027 Academic Year

FeeStandard FeesCorporate Fees*
Application Fee (new applicants only, non-refundable). The Application Fee covers two consecutive application years€500.00€500.00
Entrance Fee (payable only on initial enrollment, non-refundable)
If a student departs ISF for two consecutive academic years and subsequently re-enrolls at the commencement of the third year, they are required to fully repay the Entrance Fee
€7,800.00€7,800.00

*Corporate fees are applicable to those families for whom their employer pays for their children/s tuition. Please contact the Business Office via businessoffice@isfitaly.org for more details.

Payment Deadlines

Application Fee: to be paid when application is initiated

Entrance Fee: to be paid within 15 days of receiving the official acceptance letter

Re-Enrollment 2026-2027: to be paid by January 7th, 2026

First Tuition Installment 2026-2027: to be paid by July 15th, 2026

Second Tuition Installment 2026-2027: to be paid by September 30th, 2026

Classi CSS usate (27)
  • btn
  • btn-wh
  • has-fixed-layout
  • has-h-2-font-size
  • has-h-4-font-size
  • has-text-align-right
  • is-style-isf-secondary
  • isf-block
  • isf-breakout
  • isf-btn--block
  • isf-btn\u002d\u002dblock
  • isf-fees-table
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-tuition-fees
  • isf-tuition-fees__actions
  • isf-tuition-fees__deadlines
  • isf-tuition-fees__deadlines-title
  • isf-tuition-fees__inner
  • isf-tuition-fees__lead
  • isf-tuition-fees__note
  • isf-tuition-fees__section
  • isf-tuition-fees__table
  • isf-tuition-fees__title
  • wh-container
  • wp-block-heading
  • wp-block-table

Scheda contatti completa

Pattern: 5

[isf_contacts_card]

Classi CSS usate (7)
  • isf-block
  • isf-breakout
  • isf-contacts-section
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-section__inner
  • wh-container

Sezione — Board of Directors

Pattern: 22

Board of Directors

[isf_person role="governance" layout="list"]

Classi CSS usate (11)
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-list-media-cta
  • isf-list-media-cta__inner
  • isf-list-media-cta__intro
  • isf-list-media-cta__title
  • isf-section--light
  • isf-section\u002d\u002dlight
  • wh-container
  • wp-block-heading

Sezione — Carosello post (cards)

Pattern: 2

Titolo sezione

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum.

Classi CSS usate (14)
  • has-body-lg-font-size
  • has-h-2-font-size
  • isf-academics-section
  • isf-academics-section__carousel
  • isf-academics-section__header
  • isf-academics-section__lead
  • isf-academics-section__title
  • isf-block
  • isf-breakout
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • isf-section__inner
  • wh-container
  • wp-block-heading

Sezione — Confronto età e classi

Pattern: 13

[isf_grade_guide]

Classi CSS usate (7)
  • isf-block
  • isf-breakout
  • isf-grade-guide-section
  • isf-grade-guide-section__inner
  • isf-section--light
  • isf-section\u002d\u002dlight
  • wh-container

Sezione — Contact form

Pattern: 4

Lorem Ipsum Dolor Sit Amet

[ws_form id="2"]

Classi CSS usate (12)
  • has-h-3-font-size
  • isf-block
  • isf-breakout
  • isf-contact-form
  • isf-contact-form__card
  • isf-contact-form__form
  • isf-contact-form__inner
  • isf-contact-form__title
  • isf-section--contact-form
  • isf-section\u002d\u002dcontact-form
  • wh-container
  • wp-block-heading

Sezione — Faculty & Staff

Pattern: 23

Our Faculty & Staff

[isf_person role="staff" layout="grid"]

Classi CSS usate (11)
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-list-media-cta
  • isf-list-media-cta__inner
  • isf-list-media-cta__intro
  • isf-list-media-cta__title
  • isf-section--light
  • isf-section\u002d\u002dlight
  • wh-container
  • wp-block-heading

Sezione — FAQ

Pattern: 7

[wh_faq title="FAQ Section"]

Classi CSS usate (7)
  • isf-block
  • isf-breakout
  • isf-faq-section
  • isf-section--faq
  • isf-section\u002d\u002dfaq
  • isf-section__inner
  • wh-container

Sezione — Galleria immagini

Pattern: 10

Classi CSS usate (8)
  • isf-block
  • isf-breakout
  • isf-gallery-section
  • isf-gallery-section__inner
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • isf-section__inner
  • wh-container

Sezione — ISF at a Glance

Pattern: 12

ISF at a Glance


540+

Students

38+

Nationalities

2

Historic Campuses

90+

Dedicated
Faculty Members

7:1

Student-to-Teacher
Ratio

Classi CSS usate (20)
  • has-alpha-channel-opacity
  • has-h-2-font-size
  • has-h-4-font-size
  • isf-block
  • isf-breakout
  • isf-count
  • isf-glance
  • isf-glance__divider
  • isf-glance__inner
  • isf-glance__item
  • isf-glance__label
  • isf-glance__stats
  • isf-glance__title
  • isf-glance__title-accent
  • isf-glance__value
  • isf-section--glance
  • isf-section\u002d\u002dglance
  • wh-container
  • wp-block-heading
  • wp-block-separator

Sezione — Lead Magnet

Pattern: 16

Lead Magnet Section

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique. Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

[ws_form id="1"]

Classi CSS usate (15)
  • has-body-lg-font-size
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-lead-magnet
  • isf-lead-magnet__form
  • isf-lead-magnet__inner
  • isf-lead-magnet__intro
  • isf-lead-magnet__lead
  • isf-lead-magnet__title
  • isf-section--lead-magnet
  • isf-section\u002d\u002dlead-magnet
  • isf-section__inner
  • wh-container
  • wp-block-heading

Sezione — Lista, media e doppia CTA

Pattern: 17

Lorem ipsum dolor sit amet

  • Lorem ipsum: dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
  • Lorem ipsum: sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.
  • Lorem ipsum: duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Consectetur adipiscing elit

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Classi CSS usate (24)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • is-style-isf-primary
  • isf-block
  • isf-breakout
  • isf-list-media-cta
  • isf-list-media-cta__actions
  • isf-list-media-cta__inner
  • isf-list-media-cta__intro
  • isf-list-media-cta__title
  • isf-media-text__content
  • isf-media-text__media
  • isf-media-text__row
  • isf-media-text__title
  • isf-section--light
  • isf-section\u002d\u002dlight
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-block-list
  • wp-image-38

Sezione — Logo strip marquee

Pattern: 11

Classi CSS usate (8)
  • isf-block
  • isf-breakout
  • isf-gallery-logos
  • isf-gallery-logos__inner
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-section__inner
  • wh-container

Sezione — Media testo (chiaro)

Pattern: 19

Lorem Ipsum

Lorem Ipsum

Lorem Ipsum

Value Proposition Text

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

tortor viverra vel egestas volutpat tristique.

  • Lorem ipsum
  • Lorem ipsum dolor sit
  • Lorem ipsum dolor
  • Lorem ipsum dolor sit amet
Button text
Classi CSS usate (23)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • is-style-isf-primary
  • isf-block
  • isf-breakout
  • isf-media-text
  • isf-media-text__content
  • isf-media-text__inner
  • isf-media-text__media
  • isf-media-text__pills
  • isf-media-text__row
  • isf-media-text__title
  • isf-pill
  • isf-section--light
  • isf-section\u002d\u002dlight
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-block-list
  • wp-image-38

Sezione — Media testo (scuro)

Pattern: 18

Lorem Ipsum

Lorem Ipsum

Lorem Ipsum

Campus Experience

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

tortor viverra vel egestas volutpat tristique.

  • Lorem ipsum
  • Lorem ipsum dolor sit
  • Lorem ipsum dolor
  • Lorem ipsum dolor sit amet
Button text
Classi CSS usate (23)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • is-style-isf-secondary
  • isf-block
  • isf-breakout
  • isf-media-text
  • isf-media-text__content
  • isf-media-text__inner
  • isf-media-text__media
  • isf-media-text__pills
  • isf-media-text__row
  • isf-media-text__title
  • isf-pill
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-block-list
  • wp-image-38

Sezione — School history timeline

Pattern: 15

Our history

Classi CSS usate (13)
  • has-h-2-font-size
  • has-text-align-center
  • isf-block
  • isf-breakout
  • isf-history-section
  • isf-history-section__carousel
  • isf-history-section__inner
  • isf-history-section__title
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • isf-section__inner
  • wh-container
  • wp-block-heading

Sezione — Storia, masonry e missione

Pattern: 25

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Learn more

[wh_masonry]

Lorem ipsum dolor

Lorem ipsum: dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Lorem ipsum: ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.

Classi CSS usate (18)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • is-style-isf-primary
  • isf-block
  • isf-breakout
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-story-masonry
  • isf-story-masonry__closing
  • isf-story-masonry__gallery
  • isf-story-masonry__inner
  • isf-story-masonry__intro
  • isf-story-masonry__lead
  • isf-story-masonry__title
  • wh-container
  • wp-block-heading

Sezione — Testo e CTA

Pattern: 26

Titolo di sezione

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique. Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Button text
Classi CSS usate (16)
  • btn
  • btn-wh
  • has-body-lg-font-size
  • has-h-2-font-size
  • is-style-isf-primary
  • isf-block
  • isf-breakout
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-section__inner
  • isf-text-cta
  • isf-text-cta__body
  • isf-text-cta__inner
  • isf-text-cta__title
  • wh-container
  • wp-block-heading

Sezione — Titolo e doppia CTA

Pattern: 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Bibendum amet at molestie mattis.

Classi CSS usate (17)
  • btn
  • btn-wh
  • has-h-2-font-size
  • has-text-align-center
  • is-style-isf-outline
  • is-style-isf-primary
  • isf-block
  • isf-breakout
  • isf-cta-banner
  • isf-cta-banner__actions
  • isf-cta-banner__inner
  • isf-cta-banner__title
  • isf-section--light
  • isf-section\u002d\u002dlight
  • isf-section__inner
  • wh-container
  • wp-block-heading

Sezione — Value proposition

Pattern: 28

Lorem Ipsum Dolor Sit Amet

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique. Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem Ipsum Dolor Sit Amet

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem Ipsum Dolor Sit Amet

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem Ipsum Dolor Sit Amet

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem Ipsum Dolor Sit Amet

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Lorem ipsum dolor sit amet consectetur. Lobortis sagittis egestas commodo lectus vitae dictumst maecenas ipsum. Massa malesuada tortor viverra vel egestas volutpat tristique.

Classi CSS usate (21)
  • has-body-lg-font-size
  • has-h-2-font-size
  • isf-block
  • isf-breakout
  • isf-section--dark
  • isf-section\u002d\u002ddark
  • isf-value-props
  • isf-value-props__content
  • isf-value-props__intro
  • isf-value-props__media
  • isf-value-props__row
  • isf-value-props__row--img-left
  • isf-value-props__row--img-right
  • isf-value-props__row\u002d\u002dimg-left
  • isf-value-props__row\u002d\u002dimg-right
  • isf-value-props__rows
  • size-large
  • wh-container
  • wp-block-heading
  • wp-block-image
  • wp-image-38