JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<div class="right">
    <div class="tel-no">
        <img src="http://s8.postimg.org/6gs0empq9/telephone_icon_fw.png" alt="telephone-icon">
        <p><span>015395 67957</span>

        </p>
    </div>
    <div class="cart1"> <a href="#header-cart" class="toggle-minicart skip-link skip-cart">
                        <!--<img src="" alt="cart-icon">
                    <span class="cart-label">5</span>-->


                        <img src="http://s15.postimg.org/ljktqifif/cart_icon_fw.png" alt="cart-icon">
                    <span class="cart-label">
                        0                    </span>
                    </a>

    </div>
    <div class="col-lg-4 col-md-5 col-sm-5 col-xs-12 top-cart" style="display: none">
        <div class="header-minicart">
<a href="#header-cart" class="skip-link skip-cart  no-count">
    <!--<span class="icon"></span>
    <span class="label"> ( </span>
    <span class="count"> )</span>-->
</a>

            <div id="header-cart" class="block block-cart skip-content">
                <div id="minicart-error-message" class="minicart-message"></div>
                <div id="minicart-success-message" class="minicart-message"></div>
                <div class="minicart-wrapper">
                    <p class="block-subtitle">Recently added item(s) <a class="close skip-link-close" href="#" title="Close">×</a>

                    </p>
                    <p class="empty">You have no items in your shopping cart.</p>
                </div>
            </div>
        </div>
    </div>
    <form id="search_mini_form" action="http://www.encorediamond.co.uk/catalogsearch/result/" method="get">
        <div class="header-search-form">
          ...

CSS

body{
    background:black;
}

img[alt="cart-icon"] {
    width: 20px;
}
img[alt="telephone-icon"] {
    /*width: 18px;*/
    margin-top: -4px;
    margin-right: 3px;
}
.right {
    float: right;
    text-align: right;
    margin-top: 21px;
}

.tel-no {
    color: #fff;
    margin-top: -7px;
    margin-right: 19px;
    font-weight: normal;
    text-align: right;
    font-size: 15px;
    font-family: avenirreg;
}

.tel-no p {
    margin-bottom: 0;
    display: inline;
}

.cart1 {
    float: right;
    margin-top: 9px;
    margin-right: 7px;
}

.top-cart .truncated {
    display: none;
}

.header-search-form {
    float: right;
}

.right input[type='text'] {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #7B7672;
    border-radius: 0;
    width: 125px;
    height: 21px;
    padding-left: 5px;
    margin-right: -19px;
    color: #ccc !important;
}

.right input[type='text']:focus {
    outline: none;
    background-color: #444;
}

.right button[type='submit'] {
    position: relative;
    border: none;
    /* background-size: 19px; */
    background-size: 15px;
    height: 25px;
    width: 25px;
    background: rgba(0, 0, 0, 0) url('../images/ico-search.png') no-repeat center center;
    left: -11px;
    top: 6px;
}

/* firefox*/
@-moz-document url-prefix() {
    .header-row-1 button[type='submit'] {
        position: relative;
        border: none;
        /* background-size: 19px; */
        background-size: 15px;
        height: 24px;
        width: 25px;
        background: rgba(0, 0, 0, 0) url('../images/ico-search.png') no-repeat center center;
        left: 0px;
        top: -25px;
    }
}

.header-row-1 button[type='submit']:hover {
    background-color: #ED1B24 !important;
}

.cart-label {
    background-color: red;
    color: #fff;
    /* border-radius: 11px; */
    padding: 2px 4px;
    font-size: 9px;
    position: relative;
    top: -9px;
    left: -11px;
}