@charset "UTF-8";
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  box-sizing: border-box;
  *behavior: url(../js/boxsizing.htc);
}

body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
th,
td,
article,
aside,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  margin: 0;
  padding: 0;
  border: 0;
}

/*
*
*  Consistency fixes
*  adopted from http://necolas.github.com/normalize.css/
*
*/
html {
  height: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  min-height: 100%;
  font-size: 100%;
  background: url("../images/bg-tile.jpg") #b5e7fe;
  padding: 0;
  margin: 0;
  color: #444;
  position: relative;
  top: -100px;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
audio,
canvas,
video {
  display: block;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

b, strong {
  font-weight: bold;
}

abbr[title] {
  border-bottom: 1px dotted;
}

input,
textarea,
button,
select {
  margin: 0;
  font-size: 100%;
  line-height: normal;
  vertical-align: baseline;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}

input[type="checkbox"], input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

textarea {
  overflow: auto;
}

#body table {
  border-collapse: collapse;
  border-spacing: 0;
  border-width: 0px;
  border-style: dotted;
  border-color: gray;
  border-collapse: collapse;
  background-color: white;
  margin: 10px 0;
}
#body th {
  border-width: 0px;
  padding: 5px;
  border-style: solid;
  border-color: black;
  background-color: white;
}
#body td {
  border-width: 0px;
  padding: 5px;
  border-style: solid;
  border-color: black;
  background-color: white;
}
#body table.no-styles {
  border-collapse: collapse;
  border-spacing: 0;
  border-width: 0px;
  border-spacing: 0px;
  border-style: none;
  margin: 0;
  background-color: transparent;
}
#body table.no-styles th {
  border-width: 0px;
  padding: 5px;
  border-style: none;
  border-color: none;
  background-color: transparent;
}
#body table.no-styles td {
  border-width: 0px;
  padding: 0px;
  border-style: none;
  border-color: none;
  background-color: transparent;
}

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

/*Size & Vertical Rhythm*/
body {
  font-size: 100%;
  font-size: 16px;
  line-height: 1.5em;
}

/*HTML Standard Elements*/
h1 {
  font-size: 2.5em;
  line-height: 1.333em;
  margin: .97em 0 0em;
}

#sidebar h1 {
  margin: .97em 0 0;
}

h2 {
  font-size: 1.75em;
  line-height: 1.1em;
  margin: 2em 0 .5em;
}

#body h2 {
  margin: 0.4em 0 .5em;
}

h1 + img, h2 + img {
  margin-top: 1em;
}

h3 {
  font-size: 1.125em;
}

h4 {
  font-weight: bold;
  font-size: 1em;
}

h1, h2, h3, h4, h5, h6, #navigation ul li a, button, .submit {
  font-weight: 700;
  color: #000;
}

small {
  display: block;
  font-size: .75em;
  letter-spacing: .05em;
  margin: 2.2em 0 -.2em;
  font-style: italic;
  line-height: 1.75em;
}

/*#body p,#body ul,#body ol{margin:0  0 1.5em 0;}
*/
strong {
  color: #000;
}

#body ul {
  list-style-position: outside;
  list-style-type: disc;
  line-height: 1.5;
  margin-left: 40px;
}

#body li {
  margin-bottom: .75em;
}

ol {
  list-style-position: outside;
  list-style-type: decimal;
}

blockquote {
  margin-left: 40px;
}

cite {
  display: block;
  text-transform: uppercase;
  letter-spacing: .2em;
  margin-top: 1.5em;
  margin-left: 1em;
  font-weight: 900;
  font-style: normal;
  font-size: .8em;
}

cite:before {
  content: "— ";
  margin-left: -3.4em;
  margin-right: .9em;
  opacity: .3;
}

pre {
  margin: 1.5em;
}

dl {
  margin: 1.75em 0 1.75em;
}

dt {
  font-style: italic;
  margin-top: 1.25em;
  font-size: 1.13em;
  font-weight: 700;
  border-bottom: 1px solid #999;
  background: #DDD;
}

dd {
  font-style: italic;
  font-size: .85em;
  margin-top: 1em;
  line-height: 1.6em;
}

abbr {
  text-transform: uppercase;
  font-size: .9em;
  letter-spacing: .1em;
}

p {
  margin-bottom: 20px;
  hyphenate: auto;
  hyphenate-before: 2;
  hyphenate-after: 3;
  hyphenate-lines: 3;
  orphans: 4;
}

p span.pullquote {
  text-indent: 0;
}

.article-content p {
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
}

/*Compositional Elements*/
.kicker {
  font-size: 1.25em;
  line-height: 1.693em;
  /*font-style:italic;*/
  margin: -.35em 0 -.35em;
}

.kicker, .pullquote {
  font-weight: 100;
}

.run-in {
  font-style: italic;
  font-weight: bold;
}

.superscript {
  font-family: arial, sans-serif;
  vertical-align: super;
  font-size: 75%;
  margin-right: .4em;
  text-transform: lowercase;
  font-variant: small-caps;
  letter-spacing: .1em;
  line-height: 0;
}

.subscript {
  font-family: arial, sans-serif;
  vertical-align: sub;
  font-size: 75%;
  margin-right: .4em;
  text-transform: lowercase;
  font-variant: small-caps;
  letter-spacing: .1em;
  line-height: 0em;
}

a.superscript, a.subscript {
  text-decoration: none;
}

aside, .sidenote {
  font-size: .83em;
  font-style: italic;
  margin-top: 1.25em;
}

aside h1, .sidenote h1 {
  text-transform: uppercase;
  font-size: 1em;
  line-height: 1.5em;
  font-style: normal;
  font-weight: 900;
}

aside p, .sidenote p {
  line-height: 1.7em;
  margin: 1.3em 0;
  font-style: normal;
}

aside ul, aside ol, .sidenote ul, .sidenote ol {
  margin-top: 1.3em;
  line-height: 1.7em;
}

aside ul li, aside ol li, .sidenote ul li, .sidenote ol li {
  margin-bottom: 1.3em;
}

.pullquote {
  font-style: italic;
  letter-spacing: .05em;
  margin: .5em .7em .3em 0em;
  padding-top: .15em;
  line-height: 1.7em;
  display: block;
  float: left;
  font-size: 1.6em;
  width: 55%;
}

.pullquote:before {
  font-family: Georgia, serif;
  content: "“";
  font-size: 2em;
  text-indent: -.8em;
  margin-top: .05em;
  float: left;
  opacity: .3;
}

.footnote {
  border-top: 1px solid black;
  font-size: .75em;
  margin-top: 3.5em;
}

.footnote li {
  margin: 1.5em 0 1.5em;
  word-spacing: .1em;
  line-height: 1.75em;
}

.caption {
  font-size: .8em;
  font-style: italic;
  margin: .6em 0 -.2em;
}

.kicker .run-in {
  text-transform: uppercase;
  font-style: normal;
  letter-spacing: .25em;
  font-size: .9em;
}

.drop-cap {
  display: block;
  font-style: normal;
  font-size: 5.1em;
  float: left;
  margin: .13em .1em 0 0;
  line-height: .67em;
  font-weight: 100;
}

/*Tweaks*/
.kern {
  letter-spacing: -.1em;
}

a {
  color: #DB2625;
  text-decoration: none;
}

a:hover {
  color: #00AFFE;
  text-decoration: none;
}

figure h4 a {
  color: #999;
}

.notice {
  clear: both;
  text-align: center;
}

/*
.services h2, .articles h2{
  padding-bottom:10px;
}
#body h1{
  padding-bottom:20px;
}
*/
@font-face {
  font-family: 'icomoon';
  src: url("/fonts/arrows/icomoon.eot");
  src: url("/fonts/arrows/icomoon.eot?#iefix") format("embedded-opentype"), url("/fonts/arrows/icomoon.woff") format("woff"), url("/fonts/arrows/icomoon.ttf") format("truetype"), url("/fonts/arrows/icomoon.svg#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
  font-family: 'icomoon';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-arrow-right:before {
  content: "\e605";
}

/* Widths etc */
/* Colours */
.browse-list {
  margin: 0 !important;
  list-style: none !important;
}

.browse-list li a {
  display: block;
  margin: 10px 0;
  padding: 20px 0% 10px 70px;
  color: #000230;
  border-radius: 10px;
  height: 65px;
  background-image: url(../images/icons.png);
  background-repeat: no-repeat;
  transition: opacity 1s ease-in-out !important;
}

.browse-list li a:hover {
  background-color: darken #eeeee7, 10%;
  color: white;
}

nav ul li ul li a span {
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 60px;
  height: 60px;
  background-image: url(../images/icons.png);
  background-repeat: no-repeat;
  transition: opacity 0.3s ease-in-out !important;
}

#body ul.pt-pill,
#body .assets-field ul {
  margin-left: 0;
  list-style-type: none;
}

.list-edu {
  background-position: -60px 0;
}

.list-friends {
  background-position: -60px -60px;
}

.list-life {
  background-position: -60px -120px;
}

.list-rights {
  background-position: -60px -180px;
}

.list-health {
  background-position: -60px -240px;
}

.list-home {
  background-position: -60px -300px;
}

.list-school {
  background-position: -60px -360px;
}

.list-study {
  background-position: -60px -420px;
}

.list-training {
  background-position: -60px -480px;
}

.list-work {
  background-position: -60px -540px;
}

.list-gap {
  background-position: -60px -600px;
}

.list-easyread {
  background-position: -60px -660px;
}

.list-education-training-and-jobs {
  background-position: -60px 0;
}

.list-friends-and-feeling {
  background-position: -60px -60px;
}

.list-enjoying-life {
  background-position: -60px -120px;
}

.list-my-rights {
  background-position: -60px -180px;
}

.list-health-support {
  background-position: -60px -240px;
}

.list-a-home-of-my-own {
  background-position: -60px -300px;
}

.list-school {
  background-position: -60px -360px;
}

.list-study {
  background-position: -60px -420px;
}

.list-training {
  background-position: -60px -480px;
}

.list-work {
  background-position: -60px -540px;
}

.list-gap {
  background-position: -60px -600px;
}

.list-easyread {
  background-position: -60px -660px;
}

#easyread .list-edu, #er-education .list-edu, .dir-cat-box:hover .list-edu, .list-edu:hover {
  background-position: -60px -720px;
}

#easyread .list-friends, #er-friends .list-friends, .dir-cat-box:hover .list-friends, .list-friends:hover {
  background-position: -60px -780px;
}

#easyread .list-life, #er-life .list-life, .dir-cat-box:hover .list-life, .list-life:hover {
  background-position: -60px -840px;
}

#easyread .list-rights, #er-rights .list-rights, .dir-cat-box:hover .list-rights, .list-rights:hover {
  background-position: -60px -900px;
}

#easyread .list-health, #er-health .list-health, .dir-cat-box:hover .list-health, .list-health:hover {
  background-position: -60px -960px;
}

#easyread .list-home, #er-home .list-home, .dir-cat-box:hover .list-home, .list-home:hover {
  background-position: -60px -1020px;
}

.list-school:hover {
  background-position: -60px -1080px;
}

.list-study:hover {
  background-position: -60px -1140px;
}

.list-training:hover {
  background-position: -60px -1200px;
}

.list-work:hover {
  background-position: -60px -1260px;
}

.list-gap:hover {
  background-position: -60px -1320px;
}

.list-easyread:hover {
  background-position: -60px -1380px;
}

#sm-list-edu {
  background-position: 0px 0;
}

#sm-list-friends {
  background-position: 0px -60px;
}

#sm-list-life {
  background-position: 0px -120px;
}

#sm-list-rights {
  background-position: 0px -180px;
}

#sm-list-health {
  background-position: 0px -240px;
}

#sm-list-home {
  background-position: 0px -300px;
}

#sm-list-school {
  background-position: 0px -360px;
}

#sm-list-study {
  background-position: 0px -420px;
}

#sm-list-training {
  background-position: 0px -480px;
}

#sm-list-work {
  background-position: 0px -540px;
}

#sm-list-gap {
  background-position: 0px -600px;
}

#sm-list-easyread {
  background-position: 0px -660px;
}

nav #edu:hover span {
  background-position: 0px -720px;
}

nav #friends:hover span {
  background-position: 0px -780px;
}

nav #life:hover span {
  background-position: 0px -840px;
}

nav #rights:hover span {
  background-position: 0px -900px;
}

nav #health:hover span {
  background-position: 0px -960px;
}

nav #home-own:hover span {
  background-position: 0px -1020px;
}

nav #school:hover span {
  background-position: 0px -1080px;
}

nav #study:hover span {
  background-position: 0px -1140px;
}

nav #training:hover span {
  background-position: 0px -1200px;
}

nav #work:hover span {
  background-position: 0px -1260px;
}

nav #gap:hover span {
  background-position: 0px -1320px;
}

nav #easy-read:hover span {
  background-position: 0px -1380px;
}

/*
*
*  Simple fluid media
*
*/
figure {
  position: relative;
}

figure img,
figure object,
figure embed,
figure video {
  max-width: 100%;
  display: block;
}

img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

#container {
  min-height: 100%;
  position: relative;
  background: url("../images/bg.png") center 0 repeat-x;
}

/* #body is the whole body section*/
#body {
  clear: both;
  position: relative;
  z-index: 2;
  background: #eeeee7;
  margin: 0 auto;
  max-width: 1200px;
  min-height: 1000px;
  overflow: hidden;
  padding: 20px 40px 200px;
  width: 80%;
  box-shadow: 0 0 50px 0px rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  transition: all .5s ease-in-out;
}

/* header#top is the whole top section */
header#top {
  width: 80%;
  margin: 0 auto;
  height: 100px;
  max-width: 1200px;
  padding: 120px 0 0 0;
  position: relative;
  z-index: 9;
  height: 320px;
}
header#top .socials {
  position: absolute;
  top: 10em;
  left: 50%;
}

#header p,
#header h1 {
  margin: 0;
  padding: 10px 0;
}

#header {
  background: #ff0;
  margin: 0;
}

#footer p {
  margin: 0;
  padding: 10px;
}

#logo {
  position: relative;
}

#logo img {
  float: left;
  max-width: 300px;
  padding: 20px 0 0 1%;
}

.logo-img {
  display: block;
  width: 216px;
  height: 185px;
  background-image: url("../images/logo.png");
  background-size: 200%;
  background-position: 100% 50%;
  background-repeat: no-repeat;
}

footer .logo-img {
  background-position: 0 0;
  background-size: 200%;
}

#tagline {
  font-weight: bold;
  position: absolute;
  top: 29px;
  left: 110px;
  font-size: 130%;
  width: 370px;
  color: white !important;
}

#search-header-box {
  position: absolute;
  top: 120px;
  right: 0;
  width: 326px;
  height: 107px;
  background: url("../images/search-bg.png") no-repeat;
  color: #fff;
  padding: 17px 40px;
}

input,
textarea,
button,
select {
  margin: 0px;
  padding: 10px;
  font-size: 100%;
  line-height: normal;
  vertical-align: baseline;
}

#keywords {
  float: left;
  margin: 0;
  padding: 5px;
  height: 30px;
  width: 212px;
  border: none;
}

.search-btn {
  padding: 0;
  margin: 0;
  width: 30px !important;
  height: 30px !important;
  float: right;
  background-image: url("../images/search-btn.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  border: none;
  text-indent: -9999px;
}

.search-btn:hover {
  background-position: 0 -30px;
}

.fancy-button {
  margin-top: 2em;
}

.fancy-button input {
  background: url(/images/search-bg2.png);
  border: 0;
  color: #fff;
  padding: 0.8em 2em;
  background-size: contain;
  background-repeat: no-repeat;
  font-size: 1.4em;
  box-shadow: none;
  -webkit-box-shadow: none;
}

#navigation {
  width: 77.666%;
  margin: 0;
  float: right;
  position: absolute;
  right: 0;
  top: 256px;
  z-index: 10;
}

#navigation nav {
  position: relative;
  z-index: 11;
}

#navigation nav ul {
  list-style: none;
  display: block;
  width: 100%;
  position: relative;
  z-index: 12;
}

#navigation nav ul a {
  font-size: 28px;
  display: block;
  width: 100%;
  margin-right: 0px;
  float: left;
  text-align: center;
  padding: 25px 0 15px;
  text-transform: lowercase;
  position: relative;
  z-index: 13;
  background: #42aadf;
  color: #fff;
  box-shadow: 0 -9px 20px -8px rgba(0, 0, 0, 0.2);
}

#navigation nav ul a:hover {
  background: #145474;
}

#home #home-nav, #about #about-nav, #information #information-nav, #directory #directory-nav, #noticeboard #noticeboard-nav, #skills #skills-nav {
  background: #eeeee7 !important;
  color: black !important;
  cursor: default !important;
}

#navigation nav ul a
nav ul a:hover {
  background: #333;
}

#navigation nav ul li {
  float: left;
  position: relative;
  z-index: 14;
  width: 14%;
  margin-right: 2%;
}

#navigation nav ul li ul {
  position: absolute;
  top: 64px;
  left: -116px;
  -moz-box-shadow: 0 0 5px #888;
  -webkit-box-shadow: 0 0 5px #888888;
  box-shadow: 0 0 5px #888;
  z-index: 15;
}

#navigation nav ul li ul li {
  display: none;
  width: 100%;
  position: relative;
  z-index: 16;
}

#navigation nav ul li ul li a {
  text-align: left;
  background: black;
  background: rgba(0, 0, 0, 0.9);
  min-height: 50px !important;
  height: 50px !important;
  font-size: 100%;
  padding: 10px 0 20px 70px;
  top: 0;
  min-width: 300px;
  position: relative;
  z-index: 17;
  transition: opacity 0.1s ease-in-out !important;
}

.ie #navigation nav ul li ul li a {
  min-height: 20px !important;
  height: 20px !important;
}

#navigation nav ul li ul li a:hover {
  background: white;
  background: rgba(255, 255, 255, 0.9);
  color: black;
}

#navigation nav li:hover li {
  display: block;
}

.nav-subtext {
  display: block;
  font-size: 70%;
  position: absolute;
  top: 8px;
  left: 0;
  width: 100%;
}

#display-prefs {
  display: block;
  position: fixed;
  top: 250px;
  right: 0;
  background: #000;
  color: #fff;
  width: 35px;
  height: 173px;
  padding: 37px 0 0 9px;
  z-index: 20000000001;
  background-image: url("../images/accessibility-tab.png");
  transition: all .3s ease-in-out;
}

#display-prefs:hover {
  width: 39px;
}

#feedback-btn {
  display: block;
  position: fixed;
  top: 100px;
  right: 0;
  height: 102px;
  width: 35px;
  background: url("../images/feedback-btn.png") no-repeat;
  z-index: 99999999;
  cursor: pointer;
  transition: all .3s ease-in-out;
}

#work-experience-btn {
  display: block;
  text-indent: -9000px;
  position: fixed;
  top: 470px;
  right: -5px;
  height: 148px;
  width: 43px;
  background: url("/images/work-experience-btn.png") no-repeat;
  z-index: 99999999;
  cursor: pointer;
  transition: all .3s ease-in-out;
}
#work-experience-btn:hover {
  right: 0;
  transition: all .3s ease-in-out;
}

#acc-link {
  display: block;
  width: 35px;
  height: 173px;
  background: transparent;
  float: left;
  position: fixed;
  top: 250px;
  right: 0;
  z-index: 1;
}

.acc-styles-list {
  list-style: none !important;
  display: block;
  height: 300px;
}

.acc-styles-list li {
  height: 50px;
  margin-bottom: 5px;
}

.acc-styles-list li a {
  width: auto;
  height: 50px;
  display: block;
  float: left;
  clear: both;
  margin-right: 20px;
  padding: 12px 20px;
}

.acc-styles-list li p {
  padding-top: 15px;
}

#feedback-btn:hover {
  width: 39px;
}

#stylesheet-list {
  position: relative;
  z-index: 2;
}

#stylesheet-list a {
  display: block;
  float: left;
}

#stylesheet-list a {
  padding: 0px 7px;
  margin: 1px;
  border: 1px solid;
  font-size: 10px;
  font-weight: bold;
  line-height: 2;
}

#default {
  background: #B9E9FF;
}

#alt-1 {
  background: #ffffff;
}

#alt-2 {
  background: #295384;
}

#alt-3 {
  background: #333333;
}

#alt-4 {
  background: #FFFF00;
}

.howdydo-style {
  background: #FAED9B;
  border-bottom: 2px solid #FC0;
  color: #666;
  text-shadow: 0 1px #fff, 0 -1px #CCC;
  transition: none !important;
}

#howdydo-wrapper {
  overflow: visible;
  padding: 0;
  width: 100%;
  z-index: 9999;
  transition: none !important;
}

.howdydo-box {
  display: none;
  padding: 10px 20px;
  width: 100%;
  position: relative;
  transition: none !important;
}

#howdydo-close {
  position: absolute;
  /*	float: right; 
  	margin: 0 30px 0 0; */
  bottom: 10px;
  right: 30px;
}

#howdydo-open {
  padding: 10px;
  position: absolute;
  right: 20px;
  top: 0;
  transition: none !important;
}
#howdydo-open a {
  transition: none !important;
}

.howdydo-hover {
  position: absolute;
  top: 0;
  left: 0;
  transition: none !important;
}

.howdydo-scroll {
  position: fixed;
  top: 0;
  left: 0;
  transition: none !important;
}

.howdydo-push {
  position: relative;
  clear: both;
  float: left;
  margin-bottom: 1px;
  transition: none !important;
}

#top-message {
  background: #F2DEDE;
  border: 1px solid #EED3D7;
  color: #B94A48;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  padding: 15px;
  margin: 0 auto;
  font-size: 14px;
  z-index: 999;
  transition: none !important;
}

.close-this {
  display: block;
  color: #ff0000;
  display: block;
  float: right;
  width: 130px;
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  transition: none !important;
}

#stylesheet-list {
  list-style: none;
  float: right;
}

#stylesheet-list li {
  display: ms-interpolation-mode;
}

.img-lft {
  float: left;
  margin-right: 2.5%;
  background-color: white;
  border: 1px solid #CCC;
  padding: 5px;
}

.img-rgt {
  float: right;
  margin-left: 2.5%;
  background-color: white;
  border: 1px solid #CCC;
  padding: 5px;
}

hr {
  display: block;
  clear: both;
  height: 40px;
  background: url("../images/hr.png") repeat-x center center;
  border: 0 #eeeee7;
}

.ie hr {
  color: #eeeee7;
  /*used for IE, top color*/
  min-height: 0px;
  /*required to get IE to render the top pixel color*/
  border-left: 0px;
  border-right: 0px;
  border-top: 1px solid #eeeee7;
  /*Your top color*/
  border-bottom: 1px solid #eeeee7;
  /*Your bottom color*/
}

/*
#sidebar-bg{
	background-color:$sidebarbg;
	width:31.5%;
	height:1475px;
	position:absolute;
	right:2.5%;
	top:50px;
	z-index:0;
	border-radius:10px;
}
*/
body#home .sidebar {
  margin-top: 45px;
}

.sidebar {
  position: relative;
  z-index: 1;
  background-color: darken #eeeee7, 10%;
  padding: 20px;
  margin-top: 50px;
  margin-bottom: 30px;
}

.sidebar hr {
  height: 10px;
}

.sidebar h2 {
  font-size: 25px;
  padding: 0px 0 20px;
}

#home .sidebar h2 {
  padding-top: 0;
}

.sidebar h3 {
  font-size: 20px;
}

/*.twothirds section figure p, section.twothirds p{
	padding:20px 0;
}*/
.feature-container {
  position: relative;
  clear: both;
  min-height: 260px;
  padding-bottom: 5%;
  /*background-color:$bodybg + 3%;*/
}

#google-map-wrapper {
  background-color: #FFFFFF;
  border: 1px solid #CCCCCC;
  margin: 0 0 20px 0;
  padding: 5px;
  height: 300px;
}

#basic-modal-content {
  display: none;
}

/* Overlay */
#simplemodal-overlay {
  background-color: #000;
  cursor: wait;
}

/* Container */
#simplemodal-container {
  height: 600px;
  width: 600px;
  color: #bbb;
  background-color: #333;
  border: 4px solid #444;
  padding: 12px;
}

#simplemodal-container .simplemodal-data {
  padding: 8px;
}

#simplemodal-container a {
  color: #ff0000;
}

#simplemodal-container a.modalCloseImg {
  background: url(../images/x.png) no-repeat;
  width: 25px;
  height: 29px;
  display: inline;
  z-index: 3200;
  position: absolute;
  top: -15px;
  right: -16px;
  cursor: pointer;
}

#simplemodal-container h3 {
  color: #ffffff;
}

#simplemodal-container .long {
  width: 100%;
  padding: 10px;
  font-family: Helvetica, Arial, sans-serif;
  margin: 0 auto;
}

/* --- --- -------------- --- --- */
/* --- ---   Fluid grid   --- --- */
/* --- --- -------------- --- --- */
.full {
  width: 100%;
}

.row {
  clear: both;
  margin-bottom: 10px;
}

.last {
  margin-right: 0 !important;
}

.sixth {
  width: 14.6666666667%;
  float: left;
  margin-right: 2.33333%;
  margin-bottom: 10px;
}

.third {
  width: 31.667%;
  float: left;
  margin-right: 2.33333%;
  margin-bottom: 10px;
}

.twothirds {
  width: 66%;
  float: left;
  margin-right: 2.33333%;
  margin-bottom: 10px;
}

.twothirds .third {
  width: 48.1%;
  margin-right: 3.8%;
}

.half {
  width: 48.83%;
  margin-right: 2.33333%;
  float: left;
}

.input-third {
  width: 32%;
  float: left;
  margin-right: 2%;
}
.input-third select, .input-third label {
  width: 100%;
  max-width: 100%;
}

.input-filters {
  width: 32%;
  float: left;
  margin-right: 2%;
}
.input-filters select, .input-filters label {
  width: 100%;
  max-width: 100%;
}
.input-filters input {
  width: 5%;
  float: left;
  margin: 0 !important;
}
.input-filters span {
  width: 90%;
  float: right;
}

.services figure, .articles figure {
  background: white;
  padding: 5% 5% 15% 5%;
  margin-bottom: 10px;
}

.services figure header, .articles figure header {
  min-height: 75px;
}

.services p, .articles p {
  margin: 0 !important;
  padding: 0 !important;
}

.services figure .read-more, .articles figure .read-more, section.twothirds .read-more {
  display: block;
  position: absolute;
  right: 10px;
  bottom: 10px;
}

.services img, .articles img {
  margin-bottom: 0px !important;
}

.read-more::-moz-focus-inner {
  border: 0;
}

.read-more {
  display: block;
  background: #e3e3e3;
  border: 1px solid #bbb;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
  -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
  -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
  -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
  box-shadow: inset 0 0 1px 1px #f6f6f6;
  color: #333;
  font: bold 11px "helvetica neue", helvetica, arial, sans-serif;
  line-height: 1;
  padding: 8px 0 9px;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  width: 100px;
  clear: both;
}

.read-more:hover {
  background: #d9d9d9;
  -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
  -moz-box-shadow: inset 0 0 1px 1px #eaeaea;
  -ms-box-shadow: inset 0 0 1px 1px #eaeaea;
  -o-box-shadow: inset 0 0 1px 1px #eaeaea;
  box-shadow: inset 0 0 1px 1px #eaeaea;
  color: #222;
  cursor: pointer;
}

.read-more:active {
  background: #d0d0d0;
  -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3;
  -moz-box-shadow: inset 0 0 1px 1px #e3e3e3;
  -ms-box-shadow: inset 0 0 1px 1px #e3e3e3;
  -o-box-shadow: inset 0 0 1px 1px #e3e3e3;
  box-shadow: inset 0 0 1px 1px #e3e3e3;
  color: #000;
}

.sidebar .read-more {
  right: 5px;
  position: absolute;
  bottom: -5px;
}

.services figure h4 a, .articles figure h4 a {
  font-weight: normal;
  font-style: italic;
}

#cloud {
  text-align: center;
}

/* --- --- -------------- --- --- */
/* --- ---     Footer     --- --- */
/* --- --- -------------- --- --- */
#page-footer {
  position: relative;
  z-index: 5;
  clear: both;
}

#page-footer ul {
  list-style: none;
}

#page-footer ul li {
  margin: 0;
}

footer {
  clear: both;
  /*border-top:1px dotted #333;*/
  margin: 0;
  padding: 0;
}

footer ul {
  list-style: none;
}

#footer {
  position: absolute;
  z-index: 5;
  bottom: 0;
  width: 100%;
  height: 300px;
  /* Height of the footer */
  background: url("../images/hills_foreground.png") repeat-x;
  background-position: 0px 0px;
  bottom: -99px;
}

#footer2 {
  position: absolute;
  bottom: 0px;
  width: 100%;
  height: 800px;
  /* Height of the footer */
  background: url("../images/hills_background.jpg") top center repeat-x;
  z-index: 1;
}

footer hr {
  opacity: .2;
}

#about-container {
  padding: 20px 15%;
  line-height: 180%;
}

#page-footer img.full {
  opacity: 0.3 !important;
  -webkit-transition: opacity 0.4s ease-in-out !important;
  -moz-transition: opacity 0.4s ease-in-out !important;
  transition: opacity 0.4s ease-in-out !important;
}

#page-footer img.full:hover {
  opacity: 1 !important;
}

/* --- --- -------------- --- --- */
/* --- --- Directory Page --- --- */
/* --- --- -------------- --- --- */
.easyread-dir-btn {
  background-color: #c2212c;
  color: white !important;
  display: block;
  padding: 20px;
  border-radius: 20px;
  text-align: center;
}

.easyread-dir-btn:hover {
  background-color: #6b1218;
}

#area-list {
  margin: 0 0 0 40px !important;
  list-style: none !important;
}

#area-list li {
  margin: 0;
}

.dir-cat-container a {
  color: #fff;
}

.dir-cat-box {
  display: block;
  height: 150px;
  background: #d9d9c9;
  text-align: center;
  padding: 0 15px;
  border-radius: 10px;
}

#area-cat-container .dir-cat-box {
  display: block;
  padding: 5px 15px;
  height: 125px;
  width: 95%;
}

.dir-cat-box:hover {
  background: #d9d9c9;
}

.dir-cat-box .icon {
  display: block;
  width: 60px;
  height: 60px;
  margin: 10px auto;
  background-image: url(../images/icons.png);
  background-repeat: no-repeat;
  transition: opacity 0.1s ease-in-out !important;
}

.question {
  font-size: 150%;
}

#skills h2 {
  margin-top: 1.5em;
}
#skills .skills-sidebar {
  float: right;
  width: 20%;
  padding-top: 3em;
}
#skills .skills-cat-container {
  float: left;
  width: 75%;
}
#skills .skills-cat-container a, #skills .skills-cat-container h2 {
  color: #fff;
}
#skills .skills-cat-container a h1, #skills .skills-cat-container a p {
  color: #fff;
}
#skills .skills-cat-container .copy a {
  color: #DB2625;
}
#skills .skills-cat-container .copy a:hover {
  color: #00AFFE;
}
#skills .skills-cat-box {
  display: block;
  min-height: 100px;
  background: #d9d9c9;
  padding: 5px 15px;
  border-radius: 10px;
  position: relative;
}
#skills .skills-cat-box h2 {
  margin-top: 0.4em;
}
#skills .skills-cat-box a, #skills .skills-cat-box h2 {
  color: #fff;
}
#skills .skills-cat-box p {
  color: #fff;
}
#skills .skills-cat-box .arrow {
  position: absolute;
  top: 25px;
  right: 30px;
  color: #fff;
  font-size: 30px;
}
#skills #skills-cat-container .skills-cat-box {
  display: block;
  padding: 5px 15px;
  height: 125px;
  width: 95%;
}
#skills .skills-cat-box:hover {
  background: #d9d9c9;
}
#skills .skills-cat-box .icon {
  display: block;
  width: 60px;
  height: 60px;
  margin: 10px auto;
  background-image: url(../images/icons.png);
  background-repeat: no-repeat;
  transition: opacity 0.1s ease-in-out !important;
}
#skills .skills-areas {
  margin-bottom: 0;
  width: 100%;
}
#skills .skills-area-container {
  float: left;
  width: 75%;
}
#skills .skills-area-box {
  background-color: #db543b;
  display: block;
  padding: 10px;
  border-radius: 5px;
  color: #fff;
  font-size: 100%;
  line-height: 1.2;
  margin-bottom: 10px;
  width: 48%;
  float: left;
  margin-right: 2%;
}
#skills .skills-area-box:hover {
  background-color: #6a2113;
  color: #fff;
}
#skills .skills-area-stage-1 {
  background-color: #0ca3c8;
}
#skills .skills-area-stage-2 {
  background-color: #293592;
}
#skills .skills-area-stage-3 {
  background-color: #642f92;
}
#skills .skills-area-stage-4 {
  background-color: #1c66b1;
}
#skills .skills-area-stage-5 {
  background-color: #c6348a;
}
#skills .skills-area-stage-1:hover {
  background-color: #032d38 !important;
}
#skills .skills-area-stage-2:hover {
  background-color: #7a85da !important;
}
#skills .skills-area-stage-3:hover {
  background-color: #b083d7 !important;
}
#skills .skills-area-stage-4:hover {
  background-color: #7cb3ea !important;
}
#skills .skills-area-stage-5:hover {
  background-color: #4d1436 !important;
}

#body ul.skills-locations {
  margin-left: 0;
  margin-bottom: 2em;
  list-style: none;
}
#body ul.skills-locations li a.top {
  padding: 8px 10px;
  width: 100%;
  display: block;
  background: #f16824;
  height: 2em;
  color: #fff;
  font-size: 1.5em;
  font-family: "museo-slab",sans-serif;
  position: relative;
}
#body ul.skills-locations li a.top span {
  position: absolute;
  top: 0.2em;
  right: 10px;
}
#body ul.skills-locations li a.top:hover {
  background: #752c07;
}
#body ul.skills-locations li ul {
  margin-left: 0;
  list-style: none;
  background: #fff;
  padding: 8px 10px;
}
#body ul.skills-locations li ul li {
  margin-bottom: .5em;
}
#body ul.skills-locations li ul li a {
  color: #444;
}
#body ul.skills-locations li.open ul {
  display: block;
}
#body ul.skills-locations li.open a.top span:after {
  content: "-";
}
#body ul.skills-locations li.closed ul {
  display: none;
}
#body ul.skills-locations li.closed a.top span:after {
  content: "+";
}

#body ul.skills-progression {
  margin-left: 0;
  font-weight: bold;
  margin-bottom: 2em;
  list-style: none;
}
#body ul.skills-progression li:before {
  content: "\2212\0020\0020";
}

.skills-signpost {
  background: #fbc516;
  border-radius: 10px;
  padding: 1em;
  color: #000;
  display: block;
}
.skills-signpost:hover {
  background-color: #765b02;
  color: #000;
}

.skills-nav {
  padding-top: 2em;
}
.skills-nav a {
  font-size: 130%;
  text-align: center;
  display: block;
}
.skills-nav ul {
  margin-top: 1em;
  list-style: none;
  padding-left: 0;
  margin-left: 0 !important;
}
.skills-nav ul li {
  list-style-type: none;
  margin-bottom: 0 !important;
  padding-bottom: 45px;
  background: url("../images/flow-arrow-link.png") center 33px no-repeat;
}
.skills-nav ul li a {
  background: #b7b6a3;
  color: #000;
  width: 100%;
  display: block;
  padding: 5px;
}
.skills-nav ul li a.skills-area-1:hover {
  background-color: #0ca3c8;
  color: #fff;
}
.skills-nav ul li a.skills-area-2:hover {
  background-color: #293592;
  color: #fff;
}
.skills-nav ul li a.skills-area-3:hover {
  background-color: #642f92;
  color: #fff;
}
.skills-nav ul li a.skills-area-4:hover {
  background-color: #1c66b1;
  color: #fff;
}
.skills-nav ul li a.skills-area-5:hover {
  background-color: #c6348a;
  color: #fff;
}
.skills-nav ul li.active a {
  color: #fff;
}
.skills-nav ul li.active a.skills-area-1 {
  background-color: #0ca3c8;
}
.skills-nav ul li.active a.skills-area-2 {
  background-color: #293592;
}
.skills-nav ul li.active a.skills-area-3 {
  background-color: #642f92;
}
.skills-nav ul li.active a.skills-area-4 {
  background-color: #1c66b1;
}
.skills-nav ul li.active a.skills-area-5 {
  background-color: #c6348a;
}
.skills-nav ul li.last {
  background: none;
}

#results {
  clear: both;
}

fieldset {
  position: relative;
}

.application-form label {
  font-size: 1em;
}
.application-form label.required:after {
  content: "*";
  color: red;
}
.application-form .field-note {
  font-size: 0.8em;
  color: #2d86ab;
  display: block;
  margin-bottom: 0.5em;
}

form {
  margin: 0;
}
form p {
  clear: both;
}
form legend {
  padding-top: 1em;
  margin-bottom: 0.5em;
  color: #DB2625;
}
form .answer {
  font-size: 1.5em;
  padding: 0.5em;
  color: #fff;
}
form .answer-1 {
  background-color: #f16824;
}
form .answer-2 {
  background-color: #8dc444;
}
form .answer-3 {
  background-color: #0ca3c8;
}
form .field {
  margin-bottom: 2em;
  padding-bottom: 2em;
  border-bottom: 1px solid #0ca3c8;
  width: 100%;
}
form .field h2 {
  font-size: 1.4em;
  font-family: "museo-sans",sans-serif;
}
form .checkboxes label {
  width: 20%;
  float: left;
}
form .checkboxes label input {
  display: inline-block;
  margin-right: 10px;
}
form .checkboxes-halves label {
  width: 48%;
}
form .checkboxes-thirds label {
  width: 30%;
}
form .form-toggle {
  position: absolute;
  top: 2em;
  right: 0;
  width: 10em;
}
form .form-toggle label {
  display: block;
  text-align: right;
  width: 100%;
}
form .options label {
  width: 100%;
}
form .options label input {
  display: inline-block;
  margin-right: 10px;
}
form li label {
  display: inline;
}

.apply {
  margin: 2em 0;
}
.apply a {
  background: #8dc444;
  color: #fff;
  padding: 0.5em;
  font-size: 1.5em;
  display: inline-block;
}

.multiple-forms form {
  width: auto;
  margin-right: 20px;
  float: left;
}
.multiple-forms form input[type=submit] {
  min-width: 60px;
  text-align: center;
}

fieldset {
  border: 1px solid;
  padding: 2.5%;
}

optgroup#highland option {
  font-weight: bold;
  border-top: 1px solid red;
}

.search-entry {
  background: white;
  padding: 2%;
  margin: 10px 0;
  min-height: 140px;
}
.search-entry--compact {
  min-height: auto;
}
.search-entry--compact h2 {
  color: #DB2625;
  font-size: 1.3em;
  margin: 0 0 0.3em 0 !important;
}
.search-entry--compact p {
  color: #000;
}

.search-entry img {
  width: 100px;
}

nav.page ul {
  text-align: center;
}

nav.page ul li {
  display: inline;
  margin: 0 4px 0 0;
}

nav.page ul li a {
  padding: 3px 8px;
  font-size: 14px;
  font-weight: bold;
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 4px;
}

nav.page ul li a.inactive {
  opacity: .2;
  color: #000;
}

nav.page ul li a:hover,
nav.page ul li a:focus {
  background: #f0f0f0;
  border-color: #ccc;
}

nav.page ul li a:active {
  background: #fff;
  border-color: #ddd;
}

/* --- --- ---------------------- --- --- */
/* --- --- Directory Listing Page --- --- */
/* --- --- ---------------------- --- --- */
#further-info p {
  margin: 0;
}

.article-content {
  min-height: 250px;
  clear: both;
}

.article-title {
  min-height: 85px;
}

.img-holder {
  width: 212px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
}

.img-holder img {
  vertical-align: middle;
}

.pdf {
  float: right;
  font-size: 14px;
  background-image: url("../images/pdf.gif");
  background-repeat: no-repeat;
  padding: 0px 0px 0px 32px;
  line-height: 2.5;
}

#tags-container h3 {
  padding: 0 0 20px 0;
}

#tags-container {
  clear: both;
}

ol.tags {
  list-style: none;
}

ol.tags li {
  float: left;
  margin: 0 5px 5px 0;
  font-size: 14px;
}

ol.tags li a {
  float: left;
  padding: 5px 10px 6px 25px;
  font-weight: normal;
  color: #fff;
  background: #7d7d59 url(../images/tag-bg.png) no-repeat 0 50%;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-transition: background-color .2s ease-in-out;
  -moz-transition: background-color .2s ease-in-out;
  transition: background-color .2s ease-in-out;
}

ol.tags li a:hover,
ol.tags li a:focus {
  background-color: #999;
}

ol.tags li a:active {
  background-color: #ccc;
}

/* --- --- ---------------------- --- --- */
/* --- --- Information Page --- --- */
/* --- --- ---------------------- --- --- */
.flow-box {
  background-color: #db543b;
  display: block;
  padding: 20px;
  margin-left: 29.5%;
  width: 41%;
  color: #fff;
  font-size: 100%;
  line-height: 1.2;
  float: left;
  text-align: center;
}
.flow-box h2 span {
  font-size: 1rem;
  font-weight: normal;
  line-height: 1;
}

.flow-box ul, .flow-box h2 {
  color: #fff;
}

.flow-box a {
  color: #fff;
}

.flow-box a:hover {
  color: #ddd;
}

.flow-box li {
  text-align: left;
}

#further-study .flow-box {
  background-color: #293592;
}

#further-study .flow-level-3-container .flow-box {
  background-color: #293592;
}

#further-study .flow-level-3-container .flow-box:hover {
  background-color: #131842;
}

#gap-year .flow-box {
  background-color: #c6348a;
}

#gap-year .flow-level-3-container .flow-box {
  background-color: #c6348a;
}

#gap-year .flow-level-3-container .flow-box:hover {
  background-color: #751f52;
}

#staying-on-at-school .flow-box {
  background-color: #0ca3c8;
}

#staying-on-at-school .flow-level-3-container .flow-box {
  background-color: #0ca3c8;
}

#staying-on-at-school .flow-level-3-container .flow-box:hover {
  background-color: #065568;
}

#training .flow-box {
  background-color: #1c66b1;
}

#training .flow-level-3-container .flow-box {
  background-color: #1c66b1;
}

#training .flow-level-3-container .flow-box:hover {
  background-color: #0e3359;
}

#work .flow-box {
  background-color: #642f92;
}

#work .flow-level-3-container .flow-box {
  background-color: #642f92;
}

#work .flow-level-3-container .flow-box:hover {
  background-color: #2f1645;
}

.flow-box-small {
  background-color: #db543b;
  display: block;
  width: 30%;
  padding: 20px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 150%;
  line-height: 1.2;
}
.flow-box-small:hover {
  color: white;
  background-color: #6a2113;
}

.flow-level-3-container {
  margin-left: 35%;
  border-left: 5px solid #B7B6A3;
  padding: 37px 0;
  clear: both;
}

.flow-level-3-container .flow-box {
  display: block;
  width: 90%;
  padding: 20px;
  margin: 0;
  text-align: center;
  color: #fff;
  font-size: 200%;
  line-height: 1.2;
  float: right;
}

span.flow-box {
  width: 41%;
  background-color: white;
  margin-left: 30%;
  color: #000;
}

a.flow-box:hover {
  background-color: #6a2113;
  color: #fff;
}

#flow-5 {
  margin-left: 0 !important;
}

#flow-5 li {
  list-style: none;
  display: inline;
}

#flow-5 li a {
  display: block;
  float: left;
  width: 18%;
  margin-right: 2.5%;
  text-align: center;
  color: #fff;
  min-height: 120px;
}

#flow-5 li a span, .flow-box-title span, .easyread-dir-btn .icon {
  display: block;
  width: 60px;
  height: 60px;
  background-image: url("../images/icons.png");
  margin: 0 auto;
  transition: opacity 0.1s ease-in-out !important;
}

.flow-arrow-link {
  width: 34px;
  height: 50px;
  background-position: 0;
  background-image: url("../images/flow-arrow-link.png");
  margin: 0 auto;
  clear: both;
}

.flow-level-3-container .flow-arrow-link {
  margin-left: 45%;
}

.flow-arrow-link-up {
  width: 34px;
  height: 57px;
  background-image: url("../images/flow-arrow-link-up.png");
  margin: 0 auto;
  clear: both;
}

.flow-arm-right {
  width: 121px;
  height: 78px;
  background-image: url("../images/flow-arm-right.png");
  float: left;
  position: relative;
  top: 37px;
}

.flow-arrows-1, #who {
  width: 85%;
  height: 107px;
  margin: 0 auto;
  clear: both;
  text-align: center;
}

.flow-arrows-2 {
  width: 82.2%;
  height: 77px;
  margin: 0 auto;
  clear: both;
  text-align: center;
}

.flow-arrows-1 img, .flow-arrows-2 img {
  width: 100%;
  height: 100%;
}

.flow-box-who {
  background-color: #db543b;
  display: block;
  float: left;
  width: 18%;
  margin-right: 2.5%;
  margin-bottom: 10px;
  text-align: center;
  color: #fff;
  padding: 20px;
  min-height: 48px;
}

a.flow-box-who:hover {
  background-color: #6a2113;
  color: #fff;
}

span.flow-box-who {
  background-color: #f3c5bc;
}

#who {
  font-size: 200%;
  height: 141px;
}

#who p {
  margin: 10px 0;
}

#who img {
  height: 107px;
}

#who-3-container {
  margin: 0 20.5%;
}

#who-3-container .flow-box-who {
  width: 30.5%;
  margin-right: 4.3%;
}

.flow-arrow-link-left {
  width: 5%;
  height: 100px;
  background-image: url("../images/flow-arrow-link-left.png");
  background-repeat: no-repeat;
  background-position: center;
  float: left;
}

.flow-arrow-link-right {
  width: 5%;
  height: 100px;
  background-image: url("../images/flow-arrow-link-right.png");
  background-repeat: no-repeat;
  background-position: center;
  float: left;
}

.flow-box-title {
  display: block;
  width: 41%;
  min-height: 100px;
  padding: 0 20px 20px 20px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 220%;
  line-height: 1.2;
}

.flow-top-menu a {
  min-height: 100px;
  opacity: 30%;
}

.flow-link-cat {
  display: block;
  float: left;
  width: 24.5%;
  padding: 20px;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 150%;
  line-height: 1.2;
}

.flow-box-4 .flow-box-who {
  width: 23%;
}
.flow-box-4 #who {
  height: 107px;
}
.flow-box-4 img {
  width: 93%;
}

.funding-flow {
  clear: both;
  padding-top: 50px;
}

/* --- --- ---------------------- --- --- */
/* --- --- -- Easy Read Pages --- --- --- */
/* --- --- ---------------------- --- --- */
#er-education h2, #er-friends h2, #er-life h2, #er-rights h2, #er-health h2, #er-home h2 {
  height: 70px;
  text-indent: 20px;
  line-height: 1.9;
}

#er-education .third, #er-friends .third, #er-life .third, #er-rights .third, #er-health .third, #er-home .third {
  background-color: darken #eeeee7, 10%;
  padding: 20px 20px 20px 40px;
  background-repeat: no-repeat;
  background-position: 10px 20px;
  min-height: 90px;
}

.btn-back {
  background-image: url("../images/back.gif");
}

.btn-dir {
  background-image: url("../images/up.gif");
}

.btn-pdf {
  background-image: url("../images/pdf.gif");
}

#er-education p, #er-friends p, #er-life p, #er-rights p, #er-health p, #er-home p {
  line-height: 2;
}

#er-education .icon, #er-friends .icon, #er-life .icon, #er-rights .icon, #er-health .icon, #er-home .icon {
  width: 60px;
  height: 60px;
  background-image: url(../images/icons.png);
  background-repeat: no-repeat;
  margin: 0 auto 15px;
  display: block;
}

#er-education .half, #er-friends .half, #er-life .half, #er-rights .half, #er-health .half, #er-home .half {
  padding: 30px;
  margin-bottom: 20px;
  font-size: 150%;
  border-radius: 20px;
}

#er-education .half img, #er-friends .half img, #er-life .half img, #er-rights .half img, #er-health .half img, #er-home .half img {
  width: 100%;
  padding-bottom: 20px;
}

#er-education .half {
  background: white;
}

#er-friends .half {
  background: white;
}

#er-life .half {
  background: white;
}

#er-rights .half {
  background: white;
}

#er-health .half {
  background: white;
}

#er-home .half {
  background: white;
}

#easyread-main-menu {
  list-style-type: none !important;
  font-size: 200%;
  margin: 0 !important;
}

#easyread-main-menu li a {
  display: block;
  padding: 10px 20px;
  color: #fff;
}

.col1 {
  background-color: #db543b !important;
}

.col2 {
  background-color: #f16824 !important;
}

.col3 {
  background-color: #f7941f !important;
}

.col4 {
  background-color: #fbc516 !important;
}

.col5 {
  background-color: #8dc444 !important;
}

.col6 {
  background-color: #22ae4b !important;
}

.col7 {
  background-color: #0ca3c8 !important;
}

.col8 {
  background-color: #293592 !important;
}

.col9 {
  background-color: #1c66b1 !important;
}

.col10 {
  background-color: #642f92 !important;
}

.col11 {
  background-color: #c6348a !important;
}

.col12 {
  background-color: #c2212c !important;
}

.col1:hover {
  background-color: #6a2113 !important;
}

.col2:hover {
  background-color: #752c07 !important;
}

.col3:hover {
  background-color: #794304 !important;
}

.col4:hover {
  background-color: #765b02 !important;
}

.col5:hover {
  background-color: #3c541b !important;
}

.col6:hover {
  background-color: #092e14 !important;
}

.col7:hover {
  background-color: #032d38 !important;
}

.col8:hover {
  background-color: #7a85da !important;
}

.col9:hover {
  background-color: #7cb3ea !important;
}

.col10:hover {
  background-color: #b083d7 !important;
}

.col11:hover {
  background-color: #4d1436 !important;
}

.col12:hover {
  background-color: #3f0b0e !important;
}

#er-education .col1, #er-friends .col2, #er-life .col3, #er-rights .col4, #er-health .col5, #er-home .col6 {
  background-color: #000;
  cursor: default;
}

#easyread-menu {
  clear: both;
}

#easyread-menu .sixth {
  text-align: center;
  padding: 20px;
  height: 180px;
  border-radius: 20px;
}

#easyread-menu a {
  color: #fff;
}

#easyread-main-menu li a span.icon {
  display: block;
  width: 60px;
  height: 60px;
  background-image: url("../images/icons.png");
  margin: 0;
  float: left;
  position: relative;
  top: -5px;
  left: -10px;
}

h2 div.icon {
  margin: 0 !important;
  float: left;
}

#ui-datepicker-div:before {
  position: absolute;
  top: -10px;
  left: 50%;
  margin-left: -5px;
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-bottom: 5px solid #444751;
  border-top: 5px solid transparent;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}

#ui-datepicker-div {
  position: relative;
  background: #444751;
  display: inline-block;
  padding: 5px;
  width: 302px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 0 #FFF;
  -moz-box-shadow: 0 1px 0 #FFF;
  box-shadow: 0 1px 0 #FFF;
}

.ui-datepicker-header {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
  background: #D25068;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f66c7b), to(#d25068));
  background-image: -moz-linear-gradient(top, #f66c7b, #d25068 100%);
  color: #FFF;
  height: 32px;
  position: relative;
}

.ui-datepicker-header:after {
  background: transparent url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAACCAYAAACKVvbTAAAAKUlEQVQIHWP8//8/Awh8/PgRwgDzIAQ/Pz8jiMUCExMQEDCBsWE0zAAA8dYKZBkmJoYAAAAASUVORK5CYII=") repeat-x;
  position: absolute;
  bottom: 2px;
  left: 0;
  display: block;
  width: 99%;
  height: 2px;
  content: "";
}

.ui-datepicker-prev:hover {
  border-right: 5px solid #000;
}

.ui-datepicker-prev {
  cursor: pointer;
  float: left;
  display: block;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
  border-left: 5px solid transparent;
  border-right: 5px solid #FFF;
  text-indent: -9999px;
  height: 0;
  width: 0;
  margin-top: 10px;
  margin-left: 5px;
}

.ui-datepicker-next:hover {
  border-left: 5px solid #000;
}

.ui-datepicker-next {
  cursor: pointer;
  float: right;
  display: block;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
  border-left: 5px solid #FFF;
  border-right: 5px solid transparent;
  text-indent: -9999px;
  height: 0;
  width: 0;
  margin-top: 10px;
  margin-right: 5px;
}

.ui-datepicker-title {
  text-align: center;
  line-height: 30px;
  font-size: 12px;
  font-weight: 700;
  text-shadow: 0 1px 1px #632631;
}

table {
  border-collapse: inherit !important;
}

.ui-datepicker-calendar {
  width: 100%;
  background: white url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAECAYAAABP2FU6AAAAGElEQVQIHWNYtWrVf4b///8zMGtra0NYAG3QCnusptO9AAAAAElFTkSuQmCC") bottom left repeat-x;
  padding: 5px 5px 9px 5px;
  -webkit-border-radius: 0 0 5px 5px;
  -moz-border-radius: 0 0 5px 5px;
  border-radius: 0 0 5px 5px;
}

.ui-datepicker th {
  color: #63697A;
  text-align: center;
  font-weight: 700;
  border: 0;
  padding-bottom: 5px;
}

.ui-datepicker td {
  border: 0;
}

.ui-datepicker td span, .ui-datepicker td a {
  display: block;
  color: #63697A;
  line-height: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #EDEDED;
  margin: 0 0 2px 0;
}

.ui-datepicker td a:hover {
  background: #A8B1BA;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#87919b), to(#a8b1ba));
  background-image: -moz-linear-gradient(top, #87919b, #a8b1ba 100%);
  color: #FFF;
  font-weight: 700;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.7);
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) inset;
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) inset;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) inset;
}

.assets-fm ul {
  list-style: none;
}

/* --- --- -------------- --- --- */
/* --- --- Media Queries  --- --- */
/* --- --- -------------- --- --- */
/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #body {
    width: 712px;
    padding: 48px 28px 280px;
  }

  h1, h2 {
    font-size: 130%;
  }

  header#top {
    width: 100%;
  }

  .twothirds {
    width: 100%;
  }

  .twothirds .third {
    width: 100%;
  }

  .sidebar {
    width: 100% !important;
  }

  #sidebar-bg {
    display: none;
  }

  .item {
    width: 47% !important;
  }

  #navigation {
    width: 95%;
  }
}
/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */
@media only screen and (max-width: 767px) {
  body {
    top: -120px;
  }

  #body {
    width: 100%;
    padding: 48px 34px 280px;
  }

  #work-experience-btn {
    top: 183px;
    right: -12px;
  }

  #howdydo-wrapper, #logo {
    display: none;
    transition: opacity .3s ease-in-out;
  }

  #search-header-box, #feedback-btn, #display-prefs, #navigation nav ul li ul, #sidebar-bg {
    display: none;
  }

  #navigation {
    position: static;
  }

  #navigation nav ul li {
    width: 100%;
    height: 70px;
    clear: both;
  }

  #navigation nav ul li a {
    height: 70px;
    font-size: 150% !important;
  }

  #tagline {
    width: 100%;
  }

  #navigation {
    width: 100%;
  }

  .twothirds, .third {
    width: 100%;
  }

  .twothirds .third {
    width: 100%;
  }

  .sidebar {
    width: 100% !important;
  }

  .dir-cat-box, #easyread-menu .sixth {
    width: 100%;
  }

  header#top {
    width: 100%;
  }

  h1 {
    margin: 0 !important;
    padding: 0 10px 0 0 !important;
    font-size: 30px !important;
    min-height: 0;
  }

  .img-holder {
    width: 100%;
  }

  .half {
    width: 100% !important;
  }

  .img-lft, .img-rgt {
    display: block;
    text-align: center;
    margin: 0 auto;
    float: none;
  }

  .item {
    width: 97% !important;
  }
}
/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  #body {
    width: 436px;
    padding: 36px 22px 280px;
  }

  .item {
    width: 97% !important;
  }
}
/*	Retina media query.
	Overrides styles for devices with a 
	device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */
/**** Isotope filtering ****/
.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -ms-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
  -moz-transition-property: height, width;
  -ms-transition-property: height, width;
  -o-transition-property: height, width;
  transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
  -moz-transition-property: -moz-transform, opacity;
  -ms-transition-property: -ms-transform, opacity;
  -o-transition-property: -o-transform, opacity;
  transition-property: transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  -ms-transition-duration: 0s;
  -o-transition-duration: 0s;
  transition-duration: 0s;
}

#noticeboard-container {
  overflow: visible !important;
}

.noticeboard-calendar-sp a .dir-cat-box {
  width: 100%;
  height: auto;
}
.noticeboard-calendar-sp a .dir-cat-box .icon {
  margin: 5px auto;
  display: none;
}
.noticeboard-calendar-sp a span {
  width: auto;
}

.calendar-listing {
  position: relative;
  padding-bottom: 1em;
}
.calendar-listing h3 {
  color: #249809;
  margin-bottom: 1em;
}

.post-btn {
  position: absolute;
  top: 5em;
  right: 16em;
  z-index: 9000;
}

.item {
  width: 30%;
  margin: 10px;
  padding: 10px;
  float: left;
  overflow: hidden;
  position: relative;
  background: #ffffcc;
  color: black !important;
  box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(-6deg);
  -moz-transform: rotate(-6deg);
  -ms-transform: rotate(-6deg);
  -o-transform: rotate(-6deg);
  transform: rotate(-6deg);
}

.date {
  float: right;
  background-color: white;
  width: 50px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 5px;
  margin-left: 10px;
}
.date div {
  padding: 2px 0;
}
.date .month {
  background-color: red;
  color: white;
  text-transform: uppercase;
}

.options {
  padding-bottom: 0em;
}

.options h3 {
  margin-bottom: 0.2em;
  font-size: 15px;
}

.options h4 {
  font-weight: bold;
}

.options ul {
  margin: 0 !important;
  list-style: none !important;
}

.options ul ul {
  margin-left: 1.5em;
}

.options li {
  float: left;
  margin-bottom: 0.2em;
}

.options li a,
#months {
  display: block;
  padding: 0.4em 0.5em;
  background-color: #DDD;
  color: #222;
  font-weight: bold;
  text-shadow: 0 1px rgba(255, 255, 255, 0.5);
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
  background-image: linear, top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0);
}

.options li a:hover {
  background-color: #5BF;
}

.options li a:active {
  background-color: #39D;
  -webkit-box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.6);
  -o-box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.6);
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.6);
}

.options li a {
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  border-right: 1px solid rgba(0, 0, 0, 0.2);
}

.options li:first-child a {
  border-radius: 7px 0 0 7px;
  border-left: none;
}

.options li:last-child a {
  border-radius: 0 7px 7px 0;
}

.options li a.selected {
  background-color: #13F;
  text-shadow: none;
  color: white;
}

#months {
  display: none;
  font-family: "museo-sans",sans-serif;
  margin-left: 1em;
  font-size: 16px;
  height: 2.2em;
}
#months:focus {
  outline: none;
}

.events {
  background-color: #dde89e;
}

.jobs {
  background-color: #ffed81;
}

.news {
  background-color: #fbc9a1;
}

.updates {
  background-color: #eea7cc;
}

@media only screen and (min-width: 768px) {
  .noticeboard-calendar-sp {
    position: absolute;
    top: 0;
    right: 30px;
  }
}
@media only screen and (min-width: 900px) {
  .noticeboard-calendar-sp a .dir-cat-box {
    height: 105px;
  }
  .noticeboard-calendar-sp a .dir-cat-box .icon {
    height: 60px;
    display: block;
  }
  .noticeboard-calendar-sp a .dir-cat-box span {
    height: auto;
  }
}
/**
 * Trumbowyg v1.1.7 - A lightweight WYSIWYG editor
 * Default stylesheet for Trumbowyg editor
 * ------------------------
 * @link http://alex-d.github.io/Trumbowyg
 * @license MIT
 * @author Alexandre Demode (Alex-D)
 *         Twitter : @AlexandreDemode
 *         Website : alex-d.fr
 */
.trumbowyg-box, .trumbowyg-editor {
  display: block;
  position: relative;
  border: 1px solid #DDD;
  width: 100%;
  min-height: 300px;
  margin: 17px auto;
}

.trumbowyg-box .trumbowyg-editor {
  margin: 0 auto;
}

.trumbowyg-box.trumbowyg-fullscreen {
  background: #FEFEFE;
}

.trumbowyg-editor, .trumbowyg-textarea {
  position: relative;
  background: #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 1% 2%;
  min-height: 300px;
  width: 100%;
  border-style: none;
  resize: none;
  outline: none;
}

.trumbowyg-box-blur .trumbowyg-editor * {
  color: transparent !important;
  text-shadow: 0 0 7px #333;
}

.trumbowyg-box-blur .trumbowyg-editor img {
  opacity: 0.2;
}

.trumbowyg-textarea {
  position: relative;
  display: block;
  overflow: auto;
  border: none;
  white-space: normal;
}

.trumbowyg-editor[contenteditable=true]:empty:before {
  content: attr(placeholder);
  color: #999;
}

.trumbowyg-button-pane {
  margin-left: 0 !important;
  position: relative;
  width: 100%;
  background: #ecf0f1;
  border-bottom: 1px solid #d7e0e2;
  margin: 0;
  padding: 0;
  list-style-type: none;
  line-height: 10px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.trumbowyg-button-pane li {
  margin-bottom: 0 !important;
  display: inline-block;
  text-align: center;
  overflow: hidden;
}

.trumbowyg-button-pane li.trumbowyg-separator {
  width: 1px;
  background: #d7e0e2;
  margin: 0 5px;
  height: 35px;
}

.trumbowyg-button-pane.trumbowyg-disable li:not(.trumbowyg-not-disable) button:not(.trumbowyg-active) {
  opacity: 0.2;
  cursor: default;
}

.trumbowyg-button-pane.trumbowyg-disable li.trumbowyg-separator {
  background: #e3e9eb;
}

.trumbowyg-button-pane:not(.trumbowyg-disable) li button:hover, .trumbowyg-button-pane:not(.trumbowyg-disable) li button:focus, .trumbowyg-button-pane li button.trumbowyg-active, .trumbowyg-button-pane li.trumbowyg-not-disable button:hover, .trumbowyg-button-pane li.trumbowyg-not-disable button:focus {
  background-color: #FFF;
  outline: none;
}

.trumbowyg-button-pane li .trumbowyg-open-dropdown:after {
  display: block;
  content: " ";
  position: absolute;
  top: 25px;
  right: 3px;
  height: 0;
  width: 0;
  border: 3px solid transparent;
  border-top-color: #555;
}

.trumbowyg-button-pane .trumbowyg-buttons-right {
  float: right;
  width: auto;
}

.trumbowyg-button-pane .trumbowyg-buttons-right button {
  float: left;
}

.trumbowyg-dropdown {
  width: 200px;
  border: 1px solid #ecf0f1;
  padding: 5px 0;
  border-top: none;
  background: #FFF;
  margin-left: -1px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 2px 3px;
  box-shadow: rgba(0, 0, 0, 0.1) 0 2px 3px;
}

.trumbowyg-dropdown button {
  display: block;
  width: 100%;
  height: 35px;
  line-height: 35px;
  text-decoration: none;
  background: #FFF;
  padding: 0 14px;
  color: #333;
  border: none;
  cursor: pointer;
  text-align: left;
  font-size: 15px;
  -webkit-transition: all 0.15s;
  -o-transition: all 0.15s;
  transition: all 0.15s;
}

.trumbowyg-dropdown button:hover, .trumbowyg-dropdown button:focus {
  background: #ecf0f1;
}

/* Modal box */
.trumbowyg-modal {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -260px;
  width: 520px;
  height: 290px;
  overflow: hidden;
}

.trumbowyg-modal-box {
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -250px;
  width: 500px;
  height: 275px;
  z-index: 1;
  background-color: #FFF;
  text-align: center;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 3px;
  box-shadow: rgba(0, 0, 0, 0.2) 0 2px 3px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.trumbowyg-modal-box .trumbowyg-modal-title {
  font-size: 24px;
  font-weight: bold;
  margin: 0 0 20px;
  padding: 15px 0 13px;
  display: block;
  border-bottom: 1px solid #EEE;
  color: #333;
  background: #fbfcfc;
}

.trumbowyg-modal-box .trumbowyg-progress {
  width: 100%;
  background: #F00;
  height: 3px;
  position: absolute;
  top: 58px;
}

.trumbowyg-modal-box .trumbowyg-progress .trumbowyg-progress-bar {
  background: #2BC06A;
  height: 100%;
  -webkit-transition: width 0.15s linear;
  -o-transition: width 0.15s linear;
  transition: width 0.15s linear;
}

.trumbowyg-modal-box label {
  display: block;
  position: relative;
  margin: 15px 12px;
  height: 27px;
  line-height: 27px;
  overflow: hidden;
}

.trumbowyg-modal-box label .trumbowyg-input-infos {
  display: block;
  text-align: left;
  height: 25px;
  line-height: 25px;
  -webkit-transition: all 0.15;
  -o-transition: all 0.15;
  transition: all 0.15;
}

.trumbowyg-modal-box label .trumbowyg-input-infos span {
  display: block;
  color: #859fa5;
  background-color: #fbfcfc;
  border: 1px solid #DEDEDE;
  padding: 0 2%;
  width: 19.5%;
}

.trumbowyg-modal-box label .trumbowyg-input-infos span.trumbowyg-msg-error {
  color: #e74c3c;
}

.trumbowyg-modal-box label.trumbowyg-input-error input, .trumbowyg-modal-box label.trumbowyg-input-error textarea {
  border: 1px solid #e74c3c;
}

.trumbowyg-modal-box label.trumbowyg-input-error .trumbowyg-input-infos {
  margin-top: -27px;
}

.trumbowyg-modal-box label input {
  position: absolute;
  top: 0;
  right: 0;
  height: 25px;
  line-height: 25px;
  border: 1px solid #DEDEDE;
  background: transparent;
  width: 72%;
  padding: 0 2%;
  margin: 0 0 0 23%;
  -webkit-transition: all 0.15s;
  -o-transition: all 0.15s;
  transition: all 0.15s;
}

.trumbowyg-modal-box label input:hover, .trumbowyg-modal-box label input:focus {
  outline: none;
  border: 1px solid #95a5a6;
}

.trumbowyg-modal-box label input:focus {
  background: rgba(230, 230, 255, 0.1);
}

.trumbowyg-modal-box .error {
  margin-top: 25px;
  display: block;
  color: red;
}

.trumbowyg-modal-box .trumbowyg-modal-button {
  position: absolute;
  bottom: 10px;
  right: 0;
  text-decoration: none;
  color: #FFF;
  display: block;
  width: 100px;
  height: 35px;
  line-height: 33px;
  margin: 0 10px;
  background-color: #333;
  border: none;
  border-top: none;
  cursor: pointer;
  font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif;
  font-size: 16px;
  -webkit-transition: all 0.15s;
  -o-transition: all 0.15s;
  transition: all 0.15s;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-submit {
  right: 110px;
  background: #2bc069;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-submit:hover, .trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-submit:focus {
  background: #40d47d;
  outline: none;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-submit:active {
  background: #25a259;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-reset {
  color: #555;
  background: #e6e6e6;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-reset:hover, .trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-reset:focus {
  background: #fbfbfb;
  outline: none;
}

.trumbowyg-modal-box .trumbowyg-modal-button.trumbowyg-modal-reset:active {
  background: #d4d4d4;
}

.trumbowyg-overlay {
  position: absolute;
  background-color: rgba(255, 255, 255, 0.5);
  width: 100%;
  left: 0;
  display: none;
}

/**
 * Fullscreen
 */
.trumbowyg-fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  z-index: 99999;
}

.trumbowyg-fullscreen.trumbowyg-box, .trumbowyg-fullscreen .trumbowyg-editor {
  border: none;
}

.trumbowyg-fullscreen .trumbowyg-overlay {
  height: 100% !important;
}

/*
 * Reset for resetCss option
 */
.trumbowyg-editor object, .trumbowyg-editor embed, .trumbowyg-editor video, .trumbowyg-editor img {
  width: auto;
  max-width: 100%;
}

.trumbowyg-editor video, .trumbowyg-editor img {
  height: auto;
}

.trumbowyg-editor img {
  cursor: move;
}

.trumbowyg-editor.trumbowyg-reset-css {
  background: #FEFEFE !important;
  font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.45em !important;
  white-space: normal !important;
  color: #333;
}

.trumbowyg-editor.trumbowyg-reset-css a {
  color: #15c !important;
  text-decoration: underline !important;
}

.trumbowyg-editor.trumbowyg-reset-css div, .trumbowyg-editor.trumbowyg-reset-css p, .trumbowyg-editor.trumbowyg-reset-css ul, .trumbowyg-editor.trumbowyg-reset-css ol, .trumbowyg-editor.trumbowyg-reset-css blockquote {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  background: none !important;
  margin: 0 !important;
  margin-bottom: 15px !important;
  line-height: 1.4em !important;
  font-family: "Trebuchet MS", Helvetica, Verdana, sans-serif !important;
  font-size: 14px !important;
  border: none;
}

.trumbowyg-editor.trumbowyg-reset-css iframe, .trumbowyg-editor.trumbowyg-reset-css object, .trumbowyg-editor.trumbowyg-reset-css hr {
  margin-bottom: 15px !important;
}

.trumbowyg-editor.trumbowyg-reset-css blockquote {
  margin-left: 32px !important;
  font-style: italic !important;
  color: #555;
}

.trumbowyg-editor.trumbowyg-reset-css ul, .trumbowyg-editor.trumbowyg-reset-css ol {
  padding-left: 20px !important;
}

.trumbowyg-editor.trumbowyg-reset-css ul ul, .trumbowyg-editor.trumbowyg-reset-css ol ol, .trumbowyg-editor.trumbowyg-reset-css ul ol, .trumbowyg-editor.trumbowyg-reset-css ol ul {
  border: none;
  margin: 2px !important;
  padding: 0 !important;
  padding-left: 24px !important;
}

.trumbowyg-editor.trumbowyg-reset-css hr {
  display: block;
  height: 1px;
  border: none;
  border-top: 1px solid #CCC;
}

.trumbowyg-editor.trumbowyg-reset-css h1, .trumbowyg-editor.trumbowyg-reset-css h2, .trumbowyg-editor.trumbowyg-reset-css h3, .trumbowyg-editor.trumbowyg-reset-css h4 {
  color: #111;
  background: none;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: bold;
}

.trumbowyg-editor.trumbowyg-reset-css h1 {
  font-size: 32px !important;
  line-height: 38px !important;
  margin-bottom: 20px !important;
}

.trumbowyg-editor.trumbowyg-reset-css h2 {
  font-size: 26px !important;
  line-height: 34px !important;
  margin-bottom: 15px !important;
}

.trumbowyg-editor.trumbowyg-reset-css h3 {
  font-size: 22px !important;
  line-height: 28px !important;
  margin-bottom: 7px !important;
}

.trumbowyg-editor.trumbowyg-reset-css h4 {
  font-size: 16px !important;
  line-height: 22px !important;
  margin-bottom: 7px !important;
}

/*
 * Buttons icons
 */
.trumbowyg-button-pane li button {
  display: block;
  position: relative;
  text-indent: -9999px;
  width: 35px;
  height: 35px;
  overflow: hidden;
  background: transparent url("/images/trumbowyg/icons.png") no-repeat;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.15s, background-image 0.15s, opacity 0.15s;
  -o-transition: background-color 0.15s, background-image 0.15s, opacity 0.15s;
  transition: background-color 0.15s, background-image 0.15s, opacity 0.15s;
  /* English and others */
}

.trumbowyg-button-pane li button.trumbowyg-viewHTML-button {
  background-position: 5px -545px;
}

.trumbowyg-button-pane li button.trumbowyg-formatting-button {
  background-position: 5px -120px;
}

.trumbowyg-button-pane li button.trumbowyg-bold-button, .trumbowyg-button-pane li button.trumbowyg-strong-button {
  background-position: 5px -45px;
}

.trumbowyg-button-pane li button.trumbowyg-italic-button, .trumbowyg-button-pane li button.trumbowyg-em-button {
  background-position: 5px 5px;
}

.trumbowyg-button-pane li button.trumbowyg-underline-button {
  background-position: 5px -470px;
}

.trumbowyg-button-pane li button.trumbowyg-strikethrough-button, .trumbowyg-button-pane li button.trumbowyg-del-button {
  background-position: 5px -445px;
}

.trumbowyg-button-pane li button.trumbowyg-link-button {
  background-position: 5px -345px;
}

.trumbowyg-button-pane li button.trumbowyg-insertImage-button {
  background-position: 5px -245px;
}

.trumbowyg-button-pane li button.trumbowyg-justifyLeft-button {
  background-position: 5px -320px;
}

.trumbowyg-button-pane li button.trumbowyg-justifyCenter-button {
  background-position: 5px -70px;
}

.trumbowyg-button-pane li button.trumbowyg-justifyRight-button {
  background-position: 5px -395px;
}

.trumbowyg-button-pane li button.trumbowyg-justifyFull-button {
  background-position: 5px -295px;
}

.trumbowyg-button-pane li button.trumbowyg-unorderedList-button {
  background-position: 5px -495px;
}

.trumbowyg-button-pane li button.trumbowyg-orderedList-button {
  background-position: 5px -370px;
}

.trumbowyg-button-pane li button.trumbowyg-horizontalRule-button {
  background-position: 5px -220px;
}

.trumbowyg-button-pane li button.trumbowyg-fullscreen-button {
  background-position: 5px -170px;
}

.trumbowyg-button-pane li button.trumbowyg-close-button {
  background-position: 5px -95px;
}

.trumbowyg-fullscreen .trumbowyg-button-pane li button.trumbowyg-fullscreen-button {
  background-position: 5px -145px;
}

.trumbowyg-button-pane li:first-child button {
  margin-left: 6px;
}

.trumbowyg-button-pane li:last-child button {
  margin-right: 6px;
}

/* French */
.trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-bold-button, .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-strong-button {
  background-position: 5px -195px;
}

.trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-underline-button {
  background-position: 5px -420px;
}

.trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-strikethrough-button, .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-del-button {
  background-position: 5px -270px;
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  /* French */
  .trumbowyg-button-pane li button {
    -webkit-background-size: 25px 575px !important;
    background-size: 25px 575px !important;
    background-image: url("./images/icons-2x.png") !important;
    /* English and others */
  }

  .trumbowyg-button-pane li button.trumbowyg-viewHTML-button {
    background-position: 5px -545px;
  }

  .trumbowyg-button-pane li button.trumbowyg-formatting-button {
    background-position: 5px -120px;
  }

  .trumbowyg-button-pane li button.trumbowyg-bold-button, .trumbowyg-button-pane li button.trumbowyg-strong-button {
    background-position: 5px -45px;
  }

  .trumbowyg-button-pane li button.trumbowyg-italic-button, .trumbowyg-button-pane li button.trumbowyg-em-button {
    background-position: 5px 5px;
  }

  .trumbowyg-button-pane li button.trumbowyg-underline-button {
    background-position: 5px -470px;
  }

  .trumbowyg-button-pane li button.trumbowyg-strikethrough-button, .trumbowyg-button-pane li button.trumbowyg-del-button {
    background-position: 5px -445px;
  }

  .trumbowyg-button-pane li button.trumbowyg-link-button {
    background-position: 5px -345px;
  }

  .trumbowyg-button-pane li button.trumbowyg-insertImage-button {
    background-position: 5px -245px;
  }

  .trumbowyg-button-pane li button.trumbowyg-justifyLeft-button {
    background-position: 5px -320px;
  }

  .trumbowyg-button-pane li button.trumbowyg-justifyCenter-button {
    background-position: 5px -70px;
  }

  .trumbowyg-button-pane li button.trumbowyg-justifyRight-button {
    background-position: 5px -395px;
  }

  .trumbowyg-button-pane li button.trumbowyg-justifyFull-button {
    background-position: 5px -295px;
  }

  .trumbowyg-button-pane li button.trumbowyg-unorderedList-button {
    background-position: 5px -495px;
  }

  .trumbowyg-button-pane li button.trumbowyg-orderedList-button {
    background-position: 5px -370px;
  }

  .trumbowyg-button-pane li button.trumbowyg-horizontalRule-button {
    background-position: 5px -220px;
  }

  .trumbowyg-button-pane li button.trumbowyg-fullscreen-button {
    background-position: 5px -170px;
  }

  .trumbowyg-button-pane li button.trumbowyg-close-button {
    background-position: 5px -95px;
  }

  .trumbowyg-fullscreen .trumbowyg-button-pane li a.trumbowyg-fullscreen-button {
    background-position: 5px -145px;
  }

  .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-bold-button, .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-strong-button {
    background-position: 5px -195px;
  }

  .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-underline-button {
    background-position: 5px -420px;
  }

  .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-strikethrough-button, .trumbowyg-fr .trumbowyg-button-pane li button.trumbowyg-del-button {
    background-position: 5px -270px;
  }
}
.socials a {
  color: #fff;
  font-size: 2em;
  display: inline-block;
  margin-right: 0.75em;
}

@font-face {
  font-family: 'icomoon';
  src: url("/fonts/social/icomoon.eot?66cbtk");
  src: url("/fonts/social/icomoon.eot?66cbtk#iefix") format("embedded-opentype"), url("/fonts/social/icomoon.ttf?66cbtk") format("truetype"), url("/fonts/social/icomoon.woff?66cbtk") format("woff"), url("/fonts/social/icomoon.svg?66cbtk#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-twitter:before {
  content: "\e900";
}

.icon-facebook:before {
  content: "\e901";
}
