/* CSS Document */

/*	
	##################################	MAIN COLORS	
	MARRON_1	:	b07f48	=>	Logo
	MARRON_2	:	856542	=>	H2 "Installateur d’équipements complexes pour le commerce, la production et les services : 3S-France"
*/


/*	########################################################################	GENERALITES
	########################################################################
	########################################################################
*/
@font-face {
    font-family: "CenturyGothic";
    src: url('fonts/GOTHIC.TTF');
}
@font-face {
    font-family: "CenturyGothicBold";
    src: url('fonts/GOTHICB.TTF');
}
@font-face {
    font-family: "CenturyGothicBoldItalic";
    src: url('fonts/GOTHICBI.TTF');
}
@font-face {
    font-family: "CenturyGothicItalic";
    src: url('fonts/GOTHICI.TTF');
}
body {
	font-family: CenturyGothic, Verdana, Geneva, sans-serif;
	font-size: 18px;
	letter-spacing: 1px;
	color: #000000;
	/**/
	margin:0;
	padding:0;
	background-color: #fff;
}
	body table { font-size: 18px; }
a {
	text-decoration: none;
	color: inherit;
	font-weight: 600;
}
	a:hover { color:#cb067d; text-decoration:none; }
	
hr {
	border: 0;
	height: 16px;
	width: 1000px;
	margin: 10px 0 10px 0;
}
	hr.clear {
		background: none;
		border: 0;
		clear: both;
		display: block;
		float: none;
		font-size: 0;
		margin: 0;
		padding: 0;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;
	}

.top_link {
	position: fixed;
	right: 20px;
	bottom: 50px;
	right: 5%;
	bottom: 10%;
	display: none;
	opacity: 0.9;
	z-index: 2000;
	/**/
	width: 68px;
	height: 68px;
	background: none;
	background-image: url(../../img/hautDePage.png);
	background-repeat: no-repeat;
	/*
	
		'position'              :   'fixed',  
		'right'                 :   '20px',  
		'bottom'                :   '50px',  
		'display'               :   'none',    
		'opacity'               :   '0.9',  
		'z-index'               :   '2000' 
		'padding'               :   '20px',  
		'background'            :   '#fff',  
		'-moz-border-radius'    :   '40px',  
		'-webkit-border-radius' :   '40px',  
		'border-radius'         :   '40px',
		*/
}

/*	########################################################################	MESSAGES QSL
	########################################################################
	########################################################################
*/
.QSL_bad, .QSL_veryBad, .QSL_ok {
	text-align: center;
	font-size: 19px;
	font-weight: 700;
	margin: 10px 0 10px 0;
	line-height: 22px;
}
.QSL_bad {
	color: #F63;
}
.QSL_veryBad {
	color: #F00;
}
.QSL_ok {
	color: #3C3;
	text-align: left;
	padding-left: 40px;
}
	


/*	########################################################################	TITRAGES
	########################################################################
	########################################################################
*/
h1 {
	padding:0; margin:0;
}
h2 {
	padding:0; margin:0;
}
h3 {
	padding:0; margin:0;
}
h4 {
	padding:0; margin:0;
}
h5 {
	padding:0; margin:0;
}


/*	########################################################################	STRUCTURE
	########################################################################
	########################################################################
*/
.container {
	margin: 0 auto 0 auto;
}
.container_main {
	margin: 10px auto 60px auto;
}



.container_main:after {
			content: '';
			display: block;
			clear: both;
		}
	.container section {
		display: inline-block;
		max-width: 100%;
		height: auto;
		margin: 10px auto 0 auto;
	}
main {
	display: block;
	margin: 70px 0 0 0;
	padding-bottom: 40px;
	/**/
	background-image: url(../../img/body_bg.jpg);
	background-position: center bottom;
	background-repeat: no-repeat;	
	-webkit-background-size: 100%; /* pour anciens Chrome et Safari */
	background-size: 100%; /* version standardisée */
}
	body.home main { margin:0; padding:0; }
figure {
	margin:0; padding:0;
}


/*	########################################################################	HEADER
	########################################################################
	########################################################################
*/

header {
	width: 100%;
	height: 70px;
	overflow: visible;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	margin:0; padding:0;
	/**/
	background: url(../../img/bg_header.jpg) no-repeat center center; 
	-webkit-background-size: cover; /* pour anciens Chrome et Safari */
	background-size: cover; /* version standardisée */
		/**/
	-moz-box-shadow: 0px 3px 8px 0px #656565;
	-webkit-box-shadow: 0px 3px 8px 0px #656565;
	-o-box-shadow: 0px 3px 8px 0px #656565;
	box-shadow: 0px 3px 8px 0px #656565;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=180, Strength=8);
	/**/
}
	header div#title {
		float: left;
		width: 60%;
		padding: 5px 0 0 0;
		/**/
		text-align: left;
		background: none;
		font-family: 'Sofia', cursive;
		font-size: 42px;
		font-weight: bold;
		color: #cb067d;
	}
	header div#blasons {
		float: right;
		padding: 10px 0 0 0;
		text-align: right;
	}
		header div#blasons img { margin-left: 7px; }
	header a {
		text-decoration: none;
		color: inherit;
		border: 0;
	}
		header a:hover { color:inherit; text-decoration:none; }
	
		header:after {
			content: '';
			display: block;
			clear: both;
		}


/*	########################################################################	BANDEAU SUP
	########################################################################
	########################################################################
*/
div#bandeau-sup {
	width: 1800px;
	max-height: 130px;
	margin: 0 auto 0 auto;
}
	div#bandeau-sup img {
		width: 1800px;
		height: auto;
		max-height: 130px;
	}


/*	########################################################################	FOOTER
	########################################################################
	########################################################################
*/
footer {
	display: block;
	width: 100%;
	font-size: 13px;
	/**/
	width: 100%;
	overflow: hidden;
	/**/
	background: url(../../img/bg_footer.jpg) no-repeat center center; 
	-webkit-background-size: cover; /* pour anciens Chrome et Safari */
	background-size: cover; /* version standardisée */
	/**/
	-moz-box-shadow: 0px 0px 5px 0px #656565;
	-webkit-box-shadow: 0px 0px 5px 0px #656565;
	-o-box-shadow: 0px 0px 5px 0px #656565;
	box-shadow: 0px 0px 5px 0px #656565;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=5);
}

	/*	####### Le MENU
	*/
	footer div#menu-footer {
		display: none;
		background: none;
		padding: 5px 0 5px 0;
	}
	
	/*	####### Le CENTRAL
	*/
	footer div#central {
		background: none;
		padding: 20px 0 20px 0;
	}
		footer div#central div#adresse {
			text-align: right;
			padding-right: 140px;
			font-size: 15px;
			color: #000;
			background-image: url(../../img/blasons.png);
			background-position: right 5px;
			background-repeat: no-repeat;
		}
			footer div#central div#adresse span.title {
				font-family: 'Sofia', cursive;
				font-size: 24px;
				font-weight: bold;
				color: #cb067d;
			}
/**/
footer div#central:after {
	content:'';
	display:block;
	clear: both;
}
		
	/*	####### Le COPYRIGHTS
	*/
	footer div#copyrights {
		background-color: #e5e5e5;
		padding: 10px 0 10px 0;
		color: #000;
		text-align: center;
		font-size: 11px;
		opacity: 0.6;
	}
	footer a {
		text-decoration: none;
		color: inherit;
		font-weight: normal;
	}
		footer a:hover { color:inherit; text-decoration:underline; }
	
footer.smaller {
	padding: 0;
	font-size: 9px;
	display: none;
}


/*	########################################################################	CONTENU	-	HOME
	########################################################################
	########################################################################
*/
body.home main div.container_main {
}
	
		body.home main div.container_main div#colonne-centrale {
			float: left;
		/*	width: 605px;	/**/
			width: 65%;
			margin:0; padding:0;
		}
		body.home main div.container_main div#aside {
			float: right;
		/*	float: left;
			width: 290px;
			margin: 0 0 0 85px;	/**/
			width: 30%;
			margin:0; padding:0;
		}
	
body.home div#bloc_edito,
body.home div#bloc_edito_news,
body.home iframe#bloc_maps,
body.home #widget-meteo,
body.home div#bloc_syndicNews,
body.home div#bloc_dictonDuJour {
	margin: 0 0 40px 0;
}
/*	################################################	BLOC EDITO	(annulé...)
*/
body.home div#bloc_edito {
}	
	body.home div#bloc_edito h1 {
		font-family: 'Sofia', cursive;
		font-size: 3em;
		color: #000;
		margin:0; padding:0;
	}
	body.home div#bloc_edito h2 {
		font-family: 'Sofia', cursive;
		font-size: 3em;
		opacity: 0.6;
		color: #bab2af;
		margin:0; padding:0;
	}
	body.home div#bloc_edito .texte {
		font-size: 15px;
		text-align: justify;
	}
		body.home div#bloc_edito img {
			max-width: 100%;
			height: auto;
		}
/*	################################################	BLOC EDITO
*/
body.home div#bloc_edito_news {
}
	body.home div#bloc_edito_news h1 {
		font-family: 'Sofia', cursive;
		font-size: 2.6em;
		opacity: 0.6;
		color: #000;
		margin: 0;
		padding-top: 4px;
	}
	body.home div#bloc_edito_news .news_item {
		margin: 15px 0 15px 0;
	}
	
	
	body.home div#bloc_edito_news .news_item.with-img {
		background-position: left top;
		background-repeat: no-repeat;
		background-size: 190px 106px;
		padding-left: 210px;
		min-height: 106px;
	}
	
	
		body.home div#bloc_edito_news .news_item .type {
			font-size: 15px;
			font-weight: bold;
			text-transform: uppercase;
			color: #c9c9c9;
			font-style: italic;
		}
		body.home div#bloc_edito_news .news_item .titre {
			font-size: 15px;
			font-weight: bold;
		}
				body.home div#bloc_edito_news .news_item .titre label {
					font-family: CenturyGothicItalic;
					color: #999;
					text-transform: uppercase;
				}
					
		body.home div#bloc_edito_news .news_item .image {
			margin-top: 5px;
			width: 100%;
			height: 50px;
			background-position: center center;
			background-repeat: no-repeat;
			-webkit-background-size: cover; /* pour anciens Chrome et Safari */
			background-size: cover; /* version standardisée */
		}
		body.home div#bloc_edito_news .news_item .accroche {
			margin-top: 5px;
			font-size: 11px;
			font-weight: normal;
		}
	
	
/*	################################################	BLOC MAPS
*/
body.home iframe#bloc_maps {
/*	float: left;
	width: 403px;	/**/
	width: 100%;
	height: 290px;
	margin:0; padding:0;
	border: 1px solid #D6D6D6;
}
	
	
/*	################################################	BLOC METEO
*/
body.home #widget-meteo {
	float: left;
	margin-left: 30px !important;
	width: 170px;	/*	imposé par tameteo.fr...	*/
	height: 290px;
}
	
	
/*	################################################	BLOC NEWS SYNDICATION
*/
body.home div#bloc_syndicNews {
}
	body.home div#bloc_syndicNews h1 {
		font-family: 'Sofia', cursive;
		font-size: 2.6em;
		opacity: 0.6;
		color: #000;
		margin: 0;
		padding-top: 4px;
	}
	body.home div#bloc_syndicNews .news_item {
		margin: 10px 0 10px 0;
	}
		body.home div#bloc_syndicNews .news_item .titre {
			font-size: 15px;
			font-weight: bold;
		}
		body.home div#bloc_syndicNews .news_item .image {
			margin-top: 5px;
			width: 100%;
			height: 50px;
			background-position: center center;
			background-repeat: no-repeat;
			-webkit-background-size: cover; /* pour anciens Chrome et Safari */
			background-size: cover; /* version standardisée */
		}
		body.home div#bloc_syndicNews .news_item .accroche {
			margin-top: 5px;
			font-size: 11px;
			font-weight: normal;
		}
	
	
/*	################################################	BLOC DICTON DU JOUR
*/
body.home div#bloc_dictonDuJour {
	padding: 10px;
	background-color: #f7f7f8;
	border: 1px solid #D6D6D6;
		text-align: center;
}
	body.home div#bloc_dictonDuJour .titre {
		font-family: 'Sofia', cursive;
		font-size: 26px;
		line-height: 20px;
		font-weight: bold;
		color: #cb067d;
		margin:0; padding:0;
	}
	body.home div#bloc_dictonDuJour .texte {
		margin: 25px 0 16px 0;
		font-family: 'Sofia', cursive;
		font-size: 17px;
		line-height: 20px;
	}


/*	########################################################################	CONTENU	-	PAGES
	########################################################################
	########################################################################
*/
body.page {}

	body.page main div.container {
		background: none;
	}

	body.page div.container section {
		margin-top: 170px;
		color: #000;
		display: block;
	}
	
	body.page div#title {
		background-image: url(../../img/shadow_DOWN_980.png);
		background-size: 100% 12px;
		background-position: left bottom;
		background-repeat: no-repeat;
		padding-bottom: 22px;
	}
		body.page header div#title { background:none; }

		body.page div#title h1 {
			font-family: 'Sofia', cursive;
			font-size: 3em;
			line-height: 1em;
			color: #000;
			margin:0; padding:0;
		}
	
		body.page div#title h2 {
			font-family: 'Sofia', cursive;
			font-size: 2.8em;
			line-height: 1.6em;
			color: #ccc;
			margin:0; padding:0 0 0 40px;
			opacity: 0.6;
		}

	body.page section article {
		display: block;
		margin: 40px 0 80px 0;
	}
							body.page section article:after {
								content:'';
								display:block;
								clear: both;
							}
	
	body.page section article table.datas {
		border-collapse:collapse ;
		border-bottom: 1px solid #f7f7f8;
	}
	body.page section article table.datas td {
		padding: 5px;
		vertical-align: top;
		border-top: 1px solid #f7f7f8;
	}
	body.page section article table.datas tr:hover td { background-color:#f7f7f8; }

		body.page section article h3 {
			font-family: 'Sofia', cursive;
			font-size: 2.1em;
			line-height: 1em;
			color: #000;
			margin:0; padding:0;
			border-left: 7px solid #ccc;
			padding-left: 14px;
		}

	body.page section.one_col,
	body.page section.two_col {
		display: block;
		background: none;
		width: 100%;
	}
		body.page section article div.content {
			overflow: visible;
			text-align: justify;
			margin: 20px 35px 20px 35px;
		}
	/*	################################	Une colonne
	*/	
	body.page section.one_col {
		padding-top: 1px;	/*	=> Pas normal, ne devrait pas être nécessaire...	*/
	}
		body.page section.one_col article div.content {
		}
	/*	################################	DEUX colonnes
	*/	
	body.page section.two_col {
		width: 620px;	/*	980 - 360	*/
		float: left;
	}
	body.page section.two_col article {
	}
		body.page section.two_col article div.content {
		}
		body.page section.two_col article.hotspot:hover {
			text-shadow: 1px 1px 2px #000;
		}
		
		body.page aside {
			/*	width: 360px;	980 - 360 */
			float: right;
			display: inline-block;
		}
			body.page aside img {
				position: fixed;
		/**/
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-ms-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
			}
			body.page aside figcaption {
				display: inline-block;
				position: fixed;
				padding: 10px;
				background-color:  rgba(255, 255, 255, 0.5);
				overflow: auto;
		/**/
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-ms-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
			}


/*	########################################################################	CONTENU	-	PAGES	-	Particularités pour les NEWS
	########################################################################
	########################################################################
*/
body.page section.news {}
	body.page section.news article {
	}
	
	
	
																			body.page section.news article.with-img {
																				background-position: left top;
																				background-repeat: no-repeat;
																				background-size: 400px 266px;
																				padding-left: 440px
																			}
	
	
	
	body.page section.news article h3 {
		margin-bottom: 5px;
	}
																			body.page section.news article h3.type {
																				border:0; border:none;
																				font-family: 'CenturyGothic', Verdana, Geneva, sans-serif;
																				text-transform: uppercase;
																				font-size: 1.6em;
																				font-weight: bold;
																				font-style: italic;
																				color: #ccc;
																				padding-left: 22px;
																			}
				body.page section.news article h3 label {
					font-family: CenturyGothicItalic;
					color: #ccc;
					text-transform: uppercase;
				}
					body.page section.news article h3 label:after {
						content:'';
						display:block;
						clear: both;
					}
					
	body.page section.news article .datePubli {
		color: #666;
		text-align: left;
		font-style: italic;
	}
	body.page section.news article .auteur {
		display: none;
	}
	body.page section.news article .image {
		margin: 15px 0 15px 0;
		width: 100%;
		height: 150px;
		background-position: center center;
		background-repeat: no-repeat;
		-webkit-background-size: cover; /* pour anciens Chrome et Safari */
		background-size: cover; /* version standardisée */
	}
		
	body.page section.news article .accroche {
		margin: 10px 0 20px 0;
		font-size: 1.4em;
	}
																			body.page section.news article .accroche.with-img {
																				background-position: left top;
																				background-repeat: no-repeat;
																				/*	background-size: 400px 266px;
																					padding-left: 440px;
																					min-height: 266px;
																					/**/
																					background-size: 300px 200px;
																					padding-left: 330px;
																					min-height: 200px;
																					/**/
																			}
		
	body.page .walou {
		margin: 40px 0 40px 0;
		text-align: center;
		font-size: 17px;
	}

/*	########################################################################	CONTENU	-	PAGES	-	NEWS : Voir les archives
	########################################################################
	########################################################################
*/	
			button#btn_voir_les_archives, button#btn_masquer_les_archives {
				background-color: #0095da;
				border: 1px solid #0095da;
				padding: 3px 10px 2px 10px;
				/**/
				text-align: center;
				text-transform: uppercase;
				color: #fff;
				font-family: CenturyGothicBold, Verdana, Geneva, sans-serif;
				font-size: 14px;
					cursor: pointer;
			}
				button#btn_voir_les_archives:hover, button#btn_masquer_les_archives:hover {
					-moz-box-shadow: 1px 1px 5px 0px #c0c0c0;
					-webkit-box-shadow: 1px 1px 5px 0px #c0c0c0;
					-o-box-shadow: 1px 1px 5px 0px #c0c0c0;
					box-shadow: 1px 1px 5px 0px #c0c0c0;
					filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=5);
				}
				
	div#news_archives {
		display: none;
	/*	background-image: url(../../img/shadow_DOWN_980.png);
		background-position: center top;
		background-repeat: no-repeat;	/**/
	}
		div#news_archives h2 {
			font-family: 'Sofia', cursive;
			font-size: 3em;
			text-transform: uppercase;
			color: #000;
			/**/
			width: 100%;
			margin: 0 0 20px 0;
				background-image: url(../../img/shadow_980.png);
				background-size: 100% 12px;
				background-position: left bottom;
				background-repeat: no-repeat;
				padding-bottom: 10px;
		}
			div#news_archives h2 { font-weight:bold; }
			div#news_archives h2 button#btn_masquer_les_archives { float:right; margin-top:10px; }
			
			
	div#news_archives h3.annee {
		font-size: 5em;
		text-transform: uppercase;
		color: #dcdbda;
	}
	div#news_archives section.news { padding: 0 40px; }

/*	########################################################################	CONTENU	-	PAGES	-	MAPS
	########################################################################
	########################################################################
*/
body.page iframe#maps {
	width: 100%;
	margin: 0 auto 0 auto;
	height: 400px;
}


/*	########################################################################	CONTENU	-	PAGES	-	CONTACT
	########################################################################
	########################################################################
*/
body.page form#formContact span.symbol_required {
	font-family: CenturyGothicBold, Verdana, Geneva, sans-serif;
	color: #F33;
	text-shadow: 1px 1px 2px #000;
}

	body.page form#formContact div.ligne {
		margin: 0 0 20px 0;
		float: none;
	}
		body.page form#formContact div.ligne:after {
			content:'';
			display:block;
			clear: both;
		}

		body.page form#formContact div.label,
		body.page form#formContact div.datas {
		/*	width: 45%;
			float: left;
			font-size: 15px;
			/**/
		}
		
		body.page form#formContact div.label {
			text-align: left;
			padding-bottom: 3px;
		}
		
		body.page form#formContact div.datas {
			text-align: left;
		}
		
		body.page form#formContact input,
		body.page form#formContact textarea {
			width: 99%;
			background-color: #fff;
			border: 2px solid #0095da;
			padding: 4px;
			/**/
			font-family: CenturyGothicBold, Verdana, Geneva, sans-serif;
			font-size: 13px;
			/**/
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			/**/
			-moz-box-shadow: inset 1px 1px 5px 0px #c0c0c0;
			-webkit-box-shadow: inset 1px 1px 5px 0px #c0c0c0;
			-o-box-shadow: inset 1px 1px 5px 0px #c0c0c0;
			box-shadow: inset 1px 1px 5px 0px #c0c0c0;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=5);
		}
			body.page form#formContact textarea { height: 220px; }
			
			body.page form#formContact .mention_required {
				padding-bottom: 10px;
			}
			
			body.page form#formContact button {
				background-color: #0095da;
				border: 1px solid #0095da;
				padding: 8px 20px 7px 20px;
				padding: 10px 20px 10px 30px;
				/**/
				text-align: center;
				text-transform: uppercase;
				color: #fff;
				font-family: CenturyGothicBold, Verdana, Geneva, sans-serif;
				font-size: 14px;
					cursor: pointer;
			}
				body.page form#formContact button:hover {
					-moz-box-shadow: 1px 1px 5px 0px #c0c0c0;
					-webkit-box-shadow: 1px 1px 5px 0px #c0c0c0;
					-o-box-shadow: 1px 1px 5px 0px #c0c0c0;
					box-shadow: 1px 1px 5px 0px #c0c0c0;
					filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=5);
				}
				
			body.page form#formContact input:hover,
		body.page form#formContact textarea:hover {
			-moz-box-shadow: 1px 1px 5px 0px #c0c0c0;
			-webkit-box-shadow: 1px 1px 5px 0px #c0c0c0;
			-o-box-shadow: 1px 1px 5px 0px #c0c0c0;
			box-shadow: 1px 1px 5px 0px #c0c0c0;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=5);
		}
		
			body.page form#formContact input:focus,
		body.page form#formContact textarea:focus {
			/* outside	*/			
			-moz-box-shadow: 1px 1px 5px 0px #c0c0c0;
			-webkit-box-shadow: 1px 1px 5px 0px #c0c0c0;
			-o-box-shadow: 1px 1px 5px 0px #c0c0c0;
			box-shadow: 1px 1px 5px 0px #c0c0c0;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=5);
			/*	inside	*/
			-moz-box-shadow: inset 0px 0px 8px 0px #656565;
			-webkit-box-shadow: inset 0px 0px 8px 0px #656565;
			-o-box-shadow: inset 0px 0px 8px 0px #656565;
			box-shadow: inset 0px 0px 8px 0px #656565;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=8);
			
			-moz-box-shadow: 3px 3px 8px 0px #656565;
-webkit-box-shadow: 3px 3px 8px 0px #656565;
-o-box-shadow: 3px 3px 8px 0px #656565;
box-shadow: 3px 3px 8px 0px #656565;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=135, Strength=8);
		}


/*	########################################################################	CONTENU	-	PAGES	-	PARTICULARITES
	########################################################################	La page n'a pas de contenu mais des enfants
	########################################################################	on affiche les liens vers ses enfants
*/
body.page section article .noParag_lienAuto {
	padding-left: 60px;
}
	body.page section article .noParag_lienAuto #triangle {
		float: left;
		width: 0;
		height: 0;
		border-top: 18px solid transparent;
		border-bottom: 18px solid transparent;
		border-left: 25px solid blue;
		margin-right: 10px;
	}
	body.page section article .noParag_lienAuto h3 {
		font-family: CenturyGothic, Arial, Helvetica, sans-serif;
		font-size: 26px;
		border:0; border:none;
		margin: 30px 0 0 0;
		padding-top: 3px;
	}
				

/*	########################################################################	CARTE de VISITE
	########################################################################	(en page CONTACT
	########################################################################
*/
div#carte-de-visite {
	width: 280px;
	margin: 0 auto 0 auto;
	padding: 20px;
	background-color: #FFFFFF;
	text-align: center;
	color: #000;
	font-size: 13px;
	/**/
	-moz-box-shadow: 1px 1px 8px 0px #343434;
-webkit-box-shadow: 1px 1px 8px 0px #343434;
-o-box-shadow: 1px 1px 8px 0px #343434;
box-shadow: 1px 1px 8px 0px #343434;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#343434, Direction=134, Strength=8);
}
	div#carte-de-visite .logo {
	}
		div#carte-de-visite .logo img {
		}
				
		div#carte-de-visite .e-mail,
		div#carte-de-visite .tel-fax,
		div#carte-de-visite .adresse {
			border-bottom: 1px solid #ccc;
			padding-bottom: 7px;
		}
		
	div#carte-de-visite .e-mail {
		margin-top: 80px;
	}
	div#carte-de-visite .tel-fax {
	}
	div#carte-de-visite .adresse {
	}
	div#carte-de-visite .url {
		padding-top: 5px;
	}
	div#carte-de-visite .QRcode {
		text-align: center;
		font-size: 9px;
		font-style: italic;
		color: #999;
	}
		div#carte-de-visite .QRcode img {
			width: 150px;
			height: auto;
			margin-top: 10px;
		}
	
		div#carte-de-visite a {
			color: inherit;
			text-decoration: none;
		}


/*	########################################################################	CONTENU	-	PAGES	-	REFERENCES
	########################################################################
	########################################################################
*/
body.page div#references {
	padding: 0 0 50px 0;
}
	body.page div#references div#map {
		width: 80%;
		margin: 0 auto 0 auto;
		height: 600px;
		color: #000;
		background-color: #f2ddc5;
	}



/*	########################################################################	COLORS
	########################################################################
	########################################################################
*/
.cian { color:#03aff0; }
.magenta { color:#ec048d; }
.jaune { color:#ffe002; }
.vert { color:#99cc00; }










/*	################################################################################################################################################	CK_STYLES
	################################################################################################################################################	ATTENTION : Toutes modification ici
	################################################################################################################################################	est à reporter dans 'library/css/ckstyles.css'
*/
/*	###############################################		une_colonne_en_retrait
*/
main { font-size:13px; }
main table { font-size:13px; }

main .une_colonne_en_retrait {
	width: 500px;
	margin-left: auto;
	margin-right: auto;
}

/*	###############################################		deux_colonnes
	width total : 922px
	gouttière 22px
*/
main .deux_colonnes {
}
	.deux_colonnes .colonne {
		width: 47%;
		float: left;
	}
	.deux_colonnes .goutiere {
		width: 6%;
		float: left;
	}

/*	###############################################		trois_colonnes
*/
.trois_colonnes {
}
	.trois_colonnes .colonne {
		width: 29%;
		float: left;
		text-align: justify;
	}
	.trois_colonnes .goutiere {
		width: 6%;
		float: left;
	}

/*	###############################################		deux_colonnes, image à gauche
	width total : 922px
	gouttière 22px
*/
table.deux_colonnes_image_a_gauche {
	width: 100%;
	border-collapse:collapse;
}
	table.deux_colonnes_image_a_gauche td {
		text-align: justify;
		vertical-align: top;
	}
		table.deux_colonnes_image_a_gauche td.col_1 {	/*	image	*/
			padding-right: 20px;
		}
		table.deux_colonnes_image_a_gauche td.col_2 {	/*	texte	*/
			width: 100%;
		}

/*	###############################################		deux_colonnes, image à droite
	width total : 922px
	gouttière 22px
*/
table.deux_colonnes_image_a_droite {
	width: 100%;
	border-collapse:collapse;
}
	table.deux_colonnes_image_a_droite td {
		text-align: justify;
		vertical-align: top;
	}
		table.deux_colonnes_image_a_droite td.col_1 {	/*	texte	*/
			width: 100%;
		}
		table.deux_colonnes_image_a_droite td.col_2 {	/*	image	*/
			padding-left: 20px;
		}
		
/*	###############################################		Bloc exergue VIDE
*/
.blocExergue_VIDE {
	border: 2px solid #0095da;
	width: 80%;
	margin: 0 auto 0 auto;
	padding: 20px;
	/**/
	text-align: center;
	font-size: 1.3em;
}

/*	###############################################		Bloc exergue PLEIN
*/
.blocExergue_PLEIN {
	background-color: #0095da;
	width: 80%;
	margin: 0 auto 0 auto;
	padding: 20px;
	/**/
	text-align: center;
	font-size: 1.3em;
	font-weight: bold;
	color: #fff;
}



/*	###############################################		Listes UL
*/
main article ul {
	list-style: none;
	margin: 0;
}
	main article ul li {
		background-image: url(http://www.mairie-trebaslesbains.fr/medias/Image/icones/16x16/accept.png);
		background-position: left top;
		background-repeat: no-repeat;
		padding: 0 0 0 24px;
		margin: 7px 0 0 0;
	}



/*	###############################################		presentation-sous-rubrique
*/
div.presentation-sous-rubrique {
}
	div.presentation-sous-rubrique a {
		font-weight: normal;
	}
		div.presentation-sous-rubrique a:hover {
			color: #0095da;
			text-decoration: none;
		}
	div.presentation-sous-rubrique img {
		border:0; border:none;
	}
	div.presentation-sous-rubrique h2 {
		text-transform: uppercase;
		font-size: 17px;
		color: #000;
		/**/
		width: 100%;
		margin-left: -35px;
			background-image: url(../../img/shadow_980.png);
			background-size: 100% 12px;
			background-position: left bottom;
			background-repeat: no-repeat;
			padding-bottom: 20px;
	}
		div.presentation-sous-rubrique h2 a { font-weight:bold; }
	div.presentation-sous-rubrique div.button a {
		color: #0095da;
		text-transform: uppercase;
		font-size: 13px;
		font-weight: bold;
		margin-left: 40px;
	}
		div.presentation-sous-rubrique div.button a:hover { text-decoration:underline; }



/*	###############################################		intertitre
*/
div.intertitre {
	padding: 3px;
	text-align: center;
	/*	font-family: CenturyGothicBold, Verdana, Geneva, sans-serif;	/**/
	font-size: 36px;
	color: #fff;
	background-color: #0095da;
}






















/*	################################################################################################################################################	MEDIAS QUERYS
	################################################################################################################################################	
	################################################################################################################################################	
*/
@media (max-width: 768px) {
	.container, .container_main { width: 750px; }
	header div#title { font-size: 26px; }
}
@media (min-width: 768px) {
	.container, .container_main { width: 750px; }
	header div#title { font-size: 32px; }
}
@media (min-width: 992px) {
	.container, .container_main { width: 970px; }
	header div#title { font-size: 38px; }
}
@media (min-width: 1200px) {
	.container, .container_main { width: 1170px; }
	header div#title { font-size: 42px; }
}
/**/