@import url(/static/css/vars.css);

html {
	background:var(--backgroundHtml);
	margin: 0;
    	padding: 0;
    	height: 100%;
}
body {
	font-family: sans-serif;
	background:var(--backgroundBody);
}
div {
	background:var(--backgroundFormColor);
	border:1px solid var(--borderColor);
	border-radius:var(--radius);
	display:block;
	margin:.5em auto;
	width:25em;
}
div#main {
	background: none;
	border:0;
	border-radius:0;
	padding:2em;
}
header {
	background:url(/static/images/512x512bb-jevalide.png);
	background-size: contain;
	background-repeat: no-repeat;
	padding-left:7vh;
	height:5vh;
	font-size:2.5vh;
	color:white;
	display: flex; /* Active le mode flexbox */
  	align-items: center; /* Centre verticalement les éléments enfants */
}

p { text-align:center; }
h1, h2 { text-align:center; margin:0; padding:.5em; color:var(--foregroundH1Color); background:var(--backgroundH1); border-radius:var(--radius) var(--radius) 0 0; border-bottom:1px solid var(--borderColor); }	
h2 { font-size:50%; }
form { margin:2em; }
label { display:block; text-align:right; margin:1em; }
button { display:block; width:100%; padding:0.5em; font-size:100%; }
a { text-decoration:none; }