@font-face {
	font-family: 'GoboldThin';
	src: url('GoboldThin.eot?#iefix') format('embedded-opentype'),  url('GoboldThin.woff') format('woff'), url('GoboldThin.ttf')  format('truetype'), url('GoboldThin.svg#GoboldThin') format('svg');
	font-weight: normal;
	font-style: normal;
  }
  

body {	
	margin:0;
	padding:0;	
	font-family:GoboldThin;
	background-color:rgba(255,255,255,1.0);
	overflow:hidden;
}

/* Console */
#console{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	margin:0;
	padding:0;
	border:0;
	background-color:#222;
	font-family: 'Times New Roman', Times, serif;
	font-size: 10px;
	font-weight: normal;	
	color:lightskyblue;
	visibility: visible;
	width:100vw;
	height:100px;
}

.titre_console{
	position:absolute;
	top:0;
	left:0;
	right:0;
	margin:0;
	padding:0;
	border:0;
	background-color:#444;
	font-family:'Arial';
	font-size: 14px;
	font-weight: normal;
	line-height: 18px;
	color: white;
	width:100vw;
	height:18px;
}

#console_contain{
	position:absolute;
	top:18px;
	left:0;
	right:0;
	height:80px;
	width:100vw;
	margin:0;
	padding:0;
	border:0;
	overflow-y: scroll;
}
/* Console */

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.big-container {
	position:absolute;
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	background-color:rgba(255,255,255,1.0);
}

.container {
	width: 100vw; 
    height: 56.25vw;
	max-height: 100vh;
    max-width: 177.8vh; /* 16/9 = 1.778 */
    margin: auto;
    position: absolute;
    top:0;bottom:0; /* vertical center */
    left:0;right:0; /* horizontal center */
}

#Logo_Client {
	position:absolute;
	top:1vw;
	left:1vw;
	margin:0;
	padding:0;
	visibility:visible;
}

#Logo_Residence {
	position:absolute;
	top:1vw;
	left:15%;
	margin:0;
	padding:0;
	visibility:visible;
}


#lightBox {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	border: 0;	
	opacity:0.0;
	visibility:hidden;
	background-color: white;
}

#ifrm-axo {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	border: 0;
}

.Loader{
	width:100%;
	height:100%;
	margin: auto;
    position: absolute;
    top:0;bottom:0; /* vertical center */
    left:0;right:0; /* horizontal center */
	display:block;
	background-color:rgba(255,255,255,0.75);
	overflow:hidden;
}

.loaderCircle {
	position: absolute;	
	margin: auto;
    top:0;bottom:0; /* vertical center */
    left:0;right:0; /* horizontal center */
	width:3.3vw;
	height:3.3vw;
	padding-bottom:6.25vw;
	transform-origin: 1.65vw 1.65vw;
	animation: rotating 1.5s linear 0s infinite; 
}

 @keyframes rotating {
          from { transform: rotate(0deg); }
          to { transform: rotate(-360deg); }
          }

.loaderVisio {
	position: absolute;
    top:0;bottom:0; /* vertical center */
	left:0;right:0; /* horizontal center */
	width:10.42vw;
	height:auto;
	margin:auto;
	padding-top:6.25vw;
}

#GUI{
	position:absolute;
	bottom:0px;
	left:0px;
	margin:0;
	padding:0;
}

#GUI_Haut{
	position:absolute;
	bottom:0px;
	left:0px;
	margin:0;
	padding:0;
	pointer-events: none;
	visibility:visible;
}

#loader {
	position:absolute;
	top:0;
	left:0;	
	right:0;
	bottom:0;
	width:100vw;
	height:100vh;
	visibility:visible;
	z-index:10;
	background-color:rgba(255,255,255,0.0);
}

#btZoomMoins{
	cursor:pointer;
}

#btZoomPlus{
	cursor:pointer;
}

/* Autre */

.transparent {
	fill: rgba(255,255,255,0);
}

.vert {
	fill: #6ed901;
	fill-rule: evenodd;
}

.bleu {
	fill: #3599ff;
	fill-rule: evenodd;
}

.orange {
	fill: #ff9326;
	fill-rule: evenodd;
}

.rose {
	fill: #ff356b;
	fill-rule: evenodd;
}

.fondBt{
    fill: #333437;
}

.grisZoom {
    fill: #6f737b;
}

.gris{
	fill: #3E3F44;
}

.blancZoom {
    fill: #ffffff;
}

.barreZoom{
	position:absolute;
	right:0px;
	bottom:0px;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	z-index:555;
}

.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#333437;}
.st1{fill:#858A92;}
.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
.st3{fill:#FFFFFF;}

.blanc {
	fill: #fff;
}

.btActive{
	cursor:pointer;
	pointer-events: auto;
}

.affBat{
	position:absolute;
	width:12vw;
	height:3.5vw;
	min-width:120px;
	right:-1vw;
	bottom:0;
	margin:0;
	padding:0;
}

.textAxo{
    font-size: 30px;
    font-family: GoboldThin;	
    fill: #222;
}

#idBat{
    font-size: 30px;
    font-family: GoboldThin;	
    fill: #FFF;
}

#loader-canvas {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
		
        border: 3px solid transparent;		
		border-top-color: #606d75;
		border-radius: 50%;
        z-index: 1500;		
		
		-webkit-animation: spin 1.5s linear infinite;
		animation: spin 1.5s linear infinite;
}

#loader-canvas:before {
    content: "";
    position: absolute;
    top: 6px;
    left: 6px;
    right: 6px;
    bottom: 6px;
    border: 3px solid transparent;
	border-top-color: #c8591e;
	border-radius: 50%;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}
#loader-canvas:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border: 3px solid transparent;
	border-top-color: #1b8159;
	border-radius: 50%;
	
	-webkit-animation: spin 3s linear infinite;
	animation: spin 3s linear infinite;
}

/* include this only once */
@-webkit-keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}
@keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}

#loaderView {
	position:absolute;
	display:block;
	left:0%;
	bottom:0%;
	width:100%;
	height:100%;
	overflow:hidden;
	opacity:1.0;
}

#loadingTxt {
	position:absolute;
	display:block;
	color:rgba(69,63,72,1.0);
	left:50%;
	top:50%;
	height:36px;
	width:150px;
	margin: -18px 0 0 -75px;
	color:black;
	font-size:24px;
	font-family:arial;
	text-align:center;
	line-height:36px;
	vertical-align:middle;
}

#btFermer {
	position:absolute;
	display:block;
	top:32px;
	right:5px;
	width:40px;
	height:40px;	
	transform:scale(1);
	transform-origin:top right;
	cursor: pointer;
}

.imgFull{
	display:block;
	position:absolute;
	left:0;
	right:0;
	border:0;
	width:100%;
	height:100%;
}

/* Fullscreen */
#btFullScreenContainer {
	position: absolute;
	display:block;
	left: 89.4%;
	top: 1.9%;
	width: 2.9%;
	height: 5.2%;
	margin: 0;
	padding: 0;
}

#fermerFrame{
	position:absolute;
	top:1.2vw;
	right:1.5vw;
	width:2.5vw;
	height:2.5vw;
	border:0px;
	cursor:pointer;
	margin:0;
}

/* Zones click */

#panel_BatBE {	
	opacity:0.0;
	cursor:pointer;
}
#panel_BatCF {	
	opacity:0.0;
	cursor:pointer;
}

#BatBE{	
	cursor:pointer;
}
#BatCF{	
	cursor:pointer;
}

.BatBE{
	fill:rgba(255, 53, 107, 0.3);
	stroke: #fff;
	stroke-miterlimit: 10;
	stroke-width: 3px;
	opacity:0.0;
	transition: opacity 0.3s linear;
	cursor:pointer;
}
#BatBE:hover > .BatBE{
	opacity:1.0;
	transition: opacity 0.3s linear;
}
#BatBE:hover > #panel_BatBE {	
	opacity:1.0;
}

.BatCF{
	fill:rgba(53, 153, 255,0.3);
	stroke: #fff;
	stroke-miterlimit: 10;
	stroke-width: 3px;
	opacity:0.0;
	transition: opacity 0.3s linear;
	cursor:pointer;
}
#BatCF:hover > .BatCF{
	opacity:1.0;
	transition: opacity 0.3s linear;
}
#BatCF:hover > #panel_BatCF {	
	opacity:1.0;
}


/* Select Batiment */
.selectBat{
	position:absolute;
	width:12vw;
	height:10vh;
	min-width:120px;
	left:0;
	right:0;
	bottom:2vh;
	margin:0 auto;
	padding:0;
}
.boutonFond {
    fill: #3E3F44;
    stroke: #fff;
    stroke-miterlimit: 10;
    fill-rule: evenodd;
}

.textBouton {
    font-size: 20px;
    fill: #fff;
    font-family: GoboldThin;
}
.textPuces {
    font-size: 18px;
    font-family: GoboldThin;	
    fill: #ffffff;
}
