/**
 * Global styles
 *
 * @author			Zone
 * @email				hello@thisiszone.com
 * @url					https://6bc5289e-7003-4496-8d7a-d48371adbc16.p.bardy.io/
 * @copyright   Copyright (c) 2012, thisiszone.com. All rights reserved.
 * @version			0.0.1
 */
/*
* Base Styles
*
* $author			Zone
* $email			hello$thisiszone.com
* $url				https://6bc5289e-7003-4496-8d7a-d48371adbc16.p.bardy.io/
* $copyright  Copyright (c) 2012, thisiszone.com. All rights reserved.
* $version		0.0.1
*/
/* COLOURS
------------------------------------------------------------------------------------------------------------------------------------- */



html {
  color: #000;
  background: #FFF; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, select, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, button, caption, cite, code, dfn, em, input, optgroup, option, select, strong, textarea, th, var {
  font: inherit; }

del, ins {
  text-decoration: none; }

li {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: baseline; }

sub {
  vertical-align: baseline; }

legend {
  color: #000; }

/* HTML 5 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
  margin: 0;
  padding: 0; }

/* Clearfix */
.group:before, .group:after {
  content: "";
  display: table; }

.group:after {
  clear: both; }

.group {
  zoom: 1; }

/**
* Grid styles
*
* $author			Dominic da Costa $ Zone
* $email			ddacosta$thisiszone.com
* $url				https://6bc5289e-7003-4496-8d7a-d48371adbc16.p.bardy.io/
* $copyright  Copyright (c) 2012, thisiszone.com. All rights reserved.
* $version		1.0.0
*/
.grid {
  width: 730px;
  padding: 0;
  float: none;
  zoom: 1;
  border-bottom: 1px dotted;
  margin: 20px 0;
  background: rgba(255, 0, 0, 0.05); }

.grid:before, .grid:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden; }

.grid:after {
  clear: both; }

.grid [class*="span"] {
  background: #dfdfdf;
  height: 65px; }

.row {
  display: block;
  margin: 0;
  padding: 0;
  width: 100%;
  float: none;
  zoom: 1; }

.row:before, .row:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden; }

.row:after {
  clear: both; }

.spanppad1 {
  width: 190px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp2 {
  width: 440px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp3 {
  width: 690px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp4 {
  width: 940px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp5 {
  width: 1190px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp6 {
  width: 1440px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp7 {
  width: 1690px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp8 {
  width: 1940px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp9 {
  width: 2190px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp10 {
  width: 2440px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp11 {
  width: 2690px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left; }

.spanp12 {
  width: 2940px;
  margin: 0 20px 20px 0;
  padding: 20px;
  float: left;
  margin-right: 0; }

.span1 {
  width: 230px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span2 {
  width: 480px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span3 {
  width: 730px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span4 {
  width: 980px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span5 {
  width: 1230px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span6 {
  width: 1480px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span7 {
  width: 1730px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span8 {
  width: 1980px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span9 {
  width: 2230px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span10 {
  width: 2480px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span11 {
  width: 2730px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left; }

.span12 {
  width: 2980px;
  margin: 0 20px 20px 0;
  padding: 0;
  float: left;
  margin-right: 0; }

.offset1 {
  margin: 0 20px 20px 250px;
  float: none; }

.offset2 {
  margin: 0 20px 20px 500px;
  float: none; }

.offset3 {
  margin: 0 20px 20px 750px;
  float: none; }

.offset4 {
  margin: 0 20px 20px 1000px;
  float: none; }

.offset5 {
  margin: 0 20px 20px 1250px;
  float: none; }

.offset6 {
  margin: 0 20px 20px 1500px;
  float: none; }

.offset7 {
  margin: 0 20px 20px 1750px;
  float: none; }

.offset8 {
  margin: 0 20px 20px 2000px;
  float: none; }

.offset9 {
  margin: 0 20px 20px 2250px;
  float: none; }

.offset10 {
  margin: 0 20px 20px 2500px;
  float: none; }

.offset11 {
  margin: 0 20px 20px 2750px;
  float: none; }

[class*="span"]:last-child {
  margin-right: 0; }

/* Table of Contents
#Fonts
#Blockquotes
#Links
#Lists
#Images
#buttons
#accordion
#navigation
#Figures
#Tables
#File Types
*/
/* #Fonts ------------------------------------------------------------------------ */
body {
  padding: 0;
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: #333333;
  font-size: 100% !important;
  line-height: 1.467em; }

h1 {
  color: #008A26;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.467em;
  margin: 0 0 10px; }

h2, h3, h4, h5, h6 {
  color: #008A26;
  font-family:Arial, Helvetica, sans-serif;
  line-height: 1.467em;
  margin: 0 0 10px; }

.macmillan {
  font-family: Arial, Helvetica, sans-serif; }

h1 {
  font-size: 4.250em; }

/* 64px */
h2 {
  font-size: 2.133em; }

/* 32px */
h3 {
  font-size: 1.500em; }

/* 24px */
h4 {
  font-size: 1.25em; }

/* 20px */
h5, h6 {
  font-size: 1.067em; }

/* 16px */
h3 {
  clear: both;
  display: block; }

h2 {
  clear: both;
  display: block; }

.capitalise em {
  text-transform: uppercase; }

.darkheading,
p.intro {
  color: #008A26;
  line-height: 1.467em; }

#primaryheader #headertitle .smallest {
  font-size: 0.6em; }

/* 9.6px */
.footer p,
.footer li {
  font-size: 0.7em; }

/* 11px */
#primarynav a,
#primaryheader #headertitle .smaller,
.accordion .accordion-btn .date {
  font-size: 0.75em; }

/* 12px */
.footer .title {
  font-size: 0.88em; }

/* 14px */
.contextheader span.large,
.progress .btn-white span.content {
  font-size: 1.25em; 
   line-height: 1.467em;
}

/* 20px */
.insetboxgreen .title {
  font-size: 1.3em; }

/* 20.8px */
p.intro,
.contextheader .title,
.progress .infobox2 .number,
.donatenowwidget .title {
  font-size: 1.5em; }

/* 24px */
.progress .counter {
  font-size: 1.8em; }

/* 28.8px */
#primaryheader #headertitle {
  font-size: 4.250em; }

/* 68.26px */
p {
  margin: 0 0 15px 0; }

p img {
  margin: 0; }

em {
  font-style: none; }

strong {
  font-weight: 800;
  color: #008A26; }

small {
  font-size: 80%; }

blockquote {
  font-size: 1.333em;
  line-height: 1.125em;
  color: #008A26;
  padding: 1.25em 1em 1.25em 1em;
  margin-bottom: 10px;
  position: relative; }

/* 32px  */
blockquote p {
  font-size: 1em;
  display: inline;
  color: #008A26; }

blockquote:before {
  content: '"';
  font-family: Arial, Helvetica, sans-serif; }

blockquote:after {
  content: '"';
  font-family: Arial, Helvetica, sans-serif; }

blockquote .source {
  display: block;
  font-size: 0.8em;
  color: #333332;
  position: absolute;
  margin-top: 10px; }

/* 15px */
blockquote .source a,
blockquote .source a:visited,
blockquote .source a:visited {
  color: #333332; }

hr {
  border: solid #f2f2ef;
  border-width: 1px 0 0;
  clear: both;
  margin: 10px 0 15px;
  height: 0; }

br {
  clear: both;
  height: 0; }

a, a:visited {
  color: #008A26;
  text-decoration: none;
  outline: 0; }

/*a:hover, a:focus {color: $color-link;text-decoration: none;  border-color:$color-link;}*/
a:active {
  color: #8cc63e;
  text-decoration: none;
  border-color: transparent; }

a:hover,
a:focus {
  text-decoration: underline; }

p a, p a:visited {
  line-height: inherit; }

a * {
  cursor: pointer; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  color: inherit;
  font-weight: inherit; }

ul, ol, dl {
  margin-bottom: 1.25em; }

ul {
  list-style: none outside; }

ol {
  list-style: decimal; }

ol, ul.square, ul.circle, ul.disc {
  margin-left: 30px; }

ul.square {
  list-style: square outside; }

ul.circle {
  list-style: circle outside; }

ul.disc {
  list-style: disc outside; }

ul ul, ul ol,
ol ol, ol ul {
  margin: 0.75em 0 0.3125em 1.875em; }

ul ul li, ul ol li,
ol ol li, ol ul li {
  margin-bottom: 6px; }

li {
  line-height: 1.125em;
  margin-bottom: 0.75em; }

ul li {
  list-style-image: url("../_images/css/backgrounds/greenbullet.png"); }

ul.large li {
  line-height: 21px; }

li p {
  line-height: 1.3125em; }

dt {
  line-height: 1.125em;
  margin-bottom: 0.75em; }

dd {
  line-height: 1.125em;
  margin-bottom: 0.75em;
  margin-left: 1em;
  font-style: italic; }

.nav li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style-type: none; }

img.scale-with-grid {
  max-width: 100%;
  height: auto; }

img {
  max-width: 100%; }

img.right {
  float: right;
  margin-bottom: 8px;
  margin-right: 16px; }

img.left {
  float: left;
  margin-right: 16px; }

img.center {
  display: block;
  margin: 0 auto; }

.spacer {
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1; }

.spacer.none {
  margin-bottom: 0;
  margin-top: 0; }

.spacer.top {
  margin-top: 20px; }

.spacer.bottom {
  margin-bottom: 20px; }

.button {
  font-family: Arial, Helvetica, sans-serif; }

.accordion-btn {
  font-family: Arial, Helvetica, sans-serif; }

.figure {
  padding: 0.25em;
  margin-bottom: 0.5em; }

.figcaption {
  display: block;
  text-align: center; }

.filesize, .sup, sup {
  vertical-align: baseline;
  font-size: 0.8em;
  position: relative;
  top: -0.4em; }

br, hr {
  zoom: 1; }
  br:before, br:after, hr:before, hr:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden; }
  br:after, hr:after {
    clear: both; }

hr {
  border-bottom: 2px dotted white;
  margin: 20px; }

pre, code {
  display: block;
  background: white;
  padding: 20px;
  margin: -10px 0 10px;
  border: 1px dotted #008A26;
  width: 350px; }

pre.comment, code.comment {
  position: absolute;
  right: -220px;
  z-index: 99999; }

/*************************************************************************
#Forms
**************************************************************************/
input {
  background: none repeat scroll 0 0 #FFFFFF;
  border: medium none;
  color: #333332;
  padding: 0.25em 0.75em;
  /* 4px, 12px/16px */
  /* These styles force the IE6 box model - e.g. padding does not affect width */
  box-sizing: border-box;
  /* css3 rec */
  -moz-box-sizing: border-box;
  /* ff2 */
  -ms-box-sizing: border-box;
  /* ie8 */
  -webkit-box-sizing: border-box;
  /* safari3 */
  -khtml-box-sizing: border-box;
  /* konqueror */ }

form {
  margin-bottom: 1.25em; }

/* 20px/16px */
.rowElem {
  overflow: hidden; }

fieldset {
  margin-bottom: 1.25em; }

/* 20px/16px */
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
  border: 1px solid #ccc;
  padding: 0.375em 0.25em;
  /* 6px 4px/16px */
  outline: none;
  color: #333332;
  margin: 0;
  width: 210px;
  max-width: 100%;
  display: block;
  margin-bottom: 1.25em;
  /* 20px/16px */
  background: #fff; }

select {
  padding: 0; }

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
  border: 1px solid #aaa;
  color: #333332; }

textarea {
  min-height: 60px; }

legend {
  display: block;
  font-weight: bold;
  font-size: 1em; }

/* 13px/16px */
label {
  display: block;
  font-size: 1em; }

/* 13px/16px */
select {
  width: 220px; }

input[type="checkbox"] {
  display: inline;
  color: #333332; }

label span,
legend span {
  font-weight: normal;
  font-size: 1em;
  /* 13px/16px */ }

/*-----------------------------------------------------------------------------
Form Components
-------------------------------------------------------------------------------*/
/* ---------- colour options ----------*/
.field input,
.field textarea,
fieldset .field .select,
.lightform .field input,
.lightform .field textarea,
.lightform fieldset .field .select {
  background-color: #f2f2ef; }

.darkform .field input,
.darkform .field textarea,
.darkform .field .select {
  background-color: white; }

/* ---------- positioning, base settings ----------*/
fieldset label {
  margin-bottom: 5px;
  color: #333333;
  font-weight: normal; }

fieldset .label {
  color: #333333;
  font-size: 1em; }

.checkbox,
.radio {
  margin-bottom: 10px; }

.radio input,
.radio label,
.radio select,
.checkbox input,
.checkbox label,
.checkbox select,
.fakefile input,
.fakefile .button {
  display: inline-block; }

.field input,
.field textarea {
  padding: 10px 10px;
  border: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

.field p {
  margin-bottom: 0; }

fieldset .row img.alignright {
  padding: 20px 0 20px 20px; }

fieldset .row img.alignleft {
  padding: 20px 20px 20px 0; }

/* ---------- half-width inputs ----------*/
.row .field.half input,
.row .field.half .select {
  width: 43%; }

.row .field.half .select select {
  width: 127%; }

.row .field.half .select {
  margin-right: 20px;
  display: inline-block; }

.row .field.half .select:last-child {
  margin-right: 0; }

.ie7 .row .field.half input,
.ie7 .row .field.half .select,
.ie8 .row .field.half input,
.ie8 .row .field.half .select {
  width: 39%; }

.ie7 .row .field.half .select {
  display: inline; }

.ie7 .row .field.half .select select {
  width: auto; }

/* ---------- inline inputs ----------*/
.field input,
.field .select {
  width: 100%; }

.field textarea {
  width: 92%; }

.field textarea {
  width: 96%; }

.field.col1 {
  margin-bottom: 0; }

.inline label,
.inline input,
.inline textarea,
.inline-dropdown label,
.inline-dropdown .select,
.inline .button,
.custom-radio.inline .radio {
  display: inline-block; }

.inline label {
  width: 40%; }

.inline input {
  width: 59%; }

.inline input.small {
  width: 29%; }

.inline input.tiny {
  width: 19%; }

.inline input.large {
  width: 79%; }

.inline-dropdown .select {
  width: 58%; }

.inline label,
.inline-dropdown label {
  width: 39.9%; }

.inline input {
  width: 59%; }

/* fix for inline-dropdown inline-block error */
.inline-dropdown label {
  padding-top: 12px;
  vertical-align: top; }

.prefix input, .prefix .select, .prefix textarea {
  max-width: 69%;
  margin-left: 2%;
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1; }

.suffix input, .suffix .select, .suffix textarea {
  max-width: 69%;
  margin-right: 2%;
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1; }

/* ---------- interactivity ----------*/
.field input,
.field textarea,
.field .select,
.fakefile input {
  border: 1px solid transparent; }

.field input:focus,
.field .select:focus,
.field textarea:focus,
.fakefile input:focus {
  border: 1px solid #999999; }

/* ---------- custom inputs ----------*/
.field .select {
  background: url(../_images/css/buttons/select_box_arrow.png);
  background-position: right 0;
  background-repeat: no-repeat;
  margin-bottom: 20px;
  overflow: hidden;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

.field .select select {
  background: transparent;
  width: 112%;
  max-width: none;
  margin-bottom: 0;
  padding: 8px 10px;
  border: transparent;
  -webkit-appearance: none; }

.radio .ui-icon {
  width: 21px;
  height: 21px; }

.radio .ui-state-default .ui-icon {
  background-image: url(../_images/css/buttons/radio_sprite.png);
  background-position: 0 0;
  background-repeat: no-repeat; }

.radio .ui-state-active .ui-icon {
  background-position: -30px 0; }

.darkform .radio .ui-state-default .ui-icon {
  background-position: -60px 0; }

.darkform .radio .ui-state-active .ui-icon {
  background-position: -90px 0; }

.lightform .radio .ui-state-default .ui-icon {
  background-position: 0 0; }

.lightform .radio .ui-state-active .ui-icon {
  background-position: -30px 0; }

.radio .ui-state-active .ui-button-text {
  color: #008A26; }

.checkbox .ui-icon {
  width: 21px;
  height: 21px; }

.checkbox .ui-state-default .ui-icon {
  background-image: url(../_images/css/buttons/checkbox_sprite.png);
  background-position: 0 0;
  background-repeat: no-repeat; }

.checkbox .ui-state-active .ui-icon {
  background-position: -30px 0; }

.checkbox .ui-state-active .ui-button-text {
  color: #008A26; }

.darkform .checkbox .ui-state-default .ui-icon {
  background-position: -60px 0; }

.darkform .checkbox .ui-state-active .ui-icon {
  background-position: -90px 0; }

.lightform .checkbox .ui-state-default .ui-icon {
  background-position: 0 0; }

.lightform .checkbox .ui-state-active .ui-icon {
  background-position: -30px 0; }

.ui-state-focus .ui-button-text,
.ui-widget-content .ui-state-focus .ui-button-text,
.ui-widget-header .ui-state-focus .ui-button-text {
  outline: 1px dotted; }

.ui-widget :active {
  outline: none; }

.field .fakefile {
  overflow: hidden;
  zoom: 1; }

#content .field .fakefile input {
  width: 79%;
  margin-right: 5px; }

.no-js .field .fakefile {
  display: none; }

/* ---------- question pop up ----------*/
a.question .icon {
  background: url(../_images/css/buttons/info_sprite.png) 0 0 no-repeat;
  width: 20px;
  display: inline-block;
  text-indent: -9999px; }

a.question .content {
  background: #f2f2ef;
  width: 200px;
  display: none;
  margin-left: 130px;
  padding: 20px;
  position: absolute;
  font-size: 14px;
  z-index: 4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

a.question:hover .content {
  display: block; }

.lightform a.question .content {
  background: #f2f2ef; }

.darkform a.question .content {
  background: white; }

/* ---------- validation ----------*/
fieldset .row {
  position: relative; }

.errorbox input,
.errorbox textarea,
.errorbox .select,
#content .errorbox .ui-icon {
  border: 1px solid red; }

.errorbox .messagebox {
  display: block; }

.error .alert,
p.error {
  font-size: 14px;
  color: red; }

.alert {
  color: #008A26; }

.radio.error label,
.checkbox.error label {
  color: red; }

.field .messagebox {
  top: 24px; }

.inline .messagebox {
  top: 0px; }

fieldset .messagebox {
  background: url("../_images/css/backgrounds/validation_box.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  width: 230px;
  padding-top: 15px;
  position: absolute;
  top: 0;
  right: -272px;
  display: none;
  z-index: 5; }

fieldset .messagebox p.error {
  background: url("../_images/css/backgrounds/validation_box.png");
  background-position: 0 bottom;
  background-repeat: no-repeat;
  width: 198px;
  margin-bottom: -20px;
  padding: 0 11px 15px 20px;
  color: black; }

fieldset .messagebox p:after {
  background: url("../_images/css/backgrounds/validation_box_tail.png") no-repeat;
  content: "";
  width: 74px;
  height: 40px;
  display: block;
  position: absolute;
  left: -40px;
  top: 4px; }

/* ---------- ie overwrites ----------*/
.ie7 .radio input,
.ie7 .radio label,
.ie7 .radio select,
.ie7 .checkbox input,
.ie7 .checkbox label,
.ie7 .checkbox select,
.ie7 .fakefile input,
.ie7 .fakefile .button {
  display: inline; }

.ie7 .field select {
  background: #f2f2ef; }

.ie7 .col2 .field input,
.ie7 .col2 .field textarea {
  width: 96%; }

.ie7 .field .select {
  background: none;
  width: 100%; }

.ie7 .field .select select {
  background: normal;
  width: 100%;
  margin-bottom: 0;
  padding: 8px 10px;
  border: transparent;
  -webkit-appearance: none; }

.ie7 fieldset .col1 {
  overflow: hidden; }

.ie7 fieldset .col2 .field textarea {
  width: 100%; }

/*-----------------------------------------------------------------------------
Unique sections
-------------------------------------------------------------------------------*/
/* 
.wideform gives the grey box and out-of-grid page width
fieldset.paddingright adds the large padding to the right,
.full uses standard padding. default is full 
*/
.wideform {
  float: left;
  margin: 0 20px 20px 0; }

.wideform:before {
  background: url("../_images/css/backgrounds/grey_box_top.png") no-repeat;
  content: "";
  height: 48px;
  width: 670px;
  display: block; }

.wideform:after {
  background: url("../_images/css/backgrounds/grey_box_bottom.png") no-repeat;
  content: "";
  height: 30px;
  width: 670px;
  display: block; }

.wideform:before {
  background-position: 0 0; }

.wideform:after {
  background-position: 100% 100%; }

.wideform .formcontent {
  background: #f2f2f2;
  margin-top: 0;
  padding-bottom: 10px; }

.wideform .formcontent fieldset,
.wideform .formcontent .full {
  width: 610px;
  margin-bottom: 0;
  padding: 0 30px 0 30px; }

.wideform .formcontent .paddingright {
  width: 480px;
  padding-right: 160px; }

.wideform .title {
  clear: none; }

.ie7 .wideform .formcontent {
  padding-top: 20px;
  padding-bottom: 20px; }

.insetboxwhite {
  margin-bottom: 20px;
  padding: 0;
  position: relative; }

.insetboxwhite:before {
  background: url("../_images/css/backgrounds/white_insetbox_top.png") no-repeat;
  content: "";
  height: 63px;
  width: 610px;
  display: block; }

.insetboxwhite:after {
  background: url("../_images/css/backgrounds/white_insetbox_bottom.png") no-repeat;
  content: "";
  height: 44px;
  width: 610px;
  display: block; }

.insetboxwhite .content {
  background: white;
  width: 570px;
  margin-top: -20px;
  padding: 0 20px; }

.insetboxwhite .content p {
  margin-bottom: 0; }

.insetboxwhite .content .title {
  width: 480px; }

.insetboxgreen {
  margin-bottom: 20px;
  padding: 0;
  position: relative; }

.insetboxgreen:before {
  background: url("../_images/css/backgrounds/green_insetbox_top.png") no-repeat;
  content: "";
  height: 46px;
  width: 610px;
  display: block; }

.insetboxgreen:after {
  background: url("../_images/css/backgrounds/green_insetbox_bottom.png") no-repeat;
  content: "";
  height: 44px;
  width: 610px;
  display: block; }

.insetboxgreen .content {
  background: #008A26;
  width: 570px;
  margin-top: -20px;
  padding: 0 20px; }

.insetboxgreen .content p {
  margin-bottom: 0;
  color: white; }

.insetboxgreen .content .title {
  color: white; }

.insetboxwhite .close,
.insetboxgreen .close {
  background: url("../_images/css/buttons/close_button_orange.png") no-repeat;
  width: 37px;
  height: 37px;
  display: block;
  position: absolute;
  top: -13px;
  right: -13px;
  text-indent: -9999px; }

fieldset .popup {
  position: absolute;
  z-index: 999; }

.ie7 .wideform .formcontent {
  background: #f2f2f2;
  margin-top: 0px; }

.ie7 .insetboxwhite .content,
.ie7 .insetboxgreen .content {
  padding-top: 20px;
  padding-bottom: 20px; }

.maskGrid2 .title {
  width: 80%; }

.maskGrid2 .customWidth {
  padding: 0 30px; }

.maskGrid2:before,
.maskGrid2:after {
  background: url("../_images/css/backgrounds/mask_grid2.png") no-repeat;
  content: "";
  width: 480px;
  display: block; }

.maskGrid2:before {
  background-position: 0 0;
  height: 50px; }

.maskGrid2:after {
  background-position: 100% 100%;
  height: 42px; }

.maskGrid2 .maskContent {
  margin-bottom: -25px;
  margin-top: -15px; }

.maskGrid2Primary,
.maskGrid2Primary:before,
.maskGrid2Primary:after,
.maskGrid2Primary .maskContent {
  background-color: #f2f2f2; }

.lt-ie8 .maskGrid2Primary {
  background-color: none; }

/*-----------------------------------------------------------------------------
Progress box settings
-------------------------------------------------------------------------------*/
.progress {
  position: absolute;
  margin-left: 690px; }

.progress .infobox1 {
  margin-bottom: 20px; }

.progress .infobox1 p:after {
  background: url("../_images/css/backgrounds/green_tail.png") no-repeat;
  content: "";
  width: 74px;
  height: 40px;
  display: block;
  position: absolute;
  left: -40px;
  top: 54px; }

.sticky .progress {
  position: fixed;
  top: 10px;
  -webkit-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  transition: all 300ms linear; }

.ie7 .progress {
  margin-left: 20px;
  z-index: 1; }

/*-----------------------------------------------------------------------------
jQuery UI custom button css
-------------------------------------------------------------------------------*/
/* ---------- Layout Helpers ----------*/
.ui-helper-hidden {
  display: none; }

.ui-helper-hidden-accessible {
  position: absolute;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px); }

.ui-helper-reset {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  line-height: 1.3;
  text-decoration: none;
  font-size: 100%;
  list-style: none; }

.ui-helper-clearfix:before, .ui-helper-clearfix:after {
  content: "";
  display: table; }

.ui-helper-clearfix:after {
  clear: both; }

.ui-helper-clearfix {
  zoom: 1; }

.ui-helper-zfix {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  filter: Alpha(Opacity=0); }

/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
  cursor: default; }

/* states and images */
.ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat; }

/* Overlays */
.ui-widget-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.ui-button {
  display: inline-block;
  position: relative;
  padding: 0;
  margin-right: .1em;
  text-decoration: none;
  cursor: pointer;
  text-align: center;
  zoom: 1;
  overflow: visible; }

/* the overflow property removes extra width in IE */
.ui-button-icon-only {
  width: 2.2em; }

/* to make room for the icon, a width needs to be set here */
button.ui-button-icon-only {
  width: 2.4em; }

/* button elements seem to need a little more width */
.ui-button-icons-only {
  width: 3.4em; }

button.ui-button-icons-only {
  width: 3.7em; }

/*button text element */
.ui-button .ui-button-text {
  display: block;
  line-height: 1.4;
  text-align: left; }

.ui-button-text-only .ui-button-text {
  padding: .4em 1em; }

.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
  padding: .4em;
  text-indent: -9999999px; }

.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
  padding: .4em 1em .4em 2.1em; }

.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
  padding: .4em 2.1em .4em 1em; }

.ui-button-text-icons .ui-button-text {
  padding-left: 2.1em;
  padding-right: 2.1em; }

/* no icon support for input elements, provide padding by default */
input.ui-button {
  padding: .4em 1em; }

/*button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
  position: absolute;
  top: 50%;
  margin-top: -10px; }

.ui-button-icon-only .ui-icon {
  left: 50%;
  margin-left: -8px; }

/*button sets*/
.ui-buttonset {
  margin-right: 7px; }

.ui-buttonset .ui-button {
  margin-left: 0;
  margin-right: -0.3em; }

/* workarounds */
button.ui-button::-moz-focus-inner {
  border: 0;
  padding: 0; }

/* Table of Contents


/* #Buttons ------------------------------------------------------------------------ */
.button,
.button:visited {
  background-color: #008A26;
  padding: 2.5px 5px;
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  color: white;
  cursor: pointer;
  -webkit-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  -moz-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  -o-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  border: none;
  z-index: 20; }

.button-printshare {
  width: 80px;
  height: 25px;
  padding: 0;
  background-image: url("../_images/css/backgrounds/iconsbgsprite.png");
  background-repeat: no-repeat;
  background-position: -11px -281px;
  color: #008A26;
  font-size: 0.8em;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  position: relative; }

.printsharetext {
  text-transform: none;
  padding: 2px 0px 0 7px;
  position: absolute;
  color: #008A26;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold; }

.button-printshare i {
  position: absolute;
  right: 5px;
  top: 6px; }

.button-findoutmore {
  font-family: Arial, Helvetica, sans-serif;
  padding: 0;
  position: absolute;
  bottom: 30px; }

.button-findoutmore .content {
  padding-right: 40px !important; }

.button-findoutmore i {
  background: url(../_images/css/backgrounds/findmorechev.png) no-repeat;
  width: 12px;
  height: 17px;
  position: absolute;
  right: 2px;
  top: 13px; }

#content .button-printshare {
  background-color: transparent; }

#content .darkform .button-printshare {
  background: white; }

#content .lightform .button-printshare {
  background: transparent url("../_images/css/backgrounds/iconsbgsprite.png") -11px -281px no-repeat; }

.arrowlink {
  margin-right: 15px;
  position: relative;
  border-bottom: dotted 1px #008A26;
  line-height: 20px;
  display: inline-block;
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;
  transition: none; }

.arrowlink i {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") -20px -199px no-repeat;
  width: 15px;
  height: 12px;
  position: absolute;
  right: -15px;
  top: 6px;
  display: block; }

.arrowlink:hover,
.arrowlink:focus {
  color: #008A26;
  border-bottom: dotted 1px #008A26;
  text-decoration: none; }

.arrowlink:hover i,
.arrowlink:focus i {
  background-position: -20px -215px; }

.arrowlink.prev {
  margin-left: 20px;
  margin-right: 0; }

.arrowlink.prev i {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") -20px -184px no-repeat;
  left: -20px; }

.arrowlink.prev:hover i,
.arrowlink.prev:focus i {
  background-position: -59px -215px; }

.arrowlink.white {
  border-bottom: dotted 1px white; }

.arrowlink.white i {
  background-position: -6px -219px; }

.arrowlink.white:hover,
.arrowlink.white:focus {
  color: #008A26 !important;
  border-bottom: dotted 1px #008A26; }

.arrowlink.white:hover i,
.arrowlink.white:focus i {
  background-position: -20px -199px; }

i.loading {
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  background: url(../_images/css/buttons/ajax-loader.gif) 100% 10% no-repeat;
  margin: 0;
  width: 24px;
  height: 100%; }

i.loading.alt {
  background: url(../_images/css/buttons/ajax-loader-alt.gif) 100% 10% no-repeat; }

.btn-green,
.btn-white {
  height: 40px;
  margin-right: 13px;
  display: inline-block; }

.btn-green span.content,
.btn-white span.content {
  margin-right: -13px;
  padding: 10px 20px 7px;
  height: 31px;
  display: inline-block; }

.btn-green {
  background-color: #008A26;
  border-radius: 8px;
  color: white; }

.btn-green span.content {
  background: url(../_images/css/buttons/button_green_right.png) right 0 no-repeat; }

.go-to-top-btn {
  background-color: white;
  height: 41px;
  border-radius: 8px;
  width: 153px;
  color: #00838A !important;
}

.btn-green:visited span.content {
  color: white; }

.btn-green:hover span.content,
.btn-white:hover span.content {
  text-decoration: underline; }

#content .btn-green:hover span.content {
  color: white; }

.ie7 .btn-green,
.ie7 .btn-white {
  padding: 0 0 0 12px;
  margin-right: 20px;
  display: inline-block; }

.ie7 .btn-green span,
.ie7 .btn-white span {
  padding: 8px 20px 1px 10px;
  margin-right: -13px; }

.customsubmit {
  background-color: transparent;
  border: 0;
  outline: none;
  overflow: visible;
  padding-right: 14px;
  -webkit-background-clip: content;
  background-clip: content-box;
  word-wrap: normal;
  word-break: normal;
  width: auto; }

.customsubmit::-moz-focus-inner {
  padding: 0;
  border: 0; }

.ie7 .customsubmit span.content {
  min-width: 120px; }

.ie8 .customsubmit span {
  margin-right: -27px; }

/* #Icons ------------------------------------------------------------------------ */
i[class^="icon"] {
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  margin-right: 5px; }

.icon-chevron {
  background-position: -25px -1px;
  width: 13px;
  height: 13px; }

a:hover i, a:focus i {
  border-bottom: none; }

/*Sprites*/
.sprite-piggy {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -113px -7px;
  width: 220px;
  height: 80px; }

.sprite-wearemacmillan {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -10px 3px;
  width: 89px;
  height: 185px; }

.sprite-headertitle {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -112px -96px;
  width: 330px;
  height: 109px; }

.sprite-charitybox {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -124px -276px;
  width: 49px;
  height: 152px; }

.sprite-largegreenchevron {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -9px -233px;
  width: 24px;
  height: 35px; }

.sprite-calculatorlogo {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -13px -465px;
  width: 100px;
  height: 139px; }

.sprite-solopiggy {
  background: url("../_images/css/backgrounds/iconsbgsprite.png") no-repeat -12px -352px;
  width: 89px;
  height: 75px; }

.sprite-boot {
  background: url("../_images/css/backgrounds/bg_boot.png") no-repeat 50% 50%;
  width: 101px;
  height: 91px; }

.icon-share {
  background-image: url("../_images/css/backgrounds/icon-sprite.png");
  background-position: -25px -1px;
  width: 13px;
  height: 13px; }

.icon-print {
  background-image: url("../_images/css/backgrounds/icon-sprite.png");
  background-position: -3px -2px;
  width: 17px;
  height: 15px; }

/* #Dividers ------------------------------------------------------------------------ */
.separator {
  border-bottom: 1px solid #f2f2ef;
  margin: 10px 0 10px;
  padding-bottom: 10px; }

/* Infoboxes ------------------------------------------------------------------------ */
/* infobox1 is green only */
.infobox1 {
  background-color: transparent;
  padding: 0;
  /* margin:0; */ }

.infobox1 .article {
  background-color: #00838A;
  padding-left: 21px;
  padding-right: 23px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.infobox1 .article p {
  padding: 0px; }

.infobox1:before {
  background: url("../_images/css/backgrounds/before.png") no-repeat;
  content: "";
  height: 20px;
  width: 230px;
  display: block; }

.infobox1:after {
  background: url("../_images/css/backgrounds/after.png") no-repeat;
  content: "";
  height: 22px;
  width: 230px;
  display: block; }

.infobox1:before {
  background-position: 0 0; }

.infobox1:after {
  background-position: 100% 100%; }

.infobox1 .number {
  font-size: 1.4em;
  font-weight: bold; }

.infobox1 .title,
.infobox1 p,
.infobox1 .number,
.infobox1 .small {
  color: white; }

.infobox1.stats .article {
  position: relative; }

.infobox1.stats p {
  width: 135px; }

.infobox1.stats .number {
  bottom: 0;
  padding-top: 25px;
  display: block;
  width: 100%; }

.infobox1.stats .image {
  top: 0px;
  right: 29px;
  position: absolute; }

.infobox1.stats .large {
  display: block;
  padding-top: 5px;
  padding-bottom: 5px; }

.infobox1.totalizer .image {
  top: 40px;
  right: 20px; }

.infobox1.totalizer .verylarge {
  font-weight: bold;
  line-height: 1.5em; }

.infobox1.totalizer .large {
  padding: 0; }

.ie7 .infobox1 .article {
  padding: 23px; }

.ie7 .infobox1.stats .image {
  top: 29px; }

.ie7 .infobox1.totalizer .image {
  top: 70px; }

/* infobox2 can use colour classes */
.infobox2 img {
  position: relative; }

.infobox2 .article {
  padding: 21px;
  margin: 0 0 0.5em; }

.infobox2:after,
.infobox2:before {
  background: url("../_images/css/backgrounds/asidesmallmask.png") no-repeat;
  content: "";
  height: 50px;
  width: 100%;
  display: block;
  position: absolute;
  z-index: 2; }

.infobox2:before {
  background-position: 0 0; }

.infobox2:after {
  margin-top: -52px;
  background-position: 0px -73px; }

.modulebox {
  height: 230px;
  width: 230px;
  position: relative;
  margin-bottom: 18px; }

.modulebox img {
  position: relative; }

.modulebox .article {
  padding: 21px;
  display: block;
  height: 188px; }

.modulebox:after,
.modulebox:before {
  background: url("../_images/css/backgrounds/moduleboxmask.png") no-repeat;
  content: "";
  width: 100%;
  display: block;
  position: absolute;
  z-index: 2; }

.modulebox:before {
  height: 50px;
  background-position: 0 0; }

.modulebox:after {
  height: 15px;
  bottom: 0;
  background-position: 0px bottom; }

.imagemasklargeblock {
  position: relative; }

.imagemasklargeblock .largeoverlay {
  position: absolute;
  top: 0;
  right: 15px; }

.imagemasklargeblock h2 {
  font-size: 3.75em;
  position: relative;
  z-index: 100;
  line-height: 1.1em;
  padding: 20px; }

.imagemasklargeblock .interior img {
  margin-left: 20px;
  margin-top: 15px; }

.imagemasklargeblock .interior .text {
  width: 422px;
  position: absolute;
  left: 0;
  bottom: 5px;
  background: #008A26;
  margin-top: 31px;
  padding: 15px 0; }

.imagemasklargeblock .interior .text p {
  padding: 0 15px;
  margin-bottom: 5px;
  position: relative;
  z-index: 9999;
  color: white; }

.imagemasklargeblock .interior .text a {
  padding: 15px;
  position: relative;
  z-index: 9999;
  color: white; }

.imagemasklargeblock .interior .text a.arrowlink {
  margin-left: 15px;
  padding: 0; }

.imagemasklargeblock .interior .text .title {
  padding: 0 15px;
  color: #8cc63e; }

.imagemasklargeblock .interior .text:after,
.imagemasklargeblock .interior .text:before {
  background: url("../_images/css/backgrounds/largeblockinsetmask.png") no-repeat;
  content: "";
  height: 50px;
  width: 100%;
  display: block;
  position: absolute;
  z-index: 2; }

.imagemasklargeblock .interior .text:before {
  background-position: 0 0;
  top: 0; }

.imagemasklargeblock .interior .text:after {
  bottom: 0;
  background-position: 0px -133px; }

/* contentBox is a grey styled box, on the grid col3 */
.contentBox .interior {
  background-color: #f2f2f2;
  margin: -24px 0;
  padding: 0 27px; }

.contentBox:after,
.contentBox:before {
  content: "";
  height: 50px;
  width: 100%;
  display: block; }

.contentBox:before {
  background: url("../_images/css/backgrounds/content_box_grey_top.png") no-repeat; }

.contentBox:after {
  background: url("../_images/css/backgrounds/content_box_grey_bottom.png") no-repeat; }

.contentBox .insetbox .interior {
  background-color: white;
  margin: -24px 0;
  padding: 0 26px; }

.contentBox .insetbox:after,
.insetbox:before {
  content: "";
  height: 50px;
  width: 100%;
  display: block; }

.contentBox .insetbox:before {
  background: url("../_images/css/backgrounds/content_box_white_top.png") no-repeat; }

.contentBox .insetbox:after {
  background: url("../_images/css/backgrounds/content_box_white_bottom.png") no-repeat; }

.ie7 .contentBox .interior {
  margin-top: 0;
  padding: 27px; }

.hero-panel {
  background-color: #f2f2ef;
  width: 730px; }

.hero-panel:before {
  background: url("../_images/css/backgrounds/banner_mask_top.png") no-repeat 0 0;
  content: "";
  height: 35px;
  width: 730px;
  display: block; }

.hero-panel:after {
  background: url("../_images/css/backgrounds/banner_mask_bottom.png") no-repeat 100% 100%;
  content: "";
  height: 35px;
  width: 730px;
  display: block; }

.hero-panel .content {
  margin: 0 20px; }

.ie7 .hero-panel .content {
  margin: 20px; }

.video-player {
  width: 640px;
  height: 360px;
  margin: 0 auto;
  background: black;
  background: rgba(0, 0, 0, 0.1);
  padding: 2px;
  line-height: 360px;
  text-align: center; }

#overlay {
  background: url("../_images/css/backgrounds/overlay_opacity.png") repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 10; }

/* #Main Accordion -------------------------------------------------------------------*/
.accordion {
  clear: both;
  background: #f2f2ef; }

.accordion.mainaccordion .accordion-btn {
  font-size: 1.250em;
  font-family: Arial, Helvetica, sans-serif;
  position: relative;
  line-height: 2em;
  padding: 0 0em 0;
  margin: 0px 0px 0px 0px;
  background: #f2f2f2;
  color: white;
  z-index: 999; }

.accordion.mainaccordion .accordion-btn {
  line-height: 1em; }

.accordion.mainaccordion .accordion-container:after, .accordion.mainaccordion .accordion-container:before {
  background: url("../_images/css/backgrounds/accordionbgwhite.png") no-repeat;
  content: "";
  height: 14px;
  width: 730px;
  display: block; }

.accoridon.mainaccordion .accordion-container:before {
  background-position: 0 0; }

.accordion.mainaccordion .accordion-container:after {
  background-position: 0px -72px;
  margin-top: -1px; }

.accordion .accordion-btn:first-child {
  border: 0 none;
  margin-top: 0px; }

.accordion .accordion-btn a {
  color: #008A26; }

.accordion.hasDate a {
  width: 69%; }

.accordion.hasDate .date {
  color: black;
  position: absolute;
  top: 0;
  right: 45px; }

.accordion .accordion-btn .iconwrapper {
  border-left: none;
  position: absolute;
  right: 0;
  width: 2em;
  height: 100%;
  bottom: 0;
  top: 0; }

.accordion .accordion-btn .icon {
  background: url(../_images/css/buttons/accordionchevron.png) no-repeat center center transparent;
  position: absolute;
  right: 0;
  width: 2em;
  height: 100%;
  bottom: 0;
  top: 0;
  z-index: 999; }

.accordion.mainaccordion .accordion-btn .icon {
  background: url(../_images/css/buttons/accordionchevron.png) no-repeat center center transparent;
  margin-top: -5px;
  height: 30px; }

.accordion.mainaccordion .accordion-btn a {
  display: block;
  margin-left: 15px; }

.accordion .accordion-content {
  border-bottom: solid 1px white;
  padding: 16px 10px;
  border: medium none;
  padding: 0;
  overflow: hidden;
  background: #f2f2f2;
  margin: 0px 0px 0px 0px;
  position: relative; }

.accordion.mainaccordion .accordion-content {
  margin-top: 0px;
  margin: 0px 7px 0px 7px; }

.accordion .accordion-content .field-name-body {
  width: 70%; }

.accordion .accordion-content .field-type-image {
  width: 25%;
  float: left;
  margin-right: 10px; }

.accordion .article {
  margin: 0;
  border: none;
  padding: 10px;
  zoom: 1;
  background: #f2f2f2; }
  .accordion .article:before, .accordion .article:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden; }
  .accordion .article:after {
    clear: both; }

.accordion.mainaccordion .accordion-container .accordion-content .article {
  padding-top: 20px; }

.mainaccordion .accordiontext {
  width: 460px;
  margin-right: 20px; }

.mainaccordion .accordionaside {
  width: 216px; }

.mainaccordion .accordionaside blockquote {
  padding: 0;
  font-size: 1.250em; }

.ie7 #content .mainaccordion .accordion-btn {
  padding-top: 15px;
  padding-bottom: 15px; }

.ie7 #content .mainaccordion .icon {
  margin-top: 10px; }

.ie7 .accordion.mainaccordion .accordion-btn a {
  padding-top: 4px;
  padding-bottom: 4px; }

.ie7 .accordion.hasDate .date {
  top: 15px; }

/*Masked Feature Accordion*/
.maskedaccordion {
  background: white; }

.maskedaccordion .accordion-btn {
  background: white;
  margin-bottom: -18px; }

.maskedaccordion .accordion-container {
  padding-bottom: 43px;
  margin-bottom: 10px; }

.maskedaccordion .accordion-content {
  margin-bottom: -18px;
  position: relative;
  z-index: 9999; }

.maskedaccordion .accordion-content .article {
  padding-bottom: 30px; }

.maskedaccordion .accordion-btn .icon {
  display: none; }

.maskedaccordion .accordion-btn .btn-green {
  position: absolute;
  bottom: 25px;
  margin-left: 30px;
  margin-right: 30px; }

.maskedaccordion .accordiontext {
  width: 445px;
  margin-right: 20px;
  padding: 0 0 0 15px; }

.maskedaccordion .accordionaside {
  width: 216px; }

.maskedaccordion h2 {
  line-height: 1.1em; }

.mainaccordion .accordionaside blockquote {
  padding: 0;
  font-size: 1.250em; }

.maskedaccordion .accordion-content:after {
  background: url("../_images/css/backgrounds/imagemask.png") no-repeat;
  content: "";
  height: 100px;
  width: 100%;
  display: block;
  position: absolute;
  z-index: 999; }

.maskedaccordion .accordion-content:after {
  background-position: 0 -205px;
  height: 73px;
  margin-top: -5px; }

.maskedaccordion h2 {
  left: 0; }

.maskedaccordion .imagemask {
  left: 0; }

.ie7 .button-findoutmore {
  left: 0; }

.ie8 .button-findoutmore {
  left: 0; }

.accordion.mainaccordion .accordionclose {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 39px; }

.accordion.mainaccordion .accordionclose i {
  background: url(../_images/css/buttons/accordionchevron.png) no-repeat center center transparent;
  width: 30px;
  height: 30px;
  position: absolute;
  margin-left: 10px;
  margin-top: -4px;
  transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  /* IE 9 */
  -webkit-transform: rotate(180deg);
  /* Safari and Chrome */
  -o-transform: rotate(180deg);
  /* Opera */
  -moz-transform: rotate(180deg);
  /* Firefox */ }

.accordion.mainaccordion .accordion-content {
  zoom: 1; }
  .accordion.mainaccordion .accordion-content:before, .accordion.mainaccordion .accordion-content:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden; }
  .accordion.mainaccordion .accordion-content:after {
    clear: both; }

.accordion.mainaccordion .accordion-content article {
  padding-bottom: 35px; }

.accordionclose {
  z-index: 9999;
  -webkit-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  -moz-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  -o-transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1);
  transition: all 350ms cubic-bezier(0.5, 0, 0.5, 1); }

.maskedaccordion .accordionclose {
  margin-left: 15px; }

/* 
    Document   : Custom Scrollpanels    
    Author     : 
*/
/*************************************************************************
 #Non Semantic Classes
**************************************************************************/
.scrollpanels {
  position: relative;
  overflow: hidden;
  float: none;
  width: 684px;
  height: 250px;
  margin: 10px 0 10px 0; }

.scrollpanels .content {
  overflow: hidden;
  padding: 0;
  margin: 0;
  position: relative; }

.scrollpanels .wrapper {
  position: relative;
  width: 99999px;
  overflow: hidden;
  padding: 0;
  margin: 0; }

.scrollpanels .wrapper .panel {
  float: left;
  height: auto;
  position: relative;
  list-style: none;
  height: 250px;
  width: 684px;
  margin: 0!important;
  padding: 0!important;
  background: #8cc63e; }

.scrollpanels .wrapper .panel img {
  display: block;
  padding: 0;
  margin: 0;
  float: none;
  overflow: hidden; }

.scrollpanels .controls {
  display: block; }

.scrollpanels .controls .btn {
  background: url("../_images/css/buttons/carouselcontrols.png");
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0; }

.scrollpanels .controls .btn.prev {
  margin: 0 0.1em 0 0;
  float: left; }

.scrollpanels .controls .btn.next {
  margin: 0 0.1em 0 0;
  float: right;
  background-position: -47px; }

.scrollpanels .counters {
  margin-right: 1em;
  display: none;
  clear: both; }

.scrollpanels .controls .counters .btn {
  margin: 0 0.5em 0 0; }

.no-js .scrollpanels .inner {
  overflow: scroll; }

.hero-unit .scrollpanels .wrapper .panel {
  padding-right: 10px;
  margin: 0; }

.fade-effect .scrollpanels .wrapper {
  min-height: 700px; }

.fade-effect .scrollpanels .wrapper .panel {
  position: absolute;
  z-index: 0;
  opacity: 0; }

.fade-effect .scrollpanels .wrapper .active {
  z-index: 1 !important;
  opacity: 1; }

/*---------- Scrollpanel variations ----------*/
.carousel {
  width: 730px;
  height: 270px;
  margin: 0 0 0 -20px;
  padding: 0 20px 0 20px; }

.carousel .inner {
  width: 730px;
  height: 270px;
  overflow: hidden; }

.carousel .wrapper .panel {
  height: 270px;
  width: 730px; }

.carouselFramed {
  background: url("../_images/css/backgrounds/carouselbg.png") 20px 0 no-repeat;
  width: 690px;
  margin: 0 0 0 -20px;
  padding: 10px 40px;
  position: relative; }

.carouselFramed .inner {
  width: 684px;
  height: 250px;
  overflow: hidden; }

.carousel .controls,
.carouselFramed .controls {
  margin-left: -19px; }

.carousel .controls .btn,
.carouselFramed .controls .btn {
  position: absolute;
  top: 120px; }

.carousel .controls .btn.prev,
.carouselFramed .controls .btn.prev {
  left: 0; }

.carousel .controls .btn.next,
.carouselFramed .controls .btn.next {
  right: 0; }

.ie7 .carousel {
  width: 710px;
  margin-left: 0;
  padding-left: 0; }

.ie7 .carouselFramed {
  background: url("../_images/css/backgrounds/carouselbg.png") 0 0 no-repeat;
  width: 670px;
  margin-left: 0;
  padding-left: 0; }

.btn {
  background-color: #F5F5F5;
  background-image: -moz-linear-gradient(center top, white, #e6e6e6);
  background-repeat: repeat-x;
  border-color: #E6E6E6 #E6E6E6 #B3B3B3;
  border-radius: 4px 4px 4px 4px;
  border-style: solid;
  border-width: 1px;
  color: #333333;
  cursor: pointer;
  display: inline-block;
  font-size: 13px;
  line-height: 18px;
  margin-bottom: 0;
  padding: 4px 10px;
  text-align: center;
  vertical-align: middle; }

.btn:hover, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
  background-color: #E6E6E6; }

.listings {
  opactiy: 0.5; }

.listings:before {
  content: "Incomplete";
  background-color: white;
  padding: 4px;
  display: block; }

/*-----------------------------------------------------------------------------
Layout
-------------------------------------------------------------------------------*/
#page-wrapper {
  margin: 0 auto; }

/*-----------------------------------------------------------------------------
Header
-------------------------------------------------------------------------------*/
.header,
.socialprint,
.subnavigation,
.button,
.accordionclose,
.progress,
#topsso,
.slider .wrapper,
.slider .navigation,
.step .btn-green,
.summary .edit-this,
button.cancel {
  display: none; }

.donateform .step .step-container {
    display: block !important;
}

.col1 {
  margin: 0;
  padding: 0;
  float: none; }

.col2 {
  margin-right: 0;
  float: none; }

.col3 {
  width: inherit;
  float: none; }

.alignleft,
.alignright {
  float: none !important; }

.white {
  color: #000000 !important; }

/*-----------------------------------------------------------------------------
Navigation
-------------------------------------------------------------------------------*/
.nav-skip {
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 200px;
  height: 20px; }
  .nav-skip a {
    display: block;
    color: #333332;
    position: absolute;
    left: -300px;
    top: 0; }
  .nav-skip a:focus, .nav-skip a:active {
    left: 0;
    outline: 0; }

.accordion .accordion-content {
  height: inherit !important; }

.breadcrumb {
  margin-bottom: 10px; }

.breadcrumb a {
  display: inline;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  text-transform: capitalize; }

.breadcrumb span {
  color: #333332;
  padding-right: 1.66667px; }

.breadcrumb span.active {
  color: #008A26;
  font-weight: 800;
  text-transform: capitalize; }

.breadcrumb i.chevron {
  color: #333332;
  font-weight: 800;
  padding: 0 1.66667px; }

/*-----------------------------------------------------------------------------
Content 
-------------------------------------------------------------------------------*/
.container {
  width: 1000px;
  margin: 0 auto;
  overflow: visible; }

/*-----------------------------------------------------------------------------
Footer
-------------------------------------------------------------------------------*/
.footer {
  width: 978px;
  margin: 0 auto;
  display: none; }

/*-----------------------------------------------------------------------------
Non Semantic Classes
-------------------------------------------------------------------------------*/
.ir {
  display: block;
  text-indent: -999em;
  overflow: hidden;
  background-repeat: no-repeat;
  text-align: left;
  direction: ltr; }

.hidden {
  display: none;
  visibility: hidden; }

.hide {
  display: none; }

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

.invisible {
  visibility: hidden; }

.clearfix {
  zoom: 1; }
  .clearfix:before, .clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden; }
  .clearfix:after {
    clear: both; }

.alignleft {
  float: left; }

.alignright {
  float: right; }

.clear {
  clear: both; }

.printonly {
  display: none; }

.small {
  font-size: 0.835em; }

.large {
  font-size: 1.385em; }

/*-----------------------------------------------------------------------------
Non Semantic Classes
-------------------------------------------------------------------------------*/
img {
  display: none; }


.print .direct-debit .dd-details {
    margin-top: 20px;
    width: 100%;
}

.print .direct-debit .dd-details img {
    display: block;
}