@charset "utf-8";

/* Gold Coast City Council - goldcoast.qld.gov.au
---------------------------------------------------

[Content Stylesheet]

[Table of contents]

1. Text Styles
		1.1  Link Styles
		1.2  Heading Styles
2. Button Styles 
3. List Styles
		3.1  Lists with Images
		3.2  Lists with Labels
		3.3  Lists with Red Arrows
4. Split List Styles
		4.1  Split 2
		4.2  Split 3
		4.3  Split 4
5. Generic Styles
		5.1  Responsive Images
6. Table Styles
7. Accessibility
8. Column Layouts
9.	RSS Feed Viewer - Home only
10. Announcement Box
11. Vision Statement
12.	Full Width Panel
13.	Full Width with Panel Image Left
14. Full Width Panel with Button
15. Full Width Panel with BG Image
16.	Full Width Panel with Gray Background
17.	3 Column Colour Headings
18.	Colour Pallette
19. Toggle Frames

/*====================================
1.	TEXT STYLES
=====================================*/

p {
	color:#3a4b5b;
	margin-bottom:15px;
	font-size:0.813em;
}
.temp-notice p  {
	color:#8d1616;
}
a[target="_blank"] {
	margin-right:2px;
	padding:3px 15px 2px 0; 
}
a.has-img {
	background:none;
	padding:0;
}
a[href^="mailto:"] {
	padding:3px 0 2px 22px;
	text-decoration:none }
	
a[href$=".pdf"], a[href$=".PDF"] {
	padding:3px 0 2px 22px;
	text-decoration:none }

a[href$=".doc"], a[href$=".DOC"], a[href$=".docx"], a[href$=".DOCX"] {
	padding:3px 0 2px 22px;
	text-decoration:none }

a[href^="tel:"] {
		color:#3a4b5b;
		text-decoration:none; }
	
	a[href^="tel:"]:hover, a[href^="tel:"]:visited, a[href^="tel:"]:active {
		color:#3a4b5b;
		text-decoration:underline;}

a.no-icon {
	background:none !important;
	padding:0 !important
}

a.rel-info, a.rel-form, a.rel-faqs {
	margin-left:2px;
	padding: 0 0 3px 19px;
}
p a.rel-info, p a.rel-faqs, p a.rel-form {
	text-decoration:none;
}
p a.rel-info:hover, p a.rel-info:focus, p a.rel-faqs:hover, p a.rel-faqs:focus, p a.rel-form:hover , p a.rel-form:focus{
	text-decoration:underline;
}
a.form{
	padding:3px 0 2px 22px; }
	
a.icon-sml {
	padding: 2px 0 3px 22px;
}
h2.privacyNotice {
	font-size: 0.8em;
	margin-bottom: 10px;
}
p.privacyNotice {
    font-size: 0.71em;
    line-height: 1.5em;
}
.filesize {
	font-size: 0.81em;
	color:#595959;
	letter-spacing:.02em
}
p.caption {
	color:#868a89;
	margin:5px 5px 15px 0px;
	font-size: 0.81em !important;
	line-height:1.6em
}
p.sml-font, ul.sml-font li {
	font-size: 0.81em !important;
}
li p.caption {
	font-size:0.82em !important;
}
p.credit, p.note, span.note {
	font-size: 0.81em;
	color:#595959;
}
p.help-text {
	height:0px;
	margin-bottom:0px;
	text-indent:-9999px;
}
p.map-link {
	padding-left:24px;
}
span.map-link {
	display:inline-block;
	padding:2px 0 2px 24px;
}
.centre {
	text-align:center;
}
.img-shad {
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.25) inset;
}
h2.key-info {
	clear:both;
	margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #f1f1f1;
}
ul li h2 {
	font-size:1.125em;
}

/* 1.1  Link Styles
------------------------------------ */

a {
	color:#c4004b;
	font-size:100%;
	text-decoration:none;
}
a:active, a:visited {
outline: none;
}
a:focus, a:visited {
/*-moz-outline-style: none;*/
}
a:focus, a:hover {
	text-decoration:underline;
}

/* 1.2  Heading Styles
------------------------------------ */

h1, .heading {
	color:#434244;
	font-size:1.000em;
	margin-bottom:25px;
	font-weight:bold;
	/*text-shadow:0 1px #fff;*/
}
h1.wrap {
	width:395px;
}
h1 a {
	color:#004166;
}
h2 {
	color:#434244;
	font-size:0.875em;
	margin-bottom:15px;
	font-weight:bold
}
h2 a {
	color:#434244;
}
h3 {
	color:#434244;
	font-size:0.813em;
	margin-bottom:15px;
	font-weight:bold
}
h3 a {
	color:#434244;
}
h3.title {
	margin-bottom:10px;
}
h4 {
	color:#434244;
	margin-bottom:5px;
	font-size:0.813em;
}
h2.full-width {
	background:#F1F1F1;
	border-bottom:1px solid #d2d2d2;
	font-size:0.750em;
	margin:0 -25px 25px -25px;
	padding:5px 0 5px 25px;
}

/*====================================
2.	BUTTON STYLES
=====================================*/

a.button {
	background-position:-0px -79px;
	color:#3A4B5B;
	display:inline-block;
	font-size:11px;
	height:20px;
	line-height:11px;
	margin-right:25px;
	padding:8px 0px 0px 15px;
	position:relative;
}
a.button span {
	background-position:-175px -79px;
	height:28px;
	padding-right:25px;
	position:absolute;
	top:0;
	right:-25px;
}
a.button:hover, a.button:focus, a.button.hover{
	background-position:-200px -79px;
	background-color:transparent;
	border:none;
	color:#fff;
	text-decoration:none;
	cursor: pointer;
}
a.button:hover span, a.button:focus span, a.button.hover span {
	background-position:-375px -79px;
	background-color:transparent;
	border:none;
}
.back-button {
	margin-bottom:25px;
}
a.back {
	background-position:-0px -108px;
	color:#3A4B5B;
	display:inline-block;
	font-size:11px;
	height:20px;
	line-height:11px;
	margin:0 15px 0 0;
	padding:8px 0 0px 25px;
	position:relative;
}
a.back span {
	background-position:-185px -108px;
	height:28px;
	padding-right:15px;
	position:absolute;
	top:0;
	right:-15px;
}
a.back:hover, a.back:focus{
	background-position:-200px -108px;
	background-color:transparent;
	border:none;
	color:#fff;
	/*text-shadow:none;*/
	text-decoration:none;
}
a.back:hover span, a.back:focus span {
	background-position:-385px -108px;
}
a.button.down span {
	background-position:-409px -255px;
}
a.button.down:hover span, a.button.down:focus span {
	background-position:-442px -255px;
}
a.button.no-arrow {
	background-position:-291px -289px;
	color:#3A4B5B;
	display:inline-block;
	font-size:11px;
	height:20px;
	line-height:11px;
	margin-right:15px;
	padding:8px 0px 0px 15px;
	position:relative;
}
a.button.no-arrow span {
	background-position:-961px -289px;
	height:28px;
	padding-right:15px;
	position:absolute;
	top:0;
	right:-15px;
}
a.button.no-arrow:hover, a.button.no-arrow:focus{
	background-position:-291px -321px;
	background-color:transparent;
	border:none;
	color:#fff;
	text-decoration:none;
}
a.button.no-arrow:hover span, a.button.no-arrow:focus span {
	background-position:-961px -321px;
	background-color:transparent;
	border:none;
}
a.online-form {
	background-position:-0px -283px;
	padding-left:30px;
	font-weight:bold;
}
a.online-form:hover, a.online-form:focus{
	background-position:0px -315px;
	background-color:transparent;
	color:#fff;
	text-decoration:none !important;
}
p.online-form {
	margin:10px 0 15px 0 !important;
}
a.anchor.button {
	position: absolute;
    right: 156px;
    top: 19px;
}
.ghostButton {
	padding: 8px 48px !important;
	display: inline-block;
	text-decoration: none;
	font-size: 0.9em;
	font-weight: bold;
	background: none !important;
}
.ghostButton:hover, .ghostButton:active, .ghostButton:focus {
	background: rgba(0, 0, 0, 0.05) !important;
	text-decoration: none;
}
a.ghostWatermelon {
	border: 1px solid #e41150;
	color: #e41150;
}
a.ghostTeal {
	border: 1px solid #339ba9;
	color: #0090a5;
}
a.ghostCharcoal {
	border: 1px solid #878481;
	color: #605d5d;
}
a.ghostWhite {
	border: 1px solid #ccc;
	color: #f1f1f1;
}
.ghostWhite:hover, .ghostWhite:active, .ghostWhite:focus {
	background: rgba(255, 255, 255, 0.1) !important;
}
.boxedButton {
    padding: 10px 26px;
    display: inline-block;
	text-decoration: none;
	font-size: 0.9em;
    font-weight: bold;
}
a.boxedButtonTeal {
	background-color: #0091a5;
    color: #fff;
}
.boxedButtonTeal:hover, .boxedButtonTeal:focus {
	background-color: #009eb6;
}

/*====================================
3.	LIST STYLES
=====================================*/

#page ul {
	padding:0;
	margin:0px 0 15px 15px ;
}
#page ul.dash{
list-style-content:"-"
}
#page ul ul {
	margin:10px 0 0px 15px;
}
#page ol ul {
	margin:10px 0 0px 15px;
}
#page ul li p, #page ul li h3 {
	font-size:1em;
}
#page ul.biglist li {
	padding-bottom:15px;
}
#page ul.nodot {
	list-style-image:none;
	margin-left:0px;
}
#page ul.nodot li {
	padding-left:0;
}
#page li.nodot {
	list-style-image:none;
	margin-left:-15px;
}
/* ============== BEGIN SUBLIST STYLES ===============*/

#page ul.sublist {
	list-style-image:none;
	margin: 0 0 0 6px;
	display: table;
}
#page ul.sublist > li {
	display: table-row;
}
#page ul.sublist > li:before {
  content: "-\00a0";
  display: table-cell;
}

 /*============== END SUBLIST STYLES ===============*/
#page ul.border {
	border-bottom:1px dotted #d2d2d2;
	padding-bottom:15px;
}
#page li {
	font-size:0.813em;
	padding:0 0 5px 5px;
}
#page ul.inside {
	list-style-position:inside;
}
#page ul.center li {
	text-align:center;
}
#page li li {
	font-size:01em;
}
#page ol {
	margin:0px 0 15px 15px;
	list-style-type:decimal
}
#page ol li ol.alpha {
	list-style-type: lower-alpha;
}
.inline-list {
	float:left;
	width:100%;
}
.inline-list li {
	float:left;
	width:50%;
}
#featureBox ul {
    padding: 0;
    margin: 0px 0 15px 25px;
}

/* 3.1  Lists with Images
------------------------------------ */

#page ul.has-image li {
	border-bottom:1px dotted #E2E2E2;
	clear:left;
	float:left;
	margin-bottom:15px;
	padding-bottom:15px;
	width:100%;
}
#page ul.has-image li .content {
	float:left;
}


/* 3.2  Lists with Labels
------------------------------------ */
#page ul.label-list li {
	position:relative;
	padding-left:75px;
}
#page ul.label-list .label {
	position:absolute;
	left:0;
}

/* 3.3  Lists with Red Arrows
------------------------------------ */
#page ul.arrowList a {
    color: #3a4b5b;
}

/*====================================
4.	SPLIT LIST STYLES
=====================================*/

/* 4.1  Split 2
------------------------------------ */

#page .split-list2 {
	overflow:hidden;
	margin-bottom:15px;
	width:100%;
}
#page .split-list2 ul.split2 {
	margin-bottom:0px;
    width:43%;
	padding-right:4%;
	float:left
}
#page .split-list2 ul.split2.nodot {
    width:46%;
}
#page .split-list2 ul.last, #page .split-list2 ul.nodot.last {
	margin-right:-4%;
}
#page .split-list2 ul.split2.border {
	width:42%;
}
#page .split-list2 ul.split2.border.listCol1 {
	border-right:1px dotted #e2e2e2;
}
#page .split-list2 ul.split2.border li {
	border-bottom:1px dotted #e2e2e2;
	margin-bottom:15px;
}

/* 4.2  Split 3
------------------------------------ */

#page .split-list3 {
	overflow:hidden;
	margin-bottom:15px;
	width:100%;
}
#page .split-list3 ul.split3 {
	margin-bottom:0px;
    width: 205px;
	margin-right:15px;
	float:left
}
#page .split-list3 ul.split3.nodot {
	width:220px;
}
#page .split-list3 ul.last {
	margin-right:0px;
}

/* 4.3  Split 4
------------------------------------ */

#page .split-list4 {
	overflow:hidden;
	margin-bottom:15px;
	width:100%;
}
#page .split-list4 ul.split4 {
    width: 146px;
	margin-bottom:0px;
	margin-right:15px;
	float:left
}
#page .split-list4 ul.split4.nodot {
	width:161px;
}
#page .split-list4 ul.last {
	margin-right:0px;
}

/*====================================
5.	GENERIC STYLES
=====================================*/

hr {
	border:0px; 
	border-top:1px dotted #e2e2e2; 
	height:0px;
	clear:both;
	margin:25px 0 25px 0;
}
.right {
	float:right;
}
.left {
	float:left;
}
.img-right {
	float:right;
	margin-left:25px;
	margin-bottom:15px;
	clear:right;	
}

.img-left {
	float:left;
	margin-right:25px;
	margin-bottom:15px;
	clear:left;
}

.rightSplit {
    float: right;
    margin: -35px 0 15px 25px;
	clear: right;
}

.rightSplit img {
    width: 300px;
    height: auto;
    max-width: 1200px;
}

#page span.enlarge {
    color: #3A4B5B;
	font-size:11px;
	padding-left:22px;
	margin-left:0px;
	display:block;
	width:85px;
}
.clear {
	clear:both;
}
img { font-size:0px
}
.hidden {
	display:none;
}

.no-margin { margin:0 !important }

.marg-btm {
	margin-bottom:15px;
}
.marg-top {
	margin-top:15px;
}
.pad-top-ten {
	padding-top:10px;
}
.pad-bot-ten {
	padding-bottom:10px;
}
.pad-top-fift {
	padding-top:15px;
}
pad-bot-fift {
	padding-bottom:15px;
}
.clearfloat {
	clear: both;
	height: 0;
	line-height: 0.0;
	font-size: 0;
}
span.main-anchor {
	position:absolute;
}
textarea { overflow:auto; }

caption {
	color:#0066A0;
	font-weight:bold;
	margin-bottom:5px;
}	
ul.ovflw li {
	overflow:hidden;
}
.ovflw {
	overflow:hidden;
}
.bluebox {
	background:#F6FAFF;
    border: 1px solid #d9e1ec;
	float:left;
	padding:15px;
	margin-bottom:25px;
}
.yt-video {
	position: relative;   
    padding-bottom: 56.25%; /* 16/9 ratio */   
    padding-top: 30px; /* IE6 workaround*/   
    height: 0;   
    overflow: hidden;
	margin-bottom: 25px;
}
.yt-video object, .yt-video embed, .yt-video iframe {
	position: absolute;   
    top: 0;   
    left: 0;   
    width: 100% !important;   
    height: 100% !important;
}
.yt-video-half {
	margin: 0 0 25px 25px;
	float: right;
}
.yt-video-half object, .yt-video-half embed, .yt-video-half iframe {
    width: 345px;   
    height: 194px;
}
.googlemap, #googlemap {
	position: relative;   
    padding-bottom: 56.25%; /* 16/9 ratio */   
    padding-top: 30px; /* IE6 workaround*/   
    height: 0;   
    overflow: hidden;
	margin-bottom: 25px;
}
.googlemap.large, #googlemap.large {
	height:350px;
}
.googlemap object, .googlemap embed, .googlemap iframe, #googlemap object, #googlemap embed, #googlemap iframe {
	position: absolute;   
    top: 0;   
    left: 0;   
    width: 100% !important;   
    height: 100% !important;
}
.googlemap-half, #googlemap-half {
	margin: 0 0 25px 25px;
	float: right;
}
.googlemap-half object, .googlemap-half embed, .googlemap-half iframe, #googlemap-half object, #googlemap-half embed, #googlemap-half iframe {
    width: 345px;   
    height: 194px;
}
.googlemap h3, #googlemap h3 {
	font-size:100%;
	margin-bottom:5px;
}
#waste-map, #nature-map {
	position:relative;
}
#waste-map #overlay {
	background:#fff;
	background: rgba(255,255,255,0.9);
	position: absolute;
	right: 5px;
	top: 33px;
	width: 160px;
	margin: 0;
	z-index: 40;
	padding: 15px;
	box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.3);
	border-radius: 2px;
}
#waste-map #overlay h2 {
	font-size: 11px;
}
#waste-map #overlay .filters label {
	font-size: 11px;
}
#waste-map #overlay .filters input {
	float: left;
	margin: 4px 4px 0 0;
}
#nature-map #overlay {
	background:#fff;
	background: rgba(255,255,255,0.9);
	position: absolute;
	right: 5px;
	top: 5px;
	width: 190px;
	margin: 0;
	z-index: 40;
	padding: 15px;
	box-shadow: 0 1px 4px 0px rgba(0, 0, 0, 0.3);
	border-radius: 2px;
}
#nature-map #overlay h2 {
	font-size: 13px;
}
#nature-map #overlay .filter {
 	background: #e6e6e6;
    clear: left;
    display: block;
    font-size: 11px;
    margin-bottom: 10px;
    padding: 5px;
}
#nature-map #overlay .filter label {
	font-size: 11px;
}
#nature-map #overlay .filter input {
	float: left;
    margin: 4px 8px 0 0;
}
#nature-map #overlay .filter img {
	display: inline-block;
    float: right;
    margin-left: 5px;
    width: 20px;
}
div.img-spacer img {
	margin:0 10px 0 0;
}
.testimonial {
    background: none repeat scroll 0 0 #FFFFCC;
    border: 1px solid #CCCCCC;
    font-family: "Courier New",Courier,monospace;
    margin: 0 0 10px;
    padding: 1.8em 1em 1em 1em;
}
.map-reset {
	float:right;
	margin-bottom:10px;
}
#survey {
    border: 1px solid #78a0a2;
    height: 50px;
    margin: 0 auto 15px;
    text-align: center;
    width: 1087px;
}
#survey span {
	color:#36474f;
	display:block;
	font-weight:bold;
	font-size:12px;
	padding:15px 0;
}
#survey span.ext-icon {
	display:inline;
	margin-left:10px;
}

/*=======================
5.1 Responsive image classes
=======================*/
.ImgRight {
	float:right;
	margin-left:25px;
	margin-bottom:15px;
	clear:right;
}
.ImgRight img{
	width:200px;
	height:auto;
}

.ImgLeft{
	float:left;
	margin-right:25px;
	margin-bottom:15px;
	clear:left;
}
.ImgLeft img{
    width:200px;
	height:auto;
}
.ImgFull {
	display: block;
	margin-bottom: 15px;
}
.ImgFull img{
	width: 100%;
	height: auto;
}
/*====================================
6.	TABLE STYLES
=====================================*/

table {
	background:#d2d2d2;
	border-spacing:1px;
	font-size:0.813em;
	margin-bottom:25px;
	width:100%;
	font-size:11px;
	line-height:16px;
}
table.halftable {
	width:50%;
}
table th {
	background:#f1f1f1;
	font-weight:bold;
	padding:5px;
}
/*table tr.alt td {
	background:#fff;
}*/
table td {
	background:#fff;
	padding:5px;
}
table p, table li {
	font-size:100%;
}
table.fulltable ul{margin-bottom:0px!important;}
table.fulltable ul li{font-size:1em!important;}


/* Following styles specific to tables on Immuisation clinic page */
table.immunisation {
	width: 48%;
}
table.immunisation td h3 {
	font-size: 100%;
}
table.immunisation td p.map-link {
	margin-bottom: 0;
}
table.vaccines td h3 {
	font-size: 100%;
	margin-bottom: 0;
}
table.fulltable.parks-table tbody tr td:nth-child(n+2){
text-align:center;
}
/* custom styles for persistent header - sports field closures */
.floatingHeader { position: fixed; top: -1px; visibility: visible; width: 689px; display: inline-table; margin: 0; padding: 0; border-bottom: 1px solid #ccc; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr.persist-header.alt.floatingHeader { opacity: .7; border-spacing: 0; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr td.col1 { width: 30%; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr td.col2 { width: 15%; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr td.col3 { width: 20%; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr td.col4 { width: 15%; }
table.fulltable.parks-table.persist-area.floatingHeader-active tbody tr td.col5 { width: 20%; }

/*====================================
7.	ACCESSIBILITY
=====================================*/

kbd {
    background: none repeat scroll 0 0 #FFFFCC;
    border: 1px solid #CCCCCC;
    font-size: 1em;
    padding: 0 0.6em;
}

.ui-mobile .jqm-content .jqm-deeplink:nth-child(2) { margin-left: 14px; }

/*====================================
8.	COLUMN LAYOUTS
=====================================*/

.column-layout {
	float:left;
	margin:15px 0 15px 0;
} 
.two-col {
	float:left;
	padding-right: 25px;
	width: 332px; 
}
.two-col-border {
	border-right:1px dotted #e2e2e2;
	float:left;
	padding-right: 25px;
	margin-right:24px;
	width: 320px; 
}		
.three-col {
	float: left;
	padding-right: 25px;
	width: 213px; }
.four-col {
	float: left;
	padding-right: 25px;
	width: 153px; }
 
.column-layout div.last { padding-right: 0px; margin:0; border:none; }
 
.column-layout .caption	{
	margin-bottom:0;
}

/* GENERIC Tiles ==================================*/
.tile-container {
    margin: 20px -10px 0 -10px;
    display: flex;
    flex-wrap: wrap;
}
.tile {
	box-sizing: border-box;
	width: 33.33%; 
	display: flex;
    padding: 0 10px 20px 10px;
}
.tile .tile-inner {
	border-bottom: 1px solid #e2e2e2;
	display: table;
	position: relative;
	width: 100%;
	height: 100%;
	background: #f6f6f6;
}
.tile .tile-inner:hover, .tile .tile-inner:focus { 
	border-bottom: 1px solid #a3a2a2;
    box-shadow: 0 1px 2px -1px rgba(0, 0, 0, 0.35);
	cursor: pointer;
}
.tile .tile-inner img {
	width: 100.3%;
	height: auto;
}
.tile .tile-inner .tile-text {
	padding: 15px;
}
.tile .tile-inner .tile-text p {
	margin-bottom: 0;
}
.tile .tile-inner .tile-text a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	overflow: hidden;
}
/* Simple tile --------------------------------------- */
.tile .simpleTile-inner img {
    width: 100.3%;
    height: auto;
	margin-bottom: 20px;
}
.tile .simpleTile-inner .tile-text a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	overflow: hidden;
}
.tile .simpleTile-inner {
	display: table;
	position: relative;
	width: 100%;
	height: 100%;
}
.simpleTile-inner:hover h2 {
    color: #c4004b;
}
/* Icon Tiles -------------------*/
.iconTiles .tile .tile-inner {
	text-align: center;
  }
  .iconTiles .tile .tile-inner .tileIcon {
	min-height: 84px;
	position: relative;
  }
  .iconTiles .tile .tile-inner img {
	width: auto;
	height: auto;
	padding: 20px 0 0 0;
	position: absolute;
  bottom: 0;
  left: 35%;
  }
/* ################################### 3 COLUMN PORTAL STYLES #################################*/

#portal {
	height: 260px;
	margin:0 0 25px 0; }

#portal-inner {
	height: 220px;
	margin:25px 0 25px 0; }
 
.portal-column {
	float: left;
	padding-right: 25px;
	width: 213px; }
	
.portal-column h2 {
	text-transform: none;
}
.portal-column a.button {
	text-transform: none;
}
.portal-column img { 
	margin-bottom: 15px; }
 
.last { padding-right: 0px; }
 
.portal-column li {
	padding:0 0 5px 0 !important; }
	
.portal-column ul li a{
	color:#3A4B5B;
}
.portal-column ul li a:hover{
	color:#c4004b;
}

/* ################################### Payments page custom styles  #################################*/

.pay-head h2 {
	background:#F1F1F1;
	border-bottom:1px solid #e2e2e2;
	font-size:0.750em;
	margin:0 -25px 25px -25px;
	padding:5px 0 5px 25px;
}
.pay-code {
	float:left;
	margin-bottom:15px;
}
.bp-logo {
	float:left;
	margin-right:15px;
}
.pay-box {
	border:1px solid #3A4B5B;
	padding:5px 5px 5px 15px;
	float:left;
	width:248px;
}
.pay-box p {
	margin-bottom:3px;
}
.pay-tile-full {
	border-color:#CFE2ED;
	border-style:solid;
	border-width:1px 0 0 0;
}
.pay-tile-left {
	border-color:#CFE2ED;
	border-style:solid;
	border-width:1px 1px 0 0;
	float:left;
	width:344px;
}
.pay-tile-right {
	border-top:1px solid #CFE2ED;
	float:left;
	width:345px;
}
.pay-tile-head {
	background:#F5FBFF;
	border-bottom:1px solid #CFE2ED;
	padding:10px 15px 10px 15px;
}
.pay-row h3 {
	margin:0;
}
.pay-tile-body {
	padding:15px 
}
.pay-code-box {
	border:1px solid #3A4B5B;
	padding:5px 5px 5px 15px;
	margin-bottom:15px;
}
.pay-code-box p {
	margin-bottom:3px;
}
.postbill {
	border-top:1px solid #CFE2ED
}
.blogo {
	float:left;
	margin-right:15px;
	margin-top:-7px;
}

/* ################################### Mayor & Councillors custom styles  #################################*/

.col2-tile {
	border-bottom:1px dotted #e2e2e2;
	float:left;
	margin-right:50px;
	margin-bottom:25px;
	min-height:180px;
	width:320px;
}
.col2-tile h3 {
	margin-bottom:5px;
}
.col2-tile.last {
	margin-right:0;
}
/* ################################### Site Map custom styles  #################################*/

#site-map {
	font-size:.875em;
}
#site-map .split-list3 {
	margin-top:10px;
}
#site-map .split-list3 ul li {
	margin-bottom:10px;
}
#site-map .split-list3 ul li ul {
	margin-left:25px;
}
#site-map .split-list3 ul li ul li {
	border:none;
	margin-bottom:0;
	padding-bottom:5px;
}
#site-map .split-list3 ul li a {
	font-weight:bold;
	display:block;
	padding:5px 5px 5px 15px;
	background:#fbfbfb;
	border-bottom:1px solid #e2e2e2;
}
#site-map .split-list3 ul li ul li a {
	font-weight:normal;
	display:inline;
	padding:0;
	background:none;
	border:none;
	color:#3A4B5B;
}
#site-map .split-list3 ul.sm-split {
	margin-bottom:0px;
    width: 205px;
	margin-right:15px;
	float:left
}
#site-map .split-list3 ul.sm-split.nodot {
	width:220px;
}
#site-map .split-list3 ul.last {
	margin-right:0px;
}
#site-map .split-list3 ul li a[title="404 - Page Not Found"] {
	display:none;
}

/* ################################### Custom styles for Add This  #################################*/

.addthis_32x32_style {
	position:absolute;
	top:75px;
	left:-30px;
}
.addthis_32x32_style .addthis {
	margin:0;
	padding:0;
	background:none;
	display:block;
}
.addthis_32x32_style .addthis .at-icon-wrapper, .addthis_32x32_style .addthis .at-icon-wrapper .at-icon {
	width:32px !important;
	height:32px !important;
}
/* ################################### CIP Image Rollover custom styles  #################################*/

.imageRoll-GS{
	display: block;
	width: 448px;
	height: 201px;
	text-indent: -99999px;
}
.imageRoll-GS:hover {
	background-position: 0 0;
}
/* ################################### Council Websites page custom styles  #################################*/

#csites .split-list3 ul.split3 li {
	text-align:center;
	margin-bottom:25px;
}	

/* ################################### Major Events page custom styles  #################################*/

.major-event {
	float:left;
	width:515px;
}

/* ################################### Mobile App page custom styles  #################################*/
.app-store{
	width: 170px;
	height: 280px;
	float: left;
	text-align: center;
	margin-right: 10px;
}
div.desc.blackberry .app-store{
	height:auto;
}
.sys-requirements{ 
	font-weight:bold; 
	border-bottom:1px solid #999; 
	padding-bottom:10px;
}
.related-heading h2.mobile-icon {
    background-position: 0 -330px;
    margin-bottom: 0;
    padding: 3px 0 6px 45px;
}
/* ################################### Community Centres map page custom styles  #################################*/

ul.map-list li {
	border-bottom:1px dotted #e2e2e2;
	padding-bottom:10px !important;
	margin-bottom:10px;
}
ul.map-list li span.map-link {
	padding:3px 0 2px 20px;
	margin-left:5px;
}
ul.map-list li h2.mtop {
	margin-top:25px;
}
/* ################################### Rates Enquiry form custom styles  #################################*/

.inline-radio input, .inline-radio label {
	float:left;
}
.inline-radio label {
	 margin-right:20px;
 }
.inline-radio br {
	display:none;
}
.input.full, .input.fcol {
	width:690px;
}
.input .notice-img {
	position:absolute;
	right:0;
	top:45px;
}
.notice-img-mobile {
	display:none;
}
.input .note {
	color:#868A89;
	clear:left;
	font-size:11px !important;
	padding:0;
	margin:0;
}
.rateCalendar {
	background:none !important;
	border:1px solid #d2d2d2 !important;
	margin:0 !important;
}
.rateCalendar td {
	background-color:transparent !important;
}
.rateCalendar tr [style="background-color:Silver;"] {
	background-color:#f1f1f1 !important;
	border-bottom:1px solid #d2d2d2;
}
.rateCalendar td, .rateCalendar th {
	text-align:center !important;
} 
.rateCalendar table {
	background:#f1f1f1;
	border:none !important;
	margin:0 !important;
}
.rateCalendar table td {
	background:#f1f1f1 !important;
	font-weight:bold;
}
.rateCalendar td [align="center" style="color:White;background-color:LightGreen;width:14%;"] {
	padding:0 !important;
}
.rateCalendar td a {
	margin:-5px;
	background:#f1f1f1;
	display:block;
	padding:5px;
}
.rateCalendar td.active a {
	background:#C4004B !important;
	color:#fff !important;
}
.rateCalendar td a:hover {
	background:#C4004B;
	color:#fff !important;
	text-decoration:none;
	
}
/* ################################### Supplier Details form custom styles  #################################*/
.supplier-category  {
	width: 100% !important;
}
.supplier-category-tree  {
	width: 320px !important;
	height: 200px;
}

.RadDropDownTree {
	width:320px !important;
}

/*====================================
X.	Park Detail Styles
=====================================*/

ul#park-facilities{
	list-style-image: none;
	margin-left:0px;
}

ul#park-facilities li{
	padding:10px 0 10px 30px;
	float:left;
	margin-right:10px;
	width:125px;
}

/*====================================
X.	Online Services Styles
=====================================*/

.onlineServicesIcon {
	float: left;
    margin-right: 20px;
	width: 50px;
	margin: 4px 20px 0 0;
}
.onlineServicesList {
		float: left;
		max-width: 250px;
}
.onlineServicesList ul {
	padding: 10px;
}

/*====================================
X.	TEST FORM
=====================================*/

#test-form table {
	background:none;
	border-spacing:0;
	font-size:13px;
	margin:0;
	width:auto !important;
}
#test-form table td {
	padding:0;
}
#test-form .webform_step div {
	margin-bottom:10px !important;
	padding:0 !important;
}
#test-form p.caption {
	color:#595959;
	font-size:11px !important;
	margin:0 !important;
}
#test-form p.caption.under-input {
	margin-top:5px !important;
}
#test-form label {
	font-size:13px;
	margin:0 !important;
}
#test-form input {
	margin:0 !important;
}
#test-form h2 {
	color:#017398;
	font-size:13px;
	border-bottom:1px dotted #d2d2d2;
	padding-bottom:5px;
	margin:25px 0 25px 0;
}
#test-form sup {
	color:#D70000;
}

/*====================================
9.	RSS Feed Viewer - Home only
=====================================
.rssBody ul { list-style: none; list-style-image:none!important; margin-left: 0 !important; }
.rssBody ul li.rssRow{border-bottom: 1px dotted #ccc; margin-bottom: 10px;}
.rssBody ul li.rssRow div{color: #595959; margin-bottom:3px;}
.rssBody ul li.rssRow h4{font-size:90%}
.rssBody ul li.rssRow h4 a{color: #434244}
.rssBody ul li.rssRow p{margin-bottom:5px!important}*/

.feedburnerFeedBlock ul{
	list-style: none; 
	list-style-image:none!important; 
	margin-left: 0 !important; 
	padding-left:0px;
}
.feedburnerFeedBlock ul li{
	border-bottom: 1px dotted #ccc; 
	margin-bottom: 10px;
	padding-left:0px!important;
}
.feedburnerFeedBlock ul li div{
	margin-bottom:10px!important;
	font-size: 85% !important;
}
.feedburnerFeedBlock ul li p.date{
	 color: #595959;
    font-size: 0.85em!important;
    letter-spacing: 0.02em;
	margin:0;
}	
.feedburnerFeedBlock ul li span.headline a{
	color: #434244;
	font-weight:bold;
	text-decoration:none;
	display:inline-block;
	text-overflow: ellipsis;
	overflow:hidden;
	white-space: nowrap;
	width:305px;
	margin:0;
	padding:0 15px 0 0;
}
.feedburnerFeedBlock ul li span.headline a:hover{
	text-decoration:underline;
}
#creditfooter{display:none;}

/*====================================
10.	Announcement Box
=====================================*/

.fullWidthAnnouncement {
    margin: 25px -25px;
	display: table;
}
.fullWidthAnnouncement > div {
		display: table-cell;
		padding: 30px;
}
.fullWidthAnnouncement p {
	padding: 0;
	margin: 0 0 16px 0;
}
.fullWidthAnnouncement p:last-child {
	margin: 0;
}
.fullWidthAnnouncement div.left {
	width: 150px;
	background: #e41150;
	color: #fff;
	text-align: center;
	float: none;
}
.fullWidthAnnouncement div.left h2 {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #fff;
    font-size: 1.2em;
    line-height: 1.3em;
    margin-bottom: 30px;
}
.fullWidthAnnouncement div.right {
	background: #f1f1f1;
	float: none;
}
.fullWidthAnnouncement div.right h2 {
	margin-bottom: 10px;
}

/*====================================
11.	Vision Statement
=====================================*/

.fullWidthVision {
    margin: 25px -25px;
	padding: 20px;
	background: #f1f1f1;
	text-align: center;
	box-sizing: border-box;
}
.fullWidthVision div {
	color: #8a8177;
	margin: 0 0 10px 0;
	padding: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1.1em;
	line-height: 1.2em;
}
.fullWidthVision h2 {
color: #ed1556;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 2em;
letter-spacing: -0.05em;
line-height: 1.0em;
margin: 0 0 6px 0;
padding: 0;
}
.visionThemes {
	max-width: 970px;
    margin: 10px auto 30px;
	width: 100%;
	text-align: center;
}
.visionThemes h3 {
	background: #f1f1f1;
	color: #ed1556;
    font-weight: bold;
    font-size: 0.9em;
    display: inline-block;
    padding: 10px 44px;
    margin: 3px;
}
@media screen and (max-width: 520px) {
	.visionThemes h3 {
		display: block;
	}
}

/*====================================
12.	Full Width Panel
=====================================*/

.fwPanel {
    margin: 25px -25px;
	width: 740px;
	padding: 25px;
	background: #f1f1f1;
	box-sizing: border-box;
	display: table;
}

.fwPanel h3 {
    color: #007889;
    border-bottom: 1px solid #339ba9;
    padding-bottom: 10px;
}

/*====================================
13.	Full Width Panel with Image Left
=====================================*/

.fwPanelImageLeft {
    margin: 25px -25px;
	width: 740px;
	padding: 25px;
	background: #f1f1f1;
	box-sizing: border-box;
	display: table;
}
.fwPanelImageLeft img {
    max-width: 200px;
}
.fwPanelImageLeft > div {
	display: table-cell;
}
.fwPanelImageLeft .right {
    padding: 0 30px;
	vertical-align: top;
	float: none;
	width: 100%;
}
.fwPanelImageLeft .ghostButton:hover, .fwPanelImageLeft .ghostButton:active, .fwPanelImageLeft .ghostButton:focus {
	background: rgba(255, 255, 255, 0.6) !important;
}
@media screen and (max-width: 700px) {
.fwPanelImageLeft img {
width: 100%;
height: auto;
max-width: 100%;
}
.fwPanelImageLeft > div {
	display: block;
}
.fwPanelImageLeft .right {
    padding: 0;
}
}

/*====================================
14.	Full Width Panel with Button
=====================================*/

.fwPanelwButton {
    margin: 25px -25px;
	width: 740px;
	padding: 25px;
	background: #f1f1f1;
	box-sizing: border-box;
	display: table;
}
.fwPanelwButton .left {
	display: table-cell;
	padding: 0;
	float: none;
}
.fwPanelwButton .right {
	display: table-cell;
    min-width: 230px;
    text-align: right;
	vertical-align: middle;
	float: none;
}
.fwPanelwButton .ghostButton:hover, .fwPanelwButton .ghostButton:active, .fwPanelwButton .ghostButton:focus {
	background: rgba(255, 255, 255, 0.6) !important;
}
@media screen and (max-width: 500px) {
.fwPanelwButton .right, .fwPanelwButton .left {
	display: block !important;
	text-align: left;
}
}

/*====================================
15.	Full Width Panel with BG Image
=====================================*/

.fwPanelwBgImage {
    margin: 25px -25px;
	width: 740px;
	background: #ccc;
	box-sizing: border-box;
	display: inline-block;
	background-repeat: no-repeat;
}
.fwPanelwBgImage .darkerBg {
	background: rgba(0, 0, 0, 0.6);
	max-width: 270px;
	display: inline-block;
}
.fwPanelwBgImage .left {
	padding: 25px;
}
.fwPanelwBgImage h2 {
	color: #fff;
}
.fwPanelwBgImage p {
	color: #fff;
}
@media screen and (max-width: 540px) {
.fwPanelwBgImage .darkerBg {
	max-width: 100%;
}
}

/*====================================
16.	Full Width Panel with Gray Background
=====================================*/

.fwPanelwGrayBg {
	margin: 40px -25px !important;
    width: 740px !important;
	background: #f1f1f1;
	box-sizing: border-box;
}
.fwPanelwGrayBg div {
	padding: 25px;
}
.fwPanelwGrayBg .split-list2, .fwPanelwGrayBg .split-list3 {
    margin-bottom: 0 !important;
    padding: 0 !important;
}

/*====================================
17.	3 Column Colour Headings
=====================================*/

.threeColColourHeadings {
    margin: 25px -25px;
	width: 740px;
	padding: 25px;
	box-sizing: border-box;
	display: table;
}
.threeColColourHeadings > div {
	min-width: 217px;
	display: table-cell;
	background: #f6f6f6;
	border-right: 20px solid #fff;
	margin-bottom: 20px;
	position: relative;
}
.threeColColourHeadings > div:last-child {
	border-right: 0;
	max-width: 216px;
}
.threeColColourHeadings img {
	width: 100%;
	display: block;
}
.threeColColourHeadings h2 {
	color: #fff;
	padding: 12px 15px;
	margin: 0;
	background: #9e938a;
}
.threeColColourHeadings > div:first-child h2 {
	background: #ed1556 !important;
}
.threeColColourHeadings > div:last-child h2 {
	background: #474648 !important;
}
.threeColColourHeadings p {
	padding: 15px;
	margin: 0;
}
.threeColColourHeadings ul {
	padding: 15px !important;
	margin: 0 !important;
    list-style: none !important;
}
.threeColColourHeadings ul li {
	padding: 0 !important;
	line-height: 1.4em;
    margin-bottom: 10px;
}
.threeColColourHeadings ul li a {
	color: #484545;
	text-decoration: none;
	display: inline-block;
}
.threeColColourHeadings ul li a:hover {
	color: #d60652;
	text-decoration: underline;
}

@media screen and (max-width: 700px) {
	.threeColColourHeadings > div {
		width: 100% !important;
		display: block !important;
		max-width: 100%;
		border: 0;
	}
	.threeColColourHeadings img {
		width: 100%;
		height: auto;
		max-width: 100%;
		}
		.threeColColourHeadings > div:last-child {
			width: 100%;
			max-width: 100%;
		}
}
/*====================================
18.	Colour Pallette
=====================================*/

h2[class^="block-"] {
	padding: 12px 15px;
	margin: 0;
	background: #f1f1f1;
	border-style: solid;
	border-top-width: 4px;
}
h2.block-Watermelon {
	border-top-color: #ed1556;
}
h2.block-Teal {
	border-top-color: #0091a5;
}
h2.block-Charcoal {
	border-top-color: #474648;
}
h2.block-WarmGrey {
	border-top-color: #9e938a;
}
h2.block-SkyBlue {
	border-top-color: #1C9DD9;
}
h2.block-Lime {
	border-top-color: #72A130;
}
h2.block-Turquoise {
	border-top-color: #00A39B;
}
h2.block-Orange {
	border-top-color: #f15d22;
}
h2.block-Purple {
	border-top-color: #9f248f;
}
h2.block-Indigo {
	border-top-color: #34308a;
}
h2.block-Red {
	border-top-color: #f05155;
}

/*====================================
19.	TOGGLE FRAMES
=====================================*/

.tglContainer {
	position: relative;   
	padding-bottom: 56.25%; /* 16/9 ratio */   
	padding-top: 30px; 
	height: 0;   
	overflow: hidden;
}

.tglContainer iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}

.btnToggle {
	padding: 10px 26px;
	display: inline-block;
	text-decoration: none;
	font-weight: bold;
	background: #ECEBEB;
	color: #5B5855;
	font-size: 10pt;
}

.toggleOverride { /* Teal overlay */
	text-decoration: none !important;
	cursor: default;
	background: #0090a5 !important;
	color: #fff !important;
}

.btnToggle:hover, .btnToggle:focus {
	background: #259fb6;
	color: #fff;
}

.fwTabPanel {
	margin: 0;
	border-top: 7px solid #0090a5;
	font-size: 0; /* Removes space between btnToggle */
}