<html lang="fr">
<head>
<meta charset="utf-8">
  
<style type="text/css">
    
@font-face {
font-family: 'Montserrat';

}

body{
font-family: 'Montserrat';
margin:0px;
padding:0px;
background-color: #B7DEE2;
color: white;
}

::-webkit-scrollbar {
display: none; 
}

.hide-scrollbar
{
overflow: auto;
-ms-overflow-style: none;   
}

    
a:link {
text-decoration: none;
color:white;
}

a:visited {
text-decoration: none;
color: white ;
}

a:hover {
text-decoration: none;
color: #FFE000;
}

a:active {
text-decoration: none;
}
      
#page{
width: 100%;
height: 100%;
display: flex;
flex-flow: row wrap;
overflow-y: hidden;
}
       
#menudescriptif {
width:400px;
height: 100%;
overflow: scroll;
display: inline;
}
    
.items {
margin-left:40px;
margin-top:30px;
font-size:25px;
text-decoration: none;
font-weight: 500;
}
    
.description {
margin-left:40px;
margin-top:50px;
font-size:25px;
text-decoration: none;
font-size: 17px;
font-weight: 400;
line-height: 140%;
text-align: left;
margin-bottom: 15px; 
}
    
#contenu_page {
width: calc(100vw - 450px);
height:100vh; 
overflow-Y:scroll; 
margin-left: 50px;

}   
     
span.t1_blanc
{color:white;
font-weight: 600;
}
    
span.t2_blanc
{ color: lightcyan;
font-weight: 500;
}     
      
    
span.t3_blanc
{color:white;}    

span.t4_blanc
{color:white;
font-weight: 500;
}  


    
.images_centres
{
margin-top: 50px;
margin-right: 50px;
align-items: center;
justify-content: center;
display: flex;
flex-flow: row wrap;
}
    
.image_gm
{
margin-bottom: 20%;
width: 100%;
}
    
.image_pm
{
margin-bottom: 5%;
width: 100%;
}
    
.image_vertical
{
margin-bottom: 100px;
width: 100%;
}
    
.image_fin
{
margin-bottom: 20%;
width: 100%;
}
    
    
.flexcontainer_images
{
display : flex;
flex-flow : row wrap;
align-items: center;
justify-content: center;
margin-bottom: 125px;
}

.fleximage
{
margin-top : 25;
margin-right : 25;
width: 600px;
}
    
.logo
 {
width: 20px;
    }
    
span.logo
{
font-size: 30px;
    }

/*memoire*/ 
    
.gif_memoire
{
height: 500px;
margin-bottom: 100px;
}
    

/*stage*/ 
    
.fleche
{
margin-right: 40%;
margin-left: 40%;
margin-bottom: 30%;
width: 25px;
}
    
.textelien
{
margin-top: 35%;
margin-bottom: 10%;
font-size: 3em;
}
    
/*biomimetisme*/ 
    
.wrapper_long
{
position: relative;
overflow: auto;
}

.image_longue
{
overflow: auto;
}
    

/*huawei*/ 
    
    
.liste_videos
{
margin-top: 50px; 
margin-right : 40px;
    }
    
 
video
{
width: 100%;
margin-bottom: 50px;
}

/*mediaquery*/    

@media screen and (max-width: 1250px) {

    
#page{
overflow-y: scroll;
}
    
#contenu_page 
{
width: 100%;
position: relative;
overflow-Y: visible; 
}
#menudescriptif
{
width: 95%;
text-align: justify;
padding-right: 0px;
border-right: 0px;
height: auto;
}
.image_gm
{
margin-bottom: 15%;
} 
.image_pm
{
margin-bottom: 5%;
}   
.image_petite
{
margin-bottom: 20%;
width: 50%;
}    
span.logo
{
font-size: 60px;
}
.logo
{
width: 40px;
} 
.nom
{ 
display: none; 
} 
    
}

@media screen and (max-width: 1000px) {

   
span.logo
{
font-size: 140px;
    }
.logo
 {
width: 100px;
    }
    
span.t1_blanc
{font-size:40px;
line-height: normal;} 
    
span.t2_blanc
{font-size:40px;
line-height: normal;
}   
    
span.t3_blanc
{font-size:40px;
line-height: normal;} 

span.t4_blanc
{font-size:40px;
line-height: normal;} 

}
