body 
{
   background-color: #fff;  
  font-family: ''Roboto Condensed'', sans-serif;
	
}
/* Mise en forme des titres */

small 
{font-size: 12px;}

h1,h2,h3,h4
{
	font-family: ''Roboto Condensed'';
	font-style: none;
	color:#1b2836;
	padding: 10px;
	font-weight:700;
	margin-top:20px;
}

h1,h2,pre
{
text-align: center;	
}

h3
{
  padding-left:2px;
}

/* Mise en forme paragraphe p */

p
{
  padding:0 2px ;
}

a{
	color:#44bfe3;
	font-weight:700;
}

/* Mise en forme header */
header 
{
  padding: 15px;
  margin: 0px;
  float: top;
  background-color: #fff;
}

header h1
{
	color:#1b2836;
	text-transform:uppercase;
  	margin : 0.1em 0;
}

/* Mise en forme logo */
.logo 
{
  height: 100px;
  width: 100px;
  top: 10px;
  left: 10px;
  margin-right:10px;
  border:none;
  vertical-align:middle;
}

/* Mise en forme nav */
nav, footer 
{
padding: 15px 0;
margin-top: 5px;
margin-bottom: 5px;
background-color : white;
display: flex;
justify-content: center;
flex-wrap: wrap;

	  
}

nav {
		border-bottom: 1px solid #e6e6e6;
	border-top: 1px solid #e6e6e6;

}

footer {
	width:70%; 
	border-top: 1px solid #e6e6e6;
	margin-top:3% !important;
}

nav ul, footer ul 
{ 
  width: 80%;
  margin:0;
  padding:0;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}

nav ul li, footer ul li 
{ 
  list-style-type: none;
}

nav ul li a, footer ul li a 
{ 
  text-decoration: none;
  vertical-align: middle;
	color:#707070;
	font-size:1.2em;
	padding:5px;
}

nav ul li a:hover, footer ul li a:hover 
{ 
  color: white;
  background-color: #1b2836;
}

.highlight-link > a 
{
    border: none;
    background-color: rgba(200,200,200,.25);
    /*color: #000;*/
    padding: 0.3em 1em;
    margin-left: 0.6em;
    margin-right: 0.6em;
    border-radius: 30px;
}

nav form 
{ 
  width: 40%;
}

nav form input.button
{ 
  color: white;
  background-color: #1b2836;
}

nav ul li a.current-item, footer ul li a.current-item, nav ul li input.current-item {
	color: #44bfe3;
}

/* Mise en forme main */
main 
{
  width: 70%;
  margin-left: 15%;
  margin-right: 15%;

  font-style: normal;
  background-color: white;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

/* Mise en forme class notaside regroupant section et article */

.notaside
{
  width: 70%;
  margin: 0;  
  padding: 0;
}

/* Mise en forme section */
section
{
  padding: 15px 0;
  width: 100%;
}

/* Mise en forme article */
article
{
  padding: 5px 0;
}

/* Mise en forme aside */

aside 
{
  width: 25%;
  padding-left: 15px;
  padding-right: 5px;
  font-style: italic;
  background-color: lightgray;
}

/* Mise en forme footer */
footer
{
  /*width: 70%; */
  margin-top: 5px;
  float: left;
  font-style: normal;
  text-align: center;
  background-color: white;
}

/* specific layout */

.tabcodiftable
{
  table-layout: fixed;
  width: 100%;
  word-wrap: break-word;
}	

.tabcodiftableMax
{
  table-layout: fixed;
  width: 100%;
  word-wrap: break-word;
}	

div.tableEncapsulate
{
	width:100%;
}

ul.TwoColumns
{
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
}

div.yt
{
	width:100%;
	text-align: center;
}

table { border-collapse: collapse; }

td + td ,
th + th { border-left: 1px dotted; }
tr + tr { border-top: 1px  dotted; }

.pad
{ 
	padding: 5px;
}

@media screen and (min-width:1026px) 
{
  /* CSS for screens that are 1026 pixels or more will be put in this section */
	header 
	{
	  height: 15%;
	}
	nav, footer 
	{
	  height: 15%;
	  margin-left: 15%;
	  margin-right: 15%;
	}	
	footer
	{
	  margin-left: 15%;
	  margin-right: 15%;
	}
	textarea[name="Adresse"]
	{
		/* width:55em;*/
	}
}

@media screen and (max-width:1025px) 
{
  /* CSS for screens that are 1025 pixels or less will be put in this section */

  /* removing space on the side */
  nav, footer, main 
  {

      width:100%;
      margin-left: 2px;
      margin-right: 2px;
  }
	textarea[name="Adresse"]
	{
		/*width:40em;*/
	}
}
@media screen and (max-width:710px) 
{
  /* CSS for screens that are 710 pixels or less will be put in this section */

  /* aside is put underneath*/
  /* search form is put on a second line*/
	aside, .notaside, nav form, nav ul
	{
		width:100%;
	}
	nav form
	{
		text-align: center;
		width: 80%;
	}
	.logo 
	{
	  height: 75px;
	  width: 75px;
	}
	main 
	{
	  width: 100%;
	  margin-left: 2%;
	  margin-right: 2%;
		
	}
	aside 
	{
	  display:none;
	  width: 0%;
	}
	pre
	{
	    white-space: pre-wrap;
	}
	.hidesmall
	{
		display:none;
	}
	textarea[name="Adresse"]
	{
		 width:20em; 
	}
	select {
        width: 90%;
    }
}
@media screen and (max-width:350px) 
{
	nav ul 
	{
		display:block;
		text-align: center;
	}
	header
	{
		height: 1.5em;
		padding: 2px;
	}
	section, article
	{
		padding: 2px 0;
	}
	h1
	{
		font-size:1.4em;
		margin: 1px;
	}
	h2
	{
		font-size:1.2em;
		margin: 1px;
	}
	h3
	{
		font-size:1em;
		margin: 2px;
	}
	p
	{
		margin-block-start: 2px;
	}
	.logo 
	{
		height: 30px;
		width: 30px;
	}
	aside 
	{
		display:none;
		width: 0%;
	}
	.notaside
	{
		width: 100%;
	}
	nav, footer 
	{
		width:100%;
	}	
	nav form
	{
		width: 100%;
	}
	nav ul, footer ul 
	{ 
		width: 100%;
	}
	pre
	{
	    white-space: pre-wrap;
	}
	.hidesmall
	{
		display:none;
	}
	textarea[name="Adresse"]
	{
		width:15em;
	}
	select {
        width: 90%;
    }
}