/***
 *  tous les styles CSS pour les pompiers 
 ***/

.renamePompier{
	border-bottom:1px dashed grey;
}
.renamePompier:hover{
	cursor:pointer;
	border-color:red;
}
.renamePompier > input{
	background-color:white;
	border:0px;
}

/** FICHE POMPIER (complète) **/
#pompier-container{
	width:790px;
	margin:0 auto;
}

.fichePompier{
	float:left;
	width:385px;
	background:url('/fr/static/images/pompier/fiche_pompier_background.png') no-repeat;
	height:235px;
	margin:5px;
	position:relative;
}
.fichePompier > div{
	float:left;
	height:200px;
	position:absolute;
}
.fichePompier > .previewPompier{
	width:100px;
	height:175px;
	padding:2px;
	text-align:center;
	margin-right:5px;
	cursor: pointer;
	top:10px;
	left:30px;
}
.previewPompier:hover{cursor:pointer;}

#previewPompier-reflet{
	position:absolute;
	display:block;
	background:url('/fr/static/images/pompier/fiche_pompier_reflet.png') no-repeat;
	width:125px;
	height:175px;
	left:-8px;
	top:15px;
}

.detailsPompier{
	left:165px;
	top:25px;
	color:white;
	color:#F2F96E;
}
.detailsPompier > ul > li > span{ color:white; font-weight:bold; }
.detailsPompier > ul > li{
	list-style: disc inside;
	line-height:16px;
	padding-left:20px;
}
.details-secourisme{
	size:15px;
	color:white;
}
.titlePompier{
	display:block;
	margin-bottom:10px;
	font-size:1.2em;
	font-weight:bold;
}
.detailsSpecialite{
	padding:2px 10px;
	position:absolute;
	line-height:25px;
	vertical-align:middle;
	left:34px;
	top:193px;
}

.recrutementbtn
{
	padding:2px 10px;
	position:absolute;
	line-height:25px;
	vertical-align:middle;
}

/** FICHE POMPIER (miniature) **/
.miniaturePompier{
	float:left;
	width:100px;
	height:auto;
	background-color:#F4F4F4;
	border:1px solid #999;
	-moz-border-radius:5px;
	margin:2px;
}
.miniaturePompier > div{ margin:0 auto; }

/** les spécialités **/
#specialite-container{
	width:inherit;
	margin:20px auto;
	text-align:center;
}
div.vignetteSpecialite{
	float:left;
	width:100px;
	margin:5px;
	padding:1px;
	background-color:white;
}
div.vignetteSpecialite:hover{
	color:#33CC00;
	font-weight:bold;
	cursor:pointer;
}
div.vignetteSpecialite > span{
	display:block;
	width:inherit;
	margin-bottom:10px;
	text-align:center;
}
#specialitePrincipale,#specialiteSecondaire{ font-style:italic; }



/* SPRITE GRADES / SPECIALITE */
.specialite_icone,.grade_icone{
	width:100px;
	height:100px;
}
.specialite_iconemini,.grade_iconemini{
	width:25px;
	height:25px;
}

.specialite_icone, .specialite_iconemini{
	display:-moz-inline-box; /* FF2 ne connait pas "inline-block" */
	display:inline-block;
	background-image:url('/fr/static/images/pompier/specialite.png');
	background-repeat:no-repeat;
}

#specialite-aucune.specialite_icone{ 	background-position:0px 0px; }
#specialite-ani.specialite_icone{ 		background-position:-100px 0px; }
#specialite-chi.specialite_icone{ 		background-position:-200px 0px; }
#specialite-cyn.specialite_icone{ 		background-position:-300px 0px; }
#specialite-des.specialite_icone{ 		background-position:-400px 0px; }
#specialite-feu.specialite_icone{ 		background-position:-500px 0px; }
#specialite-grimp.specialite_icone{ 	background-position:-600px 0px; }
#specialite-inf.specialite_icone{ 		background-position:-700px 0px; }
#specialite-med.specialite_icone{ 		background-position:-800px 0px; }
#specialite-plo.specialite_icone{ 		background-position:-900px 0px; }
#specialite-tun.specialite_icone{ 		background-position:-1000px 0px; }
#specialite-form.specialite_icone{ 		background-position:-1100px 0px; }
#specialite-deb.specialite_icone{ 		background-position:-1200px 0px; }
#specialite-ech.specialite_icone{ 		background-position:-1300px 0px; }

#specialite-aucune.specialite_iconemini{ 	background-position:0px 	-120px; }
#specialite-ani.specialite_iconemini{ 		background-position:-25px -120px; }
#specialite-chi.specialite_iconemini{ 		background-position:-50px -120px; }
#specialite-cyn.specialite_iconemini{ 		background-position:-75px -120px; }
#specialite-des.specialite_iconemini{ 		background-position:-100px -120px; }
#specialite-feu.specialite_iconemini{ 		background-position:-125px -120px; }
#specialite-grimp.specialite_iconemini{ 	background-position:-150px -120px; }
#specialite-inf.specialite_iconemini{ 		background-position:-175px -120px; }
#specialite-med.specialite_iconemini{ 		background-position:-200px -120px; }
#specialite-plo.specialite_iconemini{ 		background-position:-225px -120px; }
#specialite-tun.specialite_iconemini{ 		background-position:-250px -120px; }
#specialite-form.specialite_iconemini{ 		background-position:-275px -120px; }
#specialite-deb.specialite_iconemini{ 		background-position:-275px -120px; }
#specialite-ech.specialite_iconemini{ 		background-position:-275px -120px; }


.grade_icone, .grade_iconemini{
	display:-moz-inline-box; /* FF2 ne connait pas "inline-block" */
	display:inline-block;
	background-image:url('/fr/static/images/pompier/grades.png');
	background-repeat:no-repeat;
}

/* Avatar des pompiers */
div.avatarPompier{
	position:relative;
}
div.avatarPompier > div{ position:absolute; }



/* AFFICHAGE linéaire des pompiers */
div.listview,div.listview-legend{
	position:relative;
	width:inherit;
	height:40px;
	line-height:40px;
	margin: 3px 0;
	padding:1px;
}
div.listview-legend{
	background-color:red;
	font-weight:bold;
	color:white;
	text-transform:uppercase;
	margin-bottom:10px;
}

div.listview > span,div.listview-legend > span{
	float:left;
	display:-moz-inline-box; /* FF2 ne connait pas "inline-block" */
	display:inline-block;
	border-bottom:1px solid grey; 
	height:inherit;
}

.listxlarge{ width:400px; 	overflow:hidden; }
.listlarge{ width:150px; 	overflow:hidden; }
.listsmall{ width:95px; 	overflow:hidden; }
div.listview:hover{
	background-color:#f5f5f5;
	cursor:default;
}
div.listview.activate{ background-color:#C4E8F4; }

/** GENERATEUR DE POMPIER **/
#generateurPompier-container{ margin:0 auto; width:545px; }
#generateurPompier-container > div{
	float:left;
	margin:5px;
}
#generateurPompier-container > #apercuPompier{
	width:300px;
	height:350px;
	text-align:center;
}
#generateurPompier-container > #apercuPompier > div{ margin:0 auto; }
.generateur-elements{
	width:200px;
	height:auto;
	margin:2px;
	padding:2px;
	background-color:#CC0000;
	color:white;
	-moz-border-radius:5px;
	text-align:center;
}
#generateurPompier-container > #apercuPompier a{
	color: black;
}
div.generateur-elements > span.title{ color:#FFDA00; font-weight:bold; text-transform:uppercase; margin-bottom:5px; }
div.generateur-elements > div{ line-height: 25px; margin-bottom:2px; background-color:#B00000; }


span.navigation{
	height:18px;
	width:23px;
	background-image:url('/fr/static/images/avatarPompier/navigation.png');
	background-repeat:no-repeat;
	margin:1px;
}
div.generateur-elements span.navigNext{ float:right; background-position: -23px 0px; }
div.generateur-elements span.navigPrev{ float:left; background-position: 0px 0px; }
div.generateur-elements span.navigNext:hover,div.generateur-elements span.navigPrev:hover{ cursor:pointer; }
div.generateur-elements span.navigNext:hover{ float:right; background-position: -23px -19px; }
div.generateur-elements span.navigPrev:hover{ float:left; background-position: 0px -19px; }