/*-------------------------------------------------------------------------
= Boutique top banner layout
--------------------------------------------------------------------------*/
.page-banner {
    margin: 0 0 30px 15px;
}

.headline-plus p {
    background: #e1f2f8;
    padding: 15px 20px;
}


@media screen and (max-width: 600px) {
    .ecards-page-banner .top-banner {
        height: 290px;
    }

    .ecards-page-banner .top-banner img {
        margin-top: -10px;
    }

    .ecards-page-banner .top-banner h1 {
        font-size: 2rem;
        left: 380px;
        top: 28px;
    }

    .ecards-page-banner .top-banner p {
        font-size: .9rem;
        left: 315px;
        top: 58px;
    }

    .ecards-page-banner .top-banner #become-a-member {
        font-size: 1.05rem !important;
        left: 330px;
        top: 165px;
    }
}

@media screen and (max-width: 525px) {
    .ecards-page-banner .top-banner {
        height: 210px;
    }

    .ecards-page-banner .top-banner img {
        margin-top: -10px;
    }

    .ecards-page-banner .top-banner h1 {
        font-size: 2rem;
        left: 320px;
        top: 28px;
    }

    .ecards-page-banner .top-banner p {
        left: 275px;
        top: 58px;
        width: 39%;
    }

    .ecards-page-banner .top-banner #become-a-member {
        font-size: 1.05rem !important;
        left: 280px;
        top: 165px;
    }
}

@media screen and (max-width: 320px) {
    .ecards-page-banner .top-banner {
        height: 150px;
    }

    .ecards-page-banner .top-banner img {
        margin-top: -18px;
    }

    .ecards-page-banner .top-banner h1 {
        font-size: 1.6rem;
        left: 180px;
        top: 15px;
    }

    .ecards-page-banner .top-banner p {
        display: none;
        z-index: 1;
    }

    .ecards-page-banner .top-banner #become-a-member {
        font-size: 1.05rem !important;
        left: 90px;
        top: 60px;
    }
}