/*FONTS*/

h1, h2, h3{
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    color: #1F2937;
}
h1{
    font-size: 48px;
}
h2{
    font-size: 36px;
}
h3{
    font-size: 30px;
}
@font-face {
    font-family: 'Segoe UI';
    src: url('fonts/Segoeui/Segoe\ UI.ttf');
    src: /*url('fonts/EntezareZohoor2.eot?') format('☺'),
         url('fonts/EntezareZohoor2.woff') format('woff'),*/
         url('fonts/Segoeui/Segoe\ UI.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }
p{
    font-family: "Segoe UI", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #161616;
}

/*COLORS*/
/* primary colors */
.primary-color {
    color : #FBBE43;
  }
.hover-primary-color-custom:hover{
    color : #FBBE43
}
.bg-primary-color{
    background-color : #FBBE43;
}
.navyblue-custom{
    color: #1F2937;
}
.cBlack-color {
    background-color : #1F2937/* #272727*/;
  }
/*secondary colors*/
.bg-wikifieur{
    background-color: #68DBFF;
}
.bg-photograph{
    background-color: #6EE8A6;
}
.bg-cartographer{
    background-color: #FF6984;
}

/* IMAGES */
#bg-header{
    background-image: url("./img/bg-section1.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}
.img-d-none-custom{
    display: none;
}
#icone-profil-size{
    width: 24px;
    height: auto;
    margin-right: 8px;
}

/* CTA */
.cta-custom{
    display: block;
    width: fit-content;
    padding : 8px 24px; 
    background: #FBBE43; 
    color: #161616; 
    text-align: center; 
    font-weight: bold; 
    border-radius: 20px; 
    text-decoration: none;
    margin: 22px 0px 22px 0px;
}

.cta-custom:hover{
    background: #FDFDFD;
    outline: 3px solid #FBBE43;
}

.w-auto-custom{
    width: auto;
    max-height: 40px;
    margin: auto 0px 0px 0px;
}

/*Media queries = responsive*/
/*suppression image header en mobile car allourdi la page*/
@media (max-width: 500px){
    #bg-header, #bg-mobile{
        background-image: none;
        background-color: #f9f9f9;
    }

}

