body {
	background-color: #293241;
	font-family: sans-serif;
	color: #e0fbfc;
}

h1 {
	margin: 50px;
	font-size: 50px;
}

h1, h2, #button_send_message {
	text-align: center;
}

#menuNavigation {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: column;
	padding: 20px;
	position: fixed;
}

.currentElement, .element {
	margin: 10px;
	border-radius: 15px;
	padding: 18px;
	width: 40px;
	height: 40px;
}

.currentElement:hover, .element:hover {
	width: 64px;
	height: 64px;
}

.element {
	background: #ef6461;
}

.currentElement {
	background: #7f96ff;
}

/*Easter eggs et conduite*/
.contenue, .easterEgg, .titresAccueil, .tableauxConduite {
	margin-left: 150px;
	margin-right: 150px;
}

.agenda {
	margin: 50px;
}

iframe.graphConduite, iframe.videoYoutube {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 15px;
}

a.easterEggConduite {
	width: 100px;
	height: 50px;
	display: block;
	/*margin: top right bottom left;*/
	margin: 20px auto 20px auto;
	cursor: default;
}
/*----------*/

/*Site QR code*/
.QrCodeCenter {
	display: block;
	margin: auto;
}
/*------------*/

/*Calcul*/
.elementsCalcul {
	color: #e0fbfc;
	font-size: 20px;
	background: none;
	display: block;
	margin-bottom: 10px;
	outline: none;
}

label.elementsCalcul, #boutonCalculer {
	margin-top: 20px;
	font-weight: bold;
}

.cadreCalcul {
	border: solid 2px #98c1d9;
	width: 300px;
}

#resultat {
	resize: none;
	border: none;
}

#boutonReinitialiser:hover {
	background: #9d0208;
	opacity: 60%;
}
/*------*/

/*Links*/
/*#button_send_message {text-align: center;} Cette ligne apparait plus haut*/ 
#conteneur {
	display: flex;
	margin: auto;
	flex-direction: column;
	align-items: center;
	max-width: 500px;
}

.bouton {
	border: solid 2px #98c1d9;
	width: 100%;
}

.bouton:hover, .boutonDiscord:hover {
	background: #ee6c4d;
	width: 100%;
	font-size: 18px;
	color: #3d5a80;
	font-weight: bold;
}

a.lienPageLinks {
	margin-top: 5px;
	text-decoration: none;
	color: #e0fbfc;
	width: 100%;
}

.carre {
	margin-top: 5px;
	border: solid 2px #98c1d9;
	width: 100%;
}

#textDiscord {
	text-align: right;
	margin: 5px;
}

#discordServer {
	padding: 5px;
	width: 98%;
}

#cacherUn {
	display: flex;
	justify-content: space-between;
}

.copier {
	background-color: #293241;
	border: none;
	margin: 5px;
	color: #e0fbfc;
}

#textAreaCopier {
	outline: none;
}

.boutonDiscord {
	border: solid 2px #98c1d9;
	width: 100%;
	margin-top: 5px;
}

#nom, #text {
	width: 100%;
	background: none;
	border: none;
	font-family: sans-serif;
	color: #e0fbfc;
	outline: none;
	padding: 5px;
	font-size: 20px;
	resize: vertical;
	vertical-align: middle;
}

#nom {
	font-weight: bold;
}

.cliquable {
	cursor: pointer;
	margin-top: 5px;
}

.curseurClick {
	cursor: pointer;
}

#cliquableId {
	cursor: pointer;
}

/* Largeur */
::-webkit-scrollbar {
  width: 10px;
}

/* Derrière la barre */
::-webkit-scrollbar-track {
  background: #98c1d9; 
}
 
/* Barre */
::-webkit-scrollbar-thumb {
  background: #3d5a80; 
}

/* Barre quand on survole */
::-webkit-scrollbar-thumb:hover {
  background: #ee6c4d;
}

/* Barre de redimentionage */
::-webkit-resizer {
  display: none;
}
/*-----*/

/* Smartphones (portrait and landscape) ----------- */
@media screen and (max-device-width : 480px) {
/* Styles */
	#menuNavigation {
		display: block;
		margin: auto;
		position: relative;
		max-width: 500px;
		min-width: 10px;
	}
}

/* Desktops and laptops ----------- */
@media only screen and (max-width : 1000px) {
/* Styles */
	#menuNavigation {
		display: block;
		margin: auto;
		position: relative;
		max-width: 500px;
		min-width: 10px;
	}
}

/*Easter egg 3*/
		#conteneurPage {
			display: flex;
		}

		.boutonPage {
			width: 180px;
			font-size: 50px;
			margin: 10px;
			border: solid 10px white;
			padding: 20px;
			border-radius: 10px;
			text-align: center;
			cursor: pointer;
			user-select : none;
		}

		#grandBloc {
			margin: auto;
			width: 500px;
		}

		.selectedPage {
			border-color: #57f542;
		}

		#boutonPageValider {
			margin: auto;
		}

		#boutonPageValider:hover {
			border-color: #57f542;
		}

		#SQDHQJSHI {
			margin-top: 50px;
		}

		#textPage, #reponsePage{
			text-align: center;
			margin: 50px;
			font-size: 50px;
			font-weight: bold;
		}