Modèle:Accueil/style.css

.mainGrid {
	display: grid;
	grid-template-areas: "header header" "liens liens" "caroussel caroussel" "help help" "ww tuto" "wiki about";
	grid-gap: 10px;
}
.mainGrid * {
	max-width: 100%;
}

.headerGrid {
	grid-area: header;
	display: grid;
	grid-template-areas: "logo text cat";
}

.headerGrid > div {
	text-align: center;
	padding: 0px !important;
	font-size: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.headerLogo {
	grid-area: logo;
}

.headerLogo > a > img {
	height: 150px;
	width: auto;
}

.headerText {
	grid-area: text;
	display: grid !important;
	grid-template-areas: "title" "paragraph";
}

.headerText > div {
	text-align: center;
	padding: 0px;
	font-size: 30px;
}

.headerTitle {
	grid-area: title;
	font-size: 150%;
	font-size: 3em;
	font-weight: bold;
	color: rgb(133, 92, 214);
    text-decoration: none;
}

.headerParagraph {
	grid-area: paragraph;
}

.headerParagraph > span {
	font-size: 100%;
	color: rgb(133, 92, 214);
    text-decoration: none;
}

.headerParagraph:nth-child(2) {
	font-size: 16px;
	padding: 0px;
}

.headerCat {
	grid-area: cat;
}

.headerCat > a > img {
	height: 80px;
	width: auto;
}

.carousselGrid {
	grid-area: caroussel;
}

.helpGrid {
	grid-area: help;
}

.newsGrid {
	grid-area: news;
}

.linksGrid {
	grid-area: liens;
}

.linksGrid > div > div:nth-child(2) {
	text-align: center !important;
}

.linksGrid ul {
	margin-left: 0px !important;
}

.wwGrid {
	grid-area: ww;
}

.tutoGrid {
	grid-area: tuto;
}

.aboutGrid {
	grid-area: about;
}

.wikiGrid {
	grid-area: wiki;
}

.gallery.mw-gallery-slideshow {
	margin: 0 !important;
}

@media only screen and (max-width: 425px) {
	.mainGrid {
		grid-template-areas: "header" "liens" "caroussel" "help" "tuto" "ww" "wiki" "about";
	}

	.mainGrid > div > div {
		height: auto !important;
	}

	.headerGrid {
		grid-template-areas: "logo" "text" "cat";
	}

	.headerText {
		padding: 0px;
	}

	.headerText > div {
		padding: 0px !important;
	}

	.headerLogo > a > img {
		height: auto;
		width: auto;
	}

	.headerCat > a > img {
		height: auto;
		width: auto;
	}

	.newsGrid {
		display: none;
	}
}