JSFiddle - React, Tailwind, and code Playground

HTML

<link type="text/css" rel="stylesheet" href="http://fast.fonts.net/cssapi/d7952aca-1543-435b-ba95-503917ed6038.css"/>

<table>
    
    <tr>
        
        <td colspan="2">
    <img id="logo" width="500"...

CSS

body {
    font-family:'BrandonGrotW01-Regular', 'Helvetica';

    font-size: 18px;
    
}

.wrapper {
    max-width: 600px;
    margin: 0 auto;   
    

}

img#logo {
    margin: 20px auto 20px auto;
    display: block;
    width: 90%;
    max-width: 500px;
}

.map {
    margin: 0 auto;    
}

h1, h2, h3 {
    font-family:'Brandon Grot W01 Bold';
    font-size: 35px;
    
    padding-right: 30px;
}

.h-line {
    display: block;
    height: 2px;
    background: #C63335;
    width: 100%;
    width: 100vw;
    position: relative;
    z-index: 999;
    margin: 0 -600rem;
    padding: 0.25rem 600rem;
    
    top:30px;
}

.col.left, .col.right {
    float:left;
    width: 50%;
    

}
.col {
    float: left;
    width: 100%;    


}
img.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}