ArtViolence

флексбокс

Не надо тебе svg трогать, сделай картинку или просто текст, шрифт называется Impact.

Чтобы не бегать с такими вопросами в интернет, научитесь пользоваться инструментами разработчика. Нажимаете F12 в браузере, появляется консоль. "Щупаете" элементы и браузер показывает их размеры, стили и отступы. Надо выяснить от какого элемента этот отступ (padding или margin) и обнулить его.

<nav class="main-nav">
<a href="#">Главная</a>
<a href="#">Доставка и оплата</a>
<a href="#">О компании</a>
<a href="#">Отзывы</a>
<a href="#">Контакты</a>
</nav>

.main-nav
	display: table
	position: relative
	width: 100%
	height: 60px
	a
		color: #000
		display: table-cell
		text-align: center
		vertical-align: middle
		min-width: 120px
		text-decoration: none
		border-left: 1px solid lighten($accent, 5%)
		transition: background-color 1s easy
		&:last-child
			border-right: 1px solid lighten($accent, 5%)
		&:hover
			background-color: lighten($accent, 5%)
			text-decoration: none
			transition: background 1s easy

меню будет на всю ширину контейнера, тебе надо сделать его width: 100%. элементы распределятся равномерно и без промежутков