@charset "UTF-8";
/* CSS Document */


html, body {
	height: 100%;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	background: url(../img/bg.png) center repeat-y #e4e5e7;
}
h1, h2, h3, h4, h4, h5, h6{
	margin: 0;
	padding: 0;
	font-size: inherit;
	font-weight: normal;
}
form{
	margin: 0;
	padding: 0;
}
img{
	border: none;
}

/* TOOLS
-------------------------------------------------------------- */
.left{float: left;}
.right{float: right;}
.clear{clear: both;}

.txt10{font-size: 10px;}
.txt11{font-size: 11px;}
.txt12{font-size: 12px;}
.txt13{font-size: 13px;}
.txt14{font-size: 14px;}
.txt15{font-size: 15px;}
.txt16{font-size: 16px;}
.txt17{font-size: 17px;}
.txt18{font-size: 18px;}
.txt20{font-size: 20px;}
.txt22{font-size: 22px;}

.justify{text-align: justify;}
.center{text-align: center;}
.upper{text-transform: uppercase;}

.pl20{padding-left: 20px;}




/* HEADER
-------------------------------------------------------------- */
div#header{
	font-family: 'Roboto', sans-serif;
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	background: url(../img/bg-header.png) center top repeat-x #fff;
	padding-top: 8px;
}
h1#logo{
	padding: 0;
	margin: 0;
	float: left;
	width: 195px;
}
div#lang{
	width: 800px;
	float: right;
	text-align: right;
	height: 70px;
	padding-top: 10px;
}
ul#menu{
	list-style: none;
	padding: 0;
	margin: 0;
	width: 800px;
	float: right;
	text-align: right;
	font-size: 0;
}
ul#menu li{
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-block;
	font-size: 14px;
	text-transform: uppercase;
	color: #333333;
}
ul#menu li a{
	display: inline-block;
	margin-left: 0px;
	font-weight: 400;
	color: #333333;
	text-decoration: none;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 9px;
	padding-right: 9px;
	-webkit-transition: color .3s ease-in-out;
    -moz-transition: color .3s ease-in-out;
    -o-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
}
ul#menu li.last a{
	padding-right: 0;
	color: #0f588e;
}

ul#menu li a:hover,
ul#menu li a.on{
	color: #0f588e;
	text-decoration: none;
}
ul#menu li a.on{
	font-weight: 500;
}


/* FOOTER
-------------------------------------------------------------- */
div#footer-wrap{
	height: 86px;
	margin-top: -86px;
	width: 100%;
	position: relative;
}
div#footer-shadow{
	width: 100%;
	height: 11px;
	background: url(../img/footer-shadow.png) no-repeat center bottom;
}
div#footer{
	width: 100%;
	background: #f7f7f7;
	font-family: 'Roboto', sans-serif;
}
div#footer-content{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 15px;
	height: 60px;
	font-size: 12px;
	color: #3a3a3a;
	font-weight: 400;
}
div#footer-content a{
	color: #3a3a3a;
	text-decoration: none;
	-webkit-transition: color .3s ease-in-out;
    -moz-transition: color .3s ease-in-out;
    -o-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
}
div#footer-content a:hover,
div#footer-content a.on{
	color: #0f588e;
	text-decoration: none;
}


/* TEMPLATE
-------------------------------------------------------------- */
#wrap {
	min-height: 100%;
	position: relative;
}
div#content{
	width: 998px;
	margin-left: auto;
	margin-right: auto;
}
div#header-page{
	width: 100%;
	height: 200px; 
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
div.bg01{
	background : url(../img/header01.jpg) no-repeat top center;
}
div.bg02{
	background : url(../img/header02.jpg) no-repeat top center;
}
div.bg-france{
	background : url(../img/header-france.jpg) no-repeat top center;
}
div.bg-europe{
	background : url(../img/header-europe.jpg) no-repeat top center;
}
div.bg-monde{
	background : url(../img/header-monde.jpg) no-repeat top center;
}
.txt{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 400;
	color: #3e454c;
}
.bleu{
	color: #08538b;
}
h1.titre-page{
	color: #08538b;
	font-weight: 300;
	font-size: 38px;
	padding-top: 15px;
	padding-bottom: 15px;
}
h3.titre-cgv{
	font-weight: 500;
	font-size: 18px;
	color: #2b2a2a;
	padding-bottom: 20px;

}
















/* HOME
-------------------------------------------------------------- */
div#bandeau{
	position: relative;
}
div#area{
	position: relative;
	margin-top: -60px;
}
div.item-area{
	width: 303px;
	height: 422px;
	float: left;
	font-family: 'Roboto', sans-serif;
	background: #fff;
	font-size: 28px;
	font-weight: 300;
	text-transform: uppercase;
	text-align: center;
}
div#area div#item-france{
	margin-left: 25px;
}
div#area div#item-europe{
	margin-left: 20px;
	margin-right: 20px;
}
div#area div#item-monde{
	margin-right: 0px;
}
div.item-area a{
	display: block;
	height: 422px;
	color: #0e578e;
	text-decoration: none;
	cursor: pointer;
}
div.item-area a span.miniature{
	display: block;
}
div.item-area a span.fleche{
    position: relative;
	display: block;
	width: 55px;
	height: 48px;
	margin-top: -47px;
	margin-left: auto; 
	margin-right: auto;
	background: url(../img/fleche-off.png) no-repeat center bottom;
	-webkit-transition: background-image 0.2s ease-in-out;
	-moz-transition: background-image 0.2s ease-in-out;
	-ms-transition: background-image 0.2s ease-in-out;
	-o-transition: background-image 0.2s ease-in-out;
	transition: background-image 0.2s ease-in-out;
}
div.item-area a:hover span.fleche,
div.item-area a.on span.fleche,
div.item-area a span.flecheOn{
	background: url(../img/fleche-on.png) no-repeat center bottom;
}
span.area-txt{
	display: block;
	position: absolute;
	width: 303px;
	padding-top: 60px;
	height: 150px;
	background: url(../img/bg-thumb.png) no-repeat bottom center;
	border-top: none;
	margin-top: -210px;	
	line-height: 30px;
}
div.item-area div.shadow{
	height: 15px;
	background: url(../img/box-shadow.png) no-repeat center top;
}
div.accordion-infos-home{
	margin-top: 0px;
	padding-bottom: 20px;
	display: none;
	background: #fff;
}
div.accordion-infos-content-home{
	width: 990px;
	margin-left: auto;
	margin-right: auto;
	line-height: 22px;
	background: #fff;
}
div#slide-item-monde div.accordion-infos-content-home{
	line-height: 17px;
}

/* FRANCE
-------------------------------------------------------------- */
div.thumb-france{
	height: 395px;
}
div.thumb-france a{
	height: 395px;
	overflow: hidden;
	position: relative;
}
div.thumb-france span.area-txt{
	display: block;
	position: absolute;
	width: 303px;
	max-height: 303px;
	padding-top: 30px;
	height: 180px;
	background: url(../img/bg-thumb.png) no-repeat bottom center;
	border-top: none;
	margin-top: -210px;	
	
	/*-webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    transition: all .3s ease-out;*/
	
}
div.thumb-france:hover span.area-txt{
	/*margin-top: 0;*/
	

}
div.thumb-france span.displayNone{
	/*display: none;*/
}
div.thumb-france span.area-txt span.infos{
	display: block;
	text-transform: none;
	font-size: 15px;
	padding-top: 5px;
	line-height: 20px;
	color: #717171;
}
.item-middle{
	margin-left: 20px;
	margin-right: 20px;
}
.item-left{
	margin-left: 25px;
}
div#havre.thumb-france span.area-txt02,
div.thumb-france span.area-txt02{
	padding-top: 10px;
	height: 200px;
}
h2.titre-fr{
	color: #08538b;
	font-weight: 300;
	font-size: 35px;
	text-transform: uppercase;
	padding-top: 10px;
	padding-bottom: 25px;
}
div.accordion-infos{
	margin-top: 0px;
	padding-bottom: 20px;
	display: none;
}
div.accordion-infos-content{
	width: 910px;
	margin-left: auto;
	margin-right: auto;
	line-height: 22px;
}
div.accordion-infos div.col-left{
	width: 490px;
	float: left;
}
div.accordion-infos div.col-right{
	width: 420px;
	float: right;
}
div.box-contact{
	
}
div.box-contact-content{
	padding: 20px;
	background: #eef3f7;
}
div.box-contact-content a{
	color: #08538b;
	text-decoration: none;
}
div.box-contact-content a:hover{
	color: #08538b;
	text-decoration: underline;
}
div.box-contact-shadow{
	height: 17px;
	background: url(../img/france/box-contact-shadow.png) no-repeat top center;
}
div.close-box{
	float: right;
	padding-top: 15px;
	cursor: pointer;
}


/* PRESENTATION
-------------------------------------------------------------- */
div.presentation-col1{
	width: 370px;
	float: left;
}
div.presentation-col2{
	width: 310px;
	float: left;
}
div.presentation-col3{
	width: 300px;
	float: left;
}




/* FORMULAIRES
-------------------------------------------------------------- */
div#wrap-form{
	width: 520px;
	margin-left: auto;
	margin-right: auto;	
}
div#wrap-form label{
	display: block;
	padding-left: 60px;
	padding-top: 6px;
	padding-bottom: 6px;
	font-size: 13px;
} 
div#wrap-form.rejoignez-nous label{
	padding-left: 0px;
} 
div#wrap-form .select{
	width: 355px;
	padding: 0;
	margin: 0;
	border: 1px solid #bebebe;
	padding: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	background: #fff;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
div#wrap-form .input{
	width: 343px;
	padding: 0;
	margin: 0;
	border: 1px solid #bebebe;
	padding: 5px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
div#wrap-form .textarea{
	width: 343px;
	padding: 0;
	margin: 0;
	border: 1px solid #bebebe;
	padding: 5px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	margin-top: 4px;
}
div#wrap-form hr{
	color: #bebebe;
	background-color: #bebebe;
	height: 1px;
	border: 0;
	padding: 0;
	margin: 0;
	margin-top: 15px;
	margin-bottom: 8px;

}
div#wrap-form .bt{
	padding: 5px 30px 5px 30px;
	border: none;
	background: #08538b;
	font-size: 16px;
	color: #fff;
	text-align: center;
	cursor: pointer;
	-webkit-transition: background-color .3s ease-in-out;
    -moz-transition: background-color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out;
    transition: background-color .3s ease-in-out;
}
div#wrap-form .bt:hover{
	background: #053e68;
}



/* AJOUT 04/12/2014
-------------------------------------------------------------- */
div.message-contact{

}
div.message-contact .rouge{
	color: #FF0000;
}
div.message-contact .vert{
	color: #009900;
}