.head-nav.fm-lg .branding img.logo-mobile {display:none;}

/*------------------------------------------------------------------

[Master Stylesheet]

Project:            Gippsland Water Corporate Website
Version:            1.0
Last change:        09/01/2014
Assigned to:        Richard Massey

------------------------------------------------------------------

[Color codes]

Body background:        #fff (white)
Brand color:            #0077be (GW blue)
Text:                   #777 (gray)
Header h1-h6:           #222 (dark gray)
Top tools background:   #323438 (darker graphite)
Main nav background:    #F8F8F8 (graphite)
Lighter blue text:      #1091dd (use over dark colours)
Footer background 1:    #373a3e (graphite)
Footer background 2:    #323438 (darker graphite)
Footer background 3:    #2c2f33 (dark graphite)


------------------------------------------------------------------

[Table of contents]

1. Global Styles
2. Layouts
    2.1. Header
    2.2. Navigation
    2.3. Search Nav

-----------------------------------------------------------------*/

/* 1. GLOBAL STYLES
-------------------------------------------------------------------*/
html {height:100%;-ms-overflow-style: scrollbar;}
body {font-size: 13px;color:#777;font-family:'Open Sans', sans-serif;background-color:#fff}

h1,
h2,
h3,
h4,
h5,
h6 {font-family:'Open Sans', sans-serif;}
h2 {font-size:1.6153em}
h1,
h2 {margin:0 0 30px 0}
h3 {margin:30px 0 10px 0}
h2,
h3,
h4,
h5,
h6 {line-height:1.74em}
.title{display:block;color:#333;font-size:19px;font-family:'Open Sans', sans-serif;}
.title .title-border{padding-bottom:0px;border-bottom-width:1px;border-bottom-style:solid;margin-bottom:-1px;border-color:#ccc;}
.sorf-pages .title{color:#322c77}
.sorf-pages .title .title-border{border-color:#f69720;}

b,
strong {font-weight:900}
a:hover {text-decoration:none}
a:focus {outline:none;}
.btn-primary {background-color:#0077be;}
main {position:relative;}
.btn_full_outline {margin-top:12px; border: none; font-family: inherit; font-size: inherit; color: #0077be; background: none; border: 2px solid #0077be; cursor: pointer; padding: 0px 7px; display: inline-block; outline: none; font-size: 11px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-transform: uppercase; font-weight: bold; display: block; text-align: center; }
.btn_full_outline:hover { border: 2px solid #333; color: #333; }

#home {max-height:600px;}

.spacer-10 {margin-top: 10px;}
.spacer-20 {margin-top: 20px;}
.spacer-40 {margin-top: 40px;}

/* IE SVG fixes */
.ie9 img[src*=".svg"] {width: 100%;}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {img[src*=".svg"] {width: 100%;}}
/* IE 10 Scroll correction */
body.IE10 {overflow-y: scroll;-ms-overflow-style: scrollbar;}
.header-spacer {height:90px;} 

.ccm-page a {-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s}
.ccm-page a:hover {-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;}
.tooltip {z-index:70 !important;}

    /* 1.1 LOADING STATUS
    -------------------------------------------------------------------*/
    /*Preloading*/
    #preloader { position: fixed; top: 0; left: 0; right: 0; width: 100%; height: 100%; bottom: 0; background-color: #fff; z-index: 800; }
    .sk-spinner-wave.sk-spinner { margin: -50px 0 0 -50px; position: absolute; left: 50%; top: 50%; width: 100px; height: 100px; text-align: center; font-size: 10px; }
    .sk-spinner-wave.sk-spinner img {margin-bottom:12px;}
    .ie8 .sk-spinner-wave.sk-spinner { display: none; }
    .sk-spinner-wave div { background-color: #0077be; height: 20px; width: 6px; display: inline-block; -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out; animation: sk-waveStretchDelay 1.2s infinite ease-in-out; }
    .sk-spinner-wave .sk-rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
    .sk-spinner-wave .sk-rect3 { -webkit-animation-delay: -1s; animation-delay: -1s; }
    .sk-spinner-wave .sk-rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
    .sk-spinner-wave .sk-rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }
     @-webkit-keyframes sk-waveStretchDelay {
     0%, 40%, 100% {-webkit-transform: scaleY(0.4);transform: scaleY(0.4);}
     20% {-webkit-transform: scaleY(1);transform: scaleY(1);}
    }
    @keyframes sk-waveStretchDelay {
     0%, 40%, 100% {-webkit-transform: scaleY(0.4);transform:scaleY(0.4);}
     20% {-webkit-transform: scaleY(1);transform:scaleY(1);}
    }


/* 2. NAVIGATION LAYOUTS
-------------------------------------------------------------------*/

    /* 2.1. HEADER
    ---------------------------------------------------------------*/
    header.customer-select {width:100%;background:#333;position:absolute;z-index:42;top:0;}
    header.customer-select .logo-spacer {width:200px;height:40px;background-color:#0071b5;float:left;}
    nav.row-one ul {list-style:none;margin:0;padding:0;}
    nav.row-one ul li {display:inline;list-style:none;}
    nav.row-one ul li a {color:#777;font-size:12px;line-height:40px;transition: all 0.2s ease;}
    nav.row-one ul li a:hover {background-color:#0071b4;color:#fff;}
    
    nav.primary {margin-left:20px;}
    nav.primary ul li a {color:#DFDFDF;display:block;float:left;padding:0 10px; cursor:pointer}
    nav.primary ul li a i {font-size:10px;padding-right:5px;}
    nav.primary ul li a:hover {background:#0077be;color:#fff;}
    nav.primary ul li a.active {background:#F8F8F8;color:#777;}
    nav.primary ul li a.active i:before {content:"\f078";}
    
    nav.secondary ul {border-left:1px solid #999;padding:0 5px;}
    nav.secondary ul li {padding-left:1px;}
    nav.secondary ul li a {font-size:16px;color:#DFDFDF;padding:2px 3px;white-space:nowrap;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
    nav.secondary ul li a:hover {color:#fff;background-color:#0071b4;}
    
    .language-selector {margin-top:5px;margin-right:5px;}
    .language-selector button.language-selection {background-color:rgb(51, 51, 51) !important;border:none !important;color:rgb(223, 223, 223) !important;font-size:12px !important;}
    .language-selector button.language-selection:hover, .language-selector button.language-selection:focus{background-color:rgba(82,82,82,1.00) !important;border:none !important;color:rgb(223, 223, 223) !important;}
    .language-selector li a {padding:3px 10px !important;}
    .language-selector .dropdown-menu {min-width:50px !important;}
    .language-selector p.arabic {direction:rtl !important;}    

    
    /* 2.2. NAVIGATION
    ---------------------------------------------------------------*/
    .fm-container .content, .fm-container .nav-loading{display:none;}
    .fm-container .nav-loading {margin:47px 0 0 20px;}
    .fm-container {border-bottom:1px solid #999;background:#F8F8F8;width:100%;position:absolute;top:40px;z-index:41;border-right:1px solid #F8F8F8;-webkit-box-shadow:0 5px 5px -5px #999;-moz-box-shadow:0 5px 5px -5px #999;box-shadow:0 5px 5px -5px #999;}
    .fm-container.is_stuck {z-index:799;}
    .fm-button { display: none;box-sizing: border-box;margin: 8px 0px;padding:10px 9px;width: 42px;border-radius: 4px;border:1px solid #ddd;transition: all 0.2s ease;}
    .fm-button:hover { cursor: pointer;background-color:#0077be;border-color:#3773B9;-webkit-box-shadow: inset 0 0 8px rgba(0,0,0,0.1);-moz-box-shadow: inset 0 0 8px rgba(0,0,0,0.1);box-shadow: inset 0 0 8px rgba(0,0,0,0.1) }
    .fm-button .fm-bar { display: block;width: 22px;height: 2px;border-radius: 1px;background-color: #888;transition: all 0.2s ease;}
    .fm-button:hover .fm-bar {background-color: #fff}
    .fm-button .fm-bar+.fm-bar { margin-top: 4px }
    .head-nav:before, .head-nav:after { display: table;content:" " }
    .head-nav:after { clear: both }
    .head-nav a { text-decoration: none }
    .head-nav.fm-toggle.fm-sm { display: none }
    .fm-outer { position: relative;overflow: hidden;height: 100%;width: 100% }
    .fm-inner { position: relative;height: 100%;width: 100%;left: 0 }
    .head-nav.fm-offcanvas.fm-sm { border-right:1px solid #E7E7E7;z-index: 100;overflow-y: auto;overflow-x: hidden;position: fixed;top: 0;left: -300px;width: 300px;height: 100%;background:#F8F8F8 url(img/general-logos/gw-logo-offcanvas-nav.svg) no-repeat;background-size: 248px 180px;background-position: bottom 30px center}
    .head-nav.fm-lg ul li ul {margin: auto;color:#DFDFDF;}
    .head-nav.fm-lg .branding {width:200px;margin-right:20px;background-color:#0077be;float:left;padding:15px;-webkit-box-shadow: inset 0 0 20px rgba(0,0,0,0.1);-moz-box-shadow: inset 0 0 20px rgba(0,0,0,0.1);box-shadow: inset 0 0 20px rgba(0,0,0,0.1)}
    .head-nav.fm-lg .branding img.logo-desktop {display:block;}
    .head-nav.fm-lg .content .navicon {cursor:pointer;}
    .head-nav.fm-lg .content .navicon:after { font-family:FontAwesome;content:"\f078";position: absolute;right:9px;top: 17px;font-size:9px;transition: color 0.3s ease;}
    .head-nav.fm-lg .content .prim-nav li li .navicon:after {top:10px;content:"\f054";font-size:8px;right:20px} 
    .head-nav.fm-lg .content> ul.prim-nav {float:left;margin: 30px 0 0 0;padding: 0;list-style: none}
    .head-nav.fm-lg .content> ul.prim-nav > li { float: left }
    .head-nav.fm-lg .content .prim-nav li { position: relative;white-space: nowrap;list-style: none}
    .head-nav.fm-lg .content .prim-nav li ul { position: absolute;left: 0;top: 100%;z-index: 98;margin:-5px 0 0 0;padding: 0;border-radius:5px;}
    .head-nav.fm-lg .content .prim-nav li ul ul { top: -2px;left:100%;z-index: 99;white-space:nowrap;border-bottom-left-radius:0px;border-top-left-radius:0px;border-top-right-radius:5px;margin-left:-10px;}
    .head-nav.fm-lg .content .prim-nav a { display: block;padding: 7px 15px;color: #777;transition: color 0.3s ease;font-weight:bold;}
    .head-nav.fm-lg .content .prim-nav a:hover, .head-nav.fm-lg .prim-nav .with-ul:hover > .navicon:after, .head-nav.fm-lg .prim-nav li:hover > a { color:#0077be;text-decoration: none }
    .head-nav.fm-lg .content .prim-nav li ul {border-bottom-left-radius:5px;border-bottom-right-radius:5px;background:#2c2f33;border:2px solid #ccc;padding-top:5px;padding-bottom:5px;}
    .head-nav.fm-lg .content .prim-nav li ul:before {background:#2c2f33;border-left:2px solid #ccc;border-top:2px solid #ccc;content:"";display:block;height:10px;position:absolute;left:30px;top:-7px;width:10px;-ms-transform:rotate(45deg);/* IE 9 */ -webkit-transform:rotate(45deg);/* Chrome, Safari, Opera */ transform:rotate(45deg)}
    .head-nav.fm-lg .content .prim-nav li ul ul:before {display:none;}
    .head-nav.fm-lg .content .prim-nav li ul li { padding: 0;width:auto;white-space:nowrap }
    .head-nav.fm-lg .content .prim-nav li ul a { font-weight:normal;color:#DFDFDF;font-size:12px;padding-left:20px;padding-right:20px;}
    .head-nav.fm-lg .content > ul.prim-nav > li { padding: 7px 0 }/*TOP LEVEL LINKS*/
    .head-nav.fm-lg .content > ul.prim-nav > li.with-ul >a {padding-right:22px;}/*TOP LEVEL LINKS*/
    .head-nav.fm-lg .content > ul.prim-nav > li > ul > li.with-ul > a {padding-right:32px;}/*SECOND LEVEL LINKS*/
    .head-nav.fm-lg .content > ul.prim-nav > li > ul > li > ul > li.with-ul > a {padding-right:32px;}/*THIRD LEVEL LINKS*/
    .head-nav.fm-lg .content > ul.prim-nav > li > ul > li a:hover {color:#66A3C2;}
    .head-nav.fm-lg .content .prim-nav li.active-item > a.active-item {color:#0077be;/*background:#EFEFEF;border-radius:4px;*/}
    .head-nav.fm-lg .content .prim-nav li.active-item > .navicon {color:#0077be;}
    .head-nav.fm-lg .content .prim-nav li > a.active-item {background:none;border-radius:0px;}
    .head-nav.fm-sm .content ul { margin: 0;padding: 0;list-style: none }
    .head-nav.fm-lg .content .prim-nav li.active-item li a.active-item {background:none;color:#66A3C2;}
    .head-nav.fm-sm .branding {display:block;line-height:52px;font-size:18px;color:#777;padding:0 10px;text-align:center;border-bottom:1px solid #E7E7E7}
    .head-nav.fm-sm .branding img {max-height:36px;width:auto;}
    .head-nav.fm-sm .branding img.logo-desktop {display:none;}
    .head-nav.fm-sm .branding img.logo-mobile {display:inline;}
    img.logo-header-mobile {float:right;height:36px;width:auto;margin-top:8px}
    .head-nav.fm-sm ul li { position: relative }
    .head-nav.fm-sm ul li {border-bottom: 1px solid #E7E7E7 }
    .head-nav.fm-sm ul li a { background-color: #F8F8F8;display: block;padding: 7px 10px 6px 10px;font-size: 14px;font-weight:bold;color: #777;transition: all 0.2s ease; }
    .head-nav.fm-sm ul li a:hover,
    .head-nav.fm-sm ul li.active>a { background-color: #0077be;color:#fff;text-decoration: none;}
    .head-nav.fm-sm ul ul li.active>a { background-color: #b4b4b4;color:#fff;text-decoration: none;font-weight:bold;border-bottom:1px solid #B4B4B4;}
    .head-nav.fm-sm ul ul li {border-bottom: 1px solid #d9d9d9 }
    .head-nav.fm-sm ul ul li a { background-color: #ededed;padding-left:20px;font-weight:normal;font-size:12px;}
    .head-nav.fm-sm ul ul li a:hover { background-color:#aeaeae}
    .head-nav.fm-sm ul ul li ul li {border-bottom: 1px solid #cecece }
    .head-nav.fm-sm ul ul li ul li a { background-color: #ddd;padding-left:30px;}
    .head-nav.fm-sm ul ul li ul li a:hover { background-color: #aeaeae }
    .head-nav.fm-sm ul ul li ul li ul li a { background-color: #F8F8F8;padding-left:40px;}
    .head-nav.fm-sm ul ul li ul li ul li a:hover { background-color: #aeaeae }
    .head-nav.fm-sm .navicon {transition: all 0.2s ease;background-color:#F8F8F8;position:absolute;top:0;right:0;height:33px;width:33px;cursor:pointer;border-left:1px solid #E7E7E7;color:#777;-webkit-box-shadow: inset 0 0 8px rgba(0,0,0,0.1);-moz-box-shadow: inset 0 0 8px rgba(0,0,0,0.1);box-shadow: inset 0 0 8px rgba(0,0,0,0.1)}
    .head-nav.fm-sm ul ul .navicon {background-color:#ededed;border-left:1px solid #d9d9d9;height:31px;width:33px;}
    .head-nav.fm-sm .navicon:hover {background-color:#0077be;border-color:#0077be;color:#fff;}
    .head-nav.fm-sm .navicon:before { position:absolute;font-family:FontAwesome;top:50%;right:50%;font-size:12px;content:"\f067";margin:-8px -5px 0 0;}
    .head-nav.fm-sm .navicon-active, .fm-button.navicon-active { background-color: #0077be;color:#fff;border-left:1px solid #E7E7E7;}
    .head-nav.fm-sm ul ul .navicon-active  { background-color: #ababab;color:#fff;border-left:1px solid #E7E7E7;}
    .fm-button.navicon-active .fm-bar {background-color:#fff;}
    .head-nav.fm-sm .navicon-active:hover {background-color:#005d94;border-left:1px solid #E7E7E7;}
    .head-nav.fm-sm .navicon-active:before {content:"\f068";}
    .head-nav.fm-sm .btn-group {display:none;}
    
    /** Slideout search bar **/
    .customers-box {background-color:transparent !important;box-shadow:none!important;}
    header.customer-select .search { float: right; display: inline-block; }
    header.customer-select .input-group { -moz-transition: 0.8s; -o-transition: 0.8s; -webkit-transition: 0.8s; transition: 0.8s; margin-bottom: 0; width: 40px; overflow: hidden; margin-left:5px; }
    header.customer-select .search .input-group:hover { width: 240px; }
    header.customer-select .search .input-group:hover input { right: 0; }
    header.customer-select .search .input-group input { -moz-transition: 0.8s; -o-transition: 0.8s; -webkit-transition: 0.8s; transition: 0.8s; border: none; right: 0px; position: relative; height: 40px; border-radius: 0px; background: #525252; border-left: 1px solid #ACACAC; color: #fff;padding:0 0 0 10px; }
    header.customer-select .search .input-group-btn {height:40px;position:absolute;top:0;right:0;}
    header.customer-select .search .input-group .btn { margin-left: 0 !important; padding: 9px 12px; position: absolute; right: 0; z-index: 3; border-radius: 0px; width: 40px; }
    header.customer-select .search .input-group:hover .btn { }
    
    /** Extra nav area (left of search box) **/
    nav.primary-menu .nav-extra-wrap {position:absolute;top:0;right:20px;z-index:1000}
    nav.primary-menu .nav-extra-wrap .secondary ul {position:absolute;right:0px;margin:3px 10px 0 0;border:0px;padding:0;width:650px;text-align:right;}
    nav.primary-menu .nav-extra-wrap .secondary ul li {display:inline;}
    nav.primary-menu .nav-extra-wrap .secondary ul li a {padding:8px;font-size:12px;color:#777;}
    nav.primary-menu .nav-extra-wrap .secondary ul li a:hover {color:#fff;}
    nav.primary-menu .nav-extra-wrap .secondary ul li.emergencies-btn a {color:#CC2023;}
    nav.primary-menu .nav-extra-wrap .secondary ul li.emergencies-btn a:hover {background:#CC2023;color:#fff;-webkit-border-radius: 3px;-moz-border-radius: 4px;border-radius: 3px;}

    nav.primary-menu .nav-extra-wrap .secondary ul li.acct-btn a {background:#0077be; color:#fff}
   

/** Navigation adjustments on scroll **/
    @media (min-width: 992px) {img.logo-header-mobile {display:none;}}
    @media (max-width: 992px) {header .logo-spacer {display:none;}nav.primary {margin:0;}}
    
    .customer-select-sm {margin:15px 0 15px 0px}
    .customer-select-sm button {font-weight:bold;color:#777;}
    .customer-select-sm ul.dropdown-menu {margin-top:-7px;}
    .customer-select-sm ul.dropdown-menu li a {font-size:12px;font-weight:normal;}
    

/* 3. CONTENT LAYOUTS
-------------------------------------------------------------------*/
    
    /* 3.2. HOMEPAGE LAYOUTS
    ---------------------------------------------------------------*/
    
    #homepage-content section {padding:80px 0;}
    #homepage-content section p {line-height:24px;}
    .homepage-sub-title { margin: 0 35px 30px 35px; position: relative; z-index: 2;font:300 38px/45px 'Open Sans', sans-serif; }
    .homepage-sub-title a {display:block; font-size: 13px; font-weight: normal; line-height: 1.74em; text-transform: none;font-weight:900 }
    section.alt {background-color:#F3F3F3;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;}
    #newsletter-form input {padding-left:15px;padding-right:15px;}
    
    section#storage-levels {padding-bottom:50px;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;}
    section#storage-levels .circliful {margin:0 auto;position: relative;height:178px;overflow:hidden}
    .circle-text, .circle-info, .circle-text-half, .circle-info-half {width: 100%;position: absolute;text-align: center;display: inline-block;}
    .circle-info, .circle-info-half {color: #999;}
    .circliful .fa {margin: -10px 3px 0 3px;position: relative;bottom: 4px;}
    
    #newsletter { background:url(img/home-slider/slider-image-2.jpg) no-repeat center center fixed;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;position: relative; }
    #newsletter .tint { background: rgba(0,0,0,0.4); height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
    #newsletter h2 { color: #fff;font-weight:300;font-size:38px;font-family:'Open Sans', sans-serif;}
    #newsletter h2 a {display:block; font-size: 13px; line-height: 1.74em; text-transform: none;font-weight:900;color:#fff;}
    #newsletter .btn { text-align: center; width: 100%; }
    #newsletter-name-group, #newsletter-email-group, #newsletter .input-group { width: 100%; }
    #newsletter input {padding-left:10px;padding-right:10px;}
    
    #focusgroups { background:url(img/focus-groups.jpg) no-repeat center center fixed;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;position: relative; }
    #focusgroups .tint { background: rgba(0,0,0,0.4); height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
    #focusgroups h2 { color: #fff;font-weight:300;font-size:48px;font-family:'Open Sans', sans-serif;}
    #focusgroups h2 a {display:block; font-size: 13px; line-height: 1.74em; text-transform: none;font-weight:900;color:#fff;}
    #focusgroups p {color:#fff;font-size:16px;}
    #focusgroups .btn { text-align: center;margin-top:30px;background:none;border:2px solid #fff;font-weight:bold; text-transform:uppercase;}
    #focusgroups .btn:hover {background:#0077be;border:2px solid #0077be;font-weight:bold; text-transform:uppercase;}
    #newsletter-name-group, #newsletter-email-group, #newsletter .input-group { width: 100%; }
    #focusgroups input {padding-left:10px;padding-right:10px;}
    
    #SPECIAL-NewsPost { background:url(img/sale-background.jpg) no-repeat center center fixed;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;position: relative; }
    #SPECIAL-NewsPost .tint { background: rgba(0,0,0,0.6); height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
    #SPECIAL-NewsPost h2 { color: #fff;font-weight:300;font-size:48px;font-family:'Open Sans', sans-serif;margin-bottom:0px;}
    #SPECIAL-NewsPost h2 a {display:block; font-size: 13px; line-height: 1.74em; text-transform: none;font-weight:900;color:#fff;}
    #SPECIAL-NewsPost p {color:#fff;font-size:16px;}
    #SPECIAL-NewsPost .btn { text-align: center;margin-top:30px;background:none;border:2px solid #fff;font-weight:bold; text-transform:uppercase;}
    #SPECIAL-NewsPost .btn:hover {background:#0077be;border:2px solid #0077be;font-weight:bold; text-transform:uppercase;}
    #newsletter-name-group, #newsletter-email-group, #newsletter .input-group { width: 100%; }
    #SPECIAL-NewsPost input {padding-left:10px;padding-right:10px;}
    
    .haveyoursay {background-color:#0077be;-webkit-box-shadow: inset 0 0 30px rgba(0,0,0,0.2);-moz-box-shadow: inset 0 0 30px rgba(0,0,0,0.2);box-shadow: inset 0 0 30px rgba(0,0,0,0.2);padding:30px 0 !important;}
    .haveyoursay-textwrap {width:560px;margin:0 auto;}
    .haveyoursay h1 {font-size:60px;color:#fff;margin-bottom:10px;dispaly:inline;float:left;}
    .haveyoursay h2 {margin-bottom:0;padding-bottom:0;color:#fff !important;dispaly:inline;font-size:30px;}
    .haveyoursay h3 {margin-top:0;color:#fff;dispaly:inline;}
    .haveyoursay a {color:#fff;dispaly:inline;}    
    
    /* 3.3. SUBPAGE LAYOUTS
    ---------------------------------------------------------------*/
    .left-col section {padding:35px 10px 35px 0;min-height:900px;}
    .left-col section p {line-height:24px;}
    .right-col {padding:0;}
    .right-col-inner {height:100%;background:#FBFBFB;position:relative;border-left:1px solid #e8e8e8;border-right:1px solid #e8e8e8;z-index:10;}
    .right-col-panel {margin-top:-50px;position:absolute;border-top:3px solid #0077be;padding:15px;width:100%;z-index:40;background-color:#FBFBFB;}
    .right-col-panel.is_stuck {border-right:1px solid #e8e8e8;}
    
    /* 3.4. SUBPAGE RIGHT COLUMN
    ---------------------------------------------------------------*/
    .right-col-panel h2 {font:400 18px/30px 'Open Sans', sans-serif;color:#0077be;margin:0 0 10px 0;}
    .right-col-panel h2 span {font-weight:300;color:#555;}
    .right-col-panel .nav-stacked {border-bottom:2px solid #ddd;}
    .right-col-panel .nav-stacked li {margin:0;}
    .right-col-panel .nav-stacked li a {color:#777;border-bottom:1px solid #E4E4E4;padding-left:25px;border-radius:0;}
    .right-col-panel .nav-stacked li a:before {content:"\f105";font-family: FontAwesome;left:15px;padding-right: 0.5em;position: absolute;}
    .right-col-panel .nav-stacked li.active-item a {color:#0077be;background-color:#EFEFEF;}
    .side-widget-subnavs {padding-bottom:20px;}
    .side-widget {margin:0 0 20px 0 !important;border-radius:0px !important;}
    .side-widget:last-child {margin-bottom:0px !important;}
    .side-widget-weather {background:#0077be;padding:15px;color:#fff;}
    .side-widget-weather h2, .side-widget-weather h2 span, .side-widget-weather h2 a {color:#fff;margin:0;}
    .side-widget-weather h2 a {float:right;}
    .side-widget .panel-heading, .side-widget .panel-body {padding:0;}
    .side-widget .panel-body .collapse-wrap {padding:15px 0 0 0;}
    #weather-box h2 {font-size:16px;font-weight:bold;}
    .ebills-widget {background:#f69720;}
    
    /* 3.5. HOMEPAGE BANNER
    ---------------------------------------------------------------*/
    #home {background-color:rgba(237,237,237,1.00);content:'Block hidden in edit mode';}
    #slides {height:100%; left:0; position:absolute !important ; top:0;padding-top:90px; width:100%;z-index:2;}
    #slides .slides-container { display: none; }
    #slides .scrollable {*zoom: 1; position: relative; top: 0; left: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; height: 70%;max-height:670px; }
    #slides .scrollable:after { content: ""; display: table; clear: both; }
    .slides-navigation { margin: 0 auto; position: absolute; z-index: 3; top: 46%; width: 100%; }
    .slides-navigation a { position: absolute; display: block; }
    .slides-navigation a.prev { left: 0; }
    .slides-navigation a.next { right: 0; }
    .slides-pagination { position: absolute; z-index: 12; text-align: center;width:100%;bottom:20px; }
    .slides-pagination a { transition: all 0.4s ease;border: 2px solid rgba(255,255,255,0.4); border-radius: 50%;padding:7px;font-size:0px;display:inline; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGP6zwAAAgcBApocMXEAAAAASUVORK5CYII="); margin: 10px; overflow: hidden; text-indent: -200%; }
    .slides-pagination:hover a {border: 2px solid rgba(255,255,255,1);}
    .slides-pagination a.current { background:rgba(255,255,255,0.6) }
    #slides .tint-cover {height:100%;position:absolute;z-index:11;background:rgba(0,0,0,0.3);left:0;padding:0 25px 0 100px;transition: all 0.2s ease;}
    #slides .slides-inner {position:relative;height:70%;max-height:670px;}
    #slides .tint {background:rgba(0,0,0,0.2); height:100%; left:0; position:absolute; top:0; width:100%; z-index:9}
    #slides .nav-shadow {background:url(../img/header.png) repeat-x top;border:0; display:block; min-height:200px; position:absolute; top:91px; width:100%; z-index:10}
    
    .slider-titles {position:relative; padding:0; z-index:12;top:60%;width:auto; transform:translateY(-50%)}
    .slider-titles ul {}
    .slider-titles ul, li.slideshow-description {list-style:none; margin:0; padding:0;}
    li.slideshow-description h1, li.slideshow-description h2 {font:300 30px/40px 'Open Sans', sans-serif;margin:0 0 0 -5px;color:#fff;display:block;width:450px;}
    li.slideshow-description i {padding:0 7px 15px 7px;font-size:100px;color:#fff;}
    li.slideshow-description h1 {text-transform:uppercase;}
    li.slideshow-description h2 {font:900 17px/25px 'Open Sans', sans-serif;margin:0 0 30px 0;}
    li.slideshow-description a {padding:5px 20px; border:2px solid #fff;font:400 14px/30px 'Open Sans', sans-serif;color:#fff;text-transform:uppercase;transition: all 0.2s ease;}
    li.slideshow-description a:hover {background-color:#fff;color:#0077be;border-color:#0077be;}
    
    
    
    /* 3.6. SUBPAGE BANNER
    ---------------------------------------------------------------*/
    .subpage-banner-wrap {height:350px;background-color:#E9E9E9}
    .subpage-banners{background-size: cover;}
    .subpage-banners .parallax-content-area{max-width: 1200px;width: 100%;display: table;margin: 0 auto;padding:0 15px;}
    .subpage-banners .parallax-content-table{display: table-cell;vertical-align: middle;width: 100%;height:100%;position:relative;z-index:20;}
    .subpage-banners .parallax-content-table-wrapper {float:left;position:relative;padding-right:30px;height:100%;display:table}
    .subpage-banners .parallax-content-table-inner {display: table-cell;vertical-align: middle;position:relative;z-index:3;padding-top:30px;}
    .subpage-banners .parallax-content-table h1 {padding-bottom:10px;}
    .subpage-banners .parallax-content-table h1, .subpage-banners .parallax-content-table h2, .contact-titles h1, .contact-titles h2 {font:700 20px/20px 'Open Sans', sans-serif;margin:0 0 0 1px;color:#fff;display:inline;float:left;clear:left;}
    .subpage-banners .parallax-content-table h1 i, .contact-titles h1 i {padding:0 7px 0 0px;}
    .subpage-banners .parallax-content-table h2, .contact-titles h2 {font:300 60px/60px 'Open Sans', sans-serif;font-weight:300;letter-spacing:-3px;margin:0 0 20px 2px;}
    .subpage-banners .parallax-content-table p, .contact-titles p {font:400 14px/20px 'Open Sans', sans-serif;color:#fff;margin:20px 0 0 0;display:block;clear:left;}
    .subpage-banners .parallax-content-table a, .contact-titles a {padding:5px 20px;border:2px solid #fff;font:400 14px/30px "Helvetica Neue",Helvetica,Arial,sans-serif;color:#fff;text-transform:uppercase;transition: all 0.2s ease;}
    .subpage-banners .parallax-content-table h2 a, .subpage-banners .parallax-content-table h2 a:hover {font:300 60px/60px 'Open Sans', sans-serif;letter-spacing:-3px;margin:0;border:0px;padding:0;background:none;color:#fff;}
    .subpage-banners .parallax-content-table a:hover, .contact-titles a:hover {background-color:#fff;color:#0077be;border-color:#0077be;}
    .subpage-banners .tint-cover-all {height:350px;width:2000px;position:absolute;z-index:1;background:rgba(0,0,0,0.4);right:0%;top:0}
    
    .title-banner {background:#EEE;padding:80px 0 20px 0;border-bottom:1px solid #E1E8ED}
    .title-banner h1 {font-size:30px;margin-bottom:10px;font-weight:300;}
    .title-banner p {max-width:700px;}
    .title-banner p, .title-banner p a {color:#999;font-weight:bold;}
    .title-banner p span {font-variant:normal;color:#999;}
    .title-banner p a.nav-home {font-size:0px;}
    .title-banner p a.nav-home:before {content: "\f015";font-family: FontAwesome;font-size:13px;}
    .title-banner p a:hover {color:#0077be;}

/* 5. CAROUSELS
-------------------------------------------------------------------*/

    /* 5.0. GENERAL SUBPAGE LAYOUTS
    ---------------------------------------------------------------*/
    .general-sub-pagelist {padding-top:10px;}
    .general-sub-pagelist .page-list-wrapper{margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid #E1E1E1;}
    .general-sub-pagelist .page-content {padding:0 7px;}
    .general-sub-pagelist .page-content h4 {line-height:1.2em;font-size:18px;}
    
    .general-sub-pagelist .page-content h4 .title-border {padding-bottom:7px;}
    .relative-content-wrap {position:relative;}

    .major-projects-list .col-md-12 {padding-bottom:10px !important;}
    .major-projects-list .col-md-12 h3 {line-height:normal;}
    .major-projects-list .col-md-12 span.media-box {margin-top:10px;}
    .major-projects-list .col-md-12 {}

    /* 5.1. NEWS POSTS
    ---------------------------------------------------------------*/
    section#recent-posts {background-color:#fff;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;}
    section#recent-posts h2 {margin-bottom:45px;}
    .post h1 { margin-bottom: 5px; }
    .post h3 { margin: 0;  line-height: 1em;padding-bottom:10px; }
    .post h3 a { color: #222;font-family:'Open Sans', sans-serif;font-size:80%; }
    .post h3 a:hover { text-decoration: underline; }
    .post-cover { margin-bottom: 30px; }
    .meta { color: #bbb; margin-bottom: 10px; text-transform:capitalize;}
    .meta span { margin-right: 15px; }
    .meta i { margin-right: 5px; }
    .post-date { background:rgba(34,34,34,0.8); color: #fff; font-weight: 900; left: 30px; line-height: 1.74em; padding: 15px 0 8px 0; position: absolute; text-align: center; text-transform: uppercase; top: 0; width: 50px; }
    .post-day { font-size: 200%;font-family:'Open Sans', sans-serif }
    .post-month { color: #1091dd;font-family:'Open Sans', sans-serif }
    .media,
    .media .media { border-top: 1px solid #e8e8e8; margin-top: 30px; padding-top: 30px; }
    .fa-reply { margin-right: 5px; }
    .news-posts .item {padding-bottom:10px;border-bottom:3px solid #fff;transition:border-bottom 0.6s}
    .news-posts .item:hover {border-bottom:3px solid #0077be;}
    #recent-posts .item h3 { margin: 0; }
    #recent-posts .item .meta { padding: 0; }
    #recent-posts .item a img {background: #f0f0f0; padding: 7px;}
    
    /* 5.2. CAROUSELS GENERAL STYLES
    ---------------------------------------------------------------*/ 
    .owl-carousel .item { background: #fff; }
    .owl-carousel .item h3 { margin: 30px 30px 0; }
    .owl-carousel .item h3 a { color: #222; }
    .owl-carousel .item h3 a:hover { text-decoration: underline; }
    .owl-carousel .item .meta { color: #bbb; display: block; padding: 0 30px 30px; }
    .owl-carousel .item .meta p { margin: 0; }
    .owl-carousel .item .meta .fa-star { color: #fbcd53; }
    .owl-carousel .item .price { background: rgba(0,0,0,0.8); border-radius: 0 0 4px 4px; color: #fff; display: block; font-size: 1.5em; padding: 30px 15px; position: absolute; right: 30px; top: 0; }
    .owl-theme .owl-controls { margin: 0 !important; padding: 0; position: absolute; top: -80px; width: 100%; }
    .owl-theme .owl-controls .owl-nav [class*=owl-] { font-size: 14px !important; margin: 0 !important; }
    .owl-theme .owl-controls .owl-nav .owl-prev { float: left; }
    .owl-theme .owl-controls .owl-nav .owl-next { float: right; }
    .owl-theme .owl-controls .owl-nav a {border-radius:50%;display:block;height:34px;width:34px;}
    .owl-theme .owl-controls .owl-nav a i:before {margin-left:-2px;}
    .owl-theme .owl-controls .owl-nav .owl-next a i:before {margin-left:0;} 


/* 6. WIDGET STYLES
-------------------------------------------------------------------*/

    /* 6.1. WEATHER WIDGET
    ---------------------------------------------------------------*/
    @font-face {font-family:'weathericons';src: url('fonts/weathericons-regular-webfont.eot');src: url('fonts/weathericons-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/weathericons-regular-webfont.woff') format('woff'), url('fonts/weathericons-regular-webfont.ttf') format('truetype'), url('fonts/weathericons-regular-webfont.svg#weathericons-regular-webfontRg') format('svg');font-weight: normal;font-style: normal;}
    #weather-sidebar {color:#fff;margin-bottom:8px;}
    #weather-sidebar .collapse-wrap h5 {font-size:16px;font-weight:bold;}
    #weather-sidebar .collapse-wrap i.current {font-size:50px;}
    #weather-sidebar .collapse-wrap p.current {font-size:400%;position:relative;}
    #weather-sidebar .collapse-wrap p.current sub {font-size:30%;vertical-align:text-top;line-height:20px;}
    #weather-sidebar .collapse-wrap p.day {font-size:16px;font-weight:bold;}
    .side-widget .collapse-wrap ul, .side-widget .collapse-wrap ul li {padding:0;margin:0;list-style:none;display:block;}
    #weather-sidebar .collapse-wrap ul li i {padding-right:5px;display:block;width:22px;float:left;text-align:center;}
    #weather-sidebar .collapse-wrap .day-info ul {width:50%;float:left;}
    .side-widget .collapse-wrap ul.sidebar-list {display:block;width:100%;margin-top:0px;}
    .side-widget .collapse-wrap ul.sidebar-list li {clear:both;display:block;width:100%;padding:4px 0;}
    .side-widget .collapse-wrap ul.sidebar-list li span {display:block;width:25%;float:left;}
    .side-widget .collapse-wrap ul.sidebar-list li span sub { vertical-align:text-top;line-height:5px;}
    #weather-sidebar i {color:#fff;font-family:weathericons;font-style:normal}
    .location-button {text-align:right;}
    button.js-geolocation {margin-top:5px;background:none;color:#fff;border:0px;padding:0px;}
    .wi-sunrise:before {content:"\f051";}
    .wi-sunset:before {content:"\f052";}
    .wi-humidity:before {content:"\f04e";}
    .wi-wind:before {content:"\f050";}
    .icon-0:before {content:"\f056";}
    .icon-1:before {content:"\f073";}
    .icon-2:before {content:"\f073";}
    .icon-3:before {content:"\f01e";}
    .icon-4:before {content:"\f01e";}
    .icon-5:before {content:"\f017";}
    .icon-6:before {content:"\f015";}
    .icon-7:before {content:"\f015";}
    .icon-8:before {content:"\f01c";}
    .icon-9:before {content:"\f01c";}
    .icon-10:before {content:"\f01a";}
    .icon-11:before {content:"\f01a";}
    .icon-12:before {content:"\f01a";}
    .icon-13:before {content:"\f01b";}
    .icon-14:before {content:"\f01b";}
    .icon-15:before {content:"\f01b";}
    .icon-16:before {content:"\f01b";}
    .icon-17:before {content:"\f015";}
    .icon-18:before {content:"\f015";}
    .icon-19:before {content:"\f063";}
    .icon-20:before {content:"\f014";}
    .icon-21:before {content:"\f014";}
    .icon-22:before {content:"\f062";}
    .icon-23:before {content:"\f050";}
    .icon-24:before {content:"\f002";}
    .icon-25:before {content:"\f076";}
    .icon-26:before {content:"\f00c";}
    .icon-27:before {content:"\f002";}
    .icon-28:before {content:"\f002";}
    .icon-29:before {content:"\f002";}
    .icon-30:before {content:"\f002";}
    .icon-31:before {content:"\f00d";}
    .icon-32:before {content:"\f00d";}
    .icon-33:before {content:"\f00c";}
    .icon-34:before {content:"\f00d";}
    .icon-35:before {content:"\f015";}
    .icon-36:before {content:"\f00d";}
    .icon-37:before {content:"\f002";}
    .icon-38:before {content:"\f002";}
    .icon-39:before {content:"\f002";}
    .icon-40:before {content:"\f01a";}
    .icon-41:before {content:"\f017";}
    .icon-42:before {content:"\f01b";}
    .icon-43:before {content:"\f017";}
    .icon-44:before {content:"\f002";}
    .icon-45:before {content:"\f01d";}
    .icon-46:before {content:"\f017";}
    .icon-47:before {content:"\f010";}
    .icon-3200:before {content:"\f00d";}
    
    /* 6.2. WATER STORAGE WIDGET
    ---------------------------------------------------------------*/
    .side-widget .collapse-wrap ul.sidebar-list li span.catchment {display:block;width:50%;float:left;}
    .side-widget .collapse-wrap ul.sidebar-list li span.figures {display:block;width:25%;float:left;text-align:center;}
    .side-widget .collapse-wrap ul.sidebar-list li.title-bar {font-size:10px;}
    #widget-waterstorage a {color:#FFF;display:block;padding-top:10px;text-align:right;font-size:11px;}
    
    /* 6.3. INFORMATION SIDEBAR WIDGET
    ---------------------------------------------------------------*/   
    #widget-inform {}
    #widget-inform p {font-size:12px;}
    #widget-inform ul {list-style:none;padding:0;margin:0;display:table;}
    #widget-inform ul li {display:table-cell;width:1%;vertical-align:middle;text-align:center;white-space:nowrap;font-size:18px;min-height:34px;}
    #widget-inform ul li a {color:#fff;padding:4px 5px;border-radius:50%;border:1px solid #FFFFFF;}
    #widget-inform ul li a:hover {border-radius:0;background:#0077BE;border-color:#0077BE}
    #widget-inform input {background:#666;border:1px solid #999;color:#D9D9D9;width:100%;margin-bottom:8px;-webkit-box-shadow: none !important;-moz-box-shadow: none !important;  box-shadow: none !important;}
    #widget-inform input:focus {border-color:#fff;color:#fff;}
    #widget-inform input::-webkit-input-placeholder, #widget-inform .input-group input:-moz-placeholder, #widget-inform .input-group input::-moz-placeholder, #widget-inform .input-group input:-ms-input-placeholder {font-size:11px !important;}
    
    /* 6.4. TAB STYLES
    ---------------------------------------------------------------*/
    /**Style 1**/
    .tab-style-a {border-bottom:1px solid #B4B4B4}
    .tab-style-a li a {font-weight:bold;padding-top:15px;padding-bottom:15px;margin:1px 0 0 0;background:#FBFBFB;border:1px solid #F3F3F3;border-bottom:1px solid #B4B4B4;border-radius:0px;color:#646464}
    .tab-style-a li a:hover {background:#0077BE;color:#fff;}
    .tab-style-a li a.active, .tab-style-a li a:focus.active {background:#F3F3F3;border:1px solid #F3F3F3;border-bottom:1px solid #F3F3F3;color:#646464}
    .tab-style-a-body {background:#FBFBFB;padding:10px 20px;border:10px solid #F3F3F3;}
    
    
 /* 7. PAGE SPECIFIC STYLES
-------------------------------------------------------------------*/
   
    /* 7.1. SEARCH BLOCKS 
    -------------------------------------------------------------------*/    
    .search-results-inputs {background-color:#FBFBFB;border:1px solid #E1E8ED;border-radius:4px;padding:15px;}
    .search-results-inputs .form-control {padding-left:8px;}
    #searchResults h3 {font-size:18px;margin:0}
    #searchResults a.pageLink {color:#006621;}
    .searchResult {padding:10px 15px;border-bottom:1px solid #E7E7E7;}
    .searchResult:hover {background-color:#f6f6f6;}
    
    .help-advice-search {margin-bottom:30px;}
    .help-advice-search-inputs {background-color:#FBFBFB;border:1px solid #E1E8ED;border-radius:4px;padding:15px 15%;}
    .help-advice-search-inputs .form-group {width:100%;}
    .help-advice-search-inputs input {font-size:16px;padding-left:8px;}
    .help-advice-search-inputs button.input-lg {font-weight:bold;width:100%;font-size:18px}
    .help-advice-search-inputs .input-group {width:100%;}
    .help-advice-search-inputs .input-group-btn {width:15% !important;}
    
    /* 7.2. SERVICE AREA MAP (INTERACTIVE)
    -------------------------------------------------------------------*/
    #service-area-interactive {min-height:600px;padding-bottom:60px;}
    .interactive-map-wrap {margin:30px 0 0 0;}
    .map-wrapper {position:relative;}  
    
    /* 7.3. MEDIA CENTRE
    -------------------------------------------------------------------*/
    .media-realses .post-date {top:5px;left:50px}
    .media-page-thumb {padding-left:4px;padding-right:4px;margin-left:15px;margin-bottom:15px;}
    .media-release-footer {position:relative;bottom:0;margin-top:40px;padding-top:20px;border-top:2px solid #0077be}
    .media-release-footer p {font-family:'Open Sans', sans-serif;font-weight:400;}
    .media-release-footer strong {font-family:'Open Sans', sans-serif;font-weight:bold;}
    
    .news-item-wrapper {position:relative;}
    .news-item { display: block; margin-bottom: 30px; }
    .governance-desc {clear:both;}
    .news-item:last-child:after { display: none !important; }
    .news-item:hover .circle .date { left: 30px; }
    .news-item:hover .wrapper { background-color: #f3f3f3; }
    .news-item:hover .wrapper .social .btn, .news-item:hover .news-content-wrap a.btn.btn-primary, .news-item:hover .media-list-thumb-wrap {filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
    .news-item:after { background-color: #f3f3f3; content: ""; width: 2px; height: 100%; position: absolute; top: 0; left: 21px; z-index: -1; }
    .news-item .circle { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #fff; border: 2px solid #f3f3f3; height: 43px; position: relative; width: 100%; }
    .news-item .circle .dot { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; background-color: #1396e2; height: 7px; width: 7px; position: absolute; top: 0; right: 0; bottom: 0; left: 1px; margin: auto; }
    .news-item .circle .date { white-space:nowrap;-moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2); -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; background-color: #1396e2; color: #fff; left: 40px; position: absolute; top: 0; bottom: 0; margin: auto; height: 29px; line-height: 29px; padding-left: 7px; padding-right: 7px; z-index: 2; }
    .news-item .circle .date:after { width: 0; height: 0; content: ""; border-style: solid; border-width: 4px 4px 4px 4px; border-color: transparent #1396e2 transparent transparent; position: absolute; top: 0; left: -8px; bottom: 0; margin: auto; }
    .news-item .wrapper { -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; background-color: transparent; border: 2px solid #f3f3f3; padding: 0px; margin-top: -8px; }
    .news-item .news-content-wrap {padding:20px;}
    .news-item .media-list-thumb-wrap {min-height:209px;filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30); opacity: 0.3;-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;margin:20px 0}
    .news-item .wrapper h4 { margin-top: 0;line-height:1.4em }
    .news-item .wrapper h4 .title-spacer {float:left;height:20px;width:40px;}
    .news-item .wrapper h4 a {color:#777;}
    .news-item .wrapper h4 a:hover {color:#0077be;}
    .news-item .news-content-wrap a.btn.btn-primary {-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;float:left;filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30); opacity: 0.3;}
    .news-item .news-content-wrap p {font-size:13px;line-height:20px;}
    .news-item .news-content-wrap p .badge {font-size:11px;}
    .news-item .wrapper .social .btn, .news-item .wrapper .read-more-news btn {
     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30); opacity: 0.3; padding: 3px 0; width: 25px;font-size:18px }
    .news-item .wrapper .read-more-news {margin-top:15px;}
    .news-item .wrapper .read-more-news btn {width:auto;font-size:12px;}
    .tool-tip { padding: 5px; cursor: pointer; color: #073855; }
    .news-story-meta {display:table;width:100%;margin:20px 0;}
    .news-story-meta .link-icon {line-height:24px;}
    .news-story-meta .link-icon .fa {margin:0 10px;}
    .news-story-meta .link-icon:first-child .fa {margin-left:0;}
    .news-story-meta .tags {display:inline-block;float:right;}
    .news-story-meta .tags .tag {margin-left: 5px;}
    .tag {-moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;-moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);background-color: #fff;display: inline-block;padding: 3px 8px;}
    .tag.article {background-color: #f3f3f3;color: #2a2a2a;font-size: 12px;font-weight: bold;}
    .news-story-meta .tags .tag.red {background-color:rgba(223,26,30,1.00);color:#fff;}
    .news-story-meta .tags .tag.notice {background-color:rgba(247,178,7,1.00);color:#fff;}
    #news_comments {clear:both;}
    .news-list-item h4 {border:0px;font-size:18px;}
    .news-list-item h4 .title-border {padding-bottom:7px;}
    .news-story h2 {line-height:normal;}
    
    article.news-story h2 {font-size:36px;font-weight:300;margin-bottom:15px;}
    
    .news-list-item {margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid #D4D4D4;background:#fff; -webkit-transition: background .2s; -moz-transition: background .2s; -ms-transition: background .2s; -o-transition: background .2s; transition: background .2s;}
    .news-list-item:hover {background:#FBFBFB; -webkit-transition: background .2s; -moz-transition: background .2s; -ms-transition: background .2s; -o-transition: background .2s; transition: background .2s;}
    .news-list-item p,.news-list-item h4, .news-list-item span.tag-box {padding-left:7px;padding-right:7px;}
    .news-list-item p.intro {font-size:12px;line-height:18px;}
    .media-box { position: relative; display: block; max-width: 100%; }
    .media-box .zoom,.media-box .expand { position: absolute; width: 36px; height: 36px; line-height: 36px; margin: 0 auto; text-align: center; color: #ffffff!important; font-size: 1.2em; z-index: 79; left: 50%; top: 50%; margin-left: -18px; margin-top: -18px; -webkit-border-radius: 4px; border-radius: 4px; opacity: 0; -webkit-transition: all 0.3s ease 0.2s; -moz-transition: all 0.3s ease 0.2s; -ms-transition: all 0.3s ease 0.2s; -o-transition: all 0.3s ease 0.2s; transition: all 0.3s ease 0.1s; }
    .media-box:hover img { opacity: .7;-webkit-transition: opacity .2s; -moz-transition: opacity .2s; -ms-transition: opacity .2s; -o-transition: opacity .2s; transition: opacity .2s;  }
    .media-box:hover .zoom,.media-box:hover .expand { opacity: 1; -webkit-transition: opacity .2s; -moz-transition: opacity .2s; -ms-transition: opacity .2s; -o-transition: opacity .2s; transition: opacity .2s; }
    .media-box .media-box-wrapper { padding: 30px; }
    .media-box .media-box-wrapper,.media-box .zoom,.media-box .expand,.project-overlay .project-cat { background-color: #0077be; }
    .featured-project-block { position: relative; display: block; background: #f0f0f0; padding: 7px; margin-bottom: 5px; }
    .project-overlay { background-color: rgba(0,0,0,.5);position: absolute; bottom: 7px; left: 7px; font-family: 'Roboto', sans-serif; color: #ffffff; text-transform: uppercase; font-size: 11px; }
    .project-overlay .project-title { float: left; line-height: 16px; padding: 4px 0 4px 10px; }
    .project-overlay .project-cat { display: inline-block; float: right; padding: 0 10px; text-align: center; line-height: 24px; letter-spacing: 1px; }
    .media-centre-lists a.comment-tag {display:none;}
    .media-centre-lists h4 {margin:0;line-height:normal;padding-bottom:8px;}
    .media-centre-lists h4 a {line-height:18px;color:#333;}
    .media-centre-lists span.tag-box {display:block;padding-bottom:8px;}
    .media-centre-lists span.tag-box a {color:#AFAFAF;-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;}
    .media-centre-lists span.tag-box a:hover {color:#0077be;}
    .media-centre-lists .post-date {left:30px;top:0;z-index:5;}
    .news-content-img {position:relative;margin-bottom:15px;}
    .news-content-img .caption {position:absolute;bottom:10px;right:0px;background:rgba(0,0,0,0.7);padding:8px 12px;color:#fff;}
    
    .full-width-lists h3 {margin-top:0;}

    /* 7.4. ERROR PAGES
    -------------------------------------------------------------------*/
    .error-page { display: table; text-align: center; margin: 100px 0; width: 100%; }
    .error-page h2 { position: relative; z-index: 4; font-weight: 300;border:0px; }
    .error-page .titles {border:0px;}
    .error-page .titles header { color: #1396e2; font-size: 99px; font-weight: lighter; position: relative; z-index: 1; font-family: 'Open Sans', sans-serif; }
    .error-page .top { bottom: 120px; left: 0; margin: auto; position: absolute; right: 0; z-index: 2; }
    .error-page .bottom { bottom: 190px; left: 0; margin: auto; position: absolute; right: 0; z-index: 0; }

    /* 7.5. File links (graphical)
    -------------------------------------------------------------------*/

    .file-download-block .list-group-item {border-radius:0px;border:0px;}
    .file-link-wrapper {position:relative;height:100%;width:100%;}
    .book-file-link a, .book-file-link a:hover {color:#fff;}
    .memo-file-link a, .memo-file-link a:hover {color:#007CC3;}
    .file-title, .file-title:hover {display:block;height:100%;position:absolute;
    z-index:2;width:100%;text-align:center;padding:100px 5px 0 20px;font-weight:bold;font-size:10px;}
    .form-file-link a, .form-file-link a:hover {padding:70px 15px 0 15px;}
    @media (max-width: 900px) {.file-title, .file-title:hover {padding:130px 5px 0 20px;font-size:12px;}}
    @media (max-width: 600px) {.file-title, .file-title:hover {padding:80px 5px 0 20px;font-size:12px;}}
    
    /* 7.6 CONTACT US PAGE
    -------------------------------------------------------------------*/
    /*MAP FUNCTION*/
    #map-wrapper { padding-top: 70px; }
    #map { width: 100%; height: 400px;position:absolute;z-index:3 }
    .marker-style { border: 3px solid #1396e2; text-align: center; width: 34px; height: 34px; border-radius: 50%; margin-left: -17px !important; margin-top: -46px !important; }
    .marker-style img { position: absolute !important; top: -1px !important; bottom: 0px !important; right: 0px; left: 0px; margin: auto !important; }
    .cluster > div { color: #fff !important; text-align: center !important; z-index: 3; }
    .cluster > div:before {-moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #1396e2; content: ""; height: 31px; position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; width: 31px; z-index: -1; }
    .infobox-wrapper > img {filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; position: absolute !important; right: 8px; top: 13px; z-index: 2; }
    .infobox-wrapper > img:hover {filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
    .infobox-wrapper .infobox-inner { -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2); background: #fff; border-top: 6px solid #073855; font-size: 12px; position: relative; margin-bottom: 50px; min-width: 200px;margin-top:50px; }
    .infobox-wrapper .infobox-inner:after { width: 0px; height: 0px; border-style: solid; border-width: 6px 6px 0 6px; border-color: #fff transparent transparent transparent; position: absolute; left: 95px; content: ""; bottom: -6px; }
    .infobox-wrapper .infobox-inner .infobox-image { width: 250px; height: auto; overflow: hidden; position: relative; }
    .infobox-wrapper .infobox-inner .infobox-image:after { background: -moz-linear-gradient(top, transparent 50%, rgba(0, 0, 0, 0.75) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(100%, rgba(0, 0, 0, 0.75))); background: -webkit-linear-gradient(top, transparent 50%, rgba(0, 0, 0, 0.75) 100%); background: -o-linear-gradient(top, transparent 50%, rgba(0, 0, 0, 0.75) 100%); background: -ms-linear-gradient(top, transparent 50%, rgba(0, 0, 0, 0.75) 100%); background: linear-gradient(to bottom, transparent 50%, rgba(0, 0, 0, 0.75) 100%);  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0 );
    display: block; content: ""; position: absolute; width: 100%; height: 100%; top: 0; }
    .infobox-wrapper .infobox-inner .infobox-image img { width: 100%; }
    .infobox-wrapper .infobox-inner .infobox-image .infobox-price { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3); background-color: #1396e2; color: #fff; font-size: 14px; font-weight: bold; padding: 3px 7px; position: absolute; bottom: 8px; left: 8px; z-index: 2; }
    .infobox-wrapper .infobox-inner .infobox-title { font-size: 14px; font-weight: bold; }
    .infobox-wrapper .infobox-inner .infobox-title a { color: #073855; }
    .infobox-wrapper .infobox-inner .infobox-description { padding: 8px; }
    .infobox-wrapper .infobox-inner .infobox-location {
     filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; font-size: 12px; }
    .infobox-wrapper .infobox-inner .fa { color: #1396e2; float: right; font-size: 18px; margin-top: 4px; }
    .marker-hover { opacity: .5; }
    .search-box-wrapper { position: absolute; width: 100%; top: 0px; }
    .search-box-wrapper .search-box-inner h2 { margin-bottom: 20px; }
    #submit-map { margin-bottom: 20px; }
    .fade-map { -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
    opacity: 0.3; }
    .map-osm #map { z-index: 0; position: relative; }
    .marker-cluster { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; -moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s; color: #fff; width: 32px; height: 38px; background-color: #1396e2; text-align: center; font-size: 14px; font-weight: bold; line-height: 38px; }
    .marker-cluster:hover { background-color: #073855; }
    .form-group { margin-bottom: 10px; }
    
    .contact-social ul,.contact-social ul li {list-style:none;padding:0;margin:0;display:inline;}
    .contact-social ul li a {font-size:20px;padding:6px 6px;background:#323438;color:#fff;}
    
    .contact-title-wrapper {max-width:1170px;height:400px;position:relative;margin:0 auto;}
    .contact-titles {position:absolute;z-index:3;left:0;height:400px;background:rgba(0,0,0,0.4);}
    .contact-titles .inner {padding-top:50%;padding-right:30px;}
    .contact-title-wrapper .tint {height:400px;width:2000px;position:absolute;z-index:3;background:rgba(0,0,0,0.4);left:-2000px;top:0}
    .contact-form .alert-danger {font-weight:bold;}
    .contact-form .error {display:inline;font-weight:normal;} 
    .contact-form .error:after {content:', ';}  
    .contact-form .error:last-child:after {content:'';}
    
    .btn-file { position: relative; overflow: hidden; color: #777; }
    .btn-file input[type=file] { position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; cursor: inherit; display: block; }
    input[readonly] { cursor: text !important; }

    .ccm-page .contact-form .form-group { margin-bottom: 10px; }
    .ccm-page .contact-form input[type="text"],.ccm-page .contact-form input.hasDatepicker, .ccm-page .contact-form input[type="email"],.ccm-page .contact-form input[type="url"],.ccm-page .contact-form input[type="search"],.ccm-page .contact-form input[type="password"],.ccm-page .contact-form input[type="number"],.ccm-page .contact-form input[type="tel"],.ccm-page .contact-form textarea.form-control { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; -moz-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; background-color: #FBFBFB3; border:2px solid #f3f3f3; font-size: 14px; outline: none !important; padding: 10px 9px 11px 9px; width: 100%; height: inherit; }
    .ccm-page .contact-form input[type="text"]:active,.ccm-page .contact-form input[type="text"]:focus,.ccm-page .contact-form input.hasDatepicker:active,.ccm-page .contact-form input.hasDatepicker:focus,.ccm-page .contact-form input[type="email"]:active,.ccm-page .contact-form input[type="email"]:focus,.ccm-page .contact-form input[type="url"]:active,.ccm-page .contact-form input[type="url"]:focus,.ccm-page .contact-form input[type="search"]:active,.ccm-page .contact-form input[type="search"]:focus,.ccm-page .contact-form input[type="password"]:active,.ccm-page .contact-form input[type="password"]:focus,.ccm-page .contact-form input[type="number"]:active,.ccm-page .contact-form input[type="number"]:focus,.ccm-page .contact-form input[type="tel"]:active,.ccm-page .contact-form input[type="tel"]:focus,.ccm-page .contact-form textarea.form-control:active,.ccm-page .contact-form textarea.form-control:focus { border-color:#0077be; }
    .ccm-page .contact-form input[type="text"]:hover,.ccm-page .contact-form input.hasDatepicke:hover,.ccm-page .contact-form input[type="email"]:hover,.ccm-page .contact-form input[type="url"]:hover,.ccm-page .contact-form input[type="search"]:hover,.ccm-page .contact-form input[type="password"]:hover,.ccm-page .contact-form input[type="number"]:hover,.ccm-page .contact-form input[type="tel"]:hover,.ccm-page .contact-form textarea.form-control:hover { background-color: rgba(0, 0, 0, 0.02); }
    .ccm-page .contact-form .select-field .btn,.ccm-page .contact-form .select-field select {background-color: #FBFBFB; border-radius:0px; color: #5a5a5a; font-size: 14px; outline: none !important; padding: 10px 9px 9px 9px;border:2px solid #f3f3f3;}
    .ccm-page .contact-form .select-field .btn:hover,.ccm-page .contact-form .select-field select:hover { background-color: #ebebeb; color: #5a5a5a; }
    .ccm-page .contact-form .select-field .btn:active,/**.ccm-page .contact-form .btn:focus,**/.ccm-page .select-field select:active,.ccm-page .contact-form .select-field select:focus {border-color:#0077be; background-color: #ebebeb; color: #5a5a5a; }
    .ccm-page .contact-form .select-field .btn.btn-default:active,.ccm-page .contact-form .select-field select.btn-default:active { border-color:#0077be; }
    .ccm-page .contact-form input.hasDatepicker {width:100% !important;}
    .ccm-page .contact-form .text-muted {color:#E41B1E;}
    .ccm-page .contact-form input.custom-file-upload {outline:none;background:none;}
    
    /* 7.7. WATER STORAGE DATA/GRAPH
    ---------------------------------------------------------------*/
    h4.storage-h4 {margin-bottom:20px;}
    .storage-data {padding-bottom:25px;}
    .storage-data .storage-data-white {background-color:#F1F1F1;padding-top:15px;}
    .storage-data .storage-data-white h5 {font-size:12px;font-weight:bold;margin:0;padding:0;text-transform:uppercase;color:#CB1417;display:block;}
    .storage-data .storage-data-white span.storage-levels {font-size:32px;color:#000;}
    .storage-data .storage-data-white span.storage-levels-title {color:#0077be;padding-bottom:15px;display:block;}
    .storage-data .storage-data-white .list-group-item {border-left:0;border-right:0px;border-radius:0px;background:none;padding-left:0;padding-right:0;}
    .storage-data .storage-data-white .list-group-item:first-child {border-top:0px;}
    .storage-data .storage-data-white .list-group-item:last-child {border-bottom:0px;}
    .storage-data .storage-data-white small {display:block;color:#969696;padding-bottom:15px;}
    .storage-data .storage-data-grey {background-color:#505b72;padding-top:7.5px;padding-bottom:7.5px}
    .storage-data .morris-hover {z-index:70 !important;}
    .storage-data .morris-hover.morris-default-style {background:rgba(255,255,255,0.9) !important;border-radius:3px !important} 
    
    /* 7.8. DIRECT DEBIT REGISTRATIONS
    ---------------------------------------------------------------*/
    .dd-calc-tool { position: relative; background: #f2f2f2; border: 3px solid #A9A9A9; border-radius: 5px; padding: 10px; }
    .dd-calc-tool:after, .dd-calc-tool:before { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
    .dd-calc-tool:after { border-color: rgba(242, 242, 242, 0); border-top-color: #f2f2f2; border-width: 30px; margin-left: -30px; }
    .dd-calc-tool:before { border-color: rgba(0, 119, 190, 0); border-top-color: #A9A9A9; border-width: 34px; margin-left: -34px; }
    span.calc-total-title { font-size: 16px; font-weight: bold; display: block; text-align: center; padding: 25px 0 10px 0}
    input.calculate-total, .calculate-total:focus, .calculate-total:hover { height: auto !important; background: none !important; border: 0px !important; font-size: 20px !important; font-weight: bold; color: #0077BE !important; text-align: center;}   
  
    /* 7.9. EMPLOYMENT SECTION
    -------------------------------------------------------------------*/
    .employment-system-latest h4 {margin-top:0;margin-bottom:25px;}
    .employment-listing {border-bottom:#E1E1E1 1px solid;margin:0 15px 15px 15px;padding-bottom:5px}
    .employment-system-listing h2 {margin-bottom:15px;}
    .emploment-cta {margin-top:15px;padding:15px;background:#FBFBFB;border:1px solid #E1E8ED;border-radius:4px;}
    .emploment-cta h4 {line-height:34px !important;margin:0;}
    .careers-listing h2 {margin-bottom:15px;}
    .careers-cta {margin-top:15px;padding:15px;background:#FBFBFB;border:1px solid #E1E8ED;border-radius:4px;}
    .careers-cta h4 {line-height:34px !important;margin:0;}
    .description-box-text {margin-bottom:15px;}
    .careers-listing form.listing-contact-form div.email {display:none;}
    .employment-application .attachment_notification {padding-bottom:10px;display:none;}
    .required_sign {color:#E7090C;}
    .employment-application input.error, .employment-application textarea.error {border-color:#E7090C !important; border-width:1px !important;}
    .btn_delete_att {cursor:pointer;}
    .employment-listing h4 {margin-bottom:10px;}
    
    .btn_choose_file {position: relative;overflow: hidden;float: left;margin-right: 4px;}
    .custom_file {position: absolute;top: 0;right: 0;margin: 0;opacity: 0;filter: alpha(opacity=0);transform: translate(-300px, 0) scale(4);font-size: 23px;direction: ltr;cursor: pointer;}
    * html .fileinput-button {line-height: 24px;margin: 1px -3px 0 0;}
    * + html .fileinput-button {padding: 2px 15px;margin: 1px 0 0 0;}
    span.label_input_cstm {margin-left: 0;}
    .custom_file_cache input:focus {border: none;}
    .new_attachment {margin-bottom: 20px;clear: both;}
    .employment-application label i {font-weight:normal;}
    
    /* 7.10. HOMEPAGE CTA
    -------------------------------------------------------------------*/
    #homepage-cta {border-top: 1px solid #e8e8e8;border-bottom: 1px solid #e8e8e8;background-color: #F3F3F3; background-size:cover;padding:0 !important;}
    .cta-wrapper {padding:80px 0;position:relative;}
    .cta-wrapper h2 {margin-bottom:10px;}
    
    /* 7.11. HOMEPAGE TOTAL FIRE BAN MESSAGE
    ---------------------------------------------------------------*/
    .total-fire-ban {border:1px solid #ca1323;border-left:0px;border-right:0px;background-color:#fff;position:relative;z-index:798}
    .total-fire-ban-inner {background:url(img/total-fireban-ribbon.png) repeat;margin:2px 0;padding:5px 0}
    .fire-ban-msg {display:inline-block;background:#fff;padding:5px 10px;}
    .fire-ban-msg h2 {font-size:18px;font-family:'Open Sans', sans-serif;color:#ca1323;display:inline-block;text-transform:uppercase;margin:0;padding:0 10px 0 0;font-weight:bold;line-height:30px !important}
    .fire-ban-msg .btn {margin-top:-7px;}
    .fire-ban-msg .btn-danger {background-color:#ca1323;}
    
/* 11. FOOTERS
-------------------------------------------------------------------*/

    /* 11.1. FOOTER LINKS AREA (will be hidden on subpages)
    ---------------------------------------------------------------*/
    #links {background:#373a3e;color:#767c84}
    #links .col-sm-3 {margin:40px 0}
    #links h3 {color:#999;margin:0 0 20px;font-weight:300;letter-spacing:1px;font-size:20px;}
    #links h3 i {padding-right:3px;}
    #links h5 {margin:0;text-transform:none}
    #links p {margin:0}
    #links a {color:#fff}
    #links a:hover {color:#149ce6}

    #links ul {list-style:none;margin:0;padding:0}
    #links ul li {border-bottom:1px solid #4b4e52;display:table;padding:5px 0;width:100%}
    #links ul li a i {color:#007CC3;margin-right:10px}
    #links img {margin:0 15px 5px 0}
    #links .author a {color:#767c84}
    .twitter-feed ul li {padding:0;}

    .user span {line-height:11px;}
    #twitter-feed .user a img { display:none; }
    #twitter-feed .media img { width: 100% \9; max-width: 100%; height: auto; }
    #twitter-feed .user span span { font-size: 11px; font-weight: bold; color: #868686; }
    #twitter-feed .user span + span { font-size: 11px; color: #149ce; font-weight: bold; }
    #twitter-feed .user span + span:hover { -webkit-transition: color 250ms; -o-transition: color 250ms; transition: color 250ms; font-weight: bold; }
    #twitter-feed ul { margin: 0; padding: 0; }
    #twitter-feed li { list-style: none; margin-bottom: 10px; padding-bottom: 10px; }
    #twitter-feed li:first-child { border-top: none; padding-top: 0px; }
    #twitter-feed p { color: #eee; }
    #twitter-feed .tweet { margin-bottom: -3px; font-size: 11px; line-height: 1.35; }
    #twitter-feed-container #twitter-feed a { color: #868686; }
    #twitter-feed-container #twitter-feed a:hover { color: #46a3d9; -webkit-transition: color 250ms; -o-transition: color 250ms; transition: color 250ms; }
    #twitter-feed .tweet img { display: none; }
    #twitter-feed .timePosted { font-size: 11px;color: #46a3d9; margin-top: 10px; margin-bottom: 7px; }
    #twitter-feed .interact { font-size: 11px; }
    #twitter-feed .interact a { margin-left: 10px; text-decoration: none; }
    #twitter-feed .interact a:first-child { margin-left: 0px; }
    a[data-scribe="element:hashtag"], a[data-scribe="element:mention"] {color:rgba(204,204,204,1.00) !important;}
    a[data-scribe="element:hashtag"]:hover, a[data-scribe="element:mention"]:hover {color:#46a3d9 !important;}
    p.tweet img {display:none;}
    
    /* 11.2. FOOTER - MARKETING DETAILS
    ---------------------------------------------------------------*/
    #prefooter {background:#323438;color:#939393;font-size:12px;}
    #prefooter .col-sm-3,
    #prefooter .col-sm-6 {margin:40px 0}
    #prefooter h3 {color:#999;margin:0 0 20px;font-weight:300;letter-spacing:1px;font-size:20px;}
    #prefooter img {margin-top:10px;}
    #prefooter h3 i {padding-right:8px;}
    #prefooter a {color:#fff}
    #prefooter a:hover {color:#149ce6;}

    /* 11.3. FOOTER - COPYRIGHT DETAILS
    ---------------------------------------------------------------*/
    footer {background:#2c2f33;color:#fff;padding:20px 0;font-size:13px;}
    footer a {margin-left:10px;}
    .copyright-notice a:first-child {margin-left:10px;}
    .copyright-notice a {padding:0 2px;margin-left:0;}
    .scrollToTop,.scrollToTop:focus {height:35px;width:35px;line-height:35px;text-align:center;cursor:pointer;color:#fff;background:#007CC3;font-size:18px;padding:0px 7px;border-radius:50%;position:fixed;right: 20px;bottom: 20px;display:none;outline:none;}
    .scrollToTop:hover {text-decoration:none;background:#149ce6;color:#BBE1EF;outline:none;}
    .footer-social-icons ul {list-style:none;padding:0;margin:0;text-align:right;}
    .footer-social-icons ul li {display:inline;}
    .footer-social-icons a {padding:4px 2px 3px 2px;color:#fff;background-color:#007CC3;font-size:16px;-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s;}
    .footer-social-icons a:hover {background-color:#149ce6;color:#2C2F33;-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s}
    
    
    
/* 12. SORF SPECIFIC STYLES
-------------------------------------------------------------------*/
.sorf-pages {}
.sorf-pages header .logo-spacer {background:#302a71;}
.sorf-pages .head-nav.fm-lg .branding, 
.sorf-pages header .sub-nav ul.socialmedia-nav a:hover, .sorf-pages .customer-select-type a:hover, .sorf-pages .searchbox-icon, 
.sorf-pages .searchbox-submit, .sorf-pages .side-widget-weather, .sorf-pages .scrollToTop {background:#322c77 !important;}

.sorf-pages .right-col-panel h2, .sorf-pages .customer-select-type li a, .sorf-pages header .sub-nav a, .sorf-pages .head-nav.fm-lg .content .ccm-custom-style-container .prim-nav li.active-item > a, .sorf-pages .head-nav.fm-lg .content .ccm-custom-style-container .prim-nav li.active-item > .navicon {color:#322c77;}
 
.sorf-pages .head-nav.fm-lg .content .ccm-custom-style-container .prim-nav a:hover, .sorf-pages .head-nav.fm-lg .content .ccm-custom-style-container .prim-nav li:hover>a, 
.sorf-pages .head-nav.fm-lg .prim-nav .with-ul:hover>.navicon:after, .sorf-pages .right-col-panel .side-widget-weather h2, 
.sorf-pages #prefooter h3, .sorf-pages .copyright-notice a, .sorf-pages .head-nav.fm-lg .content .ccm-custom-style-container .prim-nav li li.active-item > a {color:#f69720;}

.sorf-pages .footer-social-icons a, .sorf-pages nav.primary ul li a:hover, .sorf-pages nav.secondary ul li a:hover {background:#f69720;}

.sorf-pages .right-col-panel {border-top:2px solid #f69720;} 

.sorf-pages nav.primary ul li a.active {background:#F8F8F8;color:#777;} 
.sorf-pages nav.primary ul li a:hover, .sorf-pages nav.primary-menu .secondary ul li a:hover, .sorf-pages .panel-body h2, .sorf-pages nav.primary-menu .nav-extra-wrap .secondary ul li.emergencies-btn a:hover {color:#fff;}
.sorf-pages nav.primary-menu .secondary ul li a, .sorf-pages header.customer-select nav.primary ul li a.active:hover {color:#777;}
.sorf-pages nav.primary-menu .nav-extra-wrap .secondary ul li.emergencies-btn a, .sorf-pages .nav-pills li.active-item a {color:#CC2023}

.sorf-pages .fm-lg.head-nav .content .prim-nav li.active-item > a.active-item, .sorf-pages .fm-lg.head-nav .content .prim-nav li.active-item > .navicon, .sorf-pages .fm-lg.head-nav .content .prim-nav li ul a:hover, .sorf-pages .fm-lg.head-nav .content .prim-nav a:hover, .sorf-pages .head-nav.fm-lg .prim-nav .with-ul:hover > a {color:#f69720}

    
/* 13. MISC ELEMENTS
-------------------------------------------------------------------*/
.red-ribbon { position: absolute; right: -2px; top: -2px; z-index: 1; overflow: hidden; width: 72px; height: 72px; text-align: right; }
.red-ribbon span { font-size: 10px; font-weight: bold; color: #FFF; text-transform: uppercase; text-align: center; line-height: 20px; transform: rotate(45deg); width: 100px; display: block; background: #79A70A; background: linear-gradient(#F70505 0%, #8F0808 100%); box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1); position: absolute; top: 19px; right: -21px; }
.red-ribbon span::before { content: ""; position: absolute; left: 0px; top: 100%; z-index: -1; border-left: 1px solid #8F0808; border-right: 1px solid transparent; border-bottom: 1px solid transparent; border-top: 3px solid #8F0808; }
.red-ribbon span::after { content: ""; position: absolute; right: 0px; top: 100%; z-index: -1; border-left: 1px solid transparent; border-right: 1px solid #8F0808; border-bottom: 1px solid transparent; border-top: 3px solid #8F0808; }

.collapse-faq-style1 {margin-top:20px;}
.collapse-faq-style1 a.faq-question {color:#777}

.dataTables_wrapper {padding-top:10px;}
.data-table-phone {min-width:70px}
table.dataTable thead th:hover:after {color:#0077be;opacity:1;-moz-transition: 0.4s; -webkit-transition: 0.4s; transition: 0.4s}


/* Large Devices, Wide Screens */
@media only screen and (min-width : 1024px) {
    li.slideshow-description h1 {font:300 45px/50px 'Open Sans', sans-serif;}
    li.slideshow-description h1, li.slideshow-description h2 {width:550px;}
}
@media only screen and (max-width : 1250px) {
    .right-control-panel {max-width:320px;max-height:40px;overflow:hidden}
}
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {    
    /* 7.3. MEDIA CENTRE
    ---------------------------------------------------------------*/
    .news-item-wrapper {position:relative;padding-left:10px}
    .news-item .circle { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #fff; border: 2px solid #f3f3f3; height: 43px; position: relative; width: 43px;left:-10px; }
    .news-item .media-list-thumb-wrap {width:100%;max-height:250px;overflow:hidden;}
    .governance-wrapper .news-item .media-list-thumb-wrap {width:25%;max-height:200px;min-height:200px;}
    .news-item .media-list-thumb-wrap img {width:600px;min-height:201px;}
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
   
    /* 3.6. SUBPAGE BANNER
    ---------------------------------------------------------------*/
    .title-banner {padding:30px 0 20px 0;} 
    
    /* 7.3. MEDIA CENTRE
    ---------------------------------------------------------------*/
    .news-item-wrapper {position:relative;padding-left:20px}
    .news-item .circle { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #fff; border: 2px solid #f3f3f3; height: 43px; position: relative; width: 43px;left:0px; }
    .news-item .media-list-thumb-wrap {width:100%;max-height:250px;overflow:hidden;}
    .governance-wrapper .news-item .media-list-thumb-wrap {width:60%;max-height:300px;min-height:280px;margin-left:20px;margin-bottom:0;}
    
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
    
    /* 3.6. SUBPAGE BANNER
    ---------------------------------------------------------------*/
    .title-banner {padding:30px 0 20px 0;} 
    .right-control-panel {max-width:100%;}
    
    /* 7.3. MEDIA CENTRE
    ---------------------------------------------------------------*/
    .news-item-wrapper {position:relative;padding-left:50px}
    .news-item .circle { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background-color: #fff; border: 2px solid #f3f3f3; height: 43px; position: relative; width: 43px;left:0px; }
    .news-item .media-list-thumb-wrap {width:100%;min-height:250px;max-height:280px;overflow:hidden;}
    .governance-wrapper .news-item .media-list-thumb-wrap {width:60%;min-height:320px;max-height:320px;}
    
    .footer-social-icons ul {list-style:none;padding:0;margin:0;text-align:center;}

    #map { width: 100%; height: 400px;max-height:400px;position:absolute;z-index:3 }
    .contact-form .form-group {padding-bottom:15px;}
    .contact-form .form-group.select-field {padding-bottom:25px;}
    .contact-titles .inner {padding-left:20px;}
    .contact-form .form-group #form-contact-submit {display:block;width:100%;font-size:16px;font-weight:bold;}
    .fire-ban-msg {width:auto;}
    .fire-ban-msg, .fire-ban-msg h2 {padding-bottom:10px;}
}
/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
    .governance-wrapper .news-item .media-list-thumb-wrap {width:80%;min-height:300px;max-height:300px;}
}
/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {

}
@media only screen and (max-width : 1250px) {
    .right-control-panel {max-width:320px;max-height:40px;overflow:hidden}
}
@media (max-width:1038px) and (min-width:993px) {
    .language-selector {
        display:none;
    }
    .right-control-panel {max-width:240px;max-height:40px;overflow:hidden}
}​


    /* 22. CONCRETE 5 OVERIDES
    ---------------------------------------------------------------*/
    li#ccm-white-label-message, #page-edit-nav-mediacentre {display:none !important;}
    body.modal-open {margin-right: 0 !important;padding-right: 0px !important;}



ul.pubnotice {border:2px solid #616161;border-top-width:8px;border-bottom-width:8px;padding:15px 15px 119px 15px;width:auto;margin-top:20px;max-width:50%;min-width:250px;color:#616161 !important;list-style:none;background:url(img/pubnotice-logo.png) no-repeat bottom right;}
ul.pubnotice li {list-style:none;font-size:10px !important;color:#616161 !important;line-height:normal !important;}
ul.pubnotice li ul li {list-style:disc;}
.pubnotice h2 {font-size:25px !important;color:#616161 !important;line-height:normal !important;}
.pubnotice h3 {font-size:14px !important;color:#616161 !important;margin-top:0;line-height:normal !important;} 



/* 23. PARTICIPATE GIPPSLAND TIMELINE  
---------------------------------------------------------------*/
.timeline {
    list-style: none;
    padding: 20px 0 20px;
    position: relative;
}

    .timeline:before {
        top: 0;
        bottom: 0;
        position: absolute;
        content: " ";
        width: 3px;
        background-color: #eeeeee;
        left: 50%;
        margin-left: -1.5px;
    }

    .timeline > li {
        margin-bottom: 20px;
        position: relative;
    }

        .timeline > li:before,
        .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li:before,
        .timeline > li:after {
            content: " ";
            display: table;
        }

        .timeline > li:after {
            clear: both;
        }

        .timeline > li > .timeline-panel {
            width: 46%;
            float: left;
            border: 1px solid #d4d4d4;
            border-radius: 2px;
            padding: 20px;
            position: relative;
            -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
            box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);
        }

            .timeline > li > .timeline-panel:before {
                position: absolute;
                top: 26px;
                right: -15px;
                display: inline-block;
                border-top: 15px solid transparent;
                border-left: 15px solid #ccc;
                border-right: 0 solid #ccc;
                border-bottom: 15px solid transparent;
                content: " ";
            }

            .timeline > li > .timeline-panel:after {
                position: absolute;
                top: 27px;
                right: -14px;
                display: inline-block;
                border-top: 14px solid transparent;
                border-left: 14px solid #fff;
                border-right: 0 solid #fff;
                border-bottom: 14px solid transparent;
                content: " ";
            }

        .timeline > li > .timeline-badge {
            color: #fff;
            width: 50px;
            height: 50px;
            line-height: 50px;
            font-size: 1.4em;
            text-align: center;
            position: absolute;
            top: 16px;
            left: 50%;
            margin-left: -25px;
            background-color: #ccc;
            z-index: 100;
            border-top-right-radius: 50%;
            border-top-left-radius: 50%;
            border-bottom-right-radius: 50%;
            border-bottom-left-radius: 50%;
        }

        .timeline > li.timeline-inverted > .timeline-panel {
            float: right;
        }

            .timeline > li.timeline-inverted > .timeline-panel:before {
                border-left-width: 0;
                border-right-width: 15px;
                left: -15px;
                right: auto;
            }

            .timeline > li.timeline-inverted > .timeline-panel:after {
                border-left-width: 0;
                border-right-width: 14px;
                left: -14px;
                right: auto;
            }

.timeline-badge.primary {
    background-color: #2e6da4 !important;
}

.timeline-badge.success {
    background-color: #3f903f !important;
}

.timeline-badge.warning {
    background-color: #f0ad4e !important;
}

.timeline-badge.danger {
    background-color: #d9534f !important;
}

.timeline-badge.info {
    background-color: #5bc0de !important;
}

.timeline-title {
    margin-top: 0;
    color: inherit;
}

.timeline-body > p,
.timeline-body > ul {
    margin-bottom: 0;
}

    .timeline-body > p + p {
        margin-top: 5px;
    }
    
.timeline > li .datetimeline {display:inline;float:right;padding-top:6px;}

@media (max-width: 767px) {
    ul.timeline:before {
        left: 40px;
    }

    ul.timeline > li > .timeline-panel {
        width: calc(100% - 90px);
        width: -moz-calc(100% - 90px);
        width: -webkit-calc(100% - 90px);
    }

    ul.timeline > li > .timeline-badge {
        left: 15px;
        margin-left: 0;
        top: 16px;
    }

    ul.timeline > li > .timeline-panel {
        float: right;
    }

        ul.timeline > li > .timeline-panel:before {
            border-left-width: 0;
            border-right-width: 15px;
            left: -15px;
            right: auto;
        }

        ul.timeline > li > .timeline-panel:after {
            border-left-width: 0;
            border-right-width: 14px;
            left: -14px;
            right: auto;
        }
}