.o-close {
    display: block;
    position: relative;
    width: 1em;
    height: 1em;
    font-size: 16px;
    text-indent: -999em;

    &:hover {
        color: $color--main;
    }

    &:before, &:after {
        content: '';
        position: absolute;
        left: calc(50% - .7em);
        top: calc(50% - 1px);
        width: 1.4em;
        height: 2px;
        border-radius: 1px;
        background-color: currentColor;
        transition: .2s ease-out;
    }

    &:before {
        transform: rotate(-45deg);
    }

    &:after {
        transform: rotate(45deg);
    }

    &--sm {
        font-size: 7px;
    }
}