.owl-carousel-main .owl-stage-outer {overflow: hidden}<div class="section">
<div class="container">
<div class="section-description">
<h1>Description</h1>
<img src="http://cdn.iphonehacks.com/wp-content/uploads/2013/09/iphone_5c_ios_7.png" alt="image" />
</div>
</div>
</div>body{
padding: 0;
margin: 0;
}
.section {
position: relative;
background-color: lightblue;
overflow: hidden;
min-height: 100vh;
}
.section::after{
content: "";
position: absolute;
top: 0;
right: -80%;
width: 100%;
height: 100%;
background-color: white;
transform: skew(45deg);
}
.section .container{
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 1;
}
.wrapper{
width: 100%;
min-height: 100vh;
position: relative;
}
.wrapper::before{
content: '';
display: block;
background: #3591d0;
position: absolute;
height: 100%;
width: 50%;
top: 0;
left: 0;
bottom: 0;
}
.wrapper::after{
content: '';
display: block;
background: #fff;
position: absolute;
height: 100%;
width: 50%;
top: 0;
right: 0;
bottom: 0;
}<section class="wrapper">
<div class="container">
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-6">
Левая часть
</div>
<div class="col-md-6 col-sm-6 col-xs-6">
Правая часть
</div>
</div>
</div>
</section><div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
текст который сверху
</div>
</div>
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-6">
текст который снизу слева
</div>
<div class="col-md-6 col-sm-6 col-xs-6">
картинка справа снизу
</div>
</div>
</div><div class="container">
<div class="row">
<div class="col-md-6">
картинка или текст
</div>
<div class="col-md-6">
картинка или текст
</div>
</div>
</div><div class="container">
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-12">
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-12">Блок 1</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 2</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 3</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 4</div>
</div>
</div>
<div class="col-md-6 col-sm-6 col-xs-12">
Содержимое красного блока
</div>
</div>
<div class="row">
<div class="col-md-6 col-sm-6 col-xs-12">Блок 5</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 6</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 7</div>
<div class="col-md-6 col-sm-6 col-xs-12">Блок 8</div>
</div>
</div>