@font-face {
    font-family: "Comfortaa";
    src: url(/fonts/Comfortaa-VariableFont_wght.ttf);
}

@font-face {
    font-family: "Handlee";
    src: url(/fonts/Handlee-Regular.ttf);
}


html, body {
    font-family: Comfortaa;
}

.bg-site-nav {
    background-color: #fff;
    color: #7c2f53;
}

.website-title {
    font-family: Handlee !important;
}

.bg-site-primary {
    background-color: #7c2f53;
}

.footer a {
     border: 0px !important;
    color: rgb(76, 142, 207) !important;
    background-color: white !important;
    text-decoration:none;
}


.btn-light, .btn-light:active, .btn-light:visited {
    border: 0px !important;
    color: rgb(76, 142, 207) !important;
    background-color: white !important;
}
    .btn-light:hover {
        border: 0px !important;
        color: rgb(76, 142, 207) !important;
        background-color: white !important;
    }


.btn-primary, .btn-primary:active, .btn-primary:visited {
    background-color: rgb(76, 142, 207) !important;
    border: 1px solid rgb(76, 142, 207) !important;
    color: white !important;
}

    .btn-primary:hover {
        background-color: white !important;
        border: 1px solid rgb(76, 142, 207) !important;
        color: rgb(76, 142, 207) !important;
    }

.btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary:visited {
    border: 1px solid rgb(76, 142, 207) !important;
    color: white !important;
    color: rgb(76, 142, 207) !important;
}

    .btn-outline-primary:hover {
        background-color: rgb(76, 142, 207) !important;
        border: 1px solid rgb(76, 142, 207) !important;
        color: white !important;
    }

.btn-secondary, .btn-secondary:active, .btn-secondary:visited {
    background-color: white !important;
    border: 1px solid #7c2f53 !important;
    color: #7c2f53 !important;
}

    .btn-secondary:hover {
        background-color: #7c2f53 !important;
        border: 1px solid #7c2f53 !important;
        color: white !important;
    }




.btn-tag, .btn-tag:active, .btn-tag:visited {
    background-color: white !important;
    border: 1px solid silver !important;
    color: #585858 !important;
}

    .btn-tag:hover {
        background-color: white !important;
        border: 1px solid rgba(95,156,217,1) !important;
        color: rgb(76, 142, 207) !important;
    }

.btn-tag-selected, .btn-tag-selected:active, .btn-tag-selected:visited {
    background-color: white !important;
    border: 1px solid rgba(95,156,217,1) !important;
    color: rgb(76, 142, 207) !important;
}

    .btn-tag-selected:hover {
        background-color: white !important;
        border: 1px solid rgba(95,156,217,1) !important;
        color: rgb(76, 142, 207) !important;
    }

.navbar a {
    font-size: 1em !important;
    font-weight: 400 !important;
    color: black !important;
    margin-right: 50px;
}
    .navbar a:hover {
        background-color: white !important;
        color: black !important;
    }
    .navbar a:active {
        color: black !important;
    }
    .navbar a:visited {
        color: black !important;
    }

.letter .male a {
    color: rgb(48, 156, 198) !important;
    text-decoration: none;
}

    .letter .male a:hover {
        color: rgb(48, 156, 198) !important;
    }

    .letter .male a:active {
        color: rgb(48, 156, 198) !important;
    }

    .letter .male a:visited {
        color: rgb(48, 156, 198) !important;
    }

.letter .female a {
    color: rgb(175, 123, 216) !important;
    text-decoration: none;
}

    .letter .female a:hover {
        color: rgb(175, 123, 216) !important;
    }

    .letter .female a:active {
        color: rgb(175, 123, 216) !important;
    }

    .letter .female a:visited {
        color: rgb(175, 123, 216) !important;
    }



.linkable {
cursor:pointer;
}



hr.colored {
    border: 0 !important;
    height: 5px !important;
    background: -moz-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* FF3.6+ */
    background: -webkit-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* IE10+ */
    background: linear-gradient(to right, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* W3C */
    opacity: 1 !important;
}

hr.colored-small {
    border: 0 !important;
    height: 1px !important;
    background: -moz-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* FF3.6+ */
    background: -webkit-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* IE10+ */
    background: linear-gradient(to right, rgba(223,157,185,1) 10.5%, rgba(192,156,221,1) 20%, rgba(192,156,221,1) 40%, rgba(95,156,217,1) 65%, rgba(95,156,217,1) 80%, rgba(94,190,227,1) 87.5%, rgba(94,190,227,1) 95%, rgba(94,190,227,1) 100%) !important; /* W3C */
    opacity: 1 !important;
}



.filter-title {
    font-size: 1.5em;
    font-weight: 500;
}

@media  screen and (max-width: 600px) {
    .title {
        font-size: 2em !important;
        font-weight: 500;
    }

    .subtitle {
        font-size: 2em !important;
        font-weight: 500;
    }

    .image-logo-name {
        width:120px !important;
    }
   
}

.image-logo-name {
    width: 200px ;
}

.subtitle {
    font-size: 2.5em;
    font-weight: 500;
}

.subsubtitle {
    font-size: 1.3em;
    font-weight: 500;
}

.title {
    font-size: 4em;
    font-weight: 500;
}

.nodata {
    color:silver;
}



.toolbar-letter {
    font-size: 0.8em;
    font-weight: 500;
}


.btn-female-active, .btn-female-active:active, .btn-female-active:visited {
    color: rgb(175, 123, 216) !important;
    border: 1px solid rgb(175, 123, 216) !important;

}

    .btn-female-active:hover {
        background-color: white !important;
        color: rgb(175, 123, 216) !important;
        border: 1px solid rgb(175, 123, 216);
    }


.btn-male-active, .btn-male-active:active, .btn-male-active:visited {
    color: rgb(48, 156, 198) !important;
    border: 1px solid rgb(48, 156, 198) !important;
}

    .btn-male-active:hover {
        background-color: white !important;
        color: rgb(48, 156, 198) !important;
        border: 1px solid rgb(48, 156, 198 ) !important;
    }

.btn-allgender-active, .btn-allgender-active:active, .btn-allgender-active:visited {
    color: rgb(232, 124, 170) !important;
    border: 1px solid rgb(232, 124, 170) !important;
}

    .btn-allgender-active:hover {
        background-color: white !important;
        color: rgb(232, 124, 170) !important;
        border: 1px solid rgb(232, 124, 170) !important;
    }


.btn-male-desactive, .btn-male-desactive:active, .btn-male-desactive:visited {
    color: silver !important;
    border: 1px solid rgb(232, 124, 170);
}

    .btn-male-desactive:hover {
        color: rgb(48, 156, 198) !important;
        border: 1px solid rgb(232, 124, 170);
    }

.filter-button {
    position: sticky;
    top: 0px;
    background-color:white;

}

.is-sticky {

}

.is-sticky .reduce {
   visibility:visible;
}



.reduce{
    visibility:hidden;
}

.consent-banner {
    display:none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    font-size: 16px;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
    z-index: 1000; 
}