@charset "utf-8";
/* CSS Document */
html {
  font-size: 62.5%;
}

*{
	margin: 0;
	padding: 0;
}

.clearfix {
  zoom: 1;/* ie 6/7 */
}
.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}
.clearfix:after {
  clear: both;
}


html {
	margin:0;
	padding:0;
}

header img {
	

	padding-left:15px;
max-width: 100%;}

html {
  font-size: 62.5%;
}

body{
	font-family: 'Roboto', sans-serif;
    background-color:#cccccc;
	color: black;
   font-size: 13px;
	font-size: 1.5rem;
	line-height: 1.3;
    color:#696969;
	font-weight:400;
}

a{color: #F90;}

a:focus, a:hover, a:active {
	text-decoration: none;
	color:white;
}
p, li {
	line-height: 1.8em;
}
h1, h2 {
	
	margin: 0 0 10px 0;
	
}
h1 {
	padding: 0;
	font-size: 3em;
color: #F90;
	
}
h2 {
	padding-top: 10px;
	font-size:2em;
}
a{
    transition: all 0.3s ease-in-out 0s;
}

header {background:url(imag/b.jpg) no-repeat center bottom;background-size:cover;

    width: 100%;
    height: 100px;
    background-color: #FFF;
    box-shadow: 0px 0px 5px #000, 0px 0px 5px rgba(0, 0, 0, 0.2) inset;
}

	
	
header nav  { list-style-type: none;

    width: 80%;
  float:left;


 }	
 header nav ul { list-style-type: none;
 margin-left:70px;
 margin-left:7em;}


header nav ul { list-style-type: none;
 }
header nav li {
    float: left;
    margin-top: 30px;
    text-align: center;
    width: 20%;
}
header nav li a {
	display: block;
	text-transform: uppercase;  
	font-size: 1em;
	line-height: 1.5em;
	text-align:center;
	font-weight: bold;
	

}
header nav li a, header nav li a:link, header nav li a:visited {
  text-decoration: none;
text-transform: uppercase;  
  color: black;
    font-weight: bold;
} 

header nav ul li a:hover{


color: #b22222;
}

header nav li.current{

color: #F90;
text-transform: uppercase;
font-weight: bold; 
line-height: 1.5em; }





#logo {
	

float:left;}



.indice{
 color: #708090 !important;
    font-size: 14px;
    font-weight: normal;
    line-height: 16px;
	text-align: center;
	text-transform: lowercase;   
}

div#page {
	
	background-color: #fff;
	margin: 0 auto;
	text-align: left;
	border-color: #ddd;
	border-style: none solid solid;
	border-width: medium 1px 1px;
margin-top:85px;}

div#page h3 {color:white;
font-size:20px;
margin-bottom:20px	
	}

div#container {
	padding: 10px;
	
}
div#ads {
	clear: both;
	padding: 12px 0 12px 66px;
}



footer {
	
	width: 100%;

	text-align: center;
	line-height: 35px;
	clear: both;
	overflow: hidden;
background:black;
margin-top:1em;
margin-top:10px;}

footer nav {
	float: right;
z-index:1;}

footer nav ul li {
	display: inline;
	list-style: none;
}
footer nav ul li a {
	width: 60px;
	height: 40px;
	text-align: center;
    color:white;
	text-decoration: none;
	margin: 0 10px 0 10px;
	margin: 0 1em 0 1em;
	font-size: 1.3em;
	font-size: 13px;
}
footer nav ul a:hover {
	color: #F90;
}
#Mcles h6 a {

color:white;
	text-decoration: none;
	font-size: 1.3em;
	font-size: 13px;
}

footer h6{
float:right;
}

#contactBis {
	width: 23%;
	float: left;
	margin:0;
	
	
	
}
#contactBis p {
font-size:1.3em;
font-size:13px;
float:left;
margin-left:10px;
margin-left:1em;
color:white;


}

#contactBis img{
	
	float: left;
	margin-top: 15px;
	margin-left:10px;
	margin-left:1em;
	
	
	
}






	#services ul li{
	width:  25%;	
margin-left:40px;}

#services {margin-left:0;}


 #planSite {
padding:30px;
}
 
#planSite ul{
margin:10px;
}

#planSite ul li{
margin:10px;
}

#planSite  li a{
display:block;
}
#planSite  li a:hover{
color: #b22222;
}
.navfolio  { 
width: 90%;
position: relative;
left: 6%;
 }

.bP {
    background: #990000 none repeat scroll 0% 0%;
color: #FFF;
font: 700 1em "montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
letter-spacing: 0.025em;
text-decoration: none;
text-transform: uppercase;
display: inline-block;
text-align: center;
float: left;
margin: 1em 1em 0.46em;
padding: 14px 0px 13px;
width: 22%;
}


.bcurrent {
background: #F90 none repeat scroll 0% 0%;
color: black;
font: 700 1em "montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
letter-spacing: 0.025em;
text-decoration: none;
text-transform: uppercase;
display: inline-block;
text-align: center;
float: left;
margin: 1em 1em 0.46em;
padding: 14px 0px 13px;
width: 22%;
}

 a:hover.bP{

background: white none repeat scroll 0% 0%;
color: #990000;
}



 @media only screen and (min-device-width : 768px) and (max-device-width : 1024px)

{


  /* passer tous les éléments de largeur fixe en largeur automatique */
 body, header nav, aside, #main, article, header{
   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 et empêcher les débordements de boîtes dûs aux border ou padding */
 img {
 
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 /* gestion des mots longs */
 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }
 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) */
header h1, header nav {
   float: none;
   width: auto;
 }

header  {width:100%;


 }
 

 header nav ul{
float:left;
 margin-left:0;
 width:72%;}


 
 header nav li {
   width:22%; 
}


 /* masquer les éléments superflus */
 .hide_mobile {
   display: none !important;
 }

header nav li {
         float: left;

    text-align: center;
    width: 20%;}
	
	.navfolio {
    margin: 0px auto 0px 2.5em;
    width: 95%;
 
}
.navfolio a {
    
    width: 17%;
 
}
.indice{display:none}

}


   /* fin mediaqueries */