JSFiddle - React, Tailwind, and code Playground

HTML

<main class="container">
		<div class="main-logo">
			<img src="assets/img/logo.png" alt="logo" width="368" height="204">	
		</div>
		<div class="advantage clearfix">
			<div class="advantage-element">
				<b>быстро</b>
				<p>мы делаем свою работу быстро! два часа пролетят незаметно и вы — счастливый обладатель стильной стрижки-минутки!</p>
			</div>
			<div class="advantage-element">
				<b>круто</b>	
				<p>забудьте, как вы стриглись раньше. мы сделаем из вас звезду футбола или кино!</p>
			</div>
			<div class="advantage-element">
				<b>дорого</b>	
				<p>наши мастера — профессионалы своего дела и не могут стоить дешево. к тому же, разве цена не дает определенный статус?</p>
			</div>
		</div>
		<div class="index-content clearfix">
			<section class="news index-content-left">
				<h2>новости</h2>
				<ul>
					<li>
						<p>нам наконец завезли ягермайстер! теперь вы можете пропустить стаканчик во время стрижки</p>
						<time datetime="2016-09-25">25 сентября</time>
					</li>
					<li>
						<p>в нашей команде пополнение, борис «бритва» стригунец, обладатель множества титулов и наград пополнил наши стройные ряды</p>
						<time datetime="2016-09-19">19 сентября</time>		
					</li>
				</ul>
					<a class="btn" href="#">все новости</a>
			</section>
			<section class="gallery index-content-right">
				<h2>фотогалерея</h2>
				<figure class="gallery-content">
					<img src="assets/img/gallery_img1.jpg" width="286" height="164" alt="наш интерьер">
				</figure>
				<button class="btn gallery-prev">назад</button>
				<button class="btn gallery-next">вперёд</button>	
			</section>	
		</div>
		<div class="index-content clearfix">
			<section class="contact index-content-left">
				<h2>контактная информация</h2>
				<address>
					барбершоп «бородинский»<br>
					адресс: г. санкт-петербург, б. конюшенная, д 19/8<br>
					телефон: +7 (495) 666-02-66
				</address>
				<p>время работы</p>
				<p>пн - пт: c 
					<time datetime="10:00">10:00</time> до
					<time...

CSS

/* для тестирования */
body {
	background: gray;
	color: white;
}
/*Главные блоки*/
.container { 
	border: 3px solid red;
}
/*второстепенные блоки*/
.main-logo,
.advantage,
.index-content {
	border: 2px solid blue;
} 
/*вложенные во второстепенные блоки*/
.advantage-element,
.index-content-left,
.index-content-right { 
	border: 1px solid yellow;
}

/*-------------------*/
.clearfix {
	content: "";
	display: table;
	clear: both;
}

/*Сетка*/
.container {
	width: 940px;
	padding-left: 10px;
	padding-right: 10px;
	margin: 0 auto;
}

.main-logo {
	width: 368px;
	height: 204px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 25px;
}

.advantage {
	margin-bottom: 80px;
}
.advantage-element {
	margin-right: 20px;
	width: 300px;
	float: left;
	text-align: center;
}

.advantage-element:last-child {
	margin-right: 0;
}

.index-content {
	padding: 50px 20px;
	margin-bottom: 35px;
}

.index-content-left {
	width: 380px;
	float: left;
}

.index-content-right {
	width: 300px;
	float: right;
}