.button.red.outline {
    background-color: transparent;
    border: 1px solid var(--mainColor);
    color: var(--mainColor);
}

.button.red.outline img {
    color: var(--mainColor);
}

.button.red img {
    color: var(--white);
}

button.button.gray {
    padding-top: 8px;
    padding-bottom: 8px;
}

.button > img {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.button:has(img) {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

.course-avolites .course-header-infos {
    max-width: 400px;
}

.course-avolites .button.gray {
    background-color: #BFC1C6;
    color: #312E2E;
}

.course-header-infos {
    margin-top: 24px;
}

.course-header-about-perex {
    margin: 12px 0 32px;
    line-height: 180%;
    max-width: 400px;
}