JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header-back">
<div id="header-stripes">
<div id="header">
  <a href="index.html"><div id="logo"></div></a>
  <div id="contact-info"></div>
</div>
</div>
</div>

CSS

#header {
	width: 1000px;
	max-width: 100%;
	min-width: 775px;
	margin: 0 auto;
	overflow: hidden;
	
}
#header-back {
	border-bottom: 1px solid #40FA05;
	background-color: #1EA20C;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00532f', endColorstr='#0aae4e', GradientType=0);
	background-image: -webkit-linear-gradient(bottom, #00532f, #0aae4e);
	background-image: -moz-linear-gradient(bottom, #00532f, #0aae4e);
	background-image: -ms-linear-gradient(bottom, #00532f, #0aae4e);
	background-image: -o-linear-gradient(bottom, #00532f, #0aae4e);
	background-image: linear-gradient(to top, #00532f, #0aae4e);
}
#header-stripes {
	max-width: 100%;
	max-height: 100%;
    background: url(http://secure12.com/gpEasy4/themes/pure1/images/rays5.png);
    background-repeat: no-repeat;
}
#logo {
	width: 467px;
	position: relative;
	left: 0px;
	float: left;
	display: block;
	padding: 10px 0 10px 0;
	/* height: 67px; */
	 height: 85px; 
	background: url(http://secure12.com/gpEasy4/themes/pure1/images/logo4.png) no-repeat left center;
}
#seal {
left: 594px;
height: 85px;
width: 116px;
position: absolute;
display: block;
z-index: 999999999999;
top: -156px;
}
#contact-info {
	width: 251px;
	height: 51px;
	position: relative;
	left: -70px;
	top: 18px;
	float: right;
	display: block;
	overflow: hidden;
	background: url(../images/contact-info3.png);
	left: 1px;
top: 25px;
}