*{
	margin:0px;
	padding:0px;
}
@font-face { 
    font-family: 'cac_champagneregular';
    src: url('cac_champagne-webfont.eot');
    src: url('cac_champagne-webfont.eot?#iefix') format('embedded-opentype'),
         url('cac_champagne-webfont.woff2') format('woff2'),
         url('cac_champagne-webfont.woff') format('woff'),
         url('cac_champagne-webfont.ttf') format('truetype'),
         url('cac_champagne-webfont.svg#cac_champagneregular') format('svg');
    font-weight: normal;
    font-style: normal;
 }



/* Extra small devices (phones, up to 480px) */
/* No media query since this is the default in Bootstrap */
@media (min-width: @screen-phones) {
  .grid-container {
	grid-template-columns: auto ;
	}

	
}
/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-tablet) {
  .grid-container {
	grid-template-columns: auto;
  }
}

/* Medium devices (tablets, 992px and up) */
@media (min-width: @screen-desktop) {
  .grid-container {
	grid-template-columns: auto;
  }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-large-desktop) {
  .grid-container {
	grid-template-columns: auto;
  }
}

/* Sur tous types d'écrans orientés verticalement */
@media all and (orientation: portrait){
  .grid-container {
    max-width: auto;
  }
}


.container {
  display:grid;
  margin: 2rem ;
  padding: 0.5rem 0.5rem 0 0.5rem;
  border: 0.1rem solid transparent; 
  margin-bottom:-60px;
  
}


.grid-container {
  display:grid;
  text-align:center; 
  
  margin: 0.20rem ;
  padding: 0.5rem 0.5rem 0 0.5rem;
  border: 0.1rem solid transparent;
  margin-bottom:0px;
background-color: #424242;
  }



/* .form__field label { */
  /* color: #888888; */
  /* display:flex-inline-table; */
  /* font-size: 2rem; */
  /* line-height: 2rem; */
  /* padding-top: 1.5rem; */
/* } */

/* @media all and (max-device-width: 320px) { */
   /* .container { */
    /* max-width: auto; */
  /* } */
/* } */

/* @media all and (max-device-width: 480px) { */
   /* .container { */
    /* max-width: auto; */
  /* } */
/* } */

/* @media (min-width: 900px) { */
  /* .container { */
    /* max-width: auto; */
  /* } */
/* } */

 

/* Sur tous types d'écran, quand la largeur de la fenêtre est comprise entre 1024px et 1280px */
/* @media all and (min-width: 1024px) and (max-width: 1280px) { */
/* .container { */
    /* max-width: auto; */
  /* } */
/* } */

/* Sur les écrans, quand la largeur de la fenêtre fait au maximum 1280px */
/* @media screen and (max-width: 1280px) { */
/* .container { */
    /* max-width: auto; */
  /* } */
/* }  */

/* Sur les téléviseurs */
/* @media tv */

/* Sur tous types d'écrans orientés verticalement */
@media all and (orientation: portrait) {
  .container {
    max-width: auto;
  }
}

a:link, a:visited {
	color:#88888;
	text-decoration:none;
}

a:active /* Quand le visiteur clique sur le lien */
{
    background-color: #0033FF;
	
}

a:hover {
	color:#0033FF;
	text-decoration:underline;
	transform : scale(1.5);
	transition: transform 400ms;
}

#menu{ display: flex-inline-table; width: auto; height : auto; margin: auto;text-align:left; }
#sousmenu1{ display: flex-inline-table; width: auto; height : auto; margin: auto;text-align:left; }



header { */
    text-align:center;
	font-family: Helvetica, Arial, sans-serif ;
	font-size:12px  ;  
	padding-bottom:auto;

}

article{
	display:flex-inline-table;
	text-align:left;
	font-family: Helvetica, Arial, sans-serif ;
	margin-top:;
	padding-bottom:20px;
	font-size:12px  ;
}

aside {
	display:flex-inline-table;
	text-align:left;
	font-family: Helvetica, Arial, sans-serif ;
	padding-bottom:130px;
	font-size:12px  ;
	min-width:250px;
}

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@1,200&display=swap');

html {

	background:#888888; /*#FFFF;*/
	overflow: auto;
	margin:0px;
	padding:auto;
	width:auto;
	text-align:center;
	font-family: 'IBM Plex Serif', serif;
	margin-right:-800px;
}

body {
	display:flex; 
	width:100%;	
	color:#888888;	
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	padding:auto;
	padding-bottom: 60px;
	padding-right:900px;
	

}
#grid {

	background:transparent ;
 	display:grid;	
	font-family: Helvetica, Arial,'Play', sans-serif;
    text-align:center;
    color:#888888;
    width:50%;
	font-size:12px  ;
	
	margin-left:-135px;
	padding-left:150px;
	
	padding-top:100px;
	font-family: 'IBM Plex Serif', serif;
	padding-bottom: 00px;
	
	

}

#bg1 {

	background:transparent ;
 	display:grid;	
	font-family: Helvetica, Arial,'Play', sans-serif;
    text-align:left;
    color:#888888;
    width:30%;
	font-size:12px  ;

	margin-left: 550px;
	padding-right:100px;
	padding-top:120px;
	font-family: 'IBM Plex Serif', serif;

	
}

#bar {
	
  /* padding-top:5px; */
  /* margin-left:-5px; */
  /* margin-right:-5px; */
  /* margin-bottom:10px; */
  width: auto;
  height: auto;
  text-align:left;
  font-size: 1rem;
  line-height: 1.5rem;
  background-color: #888888;
 /* color:#424242;*/
 color:#fff;
}

mark{
	 color: clear green;
}

p {
	text-align:left;
	padding-left:200px;
	padding-bottom:5px;
}

h3 {
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	color:#888888;
	clear:both;
	text-decoration :blink;
	text-align:center;
}

h4 {
	
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	color:#888888;
	clear:both;
	text-decoration :blink;
	text-align:center;
 
}
h5 {
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	color:#888888;
	font-size:25px ;
	clear:both;
	text-decoration :blink;
	text-align:center;       
}

h6 {
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	color:#888888;
	font-size:13px ;
	clear:both;
	padding:auto;
	text-decoration :blink;
	text-align:center;
	      
}

h7 {
	font-family: 'cac_champagneregular', Helvetica, Arial, sans-serif ;
	color:#888888;
	font-size:12.5px ;
	clear:both;
	padding:auto;
	text-decoration :blink;
	text-align:center;
	      
}


#p {
	display: flex;
	font-family: Helvetica, Arial, sans-serif ;
	margin:10px;
	font-size:12px;
	color:#888888;
	letter-spacing: justify ;
	padding:10px;
	text-align:left;

}



nav {
	display: flex-inline-table;
	flex-direction: column;
	padding:15px;
	height:auto;
	width:100%;	
	text-align:center;
	font-size: 15px;
	font-family: Helvetica, 'Play', sans-serif;

}


 ul {
	display:inline-table;
	min-width:auto;	
	margin: auto;
	padding:auto;
	list-style-type:none;
	position:left;
	height:auto;
	text-transform:uppercase;
	font-size:11px;
    width:auto;
       
	
}



 ul li a:hover{
	color:#0033FF;
	background:transparent url("image/hmenu-sel.jpg") repeat-x top right
}
	
 li {
	 padding:5px;	 
 }


img{
display: flex-inline-table;
max-width: auto;
height: auto;
padding:6.5px;

}





meter {
  /* Reset the default appearance */
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;

  margin: 0 auto 0.1em;
  width: 80%;
  height: 0.5em;

  /* Applicable only to Firefox */
  background: none;
  background-color: whiteSmoke;
 
}

meter::-webkit-meter-bar {
  background: none;
  background-color: whiteSmoke;
 
}

div
{
    background-image: linear-gradient(to top, rgba(0,0,0,0), rgba(0,0,0,1));
}

 

.grid-container1 {
  display:grid;
  text-align:center;
 
  
  margin: 0.5rem ;
  padding: 1.5rem 1.5rem 0 0.5rem;
  border: 0.1rem solid transparent;
  margin-bottom:auto;
background-color: #424242;
  }  

.main_footer {
	background-color: #242424;
    display:grid;
	font-family: Helvetica, Arial,'Play', sans-serif;
	text-align:center;
    background:transparent ;
    color:#888888;
	margin-bottom:auto;
	padding-bottom: auto;
	margin-left: 80px;
	

}