* {
	box-sizing: border-box;
	scroll-behavior: smooth;
}
#page-main {
	margin: 0px auto;
	padding: 0;
	display: flex;
	justify-content: space-around;
	justify-content: center;
}

main {
	margin-bottom: 10px;
	padding: 15px;
	/*color: #B3B3B3;*/
	/*background-color:rgb(60,60,60);*/
	background-color: black;
	background-repeat: repeat;
	/*background-color: #626262;*/
	/*background-color: black;*/

	/*border: 2px solid black;*/
	border-radius: 13px;
	text-align: justify; /*on justifie le texte présent dans le corps*/
	box-shadow:0px 0px 10px #000000,0px 0px 10px #000000,0px 0px 5px #000000;
	color: white;
	font-family: sans-serif;
}
/*simulation touches claviers : Controle du lecteur avec le clavier : https://sebsauvage.net/wiki/lib/exe/css.php?t=dokuwiki&tseed=cb64682d4fc81d5b79f586d31f99b6b0*/
kbd {
	font-family: monospace;
	background-color:#F2F2F2;
	border-style:outset;
	border-width:3px;
	border-radius:.3em;
	padding:0 2px !important;
	color: black;
}

main h1, main h2, main h3, main h4, main h5 {
	color: #F26615;
	/*font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;*/
	font-family: sans-serif;
	font-weight: 500;
}
main h1 {
  font-size: 3rem;
  font-weight: normal;
  margin-bottom: 1rem;
  margin-top: 1rem;
  padding-left: 0; /* Réinitialiser la valeur de padding */
}

main h2 {
  font-size: 2rem;
  font-weight: normal;
  margin-top: 2rem;
  margin-bottom: 0.1rem;
  padding-left: 1rem; /* Ajouter une valeur de padding */
}

main h3 {
  font-size: 1.5rem;
  font-weight: normal;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
  padding-left: 2rem; /* Ajouter une valeur de padding */
}

main h4 {
  font-size: 1.3rem;
  font-weight: normal;
  margin-top: 1rem;
  margin-bottom: 0.1rem;
  padding-left: 3rem; /* Ajouter une valeur de padding */
}

main h5 {
  font-size: 1.2rem;
  font-weight: normal;
  margin-top: 1rem;
  margin-bottom: 0.1rem;
  padding-left: 4rem; /* Ajouter une valeur de padding */
}
[class*="menu"] a:hover {
  background-color: none;
  text-decoration: none;
  color: #F77F7F;
  transition: color 0.3s ease;
}
[class*="menu"] a:visited, main a:visited, #pied_de_page a:visited /*quand le visiteur à déja vu la page concernée*/
{
  text-decoration: none;
}

body
{
	/*width: 764px;*/
	width: auto;
	margin: auto;
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	background-image: url("../images/layout/puce.jpg");
	background-repeat: repeat-x; /*l'image est répété uniquement sur la première ligne, horizontalement*/
	background-color: #f6f6f6;
	
}
::selection{
	color: black;
	background: #5cf;
}

#en_tete
{
	height: 194px;
	background-image: url("../images/layout/banniere_01.webp");
	background-position: left;
	background-size:     cover; 
	background-repeat: no-repeat;
	margin-bottom: 10px;
	border-radius: 13px;
	box-shadow:0px 0px 10px #000000,0px 0px 10px #000000,0px 0px 5px #000000;
}



.k_control 
{
	color: ghostwhite;
	text-shadow:0px 0px 1px #000000,0px 0px 1px #000000,1px 1px 1px #000000;
}
strong, main b
{
	color: #ff5722;
	padding-left: 2px;
	padding-right: 2px;
	font-weight: initial;
font-family: sans-serif;
}
main a
{
  color: #ffa500;
  text-decoration: underline;
  margin-left: 0px;
  transition: background-color 0.1s ease-in;
}

main a strong, main a b
{
	font-size: 100%;
	font-family: sans-serif;
}

#pied_de_page a:hover, main a:hover /*signifie dessus, permet ici la surbrillance des liens lors du passage du curseur dessus*/
{
	background-color: darkslateblue;
	text-decoration: none;
	color: #F77F7F;
	text-decoration: underline;
	
}
main ul li:not(#sommaire ul li) { padding-top: 0px; }
/*permet les puces en orange*/
main ul {
	list-style: none;
}
main li::before
{
	margin-left: -1em;
        content: '';
        margin-right: 11px;
        background-color: #F26615;
        height: 12px;
        width: 12px;
        margin-top: -4px;
        display: inline-block;
        border-radius: 50%;
        vertical-align: middle;
	/*box-shadow: 1px 1px 1px #000000,1px 1px 1px #000000,1px 1px 1px #000000;*/
}
main ul * li::before
{
        height: 8px;
        width: 8px;
}
/*fin puces en orange*/

#pied_de_page
{
	padding: 13px;
	font-weight: bold;	/*permet de mettre en gras*/
	font-size: medium;
	text-align: center;
	background-image: url("../images/layout/bottom.webp");
	color: #B3B3B3;
	/*background-color: #626262;*/
	border-radius: 13px;
	font-family: sans-serif;
	box-shadow: 7px 10px 5px #888888,0px 0px 10px #000000,0px 0px 5px #000000;
	background-position: center;
}
#pied_de_page a
{
	font-size: medium;
	text-decoration: none;
	color: #F26615;
}
.rss:hover {
	opacity: .5;
}

/*----------------------------------------
----------Les Tableaux--------------------
----------------------------------------*/
table {
  width: auto;                     /* largeur automatique, s’adapte au contenu */
  border-collapse: collapse;       /* fusionne les bordures des cellules */
  margin: 20px 0;                  /* espace de 20px en haut et en bas du tableau */
  font-size: 0.95em;                /* taille de police légèrement réduite */

  color: #222;                     /* couleur du texte (gris très foncé) */
  background-color: #f9f9f9;       /* fond clair du tableau */
  border: 1px solid #ccc;          /* contour fin et discret du tableau */
  border-radius: 10px;             /* coins arrondis du tableau */
  overflow: hidden;                /* masque tout débordement (utile avec les arrondis) */
}

thead tr {
  background-color: #ffefe6;       /* couleur de fond orangée claire pour l’en-tête */
  color: #c1440e;                  /* texte de l’en-tête en orange foncé */
  text-align: left;                /* alignement du texte à gauche */
  font-weight: bold;               /* met le texte de l’en-tête en gras */
  border-bottom: 2px solid #e0e0e0;/* ligne de séparation plus épaisse sous l’en-tête */
}

th, td {
  padding: 10px 14px;              /* espace interne dans chaque cellule (haut/bas 10px, gauche/droite 14px) */
  border-bottom: 1px solid #e0e0e0;/* ligne de séparation entre chaque ligne du tableau */
}

tbody tr:nth-of-type(even) {
  background-color: #f1f1f1;       /* couleur de fond légèrement grise pour les lignes paires (effet zébré) */
}

tbody tr:hover {
  background-color: #ffe9d6;       /* changement de couleur de fond quand la souris survole une ligne */
}
caption /*titre du tableau*/
{
	margin: auto;
	font-family: sans-serif;
	font-weight: bold;
	font-size: medium;
	color: blue;
	margin-bottom: 20px; /*pour éviter que le titre ne soit trop coller au tableau*/
}
.centrer 
{
	text-align: center; /*centrer le texte*/
}
.signature
{
	border: transparent;
	text-align: center; /*centrer le texte*/
        padding: 2px; /*évite aux cellules d'être trop collé au texte*/
        padding-right: 0px;
        /*background-color: blue;*/
        background-color: transparent;
        color: white;
        font-size: 16px;
	background-image: none;
        font-family: Arial;
	text-shadow:0px 0px 5px #000000,0px 0px 5px #000000,0px 0px 5px #000000;
}
.red {
	/*color: red;
	color: #FF7A7A;
	color: #FF642E;*/
	color: #FC674F;
	font-weight: bold;
}
.green {
	color: greenyellow;
	font-weight: bold;
}
.orange {
	color: orange;
	font-weight: bold;
}


/*---Code---*/
/*code.code, pre.code, pre.code_sh, pre.code_ps */
code.code_ps, pre.code_ps /*pour les commandes utilisateurs*/
{
	background-color: #F3F5F7;
	color: black;
	font-family: consolas, monospace!important;
	border: 2pt solid black;
	display: block;
	font-size: 1.2em;
}
.code,
code,pre.code_sh,code.code_apache,code.code_python,code.code_sh,code.code_php,code.code_batch {
  overflow:auto;
  white-space: pre;
  font-size: .8em;
  margin: .5em 0;
  font-family: 'courier new', monospace;
  padding: 1em;
  overflow-x: auto;
  border-radius: 14px;
  display: block;
  border: 3pt solid white;
  background-color: #1e1e1e;
  color: #ffffff;
}
code.cisco {
	background-color: white;
	color: black;
	border: 3pt
}
p code, li code, td code, figcaption code {
  font-family: 'Courier New', Courier, monospace;
  white-space: wrap;
  word-break: break-word;
  display: inline;
  background-color: #f4f4f4;
  padding: 0.2em 0.4em;
  border-radius: 4px;
  color: #c7254e;
  font-size: 0.9em;
  padding: 0.1vw;
  border: none;
}
/*----------------------------------------
------------------LES IMAGES--------------
----------------------------------------*/
.images_autosize
{
	/*display: block;*/
	max-width: 100%;
	height: auto;
}
.images_autosize_white
{
	/*display: block;*/
	max-width: 100%;
	height: auto;
	background-color: white;
}
figure, .images_autosize_center
{
	display: block;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}
figure img, .images_autosize_center_white
{
	display: block;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
	color: black;
}
figure img
{
	display: block;
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: transparent;
	color: black;
}
.centrer_image
{
	/*margin-top: 0px;
	margin-left: 80px;*/
	  display: block;
	  margin-left: auto;
	  margin-right: auto;
	  /*width: 50%;*/
}
div.images_big
{
        /*width: 500px;*/
	min-width: 200px;
        width: 30%;
	margin-top: 0px;
	margin-left: 15px;
}
div.images_big > img
{
        width: 100%;
}
/*ajouter un espace si image puis balise h*/
main :is(.images_autosize40, .images_autosize60, .images_autosize80, .images_autosize20, .images_autosize_center80, .images_autosize_center60, .images_autosize_center40, .images_autosize_center20) + h4,
main :is(.images_autosize40, .images_autosize60, .images_autosize80, .images_autosize20, .images_autosize_center80, .images_autosize_center60, .images_autosize_center40, .images_autosize_center20) + h5,
main h5 + :is(.images_autosize40, .images_autosize60, .images_autosize80, .images_autosize20, .images_autosize_center80, .images_autosize_center60, .images_autosize_center40, .images_autosize_center20),
main h4 + :is(.images_autosize40, .images_autosize60, .images_autosize80, .images_autosize20, .images_autosize_center80, .images_autosize_center60, .images_autosize_center40, .images_autosize_center20)
{
	margin-top: 1vw;
}
/*----------------------------------------
--tabulation---
----------------------------------------*/
.tab
{
	margin-left:4em;
}
main ul li a * { 
	font-weight: normal;
	padding: 0px;
	background-color: inherit;
}
main ul + picture img, main p + picture img, main ul + img {
  margin-top: 0.2em;
}
figcaption {
  font-size: 0.9em;             
  color: #ccc;
  margin-top: 0.3em;            
  font-style: italic;           
  line-height: 1.4;             
  text-align: center
}