JSFiddle - React, Tailwind, and code Playground
HTML
<div id="header-fix">
<div id="header" class="clearfix">
<div class="inner">
<a id="logo" href="http://ctvetcenter.com/">
<h1>
Connecticut Veterinary Center
</h1>
<h3>
The Pet E.R.
</h3>
</a>
</div>
</div>
</div>
CSS
#header-fix{
-webkit-border-radius:15px 15px 0 0;
overflow:hidden;
border-bottom:1px solid #041433;
border-top:1px solid #165eed;
-moz-border-radius:15px 15px 0 0;
border-radius:15px 15px 0 0;
border-right:1px solid transparent;
}
#header {
background:#082662;
background:-webkit-gradient(linear,0 0,0 bottom,from(#0f4ac1),to(#072663));
background:-webkit-linear-gradient(#0f4ac1,#072663);
background:-moz-linear-gradient(#0f4ac1,#072663);
background:-ms-linear-gradient(#0f4ac1,#072663);
background:-o-linear-gradient(#0f4ac1,#072663);
background:linear-gradient(#0f4ac1,#072663);
-pie-background:linear-gradient(#0f4ac1,#072663);
behavior:url(/public/ie/pie.htc);
color:#eee;
}
#header .inner {
padding:20px;
position:relative;
top:-20px;
padding-top:40px;
padding-bottom:0;
background:url(http://ctvetcenter.com/themes/ct-vet-center/images/cat.png) bottom right no-repeat;
}
#logo {
margin:0;
padding:0;
border:0;
text-decoration:none;
background:url(http://ctvetcenter.com/uploads/theme/logo.png) 0 0 no-repeat;
height:122px;
width:600px;
text-indent:-9999px;
display:block;;
}
#logo h1 {
font-weight:900;
font-size:30px;
color:#eee;
margin:0 0 20px;
padding:0;
}
#logo h3 {
margin:0;
padding:0;
color:#aaaaaa;
font-size:18px;
}