@import url(https://fonts.googleapis.com/css?family=Montserrat);

*{
    font-family: 'Montserrat';
}

body {
    margin: 0 auto;
}



/* pour l'affichage de la demo de l'hypercube */
#controls {
    margin-top: 20px;
    margin-left: 20px; 
}

#graphs-container {
    display: flex; 
    gap: 20px; 
    padding-left: 20px; 
    margin-top: 20px; 
}

.jxgbox {
    width: 1000px;
    height: 1000px; 
    border: 1px solid black;
    border-radius: 10px;
}

/* tete de page */

header.header{
    display: flex;
    align-items: center;
    height: 50px;
}

section.top-page {
    background: url("./cubetoppage.png") center center/100% auto no-repeat;
    height: 80vh;
    padding: 25px;
}


#themeSwitch {
    position: absolute;
    top: 10px; /* Distance par rapport au haut de la fenêtre */
    right: 10px; /* Distance par rapport à la droite de la fenêtre */
    background-color: #007bff; /* Couleur de fond */
    color: #fff; /* Couleur du texte */
    border: none;
    padding: 10px 20px; /* taille du bouton */
    font-size: 16px; /* Taille de la police */
    border-radius: 5px; /* coins arrondis */
    cursor: pointer;
}


 #langSelect { /*bouton language */
    position: absolute;
    top: 50px;
    right: 10px;
    padding: 10px 33px;
    font-size: 16px;
    border-radius: 5px;
    border: 1px solid #ccc;
}


/* page de bienvenue (landing page) */

.landing-page{
    padding: 20px 50px;
}

.big-title{
    color: white;
    font-size: 80px;
    font-family: 'Montserrat';
}

.scroll-down{
    color: white;
    text-decoration: none;
    position: absolute;
    bottom: 160px;
}

/* menu de navigation */

nav.nav{
    display: flex;
    justify-content: space-between;
    list-style: none;
    width: 400px;
    margin-left: 30px;
}

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

/* Corps */

.section-title{
    font-size: 50px;
    font-family: 'Montserrat';
    font-weight: 100;
    position: relative;
    margin-left: 40px;
}

.section-title::before{
    content: "";
    position: absolute;
    background-color: aqua;
    width: 100px;
    height: 7px;
    bottom: 0;
}

.text-title{
    margin-left: 30px;
}


.text{
    margin-left: 20px;
    margin-right: 20px;
}

.text-list{
    margin-left: 30px;
    margin-right: 20px;
}

.text-list::before{
    content: "\2022";
    margin-right: 0.5em;
}


/* pied de page */

footer{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 100px;
}

footer a.more{
    text-decoration: none;
    color: black;
    font-weight: 600;
}