@charset "UTF-8";

/* =============================================================================
[Table of contents]

1. PLUGINS (Grid, Slidebars)
2. DEFAULTS
3. HELPERS
4. HEADER
5. LEFT NAV
6. CONTENT
7. RIGHT HAND SIDE
8. FOOTER
9. GLOBAL NAV
10. THEMES
11. LANDING PAGES
12. HOMEPAGE

================================================================================ */


/* =============================================================================
   1. PLUGINS (Grid, Slidebars)
================================================================================ */

/* Default Grid */
/*
.column-1 { width: 8.33333%; }
.column-2 { width: 16.66667%; }
.column-3 { width: 25%; }
.column-4 { width: 33.33333%; }
.column-5 { width: 41.66667%; }
.column-6 { width: 50%; }
.column-7 { width: 58.33333%; }
.column-8 { width: 66.66667%; }
.column-9 { width: 75%; }
.column-10 { width: 83.33333%; }
.column-11 { width: 91.66667%; }
.column-12 { width: 100%; }

.column-push-1 { margin-left: 8.33333%; }
.column-push-2 { margin-left: 16.66667%; }
.column-push-3 { margin-left: 25%; }
.column-push-4 { margin-left: 33.33333%; }
.column-push-5 { margin-left: 41.66667%; }
.column-push-6 { margin-left: 50%; }
.column-push-7 { margin-left: 58.33333%; }
.column-push-8 { margin-left: 66.66667%; }
.column-push-9 { margin-left: 75%; }
.column-push-10 { margin-left: 83.33333%; }
.column-push-11 { margin-left: 91.66667%; }
.column-push-12 { margin-left: 100%; }

.column-pull-1 { margin-left: -8.33333%; }
.column-pull-2 { margin-left: -16.66667%; }
.column-pull-3 { margin-left: -25%; }
.column-pull-4 { margin-left: -33.33333%; }
.column-pull-5 { margin-left: -41.66667%; }
.column-pull-6 { margin-left: -50%; }
.column-pull-7 { margin-left: -58.33333%; }
.column-pull-8 { margin-left: -66.66667%; }
.column-pull-9 { margin-left: -75%; }
.column-pull-10 { margin-left: -83.33333%; }
.column-pull-11 { margin-left: -91.66667%; }
.column-pull-12 { margin-left: -100%; }

.column-1, .column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12,
.column-push-1, .column-push-2, .column-push-3, .column-push-4, .column-push-5, .column-push-6, .column-push-7, .column-push-8, .column-push-9, .column-push-10, .column-push-11, .column-push-12,
.column-pull-1, .column-pull-2, .column-pull-3, .column-pull-4, .column-pull-5, .column-pull-6, .column-pull-7, .column-pull-8, .column-pull-9, .column-pull-10, .column-pull-11, .column-pull-12 {
	display: inline-block; margin-right: -.25em; min-height: 1px; padding: 0 20px; vertical-align: top; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }

article [class^="column-"] {padding-left:0;padding-right: 40px;}
*/
/*
@media (max-width: 1023px) {
	.column-1, .column-2, .column-3, .column-4, .column-5, .column-6, .column-7, .column-8, .column-9, .column-10, .column-11, .column-12,
	.column-push-1, .column-push-2, .column-push-3, .column-push-4, .column-push-5, .column-push-6, .column-push-7, .column-push-8, .column-push-9, .column-push-10, .column-push-11, .column-push-12,
	.column-pull-1, .column-pull-2, .column-pull-3,	.column-pull-4,	.column-pull-5,	.column-pull-6,	.column-pull-7,	.column-pull-8,	.column-pull-9,	.column-pull-10,	.column-pull-11,	.column-pull-12  {
		display: block; margin-left: 0; margin-right: 0; padding-left: 0 !important;padding-right: 0 !important; width: auto;
	}
}
*/
/*
.column-centered { display: block; margin-left: auto; margin-right: auto; }
.column-fullwidth { width:100%; }
.column-no-gutter { margin-left: 0; width: 100%; }
.column-no-gutter > * { padding-left: 0; }
.column-ab { vertical-align: bottom; }
.column-am { vertical-align: middle; }
*/
/* Slidebars 0.10.2 (http://plugins.adchsm.me/slidebars/) written by Adam Smith (http://www.adchsm.me/) released under MIT License (http://plugins.adchsm.me/slidebars/license.txt) */
#sb-site,.sb-site-container,.sb-slidebar,body,html{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}body,html{width:100%;overflow-x:hidden}html{height:100%}body{min-height:100%;height:auto;position:relative}html.sb-scroll-lock.sb-active:not(.sb-static){overflow:hidden}#sb-site,.sb-site-container{width:100%;position:relative;z-index:1;background-color:#fff}.sb-slidebar{height:100%;overflow-y:auto;position:fixed;top:0;z-index:0;display:none;background-color:#222;-webkit-transform:translate(0px)}.sb-left{left:0}.sb-right{right:0}.sb-slidebar.sb-static,html.sb-static .sb-slidebar{position:absolute}.sb-slidebar.sb-active{display:block}.sb-style-overlay{z-index:9999}.sb-momentum-scrolling{-webkit-overflow-scrolling:touch}.sb-slidebar{width:30%}.sb-width-thin{width:15%}.sb-width-wide{width:45%}@media (max-width:480px){.sb-slidebar{width:70%}.sb-width-thin{width:55%}.sb-width-wide{width:85%}}@media (min-width:481px){.sb-slidebar{width:55%}.sb-width-thin{width:40%}.sb-width-wide{width:70%}}@media (min-width:768px){.sb-slidebar{width:40%}.sb-width-thin{width:25%}.sb-width-wide{width:55%}}@media (min-width:992px){.sb-slidebar{width:30%}.sb-width-thin{width:15%}.sb-width-wide{width:45%}}@media (min-width:1200px){.sb-slidebar{width:20%}.sb-width-thin{width:5%}.sb-width-wide{width:35%}}#sb-site,.sb-site-container,.sb-slide,.sb-slidebar{-webkit-transition:-webkit-transform 400ms ease;-moz-transition:-moz-transform 400ms ease;-o-transition:-o-transform 400ms ease;transition:transform 400ms ease;-webkit-transition-property:-webkit-transform,left,right;-webkit-backface-visibility:hidden}.sb-hide{display:none}

/* Slidebar Plugin Overrides */
.sb-slidebar {
  height: 100%;        /* we are using static slidebars, but still want them to be full height */
  overflow-y: visible; /* makes .global-nav-thumb visible outside the container */
  box-shadow: none;    /* no drop-shadows */
  z-index: 2;          /* pushes the global menu higher in the stack */
}

/* desktop styles */
@media (min-width: 1024px) {

  /* overrides the default slidebar css - basically makes the push styling act like an overlay. */
  #sb-site {
    transform: translate(0px) !important; /* transform is used by CSS3 browsers */
    right: 0 !important;                  /* right is set for non-CSS3 browsers */
    z-index: 0;                           /* pushes the main page content down lower in the stack */
    padding-right: 60px;                  /* makes room for global-nav-thumb */
    background-color: transparent;        /* make background swish visible */
  }

}

/* IE8 styles */
.lt-ie9 #sb-site {
  background-color: transparent;        /* make background swish visible */
  transform: translate(0px) !important; /* transform is used by CSS3 browsers */
  right: 0 !important;                  /* right is set for non-CSS3 browsers */
  z-index: 0;                           /* pushes the main page content down lower in the stack */
  padding-right: 60px;                  /* makes room for global-nav-thumb */
  background-color: transparent;        /* make background swish visible */
}


/* =============================================================================
   2. DEFAULTS
================================================================================ */


/* Typography */
html { font: 100%/1.5 "MuseoSans-300", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; letter-spacing: 0; -webkit-font-smoothing: antialiased; }
h1 { margin: .3em 0 0.5em 0; line-height: 1.1em; font-weight: normal; font-family: "MuseoSans-300", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 2.6em;}
h2 { margin: 1em 0 0.5em 0; line-height: 1.1em; font-weight: normal; font-family: "MuseoSans-300", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; color: #005572; font-size: 2em; }
h2 a { text-decoration: none; } /* TODO - this seems somewhat sepcific...check what it's for */
h3 { margin: 1em 0 0.5em 0; line-height: 1.1em; font-weight: normal; font-family: "MuseoSans-300", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 1.4em; }
h4 { margin: 1em 0 0.5em 0; line-height: 1.1em; font-weight: bold; font-family: "MuseoSans-300", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; }
p  { margin: 0 0 1.4em 0; }
ul { margin: 0 0 1em 0; }
li { margin: 0 0 0.3em 0; }
nav  li, footer li { margin-bottom: 0; } /*exceptions to above li margin */

/* Links */
a { color: #0070C6; }
a:hover { color: #3D68BF; text-decoration: none; }

blockquote { margin: 0 3em 1em 3em; padding:2em 6em; font-style: italic; color: #666666; background-repeat: repeat-y; background-position: left -3px center; }

table { border-collapse: collapse; border: 1px solid #ddd; width:100%; margin:0; margin-bottom:1em;}
table th { background-color:#eee; border: 1px solid #ddd; text-align:left; padding:5px 7px; color: #000000; vertical-align: top; font-weight: bold; }
table td { border: 1px solid #ddd; padding: 5px 7px; vertical-align:top; }
table th p {margin-bottom:inherit !important;} /* TODO check if this is really needed */
table caption { font-style: italic; margin-bottom: 0.4em; text-align: left; }

/* Box Sizing (define here rather than against individual elements in the site) - some specificity required to override normalize.css */
div, p, li, form, input, input[type="search"] {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
       -o-box-sizing: border-box;
          box-sizing: border-box;
}


/* =============================================================================
   3. HELPERS
================================================================================ */
.no-padding { padding: 0 !important; }
.text-centre { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.hidden { display: none !important; }
.visuallyhidden, .visually-hidden { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; }
.wrap { min-width: 150px; margin: 0 auto; max-width: 1300px; padding:0; position: relative; }

.tablesmalltext { font-size: 11px; } /* use relative em?? */

/* Buttons */
.button { display: inline-block; color: #FFF; text-decoration: none; background: #666; margin: 0; padding: 4px 20px; margin: 0.5em 0.25em; }
.button:hover { color: #FFF; background: #333; }

/* Icon buttons */
.button-icon { cursor: pointer; color: #fff; width: 40px; height: 40px; padding: 0; line-height: 40px !important; display: inline-block; outline: 0 none; text-align: center; font-family: 'icomoon'; font-size: 30px; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-decoration: none; text-transform: none; line-height: 1; border: none; background-color: transparent; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.button-icon:before {font-family: 'icomoon';}
.button-icon:hover {color: #fff; background-color: rgba(238,238,238,.5); }

/* Inline lists */
.inline-list { list-style: none; display: inline; padding: 0; }
.inline-list > li { list-style: none; display: inline; padding: 0; }

/* Media player */
.video-container { position: relative; padding-bottom: 62.25%; height: 0; overflow: hidden; margin-bottom: 2em; }
.video-container iframe,
.video-container object,
.video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* condensed para's */
.condensed p { margin-bottom: 0.5em; }

.highlight { margin-bottom: 1em; padding: 1.4em 2.5em 0.2em 2.5em; color: #FFFFFF; background-repeat: repeat-y; background-position: left -3px center; }
.highlight p,
.highlight h1,
.highlight h2,
.highlight h3,
.highlight h4 { color:#FFFFFF; }

body.hide-h1 h1 { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; }

.word-break { 
 -ms-word-break: break-all;
     word-break: break-all;

     /* Non standard for webkit */
     word-break: break-word;

-webkit-hyphens: auto;
   -moz-hyphens: auto;
    -ms-hyphens: auto;
        hyphens: auto;
}

/* desktop styles */
@media (min-width: 1024px) {
	body.hide-leftnav nav.left-nav { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; }
}
/* IE8 styles */
.lt-ie9	body.hide-leftnav nav.left-nav { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; }

/* phone styles */
@media (max-width: 480px) {
	.phone-hidden { display: none !important; }
}

/* tablet styles */
@media (min-width: 481px) and (max-width: 1023px) {
	.tablet-hidden { display: none !important; }
}

/* desktop styles */
@media (min-width: 1024px) {
  .desktop-hidden { display: none !important; }
  .wrap { padding: 0 1em; }
  .video-container { padding-bottom: 30.25%; }

  /* TODO these next rules look too specific, like they are just for global menu.  If so, move to that section */
  .button-icon:hover {color: #fff; background-color: rgba(255,255,255,.2);}
}

/* IE8 styles */
.lt-ie9 .desktop-hidden { display: none !important; }
.lt-ie9 .wrap { min-width: 1024px; padding: 0 1em;}
.lt-ie9 .video-container { padding-bottom: 30.25%; }


/* TODO these next rules look too specific, like they are just for global menu.  If so, move to that section */
.lt-ie9  .button-icon:hover {color: #fff; background-color: #555;}


/* =============================================================================
   4. HEADER
================================================================================ */

header .wrap {padding-top:1em;background: #005471; }

.site-logos { /*PSremoved background: #CCE5E2;*/ padding: 0 1em; }
.site-logos { min-height: 35px; vertical-align: top; padding-right: 120px; }
.site-logos a { text-decoration: none; color: #fff; font: 0.9em/1.2 "MuseoSans-500","Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; }
.site-logos a span { display:inline-block; margin-bottom: 1em; }
.site-logos .vic-link img { background-color: white; }

.site-search { /*PSremovedbackground: #CCE5E2;*/ padding: 0 1em; }
.site-search { padding-bottom: 1em; }
.site-search form { position: relative; }
.site-search input[type="submit"] { font-family: 'icomoon'; position: absolute; z-index: 1; top: 1px; right: 1px; }
.site-search input[type="submit"]:hover { background-color: #EEE; }
/* TODO do we really need to use these classnames?? */
.search-input {background:#FFF;padding: 0 45px 0 12px;width: 0 /* TD - min/max widths handle actual widths, this prevents an overlap error */; min-width: 100%;height:40px;border:1px solid #ddd;line-height: 40px !important;margin: 0;font-family: inherit;font-size: 20px;color: #2c3e50;}

/* TODO - check these selectors.  Valid?  Should we be using them? */
.search-input::-webkit-input-placeholder {color: #6A6A6A;}
.search-input:-moz-placeholder {color: #6A6A6A;}
.search-input::-moz-placeholder {color: #6A6A6A;}
.search-input:-ms-input-placeholder {color: #6A6A6A;}

.search-submit  { width: 40px; height: 38px; display: block; position: absolute; right: 51px; top: 1px; padding: 0; margin: 0; line-height: 38px !important; text-align: center;cursor: pointer;/*right:1px !important;*/}
.search-submit {background:transparent;/* IE needs this */border: none;outline: none;}
.search-submit:focus {background: #EEE !important; opacity: 1;} /* TODO why does this need an important? */
.search-submit:hover{background-color:#EEE;}

header .utility-links { text-align: right; }
header .utility-links ul { list-style: none; display: inline; padding: 0; }
header .utility-links ul > li { list-style: none; display: inline; padding: 0; }
header .utility-links ul > li + li { margin-left: 1.375em; }

/* .section-title-wrapper { background-repeat: repeat; background-position: left bottom -3px;  padding-bottom: 6px; } */
.section-title { font-size: 2em; padding: 0.25em 1em 14px; color:#FFFFFF; background-position: center bottom -8px; background-repeat: repeat-x;}

.audience-facet { display: none; } /* default state - shown for 1) desktop view, and 2) mobile view only on landing pages */
.audience-facet .button { margin: 0; }

/* desktop styles */
@media (min-width: 1024px) {
	header .wrap { background:none; }
	.global-menu { top: 1em; }
	.site-logos { background: transparent; display: inline-block; margin-right: -0.25em; white-space: nowrap; padding: 0; }
	.site-logos { width: 30%; }
	.section-title { width: 40%; display: inline-block; margin: 0 -0.25em 0 0; padding: 0.25em 1em; background-image: none !important; }
	.section-title-wrapper { padding-bottom: 15px; background-repeat: repeat-x; background-position: left bottom -3px; }
	.audience-facet { width: 60%; display: inline-block; margin: 0 -0.25em 0 0.25em; padding: 0 0 10px 20px; text-align: right; vertical-align: bottom; white-space: nowrap; }
	.audience-facet ul { display: inline-block; list-style: none; padding: 0; margin: 0; }
	.audience-facet li { display: inline-block; }
}

/* IE8 styles */
.lt-ie9 header .wrap { background: none; padding-top: 1em;/*Required specifically as overwrite for IE8*/ }
.lt-ie9 .global-menu { top: 1em; }
.lt-ie9 .site-logos{ background: transparent; display: inline-block; margin-right: -0.25em; white-space: nowrap; padding: 0; }
.lt-ie9 .site-logos { width:30%; }
.lt-ie9 .headerwrapper { background-position: left 4em; } /* TODO check if IE8 actually needs this */
.lt-ie9 .section-title { font-size: 2em; width: 40%; display: inline-block; margin: 0 -0.25em 0 0; padding: 0.25em 1em; background-image: none !important; }
.lt-ie9 .section-title-wrapper { padding-bottom: 15px; background-repeat: repeat-x; background-position: left bottom; }
.lt-ie9 .audience-facet { width: 60%; display: inline-block; margin: 0 -0.25em 0 0.25em; padding: 0 0 10px 20px; text-align: right; vertical-align: bottom; white-space: nowrap; }
.lt-ie9 .audience-facet ul { display: inline-block; list-style: none; padding: 0; margin: 0; }
.lt-ie9 .audience-facet li { display: inline-block; }


/* mobile styles */
@media (max-width: 1023px) {
	.date-reviewed  {padding-top:.5em;}
}

/* desktop styles */
@media (min-width: 1024px) {
	.site-search {/*PSremoved background:#fff;*/display:inline-block;margin-right:-0.25em;width:70%;padding:0 0 0 0;text-align:right;}
	.search-input {min-width:50%;}
}

/* IE8 styles */
.lt-ie9  .site-search {/*PSremoved background:#fff;*/display:inline-block;margin-right:-0.25em;width:70%;padding:0 0 0 0;text-align:right;}
.lt-ie9 .search-input {min-width:40%;}


/* =============================================================================
   5. LEFT NAV
================================================================================ */

.left-nav { padding: 0; font-size: 0.9em; display: none; /* the default state - toggle plugin and media queries will adjust */ }
.left-nav ul { list-style: none; line-height: 1.4; margin: 0; padding: 0; }
.left-nav li { padding: 0; }
.left-nav li a { display: block; text-decoration:none; font-weight: normal; }
.left-nav li.active > a,
.left-nav li.expanded > a { font-weight: bold; }
/* TODO - this seems to be interfering .left-nav li:first-child > a { border-top: none; } /* force first menu items to have no top border */

.left-nav .menu1 > li:first-child > a      { border-top: none; } /* force first menu items to have no top border */
.left-nav .menu1 a                       { color: #000000; background: #F0F0F0; padding: 0.6em 2em; border-top: 1px solid #E1E1E1; }
.left-nav .menu1 a:active,
.left-nav .menu1 a:focus,
.left-nav .menu1 a:hover                 { color: #000000; background: #E9E9E9; }
.left-nav .menu1 > .expanded > a         { color: #000000; background: #CDCDCD; }
.left-nav .menu1 > .expanded > a:active,
.left-nav .menu1 > .expanded > a:focus,
.left-nav .menu1 > .expanded > a:hover   { color: #000000; background: #C1C1C1; }
.left-nav .menu1 > .active > a           { color: #FFFFFF; background: #666666; }
.left-nav .menu1 > .active > a:active,
.left-nav .menu1 > .active > a:focus,
.left-nav .menu1 > .active > a:hover     { color: #FFFFFF; background: #666666; }

.left-nav .menu2 a                       { color: #000000; background: #CDCDCD; padding-left: 3em; border-top: 1px solid #EAEAEA; }
.left-nav .menu2 a:active,
.left-nav .menu2 a:focus,
.left-nav .menu2 a:hover                 { color: #000000; background: #D0D0D0; }
.left-nav .menu2 > .expanded > a         { color: #000000; background: #D9D9D9; }
.left-nav .menu2 > .expanded > a:active,
.left-nav .menu2 > .expanded > a:focus,
.left-nav .menu2 > .expanded > a:hover   { color: #000000; background: #D0D0D0; }
.left-nav .menu2 > .active > a           { color: #FFFFFF; background: #666666; }
.left-nav .menu2 > .active > a:active,
.left-nav .menu2 > .active > a:focus,
.left-nav .menu2 > .active > a:hover     { color: #FFFFFF; background: #666666; }

.left-nav .menu3 a                       { color: #000000; background: #CDCDCD; padding-left: 4em; border-top: 1px solid #EAEAEA;}
.left-nav .menu3 a:active,
.left-nav .menu3 a:focus,
.left-nav .menu3 a:hover                 { color: #000000; background: #D9D9D9; }
.left-nav .menu3 > .expanded > a         { color: #000000; background: #E0E0E0; }
.left-nav .menu3 > .expanded > a:active,
.left-nav .menu3 > .expanded > a:focus,
.left-nav .menu3 > .expanded > a:hover   { color: #000000; background: #D9D9D9; }
.left-nav .menu3 > .active > a           { color: #FFFFFF; background: #666666; }
.left-nav .menu3 > .active > a:active,
.left-nav .menu3 > .active > a:focus,
.left-nav .menu3 > .active > a:hover     { color: #FFFFFF; background: #666666; }

.left-nav .menu4 a                       { }
.left-nav .menu4 a:active,
.left-nav .menu4 a:focus,
.left-nav .menu4 a:hover                 { }
.left-nav .menu4 > .expanded > a         { }
.left-nav .menu4 > .expanded > a:active,
.left-nav .menu4 > .expanded > a:focus,
.left-nav .menu4 > .expanded > a:hover   { }
.left-nav .menu4 > .active > a           { }
.left-nav .menu4 > .active > a:active,
.left-nav .menu4 > .active > a:focus,
.left-nav .menu4 > .active > a:hover     { }

/* TODO above nested confusing and hard to mantain - using menu1-4 helpers included in the menu system */
@media (min-width: 1024px) {
  .left-nav { width: 22%; display: table-cell !important; /* forces menu visible regardless of what state drop-down menu is in */ }
}

/* IE8 styles */
.lt-ie9 .left-nav { width: 22%; display: table-cell !important; /* forces menu visible regardless of what state drop-down menu is in */ }


/* =============================================================================
   6. CONTENT
================================================================================ */

main.wrap { padding: 0 1em; } /* override default wrap behaviour */
article { padding: 0 1em; margin: 1em 0; }

/* element styles specific to article area */
article li { padding-left: 0.6em; }
article img { border: none; max-width: 100%; height: auto; margin: 0; margin-bottom: 1em; margin-top: 0 !important; }
article img.left,  img[align="left"]  { float: left;  margin-right: 0.5em; }
article img.right, img[align="right"] { float: right; margin-left:  0.5em; }
article img.border { border: solid 1px lightgrey; } /* helper for images in author content that may clash with background */

.breadcrumbs { background-color: rgba(234, 234, 234, 0.8); height: 40px; position: relative; }
.breadcrumbs { padding: 10px 50px 10px 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.breadcrumbs .inline-list > li + li:before { content: ">"; margin: 0 4px 0 2px; }
.breadcrumbs .toggle-menu-button { position: absolute; top: 0; right: 0; z-index: 1; background-color: #E4E4E4; }
.breadcrumbs .toggle-menu-button:hover { background-color: #CCCCCC; }
.breadcrumbs .toggle-menu-button:before { content: "\f105"; }
.breadcrumbs .toggle-menu-button-active:before { content: "\f107"; }

.date-reviewed { padding: 1em 2em; }

/* desktop styles */
@media (min-width: 1024px) {
	article { padding: 0 2em; }

	/* uses table layout when in desktop mode */
	main .content-wrapper { display: table; width: 100%; margin: 1em 0 0 0; }
	main .content-wrapper > .left-nav    { display: table-cell; vertical-align: top; }
	main .content-wrapper >  article     { display: table-cell; vertical-align: top; }
	main .content-wrapper > .rhs-wrapper { display: table-cell; vertical-align: top; }

	/* sets the semi-transparent background */
	main .content-wrapper, main .date-reviewed { background-color: rgba(255, 255, 255, 0.9); }

	.breadcrumbs { padding: .6em 2em; }
	
	article > div > p:first-child,
	article > p:first-child,
	article > ul:first-child { margin-top: 2em; }
}

/* IE8 styles */
.lt-ie9 article { padding: 0 2em; }
.lt-ie9 main .content-wrapper, .lt-ie9 main .date-reviewed { background-color: #fff; }
.lt-ie9	main .content-wrapper { display: table; width: 100%; margin: 1em 0 0 0; }
.lt-ie9	main .content-wrapper > .left-nav    { display: table-cell; vertical-align: top; }
.lt-ie9	main .content-wrapper >  article     { display: table-cell; vertical-align: top; }
.lt-ie9	main .content-wrapper > .rhs-wrapper { display: table-cell; vertical-align: top; }

.lt-ie9 .breadcrumbs {margin-bottom: 0.5em;padding: 10px 20px;background-color:#eee;}
.lt-ie9 .date-reviewed p {margin:2em 3em 1em 0;} /* TODO refactor date-reviewed styles with above */


/* =============================================================================
   7. RIGHT HAND SIDE
================================================================================ */

.related-content { border: 1px solid #DDDDDD; background: #EEEEEE; padding: 1em; margin: 1em;}
	.related-content h2 { margin:0 0 .5em 0; font-size: 1.2em; color: #000;}
	.related-content ul { font-size: .8em; margin: 0 0 1em 0; padding: 0 0 0 1em; }
	.related-content li { margin: 0; padding: 0 0 0.2em 0.4em; }

/* desktop styles */
@media (min-width: 1024px) {
  .rhs-wrapper { width: 20%; }
}

/* IE8 styles */
.lt-ie9 .rhs-wrapper { width: 20%; }

/* =============================================================================
   8. FOOTER
================================================================================ */

footer { color: #DDDDDD; padding: 15px 0 0 0; background-color: #333333; background-repeat:repeat-x; background-position:left -3px; }
footer a { color: #DDDDDD; text-decoration: none; }
footer a:hover { color: #DDDDDD; text-decoration: underline; }
footer .grid { padding: 0 1em; }

/*PSremove 
footer .wrap { padding: 0 1em; } */ /* override default wrap behaviour */

/*PS remove 
.footer-column { overflow: hidden; }
.footer-column > h3 { font-size: 1.2em; margin-bottom: 0.5em; margin-top:1em; color: #ddd; }
.footer-column ul { list-style: none; margin: 0; padding: 0; }
.footer-column ul li { border-bottom:1px dashed #555; }
.footer-column ul li a { display:block; padding: 0.2em; }
.footer-column ul li a:hover { background: #444; text-decoration: none; }
*/

footer h3 { margin-bottom: 0.5em; margin-top: 2em; color: #ddd; }
footer ul { list-style: none; margin: 0; padding: 0;}
footer ul li { border-bottom:1px dashed #555;}
footer ul li a { display:block; padding: .4em 0;}
footer ul li a:hover { background: #444; text-decoration: none;}

.secondary-footer { background: #222; text-align: center; padding: 1em 0 2em 0; margin-top: 2em; border-top: 1px solid #444444;}
.secondary-footer p { margin: 1em auto;}
.secondary-footer ul { padding: 0 1em;}
.secondary-footer ul li { border-bottom:none; }
.secondary-footer ul li + li { margin-left: 1.375em;}
.secondary-footer ul li a { white-space: nowrap; display:inline; }
.secondary-footer ul li a:hover { background: none; text-decoration: underline; }

/* desktop styles */
@media (min-width: 1024px) {
  footer { margin-right: -60px; } /* pull footer under global-nav-thumb so overlays as transparent */
	/*PS Remove .footer-column { width: 25%; display: inline-block; margin-right: -0.25em; min-height: 1px; padding: 0 20px; vertical-align: top; }*/
	footer .grid {margin-right: 60px; margin-top:1em; padding: 0; }
}

/* IE8 styles */
.lt-ie9 footer { margin-right: -60px; }
/*PS Remove .lt-ie9 .footer-column {width: 25%; display: inline-block; margin-right: -0.25em; min-height: 1px; padding: 0 20px; vertical-align: top; } */
.lt-ie9 footer .grid {margin-right: 60px; margin-top:1em; padding: 0; }



/* =============================================================================
   9. GLOBAL NAV
================================================================================ */
.global-nav { color: #EEE; background-color: #444; }
.global-nav h3 { color: #000; margin: 1.5em 0 0 0; padding: 0.2em 0.8em; font-size: 1em; background:#CCE5E2; border: 1px solid #666; border-bottom: 0; }
.global-nav nav { padding: 1em; }

.global-nav ul { list-style:none; margin: 0; padding: 0; border: 1px solid #666; }
.global-nav ul li a { display: block; padding: 0.4em 1em; color: #EEE; text-decoration: none; background: #222; font-size: 0.9em; }
.global-nav ul li + li a { border-top: 1px solid #666; }
.global-nav ul li a:hover,
.global-nav ul li a:focus { background: #444; text-decoration: none; }

.global-nav .utility-links ul { border: 1px solid #999; }
.global-nav .utility-links ul li a { background: #006687; color: #EEE; border-top: 1px solid #999; }
.global-nav .utility-links ul li:first-child a { border: none; }
.global-nav .utility-links ul li a:hover,
.global-nav .utility-links ul li a:focus { background: #01546F; }

.sb-toggle-right { margin: 10px; position: absolute; right: 0px; top: 0px; }
.sb-toggle-right:before { content: "\e602"; }
.sb-toggle-right.desktop-hidden { padding-left: 60px; }
.sb-toggle-right.desktop-hidden:hover { background-color: transparent; }

.back-to-top.desktop-hidden { background-color: #CCE5E2; color: #000000; display: block; position: relative; text-align: center; padding:.3em 0 .1em 0; text-decoration: none; }
.back-to-top.desktop-hidden:after {
  border-color: transparent transparent #CCE5E2;
  border-style: solid;
  border-width: 12px;
  content: " ";
  width: 0;
  height: 0;
  left: 50%;
  margin-left: -12px;
  position: absolute;
  bottom: 100%;
}

.global-nav-bar { position: fixed; top: 0; right: 0; width: 60px; height: 100%; background: rgba(0, 0, 0, 0.5); text-align: middle; }
.global-nav-bar .sb-toggle-right { padding: 0; }
.global-nav-bar .back-to-top { margin: 10px; position: absolute; right: 0px; bottom: 0px; }
.global-nav-bar	.back-to-top:before { content: "\f106"; }

/* IE8 styles */
.lt-ie9 .global-nav-bar {background: #333; }


/* =============================================================================
   10. THEMES
================================================================================ */

/* default */
.section-title,
.highlight { background-color: #6E6258; }

.property-and-land-titles .section-title,
.property-and-land-titles .highlight { background-color: #F46929; }

.planning .section-title,
.planning .highlight { background-color: #16838E; }

.heritage .section-title,
.heritage .highlight { background-color: #16838E; }

.local-government .section-title,
.local-government .highlight { background-color: #00938E; }

.transport .section-title,
.transport .highlight { background-color: #6876B8; }

.sport-and-recreation .section-title,
.sport-and-recreation .highlight { background-color: #4B9243; }

.grants .section-title,
.grants .highlight { background-color: #C13933; }

.data-and-research .section-title,
.data-and-research .highlight { background-color: #16838E; }

.about-the-department .section-title,
.about-the-department .highlight { background-color: #007097; }

.summary-highlight { margin: 1em; background: #f3fafa; border: 1px solid #ddd; padding: 0 1em; }

/* desktop styles */
@media (min-width: 1024px) {
	.sport-and-recreation .landing-content { margin-bottom: 12em; }
	.data-and-research .landing-content { margin-bottom: 4em; }
	.grants .landing-content { margin-bottom: 6em; }
}

/* IE8 styles */
.lt-ie9 .sport-and-recreation .landing-content { margin-bottom: 12em; }
.lt-ie9 .data-and-research .landing-content { margin-bottom: 4em; }
.lt-ie9 .grants .landing-content { margin-bottom: 6em; }
	
/* =============================================================================
   11. LANDING PAGES
================================================================================ */

/*PSremove .landing .section-title-wrapper { padding: 0; }
.landing .section-title { margin-bottom: 6px; }*/

.landing .audience-facet { display: block; padding: 1em; background:#EEEEEE; }
.landing .audience-facet ul { list-style: none; padding: 0; }
.landing .audience-facet .button { display: block; color: #000000; background: #BEBEBE; padding: 5px 10px; margin-top: 1px; }
.landing .audience-facet .button:hover { background: #CCCCCC; }
.landing .audience-facet .button:before { font-family: 'icomoon'; content: "\f105"; float: right; }

.landing-description { font-size: 1.2em; }
/*.landing-description p { margin: 0; } TD - not required, change margin on tasks wrapper instead */
.landing-description p { margin-bottom: .5em; }

.top-tasks-wrapper { margin: 1em 0 2em 0; }
.top-task { margin-bottom: 0.6em; background-position: center top; background-repeat: repeat; background-color: #CCE5E2; }
.top-task .doc-icon,
.top-task .tick-icon,
.top-task .tools-icon  { background-position: 16px center; background-repeat: no-repeat; background-size: 50px; background-color: transparent; }
.top-task a { color: #000000; text-decoration: none; display: block; }
/* .top-task a:hover { color: #000000; text-decoration: none; } TD - not needed, uses correct ones regardless */
.top-task h3 { margin: 0 0 0 80px; padding: 1em 0 0 0; }
.top-task p  { margin: 0 0 0 80px; padding: 0 0.8em 1em 0; font-size: 0.8em; }

.landing-content { margin-bottom: 1em; margin-top: 0; }
.landing-content h2 { margin-bottom: 0.2em; margin-top: 0; }
.landing-content h2 a { background: #EEEEEE; padding: 5px 10px; color: #000000; display: block; }
.landing-content h2 a:hover{ background: #E9E9E9; }
.landing-content h2 a:before { font-family: 'icomoon'; content: "\f105"; float: right; }
.landing-content p { margin-top: 0.4em; margin-bottom: 0.4em; }
.landing-content ul { list-style: none; padding: 0; }
.landing-content ul li { padding: 0 0 0.5em 0; }
.landing-content ul a { display: block; }

/*.landing-news h2 {background:#f3b84a;padding:5px 10px;margin-bottom:0;}*/
/*.landing-news{width:100%;} TD - not needed */
.landing-news h2 { position: relative; background: #CCE5E2; padding: 0.2em 0.5em; margin-bottom: 1em; margin-top: 0; color: #000; }
.landing-news h2:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(204, 229 226, 0); border-top-color: #cce5e2; border-width: 12px; margin-left: -12px; }
.landing-news h3 {margin: 0 0 0.4em 0; }
.landing-news h3 a { text-decoration: none; }
.landing-news h3 a:hover { text-decoration: underline; }
.landing-news p { margin-top: 0.4em; }

/* desktop styles */
@media (min-width: 1024px) {

  /* need to recreate the desktop rules here, landing styles tends to override previous media queries */
  .landing .section-title-wrapper { padding-bottom: 15px; }
  .landing .section-title {  margin-bottom:0; }
	.landing .audience-facet { background-color: #FFFFFF; width: 60%; display: inline-block; margin: 0 -0.25em 0 0.25em; padding: 0 0 10px 20px; text-align: right; vertical-align: bottom; white-space: nowrap; }
	.landing .audience-facet .button { background-color: #666666; color: #FFFFFF; display: inline-block; padding: 4px 20px; text-decoration: none; }
	.landing .audience-facet .button:hover { background: #333333; }
  .landing .audience-facet .button:before { content: none; display: none; }

	.landing-description div { font-size: 1.6em; line-height: 1.4em; margin: .4em 0 1em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left bottom -10px; }

	.top-tasks-wrapper {width: 25%; position: absolute; right: 3em; top: 1em; padding-left:40px; }
	.top-task { margin-bottom: 1em; text-align: center; }
  .top-task .doc-icon,
  .top-task .tick-icon,
  .top-task .tools-icon  { background-position: center top; background-size: auto; }
	.top-task a { padding:110px 1em 1em 1em; min-height: 50px !important; }
	.top-task h3 { margin: 0 0 .2em 0; padding: .5em 0 0 0; }
	.top-task p { margin: 0; padding: 0; }

	.landing-content ul a { display: inline; }
	.landing-content h2 a { background: none; padding: 0; color: #0070C6; display: inline; }
	.landing-content h2 a:hover { background: none; }
	.landing-content h2 a:before { content: none; display: none; }

	.landing-news { padding-top: 3em; background-repeat: repeat-x; background-position: left top -10px; }
	.landing-news h2 { background: none; padding: 0; }
	.landing-news h2:after { content: none; display: none; }
}

/* IE8 styles */

.lt-ie9 .landing .section-title-wrapper { padding-bottom: 15px; }
.lt-ie9 .landing .section-title {  margin-bottom:0; }
.lt-ie9 .landing .audience-facet { background-color: #FFFFFF; width: 60%; display: inline-block; margin: 0 -0.25em 0 0.25em; padding: 0 0 10px 20px; text-align: right; vertical-align: bottom; white-space: nowrap; }
.lt-ie9 .landing .audience-facet .button { background-color: #666666; color: #FFFFFF; display: inline-block; padding: 4px 20px; text-decoration: none; }
.lt-ie9 .landing .audience-facet .button:hover { background: #333333; }
.lt-ie9 .landing .audience-facet .button:before { content: none; display: none; }
.lt-ie9 .landing-description div { font-size: 1.7em; line-height: 1.4em; margin: .4em 0 1em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left bottom; }
.lt-ie9 .top-tasks-wrapper {width: 25%; position: absolute; right: 3em; top: 1em; padding-left:40px; }
.lt-ie9 .top-task { margin-bottom: 1em; text-align: center; }
.lt-ie9 .top-task .doc-icon,
.lt-ie9 .top-task .tick-icon,
.lt-ie9 .top-task .tools-icon  { background-position: center top; background-size: auto; }
.lt-ie9 .top-task a { padding:110px 1em 1em 1em; min-height: 50px !important; }
.lt-ie9 .top-task h3 { margin: 0 0 .2em 0; padding: .5em 0 0 0; }
.lt-ie9 .top-task p { margin: 0; padding: 0; }
.lt-ie9 .landing-content ul a { display: inline; }
.lt-ie9 .landing-content h2 a { background: none; padding: 0; color: #0070C6; display: inline; }
.lt-ie9 .landing-content h2 a:hover { background: none; }
.lt-ie9 .landing-content h2 a:before { content: none; display: none; }
.lt-ie9 .landing-news { padding-top: 3em; background-repeat: repeat-x; background-position: left top; }
.lt-ie9 .landing-news h2 { background: none; padding: 0; }
.lt-ie9 .landing-news h2:after { content: none; display: none; }
.lt-ie9 .landing-news .column-3 { margin-bottom: 0; }

/* PS remove?
.lt-ie9 .homepage .site-logos {position:relative;top:1em;}
.lt-ie9 .home-description {margin:1em 0 1.6em 0;padding: 1.2em 0;width:75%;float:left;}
.lt-ie9 .home-description h1{font-size: 1.7em;margin-bottom: 0.4em;}
.lt-ie9 .home-description  p {font-size:1.2em;margin-bottom:1em;}
.lt-ie9 .home-services {width:75%;padding-top:2em;}
.lt-ie9 .home-services ul{-moz-column-count: 2;-moz-column-gap: 0;-webkit-column-count: 2;-webkit-column-gap: 0;column-count: 2;column-gap: 0;}
.lt-ie9 .home-services h2,.lt-ie9 .landing-news h2 {background:none;padding:0 !important;margin-bottom:0;}
.lt-ie9 .home-services h2:after,.lt-ie9 .landing-news h2:after {border: none;}
.lt-ie9 .landing-description {font-size: 1.7em;line-height: 1.4em;margin-bottom:1em;margin-top: 1em;padding-bottom: 1.2em;width:75%;float:left;}
.lt-ie9 .top-tasks-wrapper {width: 25%;padding:0 .5em 0 2em;margin-top:2em;float:right;}
.lt-ie9 .top-task .doc-icon,.lt-ie9 .top-task .tick-icon,.lt-ie9 .top-task .tools-icon  {background-size:auto !important;background-position: center top !important;}
.lt-ie9 .top-task {padding: 1.2em;margin-bottom:1em;text-align:center;}
.lt-ie9 .top-task h3{margin: 0.4em 0 0 0;}
.lt-ie9 .top-task a{padding-top:100px;}
.lt-ie9 .top-task p{margin: 0.4em 0 .8em;}
.lt-ie9 .landing-content ul a {display: inline;}
.lt-ie9 .landing-content h2 a{background:inherit;padding:inherit;color:#0070c6;display:inline;}
.lt-ie9 .landing-content h2 a:hover{background:inherit;}
.lt-ie9 .landing-content h2 a:before {content:none;}
.lt-ie9 .landing-news .news-image {display: inline-block;}
.lt-ie9 .landing-news .column-3 {background: none;}
.lt-ie9 .landing-description {background-repeat:repeat-x;background-position:left bottom;}
*/

/* TODO theme, landing, and homepage styles in different section */
/* PS remove .lt-ie9 .themelanding main > article,.lt-ie9 .homepage main > article { display: table-cell; vertical-align: top; padding:0 1em 1em 1em;}*/


/* =============================================================================
   12. AUDIENCE PAGES
================================================================================ */

.audience-description { font-size: 1.2em; }
.audience-description p { margin-bottom: .5em; }

.audience-content h2 { margin-bottom: 0.2em; margin-top: 0; }
.audience-content p { margin-top: 0.4em; margin-bottom: 0.4em; }
.audience-content ul { list-style: none; padding: 0; }
.audience-content ul li { padding: 0 0 0.5em 0; }
.audience-content ul a { display: block; }

/* desktop styles */
@media (min-width: 1024px) {
	.audience-description div { font-size: 1.7em; line-height: 1.4em; margin: .4em 0 1em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left bottom -10px; }
	.audience-content ul a { display: inline; }
}

/* IE8 styles */
.lt-ie9 .audience-description div { font-size: 1.7em; line-height: 1.4em; margin: .4em 0 1em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left 72px; }
.lt-ie9 .audience-content ul a { display: inline; }

/* =============================================================================
   13. HOMEPAGE
================================================================================ */

body.homepage { background-position: center top 58px; }

.homepage header { background: #005471; margin-right: -60px; padding-right: 60px; }
	.homepage .utility-links { margin-top: -0.6em; }
		.homepage .utility-links a {color:#fff;}
	
	/* PSRemove
	.homepage header .site-search { background: #007097; max-width: none;padding:1.4em;margin:0 -60px 0 0;width:auto;display:block; }
		.homepage header .site-search form { text-align: center; margin: 0 60px 0 0; }
		.homepage header .search-input { min-width: 70%; max-width: 70%;}
		.homepage header .search-submit  { right: 15% !important; }
	.homepage header .utility-links {position: absolute; right: 1.2em; top: 1.6em; }
	*/
		
.home-description  { margin-top: 2em; }
	.home-description h1 { font-family: museosans-300; font-size: 1.4em; margin-bottom: 0.6em; }
	.home-description p { margin-bottom: 2em; font-size: 1.2em; line-height: 1.5em; }

.home-content { margin-bottom: 0.2em; margin-top: 0; }
	.home-content h2 { margin-bottom: 0.2em; margin-top: 0; }
	.home-content h2 a { background: #EEEEEE; padding: 5px 10px; color: #000000; display: block; }
	.home-content h2 a:hover{ background: #E9E9E9; }
	.home-content h2 a:before { font-family: 'icomoon'; content: "\f105"; float: right; }
	.home-content p { margin-top: 0.4em; margin-bottom: 2em; }

.home-services h2 { position: relative; background: #CCE5E2; padding: 0.2em 0.5em; margin-bottom: 1em; margin-top: 0; color: #000; }
	.home-services h2:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(204, 229 226, 0); border-top-color: #cce5e2; border-width: 12px; margin-left: -12px; }
	.home-services ul { list-style: none; padding: 0; }
	.home-services li { margin-bottom: 1em; padding: 0; }

/* desktop styles */
@media (min-width: 1024px) {

	.homepage header { background-repeat: repeat-x; background-position: left bottom -10px; }
	.homepage header .wrap { padding-top: 1.8em; padding-bottom: 1.4em; }
	.homepage .site-logos { padding-top: 0.6em; }
		.homepage .site-logos .vic-link img { background-color: transparent; }

	.home-description  { margin-top: 0; }
		.home-description div { line-height: 1.4em; margin: .4em 0 2em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left bottom -10px; }
		.home-description h1 { font-size: 1.7em; margin-bottom: 0.4em; }

	.home-content h2 a { background: none; padding: 0; color: #0070C6; display: inline; }
		.home-content h2 a:hover { background: none; }
		.home-content h2 a:before { content: none; display: none; }
		
	.home-services  { margin-bottom: 1em; }
		.home-services div { background-repeat: repeat-x; background-position: left top -10px; padding-top: 3em; margin:1em 0 .4em 0; }
			.home-services  h2 { background: none; padding: 0; }
			.home-services  h2:after { content: none; display: none; }
			.home-services ul {
			-webkit-column-count: 2;
			   -moz-column-count: 2;
					column-count: 2;
			  -webkit-column-gap: 2em;
				 -moz-column-gap: 2em;
					  column-gap: 2em;
			}
}

/* IE8 styles */
.lt-ie9 .homepage header { background-repeat: repeat-x; background-position: left bottom; padding-bottom: 10px; }
.lt-ie9 .homepage header .wrap { padding-top: 1.8em; padding-bottom: 1.4em; }
.lt-ie9 .homepage .site-logos { padding-top: 0.6em; }
.lt-ie9 .homepage .site-logos .vic-link img { background-color: transparent; }
.lt-ie9 .home-description  { margin-top: 0; margin-bottom: 1em; }
.lt-ie9 .home-description div { line-height: 1.4em; margin: .4em 0 1em 0; padding-bottom: .6em; background-repeat: repeat-x; background-position: left bottom; }
.lt-ie9 .home-description h1 { font-size: 1.7em; margin-bottom: 0.4em; }
.lt-ie9 .home-content h2 a { background: none; padding: 0; color: #0070C6; display: inline; }
.lt-ie9 .home-content h2 a:hover { background: none; }
.lt-ie9 .home-content h2 a:before { content: none; display: none; }
.lt-ie9 .home-services  { margin-bottom: 1em; }
.lt-ie9 .home-services div { background-repeat: repeat-x; background-position: left top; padding-top: 3em; margin:1em 0 .4em 0; }
.lt-ie9 .home-services  h2 { background: none; padding: 0; }
.lt-ie9 .home-services  h2:after { content: none; display: none; }
.lt-ie9 .home-services li { width: 48%; display: inline-block; vertical-align: top; }

/* =============================================================================
   14. NEWS PAGES
================================================================================ */
.news-gridlist { margin-top:1em; }
.news-gridlist h2,
.news-gridlist h3 { margin-top: 0; margin-bottom:0.3em; color: #000; }
.news-date { font-size: 0.8em; color: #555555; margin-bottom: .5em; }
.news-list h3 { margin-bottom: 0.3em; }

/* =============================================================================
   15. OTHER
================================================================================ */
.azlist { text-align: center; }
.azlist a { margin-left: 0.8em; }


/* FORMS */

fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
legend { display: block; width: 100%; padding: 0; margin-bottom: 1em; font-size: 1.4em; line-height: inherit; color: #333; border: 0; border-bottom: 1px solid #e5e5e5; }
label { display: inline-block; max-width: 100%; margin-bottom: .2em; font-weight: bold; }
input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
input[type="radio"],
input[type="checkbox"] { line-height: normal; }
input[type="file"] { display: block; }
input[type="file"]:focus,
input[type="radio"]:focus,					
input[type="checkbox"]:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }

.form-control {
  margin-bottom:1em;
  display: block;
  width: 100%;
  height: 2em;
  padding: .2em.6em;
  line-height: 2em;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
}

.form-control::-moz-placeholder { color: #777; opacity: 1; }
.form-control:-ms-input-placeholder { color: #777; }
.form-control::-webkit-input-placeholder { color: #777; }
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control { cursor: not-allowed; background-color: #eee; opacity: 1; }
textarea.form-control { height: auto; }
input[type="search"] { -webkit-appearance: none; }
input[type="radio"][disabled],
input[type="checkbox"][disabled],
fieldset[disabled] input[type="radio"],
fieldset[disabled] input[type="checkbox"] { cursor: not-allowed; }

/*legacy form styles*/
.form_container label { display:block; }
.form_container legend { margin-bottom:.6em; }
.form_container input,.form_container select { margin-bottom:.6em; }
.form_container input,.form_container  select { height:2em; width:60%; border:1px solid #ccc; }
.form_container input[type="checkbox"]{ height:inherit; width:inherit; border:1px solid #ccc; }
.form_container input[type="submit"]{ width:inherit; border:1px solid #999; padding:0 1.6em; background:#ddd; }
.form_container input[type="submit"]:hover,.form_container input[type="submit"]:focus{background:#bbb; }
.form_container #modecheckbox ul { list-style:none;margin:.6em 0 0 0;padding:0; }
.form_container #modecheckbox ul  li{ margin:0;padding:0 0 .4em 0; }
.form_container #modecheckbox label{ display:inline-block; }
.form_container .button-row {margin-top:1em;}
.form_container fieldset { margin-top:1em; }
.form_container fieldset:first-of-type { margin-top:0; }
.form_container .required {color: #b80000;font-size: 90%;}


/*possible new grid styles */
.grid{list-style:none;margin-left:-20px}

  .grid > .grid__col--2-of-2, .grid > .grid__col--3-of-3, .grid > .grid__col--4-of-4, .grid > .grid__col--5-of-5, .grid > .grid__col--6-of-6, .grid > .grid__col--8-of-8, .grid > .grid__col--12-of-12 {
    width: 100%; }
  .grid > .grid__col--1-of-2, .grid > .grid__col--2-of-4, .grid > .grid__col--3-of-6, .grid > .grid__col--4-of-8, .grid > .grid__col--6-of-12 {
    width: 50%; }
  .grid > .grid__col--1-of-3, .grid > .grid__col--2-of-6, .grid > .grid__col--4-of-12 {
    width: 33.33333%; }
  .grid > .grid__col--2-of-3, .grid > .grid__col--4-of-6, .grid > .grid__col--8-of-12 {
    width: 66.66667%; }
  .grid > .grid__col--1-of-4, .grid > .grid__col--2-of-8, .grid > .grid__col--3-of-12 {
    width: 25%; }
  .grid > .grid__col--3-of-4, .grid > .grid__col--6-of-8, .grid > .grid__col--9-of-12 {
    width: 75%; }
  .grid > .grid__col--push-2-of-2, .grid > .grid__col--push-3-of-3, .grid > .grid__col--push-4-of-4, .grid > .grid__col--push-5-of-5, .grid > .grid__col--push-6-of-6, .grid > .grid__col--push-8-of-8, .grid > .grid__col--push-12-of-12 {
    margin-left: 100%; }
  .grid > .grid__col--push-1-of-2, .grid > .grid__col--push-2-of-4, .grid > .grid__col--push-3-of-6, .grid > .grid__col--push-4-of-8, .grid > .grid__col--push-6-of-12 {
    margin-left: 50%; }
  .grid > .grid__col--push-1-of-3, .grid > .grid__col--push-2-of-6, .grid > .grid__col--push-4-of-12 {
    margin-left: 33.33333%; }
  .grid > .grid__col--push-2-of-3, .grid > .grid__col--push-4-of-6, .grid > .grid__col--push-8-of-12 {
    margin-left: 66.66667%; }
  .grid > .grid__col--push-1-of-4, .grid > .grid__col--push-2-of-8, .grid > .grid__col--push-3-of-12 {
    margin-left: 25%; }
  .grid > .grid__col--push-3-of-4, .grid > .grid__col--push-6-of-8, .grid > .grid__col--push-9-of-12 {
    margin-left: 75%; }
  .grid > .grid__col--pull-2-of-2, .grid > .grid__col--pull-3-of-3, .grid > .grid__col--pull-4-of-4, .grid > .grid__col--pull-5-of-5, .grid > .grid__col--pull-6-of-6, .grid > .grid__col--pull-8-of-8, .grid > .grid__col--pull-12-of-12 {
    margin-left: -100%; }
  .grid > .grid__col--pull-1-of-2, .grid > .grid__col--pull-2-of-4, .grid > .grid__col--pull-3-of-6, .grid > .grid__col--pull-4-of-8, .grid > .grid__col--pull-6-of-12 {
    margin-left: -50%; }
  .grid > .grid__col--pull-1-of-3, .grid > .grid__col--pull-2-of-6, .grid > .grid__col--pull-4-of-12 {
    margin-left: -33.33333%; }
  .grid > .grid__col--pull-2-of-3, .grid > .grid__col--pull-4-of-6, .grid > .grid__col--pull-8-of-12 {
    margin-left: -66.66667%; }
  .grid > .grid__col--pull-1-of-4, .grid > .grid__col--pull-2-of-8, .grid > .grid__col--pull-3-of-12 {
    margin-left: -25%; }
  .grid > .grid__col--pull-3-of-4, .grid > .grid__col--pull-6-of-8, .grid > .grid__col--pull-9-of-12 {
    margin-left: -75%; }
  .grid > .grid__col--1-of-5 {
    width: 20%; }
  .grid > .grid__col--push-1-of-5 {
    margin-left: 20%; }
  .grid > .grid__col--pull-1-of-5 {
    margin-left: -20%; }
  .grid > .grid__col--2-of-5 {
    width: 40%; }
  .grid > .grid__col--push-2-of-5 {
    margin-left: 40%; }
  .grid > .grid__col--pull-2-of-5 {
    margin-left: -40%; }
  .grid > .grid__col--3-of-5 {
    width: 60%; }
  .grid > .grid__col--push-3-of-5 {
    margin-left: 60%; }
  .grid > .grid__col--pull-3-of-5 {
    margin-left: -60%; }
  .grid > .grid__col--4-of-5 {
    width: 80%; }
  .grid > .grid__col--push-4-of-5 {
    margin-left: 80%; }
  .grid > .grid__col--pull-4-of-5 {
    margin-left: -80%; }
  .grid > .grid__col--1-of-6 {
    width: 16.66667%; }
  .grid > .grid__col--push-1-of-6 {
    margin-left: 16.66667%; }
  .grid > .grid__col--pull-1-of-6 {
    margin-left: -16.66667%; }
  .grid > .grid__col--5-of-6 {
    width: 83.33333%; }
  .grid > .grid__col--push-5-of-6 {
    margin-left: 83.33333%; }
  .grid > .grid__col--pull-5-of-6 {
    margin-left: -83.33333%; }
  .grid > .grid__col--1-of-8 {
    width: 12.5%; }
  .grid > .grid__col--push-1-of-8 {
    margin-left: 12.5%; }
  .grid > .grid__col--pull-1-of-8 {
    margin-left: -12.5%; }
  .grid > .grid__col--3-of-8 {
    width: 37.5%; }
  .grid > .grid__col--push-3-of-8 {
    margin-left: 37.5%; }
  .grid > .grid__col--pull-3-of-8 {
    margin-left: -37.5%; }
  .grid > .grid__col--5-of-8 {
    width: 62.5%; }
  .grid > .grid__col--push-5-of-8 {
    margin-left: 62.5%; }
  .grid > .grid__col--pull-5-of-8 {
    margin-left: -62.5%; }
  .grid > .grid__col--7-of-8 {
    width: 87.5%; }
  .grid > .grid__col--push-7-of-8 {
    margin-left: 87.5%; }
  .grid > .grid__col--pull-7-of-8 {
    margin-left: -87.5%; }
  .grid > .grid__col--1-of-12 {
    width: 8.33333%; }
  .grid > .grid__col--push-1-of-12 {
    margin-left: 8.33333%; }
  .grid > .grid__col--pull-1-of-12 {
    margin-left: -8.33333%; }
  .grid > .grid__col--2-of-12 {
    width: 16.66667%; }
  .grid > .grid__col--push-2-of-12 {
    margin-left: 16.66667%; }
  .grid > .grid__col--pull-2-of-12 {
    margin-left: -16.66667%; }
  .grid > .grid__col--5-of-12 {
    width: 41.66667%; }
  .grid > .grid__col--push-5-of-12 {
    margin-left: 41.66667%; }
  .grid > .grid__col--pull-5-of-12 {
    margin-left: -41.66667%; }
  .grid > .grid__col--7-of-12 {
    width: 58.33333%; }
  .grid > .grid__col--push-7-of-12 {
    margin-left: 58.33333%; }
  .grid > .grid__col--pull-7-of-12 {
    margin-left: -58.33333%; }
  .grid > .grid__col--10-of-12 {
    width: 83.33333%; }
  .grid > .grid__col--push-10-of-12 {
    margin-left: 83.33333%; }
  .grid > .grid__col--pull-10-of-12 {
    margin-left: -83.33333%; }
  .grid > .grid__col--11-of-12 {
    width: 91.66667%; }
  .grid > .grid__col--push-11-of-12 {
    margin-left: 91.66667%; }
  .grid > .grid__col--pull-11-of-12 {
    margin-left: -91.66667%; }

.grid .grid__col{
display:inline-block;
margin-right:-.25em;
min-height:1px;
padding-left:20px;
vertical-align:top}

.grid .grid__col--centered{display:block;margin-left:auto;margin-right:auto}
.grid .grid__col--d-first{float:left}
.grid .grid__col--d-last{float:right}
.grid.grid--no-gutter{margin-left:0;width:100%}
.grid.grid--no-gutter>*{padding-left:0}
.grid.grid--no-gutter .grid__col--span-all{margin-left:0;width:100%}

.grid .grid__col--ab{vertical-align:bottom}
.grid .grid__col--am{vertical-align:middle}

.grid .push-whole {margin-right:1px;}

/* mobile styles */
@media (max-width: 1023px) {
.grid {margin-left:0;}
.grid [class^="grid__col"]
  {
		display: block; margin-left: 0; margin-right: 0; padding-left: 0 !important;padding-right: 0 !important; width: auto;
	}
}