@charset "UTF-8";
/* /climate/climate-guides/ */

/* top banner */
.feature {
	background-color: #826B59;
	background-image: url(images/cows-s.jpg);
	background-position-y: -360px;
	color: #fff;
	margin: 2em 0 ;
	min-height: 200px;
	}

.feature h1 {
	color: #fff;
	font-size: 2em;
	background: linear-gradient(to right, rgba(0,0,0,0.7), rgba(0,0,0,0.0));
	padding: 2rem;
	margin: 0 !important;
}
.feature p { margin:0; padding: 1em 1em 1em 2rem; color: #fff;   font-size: 1.1em; line-height: 1.8em;
	text-shadow: 0px 1px 3px #000;
}
.screen-shade {
background: linear-gradient(to bottom right, rgba(0,0,0,0.3), rgba(0,0,0,0.0));
}

h2 { margin-top: 2em; font-size: 1.4em; }

/* region lists */
.list-groups, .list-group { padding:0; margin:0;}
.list-groups { margin-bottom: 3em; }
.list-groups { display:flex; flex-direction: row; flex-wrap: wrap ; justify-items: stretch;}
.list-groups li { /* width: 1fr; flex-grow: 1 ;  */ width: 33%;  border-bottom: 1px dotted #fff; list-style: none;}

.list-groups > li {margin-left: 2px; }
.list-groups > li h3 {text-align: left ; padding: 0.6em; background-color: #e8eff4; }

.list-group { margin-top: 2px;}
.list-group > li { text-align:left; width: 100%; min-height: 2em;}

.list-group a {
display: inline-block;
background: url(http://www.bom.gov.au/water/images/symbols/icon_pdf.gif) no-repeat 4px 0.8em;
padding: .5em 0.8em .5em 1.4em;
}
.list-group span {
display: inline-block;
padding: .5em 0.8em .5em 1.4em;

background:#fff url(/images/ui/symbols/bullet-sub.gif) 0 .5em no-repeat;

}
.list-group span::before {
	content: '';
}

.list-group a:hover, .list-group a:active {background-color: #EFEFEF; }

a.pdf { background: url(http://www.bom.gov.au/water/images/symbols/icon_pdf.gif) no-repeat 0px 2px; padding-left: 1.2em;}

/* faqs*/
.faqs h2 {padding:.8em .4em .8em .4em; margin:1em 0 0 0; border-bottom:none;}
.faqs dl {margin:.4em 0; padding-top: .4em;}
.faqs dt {font-size:1em; margin:0;  padding:12px 4px 12px 20px; background:#fff url(/climate/images/symbols/plus.gif) no-repeat 4px 12px; border-top:#ccc dotted 1px; font-weight:normal; color:#000;}

.faqs dd {
	padding:12px 12px 12px 20px; margin-bottom:1em;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#efefef), to(#fff));
	background: -webkit-linear-gradient(bottom, #efefef, #ffffff);
	background:    -moz-linear-gradient(bottom, #efefef, #ffffff);
	background:     -ms-linear-gradient(bottom, #efefef, #ffffff);
	background:      -o-linear-gradient(bottom, #efefef, #ffffff);
	background:         linear-gradient(to top, #efefef, #ffffff);
}


.faqs dt:hover, #faqs dt:hover {background-color:#efefef;}

.faqs dt.opened, #faqs dt.opened {color:#000; font-weight:bold; background:#efefef url(/climate/images/symbols/minus.gif) no-repeat 4px 12px !important;}


svg { display:block; text-align:center; margin:auto; pointer-events: none;}

/* map container */
figure {margin:0;}

.flex-row {display:flex; flex-direction: row; }

/* html5 details/summary, use with details js shim old browsers */
details, summary { display: block;}
/* space first element contained in the summary */
summary + * { padding-top: 10px !important; }
summary::-webkit-details-marker { font-size:0px; display:none; } /*hide webkit (additional) arrow */

details { border: 4px solid #D5E9F7; margin: 5px 0; padding: 5px; }

summary { position: relative; background-color: #D5E9F7; padding: 10px 10px 10px 30px ; margin:0; font-size:1.2em; font-weight:bold;}

summary:before { transition: transform 100ms ease-in-out; }
summary[aria-expanded="false"], details summary[aria-expanded="true"] { background-image: none;}
summary[aria-expanded="false"]:before {
content: '+';
font-size:24px;
color: #94C6EB;
position: absolute;
top: 4px;
left: 8px;
z-index: 1;
}
summary[aria-expanded="true"]:before {
content: '+';
font-size:24px;
color: #94C6EB;
position: absolute;
top: 4px;
left: 8px;
z-index: 1;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}

summary:hover, summary:focus { background-color: #F7F7F7; }
/*
summary h2 { margin-top: 0; color: #000;}
*/
/*
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
}

.fa-home:before {
    content: "\f015";
}
*/

/*  .leaflet-top { top:60px;} temp - perhaps extra buttons added */
#map { display:block; height:950px; background-color: #aad3df; /*#efefef;*/ }  /* temp init vals */
/* leaflet popup */

@media screen and (max-width: 400px) {
	.popup { width: 90vw ; min-width:90vw;}
}
.leaflet-popup-content-wrapper, .leaflet-popup-tip {
    background: rgba(255,255,255, 0.9);
}
.leaflet-popup-content h3.title {color:#900; padding:0; margin:0;} /* .active */
.leaflet-popup-content h3.title.inactive {color:#666; padding:0; margin:0;}
.alt-name {color: #666; padding:0;}

/* leaflet home button */
.leaflet-control-zoomhome  a:nth-child(2)  {
    background: #fff url('map/icon-map-aus.svg') no-repeat 3px 4px !important; /* fa.fa-home */
}

/* map title and instruction */
#mapContainer h2 {
    font-size: 1.2em; 
    color: #000; 
    padding:1em; 
    margin:0; 
    background-color: #A3CCFF; /* #D5E9F7; */
	text-align: center;
	border: 4px solid #D5E9F7;
}