/* CSS Document */
/* Document CSS par JFRanger.com */

@import url(http://fonts.googleapis.com/css?family=Arimo:400,700);
/* basic style */
* {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
}
body {
	background : url(images/bg.jpg) no-repeat -2px center transparent;
	font-family: 'Arimo', sans-serif;
	margin: 0;
	padding: 0;
}
#wrapper {
	width:940px;
	margin: 0 auto;
	position: relative;
}
#zone1 {
	position: relative;
	overflow: hidden;
}
#zone1 div {
	width:50%;
	height: 458px;
	float: left;
	text-align: center;
	background-color: #fff;
}
#zone1 div#zone1a {
	background : url(images/bg-zone1.jpg) no-repeat left top transparent;
}
#zone1 div#zone1b {
	background : url(images/bg-zone1.jpg) no-repeat right top transparent;
}
#zone1 div img {
	margin-top:100px;
}
#zone1 div h1 {
	color: #28386c;
	font-weight: 100;
	font-size: 22px;
	margin-top: 15px;
}
#zone1 div h1 span {
	display: block;
}
#zone1 div p {
	margin-top:201px;
	margin-left:10px;
	color:#fff;
	font-size: 44px;
}
a.estimation {
	display: block;
	left: 284px;
	position: absolute;
	top: 413px;
	z-index:10
}
a.estimation img {
	width: 374px;
	padding: 5px;
 -webkit-transition: all .3s ease-out;
 -moz-transition: all .3s ease-out;
 -o-transition: all .3s ease-out;
 transition: all .3s ease-out;
}
a.estimation img:hover {
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
	-ms-transform: scale(1.1);
 filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=2, M12=-0, M21=0, M22=2);
}
#zone2 {
	overflow: hidden;
}
#zone2 div {
	width:50%;
	height: 243px;
	float: left;
	text-align: center;
	position:relative;
}
#zone2 div#zone2a {
	background : url(images/bg-zone2.jpg) no-repeat 0 0 transparent;
}
#zone2 div#zone2b {
	background : url(images/bg-zone2.jpg) no-repeat top right transparent;
}
#zone2 div h2 {
	width:50%;
	float: left;
	text-align: center;
	font-weight: 100;
	color: #fff;
	font-size:20px;
	margin-top:185px;
}
#zone3 {
	position: relative;
	height: 446px;
}
#zone3 div {
	width:50%;
	height: 446px;
	float: left;
	text-align: left;
}
#zone3 div#zone3a {
	background-color: #2C2D2F;
}
#zone3 div#zone3b {
	background-color: #fff;
	overflow: hidden;
}
#zone3 div h3 {
	color:#fff;
	font-weight: 100;
	font-size: 34px;
	padding-top:30px;
	padding-left:50px;
	padding-right:20px;
}
#zone3 div h3 span {
	display: block;
}
#zone3 div p {
	color:#fff;
	font-size: 14px;
	padding-top:20px;
	padding-left:50px;
	padding-right:20px;
}
#zone3 div ul {
	color:#fff;
	font-size: 14px;
	padding-top:8px;
	padding-left:72px;
}
#zone3 div a {
	color:#fff;
	text-decoration: underline
}
#zone3 div a:hover {
	text-decoration:  none
}
#zone3 img {
	position: absolute;
	right: 25px;
	top:90px;
	z-index: 20;
}
#footer {
	background-color: #203469;
	text-align: center;
	position: relative;
}
#footer p {
	color:#fff;
	font-size: 15px;
	margin: 15px auto 5px auto;
}
#footer img {
	vertical-align: middle;
	margin-right:20px;
}
#footer a {
	color:#fff;
	text-decoration: none
}
#footer a:hover {
	text-decoration:   underline
}
p.copyright {
	margin : 10px auto;
	text-align: center;
	color: #dedede;
	font-size: 12px;
	background-color: #373B3E;
}
p.copyright a {
	color: #dedede;
	text-decoration: none
}
p.copyright a:hover {
	text-decoration:   underline
}
	 	  


 


/* Tablette Landscape */
@media screen and (max-width: 1060px) {
}

/* Tablette Portrait et mobile */
@media screen and (max-width: 768px) {
body #wrapper {
 width:100%;
 margin: 0 auto;
 position: relative;
 background-color: #fff;
}
body #zone1 div img {
 margin-top: 30px;
}
body #zone1 div#zone1a, body #zone1 div#zone1b {
 width:100%;
 height: auto;
 float: none;
 background-image: none;
 background-color: #fff;
}
body #zone1 div h1 {
 font-size: 33px;
 margin-top: 15px;
}
body #zone1 div p {
 color: #000;
 font-size: 45px;
 margin-left: 10px;
 margin-top: 0px;
 margin-bottom: 0px;
 padding-top: 10px;
 padding-bottom: 10px;
}
 body a.estimation {
 display: block;
 left: inherit;
 top: inherit;
 position: inherit;
 padding: 0;
 margin: 0 auto;
}
 body a.estimation img {
 display: block;
 padding: 0;
 margin: 0 auto 20px auto;
 max-width:90%;
 height: auto;
}
 body #zone2 div {
 background-image: none !important;
 width:100%;
 height: auto !important;
 float: none;
 background-size: 100% 100%;
}
body #zone2 div h2 {
 height: auto;
 font-size: 30px;
 width: 100%;
 margin-top: 0;
 float: none;
 color:#000;
 line-height: 150px;
 background: url("images/bg-zone2a.jpg") no-repeat scroll 0 0 transparent;
 background-size: 100% auto;
}
body #zone2 div h2.h2b {
 background-image: url("images/bg-zone2b.jpg");
}
body #zone2 div h2.h2c {
 background-image: url("images/bg-zone2c.jpg");
}
body #zone2 div h2.h2d {
 background-image: url("images/bg-zone2d.jpg");
}
body #zone3 {
 height: 690px;
 text-align: center;
}
body #zone3 div {
 width:100%;
 height:  auto;
 float: none;
 text-align: left;
 position: relative;
 padding-top:20px;
 padding-bottom:20px;
}
body #zone3 div h3 {
 padding-top:0px;
 padding-left: 20px;
 padding-right: 20px;
 text-align: center;
}
body #zone3 div h3 span {
 display:  inline;
}
body #zone3 div p {
 padding-left: 20px;
 padding-right: 20px;
}
body #zone3 div#zone3b {
 display: none;
}
body #zone3 img {
 position:  relative;
 right: auto;
 top: auto;
 margin-top:20px;
 margin-left:auto;
 margin-right:auto;
 max-width:90%;
 height: auto;
}
body #footer img {
 display: block;
 margin-left:auto;
 margin-right:auto;
 margin-bottom:0;
}
body #footer span {
 display : block;
}
body #footer span.hide {
 display : none !important
}
body p.copyright {
 margin : 0;
 padding-top:10px;
 padding-bottom:10px;
}
 body p.copyright span {
 display : block;
 margin-bottom:3px;
}
}