/* Original main.css styling, minus unnecessary elements */
.mrm-container {
    position: relative;
    padding: 0;
    margin: 0 auto;
    overflow: hidden
}
.mrm-container h3,
.mrm-container h4 {
    color: #000
}
.mrm-container p {
    font-weight: 300;
    font-size: 1.6rem;
    line-height: 1.5;
    color: #6b6a6a
}
.mrm-container a {
    color: #009dd9
}
.mrm-container a:focus,
.mrm-container a:hover {
    text-decoration: none
}
.mrm-container hr {
    width: 80%;
    border-top: 1px solid #b5b5b5;
    margin-left: auto;
    margin-right: auto
}
.mrm-container #footnote {
    font-size: 1.2rem
}
.mrm-container .hero-content h1,
.mrm-container .hero-content p,
.mrm-container .learn-more-heading,
.mrm-container .learn-more-link,
.mrm-container .name,
.mrm-container .nielsen-next-hero h1,
.mrm-container .nielsen-next-name,
.mrm-container .play-video-btn,
.mrm-container .read-more,
.mrm-container .right-caret,
.mrm-container .section-heading h3,
.mrm-container .share-text,
.mrm-container .solutions h4,
.mrm-container .thought-leadership-content h4,
.mrm-container .tweet-quote,
.mrm-container .tweet-text,
.mrm-container .whats-next-container h3 {
    font-family: Knockout\ 28 A, Knockout\ 28 B, Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    text-transform: uppercase
}
.mrm-container .no-wrap {
    white-space: nowrap
}
.mrm-container .section-heading h3 {
    font-size: 3.8rem;
    margin: 1rem 0
}
@media (min-width: 768px) {
    .mrm-container .section-heading h3 {
        font-size: 4.8rem
    }
}
.mrm-container .section-heading p {
    margin-bottom: 1.5rem
}
.mrm-container .read-more,
.mrm-container .right-caret {
    display: inline-block;
    font-size: 3.2rem;
    color: #009dd9
}
@media (max-width: 767px) {
    .mrm-container .read-more,
    .mrm-container .right-caret {
        font-size: 2.2rem
    }
}
.mrm-container .read-more {
    margin-bottom: 3rem
}
@media (max-width: 767px) {
    .mrm-container .read-more {
        margin-bottom: 0
    }
}
@media (min-width: 768px) {
    .mrm-container .hero-bg-wrapper {
        position: relative;
        top: 0;
        background-image: url(../images/hero-bg.jpg);
        background-size: cover;
        width: 100%;
        height: 0;
        padding-bottom: 37.5%;
        z-index: -1
    }
}
.mrm-container .hero-container {
    position: relative
}
@media (max-width: 767px) {
    .mrm-container .hero-container {
        background-image: url(../images/hero-bg-mobile.jpg);
        background-size: cover;
        background-position: 50%;
        height: 0;
        padding-bottom: 74%
    }
}
@media (max-width: 440px) {
    .mrm-container .hero-container {
        padding-bottom: 94%;
        background-position: center -4rem
    }
}
.mrm-container .hero-content {
    position: absolute;
    bottom: 8rem;
    left: 4rem
}
@media (max-width: 767px) {
    .mrm-container .hero-content {
        bottom: 0;
        left: 2rem
    }
}
.mrm-container .hero-content h1,
.mrm-container .hero-content p {
    color: #fff;
    text-transform: uppercase
}
.mrm-container .hero-content h1 {
    font-size: 5rem;
    line-height: .6;
    margin-top: 0;
    margin-bottom: 1.5rem
}
.mrm-container .hero-content h1 .trademark {
    position: relative;
    top: -.1rem;
    left: 1rem;
    vertical-align: top;
    font-size: 3rem
}
@media (min-width: 290px) {
    .mrm-container .hero-content h1 {
        font-size: 6rem
    }
}
@media (min-width: 370px) {
    .mrm-container .hero-content h1 {
        font-size: 8rem
    }
}
@media (min-width: 992px) {
    .mrm-container .hero-content h1 {
        font-size: 15rem
    }
    .mrm-container .hero-content h1 .trademark {
        font-size: 5rem
    }
}
.mrm-container .hero-content p {
    font-size: 2.5rem
}
@media (min-width: 992px) {
    .mrm-container .hero-content p {
        font-size: 4.7rem;
        margin-bottom: 0
    }
}
.mrm-container .video-bg {
    position: absolute;
    width: 100%
}
.mrm-container .play-video-container {
    display: block;
    cursor: pointer
}
@media (min-width: 768px) {
    .mrm-container .play-video-container {
        display: inline-block
    }
}
.mrm-container .play-video-btn-wrapper {
    position: relative
}
@media (max-width: 767px) {
    .mrm-container .play-video-btn-wrapper {
        left: -21px;
        bottom: -10px;
        display: block;
        background-color: #009dd9;
        width: 788px;
        padding: 2rem
    }
}
.mrm-container .play-video-btn {
    font-size: 3rem;
    color: #fff;
    font-weight: 300;
    text-transform: uppercase;
    /*padding-left: 10px;*/
    cursor: pointer
}
.mrm-container .play-video-btn:focus,
.mrm-container .play-video-btn:hover {
    color: #fff
}
.mrm-container .play-video-btn:after {
    content: url(../images/video-play-icon.png);
    position: relative;
    top: 5px;
    left: 10px
}
.mrm-container .play-video-mobile {
    background-color: #009dd9;
    padding: 2rem 4rem
}

.mrm-container .bio-link {
    padding-left: 7%;
    background-color: #009dd9
}
@media (min-width: 767px) {
    .mrm-container .bio-link {
        position: absolute;
        bottom: 3.2rem;
        left: 0;
        width: 93%
    }
}

.mrm-container .social-share,
.mrm-container .social-share-fixed {
    text-align: center
}
.mrm-container .social-share-fixed {
    top: 0;
    margin-top: 1rem;
    width: 5rem;
    z-index: 1
}
.mrm-container .social-share-fixed a {
    display: block;
    padding: .5rem 0
}
.mrm-container .social-share {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 1
}
@media (min-width: 767px) {
    .mrm-container .social-share {
        bottom: -4rem
    }
}
.mrm-container .social-share a {
    display: inline-block;
    width: 5.2rem
}
.mrm-container .social-share-icons {
    background-color: #f6f7f7;
    padding: .5rem 0
}
@media (min-width: 768px) {
    .mrm-container .copy-container {
        position: relative;
        top: -5rem
    }
}
.mrm-container .white-bg {
    background-color: #fff
}
.mrm-container .blue-hr {
    width: 100%;
    border-top: 1px solid #009dd9;
    margin-top: 0;
    margin-bottom: 1rem
}

.mrm-container .inline-image {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem
}
@media (min-width: 768px) {
    .mrm-container .inline-image {
        float: right;
        margin-left: 2rem
    }
}




/**/
/**/
/**/
/**/
/**/
/* Custom styling for international homepages */
 /* maintains distance btw video and lower components */
.hero-unit .container{
    height: 150px;
}

/* ensures video area is visible in mobile */
@media (max-width: 767px) {
    .mrm-container .hero-container {
        background-image: url(../images/hero-bg-mobile.jpg);
        background-size: cover;
        background-position: 50%;
        height: 0;
        padding-bottom: 74%;
        margin-bottom: 87px;
    }
}

/* ensures play video btn in mobile is touching left-hand side of window */
@media (max-width: 767px) {
    .mrm-container .play-video-btn-wrapper {
        left: -33px;
        bottom: -10px;
        display: block;
        background-color: #009dd9;
        width: 788px;
        padding: 14px 12px 14px 2rem;
    }
}

/* Fonts Sizing h1 */
.mrm-container .hero-content h1{
    padding: 2px 0; 
}
@media (min-width: 290px) {
    .mrm-container .hero-content h1 {
        font-size: 4rem;
        line-height: 87%;
        margin-bottom: 0;

    }
}
@media (min-width: 376px) {
    .mrm-container .hero-content h1 {
        font-size: 80px;
        margin: 8px 0 20px 0; 
        padding: 0;
    }
}
@media (min-width: 1025px) {
    .mrm-container .hero-content h1 {
        font-size: 135px;
    }
    .mrm-container .hero-content h1 .trademark {
        font-size: 55px;
    }
}

/* Fonts Sizing p */
.mrm-container .hero-content p {
    font-size: 30px;

}
@media (min-width: 992px) {
    .mrm-container .hero-content p {
        font-size: 39px;
        margin-bottom: 0
    }
}

.mrm-container .play-video-btn {
    font-size: 39px;
    color: #fff;
    font-weight: 300;
    text-transform: uppercase;
    /*padding-left: 10px;*/
    cursor: pointer
}


/* Text area; ensures it's visible in desktop */
.mrm-container .hero-content {
    position: absolute;
    bottom: 200px;
    left: 4rem
}
/* ensure text is visible in tablet widths */
@media (min-width: 768px) and (max-width: 1024px) {
    .mrm-container .hero-content {
        bottom: 200px;
    }
}
@media (max-width: 767px) {
    .mrm-container .hero-content {
        bottom: 0px;
        left: 1rem;
        width: 90%;
    }
}

/* align play button */
.mrm-container .play-video-btn:after {
    content: url(../images/video-play-icon.png);
    position: relative;
    top: 2px;
    left: 10px;
}

/* remove padding-left on "Play Video" in mobile mode */
@media (min-width: 768px) {
    .mrm-container .play-video-btn {
        padding-left: 10px;
    }
}