html, body { height:100%; overflow:hidden; }
body { margin:0; width:100%; background:#fff; }
p { margin:0; padding:0; }
#panocontent{ margin-top:80px; }

/* --- FONTS --- */

@font-face {
    font-family: 'roboto_condensedlight_italic';
    src: url('fonts/robotocondensed-lightitalic-webfont.eot');
    src: url('fonts/robotocondensed-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-lightitalic-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-lightitalic-webfont.woff') format('woff'),
         url('fonts/robotocondensed-lightitalic-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-lightitalic-webfont.svg#roboto_condensedlight_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedlight';
    src: url('fonts/robotocondensed-light-webfont.eot');
    src: url('fonts/robotocondensed-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-light-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-light-webfont.woff') format('woff'),
         url('fonts/robotocondensed-light-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-light-webfont.svg#roboto_condensedlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedbold';
    src: url('fonts/robotocondensed-bold-webfont.eot');
    src: url('fonts/robotocondensed-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-bold-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-bold-webfont.woff') format('woff'),
         url('fonts/robotocondensed-bold-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-bold-webfont.svg#roboto_condensedbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condenseditalic';
    src: url('robotocondensed-italic-webfont.eot');
    src: url('fonts/robotocondensed-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-italic-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-italic-webfont.woff') format('woff'),
         url('fonts/robotocondensed-italic-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-italic-webfont.svg#roboto_condenseditalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedregular';
    src: url('fonts/robotocondensed-regular-webfont.eot');
    src: url('fonts/robotocondensed-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-regular-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-regular-webfont.woff') format('woff'),
         url('fonts/robotocondensed-regular-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-regular-webfont.svg#roboto_condensedregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_condensedbold_italic';
    src: url('fonts/robotocondensed-bolditalic-webfont.eot');
    src: url('fonts/robotocondensed-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotocondensed-bolditalic-webfont.woff2') format('woff2'),
         url('fonts/robotocondensed-bolditalic-webfont.woff') format('woff'),
         url('fonts/robotocondensed-bolditalic-webfont.ttf') format('truetype'),
         url('fonts/robotocondensed-bolditalic-webfont.svg#roboto_condensedbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_slabbold';
    src: url('fonts/robotoslab-bold-webfont.eot');
    src: url('fonts/robotoslab-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-bold-webfont.woff2') format('woff2'),
         url('fonts/robotoslab-bold-webfont.woff') format('woff'),
         url('fonts/robotoslab-bold-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-bold-webfont.svg#roboto_slabbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_slablight';
    src: url('fonts/robotoslab-light-webfont.eot');
    src: url('fonts/robotoslab-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-light-webfont.woff2') format('woff2'),
         url('fonts/robotoslab-light-webfont.woff') format('woff'),
         url('fonts/robotoslab-light-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-light-webfont.svg#roboto_slablight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_slabthin';
    src: url('fonts/robotoslab-thin-webfont.eot');
    src: url('fonts/robotoslab-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-thin-webfont.woff2') format('woff2'),
         url('fonts/robotoslab-thin-webfont.woff') format('woff'),
         url('fonts/robotoslab-thin-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-thin-webfont.svg#roboto_slabthin') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto_slabregular';
    src: url('fonts/robotoslab-regular-webfont.eot');
    src: url('fonts/robotoslab-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-regular-webfont.woff2') format('woff2'),
         url('fonts/robotoslab-regular-webfont.woff') format('woff'),
         url('fonts/robotoslab-regular-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* xxx FIN FONTS xxx */

/*------------------ HEADER ----------------- */

#headerVV{ position:absolute; z-index:2004; width:100%; padding:0; font-family:Verdana, Arial; line-height:38px; background:#fff; }

p.contentLogo{ float:left; margin:15px 2% 0px 12px; }

img.logoClient{ float:left; }

p.headTitle{ float:left; font-size: 33px; line-height:30px; color:#104856; text-transform:uppercase; font-family: Impact, "Arial Black", sans-serif; margin-right:10px; }

p.headSubTitle{ margin-top:17px; float:left; font-size: 18px; line-height:18px; color:#104856; font-family:Impact, "Arial Black", sans-serif; margin-right:10px; }

img.star{ float:left; margin-right:2px; }
img.premium, img.insolite{ float:left;margin-top:2px; }

	/* |---> Menu */
	
	.menuMobile{ display:none; }
	
	.onglets{ float:right; margin:0px 10px 15px 0; padding:0; }
	
	.onglets li{ float:left; list-style:none; display:inline; cursor:pointer; font-family: Impact, "Arial Black", sans-serif; }
	
	.onglets li.navMenu{ position:relative; margin-right:10px; font-size:18px; color:#3d7f9b; padding:2px 20px; border-radius: 8px 8px 8px 8px;
		-moz-border-radius: 8px 8px 8px 8px;
		-webkit-border-radius: 8px 8px 8px 8px;
		background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(230,227,230,1) 48%, rgba(237,237,237,1) 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(48%, rgba(230,227,230,1)), color-stop(100%, rgba(237,237,237,1)));
		background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(230,227,230,1) 48%, rgba(237,237,237,1) 100%);
		background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(230,227,230,1) 48%, rgba(237,237,237,1) 100%);
		background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(230,227,230,1) 48%, rgba(237,237,237,1) 100%);
		background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(230,227,230,1) 48%, rgba(237,237,237,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );
		line-height: 28px;
		border: 1px solid #e9e9e9;
	}

	.onglets li.navMenu:hover, .onglets li.current{
		background:url(../img/bck-onglet.gif);
		background-repeat: repeat-x;
		/*padding-top: 8px;
		margin-top: -6px;*/
	}
	
	.onglets li.current ul li{ margin-top: 0px; padding-top: 5px; }
	
	/*.navMenu.current ul{ margin-top:20px; }*/
	
	.sousMenu{ /*height:0;*/ overflow:hidden; position:absolute; z-index:4000; right:0; /*top:40px;*/ margin:2px 0 0 0; padding:16px 0 0 0; line-height: 25px; background:#fff; display:none; }
	.scrollMenu{ overflow-x:hidden; overflow-y:auto; padding:0; }

		/* |---> Sous Menu */
		.sousMenu li:first-child{ /*margin-top:22px;*/ }
		.sousMenu li{ padding:5px;background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); }
		.sousMenu li:hover{background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(195,212,219,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(195,212,219,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(195,212,219,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(195,212,219,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(195,212,219,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(195,212,219,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c3d4db', GradientType=0 ); }
		.sousMenu .itemSousMenu.current p.itemTitre{ color:#fff; }
		.sousMenu .itemSousMenu.current p.itemSousTitre{ color:#eae9ea; }
		.sousMenu img.itemPict{ float:left; margin-right:10px; }
		.sousMenu .itemSousMenu.current{ background: #3d7f9b;}
		.sousMenu p.itemTitre{ margin-right:15px; font-size:13px; color:#3d7f9b; font-weight:bold;letter-spacing:-1px; text-transform:uppercase;font-family:Arial,Helvetica Neue,Helvetica,sans-serif; }
		.sousMenu p.itemSousTitre{ font-size:12px; color:#104856; margin-top: -5px;}
		.sousMenu p{ float:left; line-height:16px; }
		
/*XXxx Fin HEADER xxXX*/

/*------------------ MENU DEROULANT NOMS PANOS ----------------- */

#titrePano{ position:absolute; z-index:10; top:90px; left:12px; color:#fff; overflow-y:auto;}

#comboBox{ height:30px; }

#nomsPanos{
	margin:0;
	padding:5px 0 0 0px;
	font-family:Arial,Helvetica Neue,Helvetica,sans-serif;
	overflow-y: auto;
	overflow-x: hidden;
}

#nomsPanos li{
	list-style:none;
	text-shadow: -2px 2px 2px rgba(0,0,0, 0.5);
	float:left;
	line-height:28px;
	font-size:20px;
	/*padding:0 20px 0 0;*/
	padding:0;
	cursor:pointer;
	overflow: hidden;
}

#nomsPanos li:hover span{
	background:rgba(2, 137, 201, 0.5);
}

#nomsPanos li.actif{
	display:inline;
}

#nomsPanos li.open{
	display:inline;
}

#nomsPanos li span{ padding:0px 5px 0 5px; }

#nomsPanos li.actif span{ padding:0 25px 0 5px; }

#nomsPanos li.actif span{ background:url(../img/downCombo.png) no-repeat right; }

#nomsPanos li.actif:hover span{ background:url(../img/downCombo.png) no-repeat right rgba(42, 177, 227, 0.5); }

#nomsPanos li.open span{ background:url(../img/upCombo.png) no-repeat right; }

#nomsPanos li.open:hover span{ background:url(../img/upCombo.png) no-repeat right rgba(42, 177, 227, 0.5); }

#nomsPanos li.liVisible{ display:inline; }

/*------------------------------------ BOTTOM BAR --------------------------------------*/

#bottomBar{ position:absolute; left:0; bottom:0; width:100%; background:#FFF; z-index:2003; height:55px; }

	/* |---> Controllers */
	#bottomBar #controls{ float:left; margin:16px 0 0px 12px; }
	#bottomBar #controls div{ float:left; width:23px; height:23px; margin-right:2px; cursor:pointer; }
	#bottomBar #controls #bUp{ background:url(../img/btUp.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bDown{ background:url(../img/btDown.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bLeft{ background:url(../img/btLeft.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bRight{ background:url(../img/btRight.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bPause{ background:url(../img/btPause.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bZoomIn{ background:url(../img/btIn.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bZoomOut{ background:url(../img/btOut.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bFullscreen{ background:url(../img/btPe.png) no-repeat; width:30px; height:30px; margin-left:10px; margin-top:-3px; }
	#bottomBar #controls #bInfo{ background:url(../img/btInfo.png) center no-repeat; background-size:contain; display:none; }
	
	#bottomBar #controls div:hover{ float:left; margin-right:2px; cursor:pointer; }
	#bottomBar #controls #bUp:hover{ background:url(../img/btUpOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bDown:hover{ background:url(../img/btDownOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bLeft:hover{ background:url(../img/btLeftOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bRight:hover{ background:url(../img/btRightOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bPause:hover{ background:url(../img/btPauseOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bZoomIn:hover{ background:url(../img/btInOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bZoomOut:hover{ background:url(../img/btOutOver.png) center no-repeat; background-size:contain; }
	#bottomBar #controls #bFullscreen:hover{ background:url(../img/btPeOver.png) no-repeat; width:29px; height:29px; margin-left:10px; }
	#bottomBar #controls #bInfo:hover{ background:url(../img/btInfoOver.png) center no-repeat; background-size:contain; display:none; }
	
	/* |---> Vignettes */
	#contentThumbs{ margin:0px auto; position:relative; padding: 5px;/* background: #dfdfdf; top:-26px; box-shadow: 1px 1px 10px #555;*/ }
	#contentThumbs .pictBorder{ float:left; margin:0 2px; border:2px solid #cae5f4; cursor:pointer; width:70px; height:40px; }
	#contentThumbs .vignette{ opacity:.7; }
	#contentThumbs .pictBorder:hover{ border:2px solid #79c5df; }
	#contentThumbs .pictBorder.current{ border:2px solid #00879f; }	
	#contentThumbs .pictBorder:hover .vignette, #contentThumbs .pictBorder.current .vignette{ opacity:1; }
	#contentThumbs .pictBorder.current .vignette{ width:66px; height:36px; margin:2px 0 0 2px; }
	#contentThumbs #prevThumbs, #contentThumbs #prevThumbs.disable:hover{ position:absolute; cursor: auto; top:50%; margin-top:-17px; left:-15px; width:20px; height:33px; background:url(../img/bScrollLeft.png) no-repeat; }
	#contentThumbs #prevThumbs:hover{ background:url(../img/bScrollLeftOver.png) no-repeat; cursor:pointer; }
	#contentThumbs #nextThumbs, #contentThumbs #nextThumbs.disable:hover{ position:absolute; top:50%; margin-top:-17px; right:-15px; cursor: auto; width:20px; height:33px; background:url(../img/bScrollRight.png) no-repeat; }	
	#contentThumbs #nextThumbs:hover{ background:url(../img/bScrollRightOver.png) no-repeat; cursor:pointer; }
	#visibleThumbs { overflow:hidden; position:relative; }
	#visibleThumbs #scroller { height:100%; float:left; padding:0; }

/*------------------------------------ MAP --------------------------------------*/

#miniMap{ position:absolute; top:-20px; right:60px; border:2px solid #cae5f4; cursor:pointer; overflow:hidden; }
#miniMap:hover{ border:2px solid #00879f; }
#mapContainer{ position:absolute; right:20px; border:4px solid #3d7f9b; overflow:hidden; z-index:2002; opacity:0; display:none; }
#mapContainer .bigMap{ float:left; width:100%; }
#mapContainer .picto{ position:absolute; width:17px; height:25px; background:url(../img/picto.png) no-repeat; cursor:pointer; background-size: contain; }
#mapContainer .picto:hover, #mapContainer .picto.current{ background:url(../img/pictoOver.gif) no-repeat; background-size: contain; }
#mapContainer #closeMap{ position:absolute; width:23px; height:23px; background:url(../img/btClose.png) no-repeat; background-size:contain; top:2px; right:2px; cursor:pointer; }
#mapContainer #closeMap:hover{ background:url(../img/btCloseOver.png) no-repeat; background-size:contain; }

/*XXxx Fin MAP xxXX*/

/*------------------------------------ BLOC INFO TEXTE --------------------------------------*/

#infoText{ position:absolute; left:20px; border:4px solid #00879f; overflow:hidden; z-index:1; opacity:0; display:none; background:rgba(255, 255, 255, 0.8); min-width:30%; max-width:34%; min-height:30%; max-height:65%; padding-bottom:10px; color:#3c3c3c; }
#infoText #closeBox{ position:absolute; width:23px; height:23px; background:url(../img/btClose.png) no-repeat; background-size:contain; top:2px; right:2px; cursor:pointer; }
#infoText #closeBox:hover{ background:url(../img/btCloseOver.png) no-repeat; background-size:contain; }
#infoText p.infoTitre{ font-family: Impact, "Arial Black";margin:10px 10px 5px 10px; font-size:16px; color:#00879f; text-transform: uppercase; }
#infoText .descro{float:left; width:100%; overflow:auto; }
#infoText .descro p{font-family:Verdana, Arial;color:#104856; margin:5px 10px 10px 10px; font-size:12px; line-height:18px; }

/*XXxx Fin MAP xxXX*/

/*------------------------------------ LIEN VERS SITE INTERAVIEW --------------------------------------*/

#interaview{ position:absolute; right:10px; top:50%; margin-top:-12px; }

/*XXxx Fin LIEN VERS SITE INTERAVIEW xxXX*/

/*XXxx Fin BOTTOM BAR xxXX*/

/*------------------------------------ INFO BULLE --------------------------------------*/

#infoBulle{
	position:absolute;
	top:0;
	left:0;
	text-align:center;
	opacity:0;
	z-index:2004;
	font-family: 'roboto_condensedregular';
}

#infoBulle p{
	margin:0;
	padding:0;
	color:#fff;
	font-size:14px;
	float:left;
}

#infoBulle .tInfoBulle{
	background: #00879f;
	padding:5px 15px;
	/*border: 1px solid 9cc224;*/
	margin-bottom: -1px;
}

#infoBulle .flecheIB, #infoBulle.center .flecheIB{
	width:100%;
	height:15px;
	background:url(../img/flecheIB.png) no-repeat 50% 50%;
}

#infoBulle.right .flecheIB{
	background:url(../img/flecheIB.png) no-repeat 95% 50%;
}

/*XXxx Fin INFO BULLE xxXX*/

/*------------------------------------ HOTSPOT --------------------------------------*/

#textHotspot{ position:absolute; top:0; left:0; font-family: 'roboto_condensedregular'; font-size:16px; color:#fff; display:none; z-index:1;padding: :5px;

}
#textHotspot p{ padding: 4px; text-shadow: 0px 0px 4px #000; }

/*XXxx Fin HOTSPOT xxXX*/

/*------------------------------------ PLAYER VIDEO YOUTUBE --------------------------------------*/

#frame_youtube{ position:absolute; top:50%; left:0; }

/*XXxx Fin PLAYER VIDEO YOUTUBE xxXX*/