@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,900;1,400&display=swap');

*,
*::before,
*::after { box-sizing:border-box; }

:root {

    --text-color:#414042;
    --background-color:#ffffff;
    --primary-color:#0056AA;
    --secondary-color:#93D5E6;
	--main_font: 'Montserrat', sans-serif;
	--main_bg: #FAFAFA;
	--sec_bg: #ce8cce;
	--main_color: #000000;
	--section: #fee1cc;
	--accordion_text-color: #414042;
	--accordion_bg-color: #FAFAFA;
	--footer_text-color: #FFFFFF;
	--footer_bg-color: #0054a6;
}


body {
    color: var(--text-color);
    background: var(--background-color);
}


a {
    text-decoration: underline;
    color: var(--primary-color);
}

a:hover, a:focus {
    text-decoration: none;
    color: var(--secondary-color);
}

.banner_bg {
    background-color: var(--secondary-color);
}

.section_underline {
    border-bottom: 3px solid var(--primary-color);
}


h1 {
	font-family: var(--main_font);
	color: var(--main_color);
	margin:2rem 0;
}

thead > tr > th {
	width: 100px;
	font-family: var(--main_font);
	font-weight: bold;
	background: var(--main_bg) !important;
}

thead {
	/*
	position: sticky;
	top: 0;
	*/
	box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

tbody th {
	font-family: var(--main_font);
	font-weight: bold;
	background: var(--sec_bg) !important;
}

tbody > tr:last-child > td {
	border-bottom: 0;
  }

header {
	box-shadow: 0 0.25rem 0.5rem 0 rgb(0 0 0 / 8%);
	}
}

.logo_header {
	width:150px !important;
	height: auto;
}

.logo_footer {
	width:130px !important;
	height: auto;
}

.footer_title {
	margin-bottom: 10px;
	font-size: 1.2rem;
	font-weight: 400;
	line-height: 2rem;
}

footer {
	background-color:var(--footer_bg-color);
	color: var(--footer_text-color);;
}

footer hr {
    height: 1px;
    margin-bottom: 2rem;
    border: none;
    background-color: var(--footer_text-color);;
}

.footer_logo,
.footer_links {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	color: white;
	list-style:none;
}

.footer_links a {
	color: white;
	text-decoration:none ;
}

.footer_links a:hover {
	text-decoration:underline ;
}

.footer_links li {
	font-weight: thin;
}

.footer_links li::after {
    display: inline-block;
    margin-left: 0.5rem;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f35d";
  }

.section {
	background: var(--section) !important;
}

img {
	width: 100%;
	height: auto;
}

.border-success {
	border-color: var(--main_color) !important;
}

.accordion-body {
	padding:0 0 !important;
	border:1px solid var(--accordion_text-color) !important;
}

.bordered {
	margin:2rem ;
	padding:1rem 2rem 0.2rem;
	color: var(--footer_text-color);
    background-color: var(--footer_bg-color);
    border-radius: 5px;
}

.bordered p::before {
    display: inline-block;
    margin-right: 1rem;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0eb";
    color: var(--footer_text-color);
  }

.accordion-button {
	font-size: 1.1rem;
    line-height: 2rem;
    color: var(--accordion_text-color) !important;
    background-color:var(--accordion_bg-color) !important;
}

.accordion-button:not(.collapsed) {
    color: var(--accordion_text-color) !important;
    background-color: var(--accordion_bg-color);
}

.accordion-button:focus {
    outline: none;
    box-shadow: none;
    border-color: rgba(0,0,0,.1);
}


@media screen and (max-width: 768px) {
	table {
		border: 0 !important;
	}
	table,
	thead,
	tbody,
	th,
	td,
	tr {
		display: block;
		margin-bottom: 0 !important;
	}

	thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	table tr {
		border: none !important;
		border-bottom: 2px solid var(--main_color) !important;
		display: block;
		padding-bottom: 20px !important;
		margin-bottom: 20px !important;
	}

	tbody tr > th {
		margin: auto 0.5rem !important;
	}

	table tr:last-child {
		border-bottom: 0;
		border: none !important;
	}

	table td {
		position: relative;
		display: block;
		border: none !important;
		font-size: 0.9em;
	}

	/*  Label the data  */
	td::before {
		content: '';
		display: block;
		width: 100%;
		padding: 6px 10px;
		margin-bottom: 5px;
		font-family: var(--main_font);
		line-height: 1.5rem;
		font-weight: bold;
		color: black;
		background: var(--main_bg);
		white-space: nowrap;
	}

	td:nth-of-type(1):before {
		content: 'Titre de la Mission d\'Élo';
	}
	td:nth-of-type(2):before {
		content: 'Domaine';
	}
	td:nth-of-type(3):before {
		content: 'Année d\'études';
	}
}