@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400|EB+Garamond);

html, body{
  width:100%;
  min-height:100%;
  margin:0;
  padding:0;
}

html{overflow:auto;}

body{
	background:#fff;
  font-family:'EB+Garamond',Arial,Georgia,Verdana,sans-serif;
	font-size:14px;
	color:#000;
}

a{color:#b85a27;text-decoration:none;}
a:hover{text-decoration:none;}

h1{
  font-family: 'Source Sans Pro',Arial,Georgia,Verdana,sans-serif;
	font-size:35px;
	color: #fff;
	font-weight:300;
}

h2{
  font-family: 'Source Sans Pro',Arial,Georgia,Verdana,sans-serif;
	font-size:21px;
	color: #b85a27;
	margin:10px 0;
}

h3{
  font-family: 'Source Sans Pro',Arial,Georgia,Verdana,sans-serif;
	font-size:18px;
	color: #b85a27;
	margin:10px 0;
}

img,embed{
  max-width:100%;
}

.fond{
  position:fixed;
  top:0px;
  bottom:0px;
  right:0px;
  left:0px;
  width:100%;
  height:100%;
  overflow:hidden;
  background:#222220;
}

.fond img{
  position:absolute;
  bottom:0px;
  left:0px;
  width:100%;
  z-index:1;
}

.fond_credit{
  position:fixed;
  bottom:150px;
  left:-70px;
  color:#000;
  z-index:2;
  -webkit-text-shadow:  -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  -khtml-text-shadow:   -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  -moz-text-shadow:     -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  -ms-text-shadow:      -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  -o-text-shadow:       -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  text-shadow:          -1px 0 0 rgba(255,255,255, 0.5) ,
                        1px 0 0 rgba(255,255,255, 0.5) ,
                        0 -1px 0 rgba(255,255,255, 0.5) ,
                        0 1px 0 rgba(255,255,255, 0.5);
  -webkit-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -o-transform:rotate(-90deg);
  transform:rotate(-90deg);
}

.contenu{
  position:absolute;
  top:0px;
  bottom:0px;
  right:0px;
  left:0px;
  min-width:100%;
  min-height:100%;
  z-index:2;
}

header[role=header]{
	float:left;
  display:inline;
	width:100%;
	padding:0 5%;
	background:#fff;
}

header[role=header] img{
	float:left;
  display:inline;
}

nav[role=navigation]{
	float:right;
  display:inline;
	padding-top:20px;
}

nav[role=navigation]>ul{
  display:table;
	width:100%;
  padding: 0;
  list-style: none outside none;
}

nav[role=navigation]>ul>li{
  display: table-cell;
  position:relative;
  text-align:center;
	font-size:16px;
	border-left:1px solid #000;
	padding:0 10px;
}

nav[role=navigation]>ul>li:first-child{
	border-left:none;
}

nav[role=navigation]>ul>li a{
  display:block;
  color:#000;
}

nav[role=navigation]>ul>li a:hover , nav[role=navigation]>ul>li a.active{
  color:#949494;
}

nav[role=navigation]>ul>li>ul{
  position:absolute;
  top:15px;
  min-width:120%;
  background:#fff;
  padding:15px;
  z-index:20;
  display:none;
}

nav[role=navigation]>ul>li:hover>ul{display:inline;}

.bande_picto{
	float:left;
  display:inline;
	width:100%;
	background:#00050c;
	height:31px;
}

.bande_picto_centree , main{
  width:50%;
  min-width:560px;
  margin:0 auto;
}

.bande_picto img{
	float:right;
  display:inline;
  margin-left:10px;
}

.banniere{
  margin:15px 2%;
  width:96%;
}

main{
  margin:25px auto 50px auto;
  background:#fff;
}

main>header{
	float:left;
  display:inline;
	width:100%;
	padding:0 2%;
	background:#b85a27;
}

main>article{
	float:left;
  display:inline;
  width:100%;
  padding:15px 2%;
}

.accueil{
  width:680px;
  margin:13% auto;
}

.accueil_logo_1{
  border:9px solid #000;
  background:#fff;
}

.accueil_logo_2{
  margin:4px;
  border:3px solid #000;
  background:#fff;
}

.accueil_logo_3{
  margin:1px;
  background:#000;
  padding:55px;
}

.accueil_texte{
  display:none;
  margin-top:130px;
  font-size:26px;
  width:250px;
}

footer[role=footer]{
  position:fixed;
  z-index:5;
  bottom:10px;
  left:0px;
  right:0px;
  width:100%;
  background:#fff;
  background:rgba(255,255,255,0.7);
  text-align:center;
  line-height:1.8em;
  font-size:0.9em;
}

footer[role=footer] a{
  color:#000;
}

/*
@media  only screen and (-webkit-min-device-pixel-ratio: 1.5),
        only screen and (-o-min-device-pixel-ratio: 3/2),
        only screen and (min--moz-device-pixel-ratio: 1.5),
        only screen and (min-device-pixel-ratio: 1.5) {
    
  .fond img{
    width:auto;
    height:100%;
    z-index:1;
  }
  
  .accueil_texte{
    display:inline;
  }

}
*/

@media screen and (max-width:1200px) {

  nav[role=navigation]>ul>li{
  	font-size:14px;
  	padding:0 5px;
  }
  
}

@media screen and (max-width:1050px) {

  header[role=header]{
    text-align:center;
  }

  header[role=header] img{
    float:none;
  }

  nav[role=navigation]{
    float:left;
    width:100%;
    margin:10px 0;
  }

}

@media screen and (max-width:900px) {

  header[role=header]{
    text-align:center;
  }

  header[role=header] img{
    float:none;
    margin-bottom:10px;
  }

  nav[role=navigation]>ul{
    display:inline;
    width:100%;
  }

  nav[role=navigation]>ul>li{
    float:left;
    display:inline;
    width:25%;
    margin-bottom:10px;
  }

  nav[role=navigation]>ul>li:nth-child(4n+1){
  	border-left:none;
  }

}

@media screen and (max-width:700px) {

  nav[role=navigation] , nav[role=navigation]>ul{
  	width:100%;
  	max-width:100%;
  	margin:0px;
  }
  
  nav[role=navigation]>ul>li{
    width:100%;
    margin:0;
    padding-left:5%;
  	border:none;
  	border-top:1px solid #000;
  	text-align:left;
  	line-height:2.5em;
  }

  main article>div{
    width:100%!IMPORTANT;
    padding:0px!IMPORTANT;
    margin:0 0 15px 0!IMPORTANT;
    border:none!IMPORTANT;
  }

  .accueil{
    width:315px;
    margin:25px auto;
  }

  .accueil_logo_1{
    border:9px solid #000;
    background:#fff;
  }

  .accueil_logo_2{
    margin:4px;
    border:3px solid #000;
    background:#fff;
  }

  .accueil_logo_3{
    margin:1px;
    background:#000;
    padding:74px 55px;
  }

  .accueil_texte{
    display:inline;
    margin:25px 0 50px 0;
    font-size:26px;
    width:100%;
    padding:15px;
    background:#fff;
    background:rgba(255,255,255,0.7);
  }

  .fond img{
    width:auto;
    height:100%;
    max-width:1000%;
    z-index:1;
  }
  
}

@font-face {
	font-family: 'neutradisp-bold-webfont';
	src: url('/extensions/polices/neutradisp-bold.eot'); /* IE9 Compat Modes */
	src: url('/extensions/polices/neutradisp-bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('/extensions/polices/neutradisp-bold.woff') format('woff'), /* Modern Browsers */
	url('/extensions/polices/neutradisp-bold.ttf')	format('truetype'), /* Safari, Android, iOS */
	url('/extensions/polices/neutradisp-bold.svg#svgFontName') format('svg'); /* Legacy iOS */
}