html, body{height:100%;}
body{
	margin:0;padding:0;
	overflow: hidden;
	position:relative;
	background-color:transparent; /* DON'T MODIFY TO DISPLAY 2D/3D VIEWS IN LANDSIM3D STUDIO */
	text-align:center;
	color:#fff;
	font-family: 'Arial';
	
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
user-drag: none; 
-webkit-user-drag: none;
}

::selection {
  background: transparent;
}
::-moz-selection {
  background: transparent;
}

/* Loading information menus */
.loader{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	text-align:center;
	z-index:2;
	color:#ffffff;
	/*text-shadow: 0 0 1px #FFF;*/
    background-color: rgba(51,51,51,0.3);
}
.load_type{
	margin:0.5em;
	font-size:1.2em;
	font-family: Arial;
}
.load_info{
	margin:0.5em;
}
.load_progress{
	width: 15em;
    height: 1em;
    border: 1px solid #CCC;
	border-radius:1em;
	overflow:hidden;
    background-color: rgba(51,51,51,0.3);
}
.load_percent{
	background-color:#831b7e;
	height:100%;
}

/* Icons */

.icon{
	width:2.5em; height:2.5em;
	margin:0 0.5em;
	display:inline-block;
	border-radius:100%;
	background-color:#2c8f88;
	cursor:pointer;
	border:3px solid transparent;
	position:relative;
	vertical-align:top;
	opacity:0.6;
}
.icon img{
	width:100%; 
	height:100%;
 }
.icon:hover{ 
	border: 3px solid #5dd5b0;
	opacity:1;
}
.icon.selected{
	background-color:#5dd5b0;
	opacity:1;
}

.textIconCenter{
	position:absolute;
	top:50%;
	transform:translate(-50%, -50%);
}

/* Views and menus */

#views{
	width:100%; height:100%;
	background-color:transparent;
}

#topMenu{
	position:absolute;
	top:0;
	display:inline-block;
	transform:none;
	transition: transform 0.3s;
}	
#leftMenu{
	position:absolute;
	top:1.5em;
	width:12em;
	left:0;
	transition: all 0.3s; 
	opacity:0.9;
	background-color:rgb(255,255,255,0.6);
}
#leftMenu.hidden{
	transform:translate(-100%,0);opacity:0;
}
#layerMenu{
	/*padding-top:1.5em;*/
	/*background-color:#fe510c;*/
	/*border-radius:0 0 0.5em 0;*/
}

#navigationMenu{
	position:absolute;
	top: 4em;
	width:16em;
	right:0;
	transition: opacity 0.3s;
	opacity:1;
}
#navigationMenu.hidden{opacity:0;}
#bottomMenu{
	position:absolute;
	bottom: 0.5em;
	left:15%;
	transition: all 0.3s; opacity:1;
}
#bottomMiddleMenu{
	position: absolute;
    right: 40%;
    transform: translate(50%, 0);
    bottom: 0.5em;
	transition: all 0.3s;
	opacity:1;
}

#bottomMenu.hidden{
	transform:translate(0, 120%);opacity:0;
}
#bottomMiddleMenu.hidden{
	transform:translate(50%, 120%);opacity:0;
}
#bottomRightMenu{
	position:absolute;
	bottom:0.5em;
	right:1em;
}

/* Popups */
.popup {
    box-shadow: 0 0 1em rgba(0, 0, 0, 0.1);
    z-index: 10;
}
.popupContent {
    padding: 0.5em;
    box-sizing: border-box;
	background-color: rgba(255,255,255,0.8);
	border-radius: 0 0 0.5em 0.5em;
	min-width: 100%;
	overflow:auto;
}
.popupTitle {
    padding: 0.25em 0.25em 0.25em 1.25em;
    cursor: move;
    position: relative;
    color: #000;
    background: rgba(255,255,255,1.0);
	border-radius:0.5em 0.5em 0 0;
	text-align: center;
	min-height: 1.2em;
}
.popupTitle span {
    top: -0.2em;
    position: relative;
    padding-left: 0.4em;
    padding-right: 1.4em;
}
.popupTitleIcon{
	width: 1.2em;
    height: 1.2em;
	background-size:100%;
}
.popupClose{
	background-image:url(image/close.png);
	cursor:pointer;
	filter: none;
}
.popupClose:hover{
	background-image:url(image/closeHover.png);
}

/* loading page */
#loadingAdd{
	opacity:1;
	transition:opacity 2s;
}
#loadingAdd.hidden{opacity:0;}
#mainTitle{
	position:absolute;
	top:33%; left:50%;
	width:60%;
	transform:translate(-50%, -50%);
	
}
#bouleDeco{
	position:absolute;
	bottom: 0;
    left: 0;
    width: 50%;
    opacity: 0.2;
}
#backgroundLoading{
	position:absolute;
	top:0; left:0;
	height:100%;width:100%;
	background: radial-gradient(#EEE 60% ,#edc9ec, #f9d9f8); /*LandSim3D color do not edit*/
	-webkit-animation: colorchange 5s;
	-webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
	animation: colorchange 5s;
    animation-iteration-count: infinite;
}
#infoVersion{
	position:absolute;
	bottom:0;
	right: 0;
    padding: 0.5em 1em;
	color:#6f006c; /*LandSim3D color do not edit*/
}
@-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
{
  0%   { -webkit-filter:brightness(1);}
  50%  { -webkit-filter:brightness(1.2);}
  100% { -webkit-filter:brightness(1);}
}
@keyframes colorchange
{
  0%   {-webkit-filter:brightness(1);filter:brightness(1);}
  50%  {-webkit-filter:brightness(1.2);filter:brightness(1.3);}
  100% {-webkit-filter:brightness(1);filter:brightness(1);}
}

