Job title goes here 4

Alert
Info

Admissions

  • Academic
    • Introduction
    • Grades 6 to 10
    • Grades 11 and 12
    • Learning Support
    • Academic Results
    • Careers and University Guidance
    • Unique Collaborations
    • Global Campus
  • Boarding
    • Introduction
    • Daily Life at Beau Soleil
    • Weekends
    • Our Boarding Houses
    • Boarding House Team
    • Health and Wellbeing
    • High Expectations
  • Co-curricular
    • Introduction
    • The Hub
    • School Challenges
    • Creative and Performing Arts
    • Sports
      • Competitive Sports
      • Winter Programme
    • Outdoor Education
    • Trips
    • Clubs and Activities
  • Admissions
    • Application Process
    • Admissions Enquiry
    • Meet Our Admissions Team
    • Tuition and Fees
  • About Us
    • Our Heritage
    • Our Senior Leadership Team
    • Nord Anglia Education
    • News and Events
    • Careers
    • Term Dates
    • Contact Us
  • Summer Camp
    • Junior Campers
    • Teen Campers
    • Senior Campers
    • Odyssey week
    • Ask a question
    • Register for Summer Camp
  • Style Guide and Templates
    • SG - Content-with-Sidebar
    • SG - Home
    • SG - Academic
    • SG - Boarding
    • SG - Co-curricular
    • SG - Careers
    • SG - School Life
    • SG - Summer Camp
    • SG - News
    • SG - News Content

About UsNews and EventsAdmissionsSummer CampContact Us

CareersTerm Dates

Legal NoticePrivacy PolicyAccessibility

  • Home
  • Style Guide and Templates
  • Job title goes here 4

General

Getting Started

Heading 1 - This is my Heading 1 font : 50px

Heading 2 - This is my Heading 2 font : 35px

Heading 3 - This is my Heading 3 font : 30px

Heading 4 - This is my Heading 4 font : 25px

Heading 5 - This is my Heading 5 font : 20px
Heading 6 - This is my Heading 6 font : 18px

Fonts

Heading Font: Sangbleusans

Paragraph font: Helvetica / Roboto


Paragraph

Lorem ipsum dolor sit amet molestie cursus aliquet. Placerat bibendum fringilla torquent rhoncus nisi vitae aliquam felis maximus suscipit.

Interdum at magnis augue condimentum auctor ante. Non netus euismod purus finibus dui.


Social Icons

  •  
  •  
  •  
  •  
  •  
  •  

Block Quotes


OriginalImage,Original,branding

I don’t think many of us forget those inspiring words…when Miss Wood used to take us into her confidence and tell us what she expected us to be rather than to do. It was always the loftiest of ideal, sometimes over our head but it developed leaders and inspired others with a new outlook on life.

 

OriginalImage,Original,branding

I don't think many of us forget those inspiring words…when Miss Wood used to take us into her confidence and tell us what she expected us to be rather than to do. It was always the loftiest of ideal, sometimes over our head but it developed leaders and inspired others with a new outlook on life.


Colors

  • Blue (main color): #002654
  • Light-Blue: #0087CA
  • Other Blue: #223872
  • Red: #E35910
  • Yellow: #FFD931
  • Dark Gray(Defult text color): #49494F
  • Gray shade 1: #9D9D9D
  • Gray shade 2: #9D9D9D
  • Gray shade 3: #202020

Ordered List

  1. Number 1
  2. Number 2
  3. Number 3

Unordered List

  • Item 1
  • Item 2
  • Item 3

Buttons

site-button-primary

site-button-secondary

site-button-border-white

 

site-button-orange

site-button-border-primary

site-button-border-secondary

site-button-full-primary

site-button-full-secondary

site-button-full-border-white

 

site-button-full-orange

site-button-full-border-primary

site-button-full-border-secondaryr

Dynamic Modal Buttons

Youtube Video

Vimeo Video

Normal Video

 

Components

Page Classes

Hide the sidebar menu on a content with sidebar template page

  • custom-hide-sidebar-menu

Hide a page from the main navigation, while keeping it visible in the sidebar menu

  • hide-in-nav

Remove left column on sidebar template (add to page settings)

  • hide-left-column

Themes

  • White header - site-custom-secondary-theme
  • Changes features to have orange backgrounds - site-custom-orange-theme

Landing Pages - Page Class (banner overlays)

  • Academic (Light Blue) - site-custom-landing-light-blue
  • Boarding (Blue) - site-custom-landing-blue
  • Co-curriculum (Dark Blue) - site-custom-landing-dark-blue
     
Gallery Features

Feature Name: SG-Home - Hero Banner 1
Collection: Hero Banner
Class: site-custom-home-banner-one

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Home - Hero Banner 2
Collection: Hero Banner
Class: site-custom-home-banner-two

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Home - Hero Banner 3
Collection: Hero Banner
Class: site-custom-home-banner-three

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Home - Hero Banner 4
Collection: Hero Banner
Class: site-custom-home-banner-four

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Home - Globe gallery
Collection: Home
Class: site-custom-globe-gallery

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Home - Slide Gallery
Collection: Home
Class: site-custom-slide-gallery

  • site-custom-minus-top - this will make the gallery go over the top of the gallery above

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Take a tour with us
Collection: Gallery
Class: site-custom-map & custom-link-popup

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Hero - Bottom Banner CTA
Collection: MULTI MEDIA SLIDER
Class: site-custom-gallery-single & site-custom-gallery-double

  • site-custom-gallery-single - will show caption in middle of one image

  • site-custom-gallery-double - will show two images 50/50 - caption will be in middle of both images

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Academic - Hero Banner
Collection: Academic
Class: site-custom-landing-banner

  • To change the overlay on the landing banner refer to page classes above

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Academic - Information Gallery
Collection: Academic
Class: site-custom-information-gallery

  • site-custom-remove-top-gradient - removes top gradiant from hero banner
  • site-custom-remove-bottom-gradient - removes top gradiant from hero banner

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Academic - Grid gallery
Collection: Academic
Class: site-custom-grid & custom-link-popup

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Careers - Link Gallery 
Collection: Careers & LINK SLIDESHOW
Class: site-custom-link-gallery & custom-link-popup

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Careers - Gallery
Collection: Careers & LINK SLIDESHOW
Class: site-custom-hear-us-gallery & custom-link-popup

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - Summer Camp - Frequently Asked Questions
Collection: Gallery & SUMMER CAMP
Class: site-custom-gallery

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: SG - sidebar gallery
Collection: Gallery
Class: site-custom-sidebar-gallery

GO TO SETTINGS

 OptimizedImage,Optimized

DISPLAy Features

Feature Name: SG - Careers - Display
Collection: Display & OPPORTUNITIES
Class: site-custom-display

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Related Pages
Collection: Display & Related​​​​​​​
Class: No Class needed - this is a standard sidebar display feature

GO TO SETTINGS

 OptimizedImage,Optimized

Text Features

Feature Name: School Life - Content
Collection: Text & SCHOOL LIFE​​​​​​​

  • Add this class (site-custom-content-minus) to page class to have this effect with text overlaying image

GO TO SETTINGS

 OptimizedImage,Optimized

 

Feature Name: Style Guide - Content Image​​​​​​​ // Style Guide - Content Quote
Collection: Text
Class: See Below

  • site-custom-left-popout - This will pop content out left to edge of content
  • site-custom-left-popout-small - Same as above but halved
  • site-custom-right-popout - This will pop content out right to edge of content
  • site-custom-right-popout-small - Same as above but halved

See this page for examples of both - /sg---content-with-sidebar-components

GO TO SETTINGS - Image

GO TO SETTINGS - Text

 OptimizedImage,Optimized

 OptimizedImage,Optimized

Table Classes

No custom Table

Calendar Features

No custom Calendar features

Form Features
No custom Form features
Other Features Classes

No other custom features

Footer Features

Adding this to a paragraph within a text feature will keep the year up to date with the current year, regardless of the year typed into the span.
<span id="current-year">2022</span>


Example (set to 2022): 2024

 

Table with the same width columns

Class: site-table-same-width
Heading 1 Heading 2 Heading 3
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

 

Responsive table in mobile

Class: site-table-mobile
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

 

Responsive table with same width in mobile

Class: site-table-same-width site-table-mobile
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
  1 night per week  2 nights per week  3 nights per week 
Year 7, 8 and 9 £360 £715 £1,070
Year 10 and 11 £470 £935 £1,405
Year 12 and 13 £520 £1,040 £1,545
 
Class: site-table-mobile-stack
ID NAme Subject Grade School section
1 Sean Subj 1 Grade 1 Senior
2 Sean $2,443 Grade 2 Prep
3 Sean $1,181 Grade 1 Junior
4 Sean $842 Grade 3 Senior
5 Sean $99 Grade 3 Juni

 

Table Accordion

Class: site-table-accordion
Accordion Title 1
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Accordion Title 2
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Accordion Title 3

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Accordion Title 4
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

 

Table Accordion

Class: site-table-accordion site-table-accordion-arrow-first
Accordion Title 1
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Accordion Title 2
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Accordion Title 3

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
Accordion Title 4
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Style Guide - Calendar

Display Feature - Class: site-custom-display

Housemaster / Housemistress

Period
From September 2025 

Contract
Permanent

Closing Date:
19 May 2025

Find out more

Deputy Housemaster Deputy Housemistress

Period
From September 2025 

Contract
Permanent

Closing Date:
19 May 2025

Find out more

Boarding Assistant

Period
From September 2025 to June 2026

Contract
Maximum Contract Duration

Closing Date:
19 May 2025

Find out more

Contact us

Collège Alpin Beau Soleil
Route du Village 1
1884 Villars-sur-Ollon
Switzerland


info@beausoleil.ch
+41 24 496 2626

Information

News and events
Summer camp
Careers at Beau Soleil


Summer Camp
summercamp@beausoleil.ch
+41 24 496 26 46

Quick Access

Online payments
Term dates

Admissions

Application process
Application form 
Admission team
Terms and conditions

Admissions
admissions@beausoleil.ch
+41 24 496 2610

Policies

Legal notice
Website privacy and cookie policy
Accessibility statement

facebook instagram linkedin twitter youtube

Design by UBIQ, powered by AMAIS