﻿
body {
	width: 100%;
	margin: 0px;
	padding: 0px;
	}
header {
	width: 100%;
	position: fixed;
	z-index: 99999;
	vertical-align: bottom;
	}
section{
	width: 100%;
	display: block;
	position: relative;
	margin: 0px;
	z-index: 99997;
	vertical-align: bottom;
	top: 60px;
	}
footer {
	display: block;
	position: relative;
	width: 100%;
	margin: 0px;
	padding: 0px;
	z-index: 99996;
	vertical-align: bottom;
	top : 60px ;
	}
	/** css infos   **/
	.groupe1 { width: 96%; padding: 2%; text-align: center; position: relative; overflow: hidden; visibility: visible; 
		background-color: #FFFFFF;}
	.infos { width: 49%;  height: auto; margin-left: auto; margin-right: auto;  min-width: 300px;  display: inline-block; 
		position: relative; text-align: left; background-color: #FFFFFF;}
	.infos c0{ width: 100%; padding: 1% 0%; float: left; display: block; color: #920000; font-weight: bold;	font-size: 30px;}
	.infos c00{ width: 100%; padding: 1% 0%; float: left; display: block; color: #920000; font-weight: bold; font-size: 20px;}
	.sous-info{ width: 100%; float: left; display: block; }
	.infos c1{ width: 20%; padding: 0.5% 0% ; min-width: 72px; display: inline-block; float: left; color: #820000; font-size: 16px; font-weight: bold;}
	.infos c01{ width: 2%; padding: 0.51% 0% ; min-width: 4px; display: inline-block; float: left; color: #820000; font-size: 16px; font-weight: bold;}
	.infos c2{ width: 70%; padding: 0.5% 0%; min-width: 100px; display: inline-block; float: left; color: #34495E; font-size: 16px; font-weight: bold;
}
	.map { width: 49%; height: 360px; margin-left: auto; margin-right: auto;	min-width: 300px; display: inline-block; 
		position: relative; text-align: left; background-color: #FFFFFF; }
	.map iframe { width: 100%; height: 360px;}
	.map a:hover {
	width: 100%;
	float: left;
	display: block;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
	text-align: left;
	font-size: small;
	color: #420000;
	}
	.map a {
	width: 100%;
	float: left;
	display: block;
	font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
	text-align: left;
	font-size: small;
	color: #34495E;
	}
.line{
	width: 92%;
	margin: 1% 2%;
	padding: 0% 2%;
	border-bottom: 1px double #920000;
	display: block;
	float: left;
}
	/** css interesé par  **/
.groupe2 { width: 94%; padding: 2% ; text-align: center; position: relative; overflow: hidden; visibility: visible; 
	background-color: #FFFFFF;}
.groupe21 { position: relative; background-color: #FFFFFF;}
.groupe2 t1{
	width: 100%;
	color: #34495E;
	font-family: Chewy,"Ma-Fonte";
	font-weight: bold;
	font-size: x-large;
	font-style: normal;
	display: inline-block;
	position: relative;
	text-align: left;
}
.groupe2 t2{
	width: 100%;
	color: #34495E;
	font-family: Chewy,"Ma-Fonte";
	font-weight: 200;
	font-size: medium;
	font-style: normal;
	padding-top: 5px;
	display: inline-block; 
	position: relative; 
	text-align: left; 
}
.sous-groupe {
	width: 32%;
	min-width: 300px;
	padding-left: 1%;
	padding-top: 10px;
	color: #34495E;
	font-weight: bold;
	font-size: large;
	font-family: Chewy,"Ma-Fonte";
	line-height: 21px;
	font-style: normal;
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	position: relative;
	text-align: left;

}
	/* Demo CSS code */

	form {
	width: 80px;
	margin: 0 auto 5px;
	text-align: left;
	}
	[type="checkbox"]:not(:checked),
	[type="checkbox"]:checked {
		position: absolute;
		left: -9999px;
	}
	[type="checkbox"]:not(:checked) + label,
	[type="checkbox"]:checked + label {
		position: relative;
		padding-left: 65px;
		cursor: pointer;
	}
	[type="checkbox"]:not(:checked) + label:before,
	[type="checkbox"]:checked + label:before,
	[type="checkbox"]:not(:checked) + label:after,
	[type="checkbox"]:checked + label:after {
		content: '';
		position: absolute;
	}
	[type="checkbox"]:not(:checked) + label:before,
	[type="checkbox"]:checked + label:before {
		left:5px; top: 1px;
		width: 60px; height: 20px;
		background: #34495E;
		border-radius: 25px;
		-webkit-transition: background-color .2s;
		-moz-transition: background-color .2s;
		-ms-transition: background-color .2s;
		transition: background-color .2s;
	}
	[type="checkbox"]:not(:checked) + label:after,
	[type="checkbox"]:checked + label:after {
		width: 14px; height: 14px;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
		transition: all .2s;
		border-radius: 50%;
		background: #C81E3D;
		top: 4px; left: 12px;
	}

	/* on checked */
	[type="checkbox"]:checked + label:before {
		background:#34495E;
	
	}
	[type="checkbox"]:checked + label:after {
		background: #39D2B4;
	}

	[type="checkbox"]:checked + label .ui,
	[type="checkbox"]:not(:checked) + label .ui:before,
	[type="checkbox"]:checked + label .ui:after {
		position: absolute;
		left: 10px;
		width: 65px;
		border-radius: 15px;
		font-size: 14px;
		font-weight: bold;
		line-height: 22px;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
		transition: all .2s;
	}
	[type="checkbox"]:not(:checked) + label .ui:before {
		content: "Non";
		left: 30px; top:0px;
		color: #C81E3D;
		font-family: Consolas, "Andale Mono";
		font-weight: bolder;
	}
	[type="checkbox"]:checked + label .ui:after {
		content: "Oui";
		left: 20px;top:0px;
		color: #39D2B4;
		font-family: Consolas, "Andale Mono";
		font-weight: bolder;

	}

	[type="checkbox"]:checked + label .robo,
	[type="checkbox"]:not(:checked) + label .robo,
	[type="checkbox"]:not(:checked) + label .robo:before,
	[type="checkbox"]:checked + label .robo:after {
		position: absolute;
		text-align: left; 
		left: 30px;
		width: 200px;
		border-radius: 15px;
		font-size: 14px;
		font-weight: bold;
		line-height: 20px;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
		transition: all .2s;
	}
	[type="checkbox"]:not(:checked) + label .robo:before {
		content: "Es-tu un robot ? *";
		background-color: #34495E;
		border-radius: 15px;
		left: 6px; top:-3px;
		color: #FFFFFF;
		font-family: Consolas, "Andale Mono";
		font-weight: bolder;
	}
	[type="checkbox"]:checked + label .robo:after {
		content: "Merci .";
		background-color: #34495E;
		border-radius: 15px;
		left: 6px;top:-3px;
		color: #39D2B4;
		font-family: Consolas, "Andale Mono";
		font-weight: bolder;
	}

/** message **/
	.groupe3 { width: 96%; margin: 2% 2%; text-align: center; position: relative; overflow: hidden; visibility: visible; 
	background-color: #FFFFFF;}
	.info-client {
	width: 45%;
	min-width: 250px;
	line-height: 8px;
	font-size: 14px;
	display: inline-block; 
	position: relative; 
	text-align: left; 
	margin-top: 10px;
	margin-left: 1%; 
	margin-right: 1%;
	}
	.message-client {
	width: 45%;
	min-width: 250px;
	line-height: 8px;
	font-size: 14px;
	display: inline-block; 
	position: relative; 
	text-align: right; 
	margin-top: 10px;
	margin-left: 1%; 
	margin-right: 1%;
	}
	.robo_style{
	display: inline-block; 
	float: left;
	margin-top: 15px;
	margin-left: 2%; 
	margin-right: 2%;
	}
	.boton_style{
	display: inline-block;
	float: right;
	margin-top: 10px;
	margin-left: 2%; 
	margin-right: 2%;
	}
	input[type="text"],	textarea {
	background-color: white;
	font-family: inherit;
	border: 1px solid #E0080B;
	-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
	color: #34495E;
	display: block;
	font-size: 1em;
	margin: 0 0 0.3em 0;
	padding: 0.2em;
	height: 2em;
	width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: -webkit-box-shadow 0.45s, border-color 0.45s ease-in-out;
	-moz-transition: -moz-box-shadow 0.45s, border-color 0.45s ease-in-out;
	transition: box-shadow 0.45s, border-color 0.45s ease-in-out; }
    textarea:focus {
    -webkit-box-shadow: 0 0 5px #34495E;
    -moz-box-shadow: 0 0 5px #34495E;
    box-shadow: 0 0 5px #34495E;
    border-color: #34495E; 
	}
	input[type="text"]:focus, textarea:focus {
    background: #fafafa;
    border-color: #34495E;
    outline: none;
	}
	input[type="text"][disabled], textarea[disabled] {
	background-color: #dddddd; 
	}
	textarea {
	max-height: 150px;
	height: 138px;
	min-height: 50px; 
	}
.message-client e1{
	text-align: center;
	color: #34495E;
	font-family: Chewy,"Ma-Fonte";
	font-weight: bold;
	font-size: 12px;
	font-style: normal;	
	}
 input.button,input.button:hover{
	font-family: 'Open Sans', sans-serif;
	font-size: 12px;
	color: #fff;
	padding: 6px;
	font-weight: bold;
	border: none;
	text-transform: uppercase;
	
}
 input.button{background: #E0080B;}
 input.button:hover{background: #273C51; cursor:pointer;}

