Create borders in navigation.

Hi! I need to know how I can create these borders on my nav ( https://i.imgur.com/lspBRc6.jpg ). I've done it by editing the css but the navigation is blocked and I can't click on the links.

this is the code:
.main-nav{
position: relative;
z-index : 1;
}

.main-nav:after {
content : "";
position: absolute;
left : 25%;
bottom : 0;
height : 100%;
width : 50%;
border-bottom: 3px double magenta;
border-top: 3px double magenta;
}

Ps1: I have the premiun version.
Ps2: I'm sorry I can't publish the url of my website because I'm developing it locally.