html, body{
	margin:0;
	 padding:0;
	color:white;
	 background-color:#302E31;
	font-family: arial;
 }


#coord{
	background-color:#343434;
	 width:100%;
	padding-top:5px;
	padding-bottom:5px;
}


#coord a{
	color:white;
	 text-decoration:none;
}


#coord span{
	float:right;
	padding-left:30px;
}


#wcoord{
	width:1250px;
	 margin-left:auto;
	 margin-right:auto;
}


#banniere{
	//background-color:#494B4A;
	margin-top:0px;
	 background-image:url(images/bg-1.gif);
}


#banniere h1{
	font-size:87px;
	padding:0;
	margin:0;
}


#banniere img{
	margin-left:-9px;
	margin-top:4px;
}


#slogan h1{
	margin:0;
	font-size:60px;
	opacity:1
}


#slogan{
	height:150px;
	background-color:black;
	opacity:0.8;
	width:1250px;
	margin-left:auto;
	 margin-right:auto;
}


#slogan{
	text-align:center;
	position:relative;
	/*top:-80px;*/
	top: -20px;
	z-index:999;
}


#wbanniere{
	width:1250px;
	 margin-left:auto;
	 margin-right:auto;
}


#wbanniere img{
	float:left;
	padding-top:6px;
}


#menuh{
	background-color:#CB2C22;
	padding-top:3px;
	padding-bottom:4px;
	border-top:1px solid #666;
	border-bottom:1px solid #666;
	margin-top:-35px;
}


#menuh ul{
	margin-left:0px;
	width:1220px;
	 margin-left:auto;
	 margin-right:auto;
}


#menuh li{
	display:inline;
	 list-style-type:none;
}


#menuh a{
	text-decoration:none;
	color:white;
	font-size:24px;
	 background-color:#CB2C22;
	padding:20px;
}


#menuh a:hover{
	background-color:#4C4C4C;
}


#wrapper{
	width:1250px;
	 margin-left:auto;
	 margin-right:auto;
}


.cadre{
	float:left;
	width:410px;
	margin-top:45px;
}


.titre{
	background-color:#CB2C22;
	width:380px;
	padding:10px;
}


.titre h2{
	margin:0;
}


.texte{
	min-height:150px;
	margin-top:20px;
	width:400px;
}


.image img{
	width:400px;
}



#footer{
	background-color:#444;
	margin-top:30px;
	text-align:center;
	border-top:1px solid #666;
}


#footer a{
	color:white;
	 text-decoration:none;
}


#wfooter{
	width:1250px;
	 margin-left:auto;
	 margin-right:auto;
	padding-top:20px;
	padding-bottom:20px;
}


.btn a{
	background-color:#CB2C22;
	padding:10px;
	 color:white;
	 text-decoration:none;
}


.btn{
	 margin-top:25px;
}


#anim{
	background-image:url(images/bg-1.gif);
	padding-top:40px;
}


#anim {
	box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
}


#anim2{
	box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.7);
}



#wanim{
	/*height:400px;*/
	height:340px;
	width:1250px;
	margin-left:auto;
	 margin-right:auto;
}



#wrapper2{
	margin-top:20px;
}


.cadrec{
	width:402px;
	float:left;
	height:430px
}


.titrec{
	font-size:24px;
}


.photoc{
	margin-top:20px;
	font-family:Tahoma;
	font-size:14px;
}


#contact td{
	padding-bottom:20px;
	width:180px;
}


#contact a{
	color:white;
	text-decoration:none;
}


{
	margin-left:-5px;
}


.ccab{
	display:none;
	;
}


input {
	border:1px solid #ccc;
	 padding:5px;
	 margin:5px;
	 font-family: tahoma;
	 font-size: 12px;
	 width:170px;
}


#fichier {
	width:94%;
}


textarea {
	border:1px solid #ccc;
	 padding:5px;
	 margin:5px;
	 font-family: tahoma;
	 font-size: 12px;
 }


#form{
	margin-left:-5px;
}


#submit{
	float:right;
}


#contact td{
	padding-right:20px;
}


.pcat{
	margin-top:50px;
}


.pcadre{
	float:left;
	margin-top:30px;
}


.ptitre{
	border-bottom:1px solid #555
}


.pnom a{
	text-decoration:none;
	color:white;
}


.pimage{
	//border:1px solid white;
}


.pnom{
	background-color:#CB2C22;
	padding:5px;
}


.pnom h3{
	margin:0;
}


#armatures{
	margin-top:30px;
	height:245px;
	width:1250px;
	float:left;
}


#atexte{
	width:760px;
}


#moyens{
    position:relative;
    top:-215px;
	float:right;
	 //background-color:yellow;
    background-image:url(images/post.png);
    height:270px;width:270px;
	color:black;
	padding:10px;
	border-radius:4px;
	font-size:12px;
	margin-right:80px;
	//box-shadow: -1px 7px 5px 1px rgba(0, 0, 0, 0.7);
}


#moyens h3{display:none;
	margin:0;
	padding-bottom:10px;
}


#moyens ul,li{display:none;
	margin:0;
	padding:20;
	 list-style-type:none;
}


#aphoto{
	margin-top:350px;
}


#aphoto img{
	margin-right:10px;
	border:1px solid white;
	margin-bottom:10px;
	width:195px
}


#p404{
	height:390px;
	font-size:30px;
}


#p404 a{
	text-decoration:none;
	 color:white;
}





@media (max-width: 640px) {

    * {

        -webkit-box-sizing: border-box;

           -moz-box-sizing: border-box;

                box-sizing: border-box;


	}



    /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

    body {

        width: auto;

        margin: 0;

        padding: 0;


	}



    /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

    img,
    table,
    td,
    blockquote,
    code,
    pre,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {

        max-width: 100%;


	}



    /* conserver le ratio des images */

    img {

        height: auto;


	}



    /* gestion des mots longs */

    textarea,
    table,
    td,
    th,
    code,
    pre,
    samp {

        -webkit-hyphens: auto;
		 /* césure propre */
        -moz-hyphens: auto;

        hyphens: auto;

        word-wrap: break-word;
		 /* passage à la ligne forcé */

	}



    code,
    pre,
    samp {

        white-space: pre-wrap;
		 /* passage à la ligne spécifique pour les éléments à châsse fixe */

	}



    /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */

    element1,
    element2 {

        float: none;

        width: auto;


	}



    /* masquer les éléments superflus */

    .hide_mobile {

        display: none !important;


	}



    /* Un message personnalisé */

    body:before {

        content: "Version mobile du site";

        display: block;

        text-align: center;

        font-style: italic;

        color: #777;


	}



}



@media (max-device-width:768px) and (orientation: landscape) {

  html {

   -webkit-text-size-adjust: 100%;


	}



}
