 html, body {
      height: 770px;
      width: 710px;
      margin: 0%;
	  font-family: Calibri; 
    }
	
	#bodysuivifourmis {
	  height: 100%;
      width: 100%;
      margin: 0%;
	  font-family: Calibri;  
	}
 
	#divsuivifourmis{
		width: 100%;
		max-width: 100%;
		height: auto;
		max-height: 930px;
		margin: 0;
		overflow: hidden;
		padding: 0px;
	}
	
	.iframesuivifourmis {
		width: 505px;
		height: 825px;
		border: none;
		margin: 0px;
		overflow: hidden;
		padding:0px;
	}
		
	table.tableau {
		border-collapse: collapse;
	}
	
	td.cellule{
		border: 1px solid #666;
		text-align: center;
	}
	
	.entete {
		color: rgb(242,163,47);
		font-weight:bold;
	}
	
	.categorie {
		color: #666;
		font-weight:bold;
	}
	
	#bubulle {
	background-color: #E46C0A;
	color: #FFFFFF;
	font-weight:bold;
	font-family: Calibri;
	font-size: 8pt;
	opacity: 0.85;
	text-align: center;
	border-radius: 5px 2px;
	}
	
	#content {
	width: 100%;
	height: 100%;
	margin: 0;
	font-family: Calibri;
	border-radius: 5px 2px;
	}
	
	/* Bloc en bas de la carte */
    #bottomPane {
      height: 35%;
    }
	
	#rightPane {
      width: 30%;
    }

	/* Bloc en bas de la legende */
    #legendPane {
       border: solid #97DCF2 1px;
	   color: #666 !important;
    }
	
	/* Bloc en bas de metadonnees */
	#metadataPane {
       border: solid #97DCF2 1px;
    }
	
	#aide {
	   color: #666 !important;
	}
	
	#aide_identif {
	   color: #666 !important;
	}
	
	#aide_survol {
	   color: #666 !important;
	}

	#aide_time {
	   color: #666 !important;
	}
	
	#aide_balayage_couche {
	   color: #666 !important;
	}
	
	/* Bouton Home (etendue initiale) */
	#HomeButton {
      position: absolute;
      top: 95px;
      left: 20px;
      z-index: 50;
    }
	
	div.home {
	background-color: rgba(255, 199, 52, 0.8) !important;
	box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	}
	
	/* Cadre affichage des coordonnees */
	#coordo {
      position: absolute;
      bottom: 52px;
      left: 20px;
      z-index: 50;
	  font-family:Calibri;
	  font-size: 8pt;
	  background-color: rgba(255, 255, 255, 0.75);
	  border-radius: 5px 2px;
    }
		
	#coordo_pleine_page{
      position: absolute;
      bottom: 5px;
      left: 20px;
      z-index: 50;
	  font-family:Calibri;
	  font-size: 8pt;
	  text-align: left;
	  background-color: rgba(255, 255, 255, 0.75);
	  border-radius: 5px 2px;
	  line-height: initial !important;
	  min-width: 470px !important;
	  min-height: 20px !important;
	}
	
	/* Fleche Nord d'orientation */
	#fleche {
	position:absolute;
	z-index:100;
	right: 28px;
	height: 61px;
	width: 48px;
	top: 10px;
	}
	
	/* Icone oeil en bas à droite de la carte */
	#icone_oeil{
	position:absolute;
	z-index:100;
	height: 20px;
	width: 20px;
	right:10px;
	bottom: 10px;
	cursor: pointer;
	}
	
    #scaleDiv .agsjsTOCOutOfScale {
	display:none; 
	}
	
	/* sous-blocks Accordion en 2 parties (généralement Légende et Métadonnées/Aide) */
	.Accordionbottom{
	height:50%;
	}
	
	.AccordionRight{
		height:33.3%
		}
	/* lorsqu'on a seulement deux compartiments (ex: Légende, Aide) dans le bandeau droite */
	.AccordionRight2partie{
		height:50%
		}
	
	/* Contenu de Texte dans les blocs d'informations */
	
	.ContenuTexte {
	font-family: Calibri;
	color: #666;
	}
	
	.ContenuTexteCDRN {
	font-family: Calibri;
	color: rgb(242,163,47);
	font-weight:bold;
	}
	

	/* 1e image d'appli positionnée*/
	 .appli {
	   height:43px;
	   width:56px;
	   z-index:100;
	   left:70px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   /* 2e image d'appli positionnée*/
	   	.appli2 {
	   height:43px;
	   width:56px;
	   z-index:100;
	   left:140px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   /* 3e image d'appli positionnée*/
	   .appli3 {
	   height:43px;
	   width:56px;
	   z-index:100;
	   left:210px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   
	   	.fond1 {
	   height:43px;
	   width:56px;
	   z-index:100;
	   right:80px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   .fond2 {
	   height:43px;
	   width:56px;
	   z-index:100;
	   right:145px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   
	   .fond3 {
	   height:43px;
	   width:56px;
	   z-index:100;
	   right:210px;top:20px;
	   position:absolute;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   border-radius: 5px 2px;
	   }
	   
	   /*icone catalogue pour les metadonnees*/
	   .applicat {
		
	   height:22px;
	   width:28px;
	   z-index:100;
	   cursor: pointer;
	   background-color:transparent;
	   box-shadow: 1px 1px 1px black, 0 0 0.2em gray, 0 0 0.2em gray;
	   margin-left: auto;
	   margin-right: auto;
	   border-radius: 5px 2px;
	   }
	   /*mise en forme des titres de metadonnnees (declaration des titres dans l'API en titlelayer)*/
	   .titlemetadata{
	   cursor: pointer;
	   color: #7C5D58;
	   font-weight:bold;
	   }
	  	   
	.esriAttribution{
	color:#000000;
	font-weight:bold;
	font-family:Calibri; 
	font-size: 8pt; 
	padding-right: 8px;
	border-radius: 5px 2px;
	} 
	.esriScalebar{
	bottom: 8px;
	left: 7px;
	} 
	.esriScalebarLabel{text-shadow: 1px 1px 2px black, 0 0 1em gray, 0 0 0.2em gray;
	color:white;
	font-family:Arial;
	} 
	
	.esriLegendLayerLabel{
        font-family:'Calibri';
      }
    .esriLegendServiceLabel{
        font-family: 'Calibri';
		}
	#titreFeu {
	background-image: url(http://geoportail.oeil.nc/geoportal/catalog/skins/themes/oeil/images/incendie3.png);
	background-repeat: no-repeat;
	background-position: left top;
	font-family: Calibri;
	font-weight: bold;
	font-size: 20pt;
	text-align: center;
	cursor: pointer;
	border-radius: 5px 2px;
	}
	
	#titreHS2013Terre { 
	background-image: url(http://oeil.nc/sites/default/files/photo/Z_PHOTO_OEIL/zoom_sur/140207_HS_bandeau_terre.PNG);
	font-family: Calibri;
	color: black;
	font-weight: normal;
	font-size: 20pt;
	text-align: center;
	width: 100%;
	min-height:70px;
	max-width: 100%;
	height: auto;
	max-height: 30%;
	margin:0px;
	text-shadow: 1px 1px 2px gray, 0 0 1em gray, 0 0 0.2em gray;
	line-height: 50px;
	border-radius: 5px;
	}
	
	#titreHS2013Terre2Lignes { 
	background-image: url(http://oeil.nc/sites/default/files/photo/Z_PHOTO_OEIL/zoom_sur/140207_HS_bandeau_terre.PNG);
	font-family: Calibri;
	color: black;
	font-weight: normal;
	font-size: 20pt;
	text-align: center;
	width: 100%;
	min-height:70px;
	max-width: 100%;
	height: auto;
	max-height: 30%;
	margin:0px;
	text-shadow: 1px 1px 2px gray, 0 0 1em gray, 0 0 0.2em gray;
	box-shadow: none;
	border-radius: 5px;
	box-sizing: border-box;
	}
	
	#titreHS2013EauDouce {
	background-image: url(http://oeil.nc/sites/default/files/photo/Z_PHOTO_OEIL/zoom_sur/140207_HS_bandeau_riviere.PNG);
	font-family: Calibri;
	font-weight: normal;
	font-size: 20pt;
	text-align: center;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 30%;
	margin:0px;
	text-shadow: 1px 1px 2px white, 0 0 1em gray, 0 0 0.2em gray;
	border-radius: 5px;
	}
	
	#titreHS2013Mer {
	background-image: url(http://oeil.nc/sites/default/files/photo/Z_PHOTO_OEIL/zoom_sur/140207_HS_bandeau_mer.PNG);
	font-family: Calibri;
	font-weight: normal;
	font-size: 20pt;
	text-align: center;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 30%;
	margin:0px;
	text-shadow: 1px 1px 2px white, 0 0 1em gray, 0 0 0.2em gray;
	border-radius: 5px;
	}
	
	#titreSuiviFourmis {
	height: 25px;
	background-color:#CE9104;
	font-family: Calibri;
	font-size: 14pt;
	font-weight: bold;
	margin: 0;
	text-align: center;
	border-radius: 5px;
	}
	/*InfoBulle au survol */
	#tooltipDialog{
	position: absolute; 
	width: 250px;
	font: normal normal normal 10pt Calibri;
	z-index:100;
	}
	
	.dijitTooltipContainer{
	background-color:rgba(255,199,52,0.85) !important;
	border-radius: 10px 5px;
	}
	
	.dijitTooltipBelow .dijitTooltipConnector {
	background: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/tooltipConnectorUp_Oeil.png") no-repeat scroll left top transparent !important;
	}
	
	.boutons {
	cursor: pointer;
	background-color: rgb(255, 199, 52);
	font-family: Calibri;
	color: #666;
	font-weight: bold;
	border-radius: 5px 2px !important;
	font-size: 8 pt !important;
	position:absolute;
	}
	
	.elemBandeau1{
		z-index:100 !important;
		right: 10px !important;
		min-height:initial !important;
		max-width: initial !important;
		height: initial !important;
		max-height: initial !important;
	}
	
/* Pour les images transparentes au survol */

	.img_transparent_survol:hover {
		opacity: 0.3; 
		filter: alpha(opacity=30);
	}

/* bandeau du suivi des fourmis VALE NC */
	#bandeau_suivi_fourmis  {
	cursor: pointer;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 20%;
	margin:0px;
	}
	
/* Placement du copyright */

	div.esriControlsBR.withPanArrows {
	left: 120px;
	right: 31px;
	}
	
	span.esriAttribution {
	max-width: initial !important;
	max-width: 80%;
	}
	
/* Placement des boutons de deplacements */

	div#map_pan_lowerRight.fixedPan.panLowerRight {
	left: 47px !important;
	top: 162px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_down.fixedPan.panDown {
	left: 31px !important;
	top:162px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_lowerLeft.fixedPan.panLowerLeft {
	left: 15px !important;
	top: 162px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_right.fixedPan.panRight {
	top: 146px !important;
	left: 47px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_upperRight.fixedPan.panUpperRight {
	top: 130px !important;
	left: 47px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_up.fixedPan.panUp {
	left: 31px !important;
	top: 130px !important;
	bottom: 37px;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_upperLeft.fixedPan.panUpperLeft {
	left: 15px;
	top: 130px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	div#map_pan_left.fixedPan.panLeft {
	left: 15px !important;
	top: 146px !important;
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/fixed-pan-sprite-oeil.png") !important;
	}
	
	/* Couleur des menus */
	
	div.dijitAccordionTitle {
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/menu_oeil_nn_selectionne.png") !important;	
	color: rgb(255, 255, 255);
	}
	
	div.dijitBorderContainer.dijitContainer.dijitLayoutContainer {
	background-color: rgb( 255, 199, 52);
	box-shadow: 1px 1px 1px rgb( 255, 199, 52), 0 0 0.2em rgb( 255, 199, 52), 0 0 0.2em rgb( 255, 199, 52);
	}
	
	div.dijitGutter.dijitGutterH.dijitAlignBottom {
	background-color: rgb(255, 199, 52);
	}
	
	div.dijitAccordionContainer.dijitAccordionInnerContainerSelected.dijitSelected {
	border-color: initial !important;
	border-color: rgb(255, 199, 52);
	}
	
	div.dijitAccordionContainer.dijitContainer.dijitLayoutContainer.AccordionBottom {
	border-color: initial !important;
	border-color: rgb(255, 199, 52);	
	}
	
	span.dijitAccordionText {
	color: #666 !important;
	}
	
	/* Couleur des boutons, barres, ... */
	
	span.dijitReset.dijitInline.dijitButtonNode {
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/menu_oeil_nn_selectionne.png") !important;
	background-color: rgb(255, 255, 255);
	}
	
	div.dijitSliderBar.dijitSliderBarH.dijitSliderProgressBar.dijitSliderProgressBarH {
	background-image: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/barre_temp_select.png") !important;
	}
	
	div#map_zoom_slider.esriSimpleSlider.esriSimpleSliderVertical.esriSimpleSliderTL {
	background-color: rgb(255, 199, 52) !important;
	}
	
	div.dijitGutter.dijitGutterV.dijitAlignRight {
	background-color: rgb(255,199,52) !important;
	}
	
	/* Couleur de l'infobulle */
	
	div.titlePane {
	background-color: rgb(255, 199, 52) !important;
	color: black !important;
	}
	
	div.esriPopupWrapper {
	border-radius: 10px 2px;
	}
	
/* Barre Balayage de couches */

	div.handle {
	background-color: rgb(255, 199, 52) !important;
	}
	
	div.handleContainer {
	background-color: rgb(255, 199, 52) !important;
	}
	
	.shadow {
	  background-color: rgba(255, 255, 255, 0.7) !important;
	  border: 1px solid #000;
	  border-radius: 8px 0px 8px 0px;
      padding:6px;
	  width:30%;
	  height:32%;
      }
	  
	  /*Fenetres ou widgets mobiles et deplacables sur la carte*/

      .WindowMobile {
	  border-radius: 8px 0px 8px 0px;
      position:absolute;
      z-index:998;
      }
	  
	  .WindowMobile .dijitAccordionTitleFocus span.dijitInline.dijitAccordionArrow {
	  background: none;
	  }
	  
	  .reduction{
	  float: left;
	  background: url("http://www.oeil.nc/topomat/topomaps4/4.1/tt_app/images/col.gif");
	  background-repeat: no-repeat;
	  width: 18px;
	  height: 22px;
	  position:absolute;
	  cursor: pointer;
	  top:14px;
	  left:14px;
	  }
	  
	  .deplace{
	  top:14px; 
	  left:25px; 
	  width:495px; 
	  height:27px; 
	  position:absolute; 
	  cursor:grab;
	  }

	  div.dijitContentPane.dijitAccordionContainer-child.dijitAccordionContainer-dijitContentPane {
	  background-color: rgba(255, 255, 255, 0.2) !important;
	  }
	  
	  div.dijitContentPane.dijitAccordionContainer-child.dijitAccordionContainer-dijitContentPane:hover {
	  background-color: rgb(255, 255, 255)!important;
	  }
	  div.dijitGutter.dijitGutterH.dijitAlignTop {
	  background-color: rgb(255, 199, 52) !important;
	  }
	  
	  /*Bouton pour slider le panneau de droite*/
	  
	  #sliderDroite{
	  top: 50%;
	  position: absolute;
	  right:0.5px;
	  z-index: 50;
	  opacity: 0.8;
	}
	
	/* Personnalisation Calendrier Dijit */
	span.dijitReset.dijitInline.dijitButtonNode {
		border-radius: 8px 0px;
	}
	div.dijitCalendarMonthMenu.dijitMenu {
		border-radius:8px 0px;
		background-color: rgba(255, 199, 52, 0.8) !important;
	}
	div.dijitCalendarMonthLabel.dijitCalendarMonthLabelHover {
		background-color: rgb(255,255,255) !important;
	}
	th.dijitReset.dijitCalendarArrow {
		background-color: rgb(255, 199, 52) !important;
		background: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/menu_oeil_nn_selectionne.png") !important;
	}

	td.dijitCalendarEnabledDate.dijitCalendarCurrentMonth.dijitCalendarDateTemplate{
		background-color: rgba(255, 204, 51, 0.2) !important;
		border-radius:8px 0px;
		border-color:rgba(150, 150, 150, 0.5) !important;
	}
	.dijitCalendarEnabledDate.dijitCalendarPreviousMonth.dijitCalendarDateTemplate{
		border-radius:8px 0px;
		border-color:rgba(150, 150, 150, 0.5) !important;		
	}
	.dijitCalendarEnabledDate.dijitCalendarNextMonth.dijitCalendarDateTemplate{
		border-radius:8px 0px;
		border-color:rgba(150, 150, 150, 0.5) !important;		
	}
	.dijitCalendarEnabledDate.dijitCalendarCurrentDate.dijitCalendarCurrentMonth.dijitCalendarDateTemplate.dijitCalendarSelectedDate {
		background-color: rgb(255, 102, 0) !important;
		border-color: black !important;
	}
	.dijitCalendarEnabledDate.dijitCalendarCurrentMonth.dijitCalendarDateTemplate.dijitCalendarSelectedDate{
		background-color: rgb(255, 102, 0) !important;
		border-color: black !important;
	}
	 th.dijitReset {
		background-color: rgb(255, 199, 52) !important;
		background: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/menu_oeil_nn_selectionne.png") !important;
	 }
	 
	 span.dijitInline.dijitCalendarPreviousYear {
		background-color: rgb(255, 204, 0) !important; 
		border: white;
	 }
	 span.dijitInline.dijitCalendarNextYear {
		background-color: rgb(255, 204, 0) !important; 
		border: white;
	 }	 
	 span.dijitInline.dijitCalendarSelectedYear {
		background-color: rgb(255, 102, 0) !important; 
		border: white;
		border-radius: 8px 0px;	
	 }
	td.dijitReset {
		background-color: rgb(255, 199, 52) !important;
		background: url("http://www.oeil.nc/sites/default/files/carto_dynamique/img/menu_oeil_nn_selectionne.png") !important;
	}
	
	
	
	
	
	
	
	

