@font-face {font-family: 'HelveticaNeueLTPro-Bd';src: url('HelveticaNeueLTPro-Bd.eot?') format('eot'), url('HelveticaNeueLTPro-Bd.otf')  format('opentype'),	     url('HelveticaNeueLTPro-Bd.woff') format('woff'), url('HelveticaNeueLTPro-Bd.ttf')  format('truetype'), url('HelveticaNeueLTPro-Bd.svg#HelveticaNeueLTPro-Bd') format('svg');}
@font-face {font-family: 'HelveticaNeueLTPro-ThEx';	src: url('HelveticaNeueLTPro-ThEx.eot?') format('eot'), url('HelveticaNeueLTPro-ThEx.otf')  format('opentype'), url('HelveticaNeueLTPro-ThEx.woff') format('woff'), url('HelveticaNeueLTPro-ThEx.ttf')  format('truetype'), url('HelveticaNeueLTPro-ThEx.svg#HelveticaNeueLTPro-ThEx') format('svg');}

/* ---- Par défaut ---- */
body{ margin:0; padding:0; background:url(../images/bg-body.png) repeat}
div,td{ font-family:arial; font-size:14px;}
ul{ margin:0; padding:0;}
a{ text-decoration:none;}
li{ list-style:none;}
.clear{ clear:both;}
p{ color:#5f5f5f}
h1{ font-family:'HelveticaNeueLTPro-ThEx';font-size:33px; color:#001f56; font-weight:normal;}
#smartnav { display: none; z-index:50;}

/*CONTACT*/
.form-group{ margin:0 0 10px 0;}
.form-group label, .form-group input.form-input, textarea.form-textarea{ width:99%; display:block; margin:0 auto;}
input[type="text"],textarea,select{ padding:8px 5px; margin:8px 0; display:inline-block; border:1px solid #ccc; border-radius:4px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.btn-form{ margin:10px 0 0 0;}
.btn-submit-1, .btn-submit-2{  background: #00a0d2; border-color: #0073aa; -webkit-box-shadow: inset 0 1px 0 rgba(120,200,230,.5),0 1px 0 rgba(0,0,0,.15); box-shadow: inset 0 1px 0 rgba(120,200,230,.5),0 1px 0 rgba(0,0,0,.15); color: #fff; text-decoration: none; width:200px; padding: 10px 16px; font-size: 15px; border:1px; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; margin:10px 0 0 0; cursor:pointer; text-transform:capitalize;}
/*PLAN D'ACCES*/
.map-google{ width:98%; margin:0 auto;}
.map-google iframe{ margin:0; padding:0; border:none; width:100%; height:400px;}
.container-page-5 {margin: 0 auto; width: 98%;}

/* ---- header ---- */
header { margin:0; padding:0; background:#316d87; height:347px}
#top{ width:962px; margin:0 auto;}
#logo{ padding:26px 0;}
#logo p{ margin:0; padding:0}
#logo a{ color:#fff; font-size:40px; font-family:'HelveticaNeueLTPro-Bd';}
.anim{ position:absolute;}
#menu{ position:relative; border:#FFFFFF 1px solid; ; margin:10px; text-align:center;z-index:10}
#menu ul{ background:rgba(249, 251, 252, 0.86);    margin: 3px 1px 1px 1px; display:inline-block; width:96%; padding:0 15px }
#menu li{ float:left;overflow:hidden; transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s}
#menu a{width:128px; height:65px; display:table-cell; vertical-align:middle; font-size:16px; font-family:'HelveticaNeueLTPro-ThEx'; color:#6c7178; }
#menu a:first-letter{ text-transform:uppercase; }
#menu a:hover{ color:#cbd9f1;}
#menu a::before { content: ""; position: absolute; z-index: -1; top: 0; left:0; right:0; bottom:0; background:#316d87; -webkit-transform: scale(0); transform: scale(0); -webkit-transition-property: transform; transition-property: transform;-webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
#menu a:hover::before { -webkit-transform: scaleY(1);transform: scaleY(1); -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66); transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}

/* ---- central ---- */
#central{ padding-top:106px}
.section1{ width:962px; margin:0 auto; position:relative;z-index:10}
.titre{ background:url(../images/bg-titre.png) no-repeat; height:100%; margin:0 10px; padding-bottom:7px }
.titre h1{ padding:12px 0 20px 0; background:url(../images/bg-h1.png) 0 5px no-repeat; text-indent:70px; margin:0;}
.text-phot{background:#fff; padding:12px 0 20px 0;}
article{border-top:#001f56 1px solid ; border-bottom:#001f56 1px solid; padding:0 15px}
.photo{ float:left; width:330px ;padding:25px 0}
.photo img{ border:#e9eaec 3px solid; border-radius:5px}
.texte{ padding-top:14px}
.section2{ background:#e9eaec;}
.coordonne{ width:962px; margin:0 auto}
.left{ float:left; width:550px;}
.coord{color:#001f56;font-size:18px; background:url(../images/bg-coord.png) no-repeat; line-height:42px; text-indent:60px}
.left li{ display:inline-block; color:#001f56; font-size:18px; font-family:'HelveticaNeueLTPro-ThEx'; padding-left:30px; vertical-align:top;}
.left li p{font-size:16px}
.tel { color:#001f56}
.left  a{ color:#5f5f5f;}
.right{float:right; width:360px}
.horaires{ color:#001f56; background:url(../images/bg-hor.png) no-repeat; line-height:42px; text-indent:60px; padding-bottom:20px}
.right p{ font-size:18px;font-family:'HelveticaNeueLTPro-ThEx'}

/* ---- FOOTER ---- */
#footer{ background:#316d87;}
.foot{ width:962px; margin:0 auto;}
.foot p{ color:#FFFFFF; font-size:30px; margin:0; padding:20px 0 0 0; text-align:center; font-family:'HelveticaNeueLTPro-ThEx'}
.gar{ font-size:48px}
.menu-foot { text-align:center; padding:15px 0}
.menu-foot ul{ display:inline-block}
.menu-foot li{ display:table-cell; vertical-align:middle; padding:0 25px; text-align:left; border-right:#FFFFFF 1px solid}
.menu-foot li:last-child{ border:none}
.menu-foot a{ color:#c8d4e5;font-family:'HelveticaNeueLTPro-ThEx'}
.menu-foot a:first-letter{ text-transform:uppercase; }
.menu-foot a:hover{ color:#000}
.com { text-align:center; position:relative; margin-top:10px; padding-top:10px}
.com::before{ content:''; border-top:#FFFFFF 1px solid; position:absolute; top:0; left:379px; width:220px;}

/* ---- Responsive ---- */
@media only screen and (max-width:1390px){
	
}

@media only screen and (max-width:1320px){
	
}

@media only screen and (max-width:1190px){
	
}

@media only screen and (max-width:1090px){
	
}

@media only screen and (max-width:1009px){
	
}

@media only screen and (max-width:979px){
	#top, .section1, .coordonne, .foot{ width: 100%; margin: 0 auto;}
	#logo { text-align: center;}
	#menu{ text-align:center;}
	#menu li { float: none; display:inline-block;}
	#menu a { width: 110px;}
	#central { padding-top: 75px;}
	.left { width: 60%; margin-left:40px;}
	.left li:last-child{ padding-left:60px;}
	.right { width: 27%;}
	.menu-foot li { display:inline-block; padding: 0 10px; text-align: center;}
	.menu-foot li a{ font-size:13px;}
}

@media only screen and (max-width:899px){
	#menu, .menu-foot, .com::before { display: none;}
	#smartnav { display: block;}
	#central { padding-top: 30px;}
	.left li:last-child { padding-left: 35px;}
	.com { border-top: 1px #fff solid; padding: 10px 0 15px 0;}
}

@media only screen and (max-width:799px){
	#central { padding-top: 15px;}
	.photo { padding: 25px 0 5px 0;}
	.left { width: 65%;  margin-left: 30px;}
}

@media only screen and (max-width:767px){
	#central { padding-top: 0px;}	
	.titre { margin-top: -10px;}
	.left { margin-left: 20px;}
	.left li:last-child { padding-left: 25px;}
}

@media only screen and (max-width:719px){
	header { height: 315px;}	
	.coordonne { width: 95%; margin: 0 auto; padding:10px 0;}
	.coord, .horaires { background: #fff; font-family: 'HelveticaNeueLTPro-ThEx'; text-indent: inherit; text-align: center; border: 1px #001f56 solid; border-radius: 5px; padding-bottom:0;}
	.left { margin-left: 0; float: none; width: 100%;}
	.left ul{ text-align:center;}
	.left li{ padding-left:0;}
	.left li:last-child { padding-left: 50px;}
	.right { width: 100%; float:none; text-align:center;}
}

@media only screen and (max-width:639px){
	header { height: 285px;}
	.photo { padding: 25px 15px 5px 0; width: 34%; height: auto;}
	.photo img{ height:auto; width:100%;}
}

@media only screen and (max-width:559px){
	header { height: 265px;}	
}

@media only screen and (max-width:532px){
	header { height: 245px;}
	.left li:last-child { padding-left: 25px;}
}

@media only screen and (max-width:490px){
	header { height: 270px;}
	article { border-bottom: none;}
	.titre { margin-top: 10px;}
	.photo { padding: 25px 0px 5px 0; width: 80%; height: auto; float: none; margin: 0 auto;}
	.left li:last-child { padding-left: 0px; padding-top: 10px;}
	#central { padding-top: 0px; margin-top: 67px;}
}

@media only screen and (max-width:420px){
	header { height: 261px;}
}

@media only screen and (max-width:359px){
	header { height: 291px;}
}