﻿@charset 'UTF-8';

  @font-face {
     font-family: 'League Gothic';
     src: url('../font/League_Gothic-webfont.eot');
     src: url('../font/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
        url('../font/League_Gothic-webfont.ttf') format('truetype'),
        url('../font/League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');
     font-weight: normal;
     font-style: normal
  }
/* use whichever reset method you want here */
* { margin:0; padding:0;}
html, body { height: 100%; width: 100%;}
html {background:url(/buildassets/hub/bg_tile.gif) repeat #d6d6d6;}
body {        
	color: #231f20;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
p, li { font-size: 1.0em; line-height: 1.5em;} 
ul { list-style: inside; margin: 0.25em 0 }
table { border: 0; border-collapse: collapse; border-spacing: 0 }
td { vertical-align: top }
input, select, textarea { font-family: inherit; font-size: 1.0em }
img { border: 0 }
a { color: #1b59ac; text-decoration: none }
a:hover { text-decoration: none }

h1, h2, h3, h4, h5 
{
	color: #323030;  
	font-weight: normal;
}
h1, h2 
{
	line-height: 1; 
	margin: 0; 
	text-transform: uppercase;
	font-family: 'League Gothic', Impact, Arial, sans-serif;
}
h1{ font-size: 1.8em }
h2{ font-size: 2.5em }
h3{ font-size: 1.1333em }
h4{ font-size: 1.2em }
h5{ font-size: 1.0em }
h1 a, h2 a, h3 a, h4 a, h5 a { color: #000 }

.clear { zoom: 1 } /* for older browsers */
.clear:before,
.clear:after { content: ""; display: table }
.clear:after { clear: both }

.fl { float: left }
.fr { float: right }
.alignCenter {
       margin: 0 auto; 
       width: 960px
}
/* Green cross projects header changes */
#gca-projects {margin-bottom:16px;}
#gca-projects .banner {width:auto; padding-left:168px; padding-right:17px;}
#gca-projects .logo {left:11px;}

/* Buttons */
.btnSprite
{
	background:url(/buildassets/hub/sprites.png) no-repeat;
	display:block; 
	text-indent:-9999px;
	cursor:pointer;
}
.btnReturn 
{
    background-position:0 0;
    width:180px;
    height:36px; 
    position:absolute; 
    right:281px;
    top:40px;
}
.btnReturn:hover {background-position:-190px 0;}
.btnTip {background-position:0 -50px;width:113px;height:21px; float:left; clear:both; margin-top:15px;}
.btnTip:hover {background-position:-120px -50px;}
/*.menu {width:219px; height:75px;}*/
.menu { height:43px;}
.menuItems 
{
    position:relative;
    float:left;
	clear:both;
	width:100%;
}
.menu a 
{
	/*width:219px; */
	height:38px;
	font-family: 'League Gothic', Impact, Arial, sans-serif;
	text-indent:9px;
	font-size:32px;
	color:#FFFFFF;
	padding-top:2px;
	text-transform:uppercase;
	z-index:1;
	position:absolute;
	top:0;
	left:0;
	background-image:url(/buildassets/hub/btnArrow_right.png);
	background-repeat: no-repeat;
	background-position: top right;
	padding-right:35px;
	display:none;
}
.menu a.btnGreen {background-color:#3f6e10;}
.menu a.btnGreen:hover {background-color:#325a0b;}
.menu a.btnBlue {background-color:#124589;}
.menu a.btnBlue:hover {background-color:#1b59ac;}
.menu a.btnOrange {background-color:#be400f;}
.menu a.btnOrange:hover {background-color:#d84005;}
.menu a:nth-child(1) {z-index:99;}
.menu a:first-child {background-image:url(/buildassets/hub/btnArrow_down.png);}
.menu a:last-child 
{
    -moz-box-shadow: 0 3px 3px #666;
	-webkit-box-shadow: 0 3px 3px #666;
	box-shadow: 0 3px 3px #666;
}
/* Header */
.header {
	float: left;
	width:100%;
	padding-bottom:20px;
	border-bottom:1px solid #231f20;
	margin-bottom:23px;
}
.header h1 {position:absolute; right:10px; top:5px;}
.header h1 a {
	background: url(/buildassets/hub/logo_header.png) left top no-repeat;
	display: block;
	height: 73px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 241px
}
.header h2 {font-size:2em; padding-left:150px; margin-top:12px; float:left; max-width:370px;}
.header .menu {padding-left:150px;margin-right:20px; clear:left;}
.header h3 
{
	font-size:1.5em; 
	font-weight:bold; 
	float:left;
	width:300px;
}

/* Content */
.pageHolder {padding:0 10px;/*background: url(/buildassets/hub/bg.png) repeat-x 50% -1px; */min-width:300px; position:relative;}
.section {float:left; width:100%;}
.section h3 {color:#1b59ac;}
.panel 
{
	float:left; 
	width:300px;
	margin:0 20px 20px 0;
	background:#FFF;
}
.panelInner 
{	
	border-top:2px solid #1b59ac;
	padding:14px 15px 20px;
	float:left;
	width:270px;
}
.panelContent img {margin-left:-15px; margin-bottom:9px;}
.panelContent iframe {margin-left:-15px; margin-bottom:9px;}
.panelInner h2 {margin-bottom:10px;}
.panelInner h3 {font-weight:Bold; margin-bottom:1px;}
.panelTwitterOfficial {border-top:2px solid #1b59ac;}
.panelTwitterOfficial .panelInner {border-top:0;}
.panelTwitterOfficial .holderTop {padding:0;}
.panelTwitterOfficial .twitterBanner 
{
	background:url(/buildassets/hub/logo_officialChannel.png) no-repeat right top #1b59ac;
	font-family: 'League Gothic', Impact, Arial, sans-serif;
	color:#FFF;
	text-transform:uppercase;
	font-size:1.333em;
	text-indent:15px;
	height:26px;
	padding-top:6px;
}
.twitterName {top:-12px; position:relative;}
.holder 
{
	border-bottom:1px solid #231f20; 
	padding-bottom:10px;
	float:left; 
	width:270px;
}
.holderTop {border-top:1px solid #231f20; padding-top:10px;}
.panelFlickr h2 {background:url(/buildassets/hub/logo_flickr.png) no-repeat right 10px;}
.panelRadio h2 {background:url(/buildassets/hub/logo_abc.png) no-repeat right 2px;}
.panelFacebook h2 {background:url(/buildassets/hub/logo_facebook.png) no-repeat right 2px;padding-right:28px}
.panelTwitter h2 {background:url(/buildassets/hub/logo_speechBubble.png) no-repeat right 2px;}
.panelTip h2 
{
    background:url(/buildassets/hub/sprites.png) 0 -110px no-repeat;
    height:63px;
    text-indent:-9999px;
}
.panelTip .panelInner {border-top:0;}
.panelWeather iframe {border:0 !important;}
.panelRadio object {margin-bottom:5px;}
.panelFlickr img {width:122px; height:auto;}

/* Twitter overrides */
.twtr-hd, .twtr-ft, .twtr-fav, .twtr-rt, .twtr-reply {display:none;}
.twtr-widget em {color:#fff;}
.panelInner #twtr-widget-1 .twtr-tweet a.twtr-timestamp {color:#909090!important;text-decoration:none!important}
.twtr-widget .twtr-bd .twtr-tweet-wrap {padding:16px 0;}
.twtr-widget .twtr-tweets .twtr-tweet {border-bottom:1px solid #ddd;}
.twtr-avatar { float: left; width: 28px }
.twtr-avatar img { width: 100% }
.twtr-tweet .twtr-tweet-text {margin-left:34px;}
.twtr-tweet .twtr-tweet-text p {background:url(/buildassets/hub/bg_tweet.png) no-repeat 0 2px;min-height:28px;padding-left:14px!important;}
.twtr-tweet .twtr-tweet-time {color:#909090;display:block;font-size:10px;margin-top:1px;}

/* Flickr */
.flickr_badge_image 
{
	float:left; 
	padding:4px; 
	-moz-box-shadow: 0 0 3px #666;
	-webkit-box-shadow: 0 0 3px #666;
	box-shadow: 0 0 3px #666;
	margin-bottom:10px;
}
.flickr_badge_image:nth-child(even) {margin-right:10px;}
.flickr_badge_image img {float:left;}
.holder  center {clear:both;}

/* Footer */
.wrapper 
{
	min-height: 100%;
	height: auto !important;
	height: 100%;
	background: url(/buildassets/hub/bg.png) repeat-x 50% 40px;
	margin: 0 auto -31px; /* the bottom margin is the negative value of the footer's height */
}
.push {	clear:both;height: 31px; /* .push must be the same height as .footer */}
.footer {
	float: left; 
	width:100%;
	background:#323030; 
	color:#fefdfd;
	padding-top:9px;
	text-indent:17px;
	height:22px;
}
/* Media queries */

@media screen and (max-width: 1380px)
{
	.header h3 {clear:both; width:100% !important; margin-top:10px;}
}
/* Align GCA header */
@media screen and (max-width: 1100px)
{
    #gca-projects .projects .inner {padding-left:168px; margin-left:0;}
}
@media screen and (max-width: 1050px)
{
    #gca-projects .projects .inner {padding-left:168px; margin-left:0;}
    #gca-projects .projects .inner {width:100%; padding-left:0;}
	#gca-projects .projects .about {width:auto; margin-left:168px;}
	#gca-projects .projects ul {clear:both; margin-left:168px;}
	#gca-projects .projects .about a {margin-top:5px; margin-bottom:5px;}
}
/* Compact green cross header*/
@media screen and (max-width: 920px)
{
	#gca-projects .banner {height:80px;}
	#gca-projects .banner .cause {clear:both; float:left; line-height:15px; margin-top:2px;}
	
}
@media screen and (max-width: 880px)
{
	.header h1 {display:none;}
	.panel:nth-child(odd){margin-right:20px;}
	.btnReturn {right:10px;}
}
@media screen and (max-width: 650px)
{
	.btnReturn 
	{
		float:left;
		margin-left:150px;
		position:relative;
		top:0;
	}
	.header .menu h2 {margin-bottom:4px; clear:both;}
	.btnDisasterConnect, .btnQldFloods, .btnSEQBushfires {font-size:35px; height:43px; padding-top:4px;}
	.header .menu {height:auto; margin-bottom:42px;}
}
@media screen and (max-width: 600px)
{
    /* GCA header for mobile */
    #gca-projects .projects .about {margin-left:0px;}
	#gca-projects .projects ul {margin-left:0px;}
	#gca-projects .logo 
	{
	    background: url(/buildassets/hub/logo_gca_mobile.png) no-repeat left top;
        height: 115px;
        left: 4px;
        /*margin-bottom: -42px;*/
        width: 107px;    
	}
	#gca-projects .banner 
	{
	    height:98px;
	    padding-left:114px;
	    line-height:normal;
	    position:relative;
	}
	#gca-projects .banner strong 
	{
	    border-right:none;
	    line-height:normal;
	    margin-top:12px;
	    padding-right:0;
	}
	#gca-projects .banner .cause
	{
	    position:absolute;
	    top:34px;
	    left:114px;
	    font-size:13px;
	}
	#gca-projects .switch
	{
	    position:absolute;
	    top:72px;
	    left:112px;
	    padding-left:0;
	    font-size:12px;
	}
	#gca-projects .projects .inner 
	{
	    padding:29px 0 42px 0;
	    width:100%;
	    position:relative;
	}
	#gca-projects .projects .about p,
	#gca-projects .project .description 
	{display:none;}
	#gca-projects .projects li
	{
	    clear:both;
	    margin:0 0 31px 20px;
	    width:auto;
	}
	#gca-projects .project .title {font-size:14px;}
	#gca-projects .projects .about 
	{
	    position:absolute;
	    bottom:25px;
	    left:32px;
	}
	#gca-projects .projects .about a {font-size:14px;}
}
/* Mobile */
@media screen and (max-width:480px)
{
	.header .menu {padding-left:0; margin-right:0; width:100% !Important;}
	.header h2 {padding-left:0; clear:both;}
	.menu a {width:460px !Important;padding-right:0;}
	.panel {margin-right:0;}
	.btnReturn {margin-left:0;}
	.header h3 {font-size:1.1666em;}
	#gca-projects .banner strong {font-size:12px;}
}

@media screen and (min-device-width:321px) and (max-device-width : 535px) /* android landscape is weird */
{
	.menu a {width:480px !important;}
	.header .menu {padding-left:0; margin-right:0; width:100% !important;}
	.btnReturn {margin-left:0;}
	.header h3 {font-size:1.1666em;}
	.header h2 {padding-left:0; clear:both;}
}
@media screen and (min-device-width:321px) and (max-device-width : 480px) /* landscape */
{
	.menu a {width:460px;}
	.header .menu {width:100% !important;}
}
@media screen and (max-width: 320px) /* Portrait on smartphone */
{
	.panelContent img {width:300px;}
	.menu a {width:300px !important; padding-right:0;}
}