/* ------- Style général du site ------- */

html, body {
    height: 100%;
    margin: 0;
}

body{
    background-color: #fdfbfe;
}

/* ------- Typographie ------- */

h1{
    color: rgb(16, 0, 21);
    font-family: "Sora", sans-serif;
    font-style: normal;
}

h2, h3{
    font-family: "Manrope", sans-serif;
}

p{
    font-family: "Inter", sans-serif;
}

h2, h3, p, a, span{
    color: rgb(16, 0, 21);
}

/* ------- Classes personnalisées de couleurs utilisée sur tout le site ------- */

.darkPurple{
    background-color: rgb(16, 0, 21) !important;
}

.midPurple{
    background-color: rgb(30, 16, 34) !important;
}

.lightText{
    color: white !important;
}

.complementary{
    background-color: #FFD500;
}

.darkText{
    color: #1B1B2F !important;
}

/* ------- Style spécifique aux écrans tablettes en mode portrait  ------- */

@media (min-width: 576px) and (max-width:767px){
    h1{
        font-size: 1.8rem;
    }
    
    h2{
        font-size: 1.6rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.3rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1rem;
        line-height: 1.5;
    }

    
}

/* ------- Style spécifique aux écrans tablettes en mode paysage  ------- */

@media (min-width: 768px) and (max-width: 1199px) {
    h1{
        font-size: 1.8rem;
    }
    
    h2{
        font-size: 1.6rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.3rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1.2rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1.2rem;
        line-height: 1.5;
    }
      
}

/* ------- Style spécifique aux ordinateurs écran entre 1200px et 1400px ------- */

@media (min-width: 1200px) and (max-width:1400px){
    h1{
        font-size: 2rem;
    }
    
    h2{
        font-size: 1.8rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.3rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1.2rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1.2rem;
        line-height: 1.5;
    }
 
    
}

/* ------- Style spécifique aux ordinateurs écran entre 1400px et 1850px ------- */

@media (min-width: 1400px) and (max-width:1850px){
    h1{
        font-size: 2.30rem;
    }
    
    h2{
        font-size: 2rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.3rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1.5rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1.15rem;
        line-height: 1.5;
    }
    


}

/* ------- Style spécifique pour grands écrans ------- */

@media (min-width: 1850px){
    h1{
        font-size: 2.30rem;
    }
    
    h2{
        font-size: 2rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.3rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1.5rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1.15rem;
        line-height: 1.5;
    }
    
    
    
}

/* ------- Style spécifique pour les téléphones ------- */

@media (max-width: 575.98px){
    h1{
        font-size: 1.5rem;
    }
    
    h2{
        font-size: 1.3rem;
        /*font-size: 1.50rem;*/
        line-height: 1.6;
    }
    
    h3{
        font-size: 1.2rem;
        line-height: 1.6;
    }
    
    p{
        /*font-size:1.2rem;*/
        font-size: 1rem;
        line-height: 1.5;
    }
    
    a{
        font-size: 1rem;
        line-height: 1.5;
    }
    
    
}