body {
	background-color: grey;
	font-family: monospace;
}

table {
	font-size: 1.2em;
}

h1 {
	text-align: center;
	color: #1b91d6;
	font-weight: bold;
}

hr {
	margin-top: 20px;
	margin-bottom: 10px;
}

a, a:visited:not(.nav) {
	color: rgb(27, 145, 214);
	text-decoration: none;
}

a > img {
	display: block;
}

pre {
	font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, monospace;
}

.fonted {
	font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, monospace;
}

.important {
	color: #1b91d6;
}

#main {
	width: 1000px;
	background-color: white;
	border-radius: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	margin: auto;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#banniere {
	width: 100%;
	margin-bottom: 0px;
}

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

.centerFlex {
	align-items: center;
}

.red {
	color: red;
}

.centerDiv {
	margin:auto;
}

.allsize {
	width: 100%;
}

.fullsize {
	width: 95%;
}

.midsize {
	width: 60%;
}

.tiersize {
	widh: 30%;
}

.big {
	font-size: 1.6em;
}

.fll {
	float: left;
	margin-left: 10px;
}

img.enlarge:hover {
	transition: all .3s ease-in;
	opacity: 1;
	transform: scale(1.15);
	color: red;
}

@media screen and (max-width: 1050px) {
	#main {
		width: 93vw;
	}
	.big {
		font-size: 1.4em;
	}
	.midsize {
		width: 90%;
	}
}

.flex {
	display: flex;
	flex-flow: row wrap;
}

.flex-column {
	display: flex;
	flex-flow: column wrap;
	align-items: center;
}

.flex-center {
	justify-content: center;
}

/* articles */

.article div img, .article tr th img
{
	width: 15vw;
	background-color: #b0b0b0;
	padding: 5px;
	border-radius: 5px;
}

.article-img {
	padding-right: 10px;
	align-self: flex-start;
}

.article-desc {
	background-color: rgb(220, 235, 250);
	border-radius: 5px;
	text-align: left;
	margin-bottom: 5px;
	padding-top: 12px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	align-self: flex-start;
	flex: 2;
}

.article-desc pre, pre.forced {
	white-space: pre-wrap;
	display: inline-block;
	width: 100%;
}

.article-admin {
	position: bottom;
}

.article {
	flex-flow: row wrap;
}

.article table {
	border-radius: 10px;
	background-color: white;
	border: 1px solid grey;
	border-spacing: 0;
}

.caution {
	background-color: #bed2f9;
}

th.caution {
	border-radius: 10px 0px 0px 0px;
}

td.caution {
	border-radius: 0px 0px 0px 10px;
}

progress {
	width: 100%;
	height: 22px;
}

table.article input, table.article textarea {
	width: 100%;
}

.icon {
	width: 24px;
	display: inline-block;
}

.tiersize {
	width: 45%;
}

.button {
	font: bold 1.4em Arial;
	text-decoration: none;
	background-color: white;
	/* color: #333333; */
	padding: 2px 6px 2px 6px;
	border-top: 1px solid #AAAAAA;
	border-right: 1px solid #AAAAAA;
	border-bottom: 1px solid #AAAAAA;
	border-left: 1px solid #AAAAAA;
	border-radius: 5px;
}

.button:hover {
	background-color: #1b91d6;
	color: white;
	box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 0px 20px 0 rgba(0, 0, 0, 0.19);
	transition: 0.3s;
}

a.button:hover {
	color: white;
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
}

.padded {
	padding: 20px;
}

.promo {
	text-decoration: line-through;
	color: grey;
}

hr.smallMargins {
	margin-top: 10px;
	margin-bottom: 0px;
}

.marged {
	margin: 5px;
}

.left {
	text-align: left;
}

.bold {
	font-weight: bold;
}

.highlight {
	color: #0d6498;
}

/* ciblage des mobiles */
@media all and (max-device-width: 480px)
{
	#main {
		width: 93vw;
	}
	.midsize {
		width: 90%;
	}
	td {
		font-size: 1.5em;
	}
	th {
		font-size: 1.6em;
	}
	.article {
		flex-direction: column;
		align-items: stretch;
	}
	.article-img, .article-desc {
		align-self: center;
	}
	.article-desc {
		width: 100%;
	}
	.article div img, .article tr th img {
		flex: 2;
		width: 85vw;
	}
}
