@charset "UTF-8";
/*
* Theme Name: Bruglia
* Theme URI: https://www.bruglia.com/
* Author: Bruglia
* Author URI: https://www.bruglia.com/
* Description: Theme par Bruglia
* Version: 4.0
**********************************************************************/
* { 	
	margin: 0px;
	padding: 0px;
 	box-sizing: border-box;
}

body {
	font-size: 12px;
	font-family: 'Open Sans', sans-serif;
	color: black;
	background-color: #E2DFD6;
}

a, .widget a,
#main .produit_titre2 {
	color: #1195e4;
	font-weight: bold;
}

a { 
	font-weight: bold;
	text-decoration: none;
}
a:hover { text-decoration: underline; }

ul{ list-style-type: none; padding: 0; margin: 0; }
strong { font-family: "Open Sans"; font-weight: 700;}

pre {
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
	border: 1px dotted #0066CB;
	padding: 10px;
	font-size: 10px;
	margin: 10px;
}


#site {
	margin: 0 auto; 
	padding: 0;
	background: rgb(230,230,230);
	position: relative;
}

#header {
	width: 1200px;  
	z-index: -30; 
	position: relative
}
#main {
	width: 66.66667%;
	float: left; 
}
#content-wrap {
	margin: 0 auto;
	width: 1200px;
}
#sidebar { 
	float: left; 
	padding-top: 10px; 
    font-size: 14px;
}

/**=======================================================================================
 * CONTENU 
 *======================================================================================== 
 */
 
#content-wrap {
  /* nav and icon height */
  /* footer height */  
	z-index: 100;
	position: relative;
	background-color: white;
	
	/* Hack de JB voir mail 140615 1412 */
	-webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    box-sizing:border-box;

	display: flex; /* Nécessaire pour que #sider ait un background uni sans préciser le height en float */
}

#main  /* contenu rédactionnel principal colonne gauche  */ {
	position: relative;
	margin-top: 0px;
	padding: 10px;
	overflow:hidden;
	background-color: white;
	box-sizing: border-box;
}

#main p, #main ul {
	hyphens: auto;
}

#access /* menu de navigation principal - a zapper */ {
	float: right;
	top: 70px;
	position: absolute;
	display:none;
}

/* ==================================================================
	=================================================================
 * Contenu des articles du blog
   ==================================================================
	================================================================*/
 
h1.entry-title /* titre de l'article */ {
	font-size: 24px; 
	color: black;
	clear:both /* force le retour à la ligne pour la page de résultats */
 }
 
.post  /* spécifique à chaque article ou post*/{
	margin: 0px 0px 30px 5px;
	padding: 0 20px;
}
 
.leave-reply /* Répondre */ {
	position: absolute;
	display: none;
} 
 
.entry-meta /* Publié le  */ {
	margin: 2px 0;
	display: block; 
	padding-top: 40px;
}

/* Le footer (ce contenu a été publié dans..) - 
 * en bas de chaque post 
 * Cette entrée a été postée dans */
footer.entry-meta {
	clear: both;
	font-size: 14px;
	padding: 25px;	
	margin-bottom: 40px;
	line-height: 1.6em;
}

/* Pour les articles blogs, je veux un encars visuel autour des meta à la fin de l'article */
article.post footer.entry-meta  {  	
	background: #fcfcfc;
}

/* Pour les pages, je ne dois pas afficher les meta (hormis le "modifier" quand on est admin */
article.page footer.entry-meta { background: white; }

.comment-reply-title { padding-top: 20px; font-size: 20px;}

/* body.home
 * => je veux un séparateur entre articles seulement sur la page index 
 * => pas sur les pages, les catégories ou les recherches
*/

body.home footer.entry-meta  {
	border-bottom: 4px solid #236B9B;
}

.page-title span  /*titre de page pour les archives et recherche */{
	font-weight: bold;
}

article p {
	margin-bottom: 12px;
	font-size: 13px;
}
article img {
	padding: 10px;
	max-width: 100%;
}

/* personnalisation des légendes sous les photos */
.legende_photo  {
	font-weight: bold;
	color: #1195e4;
	text-align: center;
	display: block;
	padding-left: 20px;
	padding-right: 20px;
	margin-bottom: 20px;
}

/* Les titres du contenu de chaque article */
div.entry-content h2  {
	/* h2_01_20131018 */
	font-size: 22px;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 10px;
	/* orange : color: #E47911; */
	/*color: #e47911;*/
	display: block;
}
div.entry-content h3  { font-size: 18px; margin: 10px 0;}
div.entry-content h4  { font-size: 12px;}
div.entry-content h3, div.entry-content h4 { color: black;}
div.entry-content-index {width: 550px;} /*le contenu résumé */
div.entry-content li {
	list-style: url('images/widget-li.png');
	padding-left: 5px;
	margin: 0;
	list-style-position: inside;
	font-size: 14px;
	line-height: 2em;
} 
div.entry-content ul { margin-bottom: 15px;}

.bleu {	color: #0066cb; }
.bleupale {	color: #5fafff; }
.red {color: red;}
.orange {color: #e48d11;}

.note_sep /* separateur de note */ {
	display: none;
}

/*
 * Page Recherche
 * 
 *
*/

.page-title {
	font-size: 14px;
	margin-bottom: 20px;
	font-weight: normal;
}

/*
 * Navigation entre articles 
 *
 * meta-nav : Système de navigation
 * nav-previous : Article précédent
 * nav-next : Article suivant
*/

.nav-previous, .nav-next {
	font-weight: 800;
	font-size: 120%;
	padding-bottom: 20px;
	width: 48%;
	display: inline-block;
	vertical-align: top;
}

.nav-next {
	text-align: right;
}

/* dans les articles produits 
 * les titres :
**/

#main .produit_titre2 {
	font-size: 25px;
	font-weight: bold;
	padding: 10px;
	padding-left: 0px;
	margin: 5px 0;
	color: #1195e4;
}

/* 
 * Affiliation Amazon 
 *
*/

/*.box_az_af_1, .box_az_af_2_alt*/

.az1-img {
	line-height: 90px;
	display: block;
	height: 90px;
}

p.az11 {
	font-size: 20px;
	font-weight: bold;
	text-align: left;
	text-justify: left;
}

.az12 {
	clear: both;
	text-align: center;
}

.box_az_af_2_alt /* alt*/{
	margin-top: 30px;
}
.box_az_af_2_alt A{
	font-size: 110%;
}

.ads_contbas { position: relative; float: left;}

.az_af_search {
	/*margin: 0 auto;
	padding-left: 400px;*/
	position: relative;
/*	float: left;*/
	
	/* on sait qu'on est en 650
	width: 650px;
	*/
}
#respond {
	clear: both; /* pour éviter le float:left sur les articles non az */
    padding: 20px;
}

.box_az_af_1 .az12 img {
	top: -80px; 
	position: relative; 
	width: 130px;
}

/*
 *  ADSENSE
**/
.ads_contenu {
	text-align: left;
	clear: both;
}

/* 
 * TOP 5
 *
*/
.topfive {
	/*border: 1px solid black;
	width: 700px;
	height: 230px;*/
	margin-bottom: 20px;
	position: relative;
} 
.topfive a, .topfive a:hover, .topfive li a {
	color: #E47911;
	font-weight: normal;
	font-size: 13px;
}

.topfive h2, .entry-content  .topfive h2 {
	display: block;
	position: relative;
	text-align: left;
	color: #E47911;
	text-transform: capitalize;
	font-family: 'Permanent Marker';
	letter-spacing: 1px;	
}

.topfive ul {
	margin-left: 5px;
}

.topfive-horizontal li {
	float: left;
	width: 128px;
	display: block;	
	margin: 0 2px;
	font-size: 10px;
	padding: 0 2px;
}

.entry-content .topfive-vertical {
	float: left;
	width:400px;
	
	/* box-sizing 23/01/2014 13:45 */
	padding-right: 6px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;	
}

.entry-content .topfive-vertical a {
	/*float: left;*/
}
.topfive-vertical .topfive_img { 
	float: left; 
}

.entry-content  .topfive-horizontal h2 {
	font-size: 26px;
}
.entry-content  .topfive-bas h2 {
	font-size: 20px;
}

/* forcing avec le contenu entry-content */
.entry-content .topfive-vertical li
  {
	list-style: none;
	background-image: none;
	text-transform:capitalize;
	clear: both;
}

.topfive a{
	display: block;
	text-align: left;
	vertical-align:bottom;
	color: #6282e3;
}

.topfive img {
	padding: 5px;
	margin: 0;
	/*border: 1px dotted #444;*/
	display: block;
	text-align: center;
	width: 100px;
	margin-left: 10px;
}

#topfive_sep {
	clear: both;
}

/* 
 * Légende des images 
 *
*/

.leg-img p {
	text-align: center;
	display: block;
}
.leg-img span {
	font-weight: bold;
	background: #f1f1f1;
	display: block;
	color: #45484c;
}
.leg-img img {
	padding: 0;
	margin: 0;
}

h1.entry-title{
	text-transform:capitalize;
	font-size:26px;
	/* décalage pour aérer 
	padding-top: 7px;*/
	padding-bottom: 10px;
	margin-top: 20px;
}

/* pour désactiver le padding sur les images autour des smileys */
img.wp-smiley {padding: 0; margin: 0;}

/* Afficher les titres en gros pour certains cas */
.search .page-title, 
.archive  .page-title {
	font-size: 14px;
}

/* Supprime Navigation des articles */
h3.assistive-text {
	display: none;
}

/* Pour la page contact */
.cfgenwp-contactform { padding: 10px;}

/* Inclusion Youtube grande taille */
.youtube_ifr {
	width:560px;
	height:315px;
}

/*******************************************************************
 * Header
 *******************************************************************/
#header-wrap {
	z-index: 100;
	position: relative;
	height: 150px;
	padding-bottom: 50px;
	margin: 0 auto;
}

#header /* header complet */ {
	text-align: center;
	color: white;
	margin: auto;
}
#header, #header-wrap, #footer {
	background-color: #ccc;
}

/* Le LOGO */
#header img{
	top: 5px;
	left: 0px;
	position: absolute;
	z-index: 2000;
	margin: 0;
	padding: 0;
	text-align: left;
	width: 20%;
}

/* Titre principal du blog - je le remplace par un logo */
#header h1 { text-indent: -5555px; }
/* Sous-titre du blog */
#header h2 {
	position: absolute;
	top: 47px;
	font-size: 175%;
	margin: 0 auto;
}

/************************
 *  Bouton rechercher 
 ************************/
header .searchform {
	position: absolute;
	top: 15px;
	right: 0px;
	z-index: 8830;
}
#searchform-input /*zone input de saisie pour la recherche */ {
	padding-left: 10px;
	background: white;
	color:  #333;
	border: 1px solid #999;
}
#searchform-label { /* Je ne veux pas de label */ display: none; }

#searchsubmit /* bouton submit pour la recherche */{
	width: 40px;
	height: 32px;
	background:	url('/img/theme/search.png') no-repeat 9px 5px #236B9B;
	text-indent: -9999px;
	position: relative;
	border: 1px solid #ccc;
}

#searchsubmit:hover { 
	background:	url('/img/theme/search.png') no-repeat 9px 5px #3495D3;
}

#searchsubmit, #searchsubmit:hover {
		background-size: 20px;
}

#searchform-input {height: 30px; width: 265px;}

.titre-article-blog {  font-size: 22px; margin-bottom: 0em; padding-top: 0.5em;}

.titre-article-blog a {
	color: black;
	font-size: 28px;
	line-height: 1.6em;
}

.post p {
	font-size: 15px; 
}

#main p {
	line-height: 1.6em;	
	font-size: 14px;
}

/* Suivez-nous : padding à 0 sinon ça fait moche*/
aside#social>.widget-title {
	padding-top: 0;
}

/* =============== WIDGET =================== */
.widget { 
	color: black;
	border: 1px solid rgb(230,230,230);
	padding: 0;
	margin: 0;
	margin-bottom: 20px;
	margin-right: 5px;
	margin-bottom: 10px;
	padding-bottom: 5px;
	background: #fff;
	color: black;
	color:#444;
}

#sidebar  /* nav colonne droite */ {
	width: 33.33%;
	float: left;
	background-color:white;
	padding-left: 30px;
	padding-right: 6px;
	/*margin-bottom: 30px;*/
}
#sidebar select, #sidebar option { 
	color: #1195e4;
	font-weight: bold;
}

.widget ul {
	padding:  0;
	margin: 10px;
	line-height: 1.1em;	
}
.widget li {
	margin: 0;
	list-style-position: outside;
	margin-bottom:2px;
	padding: 2px;
	line-height: 1.5em;
}

h3.widget-title /* Titre de chaque widget */ {
	color:white;
	font-size:16px;
	font-weight:900;
	background: #236B9B;
	text-align: center;
	padding: 0;
	margin: 0;
	padding: 12px 0;
}

/* ============== widget - catégories ============== */
.widget_categories li  {
  /* border: 2px solid red;*/.
   display: flow-root;
   display: inline-block;
   vertical-align: top;
    width: 45%;
}
.widget_categories li {
    text-align: right;
}

/* ============== widget - réseaux sociaux - Facebook, Google+, Twitter ============== */

aside#social.widget { }
aside#social.widget p { padding: 10px;}
aside#social.widget ul { text-align: center;}
aside#social li { 
	height: 50px; 
	width: 50px; 
	display:inline-block; 
	background-repeat: 
	no-repeat; 
	background-size: 50px 50px; 
	text-indent:-9999px; 
	padding-right: 5px;
}
aside#social li:hover {opacity: 0.7;}

#widget_li_facebook, #footer_facebook { background:url('/img/theme/social_facebook.png'); }
#widget_li_googleplus, #footer_googleplus  { background:url('/img/theme/social_googleplus.png'); }
#widget_li_twitter, #footer_twitter { background:url('/img/theme/social_twitter.png'); }
#widget_li_instagram {background:url('/img/theme/social_instagram.png');}

/* ============== widget - archives ============== */
.widget_archive label {
	text-indent: -9999px; 
	display: none; 
	overflow: hidden; 
	margin: 10px 15px;
}
.widget_archive label,
.widget_archive select { 
	margin: 10px 10px;
}

.widget_archive select { 
	width: 200px; 
	height: 2.5em;
}

.entry-col2 {
	padding-top: 10px;
}

.entry-col1, .entry-col2 {
	float: left;
}

article {clear:  both;}

.entry-col1 img {
	width: 200px; 
	height: 200px;
	margin:20px;
	margin-left: 0;
}

/* Menu principal de navigation */
#menu {
	z-index: 445; 
	position: relative; 
	padding-top: 60px;
	margin: 0;
	margin-top: 0px;
	padding-left:5px;
	text-transform: uppercase;
	display: sticky;
}
#menu li {
	float: left; 
	display: block; 
	font-size: 11px;
	margin: 0px;
	background-color: #236B9B;
	font-weight: bold;
	height: 48px;
	line-height: 48px;
}
#menu li a {
	padding: 0 20px;
	color: white; 
	display: block; 
	text-decoration: none;
}
#menu li.menu_hover:hover  { 
	background: #195877; 
	color:#0066cc;
}

li#menu_li_home a,
li#menu_li_home a:hover {  
	background: url('images/headers/home.png');
	background-repeat: no-repeat;
	background-size: 18px 18px;
	background-position: 24px 14px;
	width: 64px;
	height:40px;
}

li#menu_li_home:hover {
	background: black; 
}

/* Divers */
.moretag {text-align: right}
.comments-link {
	float: right;

}

/* Barre de navigation */
#nav-single {padding: 20px;}
#nav-below { display: block; clear: both; padding-top: 20px;}

.wp-pagenavi {
	font-size: 13px;
	text-align: center;
	margin-top: 50px;
	margin-bottom: 25px;
}
.wp-pagenavi A {
    background: rgb(230,230,230);
    margin: 0 2px;
    padding: 0px 10px;
    border: 1px solid #999;
    display: inline-block;
    min-width: 50px;
    height: 40px;
    line-height: 40px;
}
.wp-pagenavi .pages { padding-right: 10px; font-weight: bold;}
.wp-pagenavi .extend {padding: 5px; }
.wp-pagenavi .current {
	padding: 5px;
	font-weight: bold;
	font-size: 16px;
	margin: 0 20px;
	color: #999;
}

/*===================================================
 * Contenu des articles 
 *===================================================
 */

.azBoxHeader {
	border: 1px solid #ccdfed;
	padding: 10px; 
	background-color: white;
	margin-top: 10px;
	border-radius: 6px; 
}

 /* Box affiliation en haut */
 .azBoxHeader .produitImage {
 	/* max-width: 110px;
  	height: 80px;*/
  	text-align: right;
  	padding-right: 10px;
}
.azBoxHeader .produitBouton A img:hover {
	opacity: 0.7;
}
.azBoxHeader .col1, 
.azBoxHeader .col2 {
  float: left;
}
.azBoxHeader .col1 {
  width: 130px;
}
.azBoxHeader .col2 {
  width: 535px;
  padding-left: 10px;
}
.azBoxHeader .produitLibelle {
  font-size: 16px;
  font-weight: bold;
  width: inherit;
}
.azBoxHeader .produitBouton img,
.azBoxHeader .produitImage img {
	padding: 0;
}
.azBoxHeader hr {
	clear: both;
	border: none;
}

/**
 * FIN DES ARTICLES 
 *
 * Conclusion : pour / contre / note;
 *
 */

.conclusion { 
	border: 1px solid #ccdfed;
	position: relative;
	overflow:hidden;
    width:100%;
	margin: 30px auto 15px auto;
	/*box-shadow: 5px 5px 6px #aaa;*/
}

section.pour, section.contre {
	padding-left: 20px;
	padding-bottom: 20px;
}

section.pour, section.contre,
section.note { 
	float: left; 
	width: 33%;
}

/* Plus petit pour les points positifs et négatifs */
section.pour li,
section.contre li{
	font-size: 13px;
	line-height: 20px;
	text-align: left;
}

.conclusion .pour h3,
.conclusion .contre h3,
.conclusion .note h3 {
	color: #1195e4;
	margin: 10px 0;
}
.conclusion .pour h3, 
.conclusion .contre h3,
.conclusion .note h3{
	font-size:20px;
}

section.pour, section.contre {
	float: left;
}

/* Plus petit pour les points positifs et négatifs */
section.pour li,
section.contre  li{
	font-size: 13px;
	line-height: 20px;
}

.note_big {
	font-size: 58px;
}
.note_low {
  font-size: 32px !important;;
  font-weight: bold;
  text-align: center;
  border-top: 7px solid black;
 }
.note_big, .note_low { 
	display: block; 
	width: 150px !important; 
	font-weight: bold;
	text-align: center;
	position: relative;
	margin: 0 auto;
}
.note_sep {
	display: none;
}

.conclusion h3 {
	text-align: center;
	display: block;
	line-height: 40px;
	font-size: 16px;
}

div.entry-content .pour  li,
div.entry-content .contre li 
/* obligatoire pour effacer les puces de .entry-content li*/ {
	list-style: none;
	padding-left: 35px;
	position: relative;
}

.pour li, .contre li { 
	background-image: url('images/pourcontre/li-pour.png'); 	
	background-repeat: no-repeat;
}

.pour li, .contre li {
	background-position: 10px 2px;
	line-height: 15px;
}

/* Bouton voir */
.boutonvoir:hover {opacity: 0.7;}
/* Bouton voir en bas (dans pour/contre/note) */
.boutonvoir.bas { 
	padding: 0; 
	margin-top: 10px;
	width: 180px;
}

/**==================================================
 *
 * Formulaire de commentaires
 *
 * ==================================================
 */

.comment-notes /* Votre adresse de messagerie ne sera pas ... */ {
	margin: 5px 0;
	font-style: italic;
	margin-bottom: 15px;
}

#commentform p {padding-top: 10px; display: block;}

#commentform label {
	width: 200px;
	display: block;
	float: left;
	clear: left;
	text-align: right;
	padding-right: 20px;
	font-weight: bold;
	color: #1195e4;
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height: 3em;
}

#commentform input { 
	height: 30px; 
}
#commentform input[type='submit'] {height: 50px}

#commentform input, 
#commentform textarea {
	position: relative;
	float: left;
	background: #F5F5F5;
	border: 1px solid #999;
	color: #333;
	padding: 5px;
}

#commentform textarea {
	font-family: Arial, sans-serif;
	font-weight: normal;
	font-size: 14px;
	color: #333;
	width: 540px;
	height: 18em;
}

.comment-form-author,
.comment-form-email,
.comment-form-url {
	height: 30px;
}

.form-allowed-tags /* Vous pouvez utiliser ces balises bla bla bla */ {
	clear: both;
	margin: 20px 0;
	padding-top: 20px;
	font-size: 90%;
}

#submit  /* bouton "laisser un commentaire" ou "Envoyer" */{
	margin-top: 10px;
	margin-left: 200px;
	margin-bottom: 50px;
	padding: 10px;
	font-weight: bold;
	clear: both;
}

#submit:hover {background: #ccc}

/**
 * Correction Akismet pour forcer le retour à la ligne
 *
 */
.akismet_comment_form_privacy_notice {
	clear: both;
	font-size: 13px;
}


/**========================================= 
 *
 * Commentaires (après formulaire)
 *
 *==========================================*/
#comments-title  /* 3 réflexions au sujet de ...*/{
	font-size: 120%;
}

ol.commentlist {
	margin: 30px 20px;
}

.comment-author {
	vertical-align: bottom;
}

.vcard  {
	padding-left: 0px;
}

.vcard img {
	padding: 5px;
}

.avatar{
	vertical-align: top;
	float: left;
	clear: both;
	margin: 5px;
}

li.comment /* puces des commentaires */{ 
	font-size: 10px;
	margin-bottom: 20px;
}

li.comment.depth-2, li.comment.depth-3, li.comment.depth-4, li.comment.depth-5  { 	list-style: none; }
li.comment .depth-2{ 	margin-left: 20px; }
li.comment .depth-3{ 	margin-left: 30px; }
li.comment .depth-4{ 	margin-left: 40px; }
li.comment .depth-5{ 	margin-left: 50px; }

.comment-meta {position: relative; background: #ececec;}
.comment { margin-top: 5px;}

.comment-colonne2 /* Le header "nom le a dit" */{
	padding-left: 70px;
	word-wrap:break-word;
	width: 550px;
	top: 0;
	font-size: 13px;
}

.comment-content  /* Le contenu du commentaire lui-même*/{
/*	border: 1px solid green;*/
	display: block;
	word-wrap:break-word;
	position: relative;
	font-size: 13px;
	margin-top: 20px;
}

.comment-meta {
	/* Chaque commentaire - avec un cadre */
	border: 1px solid #ccc;
	padding: 10px;
}

.reply {
	clear: both;
}

article.footer {
	width: auto;
}

/**==================================================
 * Gestion des tableaux CSS
 * ==================================================
 */

.row:after, .row:before {
	content: " ";
	display: table;
}

.row: after {
	clear:both;
}

.row:after,.row:before {
	content:" ";
	display:table;
}
.row:after {
	clear:both;
}

.col3 {
	float: left;
	width: 33%;
	margin: 0 auto;
	padding: 0 20px;
}


/* Miniature des articles sur les pages de navigation */
.entry-col1 img.miniatureArticle {
	width: 150px;
    height: 150px;
    object-fit: scale-down;
    border: 1px solid #dccbcb;
    box-shadow: 1px -4px 20px 2px #eee;
}

/* ==================================================
 *	 FOOTER 
 * ==================================================
 */

footer {
	text-align: left;
	padding-bottom: 20px;
	margin: 0 auto;
}

#footer-wrap {
	position: relative;
	clear: both;
}

#footer /* footer */ {
	text-align: center;
	padding: 48px 0;
	line-height: 22px;
	color: #;
	font-size: 14px;
	width: 1200px;
}

#footer .footer_rss {
	line-height: 30px;
}

#footer .footer_rss img {
	vertical-align:  text-bottom;
	padding-left: 3px;
}

#footer p {	margin: 5px 0; }

footer h2 { font-size: 16px;}
footer ul {}
footer li {display: inline;}


ul#footer_sociaux li {
	height: 32px; 
	width: 32px; 
	text-indent: -9999px; 
	display: inline-block; 
	background-size: 32px 32px; 
	background-repeat: no-repeat;
	padding: 0 5px;
}
ul#footer_sociaux li:hover {opacity: 0.8;}
ul#footer_sociaux li+img {margin: 20px;}

.footer_copyright {text-align: center;}

article { 
	border: 1px solid rgb(230,230,230); 
	display:block;
	clear: both
}

.entry-cols { }
.entry-col1, .entry-col2 {
	/*padding: 20px;*/
}

.entry-col1 { float: left}
.entry-col1 img {
	width:200px
}
.entry-col2 {float: none;}
div.entry-content-index { width: auto;}

.entry-meta {width: 100%;}
.comments-link {
    padding-left: 0px;
}

/* Pages statiques */
.page article { padding: 0 20px }

/* Responsive */
/* Pour les petits écrans */
@media only screen and (max-width:1100px) {
	body {padding: 0; margin: 0; width: 100%; }
	#site {width: 100%; padding: 0; margin:0;}
	#header {width: 100% }
	#header img {
		width: 250px; 
		left: 5px;
		top: 0px;
	}
	#header-wrap {height: auto; padding-bottom: 0px;}
	#header h2 {
		text-indent: -9999px;
		display: block; position: relative; clear: both; 
		width: 200px;
	}

	#content-wrap {width: auto;}
	
	article p {width: 100%}
	
	#footer.entry-meta {width: 100%}
	div.entry-content-index {/*width: 100%;*/ padding: 0; margin: 0;} /*le contenu résumé */
  	div.entry-content p {width: 100%; }

  	/*.entry-col2 { width:100%; padding-top: 10px;}*/

	#menu {
		display: block; 
		margin: 0; 
		padding: 0px; 
		margin-top: 60px; 
		margin-left: 10px; 
		overflow:hidden
	}
	#menu li {
		display: block; 
		position: relative; 
		margin-bottom: 3px;
	}

	form.searchform { 
		position: relative;
		float: none; 
		top: 0; 
		left: 0; 
		margin: 10px; 
		margin-bottom: 20px;
		width: auto;
		text-align: left;
	}
	
	#searchform-input  {width: 70% }
	#searchsubmit {
		width: 50px; 
		height: 30px; 
		text-align: center;
		background-position: 12px;
	}
	
	#searchsubmit:hover {
		background-position: 12px;
	}

	.entry-meta {
		text-align: left; 
		padding:0; 
		width: 100%
	}
   	footer.entry-meta {width: 100%; padding: 15px; box-sizing:border-box}

   	.entry-content p img {max-width: 100%;}
	div.entry-content p {width: auto};
	.widget-title {clear: both;}
	.widget_categories li {
		display:inline; 
		padding: 0px 5px; 
		text-align: left;
		line-height: 1.2em;
	}

	#respond .comment-form-author,
	#respond .comment-form-email,
	#respond .comment-form-url,
	#respond .comment-form-comment,
	#respond .form-submit {display: block; clear: both;}
	#respond .form-submit input {
		text-align: left; 
		margin: 0; 
		margin-left: 0; 
		width: auto; 
		margin-bottom: 30px;
	}

	#commentform label,
	#commentform textarea { 
		text-align: left; 
		margin: 0; 
		display: block;
		float: none;
	}

	#commentform textarea {
		width: 100%;
		margin-top: 10px;
	}

	/* footer sans gros décalage à gauche */
	footer.col3 { padding: 0px; } 
	
	div#sidebar {
		padding: 10px; 
		padding-bottom: 30px; 
		box-sizing: border-box;
		max-width: 30%;
	}

	#footer {
		width: auto;
		padding: 20px;
	}
}

@media only screen and ( min-width:700px) and (max-width: 1000px) {
	#sidebar {width: 200px; padding: 0}
}

@media only screen and (max-width:950px) { 
	#main, #sidebar { 
		width: 100%;  
		padding: 0; 
		margin: 0;	
		padding-top: 30px;
		margin-top: 10px;
	}

	article {padding: 5px;}
	article p {width: 99%}

	.post {box-sizing: border-box;}

	#main p.az12 {
		text-align: center;
		line-height: 19px;	
		width: 100%;
		clear:both;
		padding-top: 20px;
	}
	#main p.az12 img.boutonvoir {
		width: 150px;
		max-width: 180px; 
		margin: 25px auto; 
	}

	#main .produitBouton>p { 
		text-align: right;
	}

	.conclusion .col3 { 
		float: none;
	}
	.form-submit { margin-left: 80px; display: block; margin-bottom: 100px}

	.azBoxHeader .col1 {
		float: left;
	}
	.azBoxHeader .col2 {
		width: auto;
		padding-left: 20px;
		float:none;
	}
	.azBoxHeader .col1, .azBoxHeader .col2 { 
		width: auto;  
	}

	#main { width: 100%; padding: 0;}

	article {/*width: 100%;*/  position: relative; }
	.entry-col1, .entry-col2 { position: relative; top: 0; left: 0; }
	.entry-col1, .entry-col1 img { 
		width: 200px; 
		position: relative; 
		float: left;
		padding: 0 10px;
	}

	.entry-col2 { padding: 0; margin: 0; padding-top: 10px;}
	.entry-content-index {width: 100%}
	.widget_categories li { display:inline; }

	section.pour, section.contre, section.note { width: 100%}

	/* Inclusion Youtube grande taille */
	iframe, .youtube_ifr {
		width:100%;
	}

}


@media only screen and ( min-width:550px) and (max-width: 1000px) {
	#main { max-width: 950px; width: auto;}
	#sidebar {width: 100%; padding: 0}
	.widget_categories li {display: inline-flex;}
}

@media only screen and (max-width:550px) {
	article .entry-col2  p,
	article .entry-content p {font-size: 125%;}
}

@media only screen and (max-width:750px) {
	div#sidebar {
		padding: 10px; 
		max-width: 100%;
	}

	#content-wrap {
		margin: 0 auto; 
		width: 100%;
		display: block; 
	}

	#site {
		padding: 0px !important;
	}

	#header {
		padding: 0px !important;
		width: 100% !important;
	}

	img {
		max-width: 100%  !important;
	}

	.col3 {
	  width: auto !important;
	  float: none !important;
	}
}