JSFiddle - React, Tailwind, and code Playground

HTML

<title> NSP23, город Харьков</title> 

<link rel="stylesheet" type="text/css" href="http://nsp23.com/styles.css" media="all" />
<link rel="icon" href="http://nsp23.com/images/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://nsp23.com/images/favicon.ico" type="image/x-icon">


	
<h1 id="logo">Natures Sunshine</h1>

<!--------------------- Это Меню сайта ---------------------->

	<script type="text/javascript" src="http://nsp23.com/scripts/jquery-1.4.min.js"> </script>
	<script type="text/javascript" src="http://nsp23.com/scripts/myScripts.js"> </script>
	
        
<!-- ----------- -->
<!-- ----------- -->
    <nav class="clearfix">
	<ul>
		<li class="active fromLeft cssOnly">
		<a id="nHom"  href=" ">
                <span> Главная </span></a>                 
                </li>

		<li class="fromLeft cssOnly">
		<a id="nAbo" href="http://nsp23.com/Page/Supplements/Supplements.html">
                <span> About Us </span></a>
		</li>	

		<li class="fromTop cssOnly">
		<a id="nPro" href="http://nsp23.com/Page/Cosmetics/Cosmetics.html">
                <span> Products </span></a>
		</li>

		<li class="inOut last cssOnly">
		<a id="nCon" href="http://nsp23.com/Page/PriceList/Price.htm">
                <span> Прайс-лист </span></a>
		</li>
	</ul>
	</nav>
 
<!-- ------------------------------------ -->
<!-- ------------------------------------ -->
<div id="font" >
 
<h1 id="h2" align="center" ><strong> Сайт работает в тестовом режиме </strong> </h1>


 

    
  
    
    
 </div>

CSS

/* class="current" */

/* основное меню */

#menu { float: center; padding: 40px 0 0; margin: 0 0 38px; }

#menu li { font-size: 1.1em; display: inline; }

#menu li a { float: left; width: 87px; padding: 2px 0 7px; text-align: center; margin: 0 0 0 10px; color: #636365;  }

#menu li a.current { background: #fff url(http://nsp23.com/images/button.gif) no-repeat; color: #fff; }

#menu li a:hover { text-decoration: none; color: #000; background: #fff url(http://nsp23.com/images/button_grey.gif) no-repeat; }


/* Прайс лист на БАДы NSP */

#h1 {
font-family: arial, verdana, sans-serif;
font-size: 32px;
color: #000000 ;
}


/* RESET */
 ol, ul, li,  td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	text-decoration: none;
}


:focus, :active { outline: 0 }

ol, ul { list-style: none }


.right { float: right }
.left { float: left }

/* Clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix             { zoom: 1 } /* IE6 */
*:first-child+html .clearfix { zoom: 1 } /* IE7 */

header, nav { display: block } /* HTML5 tags */


/* L A Y O U T */
html { background: #d5bd89 url(http://nsp23.com/images/bgHtml.jpg) repeat                }
body { background: url(http://nsp23.com/images/bgBody.png) no-repeat top center; min-height: 450px; }

/* HEADER */
header {
	width: 960px;
	margin: 0 auto;
	padding-top: 30px;
}

#logo {
	background: url(http://nsp23.com/images/logo.png) no-repeat;
	width: 460px;
	height: 80px;
	text-indent: -9999px;
	display: block;
	margin: 0 0 25px 8px;
}


#logo2 {
	background: url(http://nsp23.com/images/logo2.png) no-repeat;
	width: 270px;
	height: 64px;
	text-indent: -9999px;
	display: block;
	margin: 0 0 25px 8px;
}


/* Navigation */
ul li {
	display: inline-block;
	position: relative;
	float: left;
	margin: 0 6px 20px 0;
}
ul li a {
	background:...