/* 14.02.2020, Tumelo Mokoena - This latest update includes UI Updates for:
- package cards theming for valentines and such
- UI bugs issues for adaptation across multiple device screen sizes
- Updates to the whatsapp chat and live-chat icons
- In content font updates and color
*/
section.header-slider {padding: 0px;}
.text-white {color: rgb(255, 255, 255) !important;}
.lSSlideOuter {user-select: none;overflow: hidden;}
.lSSlideWrapper {max-width: 100%;position: relative;overflow: hidden;}
.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {padding-left: 0px;min-height: 60vh;width: 100% !important;list-style: outside none none;}
.showSlider {visibility: visible;opacity: 1;transition: visibility 0s ease 0s, opacity 0.5s linear 0s;}
.lightSlider {overflow: hidden;margin: 0px;}
.lightSlider::after, .lightSlider::before {content: " ";display: table;}
.xv-slide {z-index: 0;height: 70vh;min-height: 400px;background-size: cover !important;background-repeat: no-repeat;}
.lSSlideOuter .lSGallery li, .lSSlideOuter .lightSlider > * {float: left;}
.xv-slide .has-bottom-gradient {position: inherit !important;}
.xv-slide .has-bottom-gradient::before, .NewDstvPage .banner-slider .video:after, .NewDstvPage .banner-slider .bg-hold:after {content: "";width: 100%;height: 130vh;bottom: 0;right: 0;left: 0;position: absolute!important;background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 40%,#000000 90%); /* FF3.6-15 */background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 40%,#000000 90%); /* Chrome10-25,Safari5.1-6 */background: radial-gradient(ellipse at center, rgba(0,0,0,0) 40%,#000000 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */z-index: 0;top: -30vh;}
.lightSlider.lsGrab > * {cursor: grab;}
.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {padding-left: 0px;min-height: 60vh;width: 100% !important;list-style: outside none none;}
.lSSlideOuter .lSPager, .lSSlideOuter .lightSlider {padding-left: 0px;list-style: outside none none;}
.xv-slider-content {margin-top: 12%;}

.text-white h1 {color: rgb(255, 255, 255);font-size: 64px;font-weight: 100;margin-top: 0.25rem;}
.s-24 {font-size: 24px;font-weight: bolder;}
div > icon-pack icon-fix-errors {font-family: DStv-Packages-Icomoon !important;speak: none;font-style: normal;font-weight: 400;font-variant: normal;text-transform: none;line-height: 1;font-size: 6em;-webkit-font-smoothing: antialiased;color: #fff;-moz-osx-font-smoothing: grayscale;}
.vertical-center {margin: 0;position: absolute;top: 50%;-ms-transform: translateY(-50%);transform: translateY(-50%);}
a#siteCulture:before {content: "\e9af";font-size: 1.2em;}
.banner-slider .bg-hold, .banner-slider .slide {background-size: cover;background-position: top center;}
.banner-slider .bg-hold {background-position: 20% top;background-attachment: fixed;}
.banner-slider .bg-hold.right-aligned {background-position: 80% top;}
.banner-slider .bg-hold.center-aligned {background-position: 56% top;}
.banner-slider .bg-hold {-webkit-animation: none;animation: none;-webkit-animation-direction: normal;animation-direction:  normal;}
.highlights-section .toppics-item-text {overflow:hidden;position: absolute;border-top-left-radius: 5px;border-top-right-radius: 5px;margin-bottom: 0px;left: 0;right: 0;/* text-shadow: 0px 0px 12px rgba(0,0,0,.7); */}
.whats-hot .topPic .toppics-item-text {overflow:hidden;position:relative;border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;margin-bottom: 0px;}
.toppics-heading {position:relative;z-index:2;}
.toppics-item-text:before {/* content:''; */position:absolute;height:100%;width:100%;left:0;right:0;top: 0;bottom:0;background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */z-index:1;}
.highlights-ection .tpopics-main img {width: 100%;height: auto;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;}
.topPic .tpopics-main img {width: 100%;height: auto;border-bottom-right-radius: 0;border-bottom-left-radius: 0;}
.tpopics-main {border-radius: 5px;overflow: hidden;position: relative;}
.figure:hover .tpopics-main img {filter: blur(4px);}
.tpopics-main .img-overlay, .tpopics-main .img-overlay {background: rgba(49, 66, 78, 0.74) !important;}
.search-bar.home-search {display: none;}
.ssItem .content p {min-height: 60px;width: 100%;padding: 0;margin: 0 !important;}
.ssItem .btn-primary:after {vertical-align:middle;content:"\e92d";font-family: dstv-icon-font!important;font-size: 30px;float: right;display: inline-block;margin: 0;}
.ssItem .btn-primary {position:relative;margin: 0 auto !important;height: auto;float: none;text-align: left;display: block;width: 100% !important;font-weight: 300;font-size: small;text-transform: unset;vertical-align: middle;}
.ssItem .btnDiv {/* background: rgba(255,255,255,0.1); */}
/*.section h4:first-of-type {font-family: 'maxtf-blackregular';margin-bottom: 0;font-weight: 100;line-height: 190%;-webkit-text-fill-color: #ffffff00; /* Will override color (regardless of order) *//*-webkit-text-stroke-width: 1px;-webkit-text-stroke-color: #ffffff;}*/
.section h4:first-of-type {font-family: 'Roboto';margin-bottom: 30px;font-weight: 100;line-height: 1.1;}
.section p:first-of-type {margin-bottom: 0;}
.col-xl-4.col-lg-4.col-md-4.col-sm-4.col-xs-8.headerrightsidemenu {float: right;}
.feedback-unit.wa-link {display:none;}
.topPic.slick-initialized .slick-slide {margin: 0;}
.ssItem .content p {display:none;}

/* Temporary Menu Hide because it is currently breaking on mobile */
.NewDstvPage a#navNewClick {/*display: none;*/}
.col-xl-6.col-lg-6.col-md-6.col-sm-6.newMenu {visibility:visible;}
/* End Menu Hide */

@media only screen and (max-width: 767px) {
.section h4:first-of-type {font-size: 2.5rem !important;font-weight:300;}
.ssItem .btn-primary {padding: 8px 10px 18px !important;}
.ssItem .btn-primary span {max-width: 70%;white-space: pre-wrap;display: inline-block;line-height: 120%;word-break: break-word;vertical-align: middle;}
.banner-slider .bg-hold, .banner-slider .slide {background-size: auto;background-position: center top;background-repeat:no-repeat;width: 100% !important;}
.NewDstvPage .banner-slider .slide {min-height: 360px !important;height: 100vh !important;overflow: hidden;width: 100% !important;}
.banner-slider .banner-content h1 {margin: 0 20px !important;font-size: 38px;line-height:100% !important;font-weight: 200;}
.banner-slider .banner-content h3 {margin: 20px 0 20px !important;font-size:24px;}
.banner-content.left.color-black {width: 100%;white-space: normal;}
.banner-slider .banner-content {padding: 60px 0 60px !important;margin: 0 auto;float: none;width: 100%;}
.NewDstvPage .banner-slider button.slick-prev.slick-arrow {left: 26px;}
.NewDstvPage .banner-slider button.slick-next.slick-arrow, .NewDstvPage .banner-slider button.slick-next.slick-arrow:hover, .NewDstvPage #home-banner-slider .slick-next:hover {right: 26px !important;}
.toppics-item-text:after {content:'';position:absolute;height:100%;width: 110%;background-image:inherit;left: -15px;right:0;top: -15px;bottom:0;filter: blur(12px);background-size: 100%;min-height: 110px;min-width: 210px;z-index:0;background-position: 15px top;background-repeat: no-repeat;}
.topPic .toppics-item-text:after {background-position: 15px bottom;}
.highlights-section .topPic .toppics-item-text:after {background-position: 15px top;}
.NewDstvPage a#siteCulture {overflow: hidden !important;max-height: 25px !important;display: block;padding-top: 7px;width: 125px;}
.banner-slider .banner-content .col-sm-7, .banner-slider .banner-content .container {padding: 0 !important;float:none;margin: 0 auto !important;width: 90%;}
.banner-slider .banner-content .col-sm-7 h1, .banner-slider .banner-content .col-sm-7 h2, .banner-slider .banner-content .col-sm-7 h3, .banner-slider .banner-content .col-sm-7 h4, .banner-slider .banner-content .col-sm-7 p {max-width: 100%;padding-left:0 !important;padding-right:0 !important;margin-left: auto !important;margin-right: auto !important;margin-bottom: 20px !important;line-height: 120% !important;}
.banner-slider .banner-content .col-sm-7 p {font-size: medium;}
.getDstvMore.getMoreSection .card .topContainer .largeText {font-size: 16px !important;vertical-align: text-top;display: table-cell;}
.banner-content .download-app-btn {display: block;margin: 0 auto 10px;}
.xv-slide .has-bottom-gradient::before, .NewDstvPage .banner-slider .video:after, .NewDstvPage .banner-slider .bg-hold:after {content: "";width: 130%;height: 180%;bottom: 0;right: -15%;left: -15%;position: absolute!important;background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6-15 */background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0) 10%,rgba(0,0,0,1) 70%); /* Chrome10-25,Safari5.1-6 */background: radial-gradient(ellipse at center, rgba(0,0,0,0) 10%,rgba(0, 0, 0, .7) 60%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */z-index: 0;top: -80%;}
.section .d-flex {margin: 0 15px;}
.section h4:first-of-type {margin: 0 0 20px;line-height: 110%;}
.section p:first-of-type {margin: 0 0 20px;font-size: medium;line-height: 140%;}
.NewDstvPage .topPic .figure {padding: 0 0 0 15px;}
.ssItem .content p {min-height: 100px;width: 100%;padding: 0;margin: 0 !important;}
}

@media only screen and (min-width: 768px) {
.section h4:first-of-type {font-size: 4.9rem !important;}
.ssItem .btn-primary {padding: 8px 14px 14px !important;}
.banner-slider .banner-content h1 {margin: 20px 0 20px !important;font-size:56px;font-weight: 200;}
.banner-slider .banner-content h3 {margin: 20px 0 20px !important;font-size:28px;line-height: 100%;}
.banner-slider .banner-content {padding: 0 0 60px !important;width:auto !important;margin: 0 auto;z-index: 2;}
.banner-slider .banner-content.left {margin: 0 auto 0 14vw;}
.NewDstvPage .banner-slider .slide {min-height: 320px !important;max-height: 100vh !important;overflow: hidden;}
.NewDstvPage .banner-slider button.slick-prev.slick-arrow {left: 60px;z-index: 9; width:54px;}
.NewDstvPage .banner-slider button.slick-next.slick-arrow {right: 60px !important;background: none; width:54px;}
.NewDstvPage .banner-slider button.slick-next.slick-arrow:hover, .NewDstvPage #home-banner-slider .slick-next:hover {background: none;opacity: .9;right: 60px !important;}
.highlights-section .toppics-item-text:after {content:'';position:absolute;height:100%;width:100%;background-image:inherit;left: -37px;right:0;top: -15px;bottom:0;filter: blur(12px);background-size: 100%;min-height: 110px;min-width: 322px;z-index:0;background-position: 15px top;background-repeat: no-repeat;transform: none !important;}
.whats-hot .topPic .toppics-item-text:after {content:'';position:absolute;height: 150%;width: 120%;background-image:inherit;left: -10%;right:0;top: -30%;bottom:0;filter: blur(12px);background-size: 100%;min-height: 110px;min-width: 322px;z-index:0;background-position: 15px bottom;background-repeat: no-repeat;transform: none !important;}
.col-xl-2.col-lg-2.col-md-2.col-sm-2.col-xs-4 {padding-left: 2em;max-width: 200px;}
.NewDstvPage a#siteCulture {overflow: visible !important;max-height: 25px !important;display: block;padding-top: 7px;width: 125px;}
.self-service .self-service-slider .slick-list {}
.section p {font-size: x-large;}
.section.getDstvMore.getMoreSection .card p {line-height: normal;display: block;width: 100%;margin-top: 0;font-size: 16px;}
.ssItem .content p {width: 100%;padding: 0;margin: 0 !important;line-height: 120% !important;font-size: 14px;}
.ssItem .content p span {line-height: 120% !important;}
.getDstvMore.getMoreSection .card .topContainer .largeText {font-size: 1.3em !important;vertical-align: text-top;display: table-cell;margin: 0 auto !important;padding: 0;line-height: normal;}
.YouMayAlsoLikeSection .card .topContainer .largeText {font-size: 1.3em !important;vertical-align: text-top;display: table-cell;margin: 0 auto !important;padding: 0;line-height: normal;text-shadow: 1px 1px 16px #000;}
.banner-content .download-app-btn {display: inline-block;margin: 20px 16px 0 0;}
.NewDstvPage .topPic .figure {padding: 0 16px 0 0;}
.section.localSlider p:first-of-type, .section.packages-sliders p:first-of-type, .section.getMoreSection p:first-of-type, .section.self-service p:first-of-type {margin-bottom: 0;max-width:80%;/* display: none; */color: #fff;}
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
.NewDstvPage .ssItem .content {/* min-height: 35vh; */}
}