/* rgb(0,120,107) */
/* rgb(215,143,86) */
/* rgb(255,246,219) */
/* rgb(166,63,37) */
/* rgb(73,139,147) */
/* rgb(177,106,0) */
/* multiples of 8 - to avoid half pixels */
/* based on heading height + 4x3 image: height = (3 x width)/4 + heading_height + (heading_padding x 2) */
/* based on heading height + 4x3 image: height = (3 x width)/4 + heading_height + (heading_padding x 2) */
.normal {
  font-weight: normal;
  font-family: 'open_sansregular';
}
.bold {
  font-weight: normal;
  font-family: 'open_sansbold';
}
.extra_bold {
  font-weight: normal;
  font-family: 'open_sansextrabold';
}
.italic {
  font-style: normal;
  font-family: 'open_sansitalic';
}
.menu_font {
  font-weight: normal;
  font-family: 'open_sansbold';
}
.red_cream {
  color: #A63F25;
  background-color: #FFF6DB;
}
.cream_red {
  color: #FFF6DB;
  background-color: #A63F25;
}
.cream_teal {
  color: #FFF6DB;
  background-color: #00786B;
}
.cream_blue {
  color: #FFF6DB;
  background-color: #498B93;
}
.cream_brown {
  color: #FFF6DB;
  background-color: #B16A00;
}
.cream_orange {
  color: #FFF6DB;
  background-color: #D78F56;
}
.light_link:link,
.light_link:visited {
  color: #FFF6DB;
}
.light_link:hover,
.light_link active {
  color: #A63F25;
}
.outline {
  outline: 1px solid red;
}
.bg_red {
  background-color: red;
}
.bg_blue {
  background-color: blue;
}
.bg_green {
  background-color: green;
}
.reset_list {
  margin: 0;
  padding: 0;
  list-style: none outside;
  background: none;
}
.reset_list li {
  margin: 0;
  padding: 0;
  background: none;
}
.full_width_heading {
  /* full width effect for headings */
}
.full_width_heading:before,
.full_width_heading:after {
  opacity: 0.2;
  /* overlays on .full_width overlay to give darkened effect */
}
.full_left_heading {
  /* full width heading - left hand side only */
  /* full width - left hand side only */
  position: relative;
}
.full_left_heading:before {
  content: "";
  position: absolute;
  background: black;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
  right: 100%;
}
.full_left_heading:before {
  opacity: 0.2;
  /* overlays on grid block to give darkened effect */
}
.full_right_heading {
  /* full width heading - right hand side only */
  /* full width - right hand side only */
  position: relative;
}
.full_right_heading:after {
  content: "";
  position: absolute;
  background: black;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
  left: 100%;
}
.full_right_heading:after {
  opacity: 0.2;
  /* overlays on grid block to give darkened effect */
  z-index: 99;
}
.basic_page #sub_wrapper {
  background-color: #00786B;
}
.basic_page h1 {
  padding: 0.5em;
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
  font-size: 4em;
}
.basic_page h1:before,
.basic_page h1:after {
  content: "";
  position: absolute;
  background: #B16A00;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
.basic_page h1:before {
  right: 100%;
}
.basic_page h1:after {
  left: 100%;
}
.basic_page #sub_content {
  /* on all pages except home */
  padding: 2em;
  min-height: 56em;
  /* full width effect (but not under sidebar) - only works for blocks that run to right hand side */
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
}
.basic_page #sub_content:before,
.basic_page #sub_content:after {
  content: "";
  position: absolute;
  background: #FFF6DB;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
.basic_page #sub_content:before {
  right: 100%;
}
.basic_page #sub_content:after {
  left: 100%;
}
.basic_page #sub_content:after {
  left: 112em;
  /* to shift under quicklinks i.e. not cock up faux column effect*/
}
.basic_page #sub_content > p:first-of-type {
  /* first para on page that is direct descendent of #sub_content */
  margin-top: 0;
  font-weight: normal;
  font-family: 'open_sansbold';
  font-size: 1.7em;
}
.basic_page #sub_content > article:first-child > h2:first-of-type,
.basic_page #sub_content > article:first-child > figure {
  /* first (live) article image i.e. not preceded by (sticky) article */
  margin-top: 0;
}
.basic_page #sub_content figure + h2 {
  /* stop a long heading bust below images */
  max-width: 28.14814815em;
}
/* predictable random heading colours */
body.heading_blue h1 {
  color: #FFF6DB;
  background-color: #498B93;
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
}
body.heading_blue h1:before,
body.heading_blue h1:after {
  content: "";
  position: absolute;
  background: #498B93;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
body.heading_blue h1:before {
  right: 100%;
}
body.heading_blue h1:after {
  left: 100%;
}
body.heading_blue h1.darken {
  background-color: #448189;
}
body.heading_brown h1 {
  color: #FFF6DB;
  background-color: #B16A00;
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
}
body.heading_brown h1:before,
body.heading_brown h1:after {
  content: "";
  position: absolute;
  background: #B16A00;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
body.heading_brown h1:before {
  right: 100%;
}
body.heading_brown h1:after {
  left: 100%;
}
body.heading_brown h1.darken {
  background-color: #a26100;
}
body.heading_red h1 {
  color: #FFF6DB;
  background-color: #A63F25;
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
}
body.heading_red h1:before,
body.heading_red h1:after {
  content: "";
  position: absolute;
  background: #A63F25;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
body.heading_red h1:before {
  right: 100%;
}
body.heading_red h1:after {
  left: 100%;
}
body.heading_red h1.darken {
  background-color: #993a22;
}
.figure {
  padding: 0.9em;
  background-color: #fefefe;
  border: 0.1em solid #ddd;
}
.plain_table table tr th {
  padding-left: 0;
  text-align: left;
}
.plain_table table tr td {
  padding-left: 0;
  text-align: left;
}
/* darken slightly in case drops down over same colour */
/* darken slightly in case drops down over same colour */
#menu_wrapper {
  /* wrapper needed for full width effect */
  height: 4em;
  /* specify height (overflow:hidden on nav clashes with centering menu, overflow:hidden here cocks up full width) */
  background-color: #D78F56;
  /* full width effect - works for all, regardless of x-position but may do unwanted overlay on short side bar (see full_width_alt) */
  position: relative;
}
#menu_wrapper:before,
#menu_wrapper:after {
  content: "";
  position: absolute;
  background: #D78F56;
  opacity: 0.7;
  /* overlays on html black background to give darkened effect */
  top: 0;
  bottom: 0;
  width: 9999px;
}
#menu_wrapper:before {
  right: 100%;
}
#menu_wrapper:after {
  left: 100%;
}
nav.main {
  /* wrapper needed for centered menus */
}
#mainmenu {
  /* top level only */
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 1em;
  line-height: 1.1;
}
#mainmenu li {
  float: left;
  font-size: 1em;
}
#mainmenu li a {
  display: block;
  padding: 1em 1.8em 1em 1.8em;
  color: #FFF6DB;
  text-decoration: none;
  text-align: center;
}
#mainmenu li a span {
  font-size: 1.8em;
  font-weight: normal;
  font-family: 'open_sansbold';
  text-transform: uppercase;
}
#mainmenu li:hover a {
  color: #A63F25;
}
#mainmenu li:hover li a {
  color: #FFF6DB;
}
#mainmenu li li.menuparent > a {
  /* menu parent indicator */
  background: url(../../images/iconmonstr-arrow-37-icon-12-cream.png) 95% 50% no-repeat transparent;
}
/* http://matthewjamestaylor.com/blog/centered-dropdown-menus */
nav.main {
  float: left;
  width: 100%;
  position: relative;
  z-index: 999;
}
#mainmenu {
  clear: left;
  float: right;
  position: relative;
  right: 50%;
  text-align: center;
}
#mainmenu li {
  position: relative;
  left: 50%;
}
/* second level */
#mainmenu ul {
  display: none;
  /* hidden by default */
  list-style: none;
  position: absolute;
  top: 3.9em;
  /* slight overlap - fix for Safari hover */
  left: 1.8em;
  margin: 0;
  padding: 0;
  font-size: 1em;
  background-color: #448189;
  /* hides the cracks on iPad when page scaled down slightly */
}
#mainmenu ul li {
  float: none;
  left: auto;
  padding: 0;
}
#mainmenu ul li a {
  padding: 1em;
  width: 18em;
  background-color: #448189;
  text-align: left;
}
#mainmenu ul li a span {
  font-weight: normal;
  font-family: 'open_sansregular';
}
#mainmenu ul li a:hover {
  background-color: #336167;
}
/* shift left the last 2nd level submenu so it stays within the page */
#mainmenu > li.last ul {
  left: auto;
  right: 0;
}
/* peekaboo */
#mainmenu li:hover ul {
  display: block;
}
#mainmenu li:hover ul ul {
  display: none;
}
/* second level menu_pointy bits */
#mainmenu > li > ul > li:first-child > a:after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: 1em;
  top: -0.8em;
  border-left: 0.8em solid transparent;
  border-right: 0.8em solid transparent;
  border-bottom: 0.8em solid #448189;
}
#mainmenu > li > ul > li:first-child > a:hover:after {
  border-bottom-color: #336167;
}
#mainmenu > li.last > ul > li:first-child > a:after {
  /* tweak last top level submenu  */
  left: auto;
  right: 3em;
}
/* third level */
#mainmenu ul ul {
  display: block;
  /* hidden by default */
  top: 0;
  left: auto;
  right: -20em;
  background-color: #a26100;
  /* hides the cracks on iPad when page scaled down slightly */
}
#mainmenu ul ul li a {
  background-color: #a26100;
}
/* shift left the penultimate & last 2nd level submenu's submenu so it stays within the page */
#mainmenu > li:nth-last-child(2) ul ul,
#mainmenu > li.last ul ul {
  left: -20em;
  right: auto;
}
/* peepo */
#mainmenu ul li:hover ul {
  display: block;
}
#mainmenu ul ul li:hover a {
  background-color: #6f4200;
}
/* third level menu_pointy bits */
#mainmenu li ul li ul li:first-child a:after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  left: -1.5em;
  /* slight overlap to avoid gap if user zooms in */
  top: 1.3em;
  /* to get it in the middle of line (tweaked) */
  border-top: 0.8em solid transparent;
  border-right: 0.8em solid #a26100;
  border-bottom: 0.8em solid transparent;
  border-left: 0.8em solid transparent;
}
#mainmenu ul ul li:first-child a:hover:after {
  border-right-color: #6f4200;
}
/* penultimate & last top level submenu tweak */
#mainmenu > li:nth-last-child(2) ul ul li:first-child a:after,
#mainmenu > li.last ul ul li:first-child a:after {
  left: 19.9em;
  /* adjust overlap slightly */
  border-top: 0.8em solid transparent;
  border-right: 0.8em solid transparent;
  border-bottom: 0.8em solid transparent;
  border-left: 0.8em solid #a26100;
}
#mainmenu > li:nth-last-child(2) ul ul li:first-child a:hover:after,
#mainmenu > li.last ul ul li:first-child a:hover:after {
  border-left-color: #6f4200;
}
/* BREADCRUMB */
div#breadcrumb {
  float: right;
  margin: 0 0 2em 2em;
  display: inline-block;
  padding: 1em 0 1em 0.9em;
  font-size: 1.2em;
  color: #FFF6DB;
  font-weight: normal;
  font-family: 'open_sansbold';
  background-color: #B16A00;
  overflow: hidden;
}
div#breadcrumb span {
  position: relative;
}
div#breadcrumb span:after {
  /* label pointy */
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  right: -0.5em;
  top: 0.2em;
  z-index: 9;
  border-top: 0.5em solid transparent;
  border-bottom: 0.5em solid transparent;
  border-left: 0.5em solid #B16A00;
}
div#breadcrumb a {
  position: relative;
  padding: 1em 0.8em 1em 1.2em;
  background-color: #00786B;
  /* label pointy */
  /*
		&:first-of-type {
			&:before {
				content:'';
				position:absolute;
				width:0;
				height:0;
				left:0;
				top:1.2em;
				border-top:0.5em solid transparent;
				border-bottom:0.5em solid transparent;
				border-left:0.5em solid @brown;
			}
		}
 */
}
div#breadcrumb a:link,
div#breadcrumb a:visited {
  color: #FFF6DB;
  text-decoration: none;
}
div#breadcrumb a:hover,
div#breadcrumb a:active {
  background-color: #005f54;
}
div#breadcrumb a:hover:after,
div#breadcrumb a:active:after {
  border-left-color: #005f54;
}
div#breadcrumb a:after {
  /* pointy */
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  right: -0.5em;
  top: 1.2em;
  z-index: 9;
  border-top: 0.5em solid transparent;
  border-bottom: 0.5em solid transparent;
  border-left: 0.5em solid #00786B;
}
div#breadcrumb a + a {
  background-color: #498B93;
}
div#breadcrumb a + a:after {
  border-left-color: #498B93;
}
div#breadcrumb a + a:hover,
div#breadcrumb a + a:active {
  background-color: #386b71;
}
div#breadcrumb a + a:hover:after,
div#breadcrumb a + a:active:after {
  border-left-color: #386b71;
}
div#breadcrumb a + a + a {
  background-color: #A63F25;
}
div#breadcrumb a + a + a:after {
  border-left-color: #A63F25;
}
div#breadcrumb a + a + a:hover,
div#breadcrumb a + a + a:active {
  background-color: #7c2f1c;
}
div#breadcrumb a + a + a:hover:after,
div#breadcrumb a + a + a:active:after {
  border-left-color: #7c2f1c;
}
div#breadcrumb a + a + a + a {
  background-color: #D78F56;
}
div#breadcrumb a + a + a + a:after {
  border-left-color: #D78F56;
}
div#breadcrumb a + a + a + a:hover,
div#breadcrumb a + a + a + a:active {
  background-color: #b6682b;
}
div#breadcrumb a + a + a + a:hover:after,
div#breadcrumb a + a + a + a:active:after {
  border-left-color: #b6682b;
}
/* QUICKLINKS SIDEBAR MENU */
#quicklinks {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 1em;
}
#quicklinks li {
  font-size: 1em;
}
#quicklinks li a {
  display: block;
  padding: 0.5em 0 0.5em 3.5em;
  color: #FFF6DB;
  text-decoration: none;
  line-height: 1.5;
  font-size: 1.8em;
  font-weight: normal;
  font-family: 'open_sansregular';
  background: url(../../images/iconmonstr-check-mark-4-icon-24-cream.png) 1em 50% no-repeat transparent;
}
#quicklinks li a:hover {
  background-color: #005f54;
}
#quicklinks li a[href*="art"] {
  background-image: url(../../images/iconmonstr-picture-2-icon-24-cream.png);
}
#quicklinks li a[href*="calendar"] {
  background-image: url(../../images/iconmonstr-calendar-4-icon-24-cream.png);
}
#quicklinks li a[href*="canteen"] {
  /*
		background-image:url(../../images/iconmonstr-coffee-3-icon-24-cream.png);
 */
  background-image: url(../../images/knife-fork-spoon-24-cream.png);
}
#quicklinks li a[href*="excursions"] {
  /*
		background-image:url(../../images/iconmonstr-map-2-icon-24-cream.png);
		background-image:url(../../images/bus-24-cream.png);
 */
  background-image: url(../../images/iconmonstr-direction-17-24-cream.png);
}
#quicklinks li a[href*="featured"] {
  background-image: url(../../images/iconmonstr-map-2-icon-24-cream.png);
}
#quicklinks li a[href*="faq"] {
  background-image: url(../../images/iconmonstr-help-3-icon-24-cream.png);
}
#quicklinks li a[href*="forms"] {
  background-image: url(../../images/iconmonstr-text-file-4-icon-24-cream.png);
}
#quicklinks li a[href*="newsletter"] {
  background-image: url(../../images/iconmonstr-newspaper-4-icon-24-cream.png);
}
#quicklinks li a[href*="music"] {
  background-image: url(../../images/iconmonstr-audio-7-icon-24-cream.png);
}
#quicklinks li a[href*="photo"] {
  background-image: url(../../images/iconmonstr-picture-multi-2-icon-24-cream.png);
}
#quicklinks li a[href*="podcast"] {
  background-image: url(../../images/iconmonstr-audio-4-icon-24-cream.png);
}
#quicklinks li a[href*="school-bus"] {
  background-image: url(../../images/bus-24-cream.png);
}
#quicklinks li a[href*="search"] {
  background-image: url(../../images/iconmonstr-magnifier-2-icon-24-cream.png);
}
#quicklinks li a[href*="sitemap"] {
  background-image: url(../../images/iconmonstr-bulleted-list-icon-24-cream.png);
}
#quicklinks li a[href*="staff"] {
  background-image: url(../../images/iconmonstr-user-13-icon-24-cream.png);
}
#quicklinks li a[href*="uniform"] {
  background-image: url(../../images/1404805348_shirt_t-shirt-24-cream.png);
  /*
		background-image:url(../../images/icons8-Shirt-Filled-24-cream.png);
 */
}
#quicklinks li a[href*="videos"] {
  background-image: url(../../images/iconmonstr-video-5-icon-24-cream.png);
}
#sub_content {
  /* on all pages except home */
  /* SUBMENU */
}
#sub_content nav.submenu {
  clear: both;
  overflow: hidden;
}
#sub_content nav.submenu ul {
  list-style: none outside;
}
#sub_content nav.submenu ul li {
  float: left;
  margin: 2em 0 0 2em;
  width: 18.5em;
  padding: 0;
  font-size: 1em;
}
#sub_content nav.submenu ul li a {
  display: block;
  height: 6em;
  padding: 1em 1.5em 1em 1em;
  font-size: 1.8em;
  line-height: 1;
  background: url(../../images/iconmonstr-arrow-37-icon-16-cream.png) 9.07777778em 6.5em no-repeat transparent;
}
#sub_content nav.submenu ul li a:link,
#sub_content nav.submenu ul li a:visited {
  color: #FFF6DB;
  text-decoration: none;
}
#sub_content nav.submenu ul li a span {
  font-size: 0.8em;
  font-weight: normal;
  font-family: 'open_sansregular';
}
#sub_content nav.submenu ul li:nth-child(4n+1) {
  margin-left: 0;
}
#sub_content nav.submenu ul li:nth-child(5n+1) a:link,
#sub_content nav.submenu ul li:nth-child(5n+1) a:visited {
  background-color: #00786B;
}
#sub_content nav.submenu ul li:nth-child(5n+1) a:hover,
#sub_content nav.submenu ul li:nth-child(5n+1) a:active {
  background-color: #005f54;
}
#sub_content nav.submenu ul li:nth-child(5n+2) a:link,
#sub_content nav.submenu ul li:nth-child(5n+2) a:visited {
  background-color: #498B93;
}
#sub_content nav.submenu ul li:nth-child(5n+2) a:hover,
#sub_content nav.submenu ul li:nth-child(5n+2) a:active {
  background-color: #386b71;
}
#sub_content nav.submenu ul li:nth-child(5n+3) a:link,
#sub_content nav.submenu ul li:nth-child(5n+3) a:visited {
  background-color: #A63F25;
}
#sub_content nav.submenu ul li:nth-child(5n+3) a:hover,
#sub_content nav.submenu ul li:nth-child(5n+3) a:active {
  background-color: #913720;
}
#sub_content nav.submenu ul li:nth-child(5n+4) a:link,
#sub_content nav.submenu ul li:nth-child(5n+4) a:visited {
  background-color: #D78F56;
}
#sub_content nav.submenu ul li:nth-child(5n+4) a:hover,
#sub_content nav.submenu ul li:nth-child(5n+4) a:active {
  background-color: #b6682b;
}
#sub_content nav.submenu ul li:nth-child(5n+5) a:link,
#sub_content nav.submenu ul li:nth-child(5n+5) a:visited {
  background-color: #B16A00;
}
#sub_content nav.submenu ul li:nth-child(5n+5) a:hover,
#sub_content nav.submenu ul li:nth-child(5n+5) a:active {
  background-color: #985b00;
}
/* SMALLPRINT */
footer#smallprint {
  font-size: 1em;
}
footer#smallprint a {
  /* switch off ext_link fiddling */
  padding-right: 0;
  background: none;
}
footer#smallprint a:link,
footer#smallprint a:visited {
  color: #bbb;
  text-decoration: none;
}
footer#smallprint a:hover,
footer#smallprint a:active {
  text-decoration: underline;
}
footer#smallprint ul {
  overflow: hidden;
  list-style: none;
  margin: 1em 0;
}
footer#smallprint ul li {
  float: right;
  margin-left: 1em;
  font-size: 1.2em;
}
footer#smallprint ul li:first-child {
  float: left;
  margin-left: 0;
}
