.presentation__header__component {
    /*box*/
    display:flex;
    align-items: center;
    justify-content: center;
    height:33.5px;
    width:33.5px;
    padding:6px;
    margin:0px 3px;

    /*border*/
    border:2px solid var(--c-cta-2);
    border-radius: 4px;

    /*transition*/
    -webkit-transition: background-color 0.3s;
    transition: background-color 0.3s;
}

.presentation__header__component>svg {
    /*box*/
    width:100%;
    height:100%;

    /*background*/
    fill:var(--c-cta-2);
}

/*--------------------------------------------------------------------------*\
            Disabled tab
\*--------------------------------------------------------------------------*/

.presentation__header__component:hover,
.presentation__header__component.is-active {
    /*background*/
    background-color: var(--c-cta-2);
}

.presentation__header__component:hover>svg,
.presentation__header__component.is-active>svg {
    /*background*/
    fill: var(--c-tertiary-4);
}