@charset "utf-8";

/*
/* AQUA THEME
/*/

/* Colour 1: #002F3D */
.aqua .links li:hover a, /* Colour 2: #004A61 */
.aqua .button.themed:active, .aqua#region-picker.active {
	background-color: #004A61;
}

/* Colour 3: #005E7B */
.aqua #tertiary-content .priorities, .aqua #tertiary-content .priorities .nav li {
	background-color: #005E7B;
}

/* Colour 4: #0097AA */
.aqua #subnav .parent, .aqua #nav li a:hover, .aqua #nav li.selected, .aqua .button.themed {
	background-color: #0097AA;
}

.aqua #subnav .parent .current {
	background-color: #0097AA !important;
}

.aqua .withtargets .target, .aqua .button.themed {
	border-color: #0097AA !important;
}

/* Colour 5: #C0E4E0 */
.aqua #nav li.inline a, .aqua#region-picker a, .aqua #tertiary-content .priorities.listing h4, .aqua #tertiary-content .priorities a {
	color: #C0E4E0;
}

/* Colour 6: #307b92*/
.aqua #tertiary-content .priorities.listing img, .aqua #tertiary-content .priorities.listing li {
	border-color: #307b92;
}

/* Nav divider colours:#142C3B and #617988*/
.aqua #nav li a {
	border-right: 1px solid #142C3B;
}

.aqua #nav, .aqua #nav li.right a {
	border-left: 1px solid #142C3B
}

.aqua #nav li, .aqua #nav li.highlight {
	border-right: 1px solid #617988
}

.aqua #nav li.home-link, .aqua #nav li.right {
	border-left: 1px solid #617988;
}

/* themed buttons. Gradiate between Colour 2 and 4*/
.aqua .button.themed {
	background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00707e), color-stop(0.5, #0097AA));
	background:-moz-linear-gradient(center bottom, #00707e 0%, #0097AA 50%) repeat scroll 0 0 transparent;
}

.aqua .button.themed:hover, .aqua .button.themed:active {
	background-color:#00707e;
	background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0097AA), color-stop(0.5, #00707e));
	background: -moz-linear-gradient(center bottom, #0097AA 0%, #00707e 50%);
}

/* themed bullets*/
.aqua#region-picker li {
	background:url(/shared/images/global/bullet-light-blue.png) no-repeat 0 50%;
}

.aqua .copy ul li {
	background:url(/shared/images/global/bullet-light-blue.png) no-repeat 0.5em 0.5em;
}

/* region-picker
-------------------------------------------------- */

#region-picker {
	position:absolute;
 left:;
	height:50px;
	top:-1px;
	z-index:200;
	width: 250px;
	padding: 0 0 0 170px;
	overflow:hidden;
	font: 12px/1.333 Helvetica, Arial, sans-serif;
}

#region-picker.active {
	overflow:visible;
	color:white;
	padding: 80px 20px 20px 170px;
	height:300px;
	width: 500px;
	border:1px solid white;
	-webkit-box-shadow: 0px 0px 10px #000;
	-moz-box-shadow: 0px 0px 10px #000;
	box-shadow: 0px 0px 10px #000;
	background-image:url(/shared//images/global/map-light.png);
	background-repeat:no-repeat;
	background-position:100% 100%;
}

#region-picker p {
	position:absolute;
	top:155px;
	left:21px;
	width:100px;
	font: 22px/1.1 WWFRegular, Arial, sans-serif;
	text-shadow: 0 1px 2px rgba(0,0,0,0.7);
}

#region-picker a:hover {
	color:white;
}

#region-picker ul {
	float:left;
	width:161px;
}

#region-picker li {
	list-style-type:none;
	position:absolute;
	left:-5000px;
	padding-left:10px;
}

#region-picker.active li {
	position:relative;
	left:auto;
}

#region-picker li.selected {
	position:absolute !important;
	top: 5px !important;
	left:170px !important;
	padding:4px 0 15px 50px;
	background: url(/shared/images/global/wwf-globe.png) 5px -60px no-repeat;
	cursor: pointer;
	border-bottom:0;
	width:121px;
	height: 30px;
	text-indent: -9999px;
}

#region-picker li.selected:hover {
	margin-top:3px;
	margin-left:-1px;
	padding:0 5px 10px 50px;
	border:1px solid #BFBEB6;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	background: #FFF url(/shared/images/global/wwf-globe.png) 5px -64px no-repeat;
}

#region-picker.active li.selected {
	padding:0 5px 15px 50px;
	background: url(/shared/images/global/wwf-globe.png) 0 5px no-repeat;
	width:465px;
	border-bottom:1px solid #CCC;
}

#region-picker.active li.selected:hover {
	border:0;
	border-bottom:1px solid #CCC;
	margin:0;
}

#region-picker .selected a {
	outline:none;
	color:#222;
	padding-right:30px;
	background: url(/shared/images/global/region-picker-bg.png) right 10px no-repeat;
	display: block;
	height: 40px;
}

#region-picker li.selected:hover a {
	background: url(/shared/images/global/region-picker-bg.png) right -70px no-repeat;
}

#region-picker.active .selected a {
	color:white;
	text-shadow: 0 1px 2px rgba(0,0,0,0.7);
	background:none;
}

#region-picker.active li.selected:hover a {
	background: none;
}

#region-picker.active {
	height:400px;
}

#region-picker.active .close {
	background-image:url(/shared/images/global/button-close.png);
	background-repeat:no-repeat;
	background-position:5px 5px;
	width: 20px;
	height: 20px;
	top: 5px;
	right: 5px;
	position: absolute;
	display: block;
	z-index: -1;
}

#region-picker .close {
	display: none;
}

/* main stage */

#keyVisual #panel {
	margin: 0 auto;
	position: relative;
	width: 980px;
	height: 311px;
	overflow: hidden;
	background: #000000;
}

#keyVisual #panel img {
	vertical-align: top;
	line-height: 1;
	font-size: 1px;
}

#keyVisual #panel .up,
#keyVisual #panel .down {
	height: 20px;
}

#keyVisual #panel .panelTitle {
	position: absolute;
	top: 201px;
	background: url(/images/mainstage/thumbnail/bg_content_1.png);
	padding: 15px;
	width: 482px;
	height: 58px;
	display: none;
}

#keyVisual #panel #panelTitle_1 {
	left: 980px;
}

#keyVisual #panel #panelTitle_2,
#keyVisual #panel #panelTitle_3,
#keyVisual #panel #panelTitle_4,
#keyVisual #panel #panelTitle_5,
#keyVisual #panel #panelTitle_6,
#keyVisual #panel #panelTitle_7 {
	left: 162px;
}

#keyVisual #panel #contentsList {
	position: absolute;
	top: 0;
	right: -300px;
}

#keyVisual #panel #contentsListOuter {
	margin-bottom: 1px;
	overflow:hidden;
	width: 295px;
	height: 269px;
}

#keyVisual #panel #contentsListOuter .thum {
	margin: 1px 0 0;
	padding: 14px 14px 15px;
	display: table;
	width: 267px;
	background: url(/images/mainstage/thumbnail/bg_content_1.png);
	line-height: 1;
	font-size: 1px;
}

#keyVisual #panel #contentsListOuter .thum .image {
	padding-right: 10px;
	width: 79px;
	height: 60px;
	display: table-cell;
}

#keyVisual #panel #contentsListOuter .thum .image img {
	padding: 1px;
	border: 1px solid #cccccc;
	background: #ffffff;
}

#keyVisual #panel #contentsListOuter .thum .text {
	display: table-cell;
	vertical-align: middle;
	line-height: 1.3;
	font-size: 14px;
	width: 177px;
}

#keyVisual #panel a {
	text-decoration: none;
}

#keyVisual #panel a h2 {
	font-weight: bold;
	font-size: 24px;
	margin-bottom: 8px;
	color: #222222;
	text-decoration: underline;
}

#keyVisual #panel a p {
	text-decoration: underline;
}

#keyVisual #currentNavi {
	position:absolute;
	right:1px;
	top:50px;
	display:none;
}

#keyVisual #currentNavi li{
	margin-bottom: 1px;
}

#keyVisual #mainImage {
	display:none;
}

#keyVisual #panelInner {
	position:relative;
}