body > section {
    padding-left: 20px;
    padding-right: 20px;
}
    .content-container {
        display: grid;
        grid-template-columns: 1fr 395px;
        grid-column-gap: 10px;
        margin-top: 15px;
        margin-bottom: 7px;
        max-width: 800px;
        padding: 20px 20px 25px 35px;
        position: relative;
    }
    
        .left-content-block {
            color: #444444;
            vertical-align: top;
        }
            .left-content-block h2 {
                margin-top: 15px;
            }
            .left-content-block a {
                color: #5555ff;
                text-decoration: none;
            }
            .left-content-block a:hover {
                text-decoration: underline;
            }
    
        .leader-board {
            border: 2px #ffffff solid;
            border-collapse: collapse;
            border-spacing: 0;
            font-size: 16px;
            font-weight: 300;
            
            max-width: 400px;
        }
            .leader-board * tr {
                box-shadow: 2px 2px 12px rgba(0,0,0,.15);
            }
            .leader-board * tr:first-child {
                box-shadow: none;
            }
                .leader-board * tr:nth-child(even) td {
                    background-color: #e3e3e3;
                    padding: 5px;
                }
                .leader-board * tr:nth-child(odd) td {
                    background-color: #ffffff;
                    padding: 5px;
                }
                .leader-board * tr td.title {
                    background-color: white;
                    border-bottom: 2px #77aaee solid;
                    box-shadow: none;
                    color: #555555;
                    text-align: center;
                }
                .leader-board * .left-column {
                    text-align: right;
                    width: 160px;
                }
                .leader-board * .middle-column {
                    text-align: center;
                    width: 130px;
                }
                .leader-board * .right-column {
                    text-align: left;
                    width: 105px;
                }
                    .leader-board * h3 {
                        font-family: 'Oxygen', Helvetica, san-serif;
                        font-size: 18px;
                        font-weight: normal;
                        margin: 0;
                        padding: 0;
                    }
                    .leader-board * a {
                        text-decoration: none;
                    }
                        .leader-board * a:hover {
                            color: blue;
                            text-decoration: underline;
                        }

@media all and (max-width: 650px) {
    .content-container {
        display: block;
        margin-top: 5px;
        margin-bottom: 0;
        padding: 30px;
    }
        .left-content-block {
            display: block;
            padding: 5px;
        }
            .left-content-block h2 {
                margin-top: 0;
            }
        .leader-board {
            border: none !important;
            box-shadow: none;
            margin: 0 auto;
            max-width: 500px;
            width: 100%;
        }
}

@media all and (max-width: 400px) {
    body > section {
        padding-left: 10px;
        padding-right: 10px;
    }
    .content-container {
        padding: 10px;
    }
        .left-content-block {
            padding: 10px;
        }
        .leader-board {
            box-shadow: none;
            padding: 0px;
        }
            .leader-board tr {
                box-shadow: none;
            }
}