JSFiddle - React, Tailwind, and code Playground

HTML

<div class="time">
	       24hr/7 day help desk:<a href="#">12.07.2015<a>
	    </div>
        <nav>
            <div class="nav">
               <img src="http://savepic.su/5771092.jpg" width="300px" height="70px"> 
		       <span>company slogan here</span>
	        </div>
		    <div class="nav">
		       <a href="#">Home</a>
		    </div>
		    <div class="nav">
		       <a href="#">Services</a>
		    </div>
		    <div class="nav">
		       <a href="#">Request a Quote</a>
		    </div>		  
	    </nav>
	    <div class="top-container">
	        <div class="top-centre">
		       <img src="http://savepic.ru/7569356.jpg" height="250px">
		    </div>
		    <div class="top-list">
		        <ul>
			       <li><a href="#">Home</a></li>
				   <li><a href="#">Products</a></li>
				   <li><a href="#">Services</a></li>
				   <li><a href="#">Portfolio</a></li>
				   <li><a href="#">Custom solution</a></li>
				   <li><a href="#">Buisness solution</a></li>
			    </ul>
		    </div>
			<div class="text-link">
                <div class="text">
                    <b><p>"Sed gravida, lacus id molestie commodo, eros eros pellentesque leo, 
				    nec molestie turpis nibh vel felis. Aenean vehicula turpis"	</b>
                </div>
                <div class="link">
				    <ul>
					<li> Aenean pede enim </li>
					</ul>
				</div>
			</div>                    				
		</div>

CSS

img {
   vertical-align:middle;
   }
.nav {
   font-family:"Arial narrow";
   margin-left:70px;
   margin-right:80px;
   display:inline;
   }
.nav a {
   color:#888888;
   text-decoration:underline;
   }
.time {
   background-color:#999999;
   text-align:right;
   font-size:12px;
   top:0;
   }
.time a {
   color:#FACC2E;
   }
li { 
    list-style-image: url(http://www.lyceum7.ru/old/img/markerL.png); 	
    vertical-align:middle;
	font-family: "arial narrow";
	font-size:1.05em;
   }
.top-list a {
   color:#FFFFFF;
   }
.top-list a:hover {
   color:orange;
   }
.top-container {
   display:inline;  
   vertical-align: top;   
   }
.top-centre img {
   vertical-align:middle;
   width: 45%;
   float:left;
      }
.top-list {
   position:absolute;
   box-shadow: inset 0em 15px #685A5A;
   background-color:#413939;
   line-height: 1.7;
   left: 45%;
   height: 250px;
   width: 27%;
   float:left;
   }
.top-list ul {
   margin-top:40px;
   }
.text p {
   margin-left:10px;
   margin-right:10px;
   }
.text-link {
   position:absolute;
   left: 72%;
   width:28%;
   top:12%;
   height:250px;
   float:right;
   }
   .text {
   
   box-shadow: inset 0em 15px #6969A6;
   background-color:#444472;
   line-height: 1.7;
   color:white;
   font-family: "arial narrow";
   text-align:center;
   font-size:22px;
   left: 0;
   width: 100%; 
   height:80%   
   }
.link {
   top:80%;
   height:20%;
   width:100%;
   left:72%;
   top:270px;
   }