html, body {
	background-color: black;
	color: white;
	font-family: "Lucida Console", "Courier New", monospace;
	margin: 0;
}

#login {
	text-align: center;
	background-color: #090085;
	width: 35em;
	height: 20em;
	border-radius: 30px;
	position: absolute;
  	top: 9vh;
  	left: 50%;
  	transform: translate(-50%, 0);
}

#login form {
	line-height: 2.5em;
}

#login form ::placeholder {
	text-align: center;
}

#login form input {
	font-size: 1.2em;
}

h2 {
	font-size : 1.2em
}

h3 {
	text-align: center;
	font-weight: normal;
}

h4 {
	font-size: 1.2em;
	margin-top: 0;
	margin-bottom: 10px;
}

h5 {
	color: #FF8200;
	font-size: 1em;
	font-weight: bold;
	margin: 0;
}

h6 {
	font-size: 1.2em;
	margin-bottom: 0;
}

#grille {
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-template-columns: 1fr 1fr;
	text-align: center;
	margin-top: 85px;
	grid-column-gap: 30px;
	grid-row-gap: 10px;
	position: absolute;
	left: 180px;
	/*left: 50%;
	transform: translate(-50%, 0);*/
}

#thumb_video {
	padding-top: 15px;
	border-radius: 30px;
	width: 40vw;
}

#thumb_video:hover {
	background-color: #001157;
	transition: background-color 500ms linear;
}

#thumb_video img {
	width: 90%;
}

a {
	text-decoration: none;
	color: inherit;
}

#display_video{
	float: left;
	margin-left: 190px;
	margin-top: 10vh;
	font-size: 1.2em;
}

video {
	width: 90vh;
}

#coms {
	float: left;
	margin-left: 2em;
	margin-top: 10vh;
	font-size: 1.2em;
}

#coms input {
	font-size: 1.1em;
}

#logo {
	background-image: url('Images/Logo.png');
	height: 200px;
	width: 166px;
	position: absolute;
	top: 20px;
	left: 20px;
}

#logo2 {
	background-image: url('Images/Logo.png');
	height: 200px;
	width: 166px;
	position: absolute;
	top: 20px;
	left: 20px;
}


#deconnexion {
	position: absolute;
	top: 5px;
	right: 5px;
}

#deconnexion a:hover {
	color: orange;
	transition: color 200ms linear;
}