/* Hidden Videos Ambassadors */
    @media screen and (min-width: 1400px) {
        .visHidden {
            visibility: hidden;}
        }
        
        @media screen and (max-width: 1399px) {
        .visHidden {
            display: none;}
        }
        
        
        #BodyContent:focus {
            outline: none;/* defeats full-page focus outline in Chrome */
        }
        
        h3.c-heading-4 strong,
        h2.c-heading-1 strong {
            font-weight: 700 !important;
        }
        .m-area-heading p {
            padding-top: 18px;
        }
        .mobile-third p,
        [data-grid~="col-12"].m-area-heading p {
            max-width: 650px;
            margin-left: auto;
            margin-right: auto;
            /*padding-left: 10%;
            padding-right: 10%;*/
        }
        
        .for-screenreader {
            height: 1px;
            width: 1px;
            overflow: hidden;
            text-indent: -4000px;
        }
        button.c-call-to-action,
        a.c-call-to-action {
            text-transform: uppercase;
        }
        a.c-call-to-action.green-brdr {
            border: 2px solid #5dc21e;
            color: #fff !important;
            background: none !important;
        }
        
        a.c-call-to-action.f-lightweight:hover span, button.c-call-to-action.f-lightweight:hover span {
            text-decoration: none;
        }
        /*
        a.c-call-to-action.f-lightweight, 
        button.c-call-to-action.f-lightweight,
        a.c-call-to-action.f-lightweight:hover, 
        button.c-call-to-action.f-lightweight:hover {
            color: #107c10;
        }
        */
        .go-play a.c-call-to-action, 
        .go-play button.c-call-to-action,
        .go-play a.c-call-to-action:hover, 
        .go-play button.c-call-to-action:hover,
        .gear a.c-call-to-action.f-lightweight, 
        .gear button.c-call-to-action.f-lightweight,
        .gear a.c-call-to-action.f-lightweight:hover, 
        .gear button.c-call-to-action.f-lightweight:hover {
            color: #107c10 !important;
        }
        @media screen and (max-width: 1083px) {
            .gamer-spotlight a.c-call-to-action.f-lightweight, 
            .gamer-spotlight button.c-call-to-action.f-lightweight,
            .gamer-spotlight a.c-call-to-action.f-lightweight:hover, 
            .gamer-spotlight button.c-call-to-action.f-lightweight:hover {
                color: #5dc21e;
            }
        }
        
        .events__box a.c-call-to-action.f-lightweight, 
        .events__box button.c-call-to-action.f-lightweight,
        .events__box a.c-call-to-action.f-lightweight:hover, 
        .events__box button.c-call-to-action.f-lightweight:hover {
            color: inherit;
        }
        
        
        .inline-link {
            padding: 18px 0 30px 0;
        }
        .inline-link a {
            display:inline !important;
        }
        
        .theme-black a.c-call-to-action.f-lightweight, 
        .theme-black button.c-call-to-action.f-lightweight {
            color: #5dc21e;
        }
        
        
        .stealth-carousel button.play__button:hover,
        .stealth-carousel button.play__button:active,
        .scroll__section button.play__button:hover,
        .scroll__section button.play__button:active,
        .triptych__content button.play__button:hover,
        .triptych__content button.play__button:active,
        .gamer-spotlight button.play__button:hover,
        .gamer-spotlight button.play__button:active,
        .triptych__panel:focus .play__button,
        .triptych__panel:focus {
            border: 2px dashed #fff !important;
            outline: 2px dashed #000 !important;
        }
        
        .icons a:focus,
        .stay-connected .zoomImg:focus,
        .mixer__games-list a:focus,
        .triptych__box .buttonswap__button:focus {
            outline: 2px dashed #000 !important;
        }
        
        
        .community__social-links a:focus {
            outline: 2px dashed #fff !important;
        }
        /*
        .community__social-links {
            outline: 2px dashed #fff !important;
        }
        */
        
        @media screen and (min-width: 1084px) {
            .gamer-spotlight .community__social-links a:focus {
                outline: 2px dashed #000 !important;
            }
        }    
        
        .videoverlay {
            text-align: center;
            color: #fff;
            position: relative;
            overflow: hidden;
            margin-top: 83px;
            margin-bottom: 60px;
        }
        
        @media screen and (min-width: 1084px) {
            .videoverlay {
                margin-top: 130px;
                margin-bottom: 130px;
            }
        }
        
        .videoverlay .m-ambient-video {
            padding:0;
            overflow:hidden;
            max-width: 1600px;
            margin-left:auto;
            margin-right: auto;
            color:#000;
        }
        /*
        .videoverlay h1 {
            position:absolute;
            top:50%;
            left:50%;
            transform: translate(-50%, -50%);
        }
        .videoverlay h1 span {
            display:block;
            filter: invert(100%);
        }*/
        .videoverlay .video__box {
            position:relative;
            max-width: 1600px;
            overflow:hidden;
            margin:0 auto;
            padding: 0 0 20.5% 0; /* bottom percentage sets the aspect ratio.  */
            height: 0;
            background-color: #fff;
            /*-webkit-box-shadow: inset 0px -5px 0px 0px rgba(255,255,255,1);
            -moz-box-shadow: inset 0px -5px 0px 0px rgba(255,255,255,1);
            box-shadow: inset 0px -5px 0px 0px rgba(255,255,255,1);*/
        }
        
        .videoverlay .m-ambient-video video {
            position:absolute;
            left: 50%;
            transform: translateX(-50%);
            width: auto;
        }
        
        .videoverlay .video__image {
            width: 100%;
            /*height: 100%;*/
            position: absolute;
            top: 0;
            left: 0;
            z-index: 20;
            transform: scale3d(1, 1, 1);
        }
        
        .videoverlay .video__content {
            background-color: #fff;   /* to hide a rendering glitch in Edge */
            margin-top: -2px;           /* to hide a rendering glitch in Edge */
            z-index: 3200;
            padding:30px 0 0 0;
        }
        .videoverlay .video__content .c-subheading-1 {
            width: 75%;
            max-width: 1100px;
            margin:0 auto;
        }
        /*
        ==================================
        HERO VIDEO BUTTONS
        ==================================
        */
        
        .videoverlay .video__content .buttonswap__container {
            width: 200px;
            margin: 24px auto 0 auto;
            /*margin-top:20px;*/
        }
        .videoverlay .video__content .buttonswap__button {
            display:block;
            width: 200px;
        }
        .videoverlay .video__content .buttonswap__button.play {
            display:none;
        }
        .videoverlay .video__content .buttonswap__button span, 
        .videoverlay .video__content .buttonswap__button.c-glyph::before { 
        /* This fixes alignment issues between glyph and text in local environment. Test in production. */
            vertical-align:middle;
        }
        .videoverlay a.c-action-trigger.c-glyph:before { /* remove left margin from play/pause gif */
            margin-left: 0;
        }
        /*
        ==================================
        END HERO VIDEO BUTTONS
        ==================================
        */
        
        
        @media screen and (max-width:1083px){
            .m-ambient-video {
                padding-bottom: 88px;
            }
            .video__content .c-subheading-1 {
                font-size: 24px;
                line-height: 1.25;
            }
        }
        @media screen and (max-width:767px){
            .m-ambient-video {
                padding-top: 48px;
            }
            .video__content .c-subheading-1 {
                font-size: 18px;
            }
            .video__content .buttonswap__container {
                margin-top:12px;
            }
        
            .video__content .buttonswap__button {
                display:block;
                width: 150px;
                margin-top:8px;
            }
        
            a.c-action-trigger { 
                font-size: 13px;
            }
        }
        
        
        /*
        ==================================
        SCROLLING HEADER
        ==================================
        */
        
        .scroll__section {
            /*display:table;*/
            /*width:100%;*/
        }
        
        .scroll__box {
            position:relative;
            padding-top: 10%;
        }
        
        .scroll__section .scroll__header span {
            display:block; /* forcing word wrap where we want it and undoing it responsively */
            white-space: nowrap;
        }
        
        .scroll__section .scroll__header {
            padding:0 0 0 0;
            display:block;
            text-align: left;
            position:relative;
            left:0;
            padding-bottom:25px;
            transform: scale3d(1, 1, 1);
            z-index: 0;
            bottom: auto;
            top:5%;
        }
        
        @media screen and (min-width:0\0) and (min-resolution: +72dpi) {
            .scroll__section  .scroll__header {top: 60px;}
        }
        /* 
        .scroll__section .scroll__header.clone {
            visibility:hidden;
        }
        .scroll__section .scroll__header.stop {
            top: auto;
            bottom: 0px; 
            visibility: visible;
        
        }
        
        .scroll__section .scroll__header.sticky {
            position: fixed;
            top:60px; 
            left:0;
            visibility:visible;
        }*/
        
        /*
        ==================================
        MOSAIC BOX structure
        ==================================
        */
        .mosaic__content a:focus {
            border-color: #fff !important;
            outline: 2px solid #000 !important;
            outline-offset: 0px;
            }


        .scroll__section .mosaic__box {
            position:relative;
            /*width: 100%;
            max-width: 1068px;
            -webkit-filter: drop-shadow(0px 0px 30px rgba(0,0,0,.1));
            filter: drop-shadow(0px 0px 30px rgba(0,0,0,.1));*/
        }
        .scroll__section .mosaic__box::before {/* filter: drop-shadow not fully supported. This is a workaround */
            content: "";
            display:block;
            position:absolute;
            height: 100%;
            width: 100%;
            /*top:50%;
            left:50%;
            transform: translate(-50%, -50%);*/
            z-index: 0;
            background-color:rgba(0,0,0,.162); /* Done this way because of a small gap than can exist inside an element.*/
            -webkit-filter:blur(37px);
            filter:blur(37px);
        }
        
        /* Hide the drop shadow workaround in IE 9-up */
        @media screen and (min-width:0\0) and (min-resolution: +72dpi) {
            .scroll__section .mosaic__box::before {display:none;}
        }
        
        .scroll__section .mosaic__element {
            position: relative;
            overflow:hidden;
            width: 49.4%; /* will get a margin of .6%. The width value is needed when calculating aspect ratio later */
        }
        
        
        .scroll__section .mosaic__element .c-image {
            /*position:absolute;*/
            width: 100%;
            top: 0;
            left:0;
        }
        
        /* .mosaic__element float, width, margin, and aspect ratio are set based upon their order in the code. */
        /* Fewer class names or IDs to worry about */
        .scroll__section .mosaic__element:nth-child(5n+1) {
            width: 100%;
            float: left; /* floated for margin-collapse consistency despite being full-width */
            margin: .6% 0;
            /*padding-bottom: 50%;  aspect ratio calculation * % width of element */
        }
        .scroll__section .mosaic__element:nth-child(5n+2) {
            float:left;
            margin: .6% .6% .6% 0;
            /*padding-bottom:49.96%;  aspect ratio calculation * % width of element */
        }
        .scroll__section .mosaic__element:nth-child(5n+3) {
            float:right;
            margin: .6% 0 .6% .6%;
            /*padding-bottom: 29.94%;  aspect ratio calculation * % width of element */
        } 
        .scroll__section .mosaic__element:nth-child(5n+4) {
            float:right;
            margin: .6% 0 .6% .6%;
            /*padding-bottom:49.96%;  aspect ratio calculation * % width of element */
        }
        .scroll__section .mosaic__element:nth-child(5n+5) {
            float:left;
            margin: .6% .6% .6% 0;
            /*padding-bottom: 29.94%;  aspect ratio calculation * % width of element */
        }
        
        .scroll__section .mosaic__element:first-of-type {
            margin-top: 0px; 
        }
        
        .scroll__section .mosaic__image {
            position:relative;
            width:100%;
            top:0;
            left:0;
        }
        .scroll__section .mosaic__image::before { 
            position:absolute;
            display: block;
            content: "";
            height: 100%;
            width: 100%;
        
        
        /*background: linear-gradient(to bottom, transparent 0%,transparent 63%,rgba(0,0,0,.5) 80%,#000000 100%);  W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='transparent', endColorstr='#000000',GradientType=0 );  IE6-9 */
        
        }
        
        .scroll__section .mosaic__image img {
            width: 100%;
        }
        
        @media screen and (min-width:1084px){
        
            .scroll__section .scroll__header {
                font-size: 408%;/* changed from vw units because zooming page leaves font the same size */
                line-height: 1.15;
                position:sticky;
            }
        
        }
        @media screen and (max-width:1399px){
            .scroll__section {
                display:block;
            }
        
            .scroll__box {
                padding-top: 0;
            }
            
            .scroll__section .mosaic__box {
                margin-top:initial;
        
            }
            .scroll__section .scroll__header {
                position: relative;
                top: auto;
                left: auto;
                transform: none;
                padding:0 50px 29px 50px;
                /*font-size: 2.8em;*/
                margin: initial;
                text-align: center;
            }
            .scroll__section .scroll__header span {
                display: inline;
            }
        
        }
        
        @media screen and (max-width:1083px){
            .ambassador__details,
            .gamer-spotlight .gamer-spotlight__image,
            .gamer-spotlight .gamer-spotlight__details,
            .scroll__section .mosaic__box {
                max-width: 85.2%;
                margin-left: auto;
                margin-right: auto;
            }
        
            .scroll__section .scroll__header.clone {
                display:none;
            }
        
            .scroll__section .scroll__header span {
                display: inline;
            }
        
            .scroll__section .mosaic__limit {
                position:relative;
                max-width: 902px;
                margin: 0 auto;
            }
            .scroll__section .mosaic__element {
                position: relative;
                overflow:hidden;
            }
            
            /*.scroll__section .mosaic__element:nth-child(5n+1),
            .scroll__section .mosaic__element:nth-child(5n+2),
            .scroll__section .mosaic__element:nth-child(5n+3),*/
            .scroll__section .mosaic__box .mosaic__element {
                float:none;
                display:block;
                width: 100%;
                margin-top: 0px;
                margin-left: auto;
                margin-right: auto;
                margin-bottom: 12px;
            } 
            .scroll__section .mosaic__box .mosaic__element:last-child {
                margin-bottom: 0;
            } 
        
            /*
            .scroll__section .mosaic__element:nth-child(5n+4),
            .scroll__section .mosaic__element:nth-child(5n+5) {
            display:none;
            } */
        
        
        }
        @media screen and (max-width:767px){
        /*
            .scroll__section .mosaic__element:nth-child(5n+1),
            .scroll__section .mosaic__element:nth-child(5n+2),
            .scroll__section .mosaic__element:nth-child(5n+3) {
                padding-bottom:83.44%;  aspect ratio calculation 
            }
        */
            .scroll__section .mosaic__limit {
                max-width: 640px;
            }
        
        }
        /*
        ==================================
        END MOSAIC BOX structure
        ==================================
        */
        
        /* 
        ================================
        Mosaic content formatting.
        ================================
        */
        .scroll__section .mosaic__content {
            position:absolute;
            left: 32px;
            bottom: 20px;
            max-width: 80%;
        }
        
        @media screen and (max-width:640px){
            .scroll__section .mosaic__content {
                left: 32px;
                bottom: 22px;
                max-width: 85%;
            }
        }
        @media screen and (max-width:540px){
            .scroll__section .mosaic__content {
                position: relative;
                max-width: 100%;
                width: 100%;
                left: auto;
                bottom: auto;
                padding: 18px 16px 10px 16px;
                margin: 0;
                color: white;
            }
            .scroll__section .mosaic__element {
                background-color: #333;
            }
            .scroll__section .mosaic__element:not(:last-child){
                margin-bottom: 12px;
            } 
        
            
        }
        @media screen and (min-width:1083px) and (max-width:1400px){
            .scroll__section .mosaic__content {
                /*left: 28px;
                bottom: 20px;*/
                max-width: calc(100% - 64px);
            }
        }
        
        .scroll__section .mosaic__content .c-paragraph-1{
            padding-top: 11px;
        }
        .scroll__section .mosaic__content h3 {
            padding-top: 0;
        }
        .scroll__section .mosaic__content .c-call-to-action {
            outline:none;/* NECESSARY to prevent bug in box shadow hack in MS browsers */
            margin-top: 10px;
            color: inherit;
            padding-left: 0 !important;
        }
        
        @media screen and (min-width:1083px) and (max-width:1280px){
            .scroll__section .mosaic__content .c-paragraph-1{
                padding-top: 6px;
            }
            .scroll__section .mosaic__content .c-call-to-action {
                outline:none;/* NECESSARY to prevent bug in box shadow hack in MS browsers */
                /*margin-top: 0px;*/
            }
        }
        
        /*
        .scroll__section button.play__button {
        
        }*/
        .stealth-carousel button.play__button,
        .scroll__section button.play__button,
        .triptych__content button.play__button,
        .gamer-spotlight button.play__button {
            display:block;
            position: absolute;
            top:50%;
            left:50%;
            transform: translate(-50%, -50%);
            color: #fff;
            font-size: 48px !important;
            margin:0 !important;
            padding:0 !important;
            line-height: 1;
            overflow:visible;
            height: 70px;
            width: 70px;
            cursor: pointer;
            background: transparent;
            min-width: auto;
            width: 70px;
        }
        
        .stealth-carousel button.play__button.c-glyph::before,
        .scroll__section button.play__button.c-glyph::before,
        .triptych__content button.play__button.c-glyph::before,
        .gamer-spotlight button.play__button.c-glyph::before {
            position: relative;
            top: auto;
            width: auto;
            height: auto;
            margin-left: 0;
            margin-right: 0;
            line-height: 1.2;
            content: "";/* glitch fix */
        }
        
        
        
        /*
        ==================================
        MIXER, GAMER SPOTLIGHT and AMBASSADOR boxes
        ==================================
        */
    @media screen and (min-width: 1400px) {
        .triptych-parent {
            display:flex;
        }
        .triptych-parent .section-intro {
            order: 3;
        }
        .triptych-parent .the-triptych {
            order: 2;
        }

        .triptych-parent .mobile-intro {
            order: 1;
        }
    }
    @media screen and (max-width: 1399px) {
        .ambassador .section-intro {
            text-align: center;
        }

        .ambassador .section-intro p {
            max-width: 650px;
            margin-left: auto;
            margin-right: auto;
        }
    }

        .mobile-third {
            padding-left: 5%;
            padding-right: 5%;
        
        }
        .ambassador .mobile-third,
        .triptych1-section .mobile-third,
        .ambassador__details,
        .triptych1-section__details {
            /*max-width: 75%;
            background-color:#999;*//* for testing */
            margin: 0 auto;
        }
        .ambassador__details .c-heading-1 {
            padding-top: 0;
            margin-top: -13px;
        }
        
        .ambassador__social-header {
            font-size: 22px;
            font-weight: 700;
            padding:0 0 25px 0;
            color: #9bf00b;
        }
        
        .ambassador .mobile-third {
            padding-bottom: 33px;
            text-align: left;
        }
        .ambassador .mobile-third a.f-lightweight,
        .ambassador__details a.f-lightweight {
            color: #9bf00b;
            margin-top: 18px;
        }
        .ambassador .mobile-third a.f-lightweight {
            margin-bottom: 0;
        }
        
        .ambassador__details a.f-lightweight {
            margin-bottom: 30px;
        }
        .ambassador {
            background-color: #000;
            padding-top: 13px;
            padding-bottom: 96px;
            background-image: url(https://compass-ssl.xbox.com/assets/0e/76/0e76e7d0-7a71-45cf-b388-569af9f520cd.jpg?n=Xbox_767_Community_Ambassador_BG-v2.jpg);
            background-position: center bottom;
            background-repeat: no-repeat;
            background-size: 100% auto;
        
        
        }
        
        @media screen and (min-width: 768px){
            .ambassador {
                background-image: url(https://compass-ssl.xbox.com/assets/d2/22/d222263a-e238-464e-8a71-3b3ac1caa9fd.jpg?n=Xbox_1083_Community_Ambassador_BG-v2.jpg);
            }
        }
        
        @media screen and (min-width: 768px){
            .ambassador{
                padding-top: 117px;
                padding-bottom: 0px;
                padding-bottom: 144px;
            }
        }
        @media only screen and (min-width:1400px) {
            .ambassador {
                background-color: #f2f2f2;
                background-image: url(https://compass-ssl.xbox.com/assets/0d/d3/0dd37322-9b9b-451b-be06-dd09c2771966.png?n=Xbox_1920_Community_Ambassador_Pirate.png), url(https://compass-ssl.xbox.com/assets/66/e5/66e5f7c4-627e-4a21-8655-2c5f7f5ee541.jpg?n=Xbox_1920_Community_Ambassador_BG-v2.jpg);
                background-repeat: no-repeat;
                background-position: -2% 80px, center top;
                background-size: auto 81%, 100% 80%;
                z-index: 0;
                position: relative;
                padding-bottom: 97px;
            }
        }
        
        @media only screen and (min-width:1400px) {
            .triptych1-section__details,
            .ambassador__details {
                max-width: 70%;
                margin: 0 7% 0 23%;/* margins and max-width total 100% */
            }
        }
        /*
        @media only screen and (min-width:768px) and (max-width: 1083px){
            .triptych1-section__details {
                max-width: 768px;
            }
        }
        */
        @media only screen and (min-width:1084px) and (max-width: 1399px){
            .triptych1-section__details {
                max-width: 1010px;
            }
        }
        
        [data-grid~="container"].gamer-spotlight .c-heading-1,
        [data-grid~="container"].ambassador .c-heading-1,
        [data-grid~="container"].triptych1-section .c-heading-1 {
            font-weight: 700;
            line-height: 1.16;
        }
        
        .mobile-third {
            text-align: center;
        }   
        .mobile-third .m-banner {
            padding-top: 0px;
        }
        @media screen and (min-width:1400px){
            .mobile-third {
                /*visibility:hidden;*/
                display:none;
            }
            .mobile-content:not(.gamer-spotlight .mobile-content) {
                display:none;
            }
        }
        
        @media screen and (max-width:1399px){
            .ambassador .no-mobile,
            .triptych1-section .no-mobile {
                    display:none;
            }
            .mobile-third,
            .mobile-content {
                text-align: center;
            }
            .mobile-third .c-paragraph {
                max-width: 88%;
                margin-left: auto;
                margin-right: auto;
            }
        }
        /*
        @media screen and (max-width:1399px){
            [data-grid~="container"].gamer-spotlight .c-heading-1,
            [data-grid~="container"].ambassador .c-heading-1,
            [data-grid~="container"].triptych1-section .c-heading-1 {
                font-size: 48px;
            }
        }*/
        /*
        ==================================
        SOCIAL ICON styles
        ==================================
        */
        
        .community__social-links {
            /*width: 85%;*/
            margin: 0 auto 0 auto;
            display:inline-block;
        }
        
        .community__social-links > li {
            margin-bottom: 20px;
        }
        
        .community__social-links li > a {
            display:inline-block;
            padding-right: 5px;
            /*display:flex;          1 these three lines are to vertically align the icon and text within the <li> 
            flex-direction: row;   
            align-items: center;    */
        }
        
        
        .community__social-icon {
            width: 32px;
            height: 32px;
            /*float: left;*/
            margin: 0 16px 0 0;
            position:relative;
            flex:none;
            display:inline-block;
        }
        .community__social-name {
            display:inline-block;
            vertical-align: middle;
            /*height: 32px;
            padding-top: 2px;*/
        }
        .community__social-icon img{
            width: 100%;
            margin: 0 0 0 0;
        }
        .community__social-icon img.dark {
            display:inline-block;
        }
        .community__social-icon img.light {
            display:none;
        }
        
        
        
        @media only screen and (max-width:1083px){
            .gamer-spotlight .community__social-links {
                display: flex;
                flex-direction: row;
            }
        
            .gamer-spotlight .community__social-links > li {
                width: 25%;
                margin-bottom: 0;
            }
            .gamer-spotlight .community__social-links {
                float:none;
                margin-right: 10%;
            }/*
            .community__social-links img {
                filter: invert(1);
            }*/
            .gamer-spotlight .community__social-icon img.dark {
                display:none;
            }
            .gamer-spotlight .community__social-icon img.light {
                display:inline-block;
            }
        }
        
        @media only screen and (min-width: 1084px) and (max-width:1400px){
            .gamer-spotlight .community__social-links > li {
                display:inline-block;
                margin-right: 20px;
            }
            .gamer-spotlight .community__social-links li > a {
                padding: 0;
            }
            .gamer-spotlight .community__social-name {
                display:none;
            }
            .gamer-spotlight .community__social-icon {
                margin-right: 0;
            }
        }
        @media only screen and (max-width:1399px){
            .ambassador__social {
                width: 89.5%;
                margin:48px auto 0 auto;
            }
        
            .ambassador .community__social-links {
                display: flex;
                flex-direction: row;
            }
        
            .ambassador .community__social-links li {
                width: 25%;
                margin-bottom: 0;
            }
            .ambassador .community__social-links {
                float:none;
            }
            /*
            .community__social-links img {
                filter: invert(1);
            }*/
            .ambassador .community__social-icon img.dark {
                display:none;
            }
            .ambassador .community__social-icon img.light {
                display:block;
            }
        }
        
        @media only screen and (max-width:767px){
        
            .ambassador .community__social-links,
            .gamer-spotlight .community__social-links {
                margin-right: 0;
            }
            .ambassador .community__social-icon,
            .gamer-spotlight .community__social-icon {
                margin: 0 5px 0 0;
            }
            .ambassador .community__social-links > li:not(:last-child),
            .gamer-spotlight .community__social-links > li:not(:last-child) {
                display:inline-block;
                width: auto;
                margin-right: 5.8%;
            }
        
        }
        @media only screen and (max-width:639px){
        
            .ambassador .community__social-icon,
            .gamer-spotlight .community__social-icon {
                margin: 0 5px 0 0;
            }
            .ambassador .community__social-links > li:not(:last-child),
            .gamer-spotlight .community__social-links > li:not(:last-child) {
        
                margin-right: 2.6%;
            }
        
        }
        @media only screen and (max-width:539px){
        
            .ambassador .community__social-links li,
            .gamer-spotlight .community__social-links li {
                width: auto;
                margin-right: 16px;
            }
            .ambassador  .community__social-links li,
            .gamer-spotlight .community__social-links li {
                display:inline-block;
                margin-right: 24px;
            }
            .ambassador .community__social-links li > a,
            .gamer-spotlight .community__social-links li > a {
                padding: 0;
            }
            .ambassador .community__social-name,
            .gamer-spotlight .community__social-name {
                display:none;
            }
            .ambassador .community__social-icon,
            .gamer-spotlight .community__social-icon {
                margin-right: 0;
            }
        }
        
        
        
        /* High Color Contrast */
        @-moz-document url-prefix() {
            .high-contrast-mode .high-contrast .community__social-icon img {
                filter: invert(1);
            }
        
            .high-contrast-mode .high-contrast .community__social-icon img.dark {
                display:none;
                filter: invert(1);
        
            }
            .high-contrast-mode .high-contrast .community__social-icon img.light {
                display:inline-block;
            }
        }
        @media screen and (-ms-high-contrast:white-on-black) {
            .high-contrast-mode .high-contrast .community__social-icon img.dark {
                display:inline-block;
            }
            .high-contrast-mode .high-contrast .community__social-icon img.light {
                display:none;
            }
        }
        
        @media screen and (-ms-high-contrast:black-on-white) {
            .high-contrast-mode .high-contrast .community__social-icon img.dark {
                display:none;
            }
            .high-contrast-mode .high-contrast .community__social-icon img.light {
                display:inline-block;
                filter: invert(1);
        
            }
        
        }
        
        
        
        /*
        ==================================
        TRIPTYCH styles
        ==================================
        */
        
        
        
        
        
        
            .triptych__box {
                position:relative;
                margin-left: auto;
                margin-right: auto;
                z-index:0;
            }
        
            .triptych__panel {
                position: relative;
                height: 0;
                margin:0px auto 2px auto;
                width: 89.5%;
                transition: all 200ms;
                padding-bottom: 50.3%; /* apect ratio accounting for  */
                box-sizing: content-box;  /* necessary so the focus border or outline doesn't interfere with aspect ratio calculations. */
                border: 2px solid transparent;
            }
        
            .triptych__panel::before {
                content: "";
                position: absolute;
                height: 100%;
                width: 100%;
                z-index: -1;
                background-color:rgba(0,0,0,.2); /* Done this way because of a small gap than can exist inside an element.*/
                -webkit-filter:blur(35px);
                filter:blur(35px);
            }
            
            .triptych__panel.expanded::before {
                background-color:rgba(0,0,0,.5);
            }
        
        
        /* targets IE 9-11 */
            @media screen and (min-width:0\0) and (min-resolution: +72dpi) {
                .triptych__panel::before {
                    box-shadow: 0px 0px 35px 0px rgba(0,0,0,.18);/* The above method doesn't work in IE */
                }
            }
        
            .triptych__panel.expanded {
                padding-bottom: 83%; /* to control aspect ratio */
                width:100%;
                transform: translateX(-2px);/* compensates for border width on content-box elemeent */
            }
            @media screen and (min-width: 1400px) {
                .triptych__panel.expanded {
                    /*padding-bottom: 95.5%;  to control aspect ratio */
                    padding-bottom: calc(84% + 66px);
                }
            }
            /*
            .triptych__content {
                background-color: #000;
            }*/

            .triptych__thumb {
                border: 2px dashed transparent !important;
                outline: 2px dashed transparent !important;
            }
            .triptych__thumb:before {
                content: '';
                width: 100%;
                height: 100%;
                position: absolute;
                background-color: #000;
            }

            .triptych__thumb:focus {
                border: 2px dashed #fff !important;
                outline: 2px dashed #000 !important;
            }

            .triptych__panel.expanded .triptych__thumb:focus {
                border: 2px dashed transparent !important;
                outline: 2px dashed transparent !important;
            }



            .triptych__thumb img {
                opacity: .7;
            }
            .triptych__panel.expanded .triptych__content {
                opacity: 1;
                visibility: visible;
                background-color: #fff;
            }

            .triptych__panel .triptych__details {
                opacity: 0;
                visibility: hidden;
            }

            .triptych__panel.expanded .triptych__details {
                opacity: 1;
                visibility: visible;
            }

            .triptych__panel.expanded .triptych__thumb img {
                opacity: 1;
            }
            .triptych__panel.expanded button.play__button {
                opacity: 0;
            }
        
            .triptych__content button.play__button {
                transition: all 200ms;
            }
            .triptych__content {
                transition: all 200ms;
                position: absolute;
                height: 100%;
                width: 100%;
                /*overflow:hidden;*/
                cursor:pointer;
            }
            .triptych__poster {
                cursor: pointer;
                background-color: #000000;
                display:none;
            }
        
            .triptych__poster img {
                width: 100%;
            }
            .triptych1-section .triptych__poster img {
                opacity: .5;
            }
        /*
            .triptych__poster::after {
                content:"";
                display: block;
                position: absolute;
                top:0;
                left:0;
                height: 100%;
                width: 100%;
                background-color: rgba(0,0,0,.5);
            }
        */

        
            .triptych__panel.expanded .triptych__padding {
                padding: 2%; /* parent needs to be set to box-sizing:content-box to preserve aspect ratio hack when using border/outline */
            }
        
            .triptych__details {
                padding: 1.98% 2.4%; /* matching triptych__padding, rounded down for line height */
                position: absolute;
                width: 91%;
                height: 0;
                padding-bottom: calc(27% + 20px);
            }
        
            @media screen and (max-width: 1399px) {
                .triptych__details {
                    padding-bottom: 20.5%; /* to control aspect ratio */
                }
            }
        
            .triptych__details > * {
                flex-grow: 1;
            }
            .triptych__details .mixerAvatar {
                width: 40px;
                height: 40px;
                float:left;
                margin-right: 14px;
                border-radius: 50%;
            }
            .triptych__details .username {
                float:left;
                margin-top: 6px;
                font-weight: 600;
                font-size: 18px;
            }
            .triptych__details .viewerCount {
                float:right;
                margin-top: 6px;
            }
        
            .triptych__details .channelName {
                clear: both;
                height: 2.8em;
                margin-bottom: .2em;
                /*font-size: calc(12px + 5 * ((100vw - 320px) / 680));*/
                font-size: calc(1.9vw - 7px);
                line-height: normal;
                font-weight: 700;
                overflow:hidden;
                padding-top: calc(3% - 6px);
            }
        
            @media only screen and (max-width:820px){
                .ambassador__details,
                .triptych1-section__details,
                .triptych__box {
                    max-width: 94%;
                }
                .triptych__details .channelName {
                    font-size: calc(2vw + 10px);
                    padding-top: 2%;
        
                }    
                .triptych__panel.expanded {
                    padding-bottom: calc(72% + 91px)
                }
                .triptych__details {
                    padding-bottom: calc(10% + 85px);
                }
            }
            @media only screen and (max-width:820px){
                .triptych__panel.expanded {
                    /*padding-bottom: calc(72% + 98px);*/
                    padding-bottom: calc(70% + 110px);
                }
                .triptych__details {
                    padding-bottom: calc(10% + 90px);
                }
                .triptych__details .channelName {
                    font-size: calc(2vw + 12px);
                }
            }
        
        
            @media screen and (min-width: 821px) and (max-width: 1399px) {
                .triptych__details .channelName {
                    padding-top: 14px;
                    font-size: 26px;
                }
                .triptych__panel.expanded {
                    padding-bottom: calc(62% + 160px);
                    /*padding-bottom: 78%;*/
                }
                .triptych__details {
                    padding-bottom: calc(10% + 90px);
                }
        
            }
            @media screen and (min-width: 1400px) and (max-width: 1920px) {
                .triptych__details .channelName {
                    /*font-size: calc(1.8vw - 40%);*/
                    padding-top: 2.8%;
                }    
            }
            @media screen and (min-width: 1920px) {
                .triptych__details .channelName {
                    font-size: 28px;
                }    
            }
        
            .triptych__details .streamLink {
                position:absolute;
                bottom: 0;
            }
        /*
            .triptych__details a.streamLink:link,
            .triptych__details a.streamLink:visited,
            .triptych__details a.streamLink:hover,
            .triptych__details a.streamLink:active,
            .triptych__details a.streamLink:focus {
                color:#107c10;
            }
        */
            .triptych__thumb {
                position: relative;
                height: 0;
                padding:0 0 56.25% 0 !important;
            }
        
            .triptych__thumb img,
            .triptych__thumb video,
            .triptych__thumb iframe {
                position: absolute;
                width: 100%;
                height: 100%;
                left: 0;
                top: 0;
            }
        /*
            a.triptych__thumb-image img {
                border: 2px dashed transparent;
                box-sizing: border-box;
            }
        
            a.triptych__thumb-image:focus img,
            a.triptych__thumb-image:active img {
                border-color: #000;
            }
        */
            .triptych__thumb.m-ambient-video {
                min-width: auto !important;
            }        
        
            @media only screen and (min-width:768px) and (max-width: 1083px){
                /*.ambassador__details,
                .triptych1-section__details,
                .triptych__box {
                    max-width: 970px;
                }*/
                .triptych__panel.expanded {
                    /*padding-bottom:76.73%; *//* to control aspect ratio */
                }
            }
            @media only screen and (max-width: 1399px){
                .ambassador__details,
                .triptych1-section__details,
                .triptych__box {
                    max-width: 970px;
                }
            }
            @media only screen and (max-width:1040px){
                .ambassador__details,
                .triptych1-section__details,
                .triptych__box {
                    max-width: 94%;
                }
            }
            /*
            @media only screen and (max-width:767px){
                .triptych__panel.expanded {
                    padding-bottom: calc(82% + 50px); 
                }
                .triptych__details {
                    padding-bottom: calc(20.5% + 50px); 
                }
        
            }*/
        
        /*
        ==================================
        MIXER specifics
        ==================================
        */
        .triptych1-section {
            position:relative;
            margin-top: 89px;
            z-index:50;
        
        }
        @media only screen and (min-width:1400px){
            .triptych1-section {
                background-image: url(https://compass-ssl.xbox.com/assets/f9/41/f941abce-6035-4194-9e52-81e2c30f0957.png?n=Community-Hub_Background-Image-1400_Minecraft_831x1041.png);
                background-repeat: no-repeat;
                background-position: -6% bottom;
                background-size: auto 98%;
            }
        }
        
        @media only screen and (min-width:768px){
            .triptych1-section {
                margin-top: 137px;
                margin-bottom: 0;
            }
        }
        /*
        .triptych1-section .mixer-logo {
            padding: 0;
            margin: 2px 0 -4px 0;
            line-height: 1;
            width: 240px;
            height: 70px;
            color: transparent;
            background-image: url(https://compass-ssl.xbox.com/assets/a9/66/a966f962-3e03-4f83-aac4-e1868da5622b.svg?n=mixer-blue.svg);
            background-size: contain;
        }
        */
        
        .triptych1-section .mixer-logo {
            padding: 0;
            margin: 2px 0 -4px 0;
            line-height: 1;
            width: 240px;
            height: 70px;
        }
        
        .triptych1-section .mixer-logo span {
            display:none;
        
        }
        /* High Color Contrast */
        @-moz-document url-prefix() {
            .high-contrast-mode .high-contrast.mixer-logo span {
                display:inline;
                background-image: none;
                font-weight: 700;
            }
        }
        @media screen and (-ms-high-contrast:white-on-black) {
            .high-contrast-mode .high-contrast.mixer-logo span {
                display:inline;
                background-image: none;
                font-weight: 700;
            }
        }
        
        @media screen and (-ms-high-contrast:black-on-white) {
            .high-contrast-mode .high-contrast.mixer-logo span {
                display:inline;
                background-image: none;
                font-weight: 700;
            }
        }
        
        @media only screen and (max-width:1399px){/* Ths is in an h2 tag for semantics, set to a fixed width to control the svg. text-align:middle doesn't apply. */
            .triptych1-section {
                background-image: none;
            }
            
            .triptych1-section .mixer-logo {
                margin-left: auto;
                margin-right: auto;
            }
        }
        .triptych1-section .mixer-logo img,
        .triptych1-section .mixer-logo picture {
            vertical-align: top;
        }
        
        .triptych1-section .mobile-third a,
        .triptych1-section__details a {
            margin-top: 8px;
            margin-bottom: 32px;
        }
        .triptych1-section__details h3 {
            margin-top: 0;
            padding: 0 0 28px 0;
        }
        
        .mixer__game-icon {
            width: 60px;
            height: 60px;
            float: left;
            margin: 0 20px 0 0;
            position:relative;
            flex:none;
        }
        .mixer__game-icon img{
            width: 100%;
            margin: 0 20px 0 0;
        }
        
        .mixer__games-list li {
            margin-bottom: 20px;
        }
        .mixer__games-list a {
            display: flex;          /* 1 these three lines are to vertically align the icon and text within the <a> */
            flex-direction: row;    /* 2 */
            align-items: center;    /* 3 */
            margin: 0;
        }
        
        .mixer__game-details h4.f-lean {
            padding-bottom: 5px;
            line-height: 1;
        }
        
        .mixer__game-details {
            text-align: left;
        }
        
        .viewerCount {
            padding-left: 30px !important;
            background-image: url(https://compass-ssl.xbox.com/assets/40/71/40711af5-225f-4469-9cc9-ea11d6c6e2ec.png?n=eyecon.png);
            background-repeat: no-repeat;
            background-position: 0 2px;
            color:#107c10;
            font-weight: 600;
        }
        
        .mixer__game-details p.viewerCount {
            padding-bottom: 0px;
        }
        
        .mixer__game-details h4 strong{
            font-weight: 700;
        }
        
        @media only screen and (max-width:1399px){
            .mixer__top-games {
                width: 89.5%;
                margin: 37px auto 0 auto;
            }
            .mixer__games-list {
                display: flex;
                flex-direction: row;
                
            }
            .mixer__games-list li {
                width: 25%;
                margin-bottom: 0;
                display:block;
                padding-right: 24px;
            }
            .mixer__games-list a {
                display: block;
            }
            
            .mixer__game-icon {
                float:none;
                margin-right: 10%;
            }
        
            .mixer__game-details h4.f-lean {
                padding-bottom: 0px;
                line-height: normal;
                word-break: break-word;
                /*font-size: 16px;*/
            }
            .mixer__game-details > p{
                display:none;
            }
        }
        
        @media only screen and (max-width:845px){
            .mixer__game-details h4.f-lean {
                font-size: 13px;
            }
        }
        
        /* =================================================================================================== TESTING ON PREVIEW ========== */
        /* TESTING ON PREVIEW */
        /* ================================================================================================================================= */
        @media only screen and (max-width: 767px){
            .mixer__top-games h3 {
                font-size: 26px;
                text-align: center;
            }
            .mixer__games-list {
                display: block;
                text-align: center;
            }
            .mixer__games-list li {
                width: 46%; /* (100 - rightmargin)/2 */
                margin: 0 8% 4.25% 0;
                max-width: 200px;
                display: inline-block;
                padding-right: 0px;
                vertical-align: top;
            }
            .mixer__games-list li:nth-child(even) {
                margin-right: 0;
            }
            .mixer__games-list li:nth-child(odd) {
                clear:both;
            }
            .mixer__game-icon {
                width: auto;
                height: auto;
                margin: 0;
            }
            .mixer__game-details h4.f-lean {
                font-size: 15px;
            }
        
        }
        /* =================================================================================================== END TESTING ON PREVIEW ========== */
        /* END TESTING ON PREVIEW */
        /* ================================================================================================================================= */
        
        
        @media only screen and (max-width:479px){
            .mixer__game-details h4.f-lean {
                font-size: 12px;
            }
        }
        
        @media only screen and (max-width:539px){
            .mixer__game-details h4.c-paragraph-3 {
                font-size: 12px;
            }
        }
        
        /*
        .mixer__game-details {
            height: 60px;
            vertical-align: middle;
        }*/
        
        /*
        ==================================
        GAMER SPOTLIGHT specifics
        ==================================
        */
        /* gamer-events background image styles are in the markup, along with the buffer that appears when the Gamer section doesn't exist. */
        
        
        
        .gamer-spotlight {
            padding-bottom: 90px;
            padding-top: 6px;
        }
        .gamer-spotlight__image .m-image {
            position:relative;
            padding-top: 0;
            margin-top: 48px;
        }
        
        .gamer-spotlight__details {
            max-width: 77%;
            margin: 0 0 0 23%;/* margins and max-width total 100% */
        }
        .gamer-spotlight__details a.f-lightweight {
            margin: 18px 0 30px 0;
        }
        
        .gamer-spotlight__social-header {
            font-size: 22px;
            font-weight: 700;
            padding:0 0 25px 0;
            color: #5dc21e;
        }
        @media screen and (min-width:768px){
            .gamer-spotlight {
                padding-bottom: 123px;
                padding-top: 91px;
            }
        
        }
        @media screen and (min-width:1084px){
            .gamer-spotlight .mobile-content {
                display:none;
            }
        
            .gamer-spotlight {
                padding-bottom: 144px;
                padding-top: 91px;
                /*background-color: #fff;*/
            }
        
            .gamer-spotlight__details .c-heading-1 {
                padding-top: 31px;
                padding-bottom: 6.34%;
            }
        
            .gamer-spotlight__details .c-paragraph-1 {
                padding-top: 5.85%;
            }
        
            .gamer-spotlight__social-header {
                color: #107c10;
                padding:0 0 7.8% 0;
        
            }
            .gamer-spotlight__details a.f-lightweight {
                margin: 4.39% 0 7.32% 0;
            }
            
            
        }
        
        @media screen and (max-width:1083px){
            .gamer-spotlight {
                padding-top: 48.5%;
            }
            .gamer-spotlight__details {
                color: #fff;
            }
            .gamer-spotlight__details a.f-lightweight {
                color: #5dc21e;
            }
        
            .gamer-spotlight .no-mobile {
                display:none;
            }
            .gamer-spotlight .m-image {
                margin-top: 32px;
                margin-bottom: 40px;
            }
            .gamer-spotlight .mobile-content .c-heading-1 {
                text-align: left;
                padding-top: 0;
            }
        }
        
        .mixer-events-buffer .top {
            height: 91px;
            background-color: #fff;
        }
        .mixer-events-buffer .bottom {
            height: 79px;
            background-color: #000;
        }
        @media screen and (min-width:768px){
            .mixer-events-buffer .top {
                height: 140px;
            }
            .mixer-events-buffer .bottom {
                height: 144px;
            }
        }
        
        /*
        ==================================
        EVENTS boxes
        ==================================
        */
        
        
        .events *{
            position:relative;
        }
        
        .events__box {
            height:600px;
            margin: 0 auto 3% auto; /* 3% matches x-margins from width %. only comes into play when stacking */
            width: 97%;
            overflow:hidden;
        }
        
        .events__headercontainer .events__header {
            width: 100%;
            /*color: #fff;*/
            padding: 18.5% 10% 0 0;
            text-align: left;
        }
        @media screen and (min-width: 1400px){
            .events__headercontainer .events__header {
                padding-left: 10%;
            }
        }
        .events__header-cta {
            margin-top: 18px;
        }
        @media screen and (min-width: 540px){
            .events__headercontainer .c-call-to-action.green-brdr {
                margin-right:36px;
            }
        }
        @media screen and (max-width: 539px){
            .events__headercontainer .c-call-to-action.green-brdr {
                margin: 0 36px;
            }
        }
        
        /*
        @media screen and (min-width: 1084px){
            .events__headercontainer .c-call-to-action {
                display:inline-block;
            }
        }
        */
        .events__box {
            background-color:#f2f2f2;
            color: #515151;
            position:relative;
            /*transition: all 200ms;*/
            display: flex;
        }
        
        .events__headline {
            color: #6d6d6d;
            height: 3.1em;
            font-size:2.2em;
            padding:0;
            margin:-.5em 0 14% 0;/* top margin for pinpoint pixel-perfect precision */
            line-height: 1em;
            z-index: 40;
        }
        /*
        @media screen and (min-width: 540px){
            .events__headline {
                height: 3.1em;
                font-size:2.6em;
            }
        }
        @media screen and (min-width: 768px){
            .events__headline {
                height: 3.1em;
                font-size:3.2em;
            }
        }*/
        
        
        @media screen and (min-width: 1084px){
            .events__headline {
                font-size:3.2em;
                z-index: 48; /* to prevent overlap in HC mode */
            }
        }
        
    
        .events__headline .huge {
            display:block;
            font-size:2.68em;
            line-height: unset;
            padding:0;
            margin:.27em 0 0 0;
            text-indent: -.05em;
            letter-spacing: -.05em;
            z-index: -1;
        }
        .events__content {
            width:100%;
            color:inherit;
            padding: 18.5% 12.2% 14.8% 12.2%;
            display: flex;
            flex-direction:column; 
            justify-content:space-between;
        }
        
        .events__copy .c-heading {
            font-size: 1.8em;
            font-weight: 400;
            line-height: 1.18;
        }
        
        .events__cta {
            height:85px;
            bottom:0;
        }
        @media screen and (min-width:540px) and (max-width:768px){
                    .events__headline {
                font-size:1.25em;
            }
            .events__headline .huge {
                font-size:3em;
            }
        }
        
        /*
        .events__cta > *:not(:last-child) {
            margin: 0 0 8px;
        }*/
        .events__details .c-heading-3 {
            padding-bottom: 9px;
            font-weight: 400;
        }
        
        .events__details .c-paragraph-4 {
            padding-top: 4px;
            font-weight: 400;
        }
        .events__details .c-paragraph-4.url {
            word-break: break-all;/* URLs can be lengthy and don't always include an obvious break point */
        }
        .events__details strong {
            font-weight: 700;
        }
        
        @media screen and (max-width:1399px){
            .events > [data-grid~="container"] > section {
                float:none;
                max-width:793px;
                margin:0 auto;
            }
        }
        
        
        @media screen and (max-width:1200px){
            .events > [data-grid~="container"] > section {
                max-width:80%;
            }
        }
        
        @media screen and (max-width:1399px){
            .events > [data-grid~="container"] > section {
                float:none;
                max-width:714px;
                margin:0 auto;
            }
        }
        
        @media screen and (max-width:1083px){
            .events__cta {
                /*height: auto;*/
                margin-top:24px;
            }
            .events__headercontainer {
                width:100% !important;
                max-width: 650px;
                /*padding-left: 5%;
                padding-right: 5%;*/
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .events__headercontainer .events__header {
                width: 100%;
                padding:0 0 48px;
                text-align: center;
        
            }
            .events__box {
                height: auto;
                display: block;
                width:100%;
                margin-bottom: 12px;
            }
        }
        
        @media screen and (min-width:540px) and (max-width:1083px){
            .events__content {
                padding: 24px 32px 32px 32px;
                display:block;
            }
        
        
            .events__box::after,
            .events__content::after,
            .events__copy::after{
                content:"";
                display:table;
                clear:both;
            }
        
            .events__headline {
                width: 20.52%;
                float: left;
                margin:2px 0 0 0;
            }
            
        
            .events__cta,
            .events__details {
                width: 79.48%;
                float:right;
        
            }
        
        }
        
        @media screen and (max-width:767px){
            .events > [data-grid~="container"] > section {
                max-width: 85.2%;
            }
            .events__box {
                width: 100%;
            }
        }
        
        @media screen and (max-width:539px){
            .events__headline {
                margin-bottom: 10%;
            }
            .events__content,
            .events__headline,
            .events__copy{
                display:block !important;
                float:none !important;
                width:100%;
            }
        
        }
        
        
        
        /*
        ==================================
        DISCUSSIONS
        ==================================
        */
        .discussions {
            position: relative;
            background-color: #f2f2f2;
            padding-top: 82px;
            padding-bottom: 63px;
        }
        
        .discussions::after {
            content: " ";
            display:block;
            clear:both;
        }
        
        .discussions .c-carousel .c-flipper+div {
        
            text-align: center;
        }
        
        .discussions .m-product-placement-item.f-size-medium picture, 
        .discussions .c-product-placement.f-size-medium picture {
            width: 64px;
            height: 64px;
            margin: 0 auto;
        }
        
        
        .discussions .c-carousel.f-single-slide li {
            font-size: 20px;
            /*text-align: center;
            line-height: 20px;
            display: inline-block;
            vertical-align: top;*/
        }
        
        .m-product-placement-item.f-size-medium, 
        .c-product-placement.f-size-medium {
            width: 144px;
        }
        
        .discussions .m-product-placement-item {
            margin-left: 10px;
            margin-right: 10px;
        }
        
        .discussions .m-product-placement-item .c-paragraph-1 {
            font-size: 20px;
            font-weight: 700;
            color: #107c10;
            padding-top: 21px;
            /*text-decoration:underline;*/
        }
        .discussions .m-product-placement-item a{
            overflow: visible;
            white-space: normal;
        }
        
        .discussions .m-product-placement-item a picture {
            border: none;
        }
        
        .discussions .m-area-heading {
            float:none;
        }
        @media only screen and (max-width: 767px) {
            .discussions {
                padding-top: 41px;
            }
        }
        @media only screen and (min-width: 1400px) {
            
            .discussions {
                padding-top: 0px;
                padding-bottom: 100px;
            }
            .discussions nav.c-link-navigation li {
                width: 12%;
            }
        
        }
        
        /* 
        ===================
        GEAR
        ===================
        
        */
        .gear {
            background-color: #f2f2f2;
        }
        .gear .m-feature {
            float:none;
        }
        
        .gear > [data-grid~='container'] {
            /*padding-left: 0;
            padding-right: 0;
            max-width: 1600px;*/
        }
        
        @media (min-width: 540px) and (max-width: 767px) {
            .gear .c-heading-1 {
                padding: 37px 0 3px;
            }
        }
        @media (max-width: 1083px) {
            .gear .c-heading-1 {
                padding: 37px 0 3px;
            }
        }
        @media (min-width: 1084px) {
            .gear picture.gear__image img {
                max-width: 90%;
            }
        }
        /* 
        ===================
        4x bottom mosaic
        ===================
        
        */
        .mosaic {
            background-color: #f2f2f2;
        }
        
        /* mosaic */
        .c-dialog.f-flow [role="dialog"] {
        overflow-y: hidden !important;
        }
        .c-dialog > [role='presentation'] {
            background: rgba(255,255,255,1); 
        }
        
        @media (min-width: 540px) and (max-width: 767px) {
            .mosaic [data-grid~='col-3'] {
                float: left !important;
                width: 50% !important;
            }
        }
        
        @media (min-width: 540px) and (max-width: 1084px) {
            .mosaic .mosaic__item {
                float: left !important;
                width: 50% !important;
            }
        }
        
        @media screen and (min-width: 1084px) {
            /* Zoom images*/
            .pt12 {
                padding-top: 12px;
            }
            .mosaic .mosaic__item,
            .mosaic [data-grid~='col-3'] {
                padding-right: 12px;
            }
        
            .zoomImg {
                overflow: hidden;
                display:block;
            }
        
            .zoomImg img {
                -moz-transition: all 0.3s;
                -webkit-transition: all 0.3s;
                transition: all 0.3s;
            }
        
            .zoomImg:hover img {
                -moz-transform: scale(1.1);
                -webkit-transform: scale(1.1);
                transform: scale(1.1);
            }
        }
        
        @media screen and (max-width:1083px) {
            .gear > [data-grid~='container'],
            .mosaic [data-grid~='container'] {
                padding-left: 5%;
                padding-right: 5%;
            }
        
            .mosaic .mosaic__item,
            .mosaic [data-grid~='col-3'] {
                padding: 6px;
            }
        }
        @media screen and (max-width:680px) {
        .c-dialog [role='dialog'] [role='document'] .m-feature > div {
            width: 80%;
        }
        }
        @media screen and (max-width:539px) {
            .mosaic [data-grid~='container']{
                /*.max-width: 314px; */
                margin: 0 auto;
            }
        
            .mosaic [data-grid~='container'] {
                padding-left: 0;
                padding-right: 0;
            }
        
            .mosaic .mosaic__item,
            .mosaic [data-grid~='col-3'] {
                width: 50% !important;
                float: left !important;
            }
        }
        
        
        .mosaic .mosaic__item .zoomImg img {
            width: 100%;
        }
        
        /* lightbox */
        .c-dialog.f-flow [role='dialog'] {
            max-width: 1600px !important;
            height: 100%;
        }
        
            .c-dialog.f-flow [role='dialog'] > .c-glyph, .c-dialog.f-lightbox [role='dialog'] > .c-glyph {
                width: 48px !important;
                height: 48px !important;
                color: #107c10 !important;
                font-weight: 700 !important;
                font-size: 24px;
            }
        
        @media only screen and (min-width:768px) {
            .c-dialog section {
                height: 49vw;
                overflow: hidden;
            }
        
            .c-dialog .m-feature picture {
                position: absolute;
                top: calc(50%);
                transform: translateY(-50%);
            }
        }
        
        .c-dialog [role='dialog'] {
            border: none !important;
        }
        
        .iconBlade {
            background-color: #f2f2f2;
            padding-top: 22px;
            padding-bottom: 60px;
        }
        
        .dsk48 {
            padding: 42px 0 40px 0;
        }
        /*
        @media screen and (max-width: 1083px) {
            .dsk48 {
                padding-top: 0px;
            }
        }
        */
        
        .iconBlade .c-caption-2 {
            font-weight: 700;
        }
        
        .icons {
            text-align: center;
            /*margin: 38px 0 48px 0;*/
        }
        
        
        .icons a {
            display: inline-block;
            margin: 0 3.2%;
        }
        
        
        /*
        .icons a:focus {
            outline: 2px dashed;
        }
        */
        .icons a:nth-child(6) {
            margin-right: 0px;
        }
        
        .icons a p {
            color: #107c10;
            font-size: 20px;
        }
        
        .icons a:hover p {
            text-decoration: underline;
        }
        
        .icons .icon-break {
            display:inline;
        }
        
        @media screen and (min-width: 768px) {
            .icons a img {
                margin-bottom: 25px;
            }
        }
        @media screen and (max-width: 940px) {
    
            .icons a img {
                float:none;
                margin-right: 0;
                width: 56px;
            }
            .icons a p {
                /*float:left;
                transform: translateY(30%);*/
                display:none;
            }
            
        }
        
        @media screen and (max-width: 640px) {
            .icons .icon-break {
            display:block;
            }
            .icons .icon-break:first-of-type {
            margin-bottom: 32px;
            }
    
            .icons a {
            margin: 0 5%;
        }
        }
    /*
        @media screen and (min-width: 768px) and (max-width: 940px){
        .icons .icon-break {
            display:block;
        }
        .icons .icon-break:first-of-type {
            margin-bottom: 32px;
        }
    
        .icons a {
            margin: 0 5%;
        }
    }*/
        @media screen and (max-width: 539px) {
    
            .icons a img {
                /*margin-right: 10px;*/
                width: 48px;
            }
        
        
        }
        
        /*
        ==================================
        TRIPTYCH VIDEO CONTROL BUTTONS
        ==================================
        */
        
        .triptych__box .buttonswap__container {
        position: absolute; /* Position needs to be defined because child elements are absolute */
        bottom: 16px;
        left: 12px;
        width: 26px;
        /* height and line-height are closely related for vertical centering purposes. 
        It's a bit of a hack, but it was the best option in this instance.
        In this case, line-height ~ (height - (border || outline)) ish */
        height: 26px;
            line-height: 26px; 
            z-index: 3200;
        }
        @media screen and (max-width: 767px) {
            .triptych__box .buttonswap__container {
                bottom: 6%;
            left:3%;
            }
        }
        
        .triptych__box .buttonswap__button {
        font-weight: inherit;
        display:block;
        position: absolute;
        width:100%;
        height:100%;
        text-align:center;
        transition: all 100ms;
        color: #fff;
        font-weight: bold;
        background-color: #666; /* rgba(0,0,0,.3);*/
        border: 2px solid transparent;
        outline: 2px solid transparent;
        }
        
        .triptych__box .buttonswap__button.pause {
        /* Hide on page load. */
        display:none;
        }
        .triptych__box .buttonswap__button.play {
        /* Show on page load. */
        display:block;
        }
        
        .triptych__box .buttonswap__button:link, 
        .triptych__box .buttonswap__button:visited {
        color: #eee;
        }
        
        
        .triptych__box .buttonswap__button:hover, 
        .triptych__box .buttonswap__button:active {
        color: black;
        background-color:white;
        }
        
        .triptych__box .buttonswap__button span, 
        .triptych__box .buttonswap__button.c-glyph::before { 
        /* This fixes alignment issues between glyph and text in local environment. Test in production. */
        vertical-align:top;
        }
        
        /*
        ==================================
        SLIDER Behind the Scenes
        ==================================
        */
        .behind-scenes {
            padding-top: 22px;
            position:relative;
            z-index: 499;
        }
        @media screen and (min-width: 768px){
            .behind-scenes {
                padding-top: 70px;
            }
            .behind-scenes .m-area-heading {
                padding-bottom: 33px;
            }
            
        }
        .behind-scenes-ambassador {
            background-color: #000;
        }
        .behind-scenes,
        .behind-scenes > [data-grid~="container"] {
            background: #000;
        }
        .behind-scenes .panel-content p {
            padding-top: 10px;
        }
        
        /*
        ==================================
        THANK YOU - GO PLAY
        ==================================
        */
        .go-play {
            padding-top: 24px;
            padding-bottom: 36px;
        }
        .go-play .go-play__heading {
            font-size: 28px;
            line-height: 1.16;
            text-align: center;
            margin: 3px auto 33px auto;
            max-width: 85%;
        }
        
        @media screen and (min-width: 768px) {
            .go-play .go-play__heading {
                font-size: 30px;
            }
        }
        @media screen and (min-width: 768px) {
            .go-play .go-play__heading {
                font-size: 32px;
            }
        }
        @media screen and (min-width: 1084px) {
            .go-play .go-play__heading {
                font-size: 36px;
            }
        }
        /*
        @media screen and (min-width: 1400px) {
            .go-play .go-play__heading {
                font-size: 46px;
                line-height: 1.22;
            }
        }
        */
        
        /*
        ==================================
        STAY CONNECTED
        ==================================
        */
        
        .stay-connected {
            padding-top: 57px;
        }
        .stay-connected .m-area-heading {
            padding-bottom: 52px;
        }
        @media screen and (max-width: 767px) {
            .stay-connected {
                padding-top: 0px;
            }
            .c-feature.f-align-left>div, .c-feature.f-align-right>div, .m-feature.f-align-left>div, .m-feature.f-align-right>div {
                padding-bottom: 0;
            }
            .stay-connected .c-heading-1 {
                padding-top: 19px;
            }
        }
        
        .gear__disclaimer {
            font-size: 12px;
            line-height: 1.98em;
            padding: 47px 0 28px 0;
        }
        
        
            
        .discussions .m-product-placement-item a .c-paragraph-1 {
            text-decoration:underline;
        }
        .discussions .m-product-placement-item a:hover .c-paragraph-1 {
            color: #054b16;
            font-weight: 700 !important;
            letter-spacing: -.02em;
        }
        
        /* Hiding background content to pass contrast for FP*/
        .stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content h3,
        .stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content p,
        .stealth-carousel .stealth-sub-carousel.left-carousel .stealth-sub-carousel-panel .panel-content a,
        .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content h3,
        .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content p,
        .stealth-carousel .stealth-sub-carousel.right-carousel .stealth-sub-carousel-panel .panel-content a{visibility: hidden !important;}