html { 
  margin:0;
  padding:0;
  background: url(bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
}
body{margin:0;padding:0;font:14px Verdana,Arial,Helvetica,sans-serif;color:#000}
@font-face {
    font-family: 'mapolice';
    src: url('mapolice.eot');
    src: url('mapolice.eot?#iefix') format('embedded-opentype'),
         url('mapolice.woff2') format('woff2'),
         url('mapolice.woff') format('woff'),
         url('mapolice.ttf') format('truetype'),
         url('mapolice.svg#mapolice') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'dragon';
    src: url('Dragon is coming-webfont.eot');
    src: url('Dragon is coming-webfont.eot?#iefix') format('embedded-opentype'),
         url('Dragon is coming-webfont.woff2') format('woff2'),
         url('Dragon is coming-webfont.woff') format('woff'),
         url('Dragon is coming-webfont.ttf') format('truetype'),
         url('Dragon is coming-webfont.svg#dragon_is_comingregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
.hr300{width:300px;text-align:left}
.hr50{width:50%}
h1,h2{margin:10px auto;padding:0;text-align:center}
h3{margin:5px auto 5px auto;padding:8px;font:14px Verdana,Arial,Helvetica,sans-serif;font-style:italic;color:#5b2d44}
b, strong{font-weight:normal}
p{padding:5px}
li{Margin-top:10px;list-style-type:square}
a:link,a:active,a:visited{color:#9d3f30;text-decoration:none}
a:hover{color:#5b2d44}
#general {padding:5px;}
#general h1{margin:5px auto 5px auto;font:16px Verdana,Arial,Helvetica,sans-serif;color:#000;text-align:center;}
#general{clear:left;margin:0 auto;padding:2px;width:100%;}
#general{max-width:960px;}
#general h1 a{color:#000}
#general h1 a:hover{color:#000}
#general h2 a{color:#000}
#general h2 a:hover{color:#000}
#header{margin:0;text-align:left;background:#000;font:28px Helvetica,sans-serif;color:#d0a700}
a.logo{display:inline-block;width:956px;height:248px;border:0;background:#000 url(logo.jpg) no-repeat;vertical-align:top;}
#menu{
margin:0;
padding:0;
list-style:none;
background:#222;
font:18px Helvetica,sans-serif;
}
#menu li{float:left;list-style-type:none;padding:5px 0 5px 0;position:relative;line-height:0;}
#menu a{float:left;height:25px;padding:0 40px;color:#fff;text-transform:uppercase;font:bold 12px/12px Arial,Helvetica;text-decoration:none;text-shadow:0 1px 0 #000}
#menu li:hover >a{color:#caad61}
*html #menu li a:hover /* IE6 */{color:#caad61}
#menu li:hover >ul{display:block}
#menu ul{list-style:none;margin:0;padding:0;display:none;position:absolute;top:35px;left:20px;z-index:99999;background:#444;background:-moz-linear-gradient(#444,#111);background:-webkit-gradient(linear,left bottom,left top,color-stop(0,#111),color-stop(1,#444));background:-webkit-linear-gradient(#444,#111);background:-o-linear-gradient(#444,#111);background:-ms-linear-gradient(#444,#111);background:linear-gradient(#444,#111);-moz-box-shadow:0 0 2px rgba(255,255,255,.5);-webkit-box-shadow:0 0 2px rgba(255,255,255,.5);box-shadow:0 0 2px rgba(255,255,255,.5);-moz-border-radius:5px;border-radius:5px}
#menu ul ul{top:0;left:150px}
#menu ul li{float:none;margin:0;padding:0;display:block;-moz-box-shadow:0 1px 0 #111,0 2px 0 #777;-webkit-box-shadow:0 1px 0 #111,0 2px 0 #777;box-shadow:0 1px 0 #111,0 2px 0 #777}
#menu ul li:last-child{-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none}
#menu ul a{padding:10px;height:10px;width:150px;height:auto;line-height:1;display:block;white-space:nowrap;float:none;text-transform:none}
*html #menu ul a /* IE6 */{height:10px}*:first-child+html #menu ul a /* IE7 */{height:10px}
#menu ul li:first-child >a{-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}
#menu ul li:first-child >a:after{content:'';position:absolute;left:30px;top:-8px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:8px solid #fac140}
#menu ul ul li:first-child a:after{left:-8px;top:12px;width:0;height:0;border-left:0;border-bottom:5px solid transparent;border-top:5px solid transparent;border-right:8px solid #fac140}
#menu ul li:first-child a:hover:after{border-bottom-color:#fac140}
#menu ul ul li:first-child a:hover:after{border-right-color:#fac140;border-bottom-color:transparent}
#menu ul li:last-child >a{-moz-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px}
#menu:after{visibility:hidden;display:block;font-size:0;content:"";clear:both;height:0}
* html #menu{zoom:1}/* IE6 */*:first-child+html #menu{zoom:1}/* IE7 */
.boite1{clear:left;margin:8px;}
/* Switching box model for all elements */
* {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


/* Responsive Navigation styles begin here */
nav > input,
nav > label {
	display: none; /* hidden on large screens */
}

/* Old Android bugfix */
body {  -webkit-animation: bugfix infinite 1s; }
@-webkit-keyframes bugfix {  from {padding:0;}  to {padding:0;} }

@media (max-width: 767px) {	

	/* Theming opened nav */	
	nav ul {
		/* translate with hardware acceleration */
		-webkit-transform: translateZ(0); 
		-ms-transform: translateZ(0);
		        transform: translateZ(0);
		-webkit-transition: max-height .4s;
		        transition: max-height .4s;
		will-change: max-height;
		

		/* global styles */
		margin: 0;
		padding: 0;
		list-style: none;
	}
	nav a {
		display: block;
		padding: 1.2rem;
		color: #fac140;
		background: #555;
		text-decoration: none;
		margin-bottom: 2px;
	}
	nav a:hover, 
	nav a:focus,
	nav a:active
	{
		background: #eee;
	}
	
	/* handling clic with CSS3 checked */
	/* Theming closed nav */	
	nav > input:not(:checked) ~ ul {
		max-height: 0;
		overflow: hidden;
	}
	/* Theming opened nav */
	nav > input:checked ~ ul {
		max-height: 25em;
	}
	

	/* Global styling nav button */	
	nav > label {
		display: block;
		position: absolute;
			top: 70px; right: 15px;
			z-index: 1;
		height: 4.5rem; width: 4.5rem;
		background: #333;
		border: 0;
		border-radius: 50%;
		text-align: center;
		font-size: 10px;
		line-height: 1.6;
		color: #fff;
		-webkit-tap-highlight-color:rgba(0,0,0,0);
		-webkit-transition: .2s webkit-transform cubic-bezier(0, 1.8, 1, 1.2);
		        transition: .2s transform cubic-bezier(0, 1.8, 1, 1.2);
	}
	nav > label:before {
		content: "";
		display: block;	
		z-index: 1;
		height: 1.6rem; width: 2rem;
		background-color: transparent;
		background-image: -webkit-gradient(linear, left top, right top, from(#fff), to(#fff)), -webkit-gradient(linear, left top, right top, from(#fff), to(#fff)), -webkit-gradient(linear, left top, right top, from(#fff), to(#fff));
		background-image: -webkit-linear-gradient(left, #fff, #fff), -webkit-linear-gradient(left, #fff, #fff), -webkit-linear-gradient(left, #fff, #fff);
		background-image: linear-gradient(to right, #fff, #fff),
			linear-gradient(to right, #fff, #fff),
			linear-gradient(to right, #fff, #fff);
		background-position: center top, center, center bottom;
		background-repeat: no-repeat;
		-webkit-background-size: 2rem .3rem;
		        background-size: 2rem .3rem;
		margin: .8em auto 0;
		padding: 0;
		outline: 0;
		border: 0;
		cursor: pointer;
		-webkit-tap-highlight-color:rgba(0,0,0,0);
		-webkit-transition: .2s cubic-bezier(0, 1.8, 1, 1.2);
		        transition: .2s cubic-bezier(0, 1.8, 1, 1.2);
		transition-property: background;
	}
	
	/* Theming opened nav button */	
	nav > input:checked + label {
		-webkit-transform: scale(.8);
		transform: scale(.8);
	}
	nav > input:checked + label::before {
		background-position: center, center, center;
	}
	

	/* Hide alternate text except from screen readers */
	.visually-hidden {
		position: absolute !important;
		clip: rect(1px, 1px, 1px, 1px);
		overflow: hidden;
		height: 1px;
		width: 1px;
	}
	
}

/* BONUS deco */


/* Global deco */
html {font-size: 62.5%;}
body {
	margin: 0;
	padding: 1rem;
	color: #000;
	font-family: helvetica, arial, sans-serif;
	font-size: 1.3em;
	line-height: 1.5;
}
section {
	position: relative;
	margin-top: 1rem;;
	padding: 1rem;
}
h1, h2, h3,.notif {
	margin-top: 0; margin-bottom: 1rem;
	text-shadow: 1px 1px 1px #fff;
}
h1 {font-size: 2.4rem;}
h2 {margin-top: 2rem;}
ul {padding-left: 1em; list-style-position: inside}
section li {list-style: none;}
section li::before {content: "\2713 "; margin-right: .8rem;}


/* orientation */
@media (orientation: landscape) and (max-device-width: 767px) {
	html,
	body {
		-webkit-text-size-adjust: 100%;
	}
}

pre {
	-moz-tab-size: 4;
    -o-tab-size: 4;
	     tab-size: 4;
    padding: 1em;
    margin: auto 1em;
    border-radius: 6px;
    border: 1px solid rgba(0,0,0,.1);
    white-space: pre-wrap;
	word-wrap: break-word;
	font-family: consolas, 'DejaVu Sans Mono', courier, monospace;
	line-height: 1em;
}
.smallpolice{font:18px mapolice,sans-serif;text-shadow: 1px 1px 1px #fff;}
.bigpolice{padding:30px;font:120px dragon,sans-serif;color:#000;text-shadow: 1px 1px 1px #fff;}
.notif,.italic{font:14px Helvetica,sans-serif;font-style:italic;color:#846374}
.aligngauche{float:left}.aligndroit{float:right}.center{text-align:center}.left{text-align:left}.right{text-align:right}.spacetop{margin-top:20px;margin-bottom:20px}
.texte{margin:10px;font:14px Verdana,Arial,Helvetica,sans-serif;text-align:justify}
.img,.imgright{border:0;text-align:center;overflow:hidden;}
.img{margin:20px auto 20px auto;}
.imgright{margin:5px auto 5px auto}
.citations{font-style:italic;text-align:right}
.appar{margin:14px;font-weight:bold;color:#f90}
.clearleft{clear:left}
.titrerub{font-size:14px;color:#5b2d44}
.exergue{position:absolute; top:-999px; left:-9999px;}
#bg{width: 300px; height: 199px; overflow:hidden; }
#Contenugen,#blocdroit{margin:0;float:left;padding:2px;text-overflow:ellipsis;word-wrap:break-word;text-shadow: 1px 1px 1px #fff;}
#Contenugen{float:left;width:66%;text-align:left;}
#blocdroit{float:right;width:34%;text-align:center;}
@media all and (max-width: 800px) {
	#Contenugen {
	width:100%;
	float:none;
	}
	#Contenugen img {
	max-width: 90%;
	}
    #blocdroit {
    width:100%;
	float:none;
    }
	.sousblocannu {
	width:100%;
    }
    }
#temoins {list-style-type: none;text-align:left;}
.cadredroit{margin:10px auto 10px auto;padding:2px;width:300px;border-radius:10px}
.cadredroit p{text-align:left}
.cadredroit ul{list-style-type:upper-roman}
.cadredroit li{margin:10px;text-align:left}
.cadrenavig{width:290px;margin:15px auto 15px auto;padding:10px;background-color:#444}
.alerte{color:red;font:11px;}
font,th,td,p{font:14px Verdana,Arial,Helvetica,sans-serif}
p{margin-top:2px;margin-bottom:3px}

#conteneurfooter{clear:both;margin:0px auto;padding:0;width:100%;border-top:solid 1px #999}
#conteneurfooter ul{list-style-type:square}
#conteneurfooter li{margin:10px;text-align:left;}
#footer{width:100%;height:280px}
#footergauche,#footercentre,#footerdroit{float:left;margin:0px auto;padding:2px;width:33%;height:100%;}
#footercentre{display:inline-block;text-align:center;}
@media all and (max-width: 767px) {
	  .sousblocannu {width:100%;}
	  #footergauche {
        width:100%;
      }
	  #footercentre {
        width:100%;
      }
	  #footerdroit {
        width:100%;
      }
    }
#copyright{text-align:center;border-top:solid 1px #999}
#captcha{width:200px;margin:10px auto 10px auto;text-align:center;background:#fff}
#captcha input{background:#fff;font:11px Verdana,Arial,Helvetica,sans-serif;color:#000}
#captcha p{color:#000}
.boitelat{margin:5px auto;width:200px;overflow:hidden;border-radius:5px}
.boitelat{word-wrap:break-word;}
.kontaktformular  {
	 width:  100%;
     margin: 0px 0;
     padding: 10px;
     font-size: 11px;
     font-family: Tahoma, Verdana, Arial;
     border: 1px solid #666666;
     float: left;
     clear: both;
     }
     
.kontaktformular fieldset {margin: 10px 0;}
.kontaktformular a {color: #990000; text-decoration: none;}
.kontaktformular a:hover {color: #483D8A;}
  
.kontaktformular legend {
	 background: #393939;
	 color: #fff;
	 padding: 3px 5px;
	 border: 1px solid #ddd;
	 text-transform: uppercase;
	 }
	  
.kontaktformular label {
     width: 100%;
	 float: left;
     clear: both;
     padding: 3px 10px;
     margin: 3px 0;
     }
          
.kontaktformular input, .kontaktformular textarea, .kontaktformular select {
     border-right: 1px solid #ddd; 
     border-bottom: 1px solid #ddd;
     border-left: 1px solid #666666; 
     border-top: 1px solid #666666;
     background: #fff;
     padding: 0px 3px;
     margin: 3px 0;
	 width: 100%;
}

.kontaktformular input:active, .kontaktformular input:focus, .kontaktformular input:hover { background: #ffff88;}
.kontaktformular textarea:active, .kontaktformular textarea:focus, .kontaktformular textarea:hover { background: #ffff88;}
.kontaktformular select:active, .kontaktformular select:focus, .kontaktformular select:hover { background: #ffff88;}

.kontaktdaten table, .anfrage table, .captcha table { border-spacing:0px; width:70%; border:0px solid;}
.tarif { width:300px; padding:5px;}
.prix { width:33%; padding:5px;}
.label { width:100%; padding:0px;}
.field { width:100%; padding:0px;}

.error { width:100%; padding:0px 0px 0px 5px;}
.captchareload { padding-left:10px;}
input.errordesignfields, textarea.errordesignfields, select.errordesignfields { background-color:#cc3333;}

#checkid {
  width: auto;
}

#checkid2 {
  width: auto;
}


.buttons input { width:80px;}
.buttons input, .captchareload img { color: #000; border-top:2px solid #fff; border-left:2px solid #fff; border-bottom:2px solid #666666; border-right:2px solid #666666;}
.buttons input:hover, .captchareload img:hover { color: #000; border-top:2px solid #ddd; border-left:2px solid #ddd; border-bottom:2px solid #fff; border-right:2px solid #fff;}

.pflichtfeld {
	 color: #800000;}
	 

.zurueck {
color: #6891D1;}