JSFiddle - React, Tailwind, and code Playground

HTML

<nav class="nav_top clearfix">
				<div class="nav_top_inner width_940 clearfix">
					<ul class="clearfix">
						<li>
							<a href="#">О компании</a>

							<ul>
								<li>
									<a href="#">Экспертный центр</a>
								</li>

								<li>
									<a href="#">Структура</a>
								</li>

								<li>
									<a href="#">отзывы</a>
								</li>

								<li>
									<a href="#">Вакансии</a>
								</li>

								<li>
									<a href="#">объекты</a>
								</li>
							</ul>
						</li>

						<li>
							<a href="#">Услуги</a>

							<ul>
								<li>
									<a href="#">Экспертный центр</a>
								</li>

								<li>
									<a href="#">Структура</a>
								</li>

								<li>
									<a href="#">отзывы</a>
								</li>

								<li>
									<a href="#">Вакансии</a>
								</li>

								<li>
									<a href="#">объекты</a>
								</li>
							</ul>							
						</li>

						<li>
							<a href="#">Что нового</a>
						</li>

						<li>
							<a href="#">Правовая база</a>
						</li>

						<li>
							<a href="#">Техническая база</a>
						</li>

						<li>
							<a href="#">Контакты</a>
						</li>												
					</ul>
				</div>	
			</nav>

CSS

body{
    background: red;
}

.nav_top_inner > ul{
		width: 890px;
		float: left;
		margin-bottom: 0;
	}

		.nav_top_inner > ul > li{
			float: left;
			margin-right: 43px;
			position: relative;
		}

			.nav_top_inner > ul > li > a:hover{
				text-decoration: none;
				border-color: #fff;
				transition: 1s;
			}

			.nav_top_inner > ul > li > a{
				height: 53px;
				border-bottom: 2px solid #053f8c;
				padding-top: 17px;
				display: block;
				transition: 1s;

				color: #fff;
				text-transform: uppercase;
				font-weight: bold;
				text-decoration: none;
			}		

				.nav_top_inner > ul > li ul{
					display: none;
					position: absolute;
					bottom: 4;
					margin-bottom: 0;
					background: #053f8c;
					padding: 20px;
					width: 150px;
					margin-left: -75%;
					left: 50%;
				}

				.nav_top_inner > ul > li:hover ul{	
					display: block;
				}

					.nav_top_inner > ul > li ul li:first-child{
						padding-top: 0;
					}

					.nav_top_inner > ul > li ul li{
						padding-top: 10px;
					}

						.nav_top_inner > ul > li ul li a:hover{
							color: #83bdff;
							text-decoration: none;
						}

						.nav_top_inner > ul > li ul li a{
							color: #fff;
							font-weight: 500;
							text-decoration: none;
						}