span {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    pointer-events: none;
}

span.logo {
    content: url(../images/vectors/logo.svg);
    width: 25px;
}

span.qrcode {
    content: url(../images/vectors/qr-code-icon.svg);
    width: 25px;
}

span.info-icon {
    content: url(../images/vectors/info-icon.svg);
    width: 25px;
}

span.doc {
    content: url(../images/vectors/doc.svg);
    width: 25px;
}

span.bolt {
    content: url(../images/vectors/bolt-icon.svg);
    width: 25px;
}

span.minecraft-icon {
    content: url(../images/vectors/minecraft-icon.svg);
    height: 25px;
}

span.archive-icon {
    content: url(../images/vectors/archive-icon.svg);
    width: 25px;
}

span.hamburger {
    content: url(../images/vectors/hamburger.svg);
    width: 30px;
}

span.hammer {
    content: url(../images/vectors/hammer.svg);
    width: 25px;
}

span.faq {
    content: url(../images/vectors/faq.svg);
    width: 25px;
}

span.discord {
    content: url(../images/vectors/discord.svg);
    height: 0.75rem;
}

span.el {
    content: url(../images/vectors/external-link.svg);
    height: 0.75rem;
}

.with-icon {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 20px;
    padding-right: 20px;
}

.with-icon .info-icon {
    width: 18px;
    height: 18px;
    content: url(../images/vectors/info-icon.svg);
    display: inline-block;
}

.with-icon .faq {
    width: 18px;
    height: 18px;
    content: url(../images/vectors/faq.svg);
    display: inline-block;
}

.with-icon .doc {
    width: 18px;
    height: 18px;
    content: url(../images/vectors/doc.svg);
    display: inline-block;
}