body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans',sans-serif;
    background-color: #cecece;
}

h1 { text-align:center; margin-top:50px;}
article {
    margin: 0px auto;
    width: 1000px;
    background-color: #fff;
    padding: 10px;
}

.test {
    position: relative;
    border: 3px solid grey;
    margin-bottom: 50px;
}
.i-sticky {
    position: relative;
    position: -webkit-sticky;
    position: sticky;
    padding: 20px 0;
    font-size: 20px;
    text-align: center;
    background-color: greenyellow;
    z-index: 5;
}
.sticky-wide {
    min-width:1000px;
    margin: 0px auto;
    background: #fff;
    padding: 20px;
}

.layout {display: table; margin-top: 100px; background-color: aliceblue;}
.layout .cell {display: table-cell;width: 20%; padding: 1%; position: relative;}
.layout .cell:first-child {background-color: antiquewhite;}
.layout .cell.center {display: table-cell; width: 60%;}



.block0 {
    top: 0;
    min-width: 100%;
}
.block1 {
    bottom: 0px;
    min-width: 100%;
}
.block2 {
    top: 70px;
    min-width: 100%;
}
.block3 {
    bottom: 70px;
    min-width: 100%;
}
.block4 {
    top: 20px;
}
.block5 {
    top: 0px;
}
.block6 {
    bottom: 0px;
}
.block7 {
    bottom: 0;
    top: 0;
}