@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-300.woff');
	font-weight: 300;
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-300italic.woff');
	font-weight: 300;
	font-style: italic; 
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-600.woff');
	font-weight: 600;
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-600italic.woff');
	font-weight: 600;
	font-style: italic; 
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-800.woff');
	font-weight: 800;
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/montserrat-v14-latin-800italic.woff');
	font-weight: 800;
	font-style: italic; 
}



* {
   margin: 0;
   padding: 0;
     }
html {
	background: #fff url(img/bg.jpg) no-repeat center top fixed;
	background-size:cover;
	height: 100%;
	overflow: hidden;
	}
body
{
  height:100%;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
	font: 300 1em/150% Montserrat;
	color: #000;
	-webkit-text-size-adjust: none;
}
p {
	margin-bottom: 10px;
	}
h1, h2, h3 {
	font: 800 1.8rem/120% Montserrat;
	margin-bottom: 1.5rem;
	color: #00599F !important;
	}
h2 {
	font: 800 1.2rem/130% Montserrat;	margin: 1.2rem 0 0.8rem 0;
	}
h3 {
	font: 800 1.2rem/130% Montserrat; margin: 1.2rem 0 0.8rem 0;
	}
a {
	font-weight:600;
	outline:0 none !important;
	text-decoration: none;
	color: #00599F;
	position: relative;
	transition: color 0.3s ease-in-out 0s ;
	}
.content a:before, .menu a:before  {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  bottom: 0;
  left: 0;
  background-color: #000;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0.3s;
}
.content a:hover:before, .menu a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
a:hover {color: #000;}
b, strong {font-weight:600;}

ul {
	padding: 0 0 15px 30px;
	}
li {
	padding-bottom: 5px;
	}
img {max-width: 100%; }
img.collage{margin:-10px 0 10px; }

/*########################### BOXEN ##############################*/
.container {width: 80%; max-width: 960px; margin: 5% auto 0 auto; background: rgba(255, 255, 255, 0.85); padding: 0 10px 40px 10px; min-height: 600px;}

.content {margin: 0 auto;	padding: 0 30px;}
	
.adresse {margin-top:50px;}
.menu {float: left; text-align:left; font-size:0.9rem; text-transform:uppercase; font-weight:600; color: #999;}
a.select {color:#999;}
.header {padding: 30px 30px 0 30px;text-align:right;}
.header img {width:220px; height:auto; margin-top: -10px;}
.footer {text-align:center; margin: 20px 0 300px 0; text-transform:uppercase;  color: #fff;}
.footer a {color: #fff; font-weight: 600; transition: background-color 0.5s ease-in-out 0s ; padding: 1px 5px; font-size: 0.9rem; }
.footer a:hover {background-color: #000;}
	
/*########################### MEDIA ##############################*/

@media  (max-width: 500px) {
	body {font-size: 0.9rem;}
	.menu {font-size: 0.8rem;}
	.container { width:auto; margin: 5%; -webkit-hyphens: auto;  -moz-hyphens: auto;  -ms-hyphens: auto;  hyphens: auto;padding: 0 10px 30px 10px;} 
	.content {padding: 0 10px;}
	.header {padding: 20px 10px;}
	h1 {font-size: 1.4rem; width: auto;}
	h2 {font-size: 1.1rem;}
	h3 {font-size: 1rem;}
	h1, h2, h3, a {-webkit-hyphens: none;  -moz-hyphens: none;  -ms-hyphens: none;  hyphens: none;}
	.header img {width:160px; height:auto;}
	}
@media  (min-width: 501px) and (max-width: 1023px) { 
	h1 {font-size: 1.6rem;}
	h2 {font-size: 1.1rem;}
	h3 {font-size: 1rem;}
}