@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:arial;
	background-color:rgba(255,255,255,1.0);
	overflow:hidden;
}

.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 */
}

#canvas {
	position:absolute;
	top:0;
	left:0;
	margin:0;
	padding:0;
	visibility:visible;
	-ms-touch-action:none;	
	touch-action: none;
}

.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_Haut{
	position:absolute;
	top:0px;
	left:0px;
	margin:0;
	padding:0;
	pointer-events: none;
}
#GUI_Boussole{
	position:absolute;
	top:10.8%;
	right:10px;
	margin:0;
	padding:0;
	pointer-events: none;
}
#GUI_FondInterface{
	position:absolute;
	bottom:1%;
	left:0;
	margin:0;
	padding:0;
	pointer-events: none;
}
#GUI_Boutons{
	position:absolute;
	bottom:1%;
	left:0;
	margin:0;
	padding:0;
	pointer-events: none;
}
#GUI_Zoom{
	position:absolute;
	bottom:12%;
	left:0;
	margin:0;
	padding:0;
	pointer-events: none;
}


#logo_urbis {
	position:absolute;
	top:10px;
	left:0px;
	margin:0;
	padding:0;
	pointer-events: none;
}

#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);
}

.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;
}


.btPointer{
	cursor:pointer;
	pointer-events: auto;
}

#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%;
}

/* #region Boussole */
.boussole0{
	fill-rule:evenodd;
	clip-rule:evenodd;
	fill:#EAEBED;
}
.boussole1{
	fill-rule:evenodd;
	clip-rule:evenodd;
	fill:#333649;
}	
.traitBoussole{
	fill-rule:evenodd;
	clip-rule:evenodd;
	fill:none;stroke:#333649;
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-miterlimit:10;
}
/* #endregion */

/* #region Colors */
.none { fill: none; }
.transparent { fill: rgba(255,255,255,0); }
.blanc { fill: #fff; }
.blancCrop { fill: #fff; fill-rule: evenodd; }
.fondBt{ fill: #333437; }
.blancZoom { fill: #ffffff; }
.noir { fill: #1e181a; }
.gris { fill: #3E4149; }
.grisClair { fill: #6f737b; }
.vert { fill: #6dd900; }
.rose { fill: #ff3366; }
.bleu { fill: #50d2c2; }
.jaune { fill: #ff9326; }
.fondPuces { fill: #3e3f44; }
.darkcyan { fill: #006666; }
.rouge { fill:#FF0000; }
.colorBtnActive { fill:#51545c; }



.orange {
	fill: #ff9326;
	fill-rule: evenodd;
}


.contourGris { stroke: #5e636c; stroke-width: 2px; }
.contourNoir { stroke: #1e181a; stroke-width: 2px; }
.contourBtnActive { stroke: #51545c; stroke-width: 2px; }

/* #endregion */

/* #region Logo Client */
#logoClient {
	position:absolute;
	left:0.7%;
	top:1.5%;
}
.logo-tagerim-1 {
	fill: url(#logo-tagerim-linear-gradient);
}

.logo-tagerim-2 {
	fill: #474b4d;
}

.logo-tagerim-3 {
	mask: url(#mask);
}

.logo-tagerim-4 {
	fill: #d60142;
}

.logo-tagerim-5 {
	fill: none;
}

.logo-tagerim-6 {
	filter: url(#logo-tagerim-luminosity-noclip);
}
/* #endregion */

/* #region Nouvelle interface */
#GUI_Interface {
	position:absolute;
	left:27.5%;
	top:85.46%;
}
.cls-1, .cls-4 {
	fill: #383838;
  }

  .cls-2 {
	stroke: #fff;
  }

  .cls-14, .cls-2, .cls-3, .cls-5 {
	stroke-miterlimit: 10;
  }

  .cls-14, .cls-3 {
	fill: #fff;
  }

  .cls-3 {
	stroke: #5b5b5b;
  }

  .cls-11, .cls-15, .cls-16, .cls-18, .cls-4 {
	fill-rule: evenodd;
  }

  .cls-17, .cls-5 {
	fill: none;
  }

  .cls-14, .cls-5 {
	stroke: #000;
  }

  .cls-5 {
	stroke-width: 2px;
  }

  .cls-6 {
	font-size: 19px;
	fill: #515151;
	font-family: GoboldThin, 'Gobold Thin';
  }

  .cls-7 {
	letter-spacing: -0.01em;
  }

  .ombre_zoom {
	fill:rgba(81,84,92,0.15);
  }

  .cls-15 {
	fill: #c0c2c1;
  }

  .cls-9 {
	fill: #51545c;
  }

  .cls-10 {
	fill: #6f737b;
  }

  .cls-11, .cls-13 {
	fill: #eaebed;
  }

  .cls-12 {
	fill: #6d727c;
  }

  .cls-14 {
	opacity: 0.2;
  }

  .cls-16 {
	fill: #333649;
  }

  .cls-17 {
	stroke: #333649;
	stroke-linecap: round;
	stroke-linejoin: round;
  }

  .cls-18 {
	fill: red;
  }
/* #endregion */


/* #region Logo Visiolab */
#logoVisio {
	position:absolute;
	left:0.7%;
	top:0;
}
.visioTexte {
	fill: #000;
}
.visioDeg1 {
	fill: url(#degrade);
	stroke: url(#degrade);
	stroke-width: 2px;
}

.visioDeg2 {
	fill: url(#degrade-2);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg3 {
	fill: url(#degrade-3);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg4 {
	fill: url(#degrade-4);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg5 {
	fill: url(#degrade-5);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg6 {
	fill: url(#degrade-6);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg7 {
	fill: url(#degrade-7);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}

.visioDeg8 {
	fill: url(#degrade-8);
	stroke: url(#degrade-2);
	stroke-width: 2px;
}
/* #endregion */


/* #region Logo client */
#logoSaintAgne {
	position:absolute;
	left:5px;
	top:5px;
	width:15%;
	height:auto;
}
/* #endregion */


/* #region Titre */
#titre-residence {
	position:absolute;
	left:40.625%;
	top:1.57%;
}
#adresse-residence {
	position:absolute;
	left:37.91%;
	top:7.96%;
}
.adresse-1 {
	fill: #41484b;
}
.nom-1 {
	fill: #41484b;
}
/* #endregion */

/* region Fullscreen */
#GUI_Fullscreen {
	position:absolute;
	left:92%;
	top:3.33%;
}
.fullscreen-1 {
	fill: #383838;
}
.fullscreen-2 {
	fill: #fff;
}
/* #endregion */

/* #region lightbox */
#lightBox {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	border: 0;	
	opacity:0.0;
	display:none;
	background-color: white;
}
#ifrm-axo {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	border: 0;
}
#fermerFrame{
	position:absolute;
	left:95.15%;
	top:3.33%;

    width:2.5%;
    height:4.44%;
	cursor: pointer;
	
}

#affBat{
	position:absolute;
	width:6vw;
	height:auto;
	left:70%;
	top:2%;
	margin:0;
	padding:0;
	overflow: visible;
}
#textAxo{
    font-size: 24px;
    font-family: GoboldThin;	
    fill: #222;
    fill: #FFF;
}
#idBat{
    font-size: 30px;
    font-family: GoboldThin;	
    fill: #FFF;
}
/* #endregion */

/* #region */
#GUI-logo {
	position: absolute;
	left: 62px;
	top: 10px;
	width: 26%;
	max-width: 280px;
	height: auto;
	padding: 10px 0 0 20px;
}

#GUI-logo.caimmo {
	width: 20%;
	max-width: 270px;
	/* width: 22%;
	max-width: 240px; */
}
/* #endregion */


