<!-- <link rel="stylesheet" type="text/css" href="../tooltipster/dist/css/tooltipster.bundle.min.css" />
<link rel="stylesheet" type="text/css" href="../css/tooltipster-follower.css" />
<script src="../tooltipster/dist/js/tooltipster.bundle.min.js"></script>
<script  src="../js/tooltipster-follower.js"></script> -->

  <style type="text/css">

.map path{
	/*fill:#fff;*/
	stroke:#3D3DFF;
	stroke-width:1px;
	cursor:pointer;
	transition: fill 0.3s;
	}


#conteneur_lightbox_carte .map svg{
	width: 50% !important;
	height: auto
}

</style>

<div class="map">
<svg version="1.1" id="carte_x5F_adamaoua" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
	 y="0px" viewBox="0 0 750 415" style="enable-background:new 0 0 750 415;" xml:space="preserve">
<style type="text/css">
	.st0{fill:#70A0FF;stroke:#000000;stroke-miterlimit:10;}
	.st1{fill:#FF9470;stroke:#000000;stroke-miterlimit:10;}
	.st2{fill:#FFA0A0;stroke:#000000;stroke-miterlimit:10;}
	.st3{fill:#FFFF90;stroke:#000000;stroke-miterlimit:10;}
	.st4{fill:#FF80C0;stroke:#000000;stroke-miterlimit:10;}
	.st5{fill:none;stroke:#000000;stroke-width:2;stroke-miterlimit:10;}
</style>

<a xlink:href="javascript: Affichage_box('lightbox_carte_departement_mbere.php','opacite','div_traitement', 1);"> 
<path id="D220" fill="<?php $departement=getdepartementInformationsbyreference(D220); echo $departement["couleur"] ?>" data-tooltip-content="#Mbere" d="M736.2,176.9c-0.9,6-0.6,14-4,22c-4.3,10-11.4,4.8-12,17.7s-0.9,10.8-8,27.9s0,10.8-15.7,18.5
	c-15.7,7.7-10-5.1-17.1,15.7c-7.1,20.8-17.7,37.6-17.7,44.8s5.1,12.8-7.7,20.5c-12.8,7.7,3.4,5.1-19.4,14.3
	c-22.8,9.1-34.8,19.4-37.6,23.4l0,0c-3.4-1.4-6.6-2.6-8.6-3.1c-8.6-3.1-14.3,3.7-25.7,7.1c-11.4,3.4-25.7,0-35.1-0.9
	c-9.4-0.9-27.9,10.8-37.1,10.8s-21.4,7.1-21.4,7.1s-31.4-0.9-65.6-1.1c2.3-4.3,4-8.8,4.3-12.5c0.9-9.4-13.7-18.5-12.3-34.2
	s-5.1-24.2-5.1-34.2c0-10,3.7-18,8.6-23.7c2-2.3,6.6-7.1,10.8-12.5c7.1,5.7,17.7,7.1,21.1,9.4c4.8,3.4,10.5,3.4,17.1,5.1
	s22,10.5,26.5,4.8c4.8-5.7,13.4-9.4,18.5-19.1c5.4-9.4,2.3-6.6,0.3-11.4c-2-4.6,4.8-14.3,8.6-15.4c3.7-0.9,10.5,13.4,16.3,15.1
	c5.7,1.7,24.8-15.1,37.1-26.5c12.3-11.4,31.4,4.8,36.2,0s18-0.9,22.8-2.9c4.8-2,14.3-0.9,14.3-12.3c0-11.4,25.7-10.5,25.7-20.5v-0.3
	c12.8,2,37.1-5.7,43.9-11.4C705.2,194.3,722.6,182.9,736.2,176.9z"/>
</a>
<a xlink:href="javascript: Affichage_box('lightbox_carte_departement_mayo_banyo.php','opacite','div_traitement', 1);"> 
<path id="D225" fill="<?php $departement=getdepartementInformationsbyreference(D225); echo $departement["couleur"] ?>" data-tooltip-content="#Mayo-Banyo"
 class="st1" d="M206.8,230.2c-5.4,8.6-10.8,16.5-12.5,19.1c-3.4,4.8-7.7,5.7-10.8,6.3
	c-3.4,0.6-11.4,10.5-15.7,15.7c-4.3,5.1,1.4,10.8,5.7,20c4.3,9.1,13.1,10.8,17.1,14.8c3.7,3.7-9.4,12.8-14.3,16.5
	c-4.8,3.7-2,11.4-2.3,16c-0.3,4.6-3.7,0.9-7.7,1.7c-2.3,0.6-5.4,8-7.7,14.3c-1.1-2.3-2.3-4-3.4-5.1c-3.7-4.3-5.1,2.9-12.3,10
	s-15.1,2.3-23.7,5.7s-9.7,7.7-15.4,13.4c-5.7,5.7-20,11.4-29.4,12.3s-43.6,13.7-42.8,11.4s6.6-7.1,4.3-13.7
	c-2.3-6.6-6.6-13.7-5.1-21.4c1.4-7.7,2.9-8.6,0-14.3c-2.9-5.4-16.3-5.1-17.1-5.1l0,0v-49.6c0.3,0,0.3,0,0.6,0c0.6,0,0.9,0,1.4,0.3
	c0.6,0,0.9,0.3,1.1,0.6c0.3,0.3,0.9,0.6,0.9,0.9l0.3,0.3c0.9,0.6,2.6,0.3,4.8,0h0.3c4-0.3,9.1-0.6,11.4,2.6
	c3.7,5.1,14.8,6.3,17.7,2.3c2.9-3.7,3.1,4.8,6.3-2.6c3.1-7.4-1.4-13.4,4.6-13.7c6-0.6,16.3,3.4,16.3-3.7s5.1-12,5.1-12
	s-1.7-5.1,1.4-9.4c3.1-4.3,6.6-9.7,1.7-12c-4.8-2.3-6.6-8-4.3-10.8c2.3-2.9,8.8-7.1,10.8-12.8c2-5.7-8-8.3,5.7-11.4
	s9.4-10.8,18.2-9.4c8.8,1.1,21.1,7.4,14.5-5.4c-6.6-12.8-9.4-14.3-9.7-20.5c0-0.6,0-1.4,0-2.3s0-1.7,0.3-2.9c0.3-2.9,0.9-6.6,2-10
	c5.7,7.1,12,14,15.1,14.5c6.6,0.9,26.5,2.6,29.4,4c2.9,1.4,8.6,13.7,11.4,19.4s7.4,14.8,17.1,20C201.4,225.4,204.2,228,206.8,230.2z
	"/>
</a>
<a xlink:href="javascript: Affichage_box('lightbox_carte_departement_djerem.php','opacite','div_traitement', 1);"> 
<path id="D230" fill="<?php $departement=getdepartementInformationsbyreference(D230); echo $departement["couleur"] ?>" data-tooltip-content="#Djerem"
 d="M408.4,389c-0.3,3.4-2,8-4.3,12.5c-34.2-0.3-71.3-0.6-82.7,0.6c-22.8,2.3-38.5-4.6-47-5.1
	c-8.6-0.6-18,5.7-27.1-2.9c-9.1-8.6-17.1-20.8-27.4-25.1c-10.3-4.3-11.1-11.4-18.8-6.6c-7.7,4.8-28.5,5.7-32.8,5.1
	c-3.1-0.6-6.6-7.7-9.4-13.4c2.3-6,5.4-13.4,7.7-14.3c3.7-1.1,7.1,2.9,7.7-1.7c0.6-4.6-2.3-12.3,2.3-16c4.8-3.7,18-12.8,14.3-16.5
	c-3.7-3.7-12.5-5.7-17.1-14.8c-4.3-9.1-10-14.8-5.7-20c4.3-5.1,12.3-15.1,15.7-15.7c3.4-0.6,7.7-1.4,10.8-6.3
	c1.7-2.6,7.4-10.5,12.5-19.1c4.8,4.6,8.8,9.1,12.8,9.1c6,0,16,0,18.8-3.7c2.9-3.7,5.7-21.4,12.3-22.2c6.6-0.9,9.4,8.6,15.7,9.4
	c6.3,0.9,11.4-8.6,18-3.7c5.7,4.3,14.5,5.4,22.2,1.7c1.7,7.1,4.3,13.7,5.7,16.5c3.1,6,1.4,17.7,14.8,20.5
	c13.4,2.9,10.5-10.5,19.1-16.5c8.6-6.3,13.4,9.1,20,17.7c6.6,8.6,12.3,2.9,16.3,0.9c3.7-2,18,2.9,22.5,16.3c0.6,2,1.7,3.7,2.9,5.4
	c0.9,1.1,1.7,2,2.9,2.9c-4.3,5.4-8.8,10-10.8,12.5c-4.8,5.7-8.6,13.7-8.6,23.7c0,10,6.6,18.5,5.1,34.2
	C395.2,370.2,408.9,379.9,408.4,389z"/>
</a>

<a xlink:href="javascript: Affichage_box('lightbox_carte_departement_faro_deo.php','opacite','div_traitement', 1);"> 
<path id="D235" fill="<?php $departement=getdepartementInformationsbyreference(D235); echo $departement["couleur"] ?>" data-tooltip-content="#Faro-et-Deo"
 d="M368.2,108.8c-1.4,3.7-2.6,7.4-2.9,10.8c-0.6,11.4,0,13.4-5.7,17.1
	c-5.7,3.7-15.1,5.7-15.1,20c0,14.3,0,10.5-17.1,10.5s-2.9,0.9-12.5,16.3c-9.7,15.1-3.4,8.6-8.3,17.1c-2,3.7-1.7,10-0.6,16.3
	c0.3,1.4,0.6,2.9,0.9,4.6c-8,3.7-16.8,2.6-22.2-1.7c-6.6-5.1-11.4,4.3-18,3.7c-6.6-0.6-9.4-10-15.7-9.4c-6.3,0.6-9.4,18.5-12.3,22.2
	c-2.9,3.7-12.8,3.7-18.8,3.7c-4,0-8-4.6-12.8-9.1c-2.6-2.3-5.4-4.8-8.8-6.6c-9.7-5.1-14.3-14.3-17.1-20c-2.9-5.7-8.6-18-11.4-19.4
	c-2.9-1.4-22.8-3.1-29.4-4c-3.1-0.6-9.4-7.1-15.1-14.5c1.4-6,4-12,7.4-16c7.1-8.3,14.8-18.5,20-19.7c5.1-0.9,18,7.4,16.3-6.8
	c-2-14.5-8.6-25.9-2-38.2c6.6-12.3,20-25.7,27.7-31.4c7.7-5.7,12-14.8,8.6-22.8c-3.4-8-7.7-8-1.4-17.7c1.7-2.9,3.4-4,4.3-4.8
	c12.8,11.1,26.2,23.9,29.9,29.7c7.1,10,22.8,2.9,37.9,18c4.6,4.6-1.4,5.7-0.9,21.4s25.7,18,35.6,22.2c10,4.3,20.8,5.1,31.4,5.1
	C345.6,104.8,358.2,106.8,368.2,108.8z"/>
</a>
<a xlink:href="javascript: Affichage_box('lightbox_carte_departement_vina.php','opacite','div_traitement', 1);"> 
<path id="D240" fill="<?php $departement=getdepartementInformationsbyreference(D240); echo $departement["couleur"] ?>" data-tooltip-content="#Vina"
 d="M655,211.4c0,10-25.7,9.1-25.7,20.5c0,11.4-9.4,10.5-14.3,12.3c-4.8,2-18-2-22.8,2.9
	s-23.7-11.4-36.2,0c-12.3,11.4-31.4,28.5-37.1,26.5c-5.7-2-12.3-16.3-16.3-15.1c-3.7,0.9-10.5,10.8-8.6,15.4s5.1,1.7-0.3,11.4
	c-5.4,9.4-14,13.4-18.5,19.1c-4.8,5.7-20-2.9-26.5-4.8c-6.6-2-12.3-2-17.1-5.1c-3.4-2.6-14.3-3.7-21.1-9.4c-1.1-0.9-2-1.7-2.9-2.9
	c-1.1-1.4-2.3-3.1-2.9-5.4c-4.3-13.4-18.5-18-22.5-16.3c-3.7,2-9.4,7.7-16.3-0.9c-6.8-8.6-11.4-23.7-20-17.7
	c-8.6,6.3-5.7,19.4-19.1,16.5c-13.4-2.9-11.7-14.5-14.8-20.5c-1.4-2.9-4-9.4-5.7-16.5c-0.3-1.4-0.6-2.9-0.9-4.6
	c-1.1-6.6-1.4-12.8,0.6-16.3c4.8-8.6-1.4-2,8.3-17.1s-4.6-16.3,12.5-16.3c17.1,0,17.1,3.7,17.1-10.5s9.4-16.3,15.1-20
	c5.7-3.7,5.1-5.7,5.7-17.1c0-3.4,1.4-7.1,2.9-10.8c8,1.4,14.5,3.1,14.5,3.1s0.6-11.1,6.3-16.3c0.3-0.3,0.9-0.6,1.1-0.9
	c6.8-4.3,1.7-12.3,0.3-19.4c-1.4-7.1,2.9-4.3,8.6-8c2.3-1.4,5.1-8.6,7.7-16.5c8.6,3.7,14.5,3.7,22.8,2.9C438.6,52.9,452,60,460,54
	c8-6,13.7-15.4,12.8-3.1c-0.9,12.3-5.7,25.1-5.7,25.1s-2.3,12.3,2.3,16.5c4.6,4.3,18,9.4,23.7,14.3s19.4,0.9,24.2,6.6
	c4.8,5.7,9.4,9.4,15.1,5.7s10-19.4,12.8-5.7s-10.8,10.8,3.7,20.8c14.5,10,27.9,15.7,27.1,30.8c-0.9,15.1,4.3,28.5,10.8,27.1
	c6.6-1.4,18.5-11.4,22.2-3.7s7.1,17.1,12.8,20s20-8.6,27.1,0c1.4,1.7,3.7,2.6,6.6,2.9C655,211.1,655,211.1,655,211.4z"/>
</a>

</svg>

</div>

<div class="tooltip_templates" style="display:none">
 	<span id="Vina">
    	Vina
    </span>
 	<span id="Faro-et-Deo">
          Faro et Deo
    </span>
 	<span id="Djerem">
    	Djerem
    </span>
 	<span id="Mayo-Banyo">
          Mayo-Banyo
    </span>
 	<span id="Mbere">
          Mbere
    </span>
 	
     
</div>

<script>
	
$(document).ready(function(e) {
/***************survol carte (tooltip pres du curseur****************/
        $('.tooltip').tooltipster({
    		plugins: ['follower']
		});
/*******************clic sur la carte**********************/
		
		$('path').click(function(){
			alert("ok");
			Affichage_box('lightbox_carte_departement.php','opacite','div_traitement', 1);
		});
});
</script>