<a class="logo" target="_blank" href="/">
	<img src="${hook_action('web', 'logo')}" alt="logo"><span>${hook_action('web', 'name')}</span>
</a>

<style>
	.logo {
		display: block;
		overflow: hidden;
		position: relative;
		border-right: 1px solid rgba(0, 0, 0, 0.4);
		border-bottom: 1px solid rgba(0, 0, 0, 0.4);
		white-space: nowrap;
		color: inherit;
	}

	.logo img {
		max-height: var(--img_size_mini);
		margin: var(--margin_small);
	}

	.logo span {
		line-height: 2.25rem;
		font-size: var(--text_small);
	}

	.logo:before {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		left: 0;
		right: 0;
		bottom: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}

	.logo:after {
		content: "";
		display: block;
		position: absolute;
		height: 100%;
		right: 0;
		top: 0;
		border-right: 1px solid rgba(255, 255, 255, 0.1);
	}
</style>