.diplome {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-block: 24px;
    scroll-margin-top: 150px;

    @media (width > 768px) {
        margin-block: 48px;
    }

    h2 {
        color: var(--_bg-color);
    }

    .cols {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;

        @media (width > 830px) {
            flex-direction: row;
            gap: 64px;
        }

        .left {
            flex: 1;
        }

        .right {
            border-radius: 8px;
            background: #FDFEFF;
            box-shadow: 0 0 15.2px -7px rgba(0, 0, 0, 0.29);
            
            @media (width > 830px) {
                border-radius: 16px;
                width: 40%;
            }
            
            .title {
                display: flex;
                align-items: center;
                justify-content: center;
                text-align: center;
                height: 60px;
                color: #FDFEFF !important;
                font-size: 2.4rem;
                line-height: 130%;
                background: var(--_bg-color);
                border-radius: 16px 16px 0 0;
                margin-bottom: 0 !important;
            }

            .content {
                padding: 24px;

                ul {

                    li {

                        &::marker {
                            color: var(--_bg-color);
                            font-size: 1.6em;
                        }
                    }
                }
            }
        }
    }
}