/* FONTS */
@font-face {
    font-family: 'Kobe';
    src: url('fonts/Kobe.otf');  
}

@font-face {
    font-family: 'Aileron', sans-serif;;
    src: url('fonts/Aileron-Regular.otf');  
}

/* PAGE */
body {
    background-color: rgb(241, 241, 241);
    cursor: url('images/cursor-triangle.svg'), auto;
}

a {
    cursor: url('images/cursoor.svg'), pointer;
}

/* EN TÊTE */
    /* MENU STICKY */
    .menu-sticky {
        position: fixed;
        top: 0%;
        width: 100%;
        max-width: 16vw;
        height:100%;
        border-right: 1px solid red;
        color: #ff0000;
        background-color:rgb(248, 248, 248);
    }


            #menu {
                padding:0;
                margin:0;
                list-style:none;
                text-align: center;
                font-size: 1.2em;
                font-family: Aileron;
                
            }
            #menu ul {
                padding:0;
                margin:0;
                list-style:none;
                text-align: center;
            }

            #menu a {
                
                text-decoration: none;
                color: #ff0000;
                padding: 10px 0;
                font-family: Aileron;            
            }

            #menu ul li a, #menu li:hover li a {
                padding: 1px 0;
            }
            
            #menu a:hover  {
                text-shadow: 1px 1px 2px rgb(255, 255, 255), 0 0 1em rgb(255, 0, 217), 0 0 0.2em rgb(255, 122, 253);
            }

            #menu li li:hover a {
               
                
                font-size:1.2em;
                text-shadow: 1px 1px 2px rgb(255, 255, 255), 0 0 1em rgb(255, 0, 217), 0 0 0.2em rgb(255, 122, 253);
            }

            .logo {
    margin: 2vw auto auto auto ;
}

  h1 
{
    padding: 0px;
    font-family: 'Kobe';
    font-size: 2rem;
    color: rgb(255, 34, 0);
    
}
.menu2 {
    font-size: 0.7em;
    font-style: oblique;
}

footer {
    font-family: 'Aileron';
    font-size: 0.6em;
    color: rgb(255, 34, 0);
    padding: 5px;
    text-align: center;
}

a {
    color: rgb(255, 34, 0);
}

*
{
    text-align: center;
    
}

.table {
    width: 40vw;
    margin: 2vw 25vw auto 20vw;

}



.container {
    
    max-width: 80vw;
    

}

.textepage
{
    position:fixed;
    margin: 5vw 2vw 2vw 46vw;
    

}


.container p 
{
    
    
    padding: 50px;
    align-content: center;
    color: black; 
    font-size: 1em;
    font-family: 'Aileron';
    font-weight:400;
    

    
   
}

.introduction
{
    color: rgb(255, 34, 0); 
    font-weight: 700;
    font-style: italic;
    font-size: 1.5em;
}

.recherche1
{
    color: rgb(191, 0, 255); 
    font-weight: 900;
    font-style: italic;
    font-size: 1.4em;
}

.recherche2
{
    color: rgb(191, 0, 255); 
    font-weight: 600;
    font-style: italic;
    font-size: 1.1em;
}


   /* RESPONSIVE */
@media screen and (max-width: 1000px) {
    /* propriétés responsive */
    
    .menu-sticky {
      
        max-width: 30vw;
        background-color: rgba(255, 255, 255, 0.5);
    }
        
            #menu { 
                font-size: 2.2em;
                word-break: break-word;
            }
        
            h1 { font-size: 2em; }
        
            .projet {
                max-height: 50vw;
                max-width: 50vw;
        
            }
    

      .container  {
        margin-left: 13vw;
    }

    
        .flottant {
            height: 20vw;
        }


        .container p {
            font-size: 1.5em;
            border: 0px;
        }

        .table {
            width: 82vw;
            margin: 2vw auto auto 5vw;
        
        }

        .textepage
{
    position:fixed;
    margin: 30vw 2vw 2vw 35vw;
    background-color: rgba(255, 255, 255, 0.3);
    
    

}
    }