/*
html {
	background: #757575;
}

.connection {
	/display: none;
	background: black;

	position: absolute;

	top: 50%; 
	left: 50%;
  	transform: translate(-50%, -50%);

	width: 50%;
	height: 50%;
}

.connection * {
	position: relative;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);

	border: none;
	background: #a1a1a1;
}

.close {
	top: 6%;

	left: 92%;
	background: #a1a1a1;
}

.button_connection {
	position: absolute;
	top: 50%; 
	left: 50%;
  	transform: translate(-50%, -50%);

  	border: none;
  	background-color: #404040;
  	color: white;
}

.connexion header form input, .connexion header form label, .connexion header form button {
	border: none;
	display: block;
	position: relative;
	text-align: center;
	top: 50%; 
	left: 50%;
  	transform: translate(-50%, -50%);
}
*/

html, body {
	margin: 0;
	height: 100%;
	padding-top: 2rem;
}

* {
	box-sizing: border-box;
}

.hidden {
	display: none !important;
}

.list * {
	color: white;
}

.list ul {
    grid-area: content;
}

.list footer {
    grid-area: footer;
    text-align: center;
}

.list a {
	text-decoration: none;
	color: aqua !important;
}

.connexion {
	width: 450px;
	margin: 0 auto;
	text-align: center;
}

.connexion form label, .connexion form input, .connexion form select, .connexion footer button {
	display: block !important;
	width: 100%;
	margin: 5px;
	padding: 5px;
	border: 1px solid black;
	border-radius: 160px;
}