@font-face {
    font-family: "regularText";
    src: url("../assets/NPCLstandard.otf");
}

@font-face {
    font-family: "juicyText";
    src: url("../assets/NPCLjuicy.otf");
}

body {
	background-color: #061022;
	font-family: regularText;
	color: #dddddd;
}

@media (min-width: 1000px) {
	body {
		background-image: url('../assets/left.png'), url('../assets/right.png');
		background-position: left, right;
		background-repeat: repeat-y, repeat-y;
	}
}

img {
	object-fit: contain;
}

.inline {
	display: inline-block;
}
	
h1 {
	font-size: 1.5em;
	color: #ffffff;
	text-align: center;
}

strong {
	color: #ffffff;
	font-size: 1.2em;
}

.important {
	color: #ffeebb;
}

.shadowed {
	text-shadow: -0.1em 0.1em 0.1em #000000, 0em 0em 0.1em #000000;
}

.marge {
margin-left: 2em;
}

a{
	color: #bbbbff;
}

a:hover{
	color: #9999dd;
}

.nodeco {
	color: #dddddd;
	text-decoration: none;
}

.nodeco:hover {
	color: #bbbbbb;
	text-decoration: underline;
}

.announce {
	margin: auto;
	width: 85%;
	max-width: 600px;
	background-image: linear-gradient(to bottom, rgba(121,121,121,0.85), rgba(33,33,33,0.85));
	border-radius: 25px 10px 25px 10px;
	border: 0.15rem solid;
	border-color: black;
	margin-top: 10px;
	margin-bottom: 25px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
}

p {
	margin: 5px;
}

.bigmargin {
	margin: 1em;
}

.endnote {
	font-size: 0.8em;
	color: #555555;
	text-align: right;
	position: absolute;
	right: 10px;
}

	.header {
		display: grid;
		grid-template-columns: 35% 30% 35%;
		text-align: center;
		margin: auto;
		width: 85%;
		max-width: 700px;
	}

	.textcenterer {
		display: grid;
		grid-template-rows: 1fr auto 1fr;
	}

	.textcentered {
		grid-row: 2/3;
	}

	.homepage {
		background:url(../assets/logoSmall.png) no-repeat center;
		background-size: contain;
		width: 100%;
		max-height: 100%;
		height: 220px;
	}

	.homepage:hover {
		background:url(../assets/logoSmall_hover.png) no-repeat center;
		background-size: contain;
	}
	
	@media (max-width: 425px) {
		.header {
			display: grid;
			grid-template-columns: 50% 50%;
			text-align: center;
			margin: auto;
			width: 85%;
		}
		#pagelogo {
			grid-column: 2/3;
		}
		header .textcenterer {
			grid-column: 1/3;
			grid-row: 1/2;
		}
	}

			.fr {
				grid-column: 2/3;
			}

			.eng {
				grid-column: 3/4;
			}

			#Fr {
				background:url(../assets/fr.png) no-repeat;
			}

			#Eng {
				background:url(../assets/eng.png) no-repeat;
			}

			#Fr:hover {
				background:url(../assets/fr_hover.png) no-repeat;
			}

			#Eng:hover {
				background:url(../assets/eng_hover.png) no-repeat;
			}

			.langage {
				display: grid;
				grid-template-columns: auto 60px 60px auto;
			}

			.langageButton {
				border: none;
				height: 36px;
				width: 60px;
			    cursor: pointer;
			}

			.langageCheck {
				display: none;
			    padding: 0;
				height: 0px;
				width: 0px;
			}

.centered {
	text-align: center;
}

.Vcentered {
	vertical-align: center;
}

.image {
	margin: auto;
	width: 85%;
	max-width: 700px;
	text-align: center;
}

.logo {
	height: auto;
	width: 85%;
	max-width: 800px;
}

.logogrid {
	display: grid;
	grid-template-columns: auto 1fr;
}

.logotext {
	vertical-align: center;
}