/* Custom SuperHero MultiFeature - Position Absolute */
.mod-multi-hero .m-multi-feature:not(.f-console) [role="tabpanel"] .c-call-to-action.f-heavyweight {
  padding: 5px 20px 5px 22px;
  color: #054b16;
  font-weight: 900;
  background: #9bf00b;
}

.mod-multi-hero ul > li:focus {
    border: 2px dotted #000 !important;
    outline: 2px dotted #FFF !important;
}

.high-contrast-mode.white-on-black .mod-multi-hero ul > li:focus {
    filter: invert(1);
}

.m-multi-feature.layered {
float: none;
}
    
@media screen and (min-width: 768px) {
.m-multi-feature.layered {
    padding-top: 0;
    float: none;
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;}

.m-multi-feature.layered .c-pivot {
    margin-top: 0;
    position: absolute;
    right: 0;
    top: calc(20% - 50px);
    /*transform: translateY(-50%);*/
    z-index: 20;
    padding-left: 0;}

.m-multi-feature.layered .c-carousel {
    position: absolute;
    left: 0;
    top: 0;
    width: 100% !important;
    z-index: 19;}

.m-multi-feature.layered.layered>section {
    display: block;
    width: 100%;
    height: 0;
    padding-bottom: 56.2%;}

.m-multi-feature.layered h2, .m-multi-feature.layered h3 {
    text-align: left;}

.m-multi-feature.layered .c-pivot>section[role="tabpanel"]>p {
    max-width: 615px;}
}
    
.m-multi-feature.layered .c-pivot>[role="tablist"]>[role="tab"] {
    font-size: 24px;
    font-weight: 700 !important;
}
    
@media screen and (max-width: 1399px) {
.m-multi-feature.layered .c-pivot>[role="tablist"]>[role="tab"] {
    font-size: 16px;}

.m-multi-feature.layered h2 {
    font-size: 48px;
    line-height: 54px;}

.m-multi-feature.layered h3 {
    font-size: 24px;
    line-height: 28px;}
    
.m-multi-feature.layered .c-pivot>section[role="tabpanel"]>p {
    font-size: 15px;
    line-height: 20px;}
}

@media screen and (min-width: 0px) and (max-width: 1083px) {
.m-multi-feature.layered h2 {
  font-size: 40px;
  line-height: 50px;}
}

@media screen and (min-width: 768px) {
.m-multi-feature.layered>section {
padding-bottom: 54.8%;}
}
    
@media screen and (min-width: 1400px) {
.m-multi-feature.layered>section {
padding-bottom: 56.2%;}
}
/*
html:not(.high-contrast-mode) .bundle.mod-multi-hero .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"] {
border: none;
}*/

/* Adding transparent underline due the jumping */       
html:not(.high-contrast-mode) .bundle.mod-multi-hero .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"].f-active {
 border-color: transparent;
}
    
html:not(.high-contrast-mode) .bundle.mod-multi-hero .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"]:focus {
border-color: #fff;
}


@media screen and (min-width: 1400px) {
.mod-multi-hero .m-multi-feature.f-align-left>section>div, .mod-multi-hero .m-multi-feature.f-align-right>section>div {
width: 40%;}
}

.m-multi-feature .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"]:not(.f-active):after {
position: absolute;
bottom: 2px;
left: 4px;
right: 4px;
content: '';
border-bottom: 2px solid transparent;
}
    
.m-multi-feature .c-pivot .c-flipper {
top: 105px;
}

.theme-seriesx .m-multi-feature .c-pivot .c-flipper {
background-color: #000;
}
    
.theme-seriesx .m-multi-feature .c-pivot>[role="tablist"]>[role="tab"]:not(.f-active) {
color: #fff;
}
    
.m-multi-feature.layered h3 {
padding-top: .5em;
}

.mod-feature .m-multi-feature .c-pivot>ul li {
background-color: #171717;
}

@media screen and (min-width: 768px) {
.mod-multi-hero .m-multi-feature.f-align-left>section>div {
padding-right: 0 !important;
margin-right: 36px !important;}
}

html:not(.high-contrast-mode) .theme-dark.bundle.mod-feature .c-pivot:not(.f-disabled)>ul>li.f-active {
outline: none !important;
}
    
.mod-multi-hero .c-carousel {
background-color: transparent;
}

.mod-multi-hero .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"].f-active:after {
border-bottom: 2px solid #9bf00b !important;
}

.mod-multi-hero.theme-series-s .c-pivot:not(.f-disabled)>[role="tablist"]>[role="tab"].f-active:after {
border-bottom: 2px solid #000 !important;
}

/* End Custom SuperHero MultiFeature */

/* Video hero */
@media screen and (min-width: 1084px) {
.videoHero .m-hero-item.f-x-left.f-y-center .m-ambient-video {
    outline: 1px solid white;
    outline-offset: -1px;}

.videoHero .m-hero-item.f-x-left.f-y-center .m-ambient-video video {
    width: 100% !important;}

.videoHero .m-hero-item picture {
    display: none;}

.videoHero .vidPlayPause {
bottom: -18vw !important;}

.greyBG {
    padding-bottom: 96px;}

.greyBG .m-content-placement-item {
    margin-top: 0 !important;}
}

/* @media screen and (max-width: 1083px) and (min-width: 768px) {
.videoHero .m-hero-item.f-y-center>div>div {
    top: 140px;}
} */

@media screen and (min-width: 1921px) {
.videoHero .vidPlayPause {
    bottom: -350px !important;
    left: 50px;}
}

@media screen and (max-width: 1083px) {
.videoHero .m-ambient-video {
   display: none;}
}

/* Icons */
.icons {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-wrap: wrap;
}

.icons a:focus {
    outline: auto;
}

.icons a p span {
    color: #107c10;
    border-bottom: 3px solid transparent;
    transition: border-color .2s ease-in-out;
    -webkit-transition: border-color .2s ease-in-out;
    -moz-transition: border-color .2s ease-in-out;
}

.icons a:hover p span {
border-bottom: 3px solid #107c10;
}

@media screen and (-ms-high-contrast:active) {
.icons a p span {
color: inherit;
border-bottom: none;
}
.icons a:hover p span {
border-bottom: none;
}
}

.icons a p {
font-weight: 600;
}

@media screen and (max-width: 767px) and (min-width: 400px) {
.mobLength .m-hero-item>div  {
    height: 250px !important;}  
}

@media screen and (max-width: 767px) {
.icons {
    max-width: 300px;
    margin: 0 auto;}

.icons a {
    padding: 10px 16px;}

.topHero .m-hero-item>div {
    height: 200px !important;} 

.crossSell .m-hero-item>div {
    height: 250px !important;} 
}

@media screen and (-ms-high-contrast:active) {
.icons a:hover p span {
    text-decoration: underline !important;}
}


@media (min-width: 0px) and (max-width: 767px) {
.icons img {
    max-width: 100%;
}

.icons a>div {
    width: 100px;
}
.icons a>div>div {
    width: 100%;
    margin: 0 auto;}
}

@media screen and (min-width: 768px) {
.icons a {
    margin: 0 33.5px;}

.icons a>div {
    width: 99px;
    height: 56px;}

.icons a>div>div {
    width: 72px;
    margin: 0 auto;}

.icons {
    margin: 28px 0 35px;}

.crossSell .c-heading, .crossSell p {
    color: #FFF;}
}

@media screen and (min-width: 1084px) {
.icons img {
    max-width: 100%;}
}

/* Misc */
.productCopy h3 a:hover {
    text-decoration: underline;
}

.item.point.m-content-placement-item:hover h3 {
    text-decoration: underline;
}

.spMargin.c-group {
  margin-top: 12px !important;
}

.mod-multi-hero .c-group {
  margin-top: 24px !important;
}

span.sr-text {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
}

.langtranslations {
    display: none;
    height: 0;
}

.item.m-content-placement-item .productCopy .c-badge {
    margin-top: 0;
    margin-right: 8px;
}

.faq-mwf .c-drawer>div[id]>ol {
    padding: 0 32px;
    list-style: decimal;
    margin: 12px 32px 32px;
}

.faq-mwf .c-drawer>div[id]>ol>li {
    padding: 3px;
}

.pairingIcon {
    height: 23px;
    width: 18px;
    vertical-align: top;
}

@media screen and (min-width: 1084px) and (max-width: 1400px) {
.crossSell .m-hero-item>div>div {
    max-width: 400px;}
}