JSFiddle - React, Tailwind, and code Playground

HTML

<div class="second-menu">
    <div class="site-header-kontejner">
        <nav id="site-navigation" class="second-navigation" role="navigation">
            <div class="menu-main-menu-container">
                <ul id="menu-main-menu" class="menu">
                    <li id="menu-item-383" class="menu-item menu-item-has-children menu-item-383">	<a href="#">Live show</a>

                        <ul class="sub-menu">
                            <li id="menu-item-388" class="menu-item menu-item-388">	<a href="#">Audio</a>

                            </li>
                            <li id="menu-item-389" class="menu-item menu-item-389">	<a href="#">References</a>

                            </li>
                            <li id="menu-item-390" class="menu-item menu-item-390">	<a href="#">Photo</a>

                            </li>
                            <li id="menu-item-391" class="menu-item menu-item-391">	<a href="#">Video</a>

                            </li>
                            <li id="menu-item-392" class="menu-item menu-item-392">	<a href="http://#">Order</a>

                            </li>
                            <li id="menu-item-393" class="menu-item menu-item-393">	<a href="http://#">Gift</a>

                            </li>
                        </ul>
                    </li>
                    <li id="menu-item-384" class="menu-item menu-item-384">	<a href="http://#">Cards</a>

                    </li>
                    <li id="menu-item-385" class="menu-item menu-item-385">	<a href="#">Person</a>

                    </li>
                    <li id="menu-item-386" class="menu-item current-menu-item menu-item-has-children menu-item-386">	<a href="#">Elvis Presley</a>

                        <ul class="sub-menu">
                            <li id="menu-item-396" class="menu-item menu-item-396">	<a href="#">Biography</a>

                            </li>
                            <li id="menu-item-397"...

CSS

.second-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
    position: relative;
}
.second-navigation ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
    float: left;
}
.second-navigation li {
    float: left;
    line-height: 50px;
    display: inline-block;
    z-index: 100;
}
.second-navigation ul > li > ul {
    position: absolute;
    left: 0;
    top: 100%;
    padding: 0 1000em;
    /* trick from css-tricks comments */
    margin: 0 -1000em;
    /* trick from css-tricks comments */
    z-index: 101;
    visibility: hidden;
}
.second-navigation ul > li:hover > ul {
    visibility: visible;
}
.second-navigation > ul > li > ul > li {
    padding: 3px 0;
}
.second-navigation > ul > li:hover .drop {
    font-weight: bold;
}
.second-navigation a {
    display: block;
    text-decoration: none;
    color: white;
    font-family:'Ubuntu', sans-serif;
    font-weight: 300;
    font-size: 15px;
    padding-right: 17px;
    padding-left: 17px;
}
.second-navigation a:hover {
    text-decoration: underline;
}
.second-navigation ul ul {
    float: left;
    position: absolute;
    top: 1.5em;
    left: -999em;
    z-index: 99999;
    background-color: #2e7a60;
}
.second-navigation ul ul ul {
    left: -999em;
    top: 0;
}
.second-navigation ul ul a {
}
.second-navigation ul ul li {
}
.second-navigation li:hover > a {
    background-color: #2e7a60;
}
.second-navigation ul ul :hover > a {
}
.second-navigation ul ul a:hover {
}
.second-navigation ul li:hover > ul {
    left: 0;
    overflow: hidden;
    height: 50px;
}
.second-navigation ul ul li:hover > ul {
    left: 100%;
}
.second-menu {
    background: #479379;
    position: absolute;
    top: 110px;
    left: 0;
    right: 0;
    height: 50px;
    z-index: 1;
}
.site-header-kontejner {
    width: 1024px;
    margin: 0 auto;
}
li.current-menu-item {
    background-color: #2e7a60;
}
.second-navigation ul > li.current-menu-item > ul {

}

li.current-menu-item .sub-menu...