@media only screen and (min-width: 200px)
  {

/**CSS Pages d'accueil connecté**/
  	html
	{
	height: 100%;
	}			 

	body
	{
	margin: 0px;
	padding: 0px;
	background-color:rgba(178,178,178,0.2);
	height: 100%;  
	}

#contentPageProfil
{
position: relative;
text-align: center;
margin-top: 40px;
padding-bottom: 85px;
min-height: 400px;
}


#PersoDataBlock
{ 
position: relative;
bottom: 0px;
top:0px;
width: 100%;
font-family:Arial, Sans-Serif;
text-align: center;
}

#infosGenerales
{
 text-align: left;
 margin-left: 3%; 
}

#nomUser
{
  font-size: 1.1em;
  margin-top: 5px;
  margin-left: 5px;
  color: rgba(0,0,0,0.5);
}

#profilEtDateDenregistrement
{
  position: relative;
  display: flex;
}

#photoProfilUser
 {
  width: 40px;
  height: 40px;
  border-radius: 1000px;
  text-align: center;
  font-size: 1.4em;
  color: white;
 }

 #photoProfilUser span
  {
    display: inline-block;
    margin-top: 6px;
  }

#dateDenregistrement
 {
  margin-top: 25px;
  margin-left: 4px;
  margin-bottom: 10px;
  color: rgba(0,0,0,0.7);
  font-size: 0.8em;
 }


#form{
   position: relative;
   width: 95%;
   margin: 0 auto;
}

#theForm
{
  position: relative;
 border: 1px solid silver;
 background-color: white;
 margin-top: 20px;
}


.conditionEtMessageDerreur
{
   font-size: 0.8em;
   text-align: left;
   margin-left: 30px; 
}

.cacher
{
    display: none;
}

.label
{
  font-size: 0.8em;
   text-align: left;
   margin-left: 25px;
   margin-top: 20px;
   font-weight: bold;   
}

.label1
{
  font-size: 1em;
  text-align: left;
  margin-left: 15px;
  font-weight: bold; 
}



#form input[type='text'], .form input[type='text'], input[type='password']
{
   position: relative;
   width: 85%;
   border-radius: 2px;
   border: 1px solid #CCC;
   padding: 10px;
   color: #333;
   font-size: 14px;
   margin-top: 5px;
   margin-left: 2%;
}

input[type='submit']{
   padding: 6px 15px 6px;
   color: #fff;
   background-color: #0067ab;
   text-shadow: rgba(0,0,0,0.24) 0 1px 0;
   font-size: 16px;
   box-shadow: rgba(255,255,255,0.24) 0 2px 0 0 inset,#fff 0 1px 0 0;
   border: 1px solid #0164a5;
   border-radius: 2px;
   margin-top: 15px;
   cursor:pointer;
   margin-bottom: 10px;
   opacity: 0.3;
}

#form2 input[type='submit'], #form3 input[type='submit']{
  opacity:1;
}


input:focus { outline: 0; } 


#blockDeModifPassw
{
  position: fixed;
  bottom: 0px;
  top:0px;
  display: none;
  width: 100%;
  background-color: rgba(195,195,195,0.8);
  z-index: 1000;
  padding-top: 50px;
  justify-content: center;
  align-items: center;
}

#MessageFromPhp, #MessageDuCode
{   
    background-color: silver;
    z-index: 1000;
    margin: auto;
    border-radius: 5px;
    text-align: left;
    padding: 10px;
    width: 85%;
}

#MessageFromPhp
{
	position: absolute;
    right: 3%;
}

#MessageDuCode
{
  background-color: grey;
}


.form{
     width: 85%;
     margin: 0 auto;
     margin-top: 20px;
     padding: 10px;
     border: 1px solid silver;
     background-color: white;
     border-radius: 5px;  
}


.conditionEtMessageDerreur, .messageDePrecision
{
     text-align: left;
     margin-left: 10px;
     color: silver; 
}

.annuler
{
  color: blue;
  text-align: right;
  cursor: pointer;
  opacity: 0.7;
  margin-right: 20px;
  margin-bottom: 20px;
}

.annuler:hover
{
  text-decoration: underline;
}

#modifPasswText
{
  margin-top: 20px;
  cursor: pointer;
  text-align: left;
}

#modifPasswText:hover
{
  text-decoration: underline;
}


	footer
	{
	position: fixed;
	bottom: 0px;
	width: 100%;
	z-index: 1000;
	}

	#footer
	{
	position: relative;
	text-align: center;
	height: 70px;
	border-top: solid silver 1px;
	background-color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	}

	#listFooter
	{
	position: relative;
	display: flex;
	text-align: center;
	width: 100%;
	justify-content: space-around;
	margin: auto;
	color: grey;
	}

	#listFooter a
	{
	color: grey;
	text-decoration: none;
	font-size: 0.9em;
	}

    #categorieListFooter
	{
		position: absolute;
		z-index: 1000;
	}



	 .lfb
		{
            display: inline-block;
      width: 30px;
      height: 30px;
      background: url(imaj/logofb.png);
      background-position: center;
      margin-left: 5px;
      margin-top: -6px;
		}


   .contact
	{
      margin: 0 auto;
      justify-content: center;
	}

	.contactContent
	{
       display: flex;
	}

	.reseauxSl
	{
		display: flex;
		margin-left: 50px;
	}

	.copyR
	{
		width: 100%;
		text-align: center;
		padding-bottom: 30px;
	}

	 #contactEtCopyRPhTb
      {
        display: flex;
        flex-direction: column;
        margin-top: 30px;
      }

      .reseauxSl
	  {
		margin-top: 10px;
	  }




/**page Apropos**/

.bodyAproposAide
{
	background: white;
}

#logoEtlaKayAproposAide
{
  display: flex;
  justify-content: space-around;
   margin-top: 30px;
}



#LakayLinkAproposAide
{
   display: inline-block;
   width: 22px;
   height: 22px;
   background: url(imaj/mezon.png);
   background-position: center;
   margin-right: 12px;
   margin-top: 15px;
}	
	
#textApropos
{
color: grey;

}

#contentPageApropos
{
  margin: 0 auto;
  width: 90%;
  margin-top: 30px;
  padding-bottom: 80px;
}

#imageDechange img
{
width: 100%;
min-height: 300px;
max-height: 800px;
}

/**page Apropos **/



/**page Aide **/



#contenPageAide
{
  margin: 0 auto;
  width: 95%;
  margin-top: 50px;
  min-height: 400px;
  padding-bottom: 80px;
}

#tableAide
{
	border-collapse: collapse;
	width: 100%;
}

#tableAide td
{
	border: 1px solid silver;
}

#enTeteTableAide
{
	height: 50px;
	font-size: 1.2em;
	color: grey;
	padding-left: 5%;
}

#menuDaide
{
	width: 40%;
	padding-left: 1%;
}

#contenuDaide
{
	width: 60%;
	padding-left: 1%;
}

#menuDaide div
{
	cursor: pointer;
	padding: 5px;
	margin-top: 5px;
}

#menuDaide div:hover
{
	text-decoration: underline;
}


/**page Aide **/



/**page contenu-entreprise, contenu-recherche**/

#blockInfosEntreprise
{
	 position: relative;
	 text-align: center;
	 background-color: white;
     display: flex;
     width: 98%;
     margin-left: 1%;
     margin-top: 10px;
     justify-content: space-around;
	 border-radius: 200px;
	
}

#infosEntreprise
{   
	position: relative;
	padding: 10px;
}

#profilEtNomEntreprise
{
	display: flex;
}

#profilEntreprise
 {
  height: 40px;
  width: 40px;
  border-radius: 200px;
  color: white;
  font-size: 1.4em; 
 }

 #profilEntreprise span
  {
  	display: inline-block;
  	margin-top: 6px;
  }

#nomEntreprise
{
	color: rgba(0,0,0,0.5);
	margin-top: 12px;
	margin-left: 5px;
}

#dateDenregistrementCentreprise
 {
 	margin-top: 10px;
 	margin-bottom: 10px;
 	text-align: left;
 	font-size: 0.8em;
 }

 #contactCentreprise
 {
   text-align: left;
   font-size: 0.9em
 }

 #contentCentreprise, #contentCrecherche
 {
   margin-bottom: 20px;
   min-height: 400px;
 }


#messageEnCasDeContenuVide
{
display: none;
width:85%;
text-align: center;
margin: auto;
margin-top: 30px;
border-top: solid 1px;
border-bottom: solid 1px;
padding: 10px;
}

#blockArticlesCentreprise, #resultatsRecherche
{
	position: relative;
	border: none;
	width: 99%;
	margin: auto;
	padding-bottom: 85px;
}


 #blockArticlesCentreprise
 	{
 		display: flex;
 		flex-direction: column;
 		justify-content: center;
 		align-items: center;
 	}

 	#introArticlesContener
 	{
 		width: 99%;
 		text-align: left;
 	}

 	#introArticles
 {
 	display: none;
 	margin-left: 3%;
 	font-size: 1.3em;
 }

.cacherCentreprise
		{
			position: relative;
			display: none;
			width: 96%;
			min-width: 96%;
			overflow: hidden;
			border: 3px solid white;
			margin-bottom: 20px;

		}

.cacherCentreprise .imj
{
   background-color: white;
   width: 47%;
   margin-left: 2%;
   display: inline-block;
   position: relative;
   text-align: center;
   text-decoration: none;
   padding-top: 5px;
}

.cacherCentreprise h3
		{
			font: 1em Arial, Helvetica, sans-serif;
			font-weight: bold;
			margin-left: 20px;
		}

		.cacherCentreprise .imj
		{
			 font: 0.9em Arial, Helvetica, sans-serif;
		}

		.voirPlusMoins
		{
			 position: absolute;
			 right: 10px;
			 top: 15px;
			 background-color: blue;
			 padding: 6px;
			 color: white;
			 border-radius: 6px;
			 font: 12px Arial, Helvetica, sans-serif;
			 cursor: pointer;
			 display: none;
		}

#resultatsRecherche .imj
{
   background-color: white;
   width: 48%;
   margin: 1%;
   display: inline-block;
   position: relative;
   text-align: center;
   text-decoration: none;
   padding-top: 5px;
}

.cacherCentreprise .ImajArticleContener, #resultatsRecherche .ImajArticleContener 
{
  position: relative;
  background-color: rgba(240,240,240,0.6);
  width: 96%;
  height: 90px;
  overflow: hidden;
  margin-left: 2%;
}

.ImajArticleContener img
{
position: relative;
height: 90px;
max-width: 100%;
}


.cacherCentreprise .imj:hover
{
   box-shadow: 0px 0px 8px silver inset; 
}

#resultatsRecherche .imj:hover
{
   box-shadow: 0px 0px 8px silver inset; 
}


.cacherCentreprise .imj .prix, #resultatsRecherche .imj .prix
{
  position: relative;
  margin-left: 10px;
  color: #CC1100;
  width: 90%;
  text-align: left;
}

.cacherCentreprise .imj .description, #resultatsRecherche .imj .description 
{
    position: relative;
    margin-left: 10px;
    color: black;
    text-align: left;
    white-space: nowrap;
	overflow: hidden;
    text-overflow: ellipsis;
	width: 93%;
	height: 18px;
  
}

#themeRecherche
{
    padding-top: 2px;
    padding-bottom:2px;
	padding-left: 3%;
	margin-top: 15px;
    color: grey;
	background: white;
}


#temRecheche
{
 color: red;
}

}


@media only screen and (min-width: 350px)
{

.cacherCentreprise .ImajArticleContener, #resultatsRecherche .ImajArticleContener 
{
  height: 100px;
}

.ImajArticleContener img
{
height: 100px;
}
	
}




@media only screen and (min-width: 400px)
{
	#form{
   position: relative;
   width: 350px;
   margin: 0 auto;
   position: relative; 
   }
}



@media only screen and (min-width: 500px)
 {

	#listFooter
	{
	 width: 400px;
	}

 /**contenu-entreprise contenu-recherche**/
   #resultatsRecherche .imj 
  {
   width: 31%;
  }

 .cacherCentreprise .imj
 {  
   width: 30%;
   margin-left: 2.5%;
   
 }

.cacherCentreprise .ImajArticleContener, #resultatsRecherche .ImajArticleContener 
{
  height: 120px;
}

.ImajArticleContener img
{
height: 120px;
}

 /**contenu-entreprise contenu-recherche**/

 }


@media only screen and (min-width: 700px)
 {
#form{
position: relative;
width: 500px;
margin: 0 auto;
position: relative; 
}

#MessageFromPhp, #MessageDuCode
{

background-color: silver;
position: absolute;
width: 320px;
right: 50px;
top: 40px;
border-radius: 5px;
text-align: left;
padding: 10px;
}

#MessageDuCode
{
background-color: grey;
width: 200px;
}


.form{
 width: 320px;
 margin: 0 auto; 
}

#nomUser
{
  font-size: 1.8em;
  margin-top: 8px;
  margin-left: 7px;
}


#photoProfilUser
 {
  width: 50px;
  height: 50px;
 }

 #photoProfilUser span
  {
    margin-top: 12px;
  }

#dateDenregistrement
 {
  margin-top: 25px;
  margin-left: 4px;
  margin-bottom: 10px;
  font-size: 0.9em;
 }


input[type='submit']{
   padding: 10px 25px 8px;
}


  /**page Apropos**/

  #textApropos
{
font-size: 1.8em;
color: grey;

}

#contentPageApropos
{
  margin: 0 auto;
  width: 80%;
  margin-top: 50px;
}

  /**page Apropos**/


/**page Aide**/
#contenPageAide
{
  width: 80%;
  margin-bottom: 150px;
}

#enTeteTableAide
{
	font-size: 1.4em;
}

/**page Aide**/




/**page contenu-entreprise crecherche**/


#profilEntreprise
 {
  height: 50px;
  width: 50px;
  font-size: 1.8em;
 }

 #profilEntreprise span
  {
  	margin-top: 7px;
  }

#nomEntreprise
{
  font-size: 1.4em;
}

#dateDenregistrementCentreprise
 {
 	font-size: 1em;
 }

 #contactCentreprise
 {
 	font-size: 1em;
 }


 #contentCentreprise, #contentCrecherche
 {
   margin-bottom: 10px;
 }



#blockArticlesCentreprise
{
	width: 95%;
	margin: auto;
	margin-top: 50px;
}

 #resultatsRecherche
 {
 	width: 95%;
	margin: auto;
 }

#resultatsRecherche .imj
{
   width: 23%;
}

/**page contenu-entreprise crecherche **/

 }


 @media only screen and (min-width: 800px)
{
	#blockArticlesCentreprise
 	 {
 		display: block;
 	 }

  .cacherCentreprise
		{
			width: 46%;
			min-width: 46%;
			margin-left: 2%;
		}

.cacherCentreprise .imj
  {
   width: 47%;
   margin-left: 2%;
  }
}



@media only screen and (min-width: 1025px)
  {
   /**CSS Pages d'accueil connecté**/

#messageEnCasDeContenuVide
{
display: none;
width: 600px;
text-align: center;
margin-top: 50px;
font-size: 1.5em;
margin-left: 120px;
border-top: solid 1px;
border-bottom: solid 1px;
padding: 15px;
}


/**Fin CSS Pages d'accueil connecté**/


/**page contenu-entreprise crecherche **/

#blockArticlesCentreprise, #resultatsRecherche
{
 padding-bottom: 20px;
}


.cacherCentreprise .ImajArticleContener, #resultatsRecherche .ImajArticleContener 
{
  height: 140px;
}

.ImajArticleContener img
{
height: 140px;
}

#themeRecherche
{
  padding-top: 5px;
  padding-bottom:5px;
	margin-top: 15px;
	font-size: 1.3em;

}

footer
{
position: relative;
}

#footer
{
height: 80px;
background-color:unset;

}

  #listFooter a:hover
  {
  color: #F00020;
  text-decoration: underline;
  }

#footComp
{
 display: block;
}

#categorieListTextFooter
{
 display: none;
}

#contactEtCopyRPhTb/*Aide Apropos*/
{
  display: none;
}



.lfb
 {
   display: inline-block;
   width: 30px;
   height: 30px;
   background: url(imaj/logofb.png);
   background-position: center;
   margin-left: 5px;
   margin-top: -6px;
 }


.contact
	{
	  display: flex;
      margin: 0 auto;
      justify-content: center;
	}

	.contactContent
	{
       display: flex;
	}

	.reseauxSl
	{
		display: flex;
		margin-left: 50px;
		margin-top: 0px;
	}

	.copyR
	{
		display: block;
		width: 100%;
		text-align: center;
		padding-bottom: 30px;
	}





/**page contenu-entreprise crecherche**/

}


@media only screen and (min-width: 1100px)
 {  

   #introArticles
   {
 	  font-size: 1.5 em;
   }
 

	.cacherCentreprise
		{
			width: 30%;
			min-width: 30%;
			margin-left: 2.2%;
		}

		.cacherCentreprise h3
		{
			font-size: 1.3em;
		}

.cacherCentreprise .imj
 {
   width: 47%;
   margin-left: 2%;
 }


	.voirPlusMoins
		{ 
			 right: 25px;
			 top: 15px;
			 padding: 7px;
			 border-radius: 7px;
			 font: 12px Arial, Helvetica, sans-serif;
		}

 }



@media only screen and (min-width: 1150px)
{

 #resultatsRecherche .imj
	{
	width: 18%;
	}

}


@media only screen and (min-width: 1605px)
{

 	body
	{
    width: 1600px;
    margin: auto;
    height: auto;
    border: gray 1px solid;  
	}

}