JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <div class="container">



        <div class="header">
            <a href="#"><img src="img/Logo.png" alt=""></a>
            <div class="search-form">
                <form action="" method="post" class="search">
                    <input type="search" name="" placeholder="Search" class="input" />
                    <input type="submit" name="" value="GO" class="submit" />
                </form>
            </div>
        </div>

        <!-- Верхнее меню -->

        <nav class="menu">
            <a href="#">Home</a>
            <a href="#">About Us</a>
            <a href="#">Service</a>
            <a href="#">Partners</a>
            <a href="#">Customers</a>
            <a href="#">Projects</a>
            <a href="#">Careers</a>
            <a href="#">Contact</a>
        </nav>

        <br>
        <!-- конец меню -->

        <!-- маркетинг -->


        <div class="block-mr">
            <h1>Fusce vitae nibh quis diam fermentum</h1>
            <p>Etiam adipiscing ultricies commodo.</p>
        </div>
        <nav class="mr-menu">
            <a href="#"><span class="number">1</span>Lorem Ipsum Dolop</a>
            <a href="#"><span class="number">2</span>Ultricies Pellentesque</a>
            <a href="#"><span class="number">3</span>Aliquam ipsum</a>
            <a href="#"><span class="number">4</span>Nullam sed mauris ut</a>
        </nav>
        <!-- конец маркетинга -->

        <!-- Ценртальная часть -->

        <div class="about">
            <div class="row">
                <div class="col-md-2 about-left">
                   <div class="about11"></div>
                    <p> About WhiteSquare</p>
                    <img src="img/Image.jpg" alt="">
                </div>
                <div class="col-md-4 about-right">
                    <div class="about-txt-header"></div>
                    <p class="about-txt">In ultricies...

CSS

body {
    background-image: url(https://dl.dropboxusercontent.com/u/13088311/img/background.jpg);
}
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300);
.block-mr {
    margin-top: 30px;
    height: 330px;
    background-color: #e2e2e2;
    padding-left: 38px;
    padding-top: 15px;
}
h1 {
    color: #595959;
    text-transform: uppercase;
    font-family: 'Oswald';
    font-size: 38px;
}
p {
    color: #acacac;
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
}
.input {
    border: 1px solid #e7e7e7;
    /* stroke */
    border-right: 0px;
    background-color: #f3f3f3;
    /* layer fill content */
    width: 158px;
    height: 32px;
}
.submit {
    background-color: #29c5e5;
    /* layer fill content */
    border: 0px;
    width: 42px;
    height: 32px;
    margin-left: -5px;
    margin-top: 1px;
    color: white;
}
.search-form {
    float: right;
}
.header {
    margin-top: 27px;
}
.menu {
    margin-top: 27px;
    display: table;
    position: relative;
    width: 100%;
    height: 38px;
    border-top: 1px solid #e7e7e7;
    border-bottom: 1px solid #e7e7e7;
    background-color: #f3f3f3;
}
.menu a {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 14px;
    color: #888;
    line-height: 38px;
}
.menu a:first-child {
    border-left: 1px solid #e7e7e7;
}
.menu a:last-child {
    border-right: 1px solid #e7e7e7;
}
.menu a:hover {
    color: white;
    background-color: #29c5e5;
    border: 0px;
    text-decoration: none;
}
.mr-menu {
    display: table;
    position: relative;
    width: 100%;
    height: 50px;
    background-color: #f3f3f3;
    border-bottom: 1px solid #e7e7e7;
}
.mr-menu a {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    text-transform: uppercase;
    color: #8f8f8f;
    /* text color */
    font-family: "Oswald";
    font-size: 15px;
}
.mr-menu a:hover {
    color: #29c5e5;
    text-decoration:...