body, html { margin: 0; color: #fff; font-family:"Trebuchet MS"; font-size: 14px; background: #e6e6e6; height: 98%; }
#content { width: 1100px; margin: 0px auto; padding: 0; height: auto; color: #555; }
img { max-width:100%; height:auto; }

/* Header */
#header { margin: 0px auto; width: 1100px; min-height: 100px; height: auto; padding: 0; background: #fff; border-bottom: 1px solid #ccc; }
#logo { float: left; width: 1100px; font-size: 40px; height: auto; line-height: 50px; max-width:100%; }
#logo-p { float: left; width: 310px; font-size: 40px; height: auto; line-height: 90px; }
#logo-b { width: 1100px; height: auto; padding: 0; }
#social { margin-left: 660px; width: 400px; font-size: 14px; line-height: 32px; margin-top: 6px; text-align: right; }
#pub { margin-left: 310px; width: 750px; font-size: 14px; line-height: 32px; margin-top: 10px; text-align: right; }
#logo a, #logo a:visited, #logo-p a, #logo-p a:visited { color: #666666; text-decoration: none; }
#logo a:hover, #logo-p a:hover { color: #666666; text-decoration: none; }
#slides { display: none; }

/* Contenu du site */
#contenu { width: 1100px; margin: 0 auto; height: auto; overflow: hidden; background: #fff; }

/* Colonne gauche */
#right { float: left; width: 260px; padding: 20px 25px; background: #fff; }
.box { width: 246px; background: #e6e6e6; border: solid 1px #ccc; padding: 6px; margin-bottom: 20px; }
.box-pub { width: 262px; margin-bottom: 20px; border: 2px dashed #ccc; padding: 10px; text-align: left; }
.pub { margin-bottom: 20px; border: 2px dashed #ccc; padding: 10px; text-align: left; }
.titre-col { color: #a12f90; margin-bottom :4px; font-size: 16px; font-family: 'Times'; }
.recherche { margin-bottom: 10px; }
.rec { border: 1px #ccc solid; font-size: 15px; background: #fff; width: 238px; }
ul.cat-col { margin: 0 0 10px 16px; padding: 0 }
ul.cat-col li { list-style: disc; line-height: 20px; color: #666666; }
ul.cat-col li a, ul.cat-col li a:visited { color: #555; text-decoration: none; }
ul.cat-col li a:hover { color: #a12f90; text-decoration: underline; }
hr { height: 1px; color: #ccc; background: #ccc; border: 0; padding-right: 20px; margin-bottom: 10px; }
.titre { border-bottom: 1px solid #ccc; padding-bottom: 8px; margin-top: 10px; color: #666666; }
#social-col {  margin-bottom: 10px; }

/* Colonne droite */
#left { float: right; width: 739px; height: auto; padding: 15px 25px; background: #fff; }
h1, h2, h3 { font-size: 30px; line-height: 30px; color: #666; font-weight: normal; margin: 0; font-family: 'Times'; }
h2 { font-size: 20px; line-height: 22px; margin-bottom: 10px; }
h3 { font-size: 16px; line-height: 22px; margin-bottom: 10px; }
h1 a, h1 a:visited, h2 a, h2 a:visited { color: #a12f90; text-decoration: none; }
h1 a:hover, h2 a:hover { color: #a12f90; text-decoration: underline; }
.liste-articles { border-top: 1px solid #666666; padding: 10px 0; }
.liste-articles-b { border-top: 1px solid #666666; padding: 16px 0 10px; }
.texte { color: #555; }
.texte ul { margin: 0 0 10px 16px; padding: 0; }
.texte ul li { line-height: 20px; padding: }
.auteur { font-size: 13px; font-style: italic; }
.texte a, .texte a:visited, .auteur a, .auteur a:visited { color: #a12f90; text-decoration: none; }
.texte a:hover, .auteur a:hover { color: #a12f90; text-decoration: underline; }
.relais { width: 100%; margin: 0; padding: 0; list-style: none; height: 100 }
.relais-el { display: inline-block; vertical-align: text-top; margin: 0 10px 0 0 }
.suite { float: right; }
.suite a, .suite a:visited { color: #a12f90; text-decoration: none; }
.suite a:hover { color: #a12f90; text-decoration: underline; }

/* Structure horizontale */
ul.liste-articles-h { padding: 0; margin: 0; list-style: none; width: 738px; overflow: hidden; }
ul.liste-articles-h li { float: left; list-style: none; width: 360px; height: 290px; padding: 0px; margin: 0; background: #e6e6e6; border: 1px solid #ccc; }
ul.liste-articles-h li.vide { list-style: none; width: 360px; padding: 0px; margin: 0; background: none; border: none; }
h2.h { font-size: 20px; line-height: 22px; margin: 8px 0 0; color: #a7497d; text-align: left; }
h2.h a, h2.h a:visited { color: #a7497d; text-decoration: none; }
h2.h a:hover { color: #a7497d; text-decoration: underline; }
ul.liste-articles-h li:first-child { float: left; list-style: none; width: 348px; padding: 6px; margin-bottom: 10px; }
ul.liste-articles-h li:last-child { float: right; list-style: none; width: 348px; padding: 6px; margin: 0; }

.img-f { float: left; margin: 0 0 10px 0; background: #fff; padding: 4px; border: 1px solid #ccc; }
.img-h { float: left; margin: 0 10px 10px 0; background: #fff; padding: 4px; border: 1px solid #ccc; }
.img-v { margin: 0 4px 2px; background: #fff; padding: 4px; border: 1px solid #ccc; }

/* Footer */
#footer { width: 1081px; height: 30px; line-height: 30px; margin: 0 auto 10px ; padding-left: 20px; color: #555; background: #fff; font-size: 13px; text-align: left; border-top: 1px solid #ccc; height: auto; }
#footer a, #footer a:visited { color: #555; text-decoration: none; }
#footer a:hover { color: #555; text-decoration: underline; }

/* Commentaires */
.coms { margin-bottom: 24px; }
.avatar { border:1px solid #ddd; padding:3px; float:left; margin-right:14px; }
.coms-arrow, .coms-arrow-a { background: url(images/coms-arrow.png) no-repeat; width:8px; height:15px; float:left; margin-top:16px; margin-right:-1px; }
.coms-arrow-a { background: url(images/coms-arrow-a.png) no-repeat; }
.coms-box, .coms-box-a { border: 1px solid #ddd; background-color: #f9f9f9; padding:14px; overflow:hidden; }
.coms-box-a { background-color: #eee; }
.coms-texte { line-height:18px; }
.coms-auteur { margin-bottom:10px; }
.coms-auteur a, .coms-auteur a:visited, .coms-texte a, .coms-texte a:visited { color:#666666; text-decoration: none; }
.coms-auteur a:hover, .coms-texte a:hover { color:#666666; text-decoration: underline; }

/* Pager */
#pager { padding: 0 0 10px; height: 20px; }
#pager ul.np { display: block; font-size: 14px; font-weight: bold; color: #666666; text-align: center; list-style-type: none; margin-left: -40px; }
#pager ul.np li { float: left; margin-right: 5px; list-style-type: none; }
#pager ul.np li.encours { margin-top: -3px; background: #666666; border: 1px solid #666666; padding: 2px 6px; color: #fff; height: 18px; line-height: 18px; }
#pager ul.np li a, #pager ul.np li a:visited { background: #666; border: 1px solid #666; padding: 2px 6px; color: #fff; height: 18px; line-height: 18px; text-decoration: none; }
#pager ul.np li a:hover { background: #666666; border: 1px solid #666666; padding: 2px 6px; color: #fff; height: 18px; line-height: 18px; text-decoration: none; }

/* Scroll */
.ias_loader, .ias_trigger { text-align:center; margin: 30px 0 40px; }
.ias_trigger a:link, .ias_trigger a:visited { padding: 4px 50px; background-color: #f9f9f9; border: solid 1px #ddd; border-radius: 2px; font: bold 12px Arial, sans-serif; color: #555; text-decoration: none; }
.ias_trigger a:hover, .ias_trigger a:active { border-color: #ccc; }

#haut { position: fixed; bottom: 20px; left: 20px; cursor: pointer; display:none; }
#haut span { width: 100px; height: 30px; padding: 6px 10px; color: #a12f90; background: #fff; border-radius: 3px; font-size: 12px; border: none; outline: none; }
#haut span:hover { background: #666; color: #fff; cursor: pointer;  text-decoration: none; }

/* Formulaire */
.erreur { position: absolute; top: 320px; left: 46%; display: none; opacity: 0; z-index: 100; width: 420px; height: auto; color: #fff; padding: 8px; background: #444; border-radius: 5px; }
.ok { position: absolute; top: 320px; left: 46%; display: none; opacity: 0; z-index: 99; width: 420px; height: auto; color: #fff; padding: 8px; background: #444; }
.erreur p, .ok p { display: inline; }

input, textarea, select { border: 1px #ccc solid; font-size: 15px; color: #000; text-decoration: none; background: #fff; outline: none; }
input:focus, textarea:focus, select:focus { border: 1px #ccc solid; background : #fff; }
.input-focus, .textarea-focus, .select-focus, input.focus { border: 1px #ccc solid; background : #fff; }
select { padding: 1px 3px 2px 3px; margin-top: -4px; }
input { padding: 3px 3px 4px 3px; margin-top: 4px; }
textarea { padding: 2px; margin-top: 3px; }
.requis, .info { font-size: 11px; color: #666666; line-height: 14px; }
.bouton { background: #666666; border: 1px solid #666666; padding: 2px 8px 4px 8px; height: 30px; line-height: 26px; font-size: 13px; color: #fff; text-align: center; cursor: pointer; }
.bouton:hover, .bouton:focus { border: 1px solid #ccc; color: #fff; background: #ccc; }

p { line-height: inherit; }
a, a:active, img, img:active, input img, input img:hover { border: none; outline: none; }
a img:link {border:none; background: transparent;} 
a img:visited {border:none; background: transparent;} 
a img:hover {border:none; background: transparent !important;} 
a img:hover {border:none; background: transparent;} 
a:link img {border: none; background: transparent;} 
a:visited img {border:none; background: transparent;} 
a:hover img {border:none; background: transparent !important;} 
a:hover img {border:none; background: transparent;}

/* Réseaux Sociaux */
.argent {}
.argent img {width: 150px !important; padding: 6px; border: 0; box-shadow: none !important; display: inline !important; vertical-align: middle}
.argent, .argent a {text-decoration:none; background: none; font-size: 20px}
.argent-count:after, .argent-count:before {right: 100%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none}
.argent-count:after {border-color: rgba(224, 221, 221, 0); border-right-color: #f5f5f5; border-width: 5px; top: 51%; margin-top: -5px}
.argent-count:before {border-color: rgba(85, 94, 88, 0); border-right-color: #e0dddd; border-width: 6px; top: 51%; margin-top: -6px}
.argent-count {font: 14px Arial, Helvetica, sans-serif; padding: 7px 10px; -khtml-border-radius: 6px; -o-border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position: relative; border: 1px solid #e0dddd;color: #555e58; background: #f5f5f5}
.argent-count:after {border-right-color: #f5f5f5}

@media only screen and (max-width: 999px) {
	#content { width: 100%; box-shadow: none; margin: 0 }
	#header { width: 100%; height: auto; background: none; }
	#logo, #logo-p { float: none; text-align: center; }
	#logo-b { width: 100%; height: auto; }
	#social { margin: 14px 0 0 0; width: 100%; text-align: center; }
	#contenu { width: 100%; padding: 0; }
	#left { float: none; width: 96%; display: block; padding: 10px 2% 1px; border-right: none; }
	ul.liste-articles-h { width: 100%; margin: 0 auto; }
	ul.liste-articles-h li, ul.liste-articles-h li:first-child, ul.liste-articles-h li:last-child { float: none; list-style: none; width: 100%; padding: 0; margin: 0;}
	ul.liste-articles-h li p, ul.liste-articles-h li:first-child p, ul.liste-articles-h li:last-child p { text-align: center; }
	ul.liste-articles-h li p.auteur, ul.liste-articles-h li:first-child p.auteur, ul.liste-articles-h li:last-child p.auteur { text-align: left; }
	#right { float: none; width: 96%; display: block; padding: 6px 2% 1px; border-top: 1px solid #ccc; background: #eee }
	.box, .box-pub { width: 96%; padding: 0 6px }
	ul.liste-articles-h { width: 100%; }
	.suite { float: none; text-align: center; }
	#footer { width: 96%; text-align: center; padding: 14px 2%; }
	input, textarea, select { max-width: 96% }
	.rec { width: 96% }
	h1, h2, h3 { font-size: 1.4em; }
	h2 { font-size: 1.2em; }
	h3 { font-size: 1.1em; }
	#pager { margin-top: -10px; padding: 0 0 20px }
	#pager ul.np li.encours { margin-top: 2px; padding: 3px 6px 2px; }
	#pager ul.np li a, #pager ul.np li a:visited, #pager ul.np li a:hover { line-height: 30px }
	.page {  }
	.glos { clear: both; padding-top: 10px }
	.img-f, .img-v, .img-h { max-width: 92%; margin-bottom: 16px }
	.iframe {position: relative; margin: 0; padding: 0}
	.iframe .iframe-ratio {display: block; width: 100%; height: auto}
	.iframe iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0}