.dstv_logo{
	width: 85px;
}

.card {
    position: relative;
}

.main-link::before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.moreinfo a:hover {
    color: #000!important;
}

.package_access{
	background-image: url("/images/internet-and-tv/dstv/access01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_dstvstream_access{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-access-bg.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_dstvstream_family{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-family-bg.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_dstvstream_compact{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-compact-bg.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_dstvstream_compactplus{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-compact-plus-bg.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_dstvstream_premium{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-premium-bg4.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_family{
	background-image: url("/images/internet-and-tv/dstv/family01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_compact{
	background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_compact_euro{
	background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.euro{
	position: relative;
	z-index:-1;
    top: 94%!important;
    width: 100%!important;
}

.euro-inner{
	position: relative;
	z-index:-1;
    top: 74%!important;
    width: 100%!important;
}

.euro-logo{
	position: absolute;
    top: 29% !important;
}

.olympic-logo{
	position: absolute;
    top: 28% !important;
    right: 0%;
}

.olympic-logo-mobile{
	position: absolute;
	top: 5% !important;
	right: 0%;
}

.euro-logo-inner{
	position: absolute;
    top: 32% !important;
}

.package_compactplus{
	background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
    background-repeat: no-repeat;
   /*  background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_compactplus_euro{
	background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
    background-repeat: no-repeat;
   /*  background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_premium{
	background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_premium_euro{
	background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    height: 500px;
}

.package_access_inner{
	background-image: url("/images/internet-and-tv/dstv/access01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px -60px;
	height: 430px;
}

.package_family_inner{
	background-image: url("/images/internet-and-tv/dstv/family01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px -60px;
	height: 430px;
}

.package_compact_inner{
	background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px -60px;
	height: 430px;
}

.package_compact_inner_euro{
	background-color:#000;
	background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px 13px;
	height: 430px;
}

.package_compactplus_inner{
	background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
    background-repeat: no-repeat;
   /*  background-size: cover;
    background-position: top; */
    background-position: 0px -60px;
	height: 430px;
}

.package_compactplus_inner_euro{
	background-color:#000;
	background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
    background-repeat: no-repeat;
   /*  background-size: cover;
    background-position: top; */
    background-position: 0px 13px;
	height: 430px;
}

.package_premium_inner{
	background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px -60px;
	height: 430px;
}

.package_premium_inner_euro{
	background-color:#000;
	background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
    background-repeat: no-repeat;
    /* background-size: cover;
    background-position: top; */
    background-position: 0px 13px;
	height: 430px;
}

.radio_btn_shadow{
	/*box-shadow:0 40px 18px -12px rgba(0, 0, 0, 0.9);*/
	box-shadow: 0px 14px 20px -17px rgba(0,0,0,0.5) !important;
	margin-bottom: 20px;
}

.btn-home-pink01 {
    background-color: #ec0087 !important;
    border: none;
}

.u-btn-outline-black:focus, .u-btn-outline-black.active {
    color: #000!important;
    background-color: #fff!important;
}

.navlink {
    display: block;
    padding: 0.5rem 1rem;
	color: #fff!important;
	opacity: 0.6;
}

.u-nav-v5-3 .navlink {
    border-bottom-width: 5px!important;
}

[class*="u-nav-v5"] .navlink {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: transparent;
}

[class*="u-nav-v5"].u-nav-primary .navlink.active {
    border-color: #fff!important;
    color: #fff!important;
	opacity: 1;
}

ul.nav.u-nav-v5-3.u-nav-primary.u-nav-rounded-5.g-mb-20 {
	/* border-bottom: #ccc solid 1px!important; */
	/* max-width: 415px; */
	margin: auto;
	width: 100%;
}

.navlink:focus, .navlink:hover {
    color: #fff!important;
	opacity: 0.6;
}

a.navlink:hover {
    text-decoration: none;
}

/*------------------------------------
  Carousel indicators
------------------------------------*/
[class*="u-carousel-indicators"] {
  display: block;
  position: absolute;
  padding-left: 0;
  margin-bottom: 0;
}

[class*="u-carousel-indicators"] li {
  list-style: none;
}

[class*="u-carousel-indicators"] span {
  display: block;
  cursor: pointer;
}

/*------------------------------------
  Carousel indicators v1
------------------------------------*/
.u-carousel-indicators-v1,
.u-carousel-indicators-v1--white {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.u-carousel-indicators-v1 li,
.u-carousel-indicators-v1--white li {
  margin: 0 5px;
}

.u-carousel-indicators-v1 li.slick-active span,
.u-carousel-indicators-v1--white li.slick-active span {
  background-color: #ec0087;
}

.u-carousel-indicators-v1 span,
.u-carousel-indicators-v1--white span {
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: #777;
  opacity: 1;
}

.u-carousel-indicators-v1 span {
  background-color: #777;
}

.u-carousel-indicators-v1--white li.slick-active span {
  background-color: #fff;
}

.greentick{
	color:#46B04B;
}

/*channels category*/
.logobg {
    background-color: #fff!important;
    /* padding: 10px; */
    border-radius: 5px;
}

.bg-logo-category{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-logo-category.jpg");
	background-repeat: no-repeat;
    background-position: center center;
	background-size: cover;
}
/*channels category*/

/*bg section*/

.bg-dstv-football {
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-football04.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-othersports{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/other-sports-backgroundv12.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-movies{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-movies.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}


.bg-dstv-documentary{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-documetary.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-kids{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-kids.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-access-hero{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-compact.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-family-hero{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-compact.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-compact-hero{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-compact.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-compactplus-hero{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-compact.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}

.bg-dstv-premium-hero{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-compact.jpg");
	/* height: 790px; */
    background-repeat: no-repeat;
    background-position: center center;
		background-size: cover;
}


/*bg section*/

.selectdstvmoviecarousel ul.slick-dots li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    /* width: 30px;
    height: 5px; */
	width:15px;
	height:15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    /* background-color: #E9E9E9; */
	/* background-color: #FFF; */
	background-color:#777;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    /* opacity: .5; */
	opacity:1;
    transition: opacity .6s ease;
	border-radius: 50%!important;
}

.selectdstvmoviecarousel ul.slick-dots li.slick-active{
    /* opacity:0.4; */
	/* background-color:#AEAEAE; */
	background-color:#ec0087;
}

.selectdstvmoviecarousel ul.slick-dots {
    bottom: -50px!important;
}


.selectdstvmoviecarousel .slick-arrow:hover{
    display:block !important;
}

.selectdstvmoviecarousel .slick-prev:before {
	content: "\f104";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvmoviecarousel .slick-next:before {
	content: "\f105";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvmoviecarousel{
    .slick-arrow{
        opacity:0 !important;
    }
    &:hover{
        .slick-arrow{
            opacity:1 !important;
        }
    }
}

.selectdstvsportscarousel ul.slick-dots li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    /* width: 30px;
    height: 5px; */
	width:15px;
	height:15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    /* background-color: #E9E9E9; */
	/* background-color: #FFF; */
	background-color:#777;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    /* opacity: .5; */
	opacity:1;
    transition: opacity .6s ease;
	border-radius: 50%!important;
}

.selectdstvsportscarousel ul.slick-dots li.slick-active{
    /* opacity:0.4; */
	/* background-color:#AEAEAE; */
	background-color:#ec0087;
}

.selectdstvsportscarousel ul.slick-dots {
    bottom: -50px!important;
}


.selectdstvsportscarousel .slick-arrow:hover{
    display:block !important;
}

.selectdstvsportscarousel .slick-prev:before {
	content: "\f104";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvsportscarousel .slick-next:before {
	content: "\f105";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvsportscarousel{
    .slick-arrow{
        opacity:0 !important;
    }
    &:hover{
        .slick-arrow{
            opacity:1 !important;
        }
    }
}

.selectdstvdocumentarycarousel ul.slick-dots li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    /* width: 30px;
    height: 5px; */
	width:15px;
	height:15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    /* background-color: #E9E9E9; */
	/* background-color: #FFF; */
	background-color:#777;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    /* opacity: .5; */
	opacity:1;
    transition: opacity .6s ease;
	border-radius: 50%!important;
}

.selectdstvdocumentarycarousel ul.slick-dots li.slick-active{
    /* opacity:0.4; */
	/* background-color:#AEAEAE; */
	background-color:#ec0087;
}

.selectdstvdocumentarycarousel ul.slick-dots {
    bottom: -50px!important;
}


.selectdstvdocumentarycarousel .slick-arrow:hover{
    display:block !important;
}

.selectdstvdocumentarycarousel .slick-prev:before {
	content: "\f104";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvdocumentarycarousel .slick-next:before {
	content: "\f105";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvdocumentarycarousel{
    .slick-arrow{
        opacity:0 !important;
    }
    &:hover{
        .slick-arrow{
            opacity:1 !important;
        }
    }
}

.selectdstvkidscarousel ul.slick-dots li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    /* width: 30px;
    height: 5px; */
	width:15px;
	height:15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    /* background-color: #E9E9E9; */
	/* background-color: #FFF; */
	background-color:#777;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    /* opacity: .5; */
	opacity:1;
    transition: opacity .6s ease;
	border-radius: 50%!important;
}

.selectdstvkidscarousel ul.slick-dots li.slick-active{
    /* opacity:0.4; */
	/* background-color:#AEAEAE; */
	background-color:#ec0087;
}

.selectdstvkidscarousel ul.slick-dots {
    bottom: -50px!important;
}


.selectdstvkidscarousel .slick-arrow:hover{
    display:block !important;
}

.selectdstvkidscarousel .slick-prev:before {
	content: "\f104";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvkidscarousel .slick-next:before {
	content: "\f105";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvkidscarousel{
    .slick-arrow{
        opacity:0 !important;
    }
    &:hover{
        .slick-arrow{
            opacity:1 !important;
        }
    }
}

.selectdstvmusiccarousel ul.slick-dots li {
    box-sizing: content-box;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    /* width: 30px;
    height: 5px; */
	width:15px;
	height:15px;
    margin-right: 3px;
    margin-left: 3px;
    text-indent: -999px;
    cursor: pointer;
    /* background-color: #E9E9E9; */
	/* background-color: #FFF; */
	background-color:#777;
    background-clip: padding-box;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    /* opacity: .5; */
	opacity:1;
    transition: opacity .6s ease;
	border-radius: 50%!important;
}

.selectdstvmusiccarousel ul.slick-dots li.slick-active{
    /* opacity:0.4; */
	/* background-color:#AEAEAE; */
	background-color:#ec0087;
}

.selectdstvmusiccarousel ul.slick-dots {
    bottom: -50px!important;
}


.selectdstvmusiccarousel .slick-arrow:hover{
    display:block !important;
}

.selectdstvmusiccarousel .slick-prev:before {
	content: "\f104";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvmusiccarousel .slick-next:before {
	content: "\f105";
	color: white;
	font-size: 30px;
	font-family: 'FontAwesome';
}

.selectdstvmusiccarousel{
    .slick-arrow{
        opacity:0 !important;
    }
    &:hover{
        .slick-arrow{
            opacity:1 !important;
        }
    }
}

.bg-videosection{
	background-color: #efefef!important;
}

.bg-howto-icons{
	background-color:#E49F26;
	padding: 30px;
}

/*media queries section*/

#dstv_stream_screens-mobile{
		display: none;
		visibility: hidden;
}
@media only screen and (min-width: 120px) and (max-width: 990px){
	#dstv_stream_screens-mobile {
		display: block !important;
		visibility: visible;
	}

	#dstv_stream_screens{
		display: none;
		visibility: hidden;
	}
}

#dstv_stream_videos-mobile{
		display: none;
		visibility: hidden;
}
@media only screen and (min-width: 120px) and (max-width: 990px){
	#dstv_stream_videos-mobile {
		display: block !important;
		visibility: visible;
	}

	#dstv_stream_videos{
		display: none;
		visibility: hidden;
	}
}

#dstv_stream_howto-mobile{
		display: none;
		visibility: hidden;
}
@media only screen and (min-width: 120px) and (max-width: 990px){
	#dstv_stream_howto-mobile {
		display: block !important;
		visibility: visible;
	}

	#dstv_stream_howto{
		display: none;
		visibility: hidden;
	}
}

@media (min-width: 992px){
	.titlepackages{
		max-width:1066px!important;
	}
	#dstv_stream_offers ul.js-pagination {
		visibility: hidden!important;
	}
}

@media (max-width: 767px){

	.aligncontentcenter {text-align: center;}

	.package_access{
		background-image: url("/images/internet-and-tv/dstv/access01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 510px;
	}
	
	.package_dstvstream_access{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-access-bg.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 360px;
	}
	.package_dstvstream_family{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-family-bg.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 360px;
	}
	.package_dstvstream_compact{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-compact-bg.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 360px;
	}
	.package_dstvstream_compactplus{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-compact-plus-bg.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 360px;
	}
	.package_dstvstream_premium{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/dstv-premium-bg4.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 360px;
	}
	
	.euro{
		position: relative;
		z-index:-1;
		top: 92%!important;
		width: 100%!important;
	}
	
	.euro-inner{
		position: relative;
		z-index:-1;
		top: 72%!important;
		width: 100%!important;
	}

	.package_family{
		background-image: url("/images/internet-and-tv/dstv/family01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 510px;
	}

	.package_compact{
		background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 510px;
	}
	
	.package_compact_euro{
		background-color: #000;
		background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px 27px;
		height: 510px;
	}

	.package_compactplus{
		background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 510px;
	}
	
	.package_compactplus_euro{
		background-color: #000;
		background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px 27px;
		height: 510px;
	}

	.package_premium{
		background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px -40px;
		height: 510px;
	}
	
	.package_premium_euro{
		background-color: #000;
		background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 0px 27px;
		height: 510px;
	}
	
	.package_access_inner{
		background-image: url("/images/internet-and-tv/dstv/access01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px -60px;
		height: 430px;
		background-size: cover;
	}

	.package_family_inner{
		background-image: url("/images/internet-and-tv/dstv/family01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px -60px;
		height: 430px;
		background-size: cover;
	}

	.package_compact_inner{
		background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px -60px;
		height: 430px;
		background-size: cover;
	}
	
	.package_compact_inner_euro{
		background-image: url("/images/internet-and-tv/dstv/compact01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px 12px;
		height: 430px;
		background-size: cover;
	}

	.package_compactplus_inner{
		background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
		background-repeat: no-repeat;
	   /*  background-size: cover;
		background-position: top; */
		background-position: 0px -60px;
		height: 430px;
		background-size: cover;
	}
	
	.package_compactplus_inner_euro{
		background-image: url("/images/internet-and-tv/dstv/compactplus01.jpg");
		background-repeat: no-repeat;
	   /*  background-size: cover;
		background-position: top; */
		background-position: 0px 12px;
		height: 430px;
		background-size: cover;
	}

	.package_premium_inner{
		background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px -60px;
		height: 430px;
		background-size: cover;
	}
	
	.package_premium_inner_euro{
		background-image: url("/images/internet-and-tv/dstv/premium01.jpg");
		background-repeat: no-repeat;
		/* background-size: cover;
		background-position: top; */
		background-position: 0px 12px;
		height: 430px;
		background-size: cover;
	}
}


.widthmod {width: 200px !important;}

@media (min-width: 992px) {
	.col-lg-3-modify {
	    max-width: 20% !important;
    }
	#dstv_stream_category ul.js-pagination {
		visibility: visible!important;
		display: flex!important;
	}
}


@media (min-width: 992px)


@media (min-width: 767px){
	#dstv_stream_category ul.js-pagination {
		display: block!important;
	}
}

/*media queries section*/

.bg-modal{
	background-image: url("https://www.myt.mu/home/dstv/assets/images/dark-blue-background.jpg");
	width: 100%;
    height: 160px;
	background-size: cover;
    background-position-x: center;
}

.channel-modal-logo{
	width: 120px;
    height: 120px;
    background-color: #fff;
    position: relative;
    margin: 0 auto;
    top: 90px;
    filter: drop-shadow(0 5px 15px #00000021);
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
	left:10px;
}

.modalh3{
	font-size: 16px;
    font-weight: bold;
    margin-top: 50px;
	color:black;
}

.mt-16{
	margin-top:16px;
}

.ml-84{
	margin-left:84px;
}

.channelLogo1{

	height: 100px!important;
    width: 100px!important;
}

.channelLogo2{
	height: 70px!important;
    width: 70px!important;
}

.modalh4{
	font-size: 14px;
    font-weight: 400;
	color:black;
}

.g-right-custom{
	right: 195px !important
}

.g-left-custom{
	left: 195px !important;
}

@media (min-width: 1200px){
	.hidden-lg{display:none!important}
}
@media (min-width:992px) and (max-width:1199px){
	.hidden-md{display:none!important}
	.g-right-custom{
		right:75px !important
	}
	.g-left-custom{
		left: 75px !important;
	}
}
@media (min-width:768px) and (max-width:991px){
	.hidden-sm{display:none!important}
	.g-right-custom{
		right:0px !important
	}
	.g-left-custom{
		left: 0px !important;
	}
}
@media (max-width: 767px) {
	.hidden-xs{display:none!important}
	.g-right-custom{
		right:0px !important
	}
	.g-left-custom{
		left: 0px !important;
	}
}


.btn-pink{
	color: #555;
    background-color: #fff;
}

.activated{
	color:#fff !important;
	font-weight:bold!important;
	background: linear-gradient(to right,#d70a84, #8b0053)!important;
}

.custom-height{
	height: 744.98px;
}

.imgsteps{
	width:20%;
}

@media (max-width: 767px){
	.custom-height{
		height: 910.02px;
	}
	.imgsteps{
		width:60%;
	}
}

.borderCard{
	background-image:linear-gradient(135deg,#000713,#00aeee) !important;
	border-radius:10px
}


.boxSize{
	height: 70px!important;
    width: 114px!important;
	padding: 0px 0px 0px 0px;
	text-align: -webkit-center;
	border-radius:10px;
}

.boxSize1{
	height: 70px!important;
    width: 163px!important;
	padding: 0px 0px 0px 0px;
	text-align: -webkit-center;
	border-radius:10px;
}


.boxSizemobile{
	height: 63px!important;
	width: 90px!important;
	padding: 0px 0px 0px 0px;
	text-align: -webkit-center;
	border-radius:10px;
}

.channelLogo{

	height: 60px!important;
    width: 60px!important;
}

.noDisplay{
	display:none!important;
}

.scroll-container {
  overflow-x: scroll;
  white-space: nowrap;
}

.card1 {
  display: inline-block;
  width:150px;
}

.bg-modal-content{
	white-space:nowrap;
}

.modal-size{
	height:550px;
	width:1250px;
}

.modal-size1{
	height:600px;
	width:1250px;
}

.bg-color-1 {
    background-color: #e0e0e0;
}

.bg-color-2 {
    background-color: #f1f1f1;
}

.table td, .table th{
	border-top: 0px!important;
}

.table thead th{
	border-bottom: 0px!important;
}

.g-font-size-15--md{
	font-size: 1.0286rem !important;
}

.bg-dstv-movies1{
	background-size: cover;
	background-image: url(https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/movies-series.jpg);
	background-repeat: no-repeat;

}

.bg-dstv-kids1{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/kids.jpg");
	background-size: cover;
	background-repeat: no-repeat;
}

.bg-dstv-doc1{
	background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/documentary3.jpg");
	background-size: cover;
	background-repeat: no-repeat;
}

.moviesCard{
	height: 400px;
	border-radius: 10px;
}

@media (max-width:767px) {
	.moviesCard{
		height: auto;
	}

	.mobilepos{
		margin-left: 17px!important;
	}

	.bg-dstv-football{
		background-image: url("https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/kids.jpg");
		background-size: cover;
		background-repeat: no-repeat;
		background-position: left center;
	}
	.bg-dstv-othersports {
		background-image: url(https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-logo-category.jpg);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
	}
}

.imgLogo{
	height:60px;
	width:60px;
}

.imageBanner{
	border-radius:10px 10px 0px 0px;
}

/*preorder*/
.title_needassistance {
    font-size: 20px !important;
    font-weight: bold;
	color:#000;
}

.formwidth{
	 max-width: 1075px!important;
}

.btn-send {
    color: #fff;
    background-color: #ec0087!important;
}

em {
    color: red;
    font-size: 15px;
    position: absolute;
    z-index: 99;
    height: 30px;
    margin-bottom: 10px;
}

.form-control:focus, .custom-select:focus {
    border-color: #ffa400!important;
    box-shadow: none;
}

input {
    display: block;
    width: 50vw;
    padding: 0 1.25rem;
}

input,
input::placeholder {
    font: 1.15rem/3 sans-serif;
}

.pageTitleBg{
	background-image: url("https://imgcdn.myt.mu/revolution/dstv-bg5.jpg")!important;
	background-position: center;
	background-size: cover;
}

.pageTitle{
	background-image: url("paper.gif");
	text-align:center;
	padding:30px;
	background-color:#000;
	/* margin-bottom:20px; */
	height:275px;
}

.pageTitle2{
	background-image: url("paper.gif");
	text-align:center;
	padding:30px;
	background-color:#000;
	/* margin-bottom:20px; */
}

/*preorder*/

.boxSize3{
	height: 110px!important;
    width: 135px!important;
    padding: 7px 0px 0px 0px;
    text-align: -webkit-center;
    border-radius: 10px;
}

.channelLogo3{
	height: 100px!important;
    width: 100px!important;
}

.custom-height2{
	height:883.04px;
}

/*promo tag*/
.promobartext{
    font-size: 16px!important;
    /* text-transform: uppercase!important; */
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
    color: #fff;
    text-align: center;
	font-weight: 800;
}

.promobarpos{
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 100%;
}

.promobarbg{
	background: linear-gradient(90deg, rgba(244,112,79,1) 0%, rgba(255,0,60,1) 100%);
	border-top-left-radius: 15px;
    border-top-right-radius: 15px;
	width: 100px;
}

.otherpackspromoperiod{
	height: 30px;
}
/*promo tag*/

/*navquestion*/
.navtoggle{
	 max-width: 550px;
	/*max-width:800px;*/
    margin-left: auto;
    margin-right: auto;
}

.navquestion {
	cursor: pointer;
	display: flex;
	position: relative;
	box-sizing: border-box;
	align-items: center;
	border-radius: 32px;
	/*background-color: #18171F;*/
	/* background-color: #F3F3F3; */
	background-color: #FFF;
  }
@media (max-width:959.95px) {
  .navquestion {
	width: 100%;
	cursor: initial;
	margin: auto;
  }
}

  .navquestion p {
	flex: 1;
	color: #000;
	margin: 0;
	padding: 16px 8px;
	z-index: 1;
	font-size: 16px;
	text-align: center;
	transition: color 0.3s ease-in-out;
	/* font-family: inherit; */
	font-weight: 500;
	line-height: 130%;
	user-select: none;
  }
  .navquestion::before {
	top: 4px;
	bottom: 4px;
	content: "";
	position: absolute;
	min-width: calc(50% - 4px);
	/* box-shadow: 0 0 8px 0 #D0D0D0, 0px 1px 3px 4px #FFFFFF inset; */
	transition: all 0.3s ease-in-out;
	border-radius: 32px;
	/* background-color: #FFFFFF; */
	/*background: linear-gradient(to right,#d70a84, #8b0053)!important;*/
	/*background-color:#E83D8E;*/
	background: linear-gradient(to right,#d70a84, #8b0053)!important;
  }
  .navquestion.start-right::before {
	left: 4px;
	right: 50%;
  }
  .navquestion.start-left::before {
	left: 50%;
	right: 4px;
  }
  .navquestion.to-right::before {
	left: 50%;
	right: 4px;
	transform: translateX(-50%,-50%);
  }
  .navquestion.to-left::before {
	left: 4px;
	right: 50%;
	transform: translateX(-50%,-50%);
  }
@media (max-width:1279.95px) {
  .navquestion p {
	font-size: 15px;
  }
}
@media (max-width:599.95px) {
  .navquestion p {
	font-size: 14px;
  }
}
@media (max-width:959.95px) {
  .navquestion p {
	min-width: auto;
  }
}
  .navquestion p.current {
	/* color: #CC0000; */
	color: #FFFFFF;
	cursor: initial;
  }
  .navquestion p:hover {
	color: #000000;
  }
  .navquestion p:nth-child(1) {
	padding-left: 16px;
  }
  .navquestion p:nth-child(2) {
	padding-right: 16px;
  }
  .navquestion p.current:hover {
	/* color: #CC0000; */
	color: #FFFFFF;
  }

/*navquestion*/

.g-bg-alreadyshowmaxcustomer-section{
    background: linear-gradient(to right,#056AB8, #23429D)!important;
}

.g-bg-downloadapp{
	background-color: #e4eaf3 !important;
}

.g-max-width-700--md{
	max-width: 700px;
}


.img-responsive, .thumbnail>img, .thumbnail a>img, .carousel-inner>.item>img, .carousel-inner>.item>a>img {
    display: block;
    max-width: 100%;
    height: auto;
}

/*zoom*/
.magnifier {
  /*width: 640px;
  margin: 50px auto;*/
  position: relative;
}

.magnifier:hover {
  cursor: none;
/*   cursor: crosshair; */
}

.large {
  width: 175px;
  height: 175px;
  position: absolute;
  border-radius: 100%;
  box-shadow: 0 0 0 7px rgba(191, 191, 191, 0.85),
	0 0 7px 7px rgba(0, 0, 0, 0.25),
	inset 0 0 40px 2px rgba(191, 191, 191, 0.25);
  background: url('https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/steps/step01.png')
	no-repeat;
  display: none;
}
.smallversion {
  display: block!important;
}
/*zoom*/


.g-custom-top{
	top:-4%;
}

.g-custom-topv1{
	top:-10%;
}

.g-custom-left{
	left: 85.71429rem!important;
}

@media (max-width: 767px){
	.g-custom-left{
		left: 22.71429rem!important;
	}
}
.btn-home-pink01 {
    background-color: #ec0087 !important;
    border: none;
}

.no-bullets {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

/*Guide*/
.btn-allsports{
	background-image: url(https://imgcdn.myt.mu/revolution/home/all-sports-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-allsports:hover{
	cursor:pointer;
}

.btn-football-prog{
	background-image: url(https://imgcdn.myt.mu/revolution/home/football-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-football-prog:hover{
	cursor:pointer;
}

.btn-f1{
	background-image: url(https://imgcdn.myt.mu/revolution/home/f1-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-f1:hover{
	cursor:pointer;
}

.btn-tennis{
	background-image: url(https://imgcdn.myt.mu/revolution/home/tennis-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-tennis:hover{
	cursor:pointer;
}

.btn-cricket{
	background-image: url(https://imgcdn.myt.mu/revolution/home/cricket-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-cricket:hover{
	cursor:pointer;
}

.btn-golf{
	background-image: url(https://imgcdn.myt.mu/revolution/home/golf-bg.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-golf:hover{
	cursor:pointer;
}

.btn-cycling{
	background-image: url(https://imgcdn.myt.mu/revolution/home/cycline.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-cycling:hover{
	cursor:pointer;
}

.btn-others{
	background-image: url(https://imgcdn.myt.mu/revolution/home/othersport.png);
	background-position: center;
	background-size: cover;
	filter: grayscale(1.0);
	opacity: 0.8;

}

.btn-others:hover{
	cursor:pointer;
}

.g-brd-custom{
	border-right: 1px white;
}

.titlesports {
	font-size: 14px;
  border: none;
  font-weight: 500;
	}

.btn-custom{
	height:40px;
}

.active-sport{
	color:#fff !important;
	font-size:16px!important;
	font-weight:800!important;
	opacity: 1 !important;
	filter: grayscale(0.0) !important;
	-webkit-box-shadow: 0px 21px 26px -11px rgba(0,0,0,0.54);
	-moz-box-shadow: 0px 21px 26px -11px rgba(0,0,0,0.54);
	box-shadow: 0px 16px 16px -7px rgb(161 0 68 / 95%);


}

.uppercase{
	text-transform: uppercase;
}

.g-bg-custombg{
	background-color:#696969!important;
}

.g-color-pink{
	color:#e81c62;
}

/*intro section*/

/* ==========================================================================
   PAGE LAYER — 18-25 Data Pack banner
   --------------------------------------------------------------------------
   Colours, type, radii, buttons and header come from ds.css. This block builds
   only the banner shell the DS has no component for. Every value is a DS token.

   Both image paths live on the markup, not in this stylesheet:
     desktop -> style="--hero-art:url('...')" on <section class="databanner">
     mobile  -> src="..." on <img class="databanner__art">
   so a template can swap them without touching CSS.

   DESKTOP (>760px)
     The desktop file (1850x850) is a full-bleed background on the section; the
     blue panel is held inside the DS container so it lines up with the header.

   MOBILE (<=760px)
     The background is switched off and the mobile file (1024x850) renders as a
     real <img> AFTER the panel in the document. Order is therefore document
     order, not padding arithmetic — panel first, photo second, guaranteed, with
     no overlap to tune and nothing cropped.
   ========================================================================== */

body{ background: var(--od-white); }

/* Shared container geometry — header and banner content sit on one left edge. */
.wrap{ max-width: var(--container); margin: 0 auto; padding: 0 20px; }

.page-head{ padding-top: 20px; }

/* ---------- Banner ---------- */
.databanner{
  /*background-color: var(--od-black); */
  background-image: var(--hero-art);   /* path is set on the section tag */
	background-repeat: no-repeat;
	background-position: center left;
	background-size: 110%;
	margin-top: 72px;
	padding-bottom: 30px;
}

.databanner__inner{
  display: flex;
  align-items: center;
  min-height: clamp(480px, 42vw, 640px);
}

/* Mobile-only art. Hidden on desktop, where the photo is the section
   background instead. */
.databanner__art{ display: none; }

/* Diagonal-cut panel: square on one diagonal, --r-xl on the other. */
.databanner__panel{
  background: var(--myt-blue);
  color: var(--od-white);
  border-radius: 0 var(--r-xl) 0 var(--r-xl);
  padding: clamp(36px, 3.4vw, 56px) clamp(30px, 3vw, 52px);
  /*width: min(52%, 580px); */
}

.databanner__panel h1{
  color: var(--myt-aqua);
  font-weight: var(--fw-bold);
  margin: 0 0 30px;
}

.databanner__q{
  font-size: var(--fs-h5);
  line-height: var(--lh-heading);
  color: var(--od-white);
  margin: 0 0 22px;
}

.databanner__r{
  font-size: var(--fs-h3);
  line-height: var(--lh-heading);
  color: var(--od-white);
  margin: 0 0 22px;
}

.databanner__body{
  font-size: var(--fs-bodysmall);
  line-height: var(--lh-body);
  color: rgba(255,255,255,.9);
  margin: 0 0 30px;
  /*max-width: 36ch;*/
}

.databanner .btn-dark{ font-weight: var(--fw-semibold); }
.databanner .btn-dark:hover{ background: var(--od-white); color: var(--od-black); }

/* ---------- Tablet + Mobile (stacked layout) ---------- */
@media (max-width: 1100px){
  :root .p-6{ padding: 1.9rem !important; }
  .wrap{ padding: 0 12px; }
  .page-head{ padding-top: 12px; }

  .databanner{
    background-image: none;             /* photo-as-bg off */
    background-color: var(--od-white);
    margin-top: 104px;
    padding-bottom: 0;                  /* kill extra space below image */
  }

  .databanner__inner{
    display: block;
    min-height: 0;
  }

  .databanner__panel{
    width: auto;                        /* full width */
    border-radius: 0 var(--r-sm) 0 var(--r-sm);
    padding: 32px 24px;
  }

  .databanner__panel h1{ margin-bottom: 24px; }
  .databanner__q{ margin-bottom: 18px; }
  .databanner .btn{ width: 100%; justify-content: center; }

  /* Photo, full-bleed, directly beneath the panel */
  .databanner__art{
    display: block;
    width: 100%;
    height: auto;
    border-radius: 90px;
    padding: 30px 30px 0 30px;          /* no bottom padding */
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 760px){
  :root .p-6{ padding: 1.9rem !important; }

  .wrap{ padding: 0 12px; }
  .page-head{ padding-top: 12px; }

  .databanner{
    background-image: none;             /* desktop art off */
    background-color: var(--od-white);
    margin-top: 104px!important;
  }

  .databanner__inner{
    display: block;
    min-height: 0;
  }

  .databanner__panel{
    width: auto;
    border-radius: 0 var(--r-sm) 0 var(--r-sm);
    padding: 32px 24px;
  }
  .databanner__panel h1{ margin-bottom: 24px; }
  .databanner__q{ margin-bottom: 18px; }
  .databanner .btn{ width: 100%; justify-content: center; }

  /* Photo, full-bleed, directly beneath the panel. */
	.databanner__art {
	        display: block;
	        width: 100%;
	        height: auto;
	        /* margin-top: 18px; */
	        border-radius: 50px;
	        padding: 30px;
	    }
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ transition-duration: .001ms !important; }
}

.prodfeat { background: none !important;}

/*toggle*/
#toggleoffers #toggleBlock .toggle-panels .toggle-panel {
  display: block;
  width: 100%;
}

#toggleoffers #toggleBlock .toggle-panels .toggle-panel.is-hidden {
  display: none;
}

#toggleoffers #toggleBlock .toggle-panels .toggle-panel #faqAccordion,
#toggleoffers #toggleBlock .toggle-panels .toggle-panel #faqAccordion2 {
  display: block;
  width: 100%;
  float: none;
}

#toggleoffers #toggleBlock .toggle-panels .toggle-panel .mt-4 {
  display: block;
  width: 100%;
  float: none;
  clear: both;
}

/*promo patch*/
/* ==========================================================================
   PROMO PATCH
   --------------------------------------------------------------------------
   Shown only while a promo is live. Built on the DS .sticker language — the
   notched corner (one square, three rounded) is already the myt shape for
   "an offer sits here", so the patch reads as family rather than as a new
   idea. All values are DS tokens.

   Anatomy
     .promo-patch                block, sits above the card title
     .promo-patch--inline        compact, sits above the button
     .promo-patch__dot           pulsing live indicator (optional)
     .promo-patch__label         micro eyebrow, e.g. "Promo"
     .promo-patch__value         the offer itself
     .promo-patch__until         end date, rendered BELOW the patch

   Colourways — all contrast-checked against their own text colour:
     --deal   amber  + ink    8.8:1   default; reads as an offer
     --brand  blue   + white  7.7:1   when the promo is a myt-wide campaign
     --bold   ink    + white 17.7:1   quietest, highest contrast
     --soft   mint   + ink   15.6:1   for a second promo on the same screen

   Deliberately NOT offered: coral + white. The DS uses that pair on
   .badge--most, but it measures 3.4:1, which fails AA for text this size.
   ========================================================================== */

.promo-patch{
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 16px 9px 13px;
  border-radius: 0 var(--r-sm) var(--r-sm) var(--r-sm);
  background: #e65078;
  color: #fff;
  font-size: 13.5px;
  font-weight: var(--fw-bold);
  line-height: 1.15;
  letter-spacing: -.01em;
  position: relative;
  overflow: hidden;
  max-width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
}

/* Slow shine sweep. Subtle enough to register as "live" without pulling
   attention away from the card's own CTA. */
.promo-patch::after{
  content: "";
  position: absolute;
  inset: 0 auto 0 -40%;
  width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
  animation: patch-shine 4.5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes patch-shine{
  0%, 62%  { transform: translateX(0); }
  100%     { transform: translateX(350%); }
}

.promo-patch__dot{
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
  position: relative;
}
.promo-patch__dot::before{
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  opacity: 0;
  animation: patch-pulse 2.4s ease-out infinite;
}
@keyframes patch-pulse{
  0%   { transform: scale(.6); opacity: .7; }
  70%  { transform: scale(1.5); opacity: 0; }
  100% { opacity: 0; }
}

.promo-patch__label{
  font-size: 13.5px;
  font-weight: var(--fw-extrabold);
  letter-spacing: .13em;
  text-transform: uppercase;
  opacity: .72;
  flex-shrink: 0;
}

.promo-patch__value{ font-weight: var(--fw-medium); }
.promo-patch__value small{
  font-size: 11.5px;
  font-weight: var(--fw-semibold);
  opacity: .78;
  margin-left: 1px;
}
/* Struck-through "was" price, for price-type promos */
.promo-patch__was{
  font-weight: var(--fw-medium);
  opacity: .6;
  text-decoration: line-through;
  margin-left: 2px;
}

/* End date — sits under the patch, never inside it. Keeping it out means the
   patch stays one line at any card width. */
.promo-patch__until{
  display: block;
  margin-top: 8px;
  font-size: 12px;
  font-weight: var(--fw-medium);
  color: var(--od-grey-600);
}
.promo-patch__until .material-symbols-rounded{
  font-size: 15px;
  vertical-align: -3px;
  margin-right: 3px;
}

/* ---------- Colourways ---------- */
.promo-patch--brand{ background: var(--myt-blue);  color: var(--od-white); }
.promo-patch--bold { background: var(--od-ink);    color: var(--od-white); }
.promo-patch--soft { background: var(--myt-mint);  color: var(--od-ink); }

/* ---------- Inline variant: above the button ----------
   Full width of the card, left accent bar, no shine. Louder placement so it
   gets quieter treatment. */
.promo-patch--inline{
  display: flex;
  width: 100%;
  gap: 10px;
  align-items: center;
  border-radius: var(--r-sm);
  background: var(--od-white);
  color: var(--od-ink);
  box-shadow: inset 4px 0 0 var(--myt-amber);
  padding: 12px 16px 12px 18px;
  font-size: 13.5px;
}
.promo-patch--inline::after{ content: none; }
.promo-patch--inline.promo-patch--brand{ box-shadow: inset 4px 0 0 var(--myt-blue); background: var(--od-white); color: var(--od-ink); }
.promo-patch--inline.promo-patch--bold { box-shadow: inset 4px 0 0 var(--od-ink);   background: var(--od-white); color: var(--od-ink); }
.promo-patch--inline .promo-patch__label{ opacity: .6; }

@media (prefers-reduced-motion: reduce){
  .promo-patch::after,
  .promo-patch__dot::before{ animation: none; }
  .promo-patch::after{ opacity: 0; }
}

/*tab*/
.dstv-football-bg {
    border-radius: 50px;
    padding: 60px;
    background-image: url(https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/bg-football04.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;	
}

@media (max-width: 768px) {
    .dstv-football-bg {
        background-position: unset;
    }
}
.dstv-sport-bg {
    border-radius: 50px;
    padding: 60px;
    background-image: url('https://imgcdn.myt.mu/revolution/internet-and-tv/dstv/other-sports-backgroundv12.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

@media (max-width: 768px) {
    .dstv-sport-bg {
        background-position: unset;
    }
}



@media (min-width: 1400px) {
	.container1420{
		max-width:1420px;
	}	
}


/*MODALS*/
.compare-table{
  --cmp-border:#e6e8ee;
  border-collapse:separate;          /* required for sticky cells */
  border-spacing:0;
  min-width:540px;                   /* forces horizontal scroll on small screens */
}
.compare-table th,
.compare-table td{
  padding:14px 12px;
  border-bottom:1px solid var(--cmp-border);
  vertical-align:middle;
  background:#fff;                   /* opaque so frozen cells cover scrolled content */
}
/* feature column: frozen to the left while packages scroll horizontally */
.compare-table .compare-feat{
  text-align:left;
  position:sticky;
  left:0;
  z-index:2;
  min-width:160px;
}
/* package header row: frozen to the top while rows scroll vertically */
.compare-table thead th{position:sticky;top:0;z-index:3;}
.compare-table thead .compare-feat{z-index:4;}   /* top-left corner above both */

.cmp-ico{width:20px;height:20px;vertical-align:middle;}
.cmp-no{color:#c4c8d2;}             /* muted — feature not included */

@media (max-width:575.98px){
  .compare-table th,
  .compare-table td{padding:12px 8px;font-size:14px;}
  .compare-table .compare-feat{min-width:132px;}
}

/*START MODALS*/
/* ---- myt modal theme (self-contained) ---- */
.mytm-modal{position:relative;font-family:'Poppins',system-ui,-apple-system,Segoe UI,sans-serif;color:#14151b;text-align:left;padding:28px;width:92%;max-width:1000px;margin:0 auto;background:#fff;border-radius:28px;overflow-y:auto;overflow-x:hidden}
.mytm-close{position:absolute;right:18px;top:18px;width:44px;height:44px;border:none;border-radius:50px;background:#14151b;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 20px rgba(20,21,27,.18);z-index:20;transition:transform .15s,background .15s,color .15s}
.mytm-close:hover{background:#153ED9;color:#fff;transform:translateY(-2px)}
.mytm-close svg{width:20px;height:20px}
.mytm-container{max-width:1100px;margin:0 auto}
.mytm-head{text-align:center;padding-bottom:24px}
.mytm-title{font-size:clamp(22px,3vw,30px);font-weight:600;letter-spacing:-.5px;line-height:1.15;margin:0 0 6px;color:#14151b}
.mytm-price{font-size:20px;font-weight:600;margin:0;color:#153ED9}
.mytm-price span{font-size:14px;font-weight:500;color:#5b6573}

/* channel grid */
.mytm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:992px){.mytm-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.mytm-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.mytm-grid{grid-template-columns:1fr}}
.mytm-chan{display:flex;align-items:stretch;border:1px solid #E3E7F0;border-radius:14px;overflow:hidden;background:#fff;transition:box-shadow .15s,transform .15s}
.mytm-chan:hover{box-shadow:0 8px 24px rgba(21,62,217,.12);transform:translateY(-2px)}
.mytm-chan__logo{position:relative;flex:0 0 84px;width:84px;padding:12px;border-right:1px solid #E3E7F0;background:#fff;display:grid;place-items:center}
.mytm-chan__logo img{max-width:100%;height:auto;display:block}
.mytm-chan__info{padding:10px 14px;min-width:0;display:flex;flex-direction:column;justify-content:center}
.mytm-chan__name{font-size:14px;font-weight:600;margin:0;color:#14151b;line-height:1.25}
.mytm-chan__num{font-size:13px;font-weight:400;margin:2px 0 0;color:#5b6573}

/* hover tooltip with channel description */
.mytm-chan__logo .tooltiptext{visibility:hidden;opacity:0;position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);width:300px;background:#14151b;color:#fff;padding:14px 16px;border-radius:12px;font-size:13px;line-height:1.5;z-index:30;box-shadow:0 12px 32px rgba(0,0,0,.28);transition:opacity .18s;pointer-events:none}
.mytm-chan__logo .tooltiptext .tt-title{display:block;font-weight:700;font-size:15px;margin-bottom:6px}
.mytm-chan__logo:hover .tooltiptext{visibility:visible;opacity:1}

/* footer + buttons */
.mytm-foot{text-align:center;padding-top:26px}
.mytm-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:15px;font-weight:600;line-height:1;padding:13px 26px;border-radius:999px;border:1.5px solid #14151b;cursor:pointer;text-decoration:none;transition:.18s}
.mytm-btn--outline{background:transparent;color:#14151b}
.mytm-btn--outline:hover{background:#14151b;color:#fff;transform:translateY(-2px)}
.mytm-btn--solid{background:#14151b;color:#fff}
.mytm-btn--solid:hover{background:#153ED9;border-color:#153ED9;color:#fff;transform:translateY(-2px)}
.mytm-btn--inline{padding:8px 18px;font-size:14px}

/* subscribe-now copy */
.mytm-method{font-size:clamp(18px,2.4vw,22px);font-weight:700;margin:0 0 6px}
.mytm-method+.mytm-p{margin-top:0}
.mytm-accent{font-weight:500;color:#153ED9}
.mytm-p{font-size:clamp(15px,2vw,18px);font-weight:500;line-height:1.6;color:#14151b;margin:0 0 14px}
.mytm-steps{font-size:clamp(15px,2vw,18px);font-weight:500;line-height:1.8;color:#14151b;padding-left:22px;margin:0 0 22px}
.mytm-steps b{font-weight:700}
.mytm-empty{font-size:20px;font-weight:600;color:#14151b;text-align:center;width:100%}

/*END MODALS*/
