JSFiddle - React, Tailwind, and code Playground

HTML

<div class="layout">
    <div class="header"></div>
    
    <div class="content">
        <div class="aside">            
            <ul class="nav">
                <li><a href="#">Приветствие</a></li>
                <li><a href="#">Биография</a></li>
                <li><a href="#">Стоимость услуг</a></li>
                <li><a href="#">Ответы на вопросы</a></li>
                <li><a href="#">Этапы работы</a></li>
                <li><a href="#">Контакты</a></li>
                <li><a href="#">Новости</a></li>                   
            </ul>            
        </div>
        
        <div class="article">
            <div class="section m-light">
                <h3>Добро пожаловать</h3>
            
    		    <p>Рада приветствовать Вас на своём персональном сайте адвоката.</p>    
    		    <p>Меня зовут ........... </p>    
    		    <p>Я являюсь членом Адвокатской Палаты г. Москвы, консультирую по вопросам
                российского права, веду гражданские дела по различным категориям споров, в 
                том числе жилищным, семейным, расторжению брака (разводу), наследственным
                делам, сопровождению сделок.</p>
    		    <p> Стаж адвокатской деятельности - с 2001 года. </p>
                <p>Как Ваш адвокат я заинтересована в положительном результате по каждому делу.
                Значительный опыт работы и поддержка коллег помогает мне всесторонне изучить
                конкретную ситуацию и разработать наилучший способ действовать. </p>
                <p>Факт обращения к адвокату и все полученные от доверителя сведения
                составляют адвокатскую тайну, которая охраняется законом и государством. </p>
                
            </div>
            <div class="section">
                
                <p>Каждый случай в практике адвоката уникален, а потому составить представление
                о Вашем деле, оценить, какая юридическая помощь требуется в Вашей ситуации, каковы
                судебные...

CSS

body { margin: 0; }

.layout {
    width: 1100px;
    margin: auto;
}

.header, .footer {
    height: 50px;
    
    background: #5E2325;
}

.content {
    position: relative;
    background: #E6DADA;
}

.content:before {
    content: '';
    
    width: 300px;
    
    position: absolute;
    top: 0;    right: 0;
    bottom: 0;
    
    opacity: 0.3;
    
    background: url('http://friends.kz/uploads/posts/2011-03/1299660369_jej-portret-54.jpg');
    background-size: cover;
}

.content:after {
    content: '';
    
    display: block;
    clear: both;
}

.aside {
    width: 200px;    
    float: left;
}

.article {    
    margin-left: 200px;
}

.section {
    padding: 1px 315px 1px 15px;
}

.section.m-light {    
    background: #fff;
}