@charset "UTF-8";
/* GENERAL */
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..400&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css");
body {font-family: 'Work Sans', sans-serif;font-size: 18px; color: #000;font-style: normal;font-weight: 290;line-height: 1.25em;letter-spacing: 0.025rem;height: 100%;}
.navbar-brand {margin-left: 8px;z-index: 0;}
.logo {width: 115px;left:50%; transform: translateX(-50%);top:10px;}
/*.nav li {padding: 12px;}*/
.fixed-bottom {right: inherit; left: 7px; top: 4px;bottom: inherit;}
header {height: 65px; background-color: #fff; position: fixed; width: 100%;z-index: 100;}
a:link, a:visited {color: #000; text-decoration: none;}
a:hover, a:active {color: #000; text-decoration: underline;}
.nav-link:focus, .nav-link:hover {color: #bbb!important;text-decoration:none;}
.card:hover {opacity: 0.92;}
.header-transparent {background-color: transparent;}
.text-muted {color: #bbb!important;}
body.nav-open #nav-icon3 {display:none;}
.h-100vh {height:88vh!important;}

/* TYPOGRAPHIE */
h1, h2, h3 {line-height: 1.3em;letter-spacing: 0.035rem;}
h1 {font-size: 18px;font-weight: 200;margin: 0 0 10px -3px;text-transform: uppercase; }
.h2, h2 {font-size: 3.7vw;}
.project-localisation {font-size: 3vw;margin: -3px 0 3px 0;}
.project-year {font-size:3vw; color: #888;margin:0 0 13px 0 ;}
.project-year::before {content: "— ";}

/* HOME */
.home-area {width: 90%; min-height: 130vw;position: relative;left: 0px; top:40px;}
.a, .b,.c,.d,.e,.f,.g,.h,.k {z-index: 10;}
.rounded-circle {width: 77%;height: 77%;}

/* PROJETS */
.projects-content {padding: 70px 28px 30px 28px;}
.card {border:0; border-radius: 0;margin-bottom: 5px;
    opacity: 0;word-wrap: normal;
    -webkit-transform: translateY(25px);
    transform: translateY(25px);
    -webkit-animation-timing-function: cubic-bezier(.45,.005,0,1);
    -moz-animation-timing-function: cubic-bezier(.45,.005,0,1);
    -o-animation-timing-function: cubic-bezier(.45,.005,0,1);
    animation-timing-function: cubic-bezier(.45,.005,0,1);
	overflow: hidden;
	    box-shadow: 0px 3px 13px 1px rgb(0 0 0 / 12%);
}
.card-img, .card-img-top {border-radius:0!important;}
.card-body {padding: 13px 13px 0px 13px;}
/*.card img.img-hover{display:none}
.card:hover img:first-child{display:none}
.card:hover img.img-hover{display:block;}*/
main.projects-content > div > div:nth-of-type(odd) {padding-right: 14px;}
main.projects-content > div > div:nth-of-type(even) {padding-left: 14px;}
.slide-in-bottom {
opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: -webkit-transform .6s,opacity .6s;
    transition: transform .4s,opacity 1.6s;
}
.card .card-img-container img  {
 -webkit-transition: 0.45s ease-out;
  transition: 0.45s ease-out;
    margin: 0 auto;
    display: block;
}

.card:hover .card-img-container img.card-img-top  {
     transform: scale(1.1);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    z-index: 0;
}
/*.card:hover .card-body  {background-color: #fafafa;}*/
.card-img-container {overflow: hidden;}
.col-card-mb {margin-bottom: 20px;}

li.list-title:first-child  {margin: 0px 0 2px 0!important;}
.list-title {font-size: 18px!important;margin: 30px 0 2px 0!important;font-weight: 200;}
.list-group-item {border: 0px;font-size: 14px; margin: 0 0 2px 0; line-height: 1.25em; padding: 0.5rem 0rem 0.1rem 0.8rem;}
.projets-photos-col img {margin-bottom: 25px;}
.projets-liste-col {padding-left: 0!important;margin-left: -3px;padding-right: 5px;}
.projets-liste-col a:link, .projets-liste-col a:visited {font-weight: 290;}
.projets-liste-col a:hover, .projets-liste-col a:active {color: black;font-weight: 370;text-decoration: none;}

/* MODAL */
.modal-dialog {max-width: 91%;margin: 30px auto;}
.modal-body {position:relative;padding:0px;}
.close {position:absolute;right:-6px;top:-27px;z-index:999;font-size:2.1rem;font-weight: 200;color:#444;opacity:1; border: none;background-color: rgba(0,0,0,0.00);}
.modal-backdrop {background-color: #fff;}
.modal-backdrop.show {opacity: 1;}
.modal-content {border: 0px solid rgba(0, 0, 0, 0.2);}
#modal-photo .modal-dialog, #modal-photo-carre .modal-dialog {max-width: 86%;}
#modal-photo .close, #modal-photo-carre .close {position:absolute;right:-5px;top:-30px;z-index:999;font-size:2rem;font-weight: normal;color:#444;opacity:1; border: none;background-color: rgba(0,0,0,0.00);}
.fade {transition: opacity .28s linear;}

/* PUBLICATIONS */
ul.list-group {-webkit-columns: 3;-moz-columns: 3;columns: 3;}
.publications-liste-col a:link, .publications-liste-col a:visited {font-style: italic;}
.tooltip-bcma, tooltip-equipe {position: relative;display: block;}
.tooltip-bcma .tooltip-bcma-image {visibility: hidden;text-align: center;padding: 5px 0;position: absolute;z-index: 1;top: 100%;left: 50%;transform: translate(-50%,28%);margin-left: -0px;opacity: 0;transition: opacity .6s;}
.tooltip-equipe .tooltip-equipe-image {visibility: hidden;text-align: center;padding: 5px 0;position: absolute;z-index: 1;left: 50%; transform: translate(-50%,70px);opacity: 0;transition: opacity .6s;}
.tooltip-bcma:hover .tooltip-bcma-image, .tooltip-equipe:hover .tooltip-equipe-image {visibility: visible;opacity: 1;}
.tooltip-bcma-image img {width: 150px;}
.tooltip-equipe-image img {width: 150px;}
.publications-liste-col .list-livres {margin-top: -7px;}
.revue-title {padding-top: 30px!important;}
ul.liste-revues {margin-top: 50px;}
.liste-revues li {margin: 0px;padding: 0.25rem 0rem 0rem 0.8rem}


/* EQUIPE */
.equipe-content .card {box-shadow: none; width: 85%;}
.equipe-content .card-body {padding:8px;text-align: center;}
.equipe-diplome {font-size: 12px; line-height:1.25em;margin: -3px 10px 8px 1px; }
.equipe-fonction {font-size: 12px; line-height:1.25em; margin: -2px 10px -10px 1px; font-style: italic;font-weight: 300!important;}
.equipe-content .card-title {font-size:14px;font-weight: 300;}
.equipe-content .table>:not(caption)>*>* {border-bottom-width: 0px;}
.table-equipe {margin: 0 25px 22px 4px;font-size: 13px;}
.espace-table {padding-top: 45px!important;}
.equipe-tbl-nom a:link, .equipe-tbl-nom a:visited {font-weight: 380;}
.equipe-tbl-nom {width: 36%;}

/* CONTACT */
.contact {font-size: 24px;line-height: 1.3em;margin: 18px 0 37px 1px;}
.logo-contact {width: 70%; margin-top: 25%;}
.insta {width: 50px; height: auto;margin-top: -10px;}


/* MEDIA QUERIES*/
@media (min-width: 576px) { 
.navbar-brand {margin-left: 36px;}
.nav li {padding: 6px;}
.nav-button {right: 40px!important;}
.card-body {padding: 16px 18px 0px 18px;}
h1 {font-size: 18px;margin: 0 0 10px -3px;}
.h2, h2 {font-size: 18px; line-height: 1.25em;}
.project-localisation {font-size:13px;margin: -1px 0 9px 0;}
.project-year {font-size:13px;margin: 9px 0 16px 0;}
.projects-content {padding: 80px 41px 30px 40px;}
main.projects-content > div > div:nth-of-type(odd) {padding-right: 20px;padding-left: 20px;}
main.projects-content > div > div:nth-of-type(even) {padding-right: 20px;padding-left: 20px;}
.col-card-mb {margin-bottom: 30px;}
.equipe-diplome {font-size: 12px; line-height:1.25em;margin: -2px 0px 10px 0px; }
.equipe-fonction {font-size: 12px; line-height:1.25em; margin: -3px 0px -10px 0px;}
.home-area {width: 90%; min-height: 163vw;left: 0px; top:40px;}
.tooltip-bcma-image img {width: 200px;}
header {height: 60px;}
.table-equipe {margin: 0 30px 22px 4px;font-size: 15px;width: 79%;}
.logo-contact {width: 65%;/*margin-top: 43%;*/}
.tooltip-bcma .tooltip-bcma-image {top: 100%;left: 50%;transform: translate(-50%,20%);}
.h-100vh {height:84vh!important;}

}

@media (min-width: 768px) { 
	.logo {width: 168px;top:33px;}
	.navbar-brand {margin-left: 20px;}
	.nav-button {right: 47px!important;}	
	.card-body {padding: 18px 21px 3px 21px;}
	h1 {font-size: 19px;margin: 0 0 10px 7px;}
	.h2, h2 {font-size: 19px; line-height: 1.2em;}
	.project-localisation {font-size:13px;margin: 11px 0 9px 0;line-height: 1.25em;}
	.project-year {font-size:14px;margin: 9px 0 18px 0;}
	header {height: 67px;}
	.projects-content {padding: 90px 51px 30px 50px;}
	main.projects-content > div > div:nth-of-type(odd) {padding-right: 20px;padding-left: 20px;}
	main.projects-content > div > div:nth-of-type(even) {padding-right: 20px;padding-left: 20px;}
	.equipe-content .card {width: 72%}
	.home-area {width: 90%; min-height: 123vw;left: 0px; top:40px;}
	.rounded-circle {width: 100%;height: 100%;}
	li.list-title:first-child  {margin: -9px 0 4px 0!important;}
	.list-title {font-size: 20px!important;margin: 30px 0 2px 0!important;}
.list-group-item {border: 0px;font-size: 16px; margin: 0 0 2px 0; line-height: 1.2em;}
.projets-photos-col img {margin-bottom: 35px;}
.projets-liste-col {padding-left: 9px!important;margin-left: -3px;padding-right: 5px;}
	.tooltip-bcma-image img {width: 250px;}
	#modal-photo .close, #modal-photo-carre .close {position:absolute;right:-10px;top:-40px;z-index:999;font-size:3.3rem;font-weight: lighter;color:#444;opacity:1; border: none;background-color: rgba(0,0,0,0.00);}
	.equipe-content .card-title {font-size:15px;}
	.equipe-diplome {font-size: 13px;margin: -2px 0px 10px 0px; }
.equipe-fonction {font-size: 13px; margin: -3px 0px -10px 0px;}
	.table-equipe {margin: 0 30px 22px 15px;font-size: 15px;width: 88%;}
	.logo-contact {width: 40%;margin-top: 13.5%;}
	.equipe-tbl-nom {width: inherit;}
	.espace-table {padding-top: 40px!important;}
	.main-menu .nav li a {font-size: 21px!important;}
	.nav li {padding: 8px;}
	.h-100vh {height:91vh!important;}
	.tooltip-equipe-image img {width: 170px;}
    .tooltip-bcma .tooltip-bcma-image {left: 50%;transform: translate(-50%,53px);}
    .tooltip-equipe .tooltip-equipe-image {transform: translate(-50%,72px);}

}


@media (min-width: 992px) {  
	.nav li {padding: 2px;}
	.card-body {padding: 13px 17px 3px 17px;}
	h1 {font-size: 21px;margin: 0 0 18px 9px;}
	.h2, h2 {font-size: 17px; line-height: 1.2em;}
	.project-localisation {font-size:13px;margin: 10px 0 9px 0;line-height: 1.25em;}
	.project-year {font-size:13px;margin: 9px 0 15px 0;}
	.fixed-bottom {right: 20px; left: inherit; top: inherit;bottom: 20px;}
	.projects-content {padding: 52px 90px 30px 40px;}
	.equipe-content {padding: 67px 96px 30px 40px;}
	header {height: 50px; background-color: transparent;}
	.nav-button {right: 53px!important;top: 12px;}
	.home-area {width: 90%; min-height: 54vw;left: 0px; top:40px;}
	.logo {width: 160px;}
	.gmap {width: 80%;}
	#modal-photo .modal-dialog {max-width: 76%;}
	#modal-photo-carre .modal-dialog {max-width: 46%;}
	.equipe-content .card {width: 65%}
	.equipe-content .card-title {font-size:16px;}
	.table-equipe {margin: 0 30px 22px 15px;font-size: 16px;width: 78%;}
	.contact-content {padding: 100px 50px 30px 50px;}
	.logo-contact {width: 25%;margin-top: 9%!important;}
	.nav-open ul.nav {margin-top: 0px;}
	.main-menu .nav li a {font-size: 19px!important;}
	.h-100vh {height:97vh!important;}
	.publications-content {padding: 43px 130px 30px 40px!important;}
    .tooltip-equipe .tooltip-equipe-image {transform: translate(-50%,29px);}
    div.k {top:60%!important; left:75%!important;}
    div.e {top:40%!important; left:25%!important;}
    
	
}


@media (min-width: 1200px) {
	.nav li {padding: 2px;}
	.card-body {padding: 13px 17px 3px 17px;}
	h1 {font-size: 22px;margin: 0 0 22px 7px;}
	.h2, h2 {font-size: 17px; line-height: 1.2em;}
	.project-localisation {font-size:13px;margin: 10px 0 9px 0;line-height: 1.25em;}
	.project-year {font-size:13px;margin: 9px 0 12px 0;}
	.projects-content {padding: 74px 8% 30px 4%;}
	.nav-button {right: 42px!important;top: 30px;}
	.equipe-content .card {width: 65%}
	.equipe-content .card-title {font-size:17px;}
	.equipe-content {padding: 85px 108px 30px 40px;}
	.equipe-diplome {font-size: 14px; line-height:1.25em;margin: -2px 10px 10px 1px; }
.equipe-fonction {font-size: 14px; line-height:1.25em; margin: -3px 10px -10px 1px;}
.home-area {width: 90%; min-height: 55vw;left: 0px; top:40px;}
	.rounded-circle {width: 130%;height: 130%;}
	.logo {width: 190px;}
	li.list-title:first-child  {margin: -9px 0 0px 0!important;}
		.list-title {font-size: 23px!important;margin: 35px 0 0px 0!important;}
.list-group-item {border: 0px;font-size: 17px; margin: 0 0 2px 0; line-height: 1.325em;}
.projets-photos-col img {margin-bottom: 35px;}
.projets-liste-col {padding-left: 9px!important;margin-left: -3px;padding-right: 5px;}
	.tooltip-bcma-image img {width: 300px;}
	.contact {font-size: 25px;line-height: 1.3em;margin: 22px 0 41px 2px;}
	.table-equipe {margin: 0 30px 22px 15px;font-size: 17px;width: 71%;}
	.contact-content {padding: 4% 55px 40px 4%;}
	.logo-contact {width: 23%;margin-top: 6%!important;}
	.main-menu .nav li a {font-size: 22px!important;}
	.h-100vh {height:97vh!important;}
	.publications-content {padding: 63px 124px 30px 40px!important;}
	.tooltip-equipe-image img {width: 180px;}
    .tooltip-bcma .tooltip-bcma-image {left: 50%;transform: translate(-50%,11px);}
    .tooltip-equipe .tooltip-equipe-image {transform: translate(-50%,33px);}
}


@media (min-width: 1600px) {  
	.nav li {padding: 6px;}
	.close {right:-43px;top:0px;font-size: 3rem;}
	.nav-button {right: 68px!important;top: 42px;}
	.card-body {padding: 18px 21px 3px 21px;}
	h1 {font-size: 25px;margin: 0 0 20px 13px;}
	.h2, h2 {font-size: 19px; line-height: 1.2em;}
	.project-localisation {font-size:14px;margin: 10px 0 9px 0;line-height: 1.25em;}
	.project-year {font-size:14px;margin: 11px 0 17px 0;}
	.equipe-content {padding: 78px 6% 30px 40px;}
	.equipe-content .card {width: 55%}
	.equipe-content h2 {font-size:18px!important;}
		.equipe-diplome {font-size: 14px; line-height:1.25em;margin: -2px 10px 10px 1px; }
.equipe-fonction {font-size: 14px; line-height:1.25em; margin: -3px 10px -10px 1px;}
	.home-area {width: 90%; min-height: 59vw;left: 0px; top:50px;}
	.logo {width: 200px;top:45px;}
	li.list-title:first-child  {margin: 0px 0 5px 0!important;}
		.list-title {font-size: 24px!important;margin: 45px 0 7px 0!important;}
.list-group-item {border: 0px;font-size: 18px; margin: 0 0 5px 0; line-height: 1.325em;}
.projets-photos-col img {margin-bottom: 45px;}
.projets-liste-col {padding-left: 15px!important;margin-left: -1px;padding-right: 5px;}
.tooltip-bcma-image img {width: 350px;}
	.contact {font-size: 26px;line-height: 1.3em;margin: 15px 0 44px 3px;}
	#modal-photo .modal-dialog {max-width: 60%;}
	.table-equipe {margin: 0 30px 22px 19px;font-size: 18px;width: 56%;}
	.logo-contact {width: 20%;margin-top: 6%!important;}
	.main-menu .nav li a {font-size: 23px!important;}
	.nav li {padding: 4px;}
	.publications-content {padding: 80px 124px 30px 40px!important;}
	.tooltip-equipe-image img {width: 185px;}
	.h-100vh {height:95vh!important;}
    .tooltip-bcma .tooltip-bcma-image {left: 50%;transform: translate(-50%,14px);}
    .tooltip-equipe .tooltip-equipe-image {transform: translate(-50%,33px);}
}


/* ANIMATION */
.transparent {
opacity: 0.12;
filter: alpha(opacity=12);
zoom: 1;}

@-webkit-keyframes spin {from {  -webkit-transform: rotate(0deg); }  to {  -webkit-transform:rotate(360deg);  } }

div.a {	
top:10%;
left:70%;
width: 90px;
height:90px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 40s;
    
}
div.b {
top:30%;
left:45%;
width: 110px;
height:110px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}
div.c {
top:50%;
left:10%;
width: 120px;
height:120px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}
div.d {
top:85%;
left:55%;
width: 90px;
height:90px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}
div.e {
top:30%;
left:5%;
width: 190px;
height:190px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 40s;
    
}
div.f {
top:40%;
left:60%;
width: 90px;
height:90px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}

div.g {
top:10%;
left:10%;
width: 120px;
height:120px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}

div.h {
top:5%;
left:45%;
width: 120px;
height:120px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 30s;
    
}

div.i {
top:20%;
left:80%;
width: 150px;
height:150px;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 50s;
    
}

div.j {
top:68%;
left:5%;
width: 150px;
height:150px;
	z-index: 20;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 60s;
    
}

div.k {
top:60%;
left:40%;
width: 190px;
height:190px;
	z-index: 20;
position:fixed;
	-webkit-animation-name: spin; 
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 60s;
    
}


/* NAVIGATION */
.main-menu{width: 100%; height: 100%; opacity: 0; visibility: hidden;}
.nav-open .main-menu {opacity: 1; visibility: visible; background: rgba(255, 255, 255, 0.96); }
.main-menu .nav li a{font-size: 2.2vh; color:#222; padding: 0.3rem 0.8rem;}
.main-menu .nav li{
    opacity: 0;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
    -webkit-animation-timing-function: cubic-bezier(.45,.005,0,1);
    -moz-animation-timing-function: cubic-bezier(.45,.005,0,1);
    -o-animation-timing-function: cubic-bezier(.45,.005,0,1);
    animation-timing-function: cubic-bezier(.45,.005,0,1);
}
.nav-open .main-menu .nav li{
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: -webkit-transform .8s,opacity .8s;
    transition: transform .8s,opacity .8s;
}

.nav-button{position:fixed; z-index:1111;  height:42px; display:block; width:50px; padding:12px;right: 18px }
.nav-button #nav-icon3{width:24px;height:22px;display:inline-block;position:relative;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;transition:.5s ease-in-out;cursor:pointer;}
.nav-button #nav-icon3 span{display:block;position:absolute;height:1px;width:100%;background:#000;border-radius:9px;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out}
.nav-button #nav-icon3 span:nth-child(1){top:0}
.nav-button #nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3){top:7px}
.nav-button #nav-icon3 span:nth-child(4){top:14px}
.nav-open #nav-icon3 span:nth-child(1){top:9px;width:0;left:50%}
.nav-open #nav-icon3 span:nth-child(2){-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
.nav-open #nav-icon3 span:nth-child(3){-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
.nav-open #nav-icon3 span:nth-child(4){top:9px;width:0;left:50%}

.flex-center{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;height:100%}
