@charset "utf-8";

@font-face {
    font-family: OpenSans;
    src: url(../../fonts/Open_Sans/OpenSans-Regular.ttf) format('truetype');
	font-style: normal;
	font-weight: normal;
}

@font-face {
    font-family: OpenSans;
    src: url(../../fonts/Open_Sans/OpenSans-Italic.ttf) format('truetype');
	font-style: italic;
	font-weight: normal;
}

@font-face {
    font-family: OpenSans;
    src: url(../../fonts/Open_Sans/OpenSans-Bold.ttf) format('truetype');
	font-style: normal;
	font-weight: bold;
}

@font-face {
    font-family: OpenSans;
    src: url(../../fonts/Open_Sans/OpenSans-BoldItalic.ttf) format('truetype');
	font-style: italic;
	font-weight: bold;
}

@font-face {
    font-family: OpenSans;
    src: url(../../fonts/Open_Sans/OpenSans-Light.ttf) format('truetype');
	font-style: normal;
	font-weight: 300;
}

@font-face {
    font-family: Roboto;
    src: url("../../fonts/Roboto/Roboto-Thin.ttf") format('truetype');
}

@font-face {
    font-family: Roboto;
    src: url("../../fonts/Roboto/Roboto-ThinItalic.ttf") format('truetype');
	font-style: italic;
	font-weight: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../../fonts/Roboto/Roboto-Regular.ttf") format('truetype');
	font-style: normal;
	font-weight: bold;
}

@font-face {
    font-family: Roboto;
    src: url("../../fonts/Roboto/Roboto-Black.ttf") format('truetype');
	font-style: normal;
	font-weight: 900;
}

:root {
	--text-font: OpenSans, Calibri, "Trebuchet MS", Trebuchet, sans-serif;
	--heading-font: Roboto, Calibri, Arial, "Trebuchet MS", Trebuchet, sans-serif;
	--text-font-size: .9rem;
	--primary-theme-color: 	rgba(0,0,0,.8);
	--default-link-color: #00c975;
	--body-bg-color: #ddd;
}

html {
	background-color: var(--body-bg-color);
	margin: 0;
}

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

noscript {
	position: fixed;
	display: block;
	left: 8rem;
	top: 10rem;
	z-index: 15;
	background-color: none !important;
}

noscript::after {
	content: "Votre navigateur ne supporte pas JavaScript, ce qui vous emp\0000EAchera de profiter de toutes les fonctionalit\0000E9s de ce site. Il est recommand\0000E9  d\000027autoriser JavaScript dans les param\0000E8tres de s\0000E9curit\0000E9  de votre navigateur.";
	position: absolute;
	display: block;
	width: 32rem;
	height: auto;
	background-color: #ffff66;
	box-shadow: 10px 10px 10px #666;
	border: 1px solid #000;
	padding: 15px;
	color: #000;
}

b {
	font-weight:bold;
}

a[href^="mailto:"] {
	text-decoration: none;
	color: var(--default-link-color) !important;
}

a[href^="mailto:"]::after {
	content: "\2709" " ";
	padding-left: 5px;
}

.pdf_link,
a[href*="ext=pdf"],
a[href$=".pdf"] {
    background: url(/img/pdf-icon.gif) center right no-repeat;
    padding-right: 18px;
}

.txt_link,
a[href*="ext=txt"],
a[href$=".txt"] {
    background: url(/img/txt-icon.png) center right no-repeat;
    padding-right: 18px;
}

.doc_link,
a[href*="ext=doc"],
a[href*="ext=docx"],
a[href$=".doc"],
a[href$=".docx"]{
    background: url(/img/word-icon.jpeg) center right no-repeat;
    padding-right: 18px;
}

.jpg_link,
a[href*="ext=jpg"],
a[href*="ext=jpeg"],
a[href$=".jpeg"],
a[href$=".jpg"] {
    background: url(/img/jpg-icon.gif) center right no-repeat;
    padding-right: 18px;
}

.xls_link,
a[href*="ext=xls"],
a[href*="ext=xlsx"],
a[href$=".xls"],
a[href$=".xlsx"]{
    background: url(/img/xls-icon.gif) center right no-repeat;
    padding-right: 18px;
}

.clear {
	clear: both;
}

.undisplayed,
.displayed-on-mobile-only {
	display: none;
}

.exposant {
	vertical-align: super;
	font-size: 0.5em;
}

.indice {
	vertical-align: sub;
	font-size: 0.7em;
}

.smallcaps {
	text-transform: uppercase;
	font-size: smaller;
}

noscript {
	position: fixed;
	display: block;
	left: 8rem;
	top: 10rem;
	z-index: 15;
	background-color: none !important;
}

noscript::after {
	content: "Votre navigateur ne supporte pas JavaScript, ce qui vous emp\0000EAchera de profiter de toutes les fonctionalit\0000E9s de ce site. Il est recommand\0000E9  d\000027autoriser JavaScript dans les param\0000E8tres de s\0000E9curit\0000E9  de votre navigateur.";
	position: absolute;
	display: block;
	width: 32rem;
	height: auto;
	background-color: #ffff66;
	box-shadow: 10px 10px 10px #666;
	border: 1px solid #000;
	padding: 15px;
	color: #000;
}

.list_with_hyphens {
	margin: 0 0 1rem 1.3rem;
	list-style-type: none;
}

.list_with_hyphens li::before {
	content: "\002014\0000A0";
	margin-left: -1.2rem;
}

li {
	list-style-type: none;
}

body {
	width: 1000px;
	display: block;
	margin: 0 auto;
	background-color: #fff;
	font-family: var(--text-font);
	font-size: var(--text-font-size);
	line-height: 1.2rem;
	color: rgba(0,0,0,.9);
}

header {
	height: 15rem;
	background: url("../img/header_img.jpg") no-repeat center bottom;
	background-size: cover;
	border-left: 1px solid rgba(0,0,0,.2);
	border-right: 1px solid rgba(0,0,0,.2);
	padding: 8rem 0 2rem 4rem;
	letter-spacing: .02rem;
}

header a {
	color: rgba(0,0,0,.6);
}

header a,
nav a {
	text-decoration: none;
}

header h1,
header h2,
header h1 a,
header h2 a {
	font-family: var(--heading-font);
	color: rgba(255,255,255,.9);
	font-weight: 300;
}

header h1 {
	font-size: 2.2rem;
	line-height:4rem;
}

header h2 {
	font-size: 1.3rem;
	letter-spacing: .1rem;
}

header li {
	display: inline;
	margin: 0 1rem 0 0;
}

nav {
	padding: .4rem 0 .7rem 2.7rem;
	background-color: rgba(0,0,0,0);
	border-left: 1px solid rgba(0,0,0,.4);
	border-right: 1px solid rgba(0,0,0,.4);
	box-shadow: 0 1px 3px rgba(0,0,0,.5);
}

nav ul {
	padding: 0;
  margin: 0;
	position: relative;
	}
	
nav ul li {
	display:inline-block;

}

nav li {
	margin-right: 2.5rem;
}

nav a {
	display:block;
	padding: 0 .5rem;	
	color:rgba(0,0,0,.9);
	text-decoration:none;
	line-height: 1.7rem;
	display: block;
}

nav > ul > li {
	margin-left: -3px;
}

nav> ul > li > ul {
	box-shadow: 0 1px 2px rgba(0,0,0,.3);
}

nav ul > li > ul::before {
	content: '';
	position: absolute;
	width: .7rem;
	height: .7rem;
	display: block;
	margin: -1.1rem 0 0 1rem;
	background-color: #fff;
	border-left: 1px solid var(--primary-theme-color);
	border-top: 1px solid var(--primary-theme-color);
	transform: rotate(45deg);
}

nav li:last-child a {
	border-right: none;
}

nav ul ul {
	border: 1px solid var(--primary-theme-color);
	padding:.7rem;
	background-color: #fff;
}

nav ul ul li {
	width: 100% !important;
}

nav ul li ul li a {
	background-color: #fff;
	border: none !important;
	color: var(--primary-theme-color);
}

nav a:hover { 
  text-decoration: underline;
  color: var(--default-link-color);
}

/* Hide Dropdowns by Default */
nav ul ul {
	display: none;
	position: absolute; 
	top: 1.7rem;
}
	
/* Display Dropdowns on Hover */
nav ul li:hover > ul {
	display:inherit;
}
	
/* Fisrt Tier Dropdown */
nav ul ul li {
	width:170px;
	float:none;
	display:list-item;
	position: relative;
}

/* Second, Third and more Tiers	*/
nav ul ul ul li {
	position: relative;
	top:-60px; 
	left:170px;
}
	
/* Change this in order to change the Dropdown symbol */
nav li > a:after { content:  ''; }
nav li > a:only-child:after { content: ''; }

section {
	overflow-y: hidden;
	display: block;
	padding: 3rem;
	line-height: 1.3rem;
	font-size: var(--text-font-size);
	border-left: 1px solid rgba(0,0,0,.4);
	border-right: 1px solid rgba(0,0,0,.4);
}

section a,
#contacts_bt a {
	text-decoration: none;
	color: var(--default-link-color);

}

section a:hover {
	text-decoration: underline;
}

section h1 {
	font-family: var(--heading-font);
	font-size: 1.3rem;
	padding: 1rem 0;
}

section p {
	padding-bottom: .5rem;
}

section dt {
	font-weight: bold;
}

article {
	width: 70%;
	padding: 0 1rem 3rem 1rem;
	float: right;
	display: inline;
}

article dt,
div dt {
	padding: 1rem 0 .5rem 0;
}

dt.event_date {
	padding: 1.5rem 0 0 0;
	font-family: var(--heading-font);
	font-weight: normal;
	font-size: 1.2rem;
}

.uni-logos {
	text-align: center;
	margin-top: 80px;
}

.uni-logos img {
	margin: 0 50px 0 0;
	filter: grayscale(100%) sepia(12%) opacity(50%);
}
    
.uni-logos img:hover {
	filter: none;
}

#contacts_bt {
	clear: both;
	background-color: rgba(0,0,0,.2);
	height: 17rem;
	padding: 3rem 0 0 0;
	border-left: 1px solid rgba(0,0,0,.4);
	border-bottom: 1px solid rgba(0,0,0,.4);
	border-right: 1px solid rgba(0,0,0,.4);
	margin-top: -4px !important;
}

#contacts_bt h1 {
margin: 0 0 .5rem 4rem;
 font-size: 1rem;
}

#contacts_bt ul {
	float: left;
list-style-type: none;display:block;
}

#contacts_bt ul:nth-child(2) {
	margin: 0 0 0 4rem;
}

#contacts_bt ul:nth-child(3) {
	margin: 0 0 0 8rem;
}

#contacts_bt a {
	color: rgba(0,0,0,.9);
	text-decoration: none;
}

.list_with_duck_beak li::before {
  content: '';
  display: inline-block;
  position: relative;
  top: 0;
  left: 0;
  height: .35rem;
  width: .35rem;
  border-right: 1px solid rgba(0,0,0,.9);
  border-top: 1px solid rgba(0,0,0,.9);
  transform: rotate(45deg);
  margin: .8rem .5rem 0 0;
}

footer {
	clear: both;
	background-color: var(--body-bg-color);
	padding: 1rem 0 2rem 1rem;
	font-size: .85rem;
	color: rgba(0,0,0,.5);
}

footer {
	padding-right: 3rem;
	font-size: .8rem;
}

footer a {
	color: rgba(0,0,0,.5);
	text-decoration: none;
}

.prochaines_activites time {
	display: block;
	float: left;
	margin-right: 1rem;
	text-align: center;
	width: 3.5rem;
	height: 5rem;
	padding: .6rem;
	background-image: url("../img/header_img.jpg");
	color: #fff;
	font-family: Roboto;
}

.logo-fnrs {
	display: block;
	position: absolute;
	top: 0rem;
	margin-left: 50rem;
	background-color: rgba(255,255,255,1);
	box-shadow: 2px 2px 5px rgba(0,0,0,.3);
}

.logo-fnrs img {
	width: 5rem;
	height: auto;
	margin: .8rem;
}

#page2 dd b {
	font-weight:normal;
}

#page2 dd b::before, #page2 dd b::after {
	font-size:1.3rem;
	font-family: var(--heading-font);
}

#page2 dd b::before {
	content: "« ";
}

#page2 dd b::after {
	content: " »";
}

/* TO-TOP ARROW: */

#totoparrow {
	position: fixed;
	display: none;
	margin-left: 70rem;
	top: 23rem;
	background-color: #4d4d4d;
	width: 3rem;
	height: 3rem;
}

#totoparrow a {	
	display: block;
	width: 1.2rem;
	height: 1.2rem;
	margin: 1.2rem 1rem 1rem .9rem;
    border-top: 4px solid rgba(255,255,255,1);
    border-right: 4px solid rgba(255,255,255,1);
	transform: rotate(315deg);
	z-index: 150;
}

/* END */

#page4 section li {
	padding-bottom: 1rem;
}


/* MODAL: */

.modal {
  display: block; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal_content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 50rem;
}

.modal_content p {
	margin: 0 25px 0 50px;
}

.modal_content p::before {
	content: "!";
	position: absolute;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	padding: 3px 11px;
	font-size: 30px;
	background-color: red;
	color: #fff;
	margin: 0 0 0 -50px;
}

.modal_closer {
  color: #aaa;
  float: right;
  font-size: 28px;
}

.modal_closer:hover,
.modal_closer:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}







/* CSS CODES FOR MOBILES AND THE LIKE: */


@media only screen and (max-width: 700px) {
	body {
		width: auto;
		margin: 0;
		padding: 0;
		hyphens: auto;
	}
	
	.hidden-on-mobile,
	.logo-fnrs,
	.calendar{
		display: none !important;
	}
	
	.displayed-on-mobile-only {
		display: block !important;
	}

	section {
		position: relative !important;
	}
	
	body,
	section,
	header,
	nav,
	footer,
	article {
		width: 100% !important;
		height: auto !important;
		padding-left: 5px !important;
		padding-right: 5px !important;
		float: none !important;
	}
	
	*, aside {
		float: none !important;
		width: 100%;
	}

	.prochaines_activites time {
		float: left !important;
}
		
	header {
		height: auto !important;
		padding: 2rem .5rem .7rem .5rem !important;
	}
	
	header ul li {
		width: 80% !important;
		height: auto !important;
		display: block;
	}
	
	header h1 {
		line-height: 3rem !important;
		padding: 1rem 0 1rem 0 !important;
	}
	
	header h2 {
		line-height: 1.5rem !important;
		padding: 0 0 1rem 0 !important;
	}
	
	img.floatingimg {
		width: 100% !important;
		height: auto !important;
		margin: 0 !important;
	}
	
	header h2 {line-height: 1rem;}
	
	nav {line-height: .7rem;}
	
	nav a {
		display: block;
		padding: .5rem !important;
		border-bottom: 1px solid rgba(255,255,255,.25);
	}
	
	#contacts_bt {
		height: 100%;
		padding: .5rem .5rem 3.5rem .5rem;
	}
	
	#contacts_bt ul,#contacts_bt h1 {
		margin: 0 !important;
	padding: .5rem 0 !important;
	}
	
	#contacts_bt h1 {
		padding: 1rem 0 !important;
	}
	
	.fb-share {
		display: block;width: auto; margin-top: 1rem;
	}
	
	#totoparrow {
	position: relative !important;
	display: block !important;
	margin: 0 auto;
	padding-top: 1rem;
	}
	
	#totoparrow a {	
	display: block;
	width: 1.2rem;
	height: 1.2rem;
	margin: 0 1rem 1rem .9rem;
    }

    ul.members_list {
    columns: 1;
    }
}