Как разместить элементы?
Нагородили вы конечно...
https://codepen.io/aliencash/pen/GmyreY?editors=1100
Для мелких экранов сделайте медиа выражения влияющие на размер шрифта.
Так? <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;
            }