

#layerZero{
	border-bottom: 1px solid #000;
}

#layerOne{
	padding:0;
	text-align:left;
}

/* for titleLayers */
.title3{width:33.3%;padding-bottom:33.3%;}
.title2{width:50%;padding-bottom:50%;}
.title1{width:100%;padding-bottom:75%;}
.title3 img{width:100%;height:auto;/*margin-top:5%;*/}
.title2 img{width:65%;height:auto;/*margin-top:10%;*/}
.title1 img{width:50%;height:auto%;margin-top:5%;}

.layerTitle img{opacity:1;}
.layerTitle.selected img{opacity:1;}
.layerTitle{
	display:inline-block;
	position:relative;
	cursor:pointer;
	height:0;
	background-color:#ffcb05;
	box-shadow: 0 1px 0 rgba(0,0,0,0.5) inset;
}
.layerTitle div{
	position:absolute;
	font-size:1.5em;
	color:#000;
	width:100%;
}
.title2 div{bottom:0.5em;}
.title3 div{bottom:0;}
.title1 div{bottom:0.5em;}

.layerTitle:hover{
	background-color:#FFE066;
}
.layerTitle.selected{
	background-color:#FFE066;
}

/* for standard layers */

.layer, .layerNC{
	color:#000000;
	cursor:pointer;
	font-size:1em;
	padding:0.3em 1.5em 0.3em 0.9em;
	position:relative;
}
.layer:hover, .layerNC:hover{
	color:#000000;
	background-color:#FFE066;
}
.layer.selected, .layerNC.selected{
	color:#000000;
	background-color:#FFE066;
}
.layerGroup{
	position:relative;
}
.layerChild{
	position: absolute;
    top: 0;
    left: 105%;
    background-color: rgba(255,255,255,0.8);
    padding-bottom: 0.8em;
    width: 100%;
	opacity:1;
	transition: all 0.3s;
	transform:none;
}
.layerChild.hidden{
	transform: translate(-30%,0);
    opacity: 0;
}
.plusIcon, .tickIcon{
	width: 1.2em;
    height: 1.2em;
    float: right;
    margin-right: 0.3em;
	background-size:100%;
	position:absolute;
	top: 0.3em;
    right: 0.1em;
}
.plusIcon{background-image:url("image/plusLayer.png");}
.selected .plusIcon, .selected.plusIcon{
	background-image:url("image/minusLayer.png");
}
.tickIcon {
	outline: 1px solid rgba(0,92,169,1);
    outline-offset: -0.25em;
}
.selected .tickIcon {
	outline: 1px solid rgba(255,255,255,1);
	background-image:url("image/tickYes.png");
}

.layerSlider{
	height:1.5em;
	width:100%;
    background-color: #ffcb05;
	margin-bottom:0.5em;
}
.sliderClose{
    width: 1.4em;
    height: 1.4em;
	margin-right: 0.2em;
	cursor:pointer;
	float:right;
	background-image:url("image/close.png");
	background-size:100%;
}

.sliderClose:hover{
	background-image:url("image/closeHover.png");
}