#published-app {
    @desktop-breakpoint: 400px;
    @media (min-width: @desktop-breakpoint) {
        // Cool background image!
        background: #D2D7E0 url(/images/desktop-wrapper/background.jpg);
        @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
            background-image: url(/images/desktop-wrapper/background-retina.jpg);
            background-size: 1200px;
        }

        // Center the whole preview
        text-align: center;
        display: flex;
        justify-content: center;
        overflow: auto;
        padding-top: 20px;
    }
    @media (min-height: 750px) {
        padding-top: 0;
        align-items: center;
    }

    // Some adjustments to our inner components
    #app {
        text-align: left;
        background: #F6F7F7;
        overflow: hidden;
    }
    .main {
        position: relative;
        overflow: auto;
        padding: 0;
        margin: 0;
        height: 100%;
        @media (min-width: @desktop-breakpoint) {
            height: 500px;
        }
    }
    .blocks {
        padding: 60px 10px 40px;;
        @media (min-width: @desktop-breakpoint) {
            padding-bottom: 10px;
        }
    }

    .desktop-wrapper,
    .phone-shell {
        height: 100%;
    }

    .desktop-wrapper {
        @media (min-width: @desktop-breakpoint) {
            height: auto;
        }
    }

    // The nice phone shell
    .phone-shell {
        > img {
            display: none;
        }
        @media (min-width: @desktop-breakpoint) {
            height: auto;
            width: 355px;
            margin: 0 auto 30px auto;
            img {
                display: block;
                width: 100%;
            }
            #app {
                border: 16px solid #4A4A4A;
                border-top: none;
                border-bottom: none;
            }
        }
    }

    // Hide the publish footer, since we have
    // an external download button
    .download-button {
        display: none;
    }
    @media (min-width: @desktop-breakpoint) {
        #publish-footer {
            display: none;
        }
        .download-button {
            display: inline-block;
            font-size: 16px;
            padding-left: 30px;
            padding-right: 30px;
            margin-bottom: 20px;
        }
    }

}
