/***************  Set up variables. mixins etc  ***************/
@font-face {
  font-family: ChaparralPro-Regular;
  src: url(../fonts/ChaparralPro-Regular.otf); }
/* Vendor prefixes - approach recommended 13 Nov 2013 -- http://www.456bereastreet.com/archive/201311/cutting_down_on_vendor_prefixes/  
border-radius - no vendor prefixes
box-shadow - no vendor prefixes
background-origin, background-size and background-clip - no vendor prefixes
Gradients - minimal vendor prefixes (see below)
Transitions - minimal vendor prefixes (see below)
Transform - minimal vendor prefixes (see below)

.example {
    background:#f9f9f9;
    background:-webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background:linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);
}

.example {
    -webkit-transition:background-position 0.5s;
    -ms-transform: scale(2) translate(-90px, 0);
    transition:background-position 0.5s;

}

.example
{
    -webkit-transform: scale(2) translate(-50px, 0);
    -ms-transform: scale(2) translate(-50px, 0);    
    transform: scale(2) translate(-50px, 0);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
}
*/
/*****************  Standard form  ******************/
form {
  margin-top: 55px; }

form#opt-in {
  margin-top: 25px; }

input, select, textarea {
  margin-bottom: 15px;
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.07);
  border-color: #000 #FFFFFF #FFFFFF #000;
  border-radius: 5px;
  border-style: none solid solid none;
  border-width: medium 2px 2px medium;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) inset;
  color: #333333;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 1.2em;
  padding: 5px 8px;
  transition: background-color 0.2s ease 0s;
  width: 50%; }

input.submit {
  border-right: none;
  border-bottom: none; }

textarea {
  font-size: 1em; }

input:focus, select:focus, textarea:focus {
  background-color: #fdfdfd; }

label {
  display: block;
  float: left;
  width: 38%;
  text-align: right;
  padding-right: 2%; }

.disabled label {
  color: #bcbcbc; }

input.disabled {
  background-color: #F4F4F4; }

input.submit {
  -webkit-transition: background-color .5s ease-out;
  -moz-transition: background-color .5s ease-out;
  -o-transition: background-color .5s ease-out;
  transition: background-color .5s ease-out; }

input.submit, #fullWidth input.submit {
  margin-left: 40%;
  width: auto;
  min-width: 150px; }

input.submit:hover {
  background-color: #92D050;
  color: #000; }

/* Make unwanted field non visible on page */
#outasight {
  position: absolute;
  top: -50000px; }

legend {
  font-size: 1.5em;
  color: #A71930;
  margin: 25px 0 0 15px;
  padding: 0 10px;
  border-radius: 5px;
  background-image: url("../images/background-2.png"); }

fieldset {
  border: 1px solid #E6E6E6;
  border-radius: 10px;
  background-image: url("../images/background-10.png");
  margin-bottom: 30px; }

form div.radio input, form div.checkboxes input {
  clear: both;
  display: block;
  float: left;
  margin-top: 5px;
  width: 15px; }

/**********  Full page width form  (eg Registration Form) *************/
#fullWidth {
  margin-top: 15px; }

#fullWidth input, #fullWidth select, #fullWidth textarea {
  width: 70%; }

#fullWidth div.checkboxes, #fullWidth div.radio {
  margin-left: 0;
  margin-bottom: 10px;
  float: left;
  width: 90%; }

#fullWidth label {
  text-align: left;
  width: 100%;
  font-size: 1.2em; }

#fullWidth div.checkboxes label, #fullWidth div.radio label {
  display: inline;
  font-weight: normal;
  margin-left: 10px;
  width: 80%;
  text-align: left;
  cursor: pointer;
  padding-top: 0; }

#fullWidth label span.labelExtra {
  margin-left: .8em;
  color: #ff3000;
  font-size: .9em; }

#fullWidth div.buffer-above {
  clear: both;
  margin-top: 15px; }

#fullWidth div.checkboxes input, #fullWidth div.radio input {
  width: 15px;
  margin-top: 9px;
  margin-bottom: 3px;
  border: none; }

#fullWidth div.checkboxes h3, #fullWidth div.radio h3 {
  font-size: 1.5em;
  font-weight: bold;
  padding-left: 0;
  color: #434343; }

p.question {
  margin-bottom: 0;
  width: 100%;
  display: block;
  float: none; }

label.error {
  color: red;
  float: none;
  text-align: left;
  display: inline;
  margin-left: 25px; }

#fullWidth label.wide {
  width: 65%;
  text-align: left;
  margin-left: 25px; }

input.error {
  background-color: #fff0f0;
  border: 1px solid red;
  float: none; }

#fullWidth div.checkboxes input.error, #fullWidth div.radio input.error {
  border: 1px solid red; }

#fullWidth div.checkboxes label.mediumWidth, #fullWidth div.radio label.mediumWidth {
  width: 40%; }

/**********  Resources order form *************/
body#resources fieldset#workshop table {
  width: 100%; }

body#resources fieldset#workshop label {
  text-align: left;
  width: 95%; }

body#resources fieldset#workshop td label, body#resources fieldset#workshop td input {
  vertical-align: middle; }

body#resources fieldset#workshop td input {
  margin-bottom: 0; }

body#resources fieldset#workshop td {
  border-bottom: 1px dotted #e8e8e8; }

input#postal1, input#postal2 {
  display: block;
  margin-bottom: 0; }

fieldset#entity .input span {
  margin-bottom: 15px; }

/**********  END Resources order form *************/
/* large screens show images, narrow screens - show text list only  - May have to rethink these styles and this strategy and just link to a new window as per the old site 
#fullWidth #cityIcon p { display: none; }
#fullWidth .accordionContent { margin-bottom: 40px; }
#fullWidth ul.accordion li
{
    background-image: none;
    margin: 0 0 25px 225px;
}
#content #mainContent #fullWidth ul.accordion li h2
{
    font-size: .9em;
    font-weight: normal;
}
#fullWidth ul.accordion li h2 a.viewschedule { display: inline; }
#fullWidth ul.accordion .accordionContent #cityIcon { margin-left: 25%; }
#fullWidth ul.accordion .accordionContent #cityIcon li
{
    background-image: none;  
    float: none;
    height: 0;
    margin: 10px;
}
#fullWidth ul.accordion .accordionContent #cityIcon li h3 
{
    margin-top: 35px;
    padding: 0;
    display: block;
    color: #1655C4;
    font-weight: normal;
    font-size: 1em;
}

still need styles for smaller screens */
/*****************  END Standard form  ******************/
/*****************  Search form  ******************/
#searchform {
  float: right;
  position: relative;
  right: 0;
  margin: 25px 0 0 0; }

#searchform input.txt {
  background: url("../images/icon-search.jpg") no-repeat scroll 8px 50% #fff;
  border: 1px solid #E8E5E0;
  border-radius: 15px;
  color: #9F9886;
  line-height: 12px;
  font-size: .8em;
  padding: 6px 12px 10px 26px;
  width: 300px;
  box-shadow: none; }

/* Adjust text input height (for Firefox) for consistency with FF and alignment with button - change made 25/02/19 */
@-moz-document url-prefix() {
  #searchform input.txt {
    line-height: 15px; } }
#searchform input.btn {
  background: url("../images/button-background.jpg") repeat-x scroll -1px -1px #F9F9F9;
  border: 1px solid #E8E5E0;
  border-radius: 0 14px 14px 0;
  box-shadow: none;
  color: #999999;
  font-size: 13px;
  line-height: 20px;
  padding: 4px 16px 3px 14px;
  width: 75px;
  position: absolute;
  right: 0;
  top: 0; }

/* Adjust text input height (for webkit eg. Safari and Chrome) for consistency with FF and alignment of button */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  #searchform input.txt {
    padding-bottom: 5px; }

  #searchform input.txt {
    padding-top: 7px; } }
/* Adjust text input height (for IE10 & IE11) for consistency with FF and alignment of button */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  #searchform input.txt {
    padding-bottom: 6px; } }
#searchform input.btn:hover {
  border: 1px solid #cccccc;
  color: #774411; }

#searchform label {
  display: none; }

/*****************  END Search form  ******************/
/*****************  Sidebar form  ******************/
#sidebar form label {
  width: 100%;
  text-align: left; }

#sidebar input.submit {
  margin-left: 0; }

/*****************  END Sidebar form  ******************/
/*****************  Blog search form  ******************/
#blogsearchform {
  margin: 25px 0 0 0;
  width: 100%; }

#blogsearchform input#s {
  width: 50%;
  margin-right: 10px;
  display: inline; }

#blogsearchform input#searchsubmit {
  width: 30%;
  margin-left: 0;
  display: inline;
  min-width: 100px; }

/*****************  END Blog search form  ******************/
/***************** Form steps  *****************/
#content div#formsteps {
  margin: 25px 0 315px; }

#content #formsteps div {
  border-top: 1px dotted #ccc;
  border-bottom: 1px dotted #ccc;
  float: left;
  font-size: 1em;
  width: 70%;
  padding: 3px 0 3px 10px;
  color: #b7b7b7; }

#content #formsteps div strong {
  font-weight: bold;
  font-size: 1.2em; }

#content #formsteps div.formstepselected {
  color: #000;
  background: #FFD9D9 url(../images/form-step-arrow.gif) right no-repeat; }

#content #formsteps div {
  clear: both; }

/***************** END Form steps  *****************/
.formnote {
  margin-top: 0;
  font-style: italic; }

.alignleft input.submit {
  margin-left: 0; }

#offline-payment {
  margin-top: 20px; }

#fullWidth select.short, #fullWidth input.short {
  width: 5em; }

form#fullWidth .shortform input {
  margin-left: 0; }

#fullWidth input#inputpriorityschoolother, #fullWidth input#inputpriorityregionother {
  display: inline;
  width: 40%;
  margin-left: 35px; }

/*****************  Standard table info  ******************/
table.simpleTable {
  margin: 0 0 35px 0;
  width: 100%;
  font-size: 1em;
  border-top: 2px solid #4e4e4e;
  border-bottom: 2px solid #4e4e4e;
  border-collapse: collapse; }

table.simpleTable p, table.simpleTable li, table.simpleTable h3,
#full-width ul.accordion li#purpose table.simpleTable p,
#full-width ul.accordion li#purpose table.simpleTable li,
#full-width ul.accordion li#purpose table.simpleTable h3 {
  font-size: 1.95em;
  margin-left: 0; }

tbody tr.alt {
  background-color: #F4F4F4;
  background-image: url("../images/background-8.png"); }

table.simpleTable th {
  color: #4e4e4e;
  background-color: #B7B1A4;
  background-image: url("../images/background-3.jpg");
  padding: 6px 5px 5px 5px;
  text-align: left; }

table.simpleTable td {
  color: #707070;
  padding: 4px 4px 2px 4px;
  vertical-align: top;
  border-bottom: 1px solid #EBEBEB;
  line-height: 1.5; }

table.simpleTable caption {
  font-weight: bold;
  color: #4c4a21;
  text-align: left;
  margin-top: 12px; }

table.simpleTable td span.title {
  color: #FF3000; }

table.simpleTable td a.presenter {
  color: #FF3000; }

table.simpleTable td a.workshop-title {
  font-size: 1.2em; }

/*****************  END Standard table info  ******************/
/*****************  Article table info  ******************/
table.articletable h3 {
  font-size: 1.3em !important; }

table.articletable p, table.articletable ul li {
  font-size: 1em !important; }

/*****************  END Article table info  ******************/
/***************  Basic Rules  ***************/
body {
  background-image: url("../images/background-2.png");
  font-size: 24px;
  font-size: 1rem;
  font-family: Georgia,"times new roman",times,serif;
  color: #555555;
  line-height: 1.6;
  text-align: left;
  margin: 0; }

header {
  border-top: 8px solid #a10303; }

#headerInner {
  margin: 0 auto; }

img#logo {
  min-width: 10em;
  margin-bottom: 10px; }

#content {
  margin: 30px auto 0; }

#headerInner, #content, #footerInner {
  width: 75%;
  max-width: 1200px; }

#mainContent {
  width: 65%;
  float: left;
  margin: 0;
  padding: 0 2.5% 0 0; }

#sidebar {
  width: 30%;
  float: right; }

#content .fullWidth {
  width: 100%;
  padding: 0; }

/***************  home banner  ***************/
#homeBanner {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 360px;
  margin-bottom: 125px;
  border-radius: 5px 5px;
  background: url("../images/home-banner-main-j.jpg") no-repeat;
  background-position: top; }

#darkOverlay {
  width: 900px;
  height: 100px;
  position: relative;
  top: 259px;
  margin: 0 auto;
  background-image: url("../images/dark-overlay.png");
  background-position: center center;
  opacity: 0.4;
  filter: alpha(opacity=40);
  /* For IE8 and earlier */
  border: 1px solid #fff;
  border-radius: 5px; }

#topicInserts {
  width: 854px;
  height: 125px;
  position: relative;
  top: 155px;
  margin: 0 auto; }

#topicInserts p {
  font-size: 1.8em;
  margin-bottom: 15px;
  color: #fff;
  font-style: italic;
  text-align: center; }

#topicInserts a#topic-1:hover {
  background-image: url("../images/home-banner-insert-1-colour.jpg");
  text-decoration: none;
  border-color: yellow; }

#topicInserts a#topic-2:hover {
  background-image: url("../images/home-banner-insert-2-colour.jpg");
  text-decoration: none;
  border-color: yellow; }

#topicInserts a#topic-3:hover {
  background-image: url("../images/home-banner-insert-3-colour.jpg");
  text-decoration: none;
  border-color: yellow; }

#topicInserts a#topic-4:hover {
  background-image: url("../images/home-banner-insert-4-colour.jpg");
  text-decoration: none;
  border-color: yellow; }

#topic-1 p, #topic-2 p, #topic-3 p, #topic-4 p {
  font-size: 1.2em;
  margin: 95px 0 0;
  color: #fff;
  font-style: normal;
  text-align: center;
  background-image: url("../images/dark-overlay-small.png"); }

#topic-1 p:hover, #topic-2 p:hover, #topic-3 p:hover, #topic-4 p:hover {
  color: yellow; }

#topic-1, #topic-2, #topic-3, #topic-4 {
  width: 198px;
  height: 123px;
  float: left;
  margin-right: 18px;
  border: 1px solid #fff;
  border-radius: 5px;
  transition: all 1.2s ease; }

#topic-1 {
  background-image: url("../images/home-banner-insert-1-rough.png"); }

#topic-2 {
  background-image: url("../images/home-banner-insert-2-rough.png"); }

#topic-3 {
  background-image: url("../images/home-banner-insert-3-rough.png"); }

#topic-4 {
  background-image: url("../images/home-banner-insert-4-rough.png");
  margin-right: 0; }

/***************  footer  ***************/
footer {
  clear: both;
  width: 100%;
  border-top: 2px solid #DFDDD4;
  background-color: white;
  height: 600px;
  margin-bottom: 0; }

#footerInner {
  margin: 3em auto 0;
  height: 3.5em; }

footer #footerInner .footerColumn {
  float: left;
  width: 16%; }

footer #footerInner .footerColumn h2 {
  font-size: 1em;
  margin-bottom: 0; }

footer #footerInner .footerColumn h2 a {
  color: #555555; }

footer #footerInner .footerColumn h2 a:hover {
  color: #1655c4; }

footer #footerInner .footerColumn ul {
  list-style: none;
  padding-left: 0;
  margin-top: .5em;
  font-family: Georgia,"times new roman",times,serif;
  font-size: 80%;
  color: #6A6A6A; }

footer #footerInner .footerColumn ul li {
  margin-bottom: .5em; }

footer #footerInner .footerColumn ul li a {
  color: #6A6A6A; }

footer #footerInner .footerColumn ul li a:hover {
  color: #1655C4;
  text-decoration: none; }

footer #footerInner p {
  clear: both;
  background-image: url(../images/logo-small.png);
  background-repeat: no-repeat;
  background-position: 615px 0;
  padding-top: 43px;
  font-size: 90%;
  color: #6A6A6A; }

/***************  END footer  ***************/
/***************  Page Header  ***************/
header img {
  float: left;
  width: 35%;
  max-height: 223px;
  max-width: 250px;
  height: auto;
  margin: 2% 0 0 0; }

header img#logo {
  min-width: 220px; }

/***************  END Page Header  ***************/
/***************  Navigation  ***************/
#nav ul {
  margin: 0;
  padding: 0;
  width: 100%;
  display: block;
  list-style: none;
  line-height: 1; }

#nav a:link, #nav a:visited, #nav a:hover, #nav a:active, #nav a:focus {
  display: block;
  padding: .75em 1em .75em 3em;
  color: #fff;
  background-color: #c10000;
  text-decoration: none;
  border-bottom: 1px solid #fff; }

#nav a:focus, #nav-toggle:focus, #nav a:hover, #nav-toggle:hover {
  color: #fff;
  background-color: #0E3780; }

#nav-toggle {
  display: block;
  padding: .5em .5em .5em 50px;
  color: #fff;
  font-size: 1.1em;
  background-color: #c10000;
  background-image: url(../images/responsive-nav.png);
  background-repeat: no-repeat;
  background-position: 10px 50%;
  border-bottom: 1px solid #fff;
  text-decoration: none;
  border-radius: 5px;
  clear: both; }

#nav a:active, #nav-toggle:active {
  color: red; }

.js #nav {
  clip: rect(0 0 0 0);
  max-height: 0;
  position: absolute;
  display: block;
  /* overflow: hidden;      this is reducing width of dropdown menu */
  zoom: 1; }

/* Compact navigation */
body#home #nav.opened a, body#workshops #nav.opened a, body#webinars #nav.opened a, body#courses #nav.opened a, body#consulting #nav.opened a, body#resources #nav.opened a, body#blog #nav.opened a, body#contact #nav.opened a {
  background-position: 2px 12px;
  background-color: #c10000;
  padding-left: 50px; }

body#home #nav.opened a:hover, body#home #nav.opened a:active, body#home #nav.opened a:focus,
body#workshops #nav.opened a:hover, body#workshops #nav.opened a:active, body#workshops #nav.opened a:focus,
body#webinars #nav.opened a:hover, body#webinars #nav.opened a:active, body#webinars #nav.opened a:focus,
body#courses #nav.opened a:hover, body#courses #nav.opened a:active, body#courses #nav.opened a:focus,
body#consulting #nav.opened a:hover, body#consulting #nav.opened a:active, body#consulting #nav.opened a:focus,
body#resources #nav.opened a:hover, body#resources #nav.opened a:active, body#resources #nav.opened a:focus,
body#blog #nav.opened a:hover, body#blog #nav.opened a:active, body#blog #nav.opened a:focus,
body#contact #nav.opened a:hover, body#contact #nav.opened a:active, body#contact #nav.opened a:focus {
  background-color: transparent;
  color: #000;
  background-position: 2px 12px; }

/************* Dynamic navigation *************/
body #home-nav a {
  background: url("../images/home-icon-fade.png") no-repeat 2px 6px; }

body #workshops-nav a {
  background: url("../images/workshops-icon-fade.png") no-repeat 4px 6px; }

body #webinars-nav a {
  background: url("../images/webinars-icon-fade.png") no-repeat 4px 6px; }

body #courses-nav a {
  background: url("../images/courses-icon-fade.png") no-repeat 4px 6px; }

body #consulting-nav a {
  background: url("../images/consulting-icon-fade.png") no-repeat 4px 6px; }

body #resources-nav a {
  background: url("../images/resources-icon-fade.png") no-repeat 4px 7px; }

body #blog-nav a {
  background: url("../images/blog-icon-fade.png") no-repeat 4px 6px; }

body #contact-nav a {
  background: url("../images/contact-icon-fade.png") no-repeat 4px 6px; }

/* Static nav logo for each page category */
body#home #home-nav a {
  background: url("../images/home-icon.png") no-repeat 2px 6px; }

body#workshops #workshops-nav a {
  background: url("../images/workshops-icon.png") no-repeat 4px 6px; }

body#webinars #webinars-nav a {
  background: url("../images/webinars-icon.png") no-repeat 4px 6px; }

body#courses #courses-nav a {
  background: url("../images/courses-icon.png") no-repeat 4px 6px; }

body#consulting #consulting-nav a {
  background: url("../images/consulting-icon.png") no-repeat 4px 6px; }

body#resources #resources-nav a {
  background: url("../images/resources-icon.png") no-repeat 4px 7px; }

body#blog #blog-nav a {
  background: url("../images/blog-icon.png") no-repeat 4px 6px; }

body#contact #contact-nav a {
  background: url("../images/contact-icon.png") no-repeat 4px 6px; }

/* On hover / focus images for each category */
div#nav li#home-nav a:focus,
div#nav li#home-nav a:hover {
  background: url("../images/home-icon.png") no-repeat 2px 6px; }

div#nav li#workshops-nav a:focus,
div#nav li#workshops-nav a:hover {
  background: url("../images/workshops-icon.png") no-repeat 4px 6px; }

div#nav li#webinars-nav a:focus,
div#nav li#webinars-nav a:hover {
  background: url("../images/webinars-icon.png") no-repeat 4px 6px; }

div#nav li#consulting-nav a:focus,
div#nav li#consulting-nav a:hover {
  background: url("../images/consulting-icon.png") no-repeat 4px 6px; }

div#nav li#courses-nav a:focus,
div#nav li#courses-nav a:hover {
  background: url("../images/courses-icon.png") no-repeat 4px 6px; }

div#nav li#resources-nav a:focus,
div#nav li#resources-nav a:hover {
  background: url("../images/resources-icon.png") no-repeat 4px 7px; }

div#nav li#blog-nav a:focus,
div#nav li#blog-nav a:hover {
  background: url("../images/blog-icon.png") no-repeat 4px 6px; }

div#nav li#contact-nav a:focus,
div#nav li#contact-nav a:hover {
  background: url("../images/contact-icon.png") no-repeat 4px 6px; }

/************* END Dynamic navigation *************/
/***************  Text  ***************/
h1 {
  font-family: "ChaparralPro-Regular", Helvetica, Arial, sans-serif;
  font-size: 2.5em;
  font-weight: normal;
  text-transform: uppercase;
  color: #A71930;
  margin-top: 0;
  border-bottom: 1px dotted #E4E1DB; }

h1.bottomGap {
  margin-bottom: 25px; }

h1, h2, h3, h4 {
  margin-bottom: 0;
  line-height: 1.2em; }

h2 {
  font-family: Arial, 'Lucida Sans Unicode';
  font-size: 1.5em;
  margin-top: 0;
  color: #555555; }

h3 {
  font-size: 1.2em;
  color: #555555; }

.timestamp h2 {
  font-size: .9em;
  line-height: 2em;
  color: #989595;
  font-style: italic;
  margin-bottom: 10px;
  font-weight: 100;
  /* background: url(../images/calendar-icon-blog.gif) 0 3px no-repeat; */ }

h2 a {
  color: #0e3780; }

.sub-heading {
  font-style: italic;
  color: #418622;
  font-size: 1em; }

p {
  font-family: Georgia,"times new roman",times,serif;
  font-size: 1.1em;
  color: #555555;
  margin-top: .5em; }

p.indent {
  margin-left: 5em; }

#sidebar p.timestamp {
  font-size: 1em;
  font-style: italic;
  color: #7e7d7d; }

a:link, a:hover, a:active, a:focus, a:visited {
  color: #1655C4;
  text-decoration: none; }

a:hover, a:active, a:focus {
  color: #0E3780;
  text-decoration: underline; }

ul {
  padding-left: 2em; }

dl dd {
  font-size: 1.1em; }

dl dt {
  font-size: 1.1em;
  color: #418622; }

dl dd {
  margin-bottom: 20px; }

ul li ul li {
  font-size: 1em; }

.subheadinfo {
  font-style: italic;
  font-size: .95em; }

blockquote.featureQuote {
  margin: 0 55px;
  background-color: #fff;
  border: 1px solid #e3e1e1;
  border-radius: 5px;
  padding: 10px; }

blockquote.featureQuote p {
  margin-bottom: 0;
  color: #446a81; }

blockquote.featureQuote cite {
  color: #204053; }

blockquote.all-quotes-list {
  margin-left: 0;
  margin-bottom: 30px; }

blockquote.all-quotes-list p {
  margin-bottom: 0; }

#content #mainContent article.topContent blockquote.all-quotes-list p.credit {
  margin-top: 0;
  color: #A71930; }

span.meta, span.metalink {
  font-size: .8em;
  color: green;
  font-style: italic; }

span.metalink {
  color: #1655C4; }

a:hover span.metalink, a:active span.metalink, a:focus span.metalink {
  color: #0E3780; }

/**** link thumbnail images ****/
#content #mainContent article.topContent ul li.icon-pdf {
  list-style: none;
  list-style-image: url("../images/pdficon.png"); }

#content #mainContent article.topContent ul li.icon-ppt {
  list-style: none;
  list-style-image: url("../images/powerpoint-icon.png"); }

#content #mainContent article.topContent ul li.icon-word {
  list-style: none;
  list-style-image: url("../images/word-icon.png"); }

/**** END link thumbnail images ****/
.email-wrap {
  word-wrap: break-word; }

/***************  END Text  ***************/
/***************  Images  ***************/
img {
  max-width: 100%;
  /* makes image fluid sizable */
  vertical-align: middle;
  /* removes whitespace */
  border: 0;
  -ms-interpolation-mode: bicubic;
  /* for better quality images */
  image-rendering: optimizeQuality;
  /* for better quality images */ }

figure.rightalign {
  float: right;
  margin: 0 0 10px 15px;
  /* this did have top margin of 20px but changed to 0 - might cause problem on some pages? */
  max-width: 39%; }

figure.rightalignPortrait {
  float: right;
  margin: 0 0 10px 15px;
  max-width: 35%;
  min-width: 165px; }

figure.pictorialCentre {
  margin: 0 auto;
  max-width: 87%; }

figure.pictorialCentrePortrait {
  margin: 0 auto;
  max-width: 67%; }

#mainContent img, #sidebar img {
  background-color: #fff;
  border: 1px solid #DFDECA;
  padding: 3px; }

#mainContent img.transparent, #sidebar img.transparent {
  background-color: transparent; }

.imgRight, .sidebarFull {
  float: right;
  margin: 10px 0 0 10px;
  background-color: #939191;
  padding: 5px;
  /* box-shadow: 2px 2px 2px #3e3e3e; */ }

.sidebarFull {
  float: none; }

.topSidebar .book {
  max-width: 300px; }

/* keeps caption to same max width as book image */
.topSidebar .book h2 {
  font-size: 1.1em;
  margin-top: 35px;
  font-style: italic; }

.imagetransform a img {
  -webkit-transition: -webkit-transform 0.2s ease-in-out;
  -ms-transition: -ms-transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out; }

.imagetransform a:hover img {
  -webkit-transform: scale(2) translate(-60px, 0);
  -ms-transform: scale(2) translate(-60px, 0);
  transform: scale(2) translate(-60px, 0);
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5); }

#mainContent img.noBackground, #sidebar img.noBackground {
  background-color: transparent; }

#mainContent img.noBorder, #sidebar img.noBorder {
  border: none; }

#mainContent img.noborder {
  background-color: transparent;
  border: none;
  padding: 3px; }

/* workshop locations - icons listing */
ul#cityIcon {
  list-style: none;
  padding-left: 0;
  margin-top: -30px; }

ul#cityIcon li {
  float: left;
  margin: 40px 19px 123px 0;
  width: 175px;
  height: 105px;
  border-radius: 5px;
  min-width: 150px; }

ul#cityIcon li:hover {
  text-decoration: none;
  -webkit-transition: background-image 0.2s ease-in-out;
  -moz-transition: background-image 0.2s ease-in-out;
  -ms-transition: background-image 0.2s ease-in-out;
  -o-transition: background-image 0.2s ease-in-out;
  transition: background-image 0.2s ease-in-out; }

ul#cityIcon a:hover li p {
  color: #0E3780; }

ul#cityIcon li h3 {
  font-size: 80%;
  margin: 108px 0 0 0;
  line-height: 1.5em;
  color: #a10303; }

ul#cityIcon li p {
  font-size: 80%;
  margin-top: 5px; }

ul#cityIcon li p span.venue {
  border-top: 1px dotted #000;
  border-bottom: 1px dotted #000;
  padding-top: 2px;
  padding-bottom: 1px;
  margin-bottom: 2px;
  display: block; }

/* faded image and standard display - then hover to show colour image
li#adelaide { background: url("../images/adelaide-fade.jpg") no-repeat; }
li#brisbane { background: url("../images/brisbane-fade.jpg") no-repeat; }
li#cairns { background: url("../images/cairns-fade.jpg") no-repeat; }
li#gold-coast { background: url("../images/gold-coast-fade.jpg") no-repeat; 
li#hobart { background: url("../images/hobart-fade.jpg") no-repeat; }
li#ipswich { background: url("../images/ipswich-fade.jpg") no-repeat; }      
li#logan { background: url("../images/logan-fade.jpg") no-repeat; }
li#melbourne { background: url("../images/melbourne-fade.jpg") no-repeat; }
li#north-lakes { background: url("../images/north-lakes-fade.jpg") no-repeat; }
li#rockhampton { background: url("../images/rockhampton-fade.jpg") no-repeat; }
li#sunshine-coast { background: url("../images/sunshine-coast-fade.jpg") no-repeat; }
li#toowoomba { background: url("../images/toowoomba-fade.jpg") no-repeat; }
li#townsville { background: url("../images/townsville-fade.jpg") no-repeat; }

li#adelaide:hover { background: url("../images/adelaide.jpg") no-repeat; }
li#brisbane:hover { background: url("../images/brisbane.jpg") no-repeat; }
li#cairns:hover { background: url("../images/cairns.jpg") no-repeat; }
li#gold-coast:hover { background: url("../images/gold-coast.jpg") no-repeat; }
li#hobart:hover { background: url("../images/hobart.jpg") no-repeat; }
li#ipswich:hover { background: url("../images/ipswich.jpg") no-repeat; } 
li#logan:hover { background: url("../images/logan.jpg") no-repeat; }
li#melbourne:hover { background: url("../images/melbourne.jpg") no-repeat; }
li#north-lakes:hover { background: url("../images/north-lakes.jpg") no-repeat; }
li#rockhampton:hover { background: url("../images/rockhampton.jpg") no-repeat; }
li#sunshine-coast:hover { background: url("../images/sunshine-coast.jpg") no-repeat; }
li#toowoomba:hover { background: url("../images/toowoomba.jpg") no-repeat; }
li#townsville:hover { background: url("../images/townsville.jpg") no-repeat; }
*/
li#airlie-beach {
  background: url("../images/airlie-beach.jpg") no-repeat; }

li#adelaide {
  background: url("../images/adelaide.jpg") no-repeat; }

li#albury-wodonga {
  background: url("../images/albury-wodonga.jpg") no-repeat; }

li#auckland {
  background: url("../images/auckland.jpg") no-repeat; }

li#ballarat {
  background: url("../images/ballarat.jpg") no-repeat; }

li#bendigo {
  background: url("../images/bendigo.jpg") no-repeat; }

li#brisbane {
  background: url("../images/brisbane-2.jpg") no-repeat; }

li#bundaberg {
  background: url("../images/bundaberg.jpg") no-repeat; }

li#byron-bay {
  background: url("../images/byron-bay.jpg") no-repeat; }

li#cairns {
  background: url("../images/cairns.jpg") no-repeat; }

li#canberra {
  background: url("../images/canberra.jpg") no-repeat; }

li#darwin {
  background: url("../images/darwin.jpg") no-repeat; }

li#emerald {
  background: url("../images/emerald.jpg") no-repeat; }

li#gladstone {
  background: url("../images/gladstone.jpg") no-repeat; }

li#gold-coast {
  background: url("../images/gold-coast.jpg") no-repeat; }

li#hervey-bay {
  background: url("../images/hervey-bay.jpg") no-repeat; }

li#hobart {
  background: url("../images/hobart.jpg") no-repeat; }

li#ipswich {
  background: url("../images/ipswich.jpg") no-repeat; }

li#launceston {
  background: url("../images/launceston.jpg") no-repeat; }

li#lismore {
  background: url("../images/lismore.jpg") no-repeat; }

li#logan {
  background: url("../images/logan.jpg") no-repeat; }

li#mackay {
  background: url("../images/mackay.jpg") no-repeat; }

li#melbourne {
  background: url("../images/melbourne.jpg") no-repeat; }

li#newcastle {
  background: url("../images/newcastle.jpg") no-repeat; }

li#perth {
  background: url("../images/perth.jpg") no-repeat; }

li#north-lakes {
  background: url("../images/north-lakes.jpg") no-repeat; }

li#rockhampton {
  background: url("../images/rockhampton.jpg") no-repeat; }

li#sunshine-coast {
  background: url("../images/sunshine-coast.jpg") no-repeat; }

li#sydney {
  background: url("../images/sydney.jpg") no-repeat; }

li#toowoomba {
  background: url("../images/toowoomba.jpg") no-repeat; }

li#townsville {
  background: url("../images/townsville.jpg") no-repeat; }

li#wellington {
  background: url("../images/wellington.jpg") no-repeat; }

#mainContent img.blue-shade {
  border-radius: 5px;
  padding: 0;
  border: none;
  margin-bottom: 25px; }

img.a4-page {
  margin: 15px 0 15px; }

/***************  END Images  ***************/
/***************  Action button  ***************/
p.actionButton {
  margin: 30px 0;
  transition: background-color 0.5s ease-out 0s;
  background-color: #92d050;
  padding: 10px 15px 10px;
  border-radius: 10px;
  width: 8em;
  color: #535353; }

p.actionButtonWide {
  margin: 30px 0;
  transition: background-color 0.5s ease-out 0s;
  background-color: #92d050;
  padding: 10px 15px 10px;
  border-radius: 10px;
  width: 8em;
  color: #535353;
  width: 90%; }

p.actionButton:hover, p.actionButtonWide:hover {
  background-color: #ccea4d; }

p.actionButton:hover a, p.actionButtonWide:hover a {
  text-decoration: none; }

/***************  END Action button  ***************/
/***************  Enquire button(wider than action button) ***************/
p.enquire {
  width: 8.5em; }

/***************  END Action button  ***************/
/***************  Video  ***************/
.videoContainer {
  position: relative;
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  padding-top: 0;
  margin: 35px 0; }

.videoContainer iframe, .videoContainer object, .videoContainer embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/***************  END Video  ***************/
/***************  Courses  ***************/
.lesson-details {
  float: left;
  width: 48%;
  margin-right: 2%;
  margin-top: 30px; }

#mainContent .lesson-details img {
  background-color: transparent;
  border: none;
  padding: 0; }

p.course-synopsis {
  margin-top: 15px; }

.course-thumb {
  float: left;
  margin: 0 10px 40px 0; }

div.course-short-overview {
  clear: both; }

img.course-brief {
  float: left;
  margin-right: 10px; }

#mainContent div.lesson-details a h3 {
  margin-top: -3px;
  margin-top: -18px\9; }

p.note {
  background-color: #F0F0F0;
  border-bottom: 1px solid gray;
  border-top: 1px solid gray;
  clear: both;
  font-style: italic;
  margin-top: 290px;
  padding: 10px; }

#content #mainContent p.course-title, #content #mainContent div.lesson-details p {
  font-size: 1em;
  margin: 0;
  line-height: 1.5em; }

#content p.small {
  font-size: 1.2em; }

#content #mainContent img.paragraph-icon, #content #mainContent img.courses-icon {
  display: inline;
  margin-right: 5px;
  padding: 0;
  border: none; }

#mainContent div.lesson-details a:hover, a:active, a:focus {
  color: blue;
  text-decoration: none; }

#sidebar ul#lessons {
  list-style-type: none;
  padding-left: 0; }

/* 
input#formbutton {
	border: none;
	padding: 0;
	width: auto;
}
img.course-brief {
	float: left;
	margin-right: 10px;
}
hr.fivehundred {
	width: 500px;
	color: blue;
}

*/
/***************  END Courses  ***************/
/***************  Tookit resources  ***************/
ol.file-repository {
  margin-top: 0; }

/***************  Tookit resources  ***************/
#content {
  line-height: 1.8em; }

.topContent, .bottomContent {
  padding: 0 0 1%; }

.featureBox {
  width: 95%;
  float: left;
  padding: 0 3% 1%;
  margin: 2% 0 6%;
  background-image: url("../images/background-7.jpg");
  background-color: #B7B1A4;
  clear: none;
  border: 1px solid #C0C0AF;
  border-radius: 5px;
  box-shadow: 0 1px 0 #FFFFFF; }

.featureBox h2 {
  background-image: url("../images/background-1.jpg");
  margin: 0 -3% 2% -3%;
  padding: 3%; }

.floated-list {
  float: left;
  width: 30%;
  margin-bottom: 15px; }

/*********** Accordion styles (static) ***********/
#content #mainContent ul.accordion, #content #sidebar ul.accordion {
  display: block;
  list-style-type: none;
  margin: 0;
  padding: 0; }

#content #mainContent ul.accordion li, #content #sidebar ul.accordion {
  padding: 0 0 5px 35px; }

#content #sidebar ul.accordion {
  padding-left: 0;
  margin-top: 10px; }

ul.accordion li.expand {
  clear: left;
  background: none;
  padding: 0 0 4px 35px;
  background: url("../images/expand-icon.png") no-repeat 0 7px; }

#content #sidebar ul.accordion li.expand {
  padding-left: 0; }

#content #sidebar ul.accordion li.expand {
  background: none; }

#content #mainContent ul.accordion h2, #content #sidebar ul.accordion h2 {
  font-size: 1.1em;
  margin: 0 0 -1px; }

ul.accordion h2 a:link, ul.accordion h2 a:visited {
  display: block;
  margin: 1px;
  padding: .4em 0.667em; }

#content #sidebar ul.accordion h2 a:link, #content #sidebar ul.accordion h2 a:visited {
  padding: 0 0.667em; }

#content #maincontent ul.accordion p, #content #sidebar ul.accordion p {
  font-size: 1em;
  padding-bottom: 10px; }

#content #maincontent ul.accordion li.expand p, #content #sidebar ul.accordion li.expand p {
  margin-top: 0; }

/* Accordion styles (dynamic) */
.accordionContent {
  overflow: hidden;
  padding: 0 1em; }

li.collapsed .accordionContent {
  position: absolute;
  left: -9999px; }

/* Fixes Safari bug that prevents expanded content from displaying.
   See http://betech.virginia.edu/bugs/safari-stickyposition.html */
li.collapsed .accordionContent p {
  position: relative; }

ul.accordion li.expanded {
  padding: 0 0 4px 35px;
  background: url("../images/collapse-icon.png") no-repeat 0 7px; }

/* Accordion content styles (static) */
ul.accordion h3 {
  font-size: 1.1em;
  line-height: 1.1;
  margin: 0; }

ul.accordion p {
  display: inline;
  float: left;
  clear: left;
  margin: 0 0 0 0; }

ul.accordion div.links {
  margin: 1em 0 1em 50%; }

div.links ul {
  list-style: none;
  margin: 1em 0 0 0;
  padding: 0; }

div.links li {
  clear: none;
  display: inline;
  margin: 0 3em 0 0; }

ul.rhymes li.expanded {
  background-image: none !important; }

/* online courses overview page */
#course-table {
  margin-bottom: 45px; }

.course-short-overview {
  padding: 10px;
  background-color: #eaf0f4;
  border-bottom: 2px solid #c7d5de;
  border-right: 7px solid #c7d5de;
  border-top: 1px solid #c7d5de;
  border-left: 1px solid #c7d5de; }

.course-short-overview:hover {
  border-bottom: 2px solid #ffa500;
  border-right: 7px solid #ffa500;
  border-top: 1px solid #ffa500;
  border-left: 1px solid #ffa500;
  background-color: #fdf2df; }

.course-image {
  float: left;
  width: 119px;
  margin-right: 15px; }

.course-summary {
  float: right;
  width: 75%; }

p.presenter {
  color: #ff3000;
  margin: 0;
  font-size: 1em;
  font-style: italic; }

/*********** END Accordion styles (static) ***********/
/*********** Blog styles  ***********/
div.post {
  margin-bottom: 55px; }

p.postmetadata {
  font-size: 1em; }

/*********** Blog Comments ***********/
#mainContent ul, #mainContent ol.commentlist {
  padding-top: 15px; }

#mainContent ul, #mainContent .post .entry ul {
  padding-top: 0;
  margin-top: 0;
  /* this should be -10px for general text ie after a paragraph but 0 for after H2 */
  margin-bottom: 10px; }

#blog #content #mainContent ol.commentlist p {
  font-size: 1em;
  padding: 0;
  margin-bottom: .5em;
  line-height: 1.5em;
  color: #434343;
  font-weight: normal; }

#blog #content #mainContent ol.commentlist li {
  list-style-position: inside;
  border-bottom: 1px dashed #9EAAB6;
  margin: 0 0 0 -10px;
  padding: 5px 10px 5px 15px;
  color: #A71930;
  font-weight: bold; }

#blog #content #mainContent ol.commentlist li#comment-4 {
  background: #F7F7F7 url(../images/comments-bg-head.gif) top left repeat-x;
  margin-top: -10px; }

#mainContent ol.commentlist li .commentmetadata, #mainContent ol.commentlist li .commentmetadata cite a {
  font-weight: bold;
  font-size: .9em; }

#mainContent ol.commentlist li .commentmetadata cite a {
  font-weight: bold;
  font-size: 1em; }

#mainContent ol.commentlist li > p {
  margin-top: 5px; }

h2#comments {
  font-size: 1.5em; }

h3#comments, h3#respond {
  text-transform: capitalize; }

#blog #content #mainContent ol.commentlist li.alt {
  background: #E9E9E9; }

#blog #content #mainContent ol.commentlist li.author {
  color: #7C601D;
  background: #EFDBAB; }

#blog #content #mainContent ol.commentlist li.author p {
  color: #7C601D; }

/*********** End Blog Comments ***********/
/*********** End of Blog ***********/
/*****  Search results page  - these style are an attempt to make background an image - not white - not working!!! 
#content #mainContent #cse-search-results #cse-hosted .gsc-control-cse { background-color: blue;
    background-image:url(http://www.literacysolutions.com.au/images/background-2.png); }
#content #mainContent #cse-search-results  body { background-color: blue;
    background-image:url(http://www.literacysolutions.com.au/images/background-2.png); }
#content #mainContent #cse-search-results #cse gsc-control-cse, #content #mainContent #cse-search-results  #cse gsc-control-cse-en { background-color: blue;
    background-image:url(http://www.literacysolutions.com.au/images/background-2.png); }
#content #mainContent #cse-search-results .cse .gsc-control-cse, #content #mainContent #cse-search-results .gsc-control-cse {
    background-color: blue;
    border: 1px solid #FFFFFF;
    background-image:url(http://www.literacysolutions.com.au/images/background-2.png);
}
#content #mainContent #cse-search-results .gsc-webResult.gsc-result, #content #mainContent #cse-search-results .gsc-results .gsc-imageResult {
    background-color: blue !important;
    border-color: #FFFFFF;
    background-image:url(http://www.literacysolutions.com.au/images/background-2.png);
}
.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult {
    background-color: !important; }
#content #mainContent .gsc-webResult.gsc-result, .gsc-results .gsc-imageResult {
    background-color: blue; }
#content #mainContent article .gsc-control-cse {
    background-color: blue !important; }
*/
/*****  Important page message *****/
.alert {
  background: #FAEADD;
  padding: 18px 30px;
  border-top: 2px solid #EA9759;
  border-bottom: 2px solid #EA9759;
  color: #8B4513; }

strong.tick {
  background: #FAEADD url(../images/alert-tick.gif) no-repeat 15px;
  display: inline;
  padding-left: 35px; }

strong.error {
  background: #FAEADD url(../images/alert-error.gif) no-repeat 15px;
  display: inline;
  padding-left: 35px; }

/*****  END Important page message *****/
/*********** Invoice ***********/
.fullWidth div.invoice {
  margin-bottom: 15px; }

.fullWidth div.invoice h2 {
  width: 100%;
  font-size: 1.5em;
  color: #000;
  padding-bottom: 4px;
  border-bottom: 1px dotted #808080;
  margin-top: 40px; }

.fullWidth div.invoice dl.primary-info {
  width: 48%;
  float: left;
  display: inline; }

.fullWidth div.invoice dl.secondary-info {
  width: 40%;
  float: right;
  display: inline; }

table#clearfloat {
  width: 100%;
  padding-top: 5px;
  font-size: 1.1em;
  border-collapse: collapse; }

table#clearfloat caption {
  font-size: 1em;
  font-weight: normal;
  border-top: 1px dotted #808080;
  padding-top: 20px; }

table#clearfloat td {
  border-bottom: 1px solid #808080; }

table#clearfloat td.rightalign, table#clearfloat th.rightalign {
  text-align: right; }

.fullWidth div.invoice dt {
  float: left;
  clear: left;
  width: 170px;
  text-align: right;
  font-weight: bold;
  font-size: 1.1em;
  color: #000; }

.fullWidth div.invoice dd {
  margin: 0 0 0 180px;
  padding: 0 0 0.5em 0;
  font-size: 1.1em; }

table#clearfloat tbody.tfoot td {
  background-color: #4C4C4C;
  color: #fff; }

/*********** END Invoice ***********/
/***************  Side bar  ***************/
.topSidebar, .middleSidebar, .bottomSidebar, .specialSidebar, .optinSidebar {
  width: 90%;
  padding: 0 5% 1%;
  margin: 2% 0 8%;
  background-color: #B7B1A4;
  background-image: url("../images/background-3.jpg");
  border: 1px solid #C0C0AF;
  border-radius: 5px;
  box-shadow: 0 1px 0 #FFFFFF; }

.topSidebar h2, .middleSidebar h2, .bottomSidebar h2, .specialSidebar h2, .optinSidebar h2 {
  font: 2em CallunaSansRegular;
  text-shadow: 0 1px 1px #FFF;
  color: #555555;
  margin-top: .7em; }

.topSidebar p, .middleSidebar p, .bottomSidebar p, .specialSidebar p, .optinSidebar p, li {
  font-size: 1.1em; }

.specialSidebar {
  background-color: #E9E9E2;
  background-image: none; }

.optinSidebar {
  background-image: url("../images/yellow-ribbon-small.png");
  background-repeat: no-repeat;
  background-position: top right;
  background-color: #fcf6e1;
  border: 1px solid #C0C0AF;
  border-radius: 5px;
  box-shadow: 0 1px 0 #FFFFFF; }

#sidebar aside blockquote {
  margin: 30px 0 0;
  font-style: italic; }

#sidebar aside blockquote p {
  margin-bottom: 0; }

#sidebar aside p.quoted {
  font-weight: bold; }

#sidebar aside figure h2 {
  font-size: 1.5em; }

#sidebar aside figcaption {
  font-size: .95em;
  line-height: 1.3em; }

#sidebar figure {
  float: none;
  text-align: center; }

#sidebar figcaption {
  clear: both;
  text-align: center; }

#mainContent figcaption {
  font-style: italic;
  font-size: 0.95em;
  line-height: 1.5em;
  color: #7D2871; }

#mainContent figure.pictorialCentrePortrait figcaption, #mainContent figure.pictorialCentre figcaption {
  width: 75%;
  color: #000;
  font-size: 1.1em; }

#blog #sidebar aside {
  clear: both; }

/***************  Home page banner  ***************/
@media (max-width: 965px) {
  #homeBanner {
    display: none; } }
/***************  Small screen (Mobile)  ***************/
@media (max-width: 615px) {
  #searchform input.txt {
    width: 200px; }

  #headerInner, #content, #footerInner {
    width: 95%; }

  header nav {
    height: 95px; }

  #mainContent {
    width: 100%;
    margin: 0;
    padding: 0; }

  h1 {
    font-size: 1.5em; }

  .imagetransform a:hover img {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    box-shadow: none; }

  label {
    width: 18%; }

  input, select, textarea {
    width: 70%; }

  input.submit {
    margin-left: 20%; }

  .fullWidth div.invoice dl.primary-info {
    width: 100%; }

  .fullWidth div.invoice dl.secondary-info {
    width: 100%;
    float: none;
    clear: both; }

  #sidebar {
    width: 100%;
    margin-top: 0; }

  .featureBox {
    width: 94%; }

  footer {
    height: 1400px; }

  footer #footerInner {
    margin-top: 3em; }

  footer #footerInner .footerColumn {
    float: left;
    width: 100%; }

  footer #footerInner .footerColumn h2 {
    font-size: 1.2em;
    margin-bottom: 0; }

  footer #footerInner .footerColumn ul {
    list-style: none;
    padding-left: 0;
    margin-top: .5em;
    font-family: Georgia,"times new roman",times,serif;
    font-size: 80%;
    color: #6A6A6A; }

  footer #footerInner .footerColumn ul li {
    font-size: 1.3em;
    margin-bottom: 0; }

  footer #footerInner p {
    clear: both;
    font-size: 1em;
    padding-top: 85px;
    background-position: 0 20px; } }
/***************  END small screen (Mobile)  ***************/
/***************  Very Small screen (Mobile)  ***************/
@media (min-width: 100px) and (max-width: 453px) {
  body {
    font-size: 1rem; }

  #searchform {
    margin: 0 0 2px; }

  #searchform input.txt {
    width: 265px;
    font-size: .75em;
    padding-top: 5px;
    padding-bottom: 12px; }

  #searchform input.btn {
    top: 3px; }

  /* Adjust text input height (for webkit browsers - eg Safari and Chrome) for consistency with FF and alignment of button */ }
@media screen and (min-width: 100px) and (max-width: 453px) and (-webkit-min-device-pixel-ratio: 0) {
  #searchform input.txt {
    padding-top: 7px;
    padding-bottom: 7px; }

  #searchform input.btn {
    top: 1px; } }
@media (min-width: 100px) and (max-width: 453px) {
  /* Adjust text input height (for IE10 & IE11) for consistency with FF and alignment of button */ }
@media screen and (min-width: 100px) and (max-width: 453px) and (-ms-high-contrast: active), (min-width: 100px) and (max-width: 453px) and (-ms-high-contrast: none) {
  #searchform input.txt {
    padding-top: 7px;
    padding-bottom: 6px; }

  #searchform input.btn {
    top: 0; } }
@media (min-width: 100px) and (max-width: 453px) {
  body#home #nav.opened a, body#workshops #nav.opened a, body#consulting #nav.opened a, body#courses #nav.opened a, body#resources #nav.opened a, body#blog #nav.opened a, body#contact #nav.opened a,
  body#home #nav.opened a:hover, body#home #nav.opened a:active, body#home #nav.opened a:focus,
  body#workshops #nav.opened a:hover, body#workshops #nav.opened a:active, body#workshops #nav.opened a:focus,
  body#webinars #nav.opened a:hover, body#webinars #nav.opened a:active, body#webinars #nav.opened a:focus,
  body#courses #nav.opened a:hover, body#courses #nav.opened a:active, body#courses #nav.opened a:focus,
  body#consulting #nav.opened a:hover, body#consulting #nav.opened a:active, body#consulting #nav.opened a:focus,
  body#resources #nav.opened a:hover, body#resources #nav.opened a:active, body#resources #nav.opened a:focus,
  body#blog #nav.opened a:hover, body#blog #nav.opened a:active, body#blog #nav.opened a:focus,
  body#contact #nav.opened a:hover, body#contact #nav.opened a:active, body#contact #nav.opened a:focus {
    background-position: 2px 12px; }

  #content {
    margin-top: 15px; }

  h1 {
    font-size: 1.5em;
    margin-top: 0; }

  form {
    margin-top: 25px; } }
/***************  Small screen course thumbnail image  ***************/
@media (min-width: 100px) and (max-width: 477px) {
  .course-thumb {
    margin-bottom: 15px; }

  .course-summary {
    width: 100%; } }
/***************  Small screen portrait image  ***************/
@media (min-width: 400px) and (max-width: 600px) {
  figure.rightalignPortrait {
    width: 50%;
    display: block;
    max-width: 50%; } }
@media (min-width: 100px) and (max-width: 399px) {
  figure.rightalignPortrait {
    width: 100%;
    display: block;
    max-width: 100%; } }
/***************  Smallish screen course summary position  ***************/
@media (min-width: 478px) and (max-width: 530px) {
  .course-summary {
    width: 65%; } }
/***************  Small but slightly larger screen course summary position  ***************/
@media (min-width: 531px) and (max-width: 624px) {
  .course-summary {
    width: 70%; } }
/***************  Larger screen course summary position  ***************/
@media (min-width: 880px) and (max-width: 944px) {
  .course-summary {
    width: 70%; } }
.sectionbreak {
  border-top: 1px dotted brown;
  padding-top: 15px; }

/***************  Small - Medium screen (Tablet)  ***************/
@media (min-width: 615px) and (max-width: 965px) {
  #headerInner, #content, #footerInner {
    width: 95%; }

  #mainContent {
    width: 100%;
    margin: 0;
    padding: 0 0 0 0; }

  .imagetransform a:hover img {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    box-shadow: none; }

  form#fullWidth .shortform input {
    margin-left: 0; }

  #sidebar {
    width: 100%;
    margin-top: 0; }

  .topSidebar, .middleSidebar, .bottomSidebar, .specialSidebar, .optinSidebar {
    margin-bottom: 4%; }

  .featureBox {
    width: 94%; }

  footer {
    height: 1400px; }

  footer #footerInner {
    margin-top: 3em; }

  footer #footerInner .footerColumn {
    float: left;
    width: 100%; }

  footer #footerInner .footerColumn h2 {
    font-size: 1.2em;
    margin-bottom: 0; }

  footer #footerInner .footerColumn ul {
    list-style: none;
    padding-left: 0;
    margin-top: .5em;
    font-family: Georgia,"times new roman",times,serif;
    font-size: 80%;
    color: #6A6A6A; }

  footer #footerInner .footerColumn ul li {
    font-size: 1.3em;
    margin-bottom: 0; }

  footer #footerInner p {
    clear: both;
    font-size: 1em;
    padding-top: 85px;
    background-position: 0 20px; } }
/***************  END medium screen  ***************/
/***************  Large screen (Tablet) ***************/
@media (min-width: 965px) and (max-width: 1390px) {
  #headerInner, #content, #footerInner {
    width: 95%; }

  #mainContent {
    width: 65%;
    float: left; }

  .js #nav.closed {
    max-height: none; }

  #nav {
    overflow: hidden;
    zoom: 1;
    background-color: none; }

  #nav-toggle {
    display: none; }

  div#nav {
    clear: both;
    width: 100%;
    margin: 25px 0 0 0; }

  #nav a:link, #nav a:hover, #nav a:active, #nav a:focus, #nav a:visited {
    float: left;
    padding: .5em 0 0 30px;
    margin-right: 1.1em;
    color: gray;
    background-color: transparent;
    border-bottom: none;
    text-decoration: none;
    line-height: 1.2em; }

  #content div#formsteps {
    margin-bottom: 115px; }

  form#fullWidth .shortform input {
    margin-left: 0; }

  .imagetransform a:hover img {
    -webkit-transform: scale(3) translate(-50px, 0);
    -ms-transform: scale(3) translate(-50px, 0);
    transform: scale(3) translate(-50px, 0);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5); }

  footer #footerInner .footerColumn {
    width: 14%;
    margin-right: 10px; }

  footer {
    height: 400px;
    margin-bottom: 0; }

  #content #formsteps div {
    clear: none;
    width: 23%; } }
/***************  END large screen  ***************/
/* consider using SASS nested media queries for the various options on this new site - see book 'SASS for web designers' page 69 */
/***************  Medium screen  ***************/
@media (min-width: 1390px) and (max-width: 1670px) {
  #mainContent {
    width: 65%;
    float: left; }

  #headerInner, #content, #footerInner {
    width: 95%; }

  .js #nav.closed {
    max-height: none; }

  #nav-toggle {
    display: none; }

  #nav {
    overflow: hidden;
    zoom: 1;
    background-color: none; }

  div#nav {
    float: right;
    width: 75%;
    margin: 45px 0 0 0; }

  #nav a:link, #nav a:hover, #nav a:active, #nav a:focus, #nav a:visited {
    float: left;
    padding: .5em 0 0 30px;
    margin-right: 1.1em;
    color: gray;
    background-color: transparent;
    border-bottom: none;
    text-decoration: none;
    line-height: 1.2em; }

  #nav a:focus, #nav-toggle:focus, #nav a:hover, #nav-toggle:hover {
    color: #000; }

  .topSidebar, .middleSidebar, .bottomSidebar, .specialSidebar, .optinSidebar {
    margin-bottom: 10%; }

  footer {
    height: 350px;
    margin-bottom: 0; }

  #content #formsteps div {
    clear: none;
    width: 23%; }

  #content div#formsteps {
    margin-bottom: 115px; }

  #fullWidth div.checkboxes, #fullWidth div.radio {
    margin-left: 22%; }

  #fullWidth label {
    width: 20%;
    text-align: right; }

  #fullWidth input, #fullWidth select, #fullWidth textarea {
    width: 40%; }

  form#fullWidth fieldset#entity .radiolist {
    margin-top: -55px; }

  /* Resources order form */
  input#postal1, input#postal2 {
    display: inline;
    margin-bottom: 15px; }

  form#fullWidth .shortform input {
    margin-left: 22%; }

  #sidebar form label {
    width: 38%; }

  #sidebar input.submit {
    margin-left: 40%; } }
/***************  END medium screen  ***************/
/***************  Wide screen Layout ***************/
@media (min-width: 1670px) {
  #mainContent {
    width: 65%;
    float: left; }

  .js #nav.closed {
    max-height: none; }

  #nav-toggle {
    display: none; }

  #nav {
    overflow: hidden;
    zoom: 1;
    background-color: none; }

  div#nav {
    float: right;
    width: 75%;
    margin: 45px 0 0 0; }

  #nav a:link, #nav a:hover, #nav a:active, #nav a:focus, #nav a:visited {
    float: left;
    padding: .5em 0 0 30px;
    margin-right: 1.1em;
    color: gray;
    background-color: transparent;
    border-bottom: none;
    text-decoration: none;
    line-height: 1.2em; }

  #nav a:focus, #nav-toggle:focus, #nav a:hover, #nav-toggle:hover {
    color: #000; }

  .topSidebar, .middleSidebar, .bottomSidebar, .specialSidebar, .optinSidebar {
    margin-bottom: 10%; }

  footer {
    height: 350px;
    margin-bottom: 0; }

  #content #formsteps div {
    clear: none;
    width: 23%; }

  #content div#formsteps {
    margin-bottom: 115px; }

  #fullWidth div.checkboxes, #fullWidth div.radio {
    margin-left: 22%; }

  #fullWidth label {
    width: 20%;
    text-align: right; }

  #fullWidth input, #fullWidth select, #fullWidth textarea {
    width: 40%; }

  form#fullWidth fieldset#entity .radiolist {
    margin-top: -55px; }

  /* Resources order form */
  input#postal1, input#postal2 {
    display: inline;
    margin-bottom: 15px; }

  form#fullWidth .shortform input {
    margin-left: 22%; }

  #sidebar form label {
    width: 38%; }

  #sidebar input.submit {
    margin-left: 40%; } }
/***************  END wide screen  ***************/