html {
  min-height: 100%;
}
body {
  background: url(big-background-image.png) no-repeat right top;
  background-size: auto 100%;
  min-height: 100%;
}
@media only screen and (min-width: 1300px) {
    body {
    }
}
@media only screen and (min-width: 1100px) {
    .right-container {
        margin-top: 28%;
    }
}
@media only screen and (max-width: 1100px) {
    .right-container {
        margin-top: 20%;
    }
}
@media only screen and (min-width: 1638px) {
    body {
        background-size: 100% 100%;
    }
}
.centered {
    margin-left: auto;
    margin-right: auto;
}
.site-wrapper {
    width: 1400px;
    max-width: 100%;
    border: thin solid blue;
    color: #fff;
}
.green {
    color: rgba(116,218,173,255);
}
.app-store-button-container.narrow {
    display:none;
}
.app-store-button-container {
    margin-top: 7%;
    max-width: 100%;
    width: 350px;
}
.app-store-button {
    width: 100%;
    margin-left: -13%;
}
.left-container {
    width: 47%;
    float: left;
    margin-left: -10%;
    background: url(logo-with-dotted-line.png) no-repeat;
    background-size: 100%;
}
.right-container {
    width: 60%;
    float: left;
}
div.phone-container {
    width: 48%;
    margin-top: 48%;
    position: relative;
}
.app-icon {
    position: absolute;
    bottom: 0;
    right: -30%;
    width: 33%;
}
img.phone-image {
    width: 100%;
    margin-left: 10%;
}

.first-phrase {
    font-size: 55px
}
.second-phrase {
    font-size: 60px;
    text-transform: uppercase;
    margin: 50px 0;
}
.third-phrase {
    font-size: 30px;
    margin: 20px 0;
}


@media only screen and (max-width: 1324px) {
    .first-phrase {
        font-size: 50px
    }
    .second-phrase {
        font-size: 55px;
        margin: 40px 0;
    }
    .third-phrase {
        font-size: 25px;
        margin: 15px 0;
    }
    .app-store-button-container {
        margin-top: 10%;
    }
}

@media only screen and (max-width: 1024px) {
    .first-phrase {
        font-size: 45px
    }
    .second-phrase {
        font-size: 50px;
        margin: 30px 0;
    }
    .third-phrase {
        font-size: 20px;
        margin: 15px 0;
    }
    .app-store-button-container {
        margin-top: 7%;
    }
}
@media only screen and (max-width: 769px) {
    .first-phrase {
        font-size: 40px
    }
    .second-phrase {
        font-size: 40px;
        margin: 20px 0;
    }
    .third-phrase {
        font-size: 20px;
        margin: 5px 0;
    }
    .app-store-button-container {
        margin-top: 4%;
    }
}
@media only screen and (max-width: 640px) {
    .left-container {
        width: 100%;
        margin-left: 0;
        background: url(logo-with-dotted-line.png) no-repeat;
        background-size: 100%;
    }
    .right-container {
        width: 100%;
        margin-top: 0;
        padding: 20px;
    }
    .app-store-button {
        width: 100%;
        margin-left: 0;
    }
    .app-store-button-container.wide {
        display:none;;
    }
    .app-store-button-container.narrow {

        display:block;
    }
    img.phone-image {
        margin-left: 0;
    }
    .app-icon {
        right: -20%;
    }
}
