/*** CSS GENERIQUE AU MODULE ***/

.cf-aside-summary {
    position: sticky;
    top: 10px;
    padding: 40px 20px;
}
.cf-aside-summary > p {
    font-size: 22px;
    font-family: 'Audiowide', sans-serif;
    text-align: center;
    margin: 0px 0px 20px 0px;
}
.cf-aside-summary > ul {
    text-align: left;
}
.cf-aside-summary > ul li {
    display: flex;
}
.cf-aside-summary > ul li a {
    padding-top: 7px;
    padding-bottom: 7px;
    color: #000;
    width: 100%;
}

.cf-aside-summary > ul li.is-h2:first {
    margin-top: 0px;
}
.cf-aside-summary > ul li.is-h2 a {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
    padding-left: 7px;
}
.cf-aside-summary > ul li.is-h3 a {
    font-size: 14px;
    margin-bottom: 7px;
    padding-left: 17px;
}
.cf-aside-summary > ul li.is-h4 a {
    font-size: 14px;
    margin-bottom: 7px;
    padding-left: 27px;
}



/*** CSS SPECIFIQUE AU SITE ***/

/* Effet de hover quand les <li> et <a> du sommaire */

.cf-aside-summary > ul li a:hover {
    background-color: #ededed;
}
.cf-aside-summary > ul li a.active {
    color: #FFF;
    font-weight: normal;
}

div.html .cf-aside-summary > ul li a.active {
    background-color: #D6D6D6;
    color: #000;
}

div.css .cf-aside-summary > ul li a.active {
    background-color: var(--secondary-color);
}

div.javascript .cf-aside-summary > ul li a.active {
    background-color: var(--primary-color);
}

div.php .cf-aside-summary > ul li a.active {
    background-color: var(--black-color);
}