@charset "utf-8";
/* CSS Document */

/* Billets */
.cntArticle { font-size: 16px; line-height: 18px; margin-left: 18px; margin-bottom: 4px; margin-top: 4px; text-align: left; }
.btnArticle { height: 16px; width: 16px; margin-top: 2px; }
.titreArticle { font-size: 22px; text-transform: uppercase; font-weight: bold; }
.cntImgart { max-height: 340px; width: 744px; max-width: 100%; overflow: hidden; border: 1px solid #ccc; }
.cntTxtart { margin: 0px 22px; }
.ta_etipart { float: left; width: 180px; font-style: italic; margin-top: 3px; font-size: 12px; }
.ta_jaime { float: left; vertical-align: top; } .ta_jaime > div { float: left; display: inline-block; }
.cntComm { padding: 20px; } .cntComm:nth-child(odd) { background: #e7e7e7; border-radius: 8px; } .cntComm .cntTxtart { margin: 0px; }
.eti_frmcomm { float: left; width: 100px; color: #888; } .info_frmcomm { float: left; color: #888; margin-left: 10px; }
#frmComm { width: 99%; overflow: visible; }
#auteur { float: left; width: 220px; background: #f5f5f5; }
#email { float: left; width: 400px; background: #f5f5f5; }
#sitew { float: left; width: 400px; background: #f5f5f5; }
.content.cntmt20 { margin-top: 20px; } .content.cntmt60 { margin-top: 60px; }
#btnArtpre { position: fixed; top: 50%; margin-top: -50px; left: 18px; opacity: 0.5; transition: all .4s ease-in-out; } #btnArtpre:hover { opacity: 1; }
#btnArtsui { position: fixed; top: 50%; margin-top: -50px; right: 18px; opacity: 0.5; transition: all .4s ease-in-out; } #btnArtsui:hover { opacity: 1; }
.cntNavig { text-align: right; margin-bottom: 12px; }
.cntNavig .btnPage { background: #444; color: #fff; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 700; padding: 4px 6px; border-radius: 3px; }
.cntNavig .btnPage:hover, .cntNavig .btnPage.actif { background: #aaa; }

/* Classes visuelles */
a.tag { padding: 1px 3px; } a.tag:hover { background: #000; color: #fff; border-radius: 5px; text-decoration: none; }
a.catimg > img { opacity: 1; } a.catimg > img:hover { opacity: 0.66; }

/* Menus */
#menu { float: none; margin-right: 0px; color: #fff; vertical-align: middle; }
#menu a { font-size: 14px; color: #aaa; font-weight: bold; display: inline-block; float: left; padding: 10px 16px; border-right: 1px solid #666; text-shadow: -1px -1px 1px #333; }
#menu a:hover { text-decoration: none; color: #ddd; } #menu a.actif { text-decoration: none; color: #fff; }
#menu a img.icone { margin-right: 3px; margin-top: -5px; vertical-align: middle; } #menu .icone { margin-top: -5px; vertical-align: middle; }
#div_cats { position: fixed; top: 37px; left: 0; margin-left: 0; z-index: 8; padding: 10px 14px; display: none;
	background: #444; color: #fff; border-radius: 0 0 8px 8px; box-shadow: 0 0 2px rgba(0,0,0,0.5) inset, 0 0 10px 4px rgba(0,0,0,0.6); }
/* #div_cats:after { content: " "; z-index: -1; box-shadow: 0 0 10px rgba(0,0,0,0.5); } */
#div_cats a { font-size: 14px; color: #fff; font-weight: bold; color: #aaa; text-shadow: -1px -1px 1px #333; display: inline-block; padding: 4px 0; }
#div_cats a:hover { text-decoration: none; color: #ddd; } #div_cats a.actif { text-decoration: none; color: #fff; }
#cntrech { float: right; margin-top: 9px; margin-right: 6px; background: #fff; padding: 0 2px; border: 1px solid #bbb; border-radius: 5px; }
#recherche { width: 176px; font-size: 12px; padding: 2px; border: none; border-radius: 0px; display: block; float: left; margin-top: 0px; }
#btnRech { height: 16px; width: 16px; margin-top: 2px; cursor: pointer; vertical-align: top; display: block; float: right; }

/* Bandeau accueil */
#bandeau_accueil { position: relative; margin-top: 37px; background: #000; } #bandeau_accueil .content { min-height: 400px; }
#bandeau_accueil.ba_plarg { background-repeat: no-repeat; background-position: center center; height: 480px; }
#bandeau_accueil .background { position: absolute; top: 0; left: -80px; right: -80px; height: 100%; content: " "; z-index: 1; 
  background-repeat: no-repeat; background-position: center center; background-size: 100% auto; }
#bandeau_accueil .background .fade { position: relative; background-color: rgba(0,0,0,0.6); height: 100%; width: 100%; z-index: 2; }
#bandeau_accueil .background .fade:before, #bandeau_accueil .background .fade:after { 
  background-image: url(images/bg-fade-right.png); background-size: 100% auto; content: " "; display: block; 
  position: absolute; right: -1px; top: 0; transition: opacity 0.5s ease 0s; height: 100%; width: 100px; opacity: 1; }
#bandeau_accueil .background .fade:after {
  background-image: url(images/bg-fade-left.png); left: -1px; right: auto; }
#bandeau_accueil .texte { position: relative; width: 100%; min-height: 400px; z-index: 3; text-shadow: -1px -1px 1px #333; }
#bandeau_accueil .txt_table { display: table; width: 100%; height: 400px; }
#bandeau_accueil .txt_tcell { display: table-cell; color: #fff; min-height: 100% !important; height: auto; width: auto; padding: 0 40px; vertical-align: middle; }

#contenu_texte { float: left; width: 744px; }
#coldroite { float: right; width: 200px; font-size: 13px; margin-right: 10px; }
.cold_elt { width: auto; }
.cold_titre { text-transform: uppercase; text-align: center; padding: 5px 0; font-weight: bold; color: #fff; text-shadow: -1px -1px 0px #666; }

/* Slideshow accueil */
#slideacc { position: relative; width: 1000px; height: 480px; -webkit-perspective: 1200px; -moz-perspective: 1200px; perspective: 1200px; margin: 20px 0 46px 0; }
.slideelt { position: absolute; left: 0; top: 0; width: 1000px; z-index: 2; background: #000; }
.slideelt:before { content: ""; position: absolute; top: 0; left: 0; height: 100%; width: 100%; box-shadow: 0 0 16px rgba(0,0,0,0.8) inset; }
.slideimg { position: absolute; left: 0; top: 0; width: 1000px; height: 480px; overflow: hidden; box-shadow: inset 0px 0px 10px 12px rgba(0,0,0,1); }
.slideimg img { position: absolute; min-height: 100%; min-width: 100%; z-index: -2; } 
.slidetxt { position: absolute; left: 0; top: 0; width: 960px; height: auto; padding: 10px 20px; background: rgba(0,0,0,0.5); box-shadow: 0 0 6px rgba(0,0,0,0.8) inset; color: #fff;
		text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.7); -moz-text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7); -webkit-text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7); }
.slidetxt h3 { color: #f29909; } .slidetxt a { color: #ff9; }
#slideliens { position: absolute; width: 980px; left: 0; top: 100%; margin: 10px; text-align: right; z-index: 9; opacity: 1; font-size: 12px;
		transition: all .4s ease-in-out; }
#slideliens .slide_page { display: inline-block; height: 20px; width: 20px; border-radius: 50%; background: #666; margin-left: 8px; transition: all .4s ease-in-out; 
		box-shadow: 0 0 6px 8px rgba(0,0,0,0.5) inset; text-decoration: none; } 
#slideliens .slide_page.actif { background: #ffffff; box-shadow: 0 0 4px 2px rgba(32,32,32,0.5) inset; }
#slideliens .btnControle { display: inline-block; float: left; margin-right: 12px; color: #ff9; }

/* Pied de page */ 
#pied { background: #444; }
#pied .content { text-align: left; color: #888; vertical-align: middle; }
#pied img { margin-top: -4px; vertical-align: middle; }
#pied_cntd { float: right; }

/* Animations slide */
.slideelt { 
	-webkit-transform: translateX(0deg) rotateY(0deg) scale(1); -webkit-transform-style: preserve-3d; -webkit-backface-visibility: hidden;
	-moz-transform: translateX(0deg) rotateY(0deg) scale(1); 	-moz-transform-style: preserve-3d; 	  -moz-backface-visibility: hidden;
	transform: translateX(0deg) rotateY(0deg) scale(1);			transform-style: preserve-3d;		  backface-visibility: hidden;
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
}
.slideelt.active {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) rotate(0deg) scale(1); 
	-moz-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) rotate(0deg) scale(1); 
    -o-transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) rotate(0deg) scale(1); 
	transform: translateX(0px) translateZ(0px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) rotate(0deg) scale(1); 
	z-index: 3; opacity: 1; -o-filter: none; -ms-filter: none; -moz-filter: none; -webkit-filter: none; filter: none;
	-webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}

.slideelt.slide_rotx.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateX(0px) rotateX(180deg) rotateY(0deg) scale(1); -moz-transform: translateX(0px) rotateX(180deg) rotateY(0deg) scale(1); 
    -o-transform: translateX(0px) rotateX(180deg) rotateY(0deg) scale(1); transform: translateX(0px) rotateX(180deg) rotateY(0deg) scale(1); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_roty.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateX(0px) rotateX(0deg) rotateY(180deg) scale(1); -moz-transform: translateX(0px) rotateX(0deg) rotateY(180deg) scale(1); 
    -o-transform: translateX(0px) rotateX(0deg) rotateY(180deg) scale(1); transform: translateX(0px) rotateX(0deg) rotateY(180deg) scale(1); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_fondu.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateX(0px) rotateX(0deg) rotateY(0deg) scale(1); -moz-transform: translateX(0px) rotateX(0deg) rotateY(0deg) scale(1); 
    -o-transform: translateX(0px) rotateX(0deg) rotateY(0deg) scale(1); transform: translateX(0px) rotateX(0deg) rotateY(0deg) scale(1); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_arriere.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateZ(-1200px) rotateX(0deg) rotateY(0deg) scale(0.3); -moz-transform: translateZ(-1200px) rotateX(0deg) rotateY(0deg) scale(0.3); 
    -o-transform: translateZ(-1200px) rotateX(0deg) rotateY(0deg) scale(0.3); transform: translateZ(-1200px) rotateX(0deg) rotateY(0deg) scale(0.3); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_avant.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateZ(1200px) rotateX(0deg) rotateY(0deg) scale(1); -moz-transform: translateZ(1200px) rotateX(0deg) rotateY(0deg) scale(1); 
    -o-transform: translateZ(1200px) rotateX(0deg) rotateY(0deg) scale(1); transform: translateZ(1200px) rotateX(0deg) rotateY(0deg) scale(1); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_tourbillon.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateZ(-1200px) rotate(180deg) scale(0.5,0.5); -moz-transform: translateZ(-1200px) rotate(180deg) scale(0.5,0.5); 
    -o-transform: translateZ(-1200px) rotate(180deg) scale(0.5,0.5); transform: translateZ(-1200px) rotate(180deg) scale(0.5,0.5); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_defilement.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all .8s ease-in-out;
    -webkit-transform: translateX(300%) rotateY(15deg) scale(1,1); -moz-transform: translateX(300%) rotateY(15deg) scale(1,1); 
    -o-transform: translateX(300%) rotateY(15deg) scale(1,1); transform: translateX(300%) rotateY(30deg) scale(0.7,0.7); 
	z-index: 2; opacity: 0; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d;
}
.slideelt.slide_blur.inactive {
	-o-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -webkit-transition: all .8s ease-in-out; transition: all 1.8s ease-in-out;
	z-index: 2; opacity: 0; -o-filter: blur(40px); -ms-filter: blur(40px); -moz-filter: blur(40px); -webkit-filter: blur(40px); filter: blur(40px);
}

/* ------------------------------------------------ */
/* Format PC/tablettes < 1160px						*/
@media handheld, only screen and (max-width: 1160px), only screen and (max-device-width: 1160px) {
	#btnArtpre { display: none; } #btnArtsui { display: none; }
}

/* ------------------------------------------------ */
/* Format PC/tablettes < 1024px						*/
@media handheld, only screen and (max-width: 1024px), only screen and (max-device-width: 1024px) {

	.content { position: relative; width: auto; margin: 0 12px; left: 0px; }
	.cntImgart { max-height: 340px; width: 100%; max-width: 100%; }
	.cntTxtart { margin: 0px 12px; }

	#entete { position: fixed; } #entete .content { padding: 0; margin: 0; width: auto; }
	#menu { display: table; float: none; margin-right: 0px; width: 100%; } 
	#menu a { padding: 10px 6px; float: none; display: table-cell; text-align: center; vertical-align: top; } 
	#menu a img.icone { margin-right: 0px; } 
	#cntrech { display: table-cell; margin-right: 10px; margin-top: 9px; } #recherche { width: 120px; font-size: 12px; } #btnRech { margin-top: 2px; }

	#contenu_texte { margin-top: 20px; float: none; width: auto; }
	#coldroite { float: none; width: 100%; margin-right: 0px; text-align: center; display: table; }
	#cold_cntelt { display: table-cell; width: auto; vertical-align: top; text-align: center; }
	.cold_elt { width: 200px; display: inline-block; margin: 20px; vertical-align: top; text-align: left; } .cold_ndpr { display: none; }

	#bandeau_accueil .background { left: 0px; right: 0px; background-size: 100% 100%; }
	#slideacc { position: relative; width: auto; height: 480px; -webkit-perspective: 1200px; -moz-perspective: 1200px; perspective: 1200px; margin: 20px 0 46px 0; }
	.slideelt { width: 100%; } .slideimg { width: 100%; height: 480px; }
	.slideimg img { height: auto; width: 100%; top: 0px; left: 0px; } 
	.slidetxt { width: 92%; height: auto; padding: 10px 4%; } .slidetxt h3 {  } .slidetxt a {  }
	#slideliens { width: 100%; left: 0; top: 100%; margin: 10px 0; }
	#slideliens .slide_page { } #slideliens .btnControle { }
	
	#pied { line-height: 22px; }
	#pied_cntd { line-height: 16px; float: none; margin-top: 6px; text-align: right; }
}

/* ------------------------------------------------ */
/* Format mobiles < 670px							*/
@media handheld, only screen and (max-width: 670px), only screen and (max-device-width: 670px) {

	img { max-width: 100%; } iframe { max-width: 100%; }

	.cntImgart { max-height: 250px; width: 100%; max-width: 100%; }
	.cntTxtart { margin: 0px 6px; }
	.ta_etipart { float: none; clear: both; margin-bottom: 10px; }
	.ta_jaime { float: none; } .ta_jaime > div { float: none;  display: block; margin-bottom: 4px; }
	.eti_frmcomm { float: none; width: auto; margin-bottom: 4px; } .info_frmcomm { float: none; display: inline-block; margin: 0; }
	#auteur { float: none; width: 220px; }
	#email { float: none; width: 100%; }
	#sitew { float: none; width: 100%; }
		
	#logobmp { height: auto; float: none; width: 80%; margin: 0 10%; margin-bottom: 10px; }
	#entete .content { text-align: left; margin: 0; padding: 0; } 
	#menu { display: table; float: none; width: 100%; } #menu a { float: none; margin-top: 0; display: table-cell; text-align: center; vertical-align: top; padding: 10px 12px; } 
	#menu a img { float: none; margin-right: 0px; } #menu a .icone { float: none; margin-right: 0px; margin-top: -4px; } 
	#menu .menu_txtlnk { display: none; }
	#cntrech { display: table-cell; margin-right: 10px; margin-top: 9px; } #recherche { width: 110px; font-size: 12px; } #btnRech { float: right; margin-top: 2px; }
	
	#bandeau_accueil .content { min-height: 360px; }
	#bandeau_accueil .background { left: 0px; right: 0px; background-size: auto 100%; }
	#bandeau_accueil.ba_plarg { background-size: auto 100%; height: 360px; }
	#bandeau_accueil .texte { min-height: 360px; } #bandeau_accueil .txt_table { height: 360px; } #bandeau_accueil .txt_tcell {  }
	#slideacc { position: relative; width: auto; height: 360px; margin: 20px 0 46px 0; }
	.slideelt { width: 100%; } .slideimg { width: 100%; height: 360px; }
	.slideimg img { height: auto; width: 100%; top: 0px; left: 0px; } 
	.slidetxt { width: 92%; height: auto; padding: 2% 4%; } .slidetxt h3 {  } .slidetxt a {  }
	#slideliens { width: 100%; left: 0; top: 100%; margin: 10px 0; }
	#slideliens .slide_page { } #slideliens .btnControle { }
	
}

/* ------------------------------------------------ */
/* Format mobiles < 370px							*/
@media handheld, only screen and (max-width: 370px), only screen and (max-device-width: 370px) {

	.content.cntmt20 { margin-top: 0px; } .content.cntmt60 { margin-top: 0px; }
	.cntTxtart { margin: 0px; }
	#auteur { width: 100%; }

	#entete { position: relative; }
	#menu { display: table; width: 100%; } #menu a { display: table-cell; text-align: center; padding: 10px 6px; }
	#cntrech { float: right; display: block; padding-right: 22px; margin-left: 6px; } 
	#recherche { width: 100%; font-size: 12px; } #btnRech { float: none; position: absolute; left: 100%; margin-left: -28px; top: 9px; }
	#div_cats { position: relative; left: 0px; top: 0px; width: auto; border-radius: 0; margin-left: auto; background: #444444; box-shadow: none; }
	#div_cats a { font-size: 12px; }

	.cold_elt { margin: 6px; }

	#bandeau_accueil { margin-top: 0; } #bandeau_accueil .content { min-height: 260px; }
	#bandeau_accueil.ba_plarg { background-size: auto 100%; height: 260px; }
	#bandeau_accueil .texte { min-height: 260px; } #bandeau_accueil .txt_table { height: 260px; } #bandeau_accueil .txt_tcell {  }
	#slideacc { position: relative; width: auto; height: 260px; margin: 20px 0 46px 0; }
	.slideelt { width: 100%; } .slideimg { width: 100%; height: 260px; }
	.slideimg img { height: auto; width: 100%; top: 0px; left: 0px; } 
	.slidetxt { width: 92%; height: auto; padding: 2% 4%; } .slidetxt h3 {  } .slidetxt a {  }
	#slideliens { width: 100%; left: 0; top: 100%; margin: 10px 0; }
	#slideliens .slide_page { margin-left: 4px; } #slideliens .btnControle { margin-right: 4px; }

}