/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
* Last  :   21st May 2018 10:50 - Dion Patelis
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

/* Font faces added separately by Dion 25th July 2016
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@font-face {
    font-family: GillSans-Light;
    src: url(GillSans-Light.ttf);
}

@font-face {
    font-family: GillSans;
    src: url(GillSans.ttf);
}

@font-face {
    font-family: GillSans;
    src: url(GillSans-SemiBold.ttf);
    font-weight: bold;
}

/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
img { max-width: 100%;

    height: auto;
}  /* Added by DP - Test image bleeding over browser size */

img.bust { max-width: 150px;
    height: auto;
}  /* Added by DP - Test image bleeding over browser size */

iframe { max-width: 100%;
    height: auto;
}  /* Added by DP - Trying to dynamically resize videos. */

.intrinsic-container {
    position: relative;
    height: 0;
    overflow: hidden;
}

/* 16x9 Aspect Ratio */
.intrinsic-container-16x9 {
    padding-bottom: 56.25%;
}

/* 4x3 Aspect Ratio */
.intrinsic-container-4x3 {
    padding-bottom: 75%;
}

.intrinsic-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

.container {
    position: relative;
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box; }
.container_02 {
    position: absolute;
    right: 30px;
    width: 300px;
    max-width: 960px;
    box-sizing: border-box; }
.column,
.columns {
    width: 100%;
    float: left;
    box-sizing: border-box; }



/* For devices larger than 400px */
@media (min-width: 400px) {
    .container {
        width: 85%;
        padding: 0; }
    .hide_over_400 {
        display: none !important;
        /*visibility: hidden !important; */ }
    .image_over_400 {
        width: 128px;
        height: 128px; }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
    .container {
        width: 80%; }
    .column,
    .columns {
        margin-left: 4%; }
    .column:first-child,
    .columns:first-child {
        margin-left: 0; }

    .one.column,
    .one.columns                    { width: 4.66666666667%; }
    .two.columns                    { width: 13.3333333333%; }
    .three.columns                  { width: 22%;            }
    .four.columns                   { width: 30.6666666667%; }
    .five.columns                   { width: 39.3333333333%; }
    .six.columns                    { width: 48%;            }
    .seven.columns                  { width: 56.6666666667%; }
    .eight.columns                  { width: 65.3333333333%; }
    .nine.columns                   { width: 74.0%;          }
    .ten.columns                    { width: 82.6666666667%; }
    .eleven.columns                 { width: 91.3333333333%; }
    .twelve.columns                 { width: 100%; margin-left: 0; }

    .one-third.column               { width: 30.6666666667%; }
    .two-thirds.column              { width: 65.3333333333%; }

    .one-half.column                { width: 48%; }

    /* Offsets */
    .offset-by-one.column,
    .offset-by-one.columns          { margin-left: 8.66666666667%; }
    .offset-by-two.column,
    .offset-by-two.columns          { margin-left: 17.3333333333%; }
    .offset-by-three.column,
    .offset-by-three.columns        { margin-left: 26%;            }
    .offset-by-four.column,
    .offset-by-four.columns         { margin-left: 34.6666666667%; }
    .offset-by-five.column,
    .offset-by-five.columns         { margin-left: 43.3333333333%; }
    .offset-by-six.column,
    .offset-by-six.columns          { margin-left: 52%;            }
    .offset-by-seven.column,
    .offset-by-seven.columns        { margin-left: 60.6666666667%; }
    .offset-by-eight.column,
    .offset-by-eight.columns        { margin-left: 69.3333333333%; }
    .offset-by-nine.column,
    .offset-by-nine.columns         { margin-left: 78.0%;          }
    .offset-by-ten.column,
    .offset-by-ten.columns          { margin-left: 86.6666666667%; }
    .offset-by-eleven.column,
    .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

    .offset-by-one-third.column,
    .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
    .offset-by-two-thirds.column,
    .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

    .offset-by-one-half.column,
    .offset-by-one-half.columns     { margin-left: 52%; }
}

/* For devices larger than 768px 
The other file that goes with this is the /config/script.js which governs
when the touch screen menu comes in. */

@media (min-width: 1025px) {
    .hide_over_768 {
        display: none !important;
        /*visibility: hidden !important; */ }
}

@media (max-width: 1025px) {
    .hide_under_768 {
        display: none !important;
        /*visibility: hidden !important; */ }
}

@media (max-width: 200px) {
    .hide_under_400 {
        display: none !important;
        /*visibility: hidden !important; */ }
    .show_under_400 {
        display: inline !important; }
    .invisible {
        visibility: hidden; }
    .image_under_400 {
        max-width: 220px;
        height: auto; }
}

/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
div     {
    border-radius: 4px;
    padding: 0px;
}

div.left        {
    text-align: left;
    word-wrap: break-word;
    width: 80%;
    text-decoration: none;
}

div.center   {text-align: center;}

div.right   {text-align: right;}

div.justify   {text-align: justify;}

div.main_text     {
    word-wrap: break-word;
    width: 80%;
    text-decoration: none;
}

/*Removed the following as it was overriding all link text everywhere else.
DP 21st May 2018 10:42 */
/*
div.main_text a:link {color: #888a85; text-decoration: none;}
div.main_text a:visited {color: #888a85; text-decoration: none;}
div.main_text a:hover {color: #2e3436; text-decoration: none;}
div.main_text a:active {color: #ad7fa8; text-decoration: none;}
*/

div.contact_form_text     {
    word-wrap: break-word;
    width: 100%;
    text-decoration: none;
}

div.border     {
    border: 1px solid #babdb6;
}

div.no_border     {
    border: transparent;
}

div.shadow  {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}




/*
span.linkB {text-decoration: none; font-weight: bold; color: #E0F5FC;  font-size: 13px;}
span.titles {text-decoration: none; font-weight: bold; color: #FFFFFF;  font-size: 17px;} */

FONT.header_01 {
    font-weight: bold;
    color: #330000;
}
FONT.generalFontOnWhite {
    color: #330000;
}
FONT.generalFontOndark {
    color: #ffffff;
}

/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
    font-size: 62.5%; }    /* Was 62.5% */
body {
    font-size: 1.8em; /* DP - Was 1.5 */ /* currently ems cause chrome bug misinterpreting rems on body element */
    line-height: 1.4;  /*Was 1.6 */
    font-weight: 400;
    /* font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; /* Old DP 201670116 */
    /* font-family: "Helvetica", Helvetica, Arial, sans-serif; /* Old DP 20160725 */
    font-family: GillSans;
    text-decoration: none;
    letter-spacing: 1.2px;
    color: #555753; }

.general_font_on_dark
{
    color: #ffffff;
}

.general_font_on_light
{
    color: #555753;
}

.headerA {
    font-size: 13px;
}
.mainFontA {
    font-size: 12px;
}
.mainFontSubHeaderA {
    font-weight: bold;
    font-size: 12px;
}
.mainFontLogoutBoxA {
    font-size: 11px;
}
.generalFontOnWhite {
    color: #330000;
}
.error_codes{
    font-weight: bold;
    font-size: 12px;
    color: #ff0000;
}
.edit_fail{
    font-weight: bold;
    font-size: 12px;
    color: #ff0000;
}
.edit_success_solid{
    font-weight: bold;
    font-size: 12px;
    color: #4e9a06;
}
.edit_success {
    font-weight: bold;

    font-size: 12px;
    color: #009933;
    -webkit-animation: fadi 2s 1;
    -moz-animation: fadi 2s 1;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
}
@-webkit-keyframes fadi {
    1%   { opacity: 1; }
    100% { opacity: 0; }
}
@-moz-keyframes fadi {
    1%   { opacity: 1; }
    100% { opacity: 0; }
}

.small_grey {
    color: #888a85;
    font-size: 0.8em;  letter-spacing: 0;
}
.mini_grey {
    color: #888a85;
    font-size: 1.0rem; line-height: 1.0;  letter-spacing: 0;

} /* See Links section as well - DP 26/1/16 */

/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 2rem;
    font-weight: 300; }
h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: 0.1rem; }
h5 { font-size: 2.0rem; line-height: 1.5;  letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {
    h1 { font-size: 5.0rem; }
    h2 { font-size: 4.2rem; }
    h3 { font-size: 3.6rem; }
    h4 { font-size: 3.0rem; letter-spacing: 0.1rem;}
    h5 { font-size: 2.4rem; }
    h6 { font-size: 1.5rem; }

    div { font-size: 2.0rem; }
}

p {
    margin-top: 0; }


/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a         {text-decoration: none;}

a:link    {color: #888a85;}
a:visited {color: #888a85;}
a:hover   {color: #2e3436;}
a:active  {color: #ad7fa8;}

a.current_page:link    {color: #729fcf;}
a.current_page:visited {color: #729fcf;}
a.current_page:hover   {color: #729fcf;}
a.current_page:active  {color: #729fcf;}

a.on_dark_blue:link {
    color: #ffffff; }
a.on_dark_blue:visited {
    color: #ad7fa8; }
a.on_dark_blue:hover {
    color: #0fa0ce; }

a.grey:link {
    color: #888a85; }
a.grey:visited {
    color: #888a85; }
a.grey:hover {
    color: #000000; }

a.blue {
    color: #3465a4;
    text-decoration:underline; }
a.blue:link {
    color: #0d6eff;
    text-decoration:underline;}
a.blue:visited {
    color: #75507b;
    text-decoration:underline;}
a.blue:hover {
    color: #729fcf;
    text-decoration:underline;}

a.mini_grey {
    color: #888a85;
    font-size: 1.0rem;
    line-height: 1.0;
    letter-spacing: 0; }
a.mini_grey:link {
    color: #888a85;
    font-size: 1.0rem;
    line-height: 1.0;
    letter-spacing: 0; }
a.mini_grey:visited {
    color: #888a85;
    font-size: 1.0rem;
    line-height: 1.0;
    letter-spacing: 0; }
a.mini_grey:hover {
    color: #000000;
    font-size: 1.0rem;
    line-height: 1.0;
    letter-spacing: 0; }

a img { border-width: 0px; }

a:link.topIndexLine001 {text-decoration: none; font-weight: bold; color: #FFFFFF;  font-size: 13px;}
a:visited.topIndexLine001 {text-decoration: none; font-weight: bold; color: #FFFFFF;  font-size: 13px;}
a:active.topIndexLine001 {text-decoration: none; font-weight: bold; color: #FFFFFF;  font-size: 13px;}
a:hover.topIndexLine001 {text-decoration: none; font-weight: bold; color: #FFFF00;  font-size: 13px;}

a:link.linkB {text-decoration: none; font-weight: bold; color: #E0F5FC;  font-size: 13px;}
a:visited.linkB {text-decoration: none; font-weight: bold; color: #E0F5FC;  font-size: 13px;}
a:active.linkB {text-decoration: none; font-weight: bold; color: #66FF00;  font-size: 13px;}
a:hover.linkB {text-decoration: none; font-weight: bold; color: #FFFF00;  font-size: 13px;}

a:link.linkC {text-decoration: none; font-weight: bold; color: #330000;  font-size: 13px;}
a:visited.linkC {text-decoration: none; font-weight: bold; color: #330000;  font-size: 13px;}
a:active.linkC {text-decoration: none; font-weight: bold; color: #330000;  font-size: 13px;}
a:hover.linkC {text-decoration: none; font-weight: bold; color: #676538;  font-size: 13px;}

a:link.linkD {text-decoration: none; font-weight: bold; color: #808080;  font-size: 9px;}
a:visited.linkD {text-decoration: font-weight: bold; color: #808080;  font-size: 9px;}
a:active.linkD {text-decoration: font-weight: bold; color: #808080;  font-size: 9px;}
a:hover.linkD {text-decoration: font-weight: bold; color: #616161;  font-size: 9px;}

a:link.linkPlainInWhiteAreas {text-decoration: none; font-weight: bold; color: #3300FF;  font-size: 11px;}
a:visited.linkPlainInWhiteAreas  {text-decoration: none; font-weight: bold; color: #3300FF;  font-size: 11px;}
a:active.linkPlainInWhiteAreas  {text-decoration: none; font-weight: bold; color: #f57900;  font-size: 11px;}
a:hover.linkPlainInWhiteAreas  {text-decoration: none; font-weight: bold; color: #f57900;  font-size: 11px;}

a:link.link_imp_urg {text-decoration: none; font-weight: bold; color: #B5C8ED;  font-size: 11px;}
a:visited.link_imp_urg {text-decoration: none; font-weight: bold; color: #B5C8ED;  font-size: 11px;}
a:active.link_imp_urg  {text-decoration: none; font-weight: bold; color: #B5C8ED;  font-size: 11px;}
a:hover.link_imp_urg  {text-decoration: none; font-weight: bold; color: #B5C8ED;  font-size: 11px;}

.contact_button {
    padding: 8px 15px 11px 15px;        /* This defines the placement in the top menu bar -
                                        The order is:
                                        Top right bottom left 8 11*/
    font-family: GillSans-Light;
    font-size: 1.5rem;
    /* position: fixed; */
    list-style: none;
    *zoom: 1;
    /* background:#204a87; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,1b2960+100 */
    background: rgb(44,83,158); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(44,83,158,1) 0%, rgba(27,41,96,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#1b2960',GradientType=0 ); /* IE6-9 */
    border: 1px solid #204a87;
    border-radius: 5px;
}
.contact_button a:link, a:visited, a:active {
    color: #ffffff;
}
.contact_button a:hover {
    color: #0fa0ce;
}


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
    display: inline-block;
    height: 38px;
    padding: 0px 30px;
    color: #555;
    text-align: center;
    font-size: 13px;  /* Was 11px */
    font-weight: 600;
    line-height: none; /* Was 38px - DP 20150220 1615AEST */
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid #bbb;
    cursor: pointer;
    box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
    color: #333;
    border-color: #888;
    outline: 0; }

.download_button {
    color: white;
    padding: 8px 15px 11px 15px;        /* The order is: Top right bottom left */
    font-family: GillSans-Light;
    font-size: 1.5rem;
    /* position: fixed; */
    list-style: none;
    *zoom: 1;
    /* background:#204a87; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,1b2960+100 */
    background: rgb(44,83,158); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(44,83,158,1) 0%, rgba(27,41,96,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#1b2960',GradientType=0 ); /* IE6-9 */
    border: 1px solid #204a87;
    border-radius: 5px;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
;
}
.download_button a:link, a:visited, a:active {
    color: white;
}
.download_button a:hover {
    color: white;
}


.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
    color: #FFF;
    background-color: #33C3F0;
    border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
    color: #FFF;
    background-color: #1EAEDB;
    border-color: #1EAEDB; }

.button.top,
button.top,
input[type="submit"].top,
input[type="reset"].top,
input[type="button"].top {
    color: #FFF;
    background-color: transparent;
    border-color: transparent;
    height: 38px;
    padding: 0px 10px;
    text-transform: none;
    font-size: 1.3em; /* DP - Was 1.5 */ /* currently ems cause chrome bug misinterpreting rems on body element */
    line-height: 0.8;  /*Was 1.6 */
    font-weight: 400;}
.button.top:hover,
button.top:hover,
input[type="submit"].top:hover,
input[type="reset"].top:hover,
input[type="button"].top:hover,
.button.top:focus,
button.top:focus,
input[type="submit"].top:focus,
input[type="reset"].top:focus,
input[type="button"].top:focus {
    color: #729fcf;
    /*active = #1eaedb*/
    background-color: transparent;
    border-color: transparent; }



input[type="submit"].on_white {
    color: #FFF;
    /* background:#204a87; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,1b2960+100 */
    background: rgb(44,83,158); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(44,83,158,1) 0%, rgba(27,41,96,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#1b2960',GradientType=0 ); /* IE6-9 */
    border: 1px solid #204a87;
    border-radius: 5px;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    height: 38px;
    padding: 0px 10px;
}
input[type="submit"].on_white:hover,
input[type="submit"].on_white:focus {
    color: #729fcf;
}
    /*active = #1eaedb*/
/*
button.top_buttons,
input[type="submit"].top_buttons {
  /* background-image: url("back_test5_tiger.jpg"); */
/*
  color: #eeeeec;
  background-color: #3465a4;  }
  
button.top_buttons:hover,
input[type="submit"].top_buttons:hover {
  color: #d3d7cf;
  background-color: #204a87;  }

.action_buttons
button.action_buttons,
input[type="submit"].action_buttons {
  color: #2e3436;
  background-color: transparent; 
  height: 38px;
  padding: 0px 10px; }

.action_buttons 
button.action_buttons:hover,
input[type="submit"].action_buttons:hover {
  color: #000000; }
  */

/*
.button2,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 58px;
  width: 44px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
.button2:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button2:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #333;
  border-color: #888;
  outline: 0; } */

/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
form {text-decoration: none; font-weight: normal; color: #330000;  font-size: 11px;}
form.formA {text-decoration: none; font-weight: bold; color: #FFFFFF;  font-size: 9px;}
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
    height: 38px;
    text-align: center;
    padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
    background-color: #fff;
    border: 1px solid #D1D1D1;
    border-radius: 4px;
    box-shadow: none;
    box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }
textarea {
    min-height: 65px;
    padding-top: 6px;
    padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    border: 1px solid #33C3F0;
    outline: 0; }
label,
legend {
    display: block;
    margin-bottom: .5rem;
    font-weight: 600; }
fieldset {
    padding: 0;
    border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
    display: inline; }
label > .label-body {
    display: inline-block;
    margin-left: .5rem;
    font-weight: normal; }

select {text-decoration: none; font-weight: normal; color: #330000;  font-size: 11px;}



input   {text-decoration: none;
     font-weight: normal;
     color: #330000;

     font-size: 11px;
 }

input.inputA    {text-decoration: none;
    font-weight: bold;
    color: #330000;

    font-size: 9px;
}
input.inputB    {text-decoration: none;
    font-weight: bold;
    color: #330000;

    font-size: 9px;
}
input.generalFontOnWhite {
    text-decoration: none;
    font-weight: normal;
    color: #330000;

    font-size: 11px;
}
input.text_button {
    font-size: 11px;
    border: none;
    background-color: transparent;
    padding: 0;
}
button.link_styled_button {
    background:none!important;
    border:none;
    padding: 0!important;
    text-transform: none;
    white-space: pre-wrap;
    /* text-align: left; */

    /*optional*/
    /* font-family:arial,sans-serif; */ /*input has OS specific font-family*/
    color:#069;
    text-decoration:underline;
    cursor:pointer;
}


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*ul {
  list-style: circle inside; }
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; }

*/
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
    padding: .2rem .5rem;
    margin: 0 .2rem;
    font-size: 90%;
    white-space: nowrap;
    background: #F1F1F1;
    border: 1px solid #E1E1E1;
    border-radius: 4px; }
pre > code {
    display: block;
    padding: 1rem 1.5rem;
    white-space: pre; }


/* Box
–––––––––––––––––––––––––––––––––––––––––––––––––– */
box {
    padding: .2rem .5rem;
    margin: 0 .2rem;
    font-size: 90%;
    white-space: pre-line;

    border: 1px solid #babdb6;
    border-radius: 4px; }
pre > box {
    display: block;
    background-image: url("back_test5_tiger.png");
    padding: 1rem 1.5rem;
    white-space: pre-line; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
    padding: 12px 15px;
    text-align: left;
    /* border-bottom: 1px solid #E1E1E1; */ /*  Removed as it was creating thin grey lines under everything in tables */ }
th:first-child,
td:first-child {
    padding-left: 0; }
th:last-child,
td:last-child {
    padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
    margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
    margin-bottom: 0.5rem; }  /*  */
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
    margin-bottom: 0.5rem; } /* 2.5 */


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
    width: 100%;
    box-sizing: border-box; }
.u-max-full-width {
    max-width: 100%;
    box-sizing: border-box; }
.u-pull-right {
    float: right; }
.u-pull-left {
    float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
    margin-top: 3rem;
    margin-bottom: 3.5rem;
    border-width: 0;
    border-top: 1px solid #E1E1E1; }


/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
    content: "";
    display: table;
    clear: both; }


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}


/* Slider banner style 
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */
@keyframes slidy {
    0% { left: 0%; }
    20% { left: 0%; }
    25% { left: -100%; }
    45% { left: -100%; }
    50% { left: -200%; }
    70% { left: -200%; }
    75% { left: -300%; }
    95% { left: -300%; }
    100% { left: -400%; }
}

body { margin: 0; }
div#slider { overflow: hidden; }
div#slider figure img { width: 20%; float: left; }
div#slider figure {
    position: relative;
    width: 500%;
    margin: 0;
    left: 0;
    text-align: left;
    font-size: 0;
    animation: 30s slidy infinite;
}


/* Navigation Menu 
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body, nav, ul, li, a  {margin: 0; padding: 0;}
.container {
    width: 90%;
    max-width: 900px;
    margin: 10px auto;
}
.toggleMenu {
    /* position: fixed; */
    display:  none;
    background: transparent;
    padding: 10px 15px;
    color: #000000;
}
.nav {
    font-family: GillSans-Light;
    /* position: fixed; */
    list-style: none;
    *zoom: 1;
    /* background:#204a87; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,1b2960+100 */
    background: rgb(44,83,158); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(44,83,158,1) 0%, rgba(27,41,96,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(44,83,158,1) 0%,rgba(27,41,96,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#1b2960',GradientType=0 ); /* IE6-9 */
    border-radius: 5px;
    border: 1px solid #204a87;
    text-decoration: none;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
.nav:before,
.nav:after {
    content: " ";
    display: table;
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width: 9em;
}
.nav a {
    padding: 8px 15px 11px 15px;        /* This defines the placement in the top menu bar -
                                        The order is: 
                                        Top right bottom left */
    font-size: 1.5rem;
}
.nav a:link {
    color: #ffffff;
}
.nav a:visited {
    color: #ffffff;
}
.nav a:hover {
    color: #729fcf;
}

.nav li {
    position: relative;
}
.nav > li {
    float: left;
    border-top: 1px solid #204a87;
}
.nav > li > .parent {
    background-image: url("images/downArrow.png");
    background-repeat: no-repeat;
    background-position: right;
}
.nav > li > a {
    display: block;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a {
    display: block;
    /* background: #3465a4; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#305bac+0,213173+100 */
    /* background: rgb(48,91,172); /* Old browsers */
    /* background: -moz-linear-gradient(top,  rgba(48,91,172,1) 0%, rgba(33,49,115,1) 100%); /* FF3.6-15 */
    /* background: -webkit-linear-gradient(top,  rgba(48,91,172,1) 0%,rgba(33,49,115,1) 100%); /* Chrome10-25,Safari5.1-6 */
    /* background: linear-gradient(to bottom,  rgba(48,91,172,1) 0%,rgba(33,49,115,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#305bac', endColorstr='#213173',GradientType=0 );*/ /* IE6-9 */

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4b6da8+0,323f70+100 */
    background: rgb(75,109,168); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(75,109,168,1) 0%, rgba(50,63,112,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(75,109,168,1) 0%,rgba(50,63,112,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(75,109,168,1) 0%,rgba(50,63,112,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b6da8', endColorstr='#323f70',GradientType=0 ); /* IE6-9 */
    position: relative;
    z-index:100;
    border-top: 1px solid #204a87;
    border-radius: 5px;
}

.nav li li li a {
    /* background:#729fcf; */
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3565bd+0,263a88+100 */
    /* background: rgb(53,101,189); /* Old browsers */
    /* background: -moz-linear-gradient(top,  rgba(53,101,189,1) 0%, rgba(38,58,136,1) 100%); /* FF3.6-15 */
    /* background: -webkit-linear-gradient(top,  rgba(53,101,189,1) 0%,rgba(38,58,136,1) 100%); /* Chrome10-25,Safari5.1-6 */
    /* background: linear-gradient(to bottom,  rgba(53,101,189,1) 0%,rgba(38,58,136,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3565bd', endColorstr='#263a88',GradientType=0 ); /* IE6-9 */

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#637ba5+0,414b6d+100 */
    background: rgb(99,123,165); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(99,123,165,1) 0%, rgba(65,75,109,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(99,123,165,1) 0%,rgba(65,75,109,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(99,123,165,1) 0%,rgba(65,75,109,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#637ba5', endColorstr='#414b6d',GradientType=0 ); /* IE6-9 */
    z-index:200;
    border-top: 1px solid #204a87;
    border-radius: 5px;
    padding: 12px 16px 12px 32px; /* Specifies the indent of the text in the submenus */
}

@media screen and (max-width: 1025px) { /* Remember ti mid /config/script.js as well. DP*/
    .active {
        display: block;
    }
    .nav > li {
        float: none;
    }
    .nav li li a {
        padding: 12px 16px 12px 28px; /* Specifies the indent of the text in the submenus */
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }
    .nav li li .parent {
        background-image: url("images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }
    .nav li li li a {
        padding: 12px 16px 12px 20px; /* Specifies the indent of the text in the submenus */
    }
    .nav ul {
        display: block;
        width: 100%;
    }
    .nav > li.hover > ul , .nav li li.hover ul {
        position: static;
    }

}