body {
background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#262626;
background-size:16px 16px;
	/* background-color: #242424; */
	margin: 20px;
	margin-bottom: 30px;
	font-size: 1em;
	font-family: "Trebuchet MS", Verdana, Arial, serif;
	color: #B3B3B3;
	}

/* ===================== LES TITRES ET PARAGRAPHES ============== */
h1 {
	font-size: 2em;
	text-align: center;
	border-bottom: 1px solid yellow;
	}
h2 {
	font-size: 1.2em;
	}
h3 {
	font-size: 1.2em;
	}
p {
	font-size: 1em;
	}
p:first-letter { /*1ère lettre du paragraphe*/
	font-size: 1.5em;
	font-weight: bold;
	color: #FFC900;
	}

/* ===================== LIENS =================================== */
a {  /*liens*/
	text-decoration: none;
	color: #FFFF99;
	}
a:hover {  /*liens survolés*/
	text-decoration: none;
	font-weight: bold;
	color: orange;
	}
a:visited {  /*liens visités*/
	}
a:active, a:focus { /*liens au moment de l'activation*/
	background-color: #FFA500;
	color: #FFFFFF;
	}
a img {	/*les liens avec une image*/
	border: none; /*1px solid #FFFF66;*/
	vertical-align:middle;
	}
	
/* ======================== class persos ================== */
.flottant_fin {	clear: both; }
.flottant_g { float: left; }
.flottant_d { float: right; }
.gauche { text-align: left; }
.droite { text-align: right; }
.centre { text-align: center; }
.petit { font-size: 0.8em; }
.liste_ss_puce { list-style-type: none;	}
.milieu {vertical-align: middle; }
.lettrine { /*1ère lettre */
	font-size: 1.5em;
	font-weight: bold;
	color: #FFC900; 
	}


/* ==================== titre ====================== */
.titre {
	width:100%;
	}

/* ==================== Pied de Page ====================== */
.pied {
	margin: 0 auto;
	width: 50%;
	background-color: #525252;
	}

.pied_contenu {
	margin: 0 auto;
	width: 100%;
	text-align:center;
	font-size: 1.5em;
	text-shadow: 2px 2px 3px black;
	color: #B3B3B3;
	}

/* ======================== boutons new ================== */

.commandes_accueil {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	margin-bottom: 40px;
	}

.commandes_bis {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	margin-bottom: 30px;
	}

.bp {
	background-color: #525252;
	padding: 15px;
	font-size: 2.5em;
	font-weight: bold;
	border: 2px solid #B3B3B3;
	}
.bp-invisible {
	background-color: #525252;
	padding: 15px;
	color: #525252;
	font-size: 2.5em;
	font-weight: bold;
	border: 2px solid #B3B3B3;
	}
.bp-invisible a {
	color: #525252;
	}
/* ======================== bouton direct serveur =============== */
.titre_direct {
	width: 80%;
	margin: 0 auto;
	font-size: 1.2em;
	margin-bottom: 10px;
	}

.boutons_direct {
	background-color: #525252;
	color: #B3B3B3;
	width: 80%;
	margin: 0 auto;
	text-align:center;
	font-size: 1.2em;
	text-shadow: 2px 2px 3px black;
	}

/* ======================== option ctrl ================== */

.options_ctrl {
	width:100%;
	margin-top: 7px;
	margin-bottom: 20px;
	background-color:#424242;
	font-size: 1.2em;
	text-align: center;
	}

.iframe_ctrl {
	width:100%; height:100%;
	margin-top: 0px;
	margin-bottom: 0px;
	background-color:#b2b2b2;
	font-size:1.2em;
	}

.iframe_ctrl_all {
	width: 100%;
	margin: 0 auto;
	height: 420px;
	background-color:#ffffff;
	border:2px dotted;
	}

/* ======================== gallerie ================== */
.gall {
	width: 90%;
	margin: 0 auto;
	}

.iframe_gall {
	width: 100%;
	height: 1200px;
	background-color:#ffffff;
	border:2px dotted;
	}
	
/* ======================== connex ================== */
.connex {
	font-size: 2em;
	}