JSFiddle - React, Tailwind, and code Playground

by HappyCougar

HTML

<link rel="stylesheet" href="http://cougardesign.ru/templates/cougarnest/css/style_new.css">
<link rel="stylesheet" href="http://cougardesign.ru/templates/cougarnest/css/layout.css">
<div class="about_us_main">
<table class="main_tab">
    <tr>
        <td class="abtd"><div class="about_us"><span class="h2_lable">CougarDesign</span> <span>- молодая развивающаяся студия веб-разработки, состоящая из людей любящих свою работу.</span>
            <br /><br />
            <p> Мы постоянно стремимся к самосовершенствованию и максимально качественно выполняем поставленные нам задачи.</p></div></td>
        <td><div class="rainbow_box">
<div class="rainbow_cougar"><img src="http://cougardesign.ru/templates/cougarnest/images/COUGAR.png" alt="" class="r_cougar"/>            </div>
    </div></td>
    </tr>
</table>
<br />
<h2 class="open_h2">Вот несколько причин работать с нами :</h2>
<br />
<div class="about_us_box au2">
    <img src="https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/like-128.png" alt="Индивидуальный подход" class="about_us_box_img"/>
    <h2>Индивидуальный подход</h2>
    <p>Наш проект-менеджер выяснит что вы хотите, составит план работ и будет с вами в контакте на все время сотрудничества</p>
</div>
<div class="about_us_box au1">
    <img src="https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/settings-128.png" alt="Идем в ногу со временем" class="about_us_box_img"/>
    <h2>Идем в ногу со временем</h2>
    <p>Одной из главных причин работы с нами - является использование студией современных технологий и нестандартных решений</p>
</div>
<div class="about_us_box au3">
    <img src="https://cdn3.iconfinder.com/data/icons/linecons-free-vector-icons-pack/32/phone-128.png" alt="Не забываем о мобильных устройствах" class="about_us_box_img"/>
    <h2>Не забываем о мобильных устройствах</h2>
    <p>Красивый и удобный сайт адаптированный для планшетов и мобильных, вот - что выгодно выделит вас, среди ваших...

CSS

.open_h2 {
    font-family: 'Open Sans';
    margin: 0px 0px 0px 20px;
    color: #5F5F5F;
    font-size: 23px;
    font-weight: 500;
}
.main_tab, .main_tab table {
    border:0px !important;
    border-top: 3px dashed #CCC !important;
    border-bottom: 3px dashed #CCC !important;
}
.main_tab td, .main_tab tr {
    border:0px;
}

.h2_lable {
    font-size: 21px;
    font-weight: normal;
    margin: 0px;
    color: #EFD076;
    font-family: KabelC-Book;
}
.about_us {
    font-size: 19px;
    font-family: 'Open Sans';
    padding:20px;
}
.about_us p {
   font-size: 19px;
   font-family: 'Open Sans'; 
}
.about_us_main {
    background:#fff !important;
    width:950px;
}
.about_us {
    vertical-align:top;
    margin-top:25px;
}
.main_tab {
    width:100%;
}

.about_us_box {
    width: 100%;
    height: 150px;
    padding-top:10px;
    position:relative;
}
.about_us_box p, .about_us_box h2{ 
    padding-left:170px;
    padding-right:50px;
    color: #494949;
}
.au1 {
    background:#85A6FA;
}
.au2 {
    background:#BDDF8A;
}
.au3 {
    background:#fdbc72;
}
.au4 {
    background:#FF875F;
}
.about_us_box p {
font-size: 18px;
}
.about_us_box h2 {
font-family: 'Open Sans', sans-serif;    
}
.about_us_box_img { position:absolute; left:15px; top:15px; opacity: 0.8;}
.au1 .about_us_box_img  {left:15px;}
.au4 .about_us_box_img  {top:20px;left:17px;}
.abtd {vertical-align: top; width:70%;}