JSFiddle - React, Tailwind, and code Playground

by Bizon4ik

HTML

<body>
<div id="wrapper">
    <header>
            <div id="header_right">
            <a href="#" > 
                <img src="img/logo.png" alt="logo"/>
                <h2>Environmental.com</h2>
                <p>site slogan here</p>              
            </a>
            </div>            
        <p id="header_left">Help Line 24 /7 Support  1800 3246 345</p>
    </header> 
</div><!-- Close wrapper-->

CSS

body {
    background: white;
    min-height: 100%;      
}
p{
    font-family:arial sans-serif;
    color:black;
    font-size:12px;
}
a {
    text-decoration: none;
    outline: none;
    font-family:arial sans-serif;
    font-size: 12px;
}
a:hover {
    text-decoration: underline;
    outline: none;
    font-size: 12px;
    color:red;
    }
#wrapper {
    width: 1024px;
    margin: 0 auto;
    }
/*-------------------header--------------------*/
header {
    background: url("img/bg_header.jpg") #353a33;
    height: 112px;
    overflow: hidden;
}
#header_right {
    padding:29px 0 0 47px;
    width: 460px;
    float:left;    
}
header img {
    float: left;        
}
header a {
    display:block;
}
header h2 {
    font:31px Century Gothic, Arial, sans-serif;
    color:#ffffff;
    padding-left:64px ;  
    text-shadow: #9a9c99 1px 1px 1px;      
}
header #header_right p {
    font:italic 18px Century Gothic, Arial, sans-serif;
    color:#ffffff;
    padding-left: 208px;
    text-shadow: #9a9c99 1px 1px 1px;  
    margin-top: -7px;
}
header a:hover {
    text-decoration: none;
}
#header_left {
    text-align: right;
    padding:51px 44px 0 0;
    font:12px Century Gothic, Arial, sans-serif;
    color: #fff;
    text-shadow: #9a9c99 1px 1px 1px;
}