﻿@charset "utf-8";

/* Gold Coast City Council - goldcoast.qld.gov.au
---------------------------------------------------

[Global Stylesheet]

[Table of contents]

1. Reset
2. Container Styles 
		2.1. No Script Bar
3. Top Bar
		3.1. Skip & Network menu
		3.2. Weather & Surf
		3.3. Top Navigation
		3.4. Contact menu and Other GC Websites drop down
4. Header, Logo & Search
		4.1  Search Autocomplete
5. Main Navigation
5.5 Home Page Feature  - Moved to Global
		5.5.1  Feature Pagination - Moved to Global
6. Page Layout
7. PDF & Font Sizer
8. Sidebar Styles
		8.1  Quick Link Icons
9. Top of Page Bar
10. Footer
11. Disaster alert modal (ML) - NOTE: This section needs populating from Dev
12. Trumba

/*====================================
1.	RESET
=====================================*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,
pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,
s,samp,small,strike,strong,tt,var,dl,dt,dd,ol,ul,li,fieldset,
form,label,legend,caption { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-family: inherit; vertical-align: baseline; }
:focus { outline: 0; } a:active { outline: none; } ol,ul { list-style: none; }
blockquote:before,blockquote:after,q:before,q:after { content: ""; } blockquote,q { quotes: "" ""; }* { margin: 0; padding: 0; }

/*====================================
2.	CONTAINER STYLES
=====================================*/

html, body { 
	height: 100%;
}
body {
	color: #000;
	font: 100%/1.2em Tahoma, Helvetica, sans-serif;
	min-width:1150px; 
	background-color: #f3efe6;
}
#container-inner {
	min-width:1091px;
}

/* 2.1  No Script Bar
------------------------------------ */

div.ns {
	background:#FFC;
	border-width:1px 0 1px 0;
	border-color:#000;
	border-style:solid;
	width:100%;
}
div.ns-inner {
	margin:0 auto;
	width:1091px; 
}
div.ns-inner p {
	font-size:0.688em;
	margin:0;
	padding:5px 0 5px 0;
	text-decoration:none;
}
div.ns-inner img {
	float:left; 
	margin-right:15px;
	padding-top:5px;
}

/*====================================
3.	TOP BAR
=====================================*/

#top-bar {
	height: 30px;
	min-width:1091px ;
}
#top-bar-inner {
    margin: 0 auto;
    width: 1091px;
}
	
/* 3.1  Skip menu
------------------------------------ */
	
#skip {
	margin-left:-2px;
}
.skip-menu, .skip-menu * {
	list-style: none;
	margin: 0;
	padding: 0;
}
.skip-menu {
	float: left;
	position:relative;
	z-index:500
}

.skip-menu ul {
	display:none;
	position: absolute;
}
.skip-menu a {	
	display: block;
	position: relative;
}
.skip-menu a, .skip-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
	color: #fff;
}	
/* Styles and positions menu off screen until accessed by tab key */
ul.skip-menu li a.toplink {
	display:block;
	float:left;
    font-size: 11px;
	height:24px;
    margin: 0;
    padding: 6px 18px 0 18px;
    position:absolute;
    text-decoration: none;
	top:-9999em;
}
/* Positions menu on screen */
ul.skip-menu li.sfHover a.toplink {
	position:relative;
	top:0;
}
.skip-menu ul.skip-menu-drop {
	background: #494546;
	margin-left:2px;
	width:180px;
}	
.skip-menu ul li {
	width: 100%;
}
/* Fixes IE7 'sticky bug' */
.skip-menu li:hover {
	visibility: inherit;
}
.skip-menu li {
	float: left;
	list-style-type: none;
}
.skip-menu li ul li {
	background:none;
	padding:3px 0 3px 0;
}
/* Left border of skip text */
.skip-menu li span.left-brdr {
	display:none;
}
/* displays left border when accessed */
.skip-menu li.sfHover span.left-brdr {
	display:block;
	float:left;
	height: 30px;
	padding-right: 2px; 
}
/* Displays menu on hover and focus */
.skip-menu li:hover ul, .skip-menu li.sfHover ul {
	display:block;
	top: 30px; 
	z-index: 1;
}
.skip-menu li:hover, .skip-menu li.sfHover,
.skip-menu a:focus, .skip-menu a:hover, .skip-menu a:active {
	outline:		0;
	position:inherit;
	top:0;

}
.skip-menu li.sfHover a.toplink, .skip-menu li:hover a.toplink {
	background: #494546;
	color:#fff;
}
.skip-menu ul a, .skip-menu ul a:visited {
	color:#fff;
}
.skip-menu ul a:focus, .skip-menu ul a:hover, .skip-menu ul a:active {
	outline:		0;
}
.skip-menu-drop {
	background:#494546;
	height:175px;
	padding:10px 18px 10px 18px;
}
.skip-menu ul.skip-menu-drop li {
	position: relative;

}
.skip-menu ul.skip-menu-drop a {
	font-size:0.813em;
	height: 1%;
	position: relative;
}

/* 3.2  Weather & Surf & Layout Structure
------------------------------------------- */

#other-sites{
	float:left;
}
#top-links-container{
	float:right;
	width:580px;
}

#weather {
	float: right;
	height: 30px;
}
#weather ul {
	height: 30px;
	list-style-image:none;
	margin:0;
}
#weather ul li {
	float: left;
	height: 30px;
	padding:0 10px 0 0; 
}
#weather p {
	color: #fff;
	font-size:0.688em;
	margin:0;
	padding-top: 6px; 
}
#weather a {
	color: #fff;
	text-decoration:none ;	
}
#weather a:hover, #weather a:focus {
	color:#e83268;
}
#weather ul li.temp {
	color: #7bb4e5;
	font-size:1.125em;
	font-weight: bold;
	height:25px;
	padding:5px 15px 0 0; 
	margin-right:15px;
}
#weather ul li.surf, #weather ul li.weather-link {
	padding-left:15px;
}
#weather ul li.weather-icon {
	padding-top:3px; 
}
#weather ul li.surf-icon {
	padding: 5px 15px 0 0; 
	height:25px;
}

/* 3.3  Top Navigation
------------------------------------ */
 
#top-nav ul { 
	float: right;
	height:30px;
	list-style-image:none;
	margin:0;
	padding-left:2px; 
}
#top-nav ul li {
	float: left;
	height:30px;
	padding:0 
}
#top-nav ul li a, #other-sites ul li a  {
	color: #fff;
	display: block;
	font-size:0.688em;
	margin: 0 2px 0 0px;
	padding: 6px 18px 4px 18px;
	text-decoration: none;
	text-shadow:0 1px #000;
}
#top-nav li a:hover, #top-nav li a:focus, #other-sites li a:hover, #other-sites li a:focus  {
	background: #c4004b;
	color: #fff; 
}
#top-nav li.brdr {
	height: 30px;
	padding-right: 2px; 
}

/* 3.4 Contact menu and Other GC Websites drop down
------------------------------------ */

div#top-nav ul ul, div#other-sites ul ul {
            display:none;
}
div#top-nav ul li:hover > ul, div#other-sites ul li:hover > ul {
            display:block;
}

div#top-nav ul ul, div#other-sites ul ul {
            background: #f1f1f1; border-radius: 0px; padding: 0;
            position: absolute;
            border-top: 1px solid #434244;
}
div#top-nav ul ul li, div#other-sites ul ul li {
            float: none; 
            position: relative;
            background:none;
}
div#top-nav ul ul li a, div#other-sites ul ul li a {
            color: #000;
            text-shadow:none;
            background-image: none;
}
div#top-nav ul ul li a:hover, div#other-sites ul ul li a:hover {          
            background: #f1f1f1;
            color:#000;
            text-decoration:underline;
}


/*====================================
4.	HEADER, LOGO & SEARCH
=====================================*/

#header {
	height: 140px;
	margin: 0 auto;
	width: 1091px; 
}
#logo {
    float: left;
    padding-top: 43px;
    width: 304px;
}
#search {
    float: left;
    margin:0px 0 13px 25px;
    width:300px;
}
#search.search-home {
    margin-top: 13px;
}
#search #global-search {
	box-sizing: content-box;
    background-position: -5px -353px;
    border: medium none;
    color: #3a4b5b;
    float: left;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 26px;
    padding: 0 40px 2px 15px;
    vertical-align: text-top;
    width: 245px;
}
#search.search-inner{
  margin-top:0;
}

#search #global-search:focus {
    background-position:  -5px -381px;
}

#search .searchSubmit {
    border: medium none;
    cursor: pointer;
    float: left;
    height: 28px;
    margin-left: -40px;
    text-indent: -9999px;
    width: 40px;
}
#search label {
    color: #3a4b5b;
    cursor: text;
    display: block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    left: 15px;
    margin: 0;
    position: absolute;
    top: 3px;
}
#search #search-bg {
    position: relative;
}


/* 4.1.0  Ad Styles
------------------------------------ */
.leaderAd{
	float: right;
	margin:25px 0 25px 25px;
	width:728px;
	height:90px;
}
.leaderAd p, .sideAd p{
	margin-bottom:0;
	text-align:right;
}
.leaderAd p a, .sideAd p a {
    font-size: 0.85em;
}
.leaderAd p a {
    color: #666;
}
.sideAd p a {
    color: #959090;
}
.sideAd{
	width:300px;
	margin:13px 0 5px 22px;
}


/* 4.1  Search Autocomplete
------------------------------------ */

* html .ui-autocomplete { 
	width:1px; 
} /* without this, the menu expands to 100% in IE6 */
.ui-autocomplete { 
	position: absolute; 
	cursor: default;
	padding-top:10px;
	width:240px !important;
	z-index:500 !important;
	left:0 !important;
	top:28px !important
}	
.ui-autocomplete li {
	width:232px;
	padding:0px 4px 0px 4px;
	overflow: hidden;
}
.ui-autocomplete li.last {
	padding-bottom:18px;
}
.ui-autocomplete li a {
	color:#3A4B5B;
	cursor: pointer;
	display: block;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	padding:4px 5px 4px 11px;
}
.ui-autocomplete li a.ui-state-hover {
	background:#036ac5;
	color:#fff;
	text-decoration:none;
}

/*====================================
10.	qTip Styles
=====================================*/
.qtip{
	position: absolute;
	left: -28000px;
	top: -28000px;
	display: none;

	max-width: 280px;
	min-width: 50px;
	
	font-size: 12px;
	line-height:1.8em;

	direction: ltr;

	box-shadow: none;
	padding: 0;
}

	.qtip-content{
		position: relative;
		padding: 5px 9px;
		overflow: hidden;

		text-align: left;
		word-wrap: break-word;
	}

	.qtip-titlebar{
		position: relative;
		padding: 1px 35px 5px 10px;
		overflow: hidden;

		border-width: 0 0 1px;
		font-weight: bold;
	}

	.qtip-titlebar + .qtip-content{ border-top-width: 0 !important; }

	/* Default close button class */
	.qtip-close{
		position: absolute;
		right: -9px; top: -9px;

		cursor: pointer;
		outline: medium none;

		border-width: 1px;
		border-style: solid;
		border-color: transparent;
	}

		.qtip-titlebar .qtip-close{
			right: 4px; top: 50%;
			margin-top: -9px;
		}
	
		* html .qtip-titlebar .qtip-close{ top: 16px; } /* IE fix */

		.qtip-titlebar .ui-icon,
		.qtip-icon .ui-icon{
			display: block;
			text-indent: -1000em;
			direction: ltr;
		}

		.qtip-icon, .qtip-icon .ui-icon{
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			border-radius: 3px;
			text-decoration: none;
		}

			.qtip-icon .ui-icon{
				width: 18px;
				height: 14px;

				line-height: 14px;
				text-align: center;
				text-indent: 0;
				font: normal bold 10px/13px Tahoma,sans-serif;

				color: inherit;
				background: transparent none no-repeat -100em -100em;
			}

/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
.qtip-focus{}

/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
.qtip-hover{}

/* Default tooltip style */
.qtip-default{
	border-width: 4px;
	border-style: solid;
	border-color: #218fa3;

	background-color: #fff;
	color: #434244;
}

	.qtip-default .qtip-titlebar{
		background-color: #218fa3;
		color:#fff;
	}

	.qtip-default .qtip-icon{
		border-color: #218fa3;
		background: #fff;
		color: #777;
	}
	
	.qtip-default .qtip-titlebar .qtip-close{
		border-color: #AAA;
		color: #111;
	}
	
	.qtip .qtip-tip{
	margin: 0 auto;
	overflow: hidden;
	z-index: 10;

}

	/* Opera bug #357 - Incorrect tip position
	https://github.com/Craga89/qTip2/issues/367 */
	x:-o-prefocus, .qtip .qtip-tip{
		visibility: hidden;
	}

	.qtip .qtip-tip,
	.qtip .qtip-tip .qtip-vml,
	.qtip .qtip-tip canvas{
		position: absolute;

		color: #123456;
		background: transparent;
		border: 0 dashed transparent;
	}

	.qtip .qtip-tip canvas{ top: 0; left: 0; }

	.qtip .qtip-tip .qtip-vml{
		behavior: url(#default#VML);
		display: inline-block;
		visibility: visible;
	}




/*! Light tooltip style */
.qtip-light{
	background-color: white;
	border-width: 2px;
	border-color: #d2d2d2;
	color: #000;
	text-align:center;
}

	.qtip-light .qtip-titlebar{
		background-color: #f1f1f1;
	}


/*! Dark tooltip style */
.qtip-dark{
	background-color: #505050;
	border-color: #303030;
	color: #f3f3f3;
}

	.qtip-dark .qtip-titlebar{
		background-color: #404040;
	}

	.qtip-dark .qtip-icon{
		border-color: #444;
	}

	.qtip-dark .qtip-titlebar .ui-state-hover{
		border-color: #303030;
	}


/*! Green tooltip style */
.qtip-green{
	background-color: #CAED9E;
	border-color: #90D93F;
	color: #3F6219;
}

	.qtip-green .qtip-titlebar{
		background-color: #B0DE78;
	}

	.qtip-green .qtip-close .qtip-icon{
		background-position: -42px 0;
	}


/*! Blue tooltip style */
.qtip-blue{
	background-color: #E5F6FE;
	border-color: #ADD9ED;
	color: #5E99BD;
}

	.qtip-blue .qtip-titlebar{
		background-color: #D0E9F5;
	}

	.qtip-blue .qtip-close .qtip-icon{
		background-position: -2px 0;
	}

.qtip-shadow{
	-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
	box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}

/* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
.qtip-rounded,
.qtip-tipsy,
.qtip-bootstrap{
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.qtip-rounded .qtip-titlebar{
	-moz-border-radius: 4px 4px 0 0;
	-webkit-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}

.qtip-bootstrap{
	/** Taken from Bootstrap body */
	font-size: 14px;
	line-height: 20px;
	color: #333333;

	/** Taken from Bootstrap .popover */
	padding: 1px;
	background-color: #ffffff;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.2);
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
}

	.qtip-bootstrap .qtip-titlebar{
		/** Taken from Bootstrap .popover-title */
		padding: 8px 14px;
		margin: 0;
		font-size: 14px;
		font-weight: normal;
		line-height: 18px;
		background-color: #f7f7f7;
		border-bottom: 1px solid #ebebeb;
		-webkit-border-radius: 5px 5px 0 0;
		-moz-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
	}

		.qtip-bootstrap .qtip-titlebar .qtip-close{
			/**
			 * Overrides qTip2:
			 * .qtip-titlebar .qtip-close{
			 *   [...]
			 *   right: 4px;
			 *   top: 50%;
			 *   [...]
			 *   border-style: solid;
			 * }
			 */
			right: 11px;
			top: 45%;
			border-style: none;
		}

	.qtip-bootstrap .qtip-content{
		/** Taken from Bootstrap .popover-content */
		padding: 9px 14px;
	}

	.qtip-bootstrap .qtip-icon{
		/**
		 * Overrides qTip2:
		 * .qtip-default .qtip-icon {
		 *   border-color: #CCC;
		 *   background: #F1F1F1;
		 *   color: #777;
		 * }
		 */
		background: transparent;
	}

		.qtip-bootstrap .qtip-icon .ui-icon{
			/**
			 * Overrides qTip2:
			 * .qtip-icon .ui-icon{
			 *   width: 18px;
			 *   height: 14px;
			 * }
			 */
			width: auto;
			height: auto;

			/* Taken from Bootstrap .close */
			float: right;
			font-size: 20px;
			font-weight: bold;
			line-height: 18px;
			color: #000000;
			text-shadow: 0 1px 0 #ffffff;
			opacity: 0.2;
			filter: alpha(opacity=20);
		}

		.qtip-bootstrap .qtip-icon .ui-icon:hover{
			/* Taken from Bootstrap .close:hover */
			color: #000000;
			text-decoration: none;
			cursor: pointer;
			opacity: 0.4;
			filter: alpha(opacity=40);
		}


/* IE9 fix - removes all filters */
.qtip:not(.ie9haxors) div.qtip-content,
.qtip:not(.ie9haxors) div.qtip-titlebar{
	filter: none;
	-ms-filter: none;
}
/*====================================
5.	MAIN NAVIGATION
=====================================*/

#navigation {
    height: 40px;
    margin: 0 auto 15px;
    padding: 0 0 10px;
    width: 1091px;
}

.main-menu, .main-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.main-menu {
    float: left;
    height: 40px;
    position: relative;
    width: 1091px;
    z-index: 200;
}
.main-menu li {
	float: left;
	margin: 0;
	position: relative;
}
.main-menu li.home {
	background:none;
	padding-left:0;
	width:54px;
}
.main-menu li.council a.toplink {
	width:42px;
}
.main-menu li.the-gold-coast a.toplink {
	width:91px;
}
.main-menu li.community a.toplink {
	width:64px;
}
.main-menu li.planning-and-building a.toplink {
	width:115px;
}
.main-menu li.environment a.toplink {
	width:69px;
}
.main-menu li.business a.toplink {
	width:53px;
}
.main-menu li.services {
    position: absolute;
    right: 0;
    width: 349px;
}

.main-menu li:hover {
	visibility: inherit; /* fixes IE7 'sticky bug' */
}
.main-menu a {
	position: relative;
}
.main-menu a, .main-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
	color: #fff;
}
.main-menu ul.megamenu {
	left:-9999px;
	padding-left:25px;
	position: absolute;
	width:100%;
	float:left
}	
.main-menu ul li {
	width: 100%;
}
.main-menu li ul li.l-shad {
	padding-left:25px;
}
.main-menu li ul li .r-shad {
	padding-right:20px;
}
.main-menu li:hover ul.megamenu, .main-menu li.sfHover ul.megamenu {
	left: 0;
	top: 40px; /* match top ul list item height */
	display:block;
}
.main-menu li a.home {
	padding:10px 16px 9px 18px;
	text-indent:-9999px;
	display:block;
	width:20px;
	height:20px;
}
ul.main-menu li a.toplink {
	padding: 11px 20px 10px 22px;
	display: block;
	text-decoration: none;
	float: left;
	font-size:12px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	white-space:nowrap;
	text-shadow:0 1px #000
}
ul.main-menu li a.services {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    width: 315px;
}
.main-menu li:hover ul.council, .main-menu li.sfHover ul.council {
	width:655px;
	left:-8px
}
.main-menu li:hover ul.council .megawrapper, .main-menu li.sfHover ul.council .megawrapper {

}
.main-menu li:hover ul.the-gold-coast, .main-menu li.sfHover ul.the-gold-coast {
	left:-92px;
	width:870px;
}
.main-menu li:hover ul.the-gold-coast .megawrapper, .main-menu li.sfHover ul.the-gold-coast .megawrapper {
}
	
.main-menu li:hover ul.community, .main-menu li.sfHover ul.community {
	width:870px;
	left:-225px
}
.main-menu li:hover ul.community .megawrapper, .main-menu li.sfHover ul.community .megawrapper {
}
.main-menu li:hover ul.planning-and-building, .main-menu li.sfHover ul.planning-and-building {
	width:870px;
	left:-248px
}
.main-menu li:hover ul.planning-and-building .megawrapper, .main-menu li.sfHover ul.planning-and-building .megawrapper {
}
.main-menu li:hover ul.environment, .main-menu li.sfHover ul.environment {
	width:870px;
	left:-370px
}
.main-menu li:hover ul.environment .megawrapper, .main-menu li.sfHover ul.environment .megawrapper {
}
.main-menu li:hover ul.business, .main-menu li.sfHover ul.business {
	width:225px;
	left:-145px
}
.main-menu li:hover ul.business .megawrapper, .main-menu li.sfHover ul.business .megawrapper {
}
.main-menu li:hover ul.services, .main-menu li.sfHover ul.services {
    left: -8px;
    width: 342px;
}
.main-menu li:hover ul.services .megawrapper, .main-menu li.sfHover ul.services .megawrapper {
}
ul.megamenu.services div.megacolumn ul li:last-of-type { border-top: 2px solid #d1d1d1; margin-top: 12px; padding-top: 12px; display: inline-block; width: 300px; }
ul.megamenu.services div.megacolumn { width: 300px; }
.main-menu a.mm-skip {
	text-indent:-9999px;
	font-size:10px;
	position:absolute;
	top:2px;
	left:5px;
	padding:0;
	margin:0;
}
.main-menu a.mm-skip:focus {
	text-indent:0;
	display:block;
	padding:0;
}
.main-menu li.sfHover a.toplink, .main-menu li:hover a.toplink, .main-menu li a.toplink:focus {
	color:#434244;	
	outline:		0;
	text-shadow:0 1px #fff;
}
.main-menu li a.toplink:hover, .main-menu li a.toplink:focus {
	text-decoration: underline;
	}
.main-menu li:hover a.services { text-shadow: 0 1px #bbb; }
.main-menu .megacolumn ul li a.lvl4 {
	color:#434244;
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.813em;
	font-weight:bold;
	border-bottom: 1px solid #88847f;
	width: 100%;
	display: block;
	padding-bottom: 2px;
	margin-bottom: 6px;
}

.main-menu .megacolumn ul li a.lvl4:hover {
	text-decoration: none;
}
	
.main-menu ul a, .main-menu ul a:visited {
	color:#434244;
}
.main-menu ul a:focus, .main-menu ul a:hover, .main-menu ul a:active {
	outline:		0;
}

.main-menu a.sf-with-ul {
	min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
}

/* Mega Column Styles */

.megawrapper {
	height:auto;
	padding:20px 0px 10px 0;
	float:left
}
.megacolumn {
	background:none;
	float: left;
	padding:0px 20px 5px 5px;
	width: 190px;
}
	
.megafooter {
	clear: both;
	padding: 12px;
}

.main-menu ul .megawrapper ul {
	background-image: none;
	margin-bottom:15px;
	position: relative;
	top: auto;
	width: auto;
}

.main-menu ul .megawrapper ul li {
	background-color: transparent;
	float:none;
	padding-bottom:3px;
}

.main-menu ul .megawrapper ul li a {
	height: 1%;
	position: relative;
	font-size:0.813em;
	text-shadow:0 1px #fff
}

/*====================================
5.5	HOME PAGE FEATURE
=====================================*/

#feature {
    height: 300px;
    margin: 0 auto 15px;
    padding: 0 0 10px;
    position: relative;
    width: 1091px;
    z-index: 0;
}
#feature .slide-container {
    height: 300px;
    overflow: hidden;
    width: 1091px;
    z-index: 0;
}
#feature .slide-container .slide-control {
	width:1091px;
	height:300px;
	display:block;
	z-index:0;
}
#feature .slide-container .slide {
    display: block;
    height: 300px;
    width: 1091px;
    z-index: 0;
}
#feature .slide-container .caption {
	float:right;
	width:307px;
	height:233px;
	padding:22px 22px 45px 22px;
}
#feature a.prev {
	background-position:-952px -207px;
	display:none;
	height:36px;
	position:absolute;
	left:10px;
	text-indent:-9999px;
	top:132px;
	width:26px
}
#feature a.prev:hover {
	background-position:-952px -131px;
}
#feature:hover a.prev, #feature:hover a.next {
	display:block;
}
#feature a.next {
    background-position: -952px -169px;
    display: none;
    height: 36px;
    position: absolute;
    right: 365px;
    text-indent: -9999px;
    top: 132px;
    width: 26px;
}
#feature a.next:hover {
	background-position:-952px -93px;
}
#feature .caption h1 {
	color:#fff;
	font-size:1.000em;
	margin-bottom:15px;
	line-height:1.6em;
	text-shadow:0px 1px #000;
}
#feature .caption span.feature-title {
    color: #FFFFFF;
    display: block;
    font-size: 1em;
    font-weight: bold;
    line-height: 1.6em;
    margin-bottom: 15px;
    text-shadow: 0 1px #000000;
}
#feature .caption span.feature-title{
	color:#fff;
	font-size:1.000em;
	margin-bottom:15px;
	line-height:1.6em;
	text-shadow:0px 1px #000;
	font-weight:bold;
	display:block;
}
#feature .caption p {
	color:#fff;
	text-shadow:0 1px #000
}

#feature .caption p.link {
	color:#fff;
	text-align:right;
}

#feature .caption p.link a {
	color:#fff;
	text-decoration:none;
	text-shadow:0 1px #000
}
#feature .caption p.link a:hover, #feature .caption p.link a:focus {
	text-decoration:underline;
}

/* 5.5.1  Feature Pagination
------------------------------------ */

.pagination-ct {
    bottom: 20px;
    left: 790px;
    padding: 15px 25px 0;
    position: absolute;
    width: 190px;
}
	
.pagination-inner {
	float:left;
   width:100%;
   overflow:hidden;
   position:relative; }
   	
.pagination {
    clear: left;
    float: left;
    left: 50%;
    list-style: none outside none;
    margin:0;
    padding: 0;
    position: relative;
    text-align: center;
}

.pagination li {
	float:left;
	list-style:none;
	margin:0 6px 0 6px;
    position: relative;
	right:50%;
	width:20px;
	height:20px;
}

.pagination li a {
	background-position:-0px -50px;
	display:block;
	font-size:0.625em;
	width:20px;
	height:20px;
	float:left;
	color:#305c7f;
	text-indent:-999px;
	z-index:0
}
.pagination li a:hover, .pagination li a:focus {
	background-position:-20px -50px;
	text-decoration:none;
	color:#f1f1f1;
}
.pagination li.current a {
	background-position:-20px -50px;
	text-decoration:none;
	color:#f1f1f1;
}

/*====================================
6.	PAGE LAYOUT
=====================================*/

#content {
	margin: 0 auto;
	padding-bottom: 50px;
	width: 1091px; 
	position:relative;
}
.content-top { 
	padding-top:8px 
}
.content-top-home { 
	padding-top:8px 
}
.content-bot{
	clear:left;
	padding-top:25px;
}
#content-main {
	float: left;
	padding: 0px 2px 0px 2px; 
}
#content-main-inner {
	float: left 
}
#page {
	background: #fff;
	color:#3a4b5b;
	float: left;
	padding: 25px;
	width: 690px;
	position:relative; 
}
#sidebar {
	float: left;
	padding-left: 1px;
	width: 346px;
	background: #484545;
}

/*====================================
7.	PDF & FONT SIZER
=====================================*/

#print-to {
	float:right;
}
#print-to ul {
	list-style-image:none;
	
}
#print-to ul li {
	float:left;
	padding-left:0
}
#print-to a {
	display:block;
	text-indent:-9999px;
	width:16px;
	height:18px;
}
#print-to a.resetFont {
	cursor:pointer;
	margin-left:10px;
}
#print-to a.increaseFont {
	cursor:pointer;
	margin-left:2px;
}
#print-to a.print-pdf {
	padding:0 !important;
	margin-right:-6px;
	width:19px !important;
	height:20px !important;
}

/*====================================
8.	SIDEBAR STYLES
=====================================*/

#sidebar h1 {
	font-size:0.875em;
	color:#005f7e;
}
#sidebar li {
	font-size:.7em;
}

.sb-sep {
	width:100%;
	height:2px;
}
#sub-menu { margin-left:15px; }
	
#sub-menu li {
	padding:0 
}
#sub-menu li a {
	color:#fff;
	display:inline-block;
	font-size:11px;
	padding:5px 25px 5px 25px;
	text-shadow:0 1px #000; 
}
#sub-menu ul {
	list-style-image:none;
	margin:0;
 }
#sub-menu #sub-menu-ul {
	padding:5px 0 5px 0px;
}
#sub-menu ul li a.active {
	font-weight:bold; 
}
#sub-menu ul li.parent ul {
	padding-bottom:0;
}
#sub-menu ul li.lvl3 a.closed {
	background:none;
}
#sub-menu ul li.lvl5 a {
	margin-left:17px }

#sub-menu ul li.lvl6 a {
	margin-left:33px; }	
	
#sub-menu ul li.lvl7 a {
	margin-left:57px; }	
	
/* 8.1  Quicklink Icons
------------------------------------ */

.quick-links {
    padding: 22px 25px 20px 21px;
}

.quick-links ul {
	list-style-image:none;
	margin:0;
}
.quick-links ul li {
	margin-bottom:6px;
	float:left;
	width:150px;
}
.quick-links ul li a {
    color: #fff;
    display: inline-block;
    height: 20px;
    padding: 3px 0 5px 35px;
    text-shadow: 0 1px #282729;
}
	
.quick-links ul li a.anchor {
	height:0px;
	padding:0px;
}
.quick-links ul li a span.ext-icon {
    margin-left: 5px;
}
.quick-links ul li #libs, .quick-links ul li a.libs { 
	background-position:0px 0px; }
	
.quick-links ul li #parksql { 
	background-position:0px -660px; }
	
.quick-links ul li #greengc, .quick-links ul li a.greengc { 
	background-position:0px -720px; }

.quick-links ul li a.report { 
	background-position:0px -750px; }

.quick-links ul li a.feedb { 
	background-position:0px -30px; }
		
.quick-links ul li a.forms { 
	background-position:0px -60px; }

.quick-links ul li #news, .quick-links ul li a.news { 
	background-position:0px -90px; } 

.quick-links ul li a.events { 
	background-position:0px -120px; } 
	
.quick-links ul li a.hys-icon { 
	background-position:0px -600px; }

.quick-links ul li a.images {
    background-position: 0 -150px;
}	
.quick-links ul li a.perms { 
	background-position:0px -630px; }

.quick-links ul li a.disaster { 
	background-position:0px -180px; } 

.quick-links ul li #alerts, .quick-links ul li a.alerts {
    background-position: 0 -540px;  }
	
.quick-links ul li a.pay {
    background-position: 0 -570px;  }

.quick-links ul li #fb-link { 
	background-position:0px -210px; } 

.quick-links ul li #tw-link { 
	background-position:0px -240px; } 

.quick-links ul li #yt-link { 
	background-position:0px -270px; } 
	
.quick-links ul li #in-link { 
	background-position:0px -811px; }
	
.quick-links ul li a.comdir {
    background-position: 0 -780px;
}

.quick-links p.all {
	font-size:0.688em;
	margin-bottom:0;
	text-align:right;
	text-shadow:0 1px #282729;
}
.quick-links p.all a {
	text-decoration:none;
	color: #fff;
}
.quick-links p.all a:hover, .quick-links p.all a:focus {
	text-decoration:underline;
}
#sb-highlight { 
	padding: 25px;
	text-align:center;
}
#sb-highlight a {
	font-size:12px;
	color:#fff;
	text-shadow: 0 1px #282729;
}
#sb-highlight img {
	margin-bottom:10px;
} 
	
/*====================================
9.	TOP OF PAGE BAR
=====================================*/
	
#top-button {
    background: none repeat scroll 0 0 #484545;
    clear: left;
    margin: 0;
    overflow: hidden;
    padding: 20px 25px 0px;
}
#top-button a.scroll {
    color: #fff;
    font-size: 0.688em;
	text-shadow:0 1px #282729;
}
#top-button a.scroll.left {
	padding-left:30px;
}
#top-button a.scroll.right {
	padding-right:30px;
}

/*====================================
10.	FOOTER
=====================================*/

#footer {
	clear: both;
	min-width:1091px; 
}
#footer-inner {
    margin: 0 auto;
    padding: 25px 0;
    width: 1091px;
}
#footer-bottom {
	height: 42px;
	margin-left:25px; 
}
#footer-links {
	float:left;
	padding:0 25px 25px 25px; 
}
.footer-column {
    color: #91d4ff;
    float: left;
    margin-right: 50px;
    padding-right: 50px;
    width: 180px;
}
.footer-column-last {
	color: #91d4ff;
	float: left;
	width: 165px; 
}
.footer-column ul {
	list-style-image:none;
	margin:0;
}
.footer-column ul li img {
	float: left;
	padding-right: 15px; 
}
.footer-column ul li h1 { 
	padding-top: 5px; 
}
.alt-link li {
	margin-bottom:10px;
	line-height:12px;
}
.alt-link li a {
	display:block;
	height: 20px;
	padding:3px 0 5px 43px; 
}
.alt-link li a.mobile-icon { 
	background-position:0px -330px; 
}
.alt-link li a.rss-icon { 
	background-position:0px -300px; 
}
.alt-link li a.cml-icon { 
	background-position:0px -420px; 
}
.alt-link li a.enews-icon { 
	background-position:0px -480px; 
}
.alt-link li a.hys-icon { 
	background-position:0px -450px; 
}
.alt-link li a.cw-icon { 
	background-position:0px -510px; 
}
.footer-column ul li.logo {
	height: 30px;
	padding: 10px 0 10px 0; 
}
.footer-column ul li.logo.top { 
	padding-top: 0 
}
#footer h1 {
	color: #fff;
	font-size:0.875em;
	text-shadow:0 1px #282729
}
#footer p.heading{
	color: #fff;
	font-size:0.875em;
	text-shadow:0 1px #000;
	font-weight:bold;
	margin-bottom:25px;
}
	
#footer a {
	color: #fff;
	font-size:0.688em ;
	text-shadow:0 1px #000
}
#footer .border-low {
	border-width: 1px 0 1px 0;
	border-color: #343435 transparent #575457;
	border-style: solid;
	clear: left;
	height: 0;
	margin-bottom: 15px;
	width: 100%; 
}
#corp-links ul { 
	list-style-image:none;
	margin:0;  
}
#corp-links li {
	float: left;
	padding-right: 15px; 
}
#corp-links li a , .spli-div, .copy-text{
	color: #fff;
	font-size:0.688em 
}
.spli-div{
	text-shadow: 0 1px #000000;
	margin-top:2px;
	padding:0 0 0 15px;
	background: url("/_images/structural/foot-vert-brdr.jpg") no-repeat scroll left bottom transparent
}
#footer-logo {
	float: right;
	padding-left: 25px;
	width: 176px; 
}

/*====================================
11.	DISASTER ALERT MODAL
=====================================*/
#disaster-bar {
	background: rgb(196, 0, 75); 
	padding: 10px; 
	color: rgb(255, 255, 255); 
	font-weight: 700;
}

#disaster-modal-background {
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	padding: 15px;
}

.disaster-modal-background-closed {
    opacity:0;
    pointer-events: none;
    visibility: hidden;
}

.disaster-modal-background-open {
    opacity:1;
    pointer-events: auto;
    visibility: visible;
}

#disaster-modal-background > div {
	max-width: 1120px;
	height: 100%;
	position: relative;
	margin: auto;
	background-color: #fff;
}

#disaster-modal-background > div > iframe {
	height: 100%;
	width: 100%;
}



/*====================================
12.	TRUMBA CONTAINERS
=====================================*/

.twFilterWrap{
	line-height: normal;
}
.twSearchWrap{
	line-height: normal;
}

/*Trumba Feature Slider*/
#tr_featured-event {
	max-height: 260px;
	overflow: hidden;
}


/*Trumba Header Container*/
#tr_header {
	width: 100%;
	height: 155px;
	background-color: #f2f2f2;
	padding: 4px 4px 4px 10px;
	margin-bottom: 30px;
}
/*Trumba Header-Spuds block container
use for stacking control spuds*/
#tr_header-block {
	width: 50%;
	display: block;
	float: left
}

/*Date-Picker spud*/
#tr_date-picker-spud {
	width: 40%; 
	display: block;
	float: right;
	padding: 4px;
}
/*Trumba main calendar- results*/
#tr_main-calendar {
	width: 100%;
}

/*Generic Search spud*/
#tr_search-spud {
	display: block;
	float: left;
	padding: 0 0 10px 0;
	width: 100%;
}
/*Location search spud*/



/*Category choice spud*/
#tr_category-spud {
	display: block;
	float: left;
	padding: 0 0 10px 0;
}

/*Suburb choice spud*/
#tr_suburb-spud {
	display: block;
	float: left;
	padding: 0 0 10px 0;
}
