@media only screen and (max-width:310px)
{ 
    body
	{
		margin:0;
		padding:0;
		overflow:hidden;
		font-family:Arial;
		font-size:14px;
		height:800px;
		background:#c8eaf6;
	}

  .desktop
  {
    display:none;
  }

	.post_titles
	{
		display:none;
	}

	.menuhead
	{
		display:none;
	}
	.tab
	{
		display:none;
	}

	*{
	   box-sizing:border-box;
	}

	.post_img img
	{
		max-width:100%;
		height:auto;
	}

	.poste
	{   
		position:relative;
		margin:10px;
		width:100%;
		padding:0;
	 background:#fff;
	}

	.poste .post_info
	{   
		padding:12px;
		margin-right:10px;
		margin-top:13rem;
	}

	.post_info .post_title
	{
		margin-top:0;
		display:none;
	}

  
  .poste .post_img .presentation
  {  
    margin-bottom:-5rem;
    padding-right:0.5rem;
    background-color:#fff;
    width:100%;
  }
  .poste .post_img .presentation h1
  {  
    margin-top:2rem;
    font-size:16px; 
    font-style:italic;
  }

  .poste .post_info .post_titles
  {
      display:block;
      margin-top:-8rem;
  }
  .poste .post_info .post_titles .deuxiem
  {
    display:none;
  }


/*partie mdp*/

.motdp
  {
    padding:1.5rem 0.5rem;
    background-color:#fff;
    height:120px;
    width:95%;
    margin-bottom:15rem;
  }

 .motdp h1
  { 
  	margin-top:-2.8rem;
    padding:1.2rem 0rem;
    padding-top:2rem;
    text-align:center;
    color:#333;
    font-size:1.2rem;
    font-weight: 100;
  }
 .motdp .form
  {
      width:100%;
      margin:2% auto;
      border-radius:0 4px 4px 4px;
      box-shadow:2px 2px 5px rgba(0,0,0,0.1);
      text-align:center;
      border:1px solid lightgrey;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom:5px;
      font-weight: 100;
      font-size:10px;
  }

 .motdp .form input[type="text"] , input[type="email"] , input[type="password"]
  {
      display: block;
      height: 30px;
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      border:none;
      border-bottom: 2px solid lightgrey;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

 .motdp .form textarea
  {
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea:focus
  {
      box-shadow: 2px 2px 0px 0px #1ddced;
  }

  .motdp .form input[type="text"]:focus , input[type="email"]:focus , input[type="password"]:focus 
  {
    
     box-shadow: 0px 2px 0px 0px #1ddced;

  }


  .motdp .form input[type="text"]::placeholder , input[type="email"]::placeholder , input[type="password"] ::placeholder
  {
    color:rgba(255,255,255,.5);
  }

  .motdp .form input[type='submit']
  { 
    margin-left:5%;
    margin-top:5%;
    margin-bottom:2%;
    width:50%;
  } 

 .motdp .form .name
  {
      text-align:left;
      margin-left:2%;
      color:#333;
      font-size:1rem;
      font-weight: 100;
  }

  .motdp .form input:required
  {
      background:url(../image/close.png) 98% center no-repeat;
      background-size:10px;
  }

  .motdp .form span
  {
    display:none;
    font-size:14px;
  }

  .motdp .form input:focus:invalid
  {
      border-color:#FF0000;
      background-image:none;
      box-shadow: #d45252 0px 0px 5px;
  }

  .motdp .form input:focus:invalid + span
  {   
      display:block;
      color:#FF0000;
  }

  .motdp .form input:focus:valid
  {
      border-color:#56c93f;
      background-image:none;
      box-shadow: #56c93f 0px 0px 5px;
  }

  .motdp .form input:valid
  {
      background-image:none;
  }

.footer
    {
     width:100%;
     margin-top:0px;
     display:flex;
     background:url(../../images/icone/monde.jpg) center center no-repeat;
     background-size:cover;
     height:auto;
     align-items:center;
     justify-content:center;
   }

   .foot
    {
      width:100%;
      margin-top:300px;
      display:flex;
      height:auto;
      align-items:center;
      border-radius:1%;
      justify-content:center;
    }

    .tmdnav 
    {
      display:none;
    }
}

@media only screen and (min-width:310px) and (max-width:410px)
{   
	body
	{
		margin:0;
		padding:0;
		overflow:hidden;
		font-family:Arial;
		font-size:14px;
		height:780px;
		background:#c8eaf6;
	}

  .desktop
  {
    display:none;
  }

	.poste
	{   
		position:relative;
		margin:10px;
		margin-top:5px;
		width:100%;
		padding-top:10px;
	    background:#fff;
	}

   .poste .post_img
	{   
		margin:0px auto;
		top:20px;
		width:315px;
	}

	.post_img img
	{
		max-width:100%;
		height:auto;
	}

	.poste .post_info
	{   
		padding:12px;
		margin-right:10px;
		margin-top:13rem;
	}

	.post_titles
	{
		display:block;
	}

	.post_title
	{
		display:none;
	}

	.menuhead
	{
		display:none;
	}
    
    .tab
	{
		display:none;
	}

   
.poste .post_img .presentation
  {  
    margin-bottom:-5rem;
    padding-right:0.5rem;
    background-color:#fff;
    width:100%;
  }
  .poste .post_img .presentation h1
  {  
    margin-top:2rem;
    font-size:16px; 
    font-style:italic;
  }

  .poste .post_info .post_titles
  {
      display:block;
      margin-top:-8rem;
  }


	/*partie mdp*/

  .motdp
  {
    padding:1.5rem 1.3rem;
    background-color:#fff;
    height:120px;
    width:100%;
    margin-bottom:15rem;
  }

  .motdp h1
  { 
  	margin-top:-2.8rem;
    padding:1.2rem 0rem;
    padding-top:2rem;
    text-align:center;
    color:#333;
    font-size:1.2rem;
    font-weight: 100;
  }
 .motdp .form
  {
      width:100%;
      margin:2% auto;
      border-radius:0 4px 4px 4px;
      box-shadow:2px 2px 5px rgba(0,0,0,0.1);
      text-align:center;
      border:1px solid lightgrey;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom:5px;
      font-weight: 100;
      font-size:10px;
  }

.motdp .form input[type="text"] , input[type="email"] , input[type="password"]
  {
      display: block;
      height: 30px;
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      border:none;
      border-bottom: 2px solid lightgrey;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea
  {
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

 .motdp .form textarea:focus
  {
      box-shadow: 2px 2px 0px 0px #1ddced;
  }

  .motdp .form input[type="text"]:focus , input[type="email"]:focus , input[type="password"]:focus 
  {
    
     box-shadow: 0px 2px 0px 0px #1ddced;

  }


 .motdp .form input[type="text"]::placeholder , input[type="email"]::placeholder , input[type="password"] ::placeholder
  {
    color:rgba(255,255,255,.5);
  }

  .motdp .form input[type='submit']
  { 
    margin-left:5%;
    margin-top:5%;
    margin-bottom:2%;
    width:50%;
  } 

 .motdp .form .name
  {
      text-align:left;
      margin-left:2%;
      color:#333;
      font-size:1rem;
      font-weight: 100;
  }

  .motdp .form input:required
  {
      background:url(../image/close.png) 98% center no-repeat;
      background-size:10px;
  }

  .motdp .form span
  {
    display:none;
    font-size:14px;
  }

  .motdp .form input:focus:invalid
  {
      border-color:#FF0000;
      background-image:none;
      box-shadow: #d45252 0px 0px 5px;
  }

  .motdp .form input:focus:invalid + span
  {   
      display:block;
      color:#FF0000;
  }

  .motdp .form input:focus:valid
  {
      border-color:#56c93f;
      background-image:none;
      box-shadow: #56c93f 0px 0px 5px;
  }

  .motdp .form input:valid
  {
      background-image:none;
  }

	.footer
    {
     width:100%;
     margin-top:0px;
     display:flex;
     background:url(../../images/icone/monde.jpg) center center no-repeat;
     background-size:cover;
     height:auto;
     align-items:center;
     justify-content:center;
   }

   .foot
    {
      width:100%;
      margin-top:300px;
      display:flex;
      height:auto;
      align-items:center;
      border-radius:1%;
      justify-content:center;
    }

    .tmdnav
    {
      display:none;
    }

}

@media only screen and (min-width:410px) and (max-width:800px)
{   
	body
	{
		margin:0;
		padding:0;
		overflow:hidden;
		font-family:Arial;
		font-size:14px;
		height:680px;
		background:#c8eaf6;
	}

  .desktop
  {
    display:none;
  }

	.tab
	{
		display:none;
	}

	.poste
	{   
		position:relative;
		margin:10px;
		margin-top:5px;
		width:100%;
		padding-top:10px;
	  background:#fff;
	}

   .poste .post_img
	{   
		margin:0px auto;
		padding:5px;
		padding-right:12px;
		top:20px;
		width:95%;
	}

	.post_img img
	{
		max-width:100%;
		height:auto;
	}

	.poste .post_info
	{   
		padding:12px;
		margin-right:10px;
		margin-top:13rem;
	}

	.post_titles
	{
		display:block;
		margin-top:80px;
	}

	.post_title
	{
		display:none;
	}

	.menuhead
	{
		display:none;
	}

	/*partie mdp*/

 .motdp
  {
    padding:1.5rem 1.3rem;
    background-color:#fff;
    height:120px;
    width:100%;
    margin-bottom:18rem;
  }

  .motdp h1
  { 
  	margin-top:-2.8rem;
    padding:1.2rem 0rem;
    padding-top:2rem;
    text-align:center;
    color:#333;
    font-size:1.2rem;
    font-weight: 100;
  }
  .motdp .form
  {
      width:100%;
      margin:2% auto;
      border-radius:0 4px 4px 4px;
      box-shadow:2px 2px 5px rgba(0,0,0,0.1);
      text-align:center;
      border:1px solid lightgrey;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom:5px;
      font-weight: 100;
      font-size:10px;
  }

  .motdp .form input[type="text"] , input[type="email"] , input[type="password"]
  {
      display: block;
      height: 30px;
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      border:none;
      border-bottom: 2px solid lightgrey;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea
  {
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea:focus
  {
      box-shadow: 2px 2px 0px 0px #1ddced;
  }

  .motdp .form input[type="text"]:focus , input[type="email"]:focus , input[type="password"]:focus 
  {
    
     box-shadow: 0px 2px 0px 0px #1ddced;

  }


  .motdp .form input[type="text"]::placeholder , input[type="email"]::placeholder , input[type="password"] ::placeholder
  {
    color:rgba(255,255,255,.5);
  }

  .motdp .form input[type='submit']
  { 
    margin-left:5%;
    margin-top:5%;
    margin-bottom:2%;
    width:50%;
  } 

 .motdp .form .name
  {
      text-align:left;
      margin-left:2%;
      color:#333;
      font-size:1rem;
      font-weight: 100;
  }

  .motdp .form input:required
  {
      background:url(../image/close.png) 98% center no-repeat;
      background-size:10px;
  }

  .motdp .form span
  {
    display:none;
    font-size:14px;
  }

  .motdp .form input:focus:invalid
  {
      border-color:#FF0000;
      background-image:none;
      box-shadow: #d45252 0px 0px 5px;
  }

  .motdp .form input:focus:invalid + span
  {   
      display:block;
      color:#FF0000;
  }

  .motdp .form input:focus:valid
  {
      border-color:#56c93f;
      background-image:none;
      box-shadow: #56c93f 0px 0px 5px;
  }

  .motdp .form input:valid
  {
      background-image:none;
  }

	.footer
    {
     width:100%;
     margin-top:0px;
     display:flex;
     background:url(../../images/icone/monde.jpg) center center no-repeat;
     background-size:cover;
     height:auto;
     align-items:center;
     justify-content:center;
   }

   .tmdnav
   {
     display:none;
   }

}

@media only screen and (min-width:800px) and (max-width: 1000px)
{    
	 body
	{
		margin:0;
		padding:0;
		overflow:hidden;
		font-family:Arial;
		font-size:14px;
		height:650px;
		background:#c8eaf6;
	}

  .mobile
  {
    display:none;
  }
  .desktop
  {
    display:block;
  }
	.menuhead
	{
		display:none;
	}
	.mobilefirst
	{
		display:none;
	}

	.post_title
	{
		display:none;
	}

	.poste
	{   
		padding:20px;
		background:#fff;
	}

	.tmdnav
	{  
	   margin:0 auto;
	   height:200px;
     background:url(../../images/icone/bar.jpg) center center no-repeat;
     background-size:cover;
	}

   .poste .post_img
	{
		position:static;
		width:35%;
		float:right;
	}

	.poste .post_info
	{   
		float:left;
		width:65%;
		margin-right:0;
		padding:20px;
	}

	.post_info .post_text
	{
		float:left;
		width:60%;
		padding-right:30px;
	}

	.post_info .post_list
	{
		float:left;
		width:40%;
		padding-right:30px;
	}

	.tab
	{   
		width:100%;
		height:60px;
		background-color:#1ddced;
		display:flex;
		align-items:center;
		align-content:center;
		justify-content:space-around;
		flex-wrap:wrap;
	}

	.tab a
	{   
		color:#e83e8c;
		text-decoration:none;
	}
    .div
	{
		height:380px;
		overflow:hidden;
		overflow-y:auto;
	}
	.footer
    {
     width:100%;
     margin-top:0px;
     display:flex;
     background:url(../../images/icone/monde.jpg) center center no-repeat;
     background-size:cover;
     height:auto;
     align-items:center;
     border-radius:1%;
     justify-content:center;
   }

   .ecran
   {
   	  float:left;
   	  left:1rem;
   	  right:2rem;
   	  font-size:12px;
   	  font-style:italic;
   	  color:gray;
   }

   /*partie mdp*/

  .motdp
  {
    padding:1.5rem 1.3rem;
    background-color:#fff;
    height:120px;
    width:100%;
  }

 .motdp h1
  { 
  	margin-top:-2.8rem;
    padding:1.2rem 0rem;
    padding-top:2rem;
    text-align:center;
    color:#333;
    font-size:1.2rem;
    font-weight: 100;
  }
  .motdp .form
  {
      width:100%;
      margin:2% auto;
      border-radius:0 4px 4px 4px;
      box-shadow:2px 2px 5px rgba(0,0,0,0.1);
      text-align:center;
      border:1px solid lightgrey;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom:5px;
      font-weight: 100;
      font-size:10px;
  }

 .motdp .form input[type="text"] , input[type="email"] , input[type="password"]
  {
      display: block;
      height: 30px;
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      border:none;
      border-bottom: 2px solid lightgrey;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

 .motdp .form textarea
  {
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea:focus
  {
      box-shadow: 2px 2px 0px 0px #1ddced;
  }

 .motdp .form input[type="text"]:focus , input[type="email"]:focus , input[type="password"]:focus 
  {
    
     box-shadow: 0px 2px 0px 0px #1ddced;

  }


  .poste .post_img .motdp .form input[type="text"]::placeholder , input[type="email"]::placeholder , input[type="password"] ::placeholder
  {
    color:rgba(255,255,255,.5);
  }

  .motdp .form input[type='submit']
  { 
    margin-left:5%;
    margin-top:5%;
    margin-bottom:2%;
    width:50%;
  } 

 .motdp .form .name
  {
      text-align:left;
      margin-left:2%;
      color:#333;
      font-size:1rem;
      font-weight: 100;
  }

  .motdp .form input:required
  {
      background:url(../image/close.png) 98% center no-repeat;
      background-size:10px;
  }

  .motdp .form span
  {
    display:none;
    font-size:14px;
  }

  .motdp .form input:focus:invalid
  {
      border-color:#FF0000;
      background-image:none;
      box-shadow: #d45252 0px 0px 5px;
  }

  .motdp .form input:focus:invalid + span
  {   
      display:block;
      color:#FF0000;
  }

  .motdp .form input:focus:valid
  {
      border-color:#56c93f;
      background-image:none;
      box-shadow: #56c93f 0px 0px 5px;
  }

  .motdp .form input:valid
  {
      background-image:none;
  }

  .marque
  {
    display:none;
  }

}

@media only screen and (min-width:1000px)
{    
	 body
	{
		margin:0;
		padding:0;
		overflow:hidden;
		font-family:Arial;
		font-size:14px;
		height:650px;
		background:#c8eaf6;
	}

  .mobile
  {
    display:none;
  }
  .desktop
  {
    display:block;
  }

	.tab
	{
		display:none;
	}
	.mobilefirst
	{
		display:none;
	}

	.post_title
	{
		display:none;
	}

	.poste
	{   
		padding:20px;
		margin-left:1rem;
		background-color:#fff;
	}

	.tmdnav
	{  
	   margin:0 auto;
	   height:200px;
     background:url(../../images/icone/bar.jpg) center center no-repeat;
     background-size:cover;
	}

   .poste .post_img
	{
		position:static;
		width:35%;
		float:right;
	}

	.poste .post_info
	{   
		float:left;
		width:65%;
		margin-right:0;
		padding:20px;
	}

	.post_info .post_text
	{
		float:left;
		width:60%;
		padding-right:30px;
	}

	.post_info .post_list
	{
		float:left;
		width:40%;
		padding-right:30px;
	}

	.menuhead
	{   
		width:100%;
		height:60px;
		background-color:#1ddced;
		display:flex;
		align-items:center;
		align-content:center;
		justify-content:space-around;
		flex-wrap:wrap;
	}

	.menuhead a
	{   
		color:#e83e8c;
		text-decoration:none;
	}

	.div
	{
		height:400px;
		overflow:hidden;
		overflow-y:auto;
	}

	.footer
    {
     width:100%;
     margin-top:0px;
     display:flex;
     background:url(../../images/icone/monde.jpg) center center no-repeat;
     background-size:cover;
     height:auto;
     align-items:center;
     border-radius:1%;
     justify-content:center;
   }

   .ecran
   {
   	  float:left;
   	  left:1rem;
   	  right:2rem;
   	  font-size:12px;
   	  font-style:italic;
   	  color:gray;
   }

   /*partie mdp*/

  .motdp
  {
    padding:1.5rem 1.3rem;
    background-color:#fff;
    height:120px;
    width:95%;
  }

  .motdp h1
  { 
  	margin-top:-2.8rem;
    padding:1.2rem 0rem;
    padding-top:2rem;
    text-align:center;
    color:#333;
    font-size:1.2rem;
    font-weight: 100;
  }
 .motdp .form
  {
      width:100%;
      margin:2% auto;
      border-radius:0 4px 4px 4px;
      box-shadow:2px 2px 5px rgba(0,0,0,0.1);
      text-align:center;
      border:1px solid lightgrey;
      padding-left:5px;
      padding-right:5px;
      padding-top:5px;
      padding-bottom:5px;
      font-weight: 100;
      font-size:10px;
  }

  .motdp .form input[type="text"] , input[type="email"] , input[type="password"]
  {
      display: block;
      height: 30px;
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      border:none;
      border-bottom: 2px solid lightgrey;
 
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea
  {
      font-size: 15px;
      text-indent:5px;
      width:100%;
      border-radius:3px;
      margin-top:2%;
      margin-bottom:1%;
      color: #2b2b2b;
      outline: none;
      -webkit-transition:.2s;
      -moz-transition:.2s;
      -ms-transition:.2s;
      -o-transition:.2s;
  }

  .motdp .form textarea:focus
  {
      box-shadow: 2px 2px 0px 0px #1ddced;
  }

  .motdp .form input[type="text"]:focus , input[type="email"]:focus , input[type="password"]:focus 
  {
    
     box-shadow: 0px 2px 0px 0px #1ddced;

  }


  .motdp .form input[type="text"]::placeholder , input[type="email"]::placeholder , input[type="password"] ::placeholder
  {
    color:rgba(255,255,255,.5);
  }

  .motdp .form input[type='submit']
  { 
    margin-left:5%;
    margin-top:5%;
    margin-bottom:2%;
    width:50%;
  } 

 .motdp .form .name
  {
      text-align:left;
      margin-left:2%;
      color:#333;
      font-size:1rem;
      font-weight: 100;
  }

  .motdp .form input:required
  {
      background:url(../image/close.png) 98% center no-repeat;
      background-size:10px;
  }

  .motdp .form span
  {
    display:none;
    font-size:14px;
  }

  .motdp .form input:focus:invalid
  {
      border-color:#FF0000;
      background-image:none;
      box-shadow: #d45252 0px 0px 5px;
  }

  .motdp .form input:focus:invalid + span
  {   
      display:block;
      color:#FF0000;
  }

  .motdp .form input:focus:valid
  {
      border-color:#56c93f;
      background-image:none;
      box-shadow: #56c93f 0px 0px 5px;
  }

  .motdp .form input:valid
  {
      background-image:none;
  }

  .marque
  {
    display:none;
  }

}