/*	--------------------------------------------------

	* projet : Essarbois - Blog version 2
	* créé le : 23/05/2013

	STYLES :
	- généralités
	- font-face
	- éléments WYSIWYG
	- combinaisons et cas particuliers
	- blocs (article en bloc)
	- pager
	- formulaire
	- overDiv

	-------------------------------------------------- */

/*	--------------------------------------------------
	REMARQUES
	* Pour des raisons d'accessibilité, le choix d'unité de police et le calcul des marges seront exprimés en "em"
	* Évitez d'indiquer une taille en "em" aux éléments intermédiaires : pour éviter les problèmes de cascade seuls les éléments en fin de chaîne, devront disposer d'une taille en em si nécessaire : hn, p, li, td, th, a
	-------------------------------------------------- */
	
/*	--------------------------------------------------
	NOTES DE MAJ
	25/02/2013	:	ajout .likeH1, .likeH2, .likeH3
	19/03/2013	:	pour éviter les débordements, ajout width:100% sur le fieldset et max-width:80% sur le select
					annulation de box sizing pour izi-media (fenêtre de connexion)
					ajout de la gestion des input type password
	25/03/2013	:	ajout top:-999em sur overDiv pour le masquer par défaut
	-------------------------------------------------- */

/*	--------------------------------------------------
	GÉNÉRALITÉS 
	-------------------------------------------------- */

html {
	font-size: 62.5%; /* équivalent à 10px */
}
body {
	font-size: 1.3em; /* 14/10 */
	line-height: 1.3; /* minimum recommandé pour le font-size ci-dessus */
	font-family: Arial, Geneva, "Dejavu Sans", sans-serif; /* jeu de police idéal pour du sans-sérif */
	background-color: #ffffff;
	color:#333333;
}

/* Calcul des dimensions de boite */
* {
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
	/* annule pour izi-media */
	.izimediaLayer, .izimediaLayer * {
		-moz-box-sizing: content-box;
	}
/* images responsives */
img { max-width:100%; }

/*	--------------------------------------------------
   FONT-FACE
   -------------------------------------------------- */

/*	--------------------------------------------------
   * les fichiers de police sont à déposer dans un dossier "fonts" avec les fichiers css
   * penser à associer les graisses
	-------------------------------------------------- */

@font-face {
    font-family: 'din light';
    src: url('fonts/din_light-webfont.eot');
    src: url('fonts/din_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din_light-webfont.woff') format('woff'),
         url('fonts/din_light-webfont.ttf') format('truetype'),
         url('fonts/din_light-webfont.svg#din_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Helvetica thin';
    src: url('fonts/helveticaneue-thin-webfont.eot');
    src: url('fonts/helveticaneue-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/helveticaneue-thin-webfont.woff') format('woff'),
         url('fonts/helveticaneue-thin-webfont.ttf') format('truetype'),
         url('fonts/helveticaneue-thin-webfont.svg#HelveticaNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*	--------------------------------------------------
	WYSIWYG
	-------------------------------------------------- */

h1, .likeH1 {
	font-size: 1.3846em; /* 18/13 */
	font-weight: normal;
	line-height: 1.2;
	margin:0em 0 1em;
  border-bottom:1px solid #25a345;
  padding-bottom:5px; 
  font-family: 'Helvetica thin';
}

.blogPostDetail .breadcrumb + h1{
	border-bottom: 0px none;
	font-size: 1em;


}

h2, .likeH2 {
	font-size:1.030769em; /* 16/13 */
	font-weight:normal;
	line-height:1.2;
	margin: 1em 0 4px;
  font-family: 'din light';
  text-transform: uppercase;
  	border-bottom: 0px none;
  	padding-bottom: 0px;
}

 .likeH2 a {
	text-decoration: none;

 }

	.widgetText h2, .widgetText .likeH2 {
		font-size:1.230769em; /* 16/13 */
		margin:0.5556em 0 0 ; /* 10/18 */
	}
	
h3, .likeH3{
	font-size:1.076923em; /* 14/13 */
	font-weight:normal;
	line-height:1.3;
	margin:1em 0 0;
}
	.widgetText h3, .widgetText .likeH3 {
		font-size: 1.076923em; /* 14/13 */
		margin:0.625em 0 0 ; /* 10/16 */
	}

/* pas d'accès au client */	
h4, h5, h6 { display:none; }

/* FCK : dans certains cas génère un div au lieu d'un p */
p, ul, ol, .code_html div { margin:1em 0 0; } /* 14/14 */
	.widgetText p, .widgetText ul, .widgetText ol , .widgetText>div div {
	

	}
	
/* padding en px pour bloquer les marges latérales des listes en cas d'agrandissement du texte */	
ul, ol { padding: 0 0 0 30px; }
	
ul { list-style-type:disc; }
	
	
ol { }
	.widgetText ol { padding:0 0 0 20px; }
	
li { }
	.widgetText li { }

/* ne pas modifier le focus sur les liens */
a {
	color:white;
	text-decoration:underline;
}
a:visited {
	
	text-decoration:underline;
}
a:hover, a:active {
	text-decoration:none;
} 

table {
	border:1px solid #cccccc;
	max-width:100%;
	margin-bottom:1.5em;
}
	table caption {
		color:#aaa;
		font-weight:bold;
		margin:0 0 0.5em;
		text-align:left;
	}
	th, td {
		border:1px solid #cccccc;
		padding:5px;
		vertical-align:top;
	}
	th {
		color:#666666;
		font-weight:bold;
		background-color:#eeeeee;
	}
	td { }

/*	--------------------------------------------------
	COMBINAISONS & CAS PARTICULIERS
	-------------------------------------------------- */

/* FCK : imbrications non maitrisées */
ul p, ol p, ul div, ol div, th p, td p, th ul, td ul, th ol, td ol, th div, td div { margin:0; }

/* FCK : les liens dans les Hn sont possibles */
h2 a, h3 a, h2 a:hover, h3 a:hover, h2 a:visited, h3 a:visited  { 
	color:inherit!important;
	text-decoration:none!important;
	background:none!important;
}

/* google map */
.map img { max-width:none; }
.map>div { width:100%!important; }

/* google map pour e-majine A VERIFIER */
.googleMapBulle {
	width:250px;
	height:150px;
	overflow:auto;
	padding:0;
	margin:0;
}
.labelMarker{
	font-weight:bold;
	color:#000000;
}

/* pour rétablir le flux après un float, à appliquer sur un hr */
.clear, .separator {
    border: 0 none;
    clear: both;
    height: 0;
    line-height: 0;
    margin: 0;
    visibility: hidden;
}

/* pour masquer des éléments */
.hide {
	position:absolute;
	top:-999em;
}

/*	--------------------------------------------------
	BLOCS (ARTICLES EN BLOCS)
	-------------------------------------------------- */

/* communs */
.medias, .map { margin-top:1.4286em; } /* 20/14 */

/* bloc double */
.colleft{
	float:left;
	margin-right:2%;
	width:49%;
}
.colright{
	float:left;
	width:49%;
}

/* bloc texte & image */
.intext_left{
	float: left;
	padding: 5px 2% 0 0;
}
.intext_right{
	float: right;
	padding: 5px 0 0 2%;
}
.above_left, .below_left{ text-align: left; }
.above_right, .below_right{ text-align: right; }
.above_center, .below_center{ text-align: center; }

/* bloc images */
.center{ text-align: center; }
.left{ text-align: left; }
.right{ text-align: right; }
.medias a,.medias a:hover, .medias a:visited{
	display:inline-block;
	text-decoration:none;
}

/* bloc ligne de spération */
.clear.separator {
	margin:0.7143em 0 1.4286em; /* 10/14 20/14 */
	border-bottom:1px dashed #cccccc;
	visibility:visible;
}

/*	--------------------------------------------------
	PAGER 
	-------------------------------------------------- */

.pager { 
	clear:both;
	text-align:center;
	margin-top:20px;
}
	.pager a, .pager a:visited { 
		display:inline-block;
		background-color:#bbbbbb;
		color:#ffffff;
		text-decoration:none;
		padding:0.1428em 0.3571em; /* 2/14 5/14 */
		border-radius:2px;
	}
	.pager a:hover { 
		background-color:#666666;
		color:#ffffff;
	}
	.pager a.pager_current_page, .pager a.pager_current_page:hover { background-color:tomato; }

/*	-------------------------------------------------- 
	FORMULAIRE
	-------------------------------------------------- */

/* communs */
.step, legend, input[type="text"], input[type="password"], textarea, select, #captcha {
	border:1px solid #dddddd;
	border-radius:3px;
}

 input[type="text"], input[type="password"], textarea, select { color:#333333; }

/* étapes */
.step {
	font-size:1.1428em; /* 16/14 */
	padding:0.625em; /* 10/16 */
	margin:0 0 20px;
	text-align:center;

	font-weight:bold;
}

/* ensemble de champs */
fieldset, #captcha {
	margin-bottom:20px;
	padding:1.4286em; /* 20/14 */
	width:100%;
  background:rgba(0, 0, 0, 0.7);;
  border-radius:14px;
  border:none;
}
	legend {
		display:block;
		padding:0.3125em 0.625em; /* 5/16 10/16 */
		font-size:1.1428em; /* 16/14 */
	}
	
/* bloc, généralités */
.row { 
	display:table-row;
}
	label, .row>div {
		display:table-cell;
		vertical-align:top;
	}
	label {
		cursor:pointer;
		padding:0.2143em 0.3571em 1.0714em; /* 3/14 5/14 10/14 */
	}
	.row>div {
		padding:0 0.3571em 1.0714em; /* 5/14 10/14 */
	}
	.obligatory { color:red; }

/* champs génériques */
input[type="text"], input[type="password"], textarea, select {
	background-color:rgba(255, 255, 255, 0.6);
	padding:0.2857em 0.7286em; /* 4/14 6/14 */
  border:0
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
	border-color:#666666;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 5px rgba(0, 0, 0, 0.25);
	vertical-align:middle;
}
select{
	padding:0.2857em; /* 4/14 */
	max-width:80%;
}
input[type="checkbox"] {
	margin-top:0.5em; /* 7/14 */
}

/* Plusieurs boutons radios ou checkbox */
.group_multi_radio, .multi_radio, .group_multi_checkbox, .multi_checkbox {
	display:block;
}
	.multi_radio input, .multi_radio label, .multi_checkbox input, .multi_checkbox label {
		display:inline-block;
		vertical-align:middle;
		padding:0;
		margin:0;
	}
	
/* submit */
.submit { text-align:center; }
	.submit input { /* bootstrap styles */
		background-color: #F5F5F5;
		background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
		background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
		background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
		background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
		background-repeat: repeat-x;
		border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) #B3B3B3;
		border-image: none;
		border-radius: 4px 4px 4px 4px;
		border-style: solid;
		border-width: 1px;
		box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
		color: #333333;
		display: inline-block;
		padding: 0.3125em 0.75em; /* 4/16 12/16 */
		font-size:1.1428em; /* 16/14 */
		text-align: center;
		text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
		vertical-align: middle;
	}
	.submit input:hover, .submit input:focus {
		background-color:#e6e6e6;
		background-position: 0 -15px;
		-webkit-transition: background-position 0.1s linear;
		-moz-transition: background-position 0.1s linear;
		-o-transition: background-position 0.1s linear;
		transition: background-position 0.1s linear;
	}
	.submit input:focus { outline: 1px dotted #333333; }
	#reset { color:#666666; }

/* calendrier */
.formDatePicker img { vertical-align:middle; }
#overlibcontent table { margin:0; }
	#overlibcontent caption { 
		text-align:center;
		font-size:1.3333em; /* 16/12 */
		color:#666666;
	}
	#overlibcontent td, #overlibcontent th { padding:0; }
	#overlibcontent table a {
		display:block;
		text-align:center;
		padding:3px;
		text-decoration:none;
	}

/* alertes */
.errorForm { 
	color:red;
	font-style:italic;
	font-size:0.8571em; /* 12/14 */
}
.error input[type="text"], .error input[type="password"], .error select, .error textarea { border-color:red; }
.error .group_multi_radio {
	padding:0.3571em; /* 5/14 */
	border:1px solid red;
	border-radius:5px;
}

/* captcha */
#captcha {  }
#captcha .recaptchatable { border:none!important; }
#recaptcha_image, .recaptchatable .recaptcha_image_cell center img, .recaptchatable .recaptcha_image_cell center, .recaptchatable .recaptcha_image_cell, .recaptchatable #recaptcha_response_field {
	height: auto !important;
	width: 100% !important;
}
#recaptcha_area {
	max-width: 350px;
}

/*	-------------------------------------------------- 
	OVERDIV
	-------------------------------------------------- */

#overDiv {
	background-color:#ffffff;
	background-color:rgba(0,0,0,0.3);
	font-size:0.8571em; /* 12/14 */
	box-shadow:0 0 10px rgba(0,0,0,0.5);
	padding:0.8333em; /* 10/12 */
}
	#overlibheader, #overlibcontent, #overlibfooter {
		width:200px;
		margin:0 auto;
		background:#ffffff;
	}
	#overlibheader {
		padding:0.8333em 0.8333em 0 0.8333em; /* 10/12 */ 
		border-radius:5px 5px 0 0;
	}
		.overlibcaption { 
			font-size:1.3333em; /* 16/12 */
			text-transform:uppercase;
			font-weight:bold;
			text-align:center;
		}
		.overlibclose { display:none; }
	#overlibcontent {
		padding:0 0.8333em; /* 10/12 */ 
	}
	#overlibfooter {
		padding:0.8333em; /* 10/12 */  
		border-radius:0 0 5px 5px;
	}
		#overlibfooter a {
			display:block;
			text-decoration:none;
			text-transform:uppercase;
			font-weight:bold;
			text-align:center;
		}