@*For mobile screens*@ @@media screen and (max-width: 767px) and (min-width: 320px){ .showOnMobile{ display: block !important;} .showOnDesktop{ display: none !important;} } @*For Desktop*@ @@media screen and (min-width: 768px) { .showOnMobile{ display: none !important;} .showOnDesktop{ display: block !important;} } /************************* inline code combine from headerbar navigation page by Neha *******************************/ .menu-elementsDiv {border-bottom: 0.1px solid gray;padding-bottom: 20px;padding-top: 20px;text-align: left;} .sub-elementsDiv{text-align: left;font-size: 20px;font-weight:300;} .sub-elementsDiv a{color:white!important;text-align: left;font-size: 20px;font-weight:300;} .search-new{position: absolute;z-index: 99;margin-left: 50%;z-index: 9999;border: 1px solid white;border-radius: 25px;width: 35px;height: 35px;padding: 5px;margin-top: 100px;} .textWhite{color:white!important;} .package-list .icon-pack {font-size:28px;} .has-dropdown li.fix-error-menu.lvl-2 { display: none; } fieldset.Select-your-city-field:before { content: "\e92f"; font-family: 'DStvAfrica' !important; font-size: 24px; width: 50px; height: 58px; left: 0; position: absolute; vertical-align: middle; display: table-cell; line-height: 58px; padding-left: 16px; color: #888888; } .form-group #Select-City.form-control { font-size: 16px; line-height: normal; font-weight: 400; border: none; } .Select-your-city-field .jcf-select.jcf-focus .jcf-select-opener:after{ color:#fff!important; } .Select-your-city-field .jcf-select { border-width: initial; border-style: none; border-color: initial; border-image: initial; } .Select-your-city-field .jcf-select.jcf-focus{ color:#fff!important; box-shadow:none; } .Select-your-city-field .jcf-select .jcf-select-opener::after { font-size: 15px; line-height: 10px; position: absolute; top: 24px; right: 30px; content: ""; color: rgb(255, 255, 255); } .Select-your-city-field .jcf-select.jcf-focus .jcf-select-text { color:#fff!important; } .Select-your-city-field .jcf-select .jcf-select-text { text-overflow: ellipsis; white-space: nowrap; cursor: default; display: block; font-size: 16px; line-height: 26px; font-weight: 400; color: rgb(255, 255, 255)!important; text-transform: unset; overflow: hidden; margin: 14px 0px 0px 58px; text-align: left; } .Select-your-city-field .jcf-select-drop .jcf-hover, .Select-your-city-field .jcf-select-drop .jcf-option:hover{ color:black; background: #94d4f6!important ; text-transform: initial; font-size: 14px; font-weight:400; } .Select-your-city-field .jcf-list .jcf-option { color: black; background: #fff; text-transform: initial; font-size: 14px; font-weight: 400; } .Select-your-city-field .jcf-list ul li { border-bottom: none; } .Select-your-city-field .jcf-select-drop .jcf-select-drop-content:after { border-bottom: 6px solid #fff; top: 9px; right: 32px; content: ""; } .Select-your-city-field .jcf-select-drop-content { margin-top: 15px; } .dashboardModal .Select-your-city-field .jcf-select .jcf-select-opener:after { color: #fff !important; } .Select-your-city-field .jcf-select-drop .jcf-list span.jcf-list-content { max-height: 300px!important; } .Select-your-city-field .jcf-select.jcf-unselectable.jcf-select-form-control.jcf-select-input-lg.jcf-focus{ color:#fff; } #formLoginDiv .Select-your-city-field .jcf-select { border: none; width: 100%; } .Select-your-city-field .jcf-select-drop .jcf-select-drop-content:after { border-bottom: 6px solid #fff; top: 9px; right: 32px; content: ""; } @media only screen and (max-width: 350px) { .Select-your-city-field .jcf-select-drop .jcf-list span.jcf-list-content { max-height: 220px!important; }} @media only screen and (max-width: 667px) { .Select-your-city-field .jcf-select .jcf-select-text { text-overflow: ellipsis; width: 170px; } .Select-your-city-field .jcf-select-drop .jcf-option:hover, .Select-your-city-field .jcf-select-drop .jcf-option:focus, .Select-your-city-field .jcf-select-drop .jcf-hover { background: #fff!important; } #formLoginDiv .Select-your-city-field .jcf-list { background: #fff!important; } } /*Login popup chnages*/ .login-popup > li > a:hover, .login-popup .open > a:hover, .login-popup .open > a {background-color: transparent !important;} .login-popup .open > .dropdown-menu {margin: 0px !important;overflow-y: auto !important;height: auto !important;} .login-Popup-text {color: white !important;font-size: 13px;font-weight: 600;} .login-anchor {padding: 0px 0px !important;} .countrymessageModalDiplay {display: block !important;text-align: center;background: rgba(0,0,0,.5);} .countrymessageModalDiplay .modal-dialog{top: 39%;} /*end*/ .article-landing {/*display: grid;*/ /*grid-gap: 5px;*/ /*grid-template-columns: repeat(auto-fit, 100px);*/ /*grid-template-rows: repeat(2, 100px);*/} .route-page-fix-errors .list-info {float:none;} .article-landing .search-bar.general-page-head.overlay.fadeIn {display: none;} .article-landing .bg-holder .card {height: auto;width: 40%;margin-top: 0px;z-index: 3;color: #fff !important;position: relative;padding-top: 20px;} @media only screen and (max-width: 2800px) and (min-width: 1400px) { .route-page-home .package-section.bg-white .heading-area {padding: 10vw 0 !important;padding-top: 0 !important;} } @media only screen and (min-width: 768px) { .article-landing section.discover-section.bg-white .col-md-12 {position: relative;left: 10px;} .slide .banner-content.left h5, .slide .banner-content.left h4, .slide .banner-content.left h3, .slide .banner-content.left h2, .slide .banner-content.left h1, .slide .banner-content.left p {max-width: 75% !important;white-space: pre-wrap !important;} } @media only screen and (min-width: 768px) and (max-width: 968px) { .article-landing .article-image.col-md-6 {margin-top: -0px !important;width: 681px !important;margin-left: 45px !important;z-index: 1;} .article-body .article-container.col-md-12 {width: 660px !important;padding-right: 32px !important;padding-bottom: 75px !important;padding-left: 32px !important;} .article-landing h5.url-text-right {padding-top: 5px !important;padding-left: 173px !important;} .article-landing section.discover-section.bg-white {padding-left: 0px !important;} .article-landing section.discover-section.bg-white .heading-area h2 {margin: 0px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 143px !important;} } .article-landing .card .card-header {/*background: linear-gradient(to right, #eeeeee 0%, #eeeeee 40%,#cccccc 100%);*/background: rgb(80,80,80);background: -moz-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: -webkit-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);height: 170px;border-top-left-radius: 10px;border-top-right-radius: 10px;padding: 36px;} .article-landing .article-image.col-md-6 {margin-top: 340px;/* margin-bottom: -97px; */} .article-landing .card .card-footer.text-muted {/*background: linear-gradient(to right, #eeeeee 0%, #eeeeee 40%,#cccccc 100%);*/background: rgb(80,80,80);background: -moz-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: -webkit-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);height: 53px;border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;color: #fff;padding: 15px;} .article-landing .article-image.col-md-6 img {border-radius: 10px;-webkit-box-shadow: -1px 10px 5px -4px rgba(0,0,0,0.21);-moz-box-shadow: -1px 10px 5px -4px rgba(0,0,0,0.21);box-shadow: -1px 10px 5px -4px rgba(0,0,0,0.21);height: 4340%;width: 107%;} .article-landing .article-image.col-md-6 {margin-top: 207px;width: 804px;margin-left: -70px;z-index: 1;} .article-image.col-md-6.no-card {margin-top: 163px;width: 985px;margin-left: 51px;z-index: 1;} .article-landing .card .card-header h2 {font-size: 35px;line-height: 32px;font-weight: lighter;color: #fff;} .article-landing .card .card-body {background: rgba(8,11,14,1);/*background: rgb(80,80,80);*/ /*background: -moz-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);*/ /*background: -webkit-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);*/ /*background: linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);*//*background-image: linear-gradient(to right, #82695f, #796157, #8c6e5f, #826556, #7d6353);*/height: 300px;padding: 33px;} .article-landing img.inline-block.img-responsive {border-radius: 10px;} .article-landing .banner-card {position: absolute;width: 1767px;z-index: 0;border-radius: 10px;margin-left: 523px;} .article-landing .bg-hold {/* background-image: url(/media/3955/banner-blur-3x.jpg) !important; */} /*section.pt48.article-header {*/ /* background: url("/media/3955/banner-blur-3x.jpg") !important;*/ /*}*/ .article-body .article-container.col-md-12 {margin-top: -402px;margin-left: 47px;background-color: #f3f3f3 !important;-webkit-box-shadow: 0px 13px 60px 0px rgba(0,0,0,0.34);-moz-box-shadow: 0px 13px 60px 0px rgba(0,0,0,0.34);box-shadow: 0px 13px 60px 0px rgba(0,0,0,0.34);border-radius: 10px;width: 1026px;padding-right: 75px;padding-bottom: 75px;padding-left: 75px;} .article-body .article-container.col-md-12 .post-title {margin-top: 70px;} .article-landing button.btn.btn-primary {color: #fff;background-color: #0095da;border-color: #fff;border-radius: 30px;margin-bottom: 50px;margin-left: 50px;} .article-landing .col-md-6 .pull-right, .article-landing .col-md-6 .pull-left {font-size: 50px;width: 49px;margin-top: -9px;} .article-landing .col-md-6 .url-text-right a, .article-landing .col-md-6 .url-text-left a{color: #0B1278;padding-right: 10px;} .article-landing .col-md-6 .pull-left img {-ms-transform: rotate(180deg);-webkit-transform: rotate(180deg);transform: rotate(180deg);} .article-landing h5.url-text-right {padding-top: 5px;text-align: right;padding-left: 50px;} .article-landing .col-md-6 .pull-left {margin-right: 10px;} .article-landing .col-md-6 .url-text-left {padding: 5px;margin-left: 13px;} .article-landing .row.article-footer {width: 100%;border-top: 1px solid;padding-top: 25px;margin-bottom: -85px; margin-left: 0px;} .article-landing section.discover-section.bg-white {background-color: #b2bdc3 !important;/*background-image: linear-gradient(to right, #a1b5bf, #a2b6bf, #a2b7c0, #a3b7c0, #a4b8c0);*/height: 750px;padding-left: 263px;} .article-landing section.spotlight-section.bg-white {background-color: #fff !important;} .article-landing section.discover-section.bg-white .card.img-holder {margin-top: -30px;float: left;right: -30px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-top: 0px; margin-left: 0px; color: black !important;background-color: white;height: auto;width: 60%;padding-top: 4px;padding-right: 14px;padding-bottom: 11px;padding-left: 0px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold {margin-top: 0px;margin-left: 12px;color: black !important;background-color: white;/* height: auto; */height: 286px;padding: 25px;float: left;z-index: 2;width: 60%;} .article-landing section.discover-section.bg-white .card.img-holder img { margin-top: 0px;margin-left: 0px;height: 213px;width: 100%;border-radius: 10px;left: 63px;} .article-landing section.discover-section.bg-white .btn-holder {border-top: 1px solid;padding-top: 16px;width: 296px;padding-right: 22px;padding-bottom: 22px;padding-left: 70px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.img-holder img {margin-top: 26px;height: 213px;width: 100%;border-radius: 10px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .body-wrap {height:auto;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .body-wrap {height: auto;width: 100%;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .head-area span.genre {font-size: 19px;border: 1px solid;margin-left: 15px;padding: 18px;text-align: right;border-color: transparent;border-radius: 0px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .head-area span.genre {font-size: 19px;border: 1px solid;text-align: right;border-color: transparent;border-radius: 0px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .head-area {text-align: start !important;margin-left: -4px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .head-area {text-align: end !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .head-area {padding-top: 20px;} .article-landing section.discover-section.bg-white .low-area {margin-top: 421px;left: 150px;} .article-landing section.discover-section.bg-white .container {width: 100%;} .article-landing section.discover-section.bg-white .col-md-12.low-area .container {float: right;margin-right: 250px;} .article-landing section.discover-section.bg-white .heading-area h2 {margin: 0px 0 0 0px;text-transform: uppercase;float: left;font-size: 55px;line-height: 40px;font-weight: 100 !important;letter-spacing:.75px;color: #fff;padding: 0 8px;} .article-landing section.discover-section.bg-white .btn-holder a.btn-desc.fill.track_showbutton {margin-left: 96px;} .article-body .article-container.col-md-12.no-card {margin-top: -14em;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold p {text-align: right;font-size: 13px !important;padding-left: 30px;margin-right: -13px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold p {font-size: 13px !important;padding-right: 30px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold a.btn-desc.fill.track_showbutton {margin-left: -71px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .head-area h2 {border: 1px solid;margin-left: 16px;padding-right: 14px;padding-left: 14px;text-align: right;border-color: transparent;border-radius: 0px;} .article-landing .card .card-body p.card-text {color: #fff;} @media only screen and (max-width: 767px) { .article-landing section.discover-section.bg-white .low-area {margin-top: 75px;left: -20px;} .article-landing .article-image.col-md-6 {top: -208px;margin-left: 0px !important;width: 360px !important;height: 1%;position: absolute;z-index: 1 !important;} .article-landing .card .card-header {height: 193px !important;} .news-landing .banner-content .card .card-header, .article-landing .card .card-header {height: 228px !important;background-color: transparent !important;background: transparent !important;} .news-landing .banner-content .card .card-header h2 {font-size: 35px;line-height: 32px;color: #fff;position: absolute;text-align: left;bottom: 365px;} .article-landing .card .card-header h2 {font-size: 35px;line-height: 32px;color: #fff;position: absolute;text-align: left;bottom: 343px;} .article-body .article-container.col-md-12 {margin-top: -150px;margin-left: 0px;width: 100%;padding-right: 30px !important;padding-bottom: 75px;padding-left: 30px !important;} .article-body .article-container.col-md-12 .post-title h1.inline-block {padding-top: 38px;} .article-landing .card {margin-top: 51px;} .article-landing section.discover-section.bg-white .heading-area h2 {margin: -12px 0px 0px -278px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side {margin-top: 29px !important;margin-left: -507%;} .article-landing section.discover-section.bg-white .card.img-holder {margin-top: 160px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder img {height: 227px;width: 350px;margin-top: -136px;margin-left: 135px;border-radius: 10px 10px 0px 0px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .head-area h2 {margin-bottom: 6px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {padding-top: 115px;padding-right: 14px;padding-bottom: 16px;padding-left: 25px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.img-holder img { height: 227px;width: 350px;margin-top: -136px;margin-left: 134px !important;border-radius: 10px 10px 0px 0px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .head-area h2 {margin-bottom: 6px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold {padding-top: 145px;padding-right: 14px;padding-bottom: 16px;padding-left: 25px;margin-top: -600px;margin-left: 134px;width: 350px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .body-wrap {height: 85%;width: 104%;text-align: left;} .article-landing section.discover-section.bg-white .btn-holder {border-top: 1px solid;padding-top: 11px;text-align: right;width: 296px;padding-bottom: 50px;padding-left: 70px;} .article-landing section.discover-section.bg-white .col-md-12.low-area .container {float: right;margin-right: -20px;margin-top: -47px;} .article-landing section.discover-section.bg-white .col-md-12.low-area .container .arrow-btn-watch { /* margin-right: 23% !important; */ margin-right: 14% !important;} .article-landing .card {width: 100%;} .news-landing .banner-card {-webkit-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0) !important;-moz-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0) !important;box-shadow: 1px 1px 4px 0.2px rgba(219, 219, 219, 0) !important;position: absolute;height: 274px !important;width: 321px !important;z-index: 1;border-radius: 10px;margin-top: -648px !important;margin-left: 20px !important;} .news-landing .banner-content .card .card-body {background: rgba(8,11,14,1);/* background-image: linear-gradient(to right, #87746d, #897269, #8b7164, #8c6f60, #8d6e5b); */height: 269px !important;padding: 33px;} .news-landing ul.slick-dots {top: 83%;left: 31%;} } @media only screen and (max-width: 320px) { .article-landing .article-image.col-md-6 img {width: 100% !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder img {width: 100% !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder .channel-logo-discover img {width: auto !important;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {width: 289px !important;} .article-landing section.discover-section.bg-white .btn-holder a.btn-desc.fill.track_showbutton {margin-left: 40px;} .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 149px;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side {left: 0px;} .article-landing section.discover-section.bg-white .btn-holder {border-top: 1px solid;padding-top: 11px;text-align: right;width: 234px;padding-bottom: 50px;padding-left: 70px;} .article-landing section.discover-section.bg-white .btn-holder a.btn-desc.fill.track_showbutton {margin-left: 0px !important;} .article-landing section.discover-section.bg-white .card.img-holder {margin-top: 160px !important;width: 100% !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold {padding-top: 136px;padding-right: 14px;padding-bottom: 16px;padding-left: 25px;margin-top: -600px;margin-left: 134px;width: 289px;} .news-landing .banner-card {-webkit-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0) !important;-moz-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0) !important;box-shadow: 1px 1px 4px 0.2px rgba(219, 219, 219, 0) !important;position: absolute;height: 250px !important;width: 283px !important;z-index: 1;border-radius: 10px;margin-top: -622px !important;margin-left: 20px !important;} .news-landing .banner-content .card {width: 284px !important;} .news-landing .banner-content .card .card-body {background: rgba(8,11,14,1);/* background-image: linear-gradient(to right, #87746d, #897269, #8b7164, #8c6f60, #8d6e5b); */height: 202px !important;padding: 33px;} .news-landing ul.slick-dots {top: 89%;left: 1%;} .news-landing a.next.nextbounce.animatedbounce {margin-top: -10px;position: inherit;} /*.article-landing section.discover-section.bg-white {height: 1173px !important;} .article-landing section.discover-section.bg-white .col-md-12.low-area .container {float: right;margin-right: 151px;margin-top: -374px;}*/ } @media only screen and (max-width: 374px) and (min-width: 321px) { .article-landing .article-image.col-md-6 img {width: 100% !important;} .article-landing .article-image.col-md-6 {width: 346px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.img-holder img, .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder img, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold { margin-left: 0px !important;} .news-landing .banner-content .card .card-header, .article-landing .card .card-header {height: 190px !important;background-color: transparent !important;background: transparent !important;} .news-landing .banner-content .card .card-body {background: rgba(8,11,14,1);/* background-image: linear-gradient(to right, #87746d, #897269, #8b7164, #8c6f60, #8d6e5b); */height: 225px !important;padding: 33px;} .news-landing .banner-content .card .card-header h2 {font-size: 35px;line-height: 32px;color: #fff;position: absolute;text-align: left;bottom: 415px;} .news-landing ul.slick-dots {top: 92%;left: 36%;} .news-landing a.next.nextbounce.animatedbounce {margin-top: -4px !important;position: inherit;} .news-landing .banner-content .card {width: 322px !important;margin-left: -2px !important;} .news-landing .banner-card {margin-left: 14px !important;} } @media only screen and (max-width: 399px) and (min-width: 375px) { .article-landing .article-image.col-md-6 img {width: 100% !important;} .article-landing .article-image.col-md-6 {width: 360px !important;} .news-landing .banner-content .card {height: 613px;width: 322px !important;margin-left: 4px;margin-top: 127px !important;z-index: 3;color: #fff !important;} .news-landing ul.slick-dots {top: 92%;left: 36%;} .news-landing a.next.nextbounce.animatedbounce {margin-top: -4px !important;position: inherit;margin-left: -18% !important;} .news-landing .banner-content .card .card-body {height: 215px !important;} } @media only screen and (max-width: 668px) and (min-width: 400px) { .article-landing .article-image.col-md-6 { width: 399px !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 349px !important;} .article-landing section.discover-section.bg-white .card.img-holder {margin-left: 105px !important;} body.article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder img { height: auto;} } @media only screen and (max-width: 668px) and (min-width: 413px){ .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 0px !important;} .news-landing .banner-card {width: 365px !important;} .news-landing .banner-content .card {width: 366px !important;margin-top: 122px !important;} .news-landing ul.slick-dots {top: 92%;left: 36%;} .news-landing a.next.nextbounce.animatedbounce {margin-top: -4px !important;position: inherit;} .news-landing .banner-content .card {margin-left: 2px !important;} .news-landing .banner-card {margin-left: 18px !important;} } @media only screen and (max-width: 412px) and (min-width: 400px) { .article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 0px !important;} .news-landing .banner-card {width: 365px !important;} .news-landing .banner-content .card {width: 366px !important;margin-top: 122px !important;} .news-landing ul.slick-dots {top: 92%;left: 36%;} .news-landing a.next.nextbounce.animatedbounce {margin-top: -4px !important;position: inherit;} .news-landing .banner-content .card {margin-left: 2px !important;} .news-landing .banner-card {margin-left: 18px !important;} } .manage-section .img-holder:before {box-shadow: -30px -85px 40px rgba(0, 0, 129, 0.04), -20px -85px 40px rgba(0, 0, 129, 0), -20px -85px 40px rgba(0, 0, 0, 0) !important;} @media only screen and (min-width: 992px) and (max-width: 1280px) { .article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {margin-left: 209px;} .article-landing section.discover-section.bg-white .col-md-12 {position: absolute;left: 0px;} .article-landing section.discover-section.bg-white .col-md-12 .col-md-6.col-lt-side {left: 0px;} } /*****************************Article page by neha **********************************/ .article-landing section.discover-section.bg-white .col-rt-side .card.img-holder {right: 30px;width: 40%;} .col-md-6.col-lt-side, .col-md-6.col-rt-side{ width: 50%; display: inline-flex;} .card.article-card.col-md-6.left-card-info {width: 35%;margin-top: 0px;z-index: 4;} .single-new-article .post h1{width: 100%;text-align: center;margin-top: 20px;} .article-body .single-new-article .article-container.col-md-12 {margin-top: 0px;} @media only screen and (min-width: 320px) and (max-width: 667px){ section#popupform {padding-top: 30px;} #popupform .container {overflow: auto;top: 0px;height: 100%;} #cboxContent #cboxLoadedContent {overflow: auto!important;height: auto !important;} } @media only screen and (min-width: 320px) and (max-width: 767px) { .bg-decoder .container .row{margin-left: 15px;margin-right: 15px;} .package-section.bg-decoder .package-slider .desc .btn-view {width: 100%;margin: 0 auto !important;/* margin-left: auto;margin-right: auto;*/float: none;display: block;clear: both;} .card.article-card.col-md-6.left-card-info {width: 100%;} body.article-landing .article-image.col-md-6 {top: 0px;} .article-landing section.pt48.single-new-article.article-body{ top: 0px; margin-left: 20px;margin-right: 20px;} html body.article-landing section.discover-section.bg-white {height: auto; width: 100%;padding-left: 0px;} body.article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold {padding-top: 20px;padding-right: 20px;padding-bottom: 16px;padding-left: 20px;height: auto;z-index: 0;} html body.article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold { margin-left: 0px;} .discover-section .col-md-6.col-lt-side, .col-md-6.col-rt-side {width: 100%;display: inline-block;} body.article-landing section.discover-section.bg-white .card.img-holder {right: 0px; margin-left: 0px !important;padding-top: 0px !important;} .article-landing section.discover-section.bg-white .col-rt-side .card.img-holder {right: 0px;padding: 0px;} body.article-landing .bg-holder .card {height: auto;width: 100%;} body.article-landing section.discover-section.bg-white .col-rt-side .card.img-holder {width: 100%;} #main.new-landing-main-sec .post-snippet .inner-text {height: auto; overflow: auto;} html body.article-landing section.discover-section.bg-white .col-lt-side .btn-holder {width: 100%;float: none;} html body.article-landing section.discover-section.bg-white .col-rt-side .btn-holder {width: 100%;} .article-landing .article-image.col-md-6 img.img-responsive { width: 85% !important;height: auto;display: inline-flex;margin-top: 30px;} .top-news-sec .article-image.col-md-6.no-card {margin-top: 0px;} section.pt48.article-header { padding-top: 90px !important; /*background-image: none !important;*/ } body.article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.img-holder img { padding-bottom: 20px;margin-top: -10px;} .discover-section .col-lt-side .channel-logo-discover {right: 0px;left: 20px;top: -10px;} body.article-landing section.discover-section.bg-white .col-md-6 .card.img-holder .channel-logo-discover img {padding-bottom: 0px;} .card-label-holder .channel-logo-discover{ top: 0px;right: 0px;left: 20px;} .discover-section button.slick-arrow [class^=icon-] {line-height: 66px !important;} .discover-section .card .card-label-holder {float: left;position: relative;} section.text-left.pb-20.pt-0.dark-blue-headers.large-height, section.text-left.pb-9.pt-0.dark-blue-headers.min-height .pb-5, section.text-left.pb-20.pt-0.dark-blue-headers.small-height{padding-bottom: 0px;} section.text-left.pb-20.pt-0.dark-blue-headers .v-align-transform .pb-5, section.text-left.pb-9.pt-0.dark-blue-headers.min-height {padding-bottom: 0px;} .fix-error section {padding-top: 130px;} .fix-error .in-page .form-holder h1 {padding-top: 20px;} .fix-error .in-page .form-holder>p {padding-bottom: 40px;} .fix-error .in-page .form-holder h1, .fix-error .in-page .form-holder>p {margin-left: 0px;} section#contactbusiness {padding-top: 130px;} #wrapper .main-container .banner-block#for-package-landing-page {height: auto !important;} section.acc-adjust-section {min-height: auto;} } .single-new-article .mb64{height: 400px;overflow: hidden;position: relative;} .overlayBottom{position: absolute;bottom: 0px;width: 100%;background: rgba(255,255,255,0.5);height: 55px;background: -moz-linear-gradient(top, rgba(243,243,243,0) 0%, rgb(243, 243, 243) 100%);background: -webkit-linear-gradient(top, rgba(243,243,243,0) 0%,rgba(243,243,243,1) 100%);background: linear-gradient(to bottom, rgba(243,243,243,0) 0%,rgb(243, 243, 243) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00f3f3f3', endColorstr='#f3f3f3',GradientType=0 );padding: 20px 0px 10px;text-align: center;} .fullHeight .overlayBottom{background:transparent;} .single-new-article.article-body .fullHeight{height:auto;} .fullHeight #expandIcon img{-webkit-transform: rotate(180deg); /* Chrome and other webkit browsers */ -moz-transform: rotate(180deg);/* FF */ -o-transform: rotate(180deg); /* Opera */ -ms-transform: rotate(180deg); /* IE9 */ transform: rotate(180deg); /* W3C compliant browsers */ } .fullHeight .overlayBottom {position:relative;} .article-landing .col-md-6 .pull-right{margin-left: 5px;} .new-landing-main-sec {padding-top: 100px;} .news-landing .new-landing-main-sec .img-responsive {height: 225px;} .new-landing-main-sec .post-snippet .inner-text {height: 155px;} body.article-landing section.discover-section.bg-white .col-lt-side .btn-holder {width: 80%;margin: 0px;float: right;margin-right: 5%;} body.article-landing section.discover-section.bg-white .col-rt-side .btn-holder {width: 80%;} .article-image .post-date span {display: block;line-height: 20px;} .article-image .post-date {width: 90px;height: 90px;padding-top: 20px;} .post-date span.pub-txt{font-size: 11px;font-weight: 300;margin: 0 0 5px;line-height: 10px;} .post-date span { line-height: 10px; } @media screen and (max-width: 480px) { .low-area .wrap .arrow-btn-label {margin-right: 35%;} } body.article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.img-holder .channel-logo-discover img{margin-top: 0px;} body.article-landing section.discover-section.bg-white .col-md-6 .card.img-holder .channel-logo-discover img{ width: 40px;height: 40px;margin-top: 0px;} .discover-section .card-label-holder {float: right;} .col-lt-side .channel-logo-discover {right: 0px;left: 20px;top: 20px;} .discover-section .col-lt-side .card-label-holder {float: left;position: relative;} .col-rt-side .channel-logo {top: 20px;right: 6px;} .channel-logo-discover {min-width: 60px;height: 60px;padding: 0px;position: relative;display: flex;display: -ms-flexbox;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding-bottom: 5px;text-align: center;position: absolute;top: 35px;right: 20px;border-top-left-radius: 10px;border-top-right-radius: 10px;border-bottom-left-radius: 135px;border-bottom-right-radius: 135px;z-index: 1;box-shadow: 0 0.7rem 1rem rgba(0,0,0,0.35) !important;background: #ffffff;} @media only screen and (min-width: 800px) and (max-width: 1020px) { .article-landing .article-body.single-new-article .article-container.col-md-12.no-card {margin-top: -7em;} } article.col-md-12.post-snippet.masonry-item {width: 100%;float: none;text-align: center;padding-right: 0px;padding-left: 0px;} @media only screen and (min-width: 768px) and (max-width: 1024px) { .article-landing .top-news-sec .article-image.col-md-6 img{height: auto; } .article-landing .top-news-sec .article-image.col-md-6 { top: 0px;margin: 0px !important;width: 100% !important;} section.article-header {padding: 130px 0 0px !important;/*background-image: none !important;*/} .article-body.single-new-article .article-container.col-md-12.no-card {width: 100% !important;margin-left: 0px;} .discover-section .card .card-label-holder {float: left;position: relative;} body.article-landing section.discover-section.bg-white .card.img-holder {right: 0px !important;margin-left: 0px !important;padding-top: 0px !important;float: none;width: 100%;margin: 0 auto !important;width: 50% !important;} .article-landing section.discover-section.bg-white .col-md-6.col-rt-side, .article-landing section.discover-section.bg-white .col-md-6.col-lt-side {margin-top: 29px !important;margin-left: 0px;} .discover-section .col-md-6.col-lt-side, .col-md-6.col-rt-side {width: 100%;display: inline-block;} html body.article-landing section.discover-section.bg-white .col-md-6.col-lt-side .card.desc-hold { width: 50% !important;margin: 0px auto !important;padding-top: 0px;border-top: 0px;padding: 25px;} html body.article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.img-holder img {margin: 0px;} html body.article-landing section.discover-section.bg-white .card.img-holder img {margin-left: 0px;} html body.article-landing section.discover-section.bg-white {height: auto;width: 100%;padding-left: 0px; display: inline-block;} html body.article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold {width: 100%;height: auto !important;margin-left: 0px !important;} html body.article-landing section.discover-section.bg-white .col-md-6.col-rt-side .card.desc-hold {width: 50%;height: auto !important;margin: 0px auto !important;float: none;} html body.article-landing section.discover-section.bg-white .low-area {margin-top: 3em;} section.pt48.single-new-article.article-body {padding-top: 0px;} .discover-section .col-lt-side .channel-logo-discover {top: 30px;} .discover-section .channel-logo-discover { top: -5px;right: 0px;left: 30px;} .discover-section.bg-white .card-label-holder {float: left;} html body.article-landing section.discover-section.bg-white .col-lt-side .btn-holder {float: none;} #wrapper button.slick-arrow [class^=icon-] {line-height: 60px;} } .package-section.bg-decoder .container .sub{color: #36bee4;font-weight: 700;letter-spacing: .75px;font-size: 25px;line-height: 14px;display: block;margin-left: 10px;font-weight: 900 !important;} @media only screen and (max-width: 668px) { .package-section.bg-decoder .container h2 {color: #272985;font-size: 38px !important;margin-top: 14px !important;line-height: 40px !important;font-weight: lighter !important;margin-left: 10px;} } @media only screen and (min-width: 669px) { .package-section.bg-decoder .container h2 {color: #272985;font-size: 55px !important;margin-top: 14px !important;line-height: 40px !important;font-weight: lighter !important;margin-left: 10px;} } .package-section.bg-decoder .low-area{ margin-top: 3em;} .package-section.bg-decoder .low-area .wrap strong{ color: #000 !important;} .bg-decoder .package-slider {padding: 25px 0;margin: 0 auto;} .bg-decoder .package-slider .card-face.back .desc .back-title {display:block;} tag-selfservice-nav section.pt-sm-0.pb-xs-3{ padding-top: 35px;} tag-selfservice-nav .page-header {margin-top: 0px;} h4.mobile-header { margin-bottom: 0px;} .pt-20#contactbusiness {padding-top: 80px;padding-bottom: 0px;} .not-found .search-bar:after, .not-found .search-bar:before { background: rgb(122, 121, 121) !important;} @media only screen and (min-width: 768px) { .banner-slider .banner-content .btn {margin-bottom: 30px;white-space: nowrap;} } .my-profile.my-profile-sec .box-holder.p-3.pt-4.mb-2 {height: auto !important;} @media only screen and (min-width: 1400px) and (max-width: 2800px) { .route-page-home .package-section.bg-white .heading-area{padding: 10vw 0 !important;} .route-page-home .package-section.bg-white .heading-area {padding-bottom: 2vw !important;} .package-section.bg-decoder { padding: 3vw 0 !important; } section.package-section.bg-decoder{padding-top:70px!important;} } #smartcardblock label {margin-top: 10px;} .package-select-sec .row.pb-2.pt-5.change-package {padding-top: 0px;} @media only screen and (min-width: 320px) and (max-width: 450px){#popupform .container.not-mobile {height: 570px;} } @media only screen and (min-width: 451px) and (max-width: 667px){#popupform .container.not-mobile {height: 600px;} } @media only screen and (min-width: 320px) and (max-width: 667px) { .changepackagesPS .btn.pay-sum-btn {margin-left: 6px;} .single-new-article.article-body .article-container.col-md-12.no-card {margin-top: -8em;} .paymentSummary { margin-left: 0%!important; padding: 40px 40px 20px!important;text-align: left!important;box-shadow: 0 0 30px rgba(0,0,0,.2)!important;color: #8d8d8d!important;position: relative!important;-webkit-transition: .3s -webkit-transform ease!important;transition: .3s transform ease!important;width: 100%!important;} .pull-right-sum {text-align: initial;} .container.v-align-transform.not-mobile .head-area.lead-head {margin-top: 15px;} } .bg-dark.compare-packs#comaparesection {padding-bottom: 40px !important;} @media only screen and (min-width: 992px) and (max-width: 2800px){ .category-list-menu.account-nav .sub-nav-holder .btn.btn-link>.custom-caret { top: 13px !important;margin: 0px -9px ;} } .banner-slider .banner-content .inline-block.p-1 .btn {margin-top: 0px !important;margin-left: auto !important;margin-right: auto !important;float: none;display: block;text-transform: unset;} .banner-slider .banner-content.left .inline-block.p-1 .btn { margin-left: 0 !important; } @media (max-width:400px) { .my-profile #mainblock .box-holder{padding:10px!important;} a.tooltips{font-size:12px!important;} } .message-holder .col-xs-12.success.overlayformessage {/* position: absolute; *//* margin-top: 5px; */margin-bottom: 11px;padding-left: 0px;padding-right: 0px;left: 0;width: 100%;height: 100%;z-index: 10;margin-left:0px;background: linear-gradient(to bottom, #f25746 0%,#f25746 50%,#7a2e2e 50%,#fefafa 50%,#fcf7f7 100%);} .form-control[disabled], .form-control[readonly],fieldset[disabled] .form-control { color: #aba9a9 !important;} .tag-page-update-details input#cellNumber {padding-left: 37px !important;} .message-holder .text-info.text-center.color-white.successmsg {padding-bottom: 15px!important;} .update-detailes .group.hasvalue.serial a {} /*Mahesh*/ .wrapper { text-align: center;/* float: left; */position: absolute;-webkit-transform: translateZ(0);right: 12px;-webkit-font-smoothing: antialiased;top: 12px } .wrapper .tooltip { background: #fff;bottom: 100%;color: #000;border:#e2e2e2 solid 1px;border-radius: 10px;width:200px;display: block;left: -85px; text-transform: none;margin-bottom: 17px;opacity: 0;padding: 10px;font-size: 14px;pointer-events: none;position: absolute;-webkit-transform: translateY(10px);-moz-transform: translateY(10px);-ms-transform: translateY(10px);-o-transform: translateY(10px);transform: translateY(10px);-webkit-transition: all .25s ease-out;-moz-transition: all .25s ease-out;-ms-transition: all .25s ease-out;-o-transition: all .25s ease-out;transition: all .25s ease-out;-webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);-o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);} /* This bridges the gap so you can mouse into the tooltip without it disappearing */ .wrapper .tooltip:before { bottom: -20px;content: " ";display: block;height: 20px;left: 0;position: absolute;width: 100%;} /* CSS Triangles - see Trevor's post */ .wrapper .tooltip:after { border-left: solid transparent 10px;border-right: solid transparent 10px;border-top: solid #fff 10px;bottom: -10px;content: " ";height: 0;left: 50%;margin-left: -13px;position: absolute;width: 0;} .wrapper:hover .tooltip { opacity: 1;pointer-events: auto;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);-ms-transform: translateY(0px);-o-transform: translateY(0px);transform: translateY(0px);} /* IE can just show/hide with no transition */ .lte8 .wrapper .tooltip { display: none;} .lte8 .wrapper:hover .tooltip { display: block;} @media only screen and (min-width: 320px) and (max-width: 667px) { .wrapper .tooltip:after { left: 82%;} .wrapper .tooltip {left: -162px; } .how-to-pay-container .how-to-pay .inner {/* padding: 23px 10px 45px 3px !important; */width:auto ;min-width: 140px !important;border-radius: 5px;text-align: center !important;} } .bg-dark.compare-packs:after{z-index : 99 !important;} @media only screen and (min-width: 1000px) and (max-width: 1050px) { .route-page-home .package-section.bg-white {padding: 15vw 0 !important;} } @media only screen and (max-width: 991px) and (min-width: 668px) { .container.v-align-transform.not-mobile .head-area.lead-head .thinFont {line-height: 60px!important;} } @media only screen and (max-width: 667px) and (min-width: 320px) { .banner-slider .slick-list .banner-content span.home-package-logo.visible-lg-block.visible-md-block.visible-xs-block.visible-sm-block.text-show { font-size: 30px!important; text-align: left;} } @media only screen and (min-width: 768px) { .banner-slider .slick-list .banner-content span.home-package-logo.visible-lg-block.visible-md-block.visible-xs-block.visible-sm-block.text-show {font-size: 49px!important; text-align: left;line-height: 1;} } .sign-in .banner-block, html {height: 0vh !important;@media only screen and (max-width: 767px) .sign-in .banner-block, html {height: 0vh !important;} } .fix-error .message-holder .text-info.failuremsg, section.secure-text-sec {padding-bottom: 0;/* margin-top: 20px; */border-radius: 10px;/* margin-bottom: 20px; */background: linear-gradient(to bottom,#fefafa 50%,#fcf7f7 100%);} @media only screen and (max-width: 2800px) and (min-width: 992px) { .form-holder .message-holder .failuremsg h4.inline-block { padding: 20px 170px 60px;} } @media only screen and (max-width: 667px) and (min-width: 320px) { .package-landing .banner-slider .banner-content.left {text-align: left;padding-right: 5px!important;} .how-to-pay-section pt-4 {padding-bottom: 100px !important;} .aboutTitle img{margin: 0 auto;display: block;} .discount-sec .aboutTitle {border: none;} .aboutText, .termsConditions{text-align: center !important;} .termsConditions .btn-darkblue{float: none !important;} } @media only screen and (max-width: 767px) { .home-page.tag-page-home tag-raw { margin-left: 0px !important; max-width: 188px;} } @media only screen and (max-width: 2800px) and (min-width: 668px) { .full-height-header .how-to-pay-container .how-to-pay .inner.soft-shadow { height: auto !important;border-radius: 5px;} } span.pull-lefts {margin-right: 20px;} @media only screen and (max-width: 767px){ .route-page-my-account .search-bar.general-page-head.overlay.fadeIn { min-height: 110px !important;} } .news-landing #main.new-landing-main-sec section.pt-xs-5 {padding: 0px 0 0px;} .package-landing .banner-content .container h2{text-align:left!important;} @media only screen and (max-width: 750px) and (min-width: 700px) { .home-page .watch-section .bg-holder .show-slider-holder { height: 51vh!important; min-height: 0px!important;} .home-page .watch-section .bg-holder {min-height: 76vh;} .home-page .watch-section#watch {min-height: 85vh!important;} } .landing-page section.how-to-pay-intro.pb-0.pt-xs-5 h1 {margin-top: 95px!important;} @media only screen and (max-width: 667px) and (min-width: 320px){#cboxClose:after {font-size: 20px;top: 0px!important;left:50px!important;} #cboxClose:before {font-size: 20px;top: 0px!important;left:50px!important;} } /*Feedback form*/ .home-page .feedback-text a { color: #fff!important;} @media only screen and (max-width: 667px) and (min-width: 320px) { .hotels .head-area.lead-head h3.thinFont { margin-bottom: 10px;} .homepage-decoder-slider.package-slider .card .front {min-height: 400px;} } /********************** 20-50-19 Decorder alignment by Neha**********************/ .package-slider.homepage-decoder-slider .desc {position: absolute;width: 100%;} .package-slider .card .front {min-height: 355px;} .package-slider.homepage-package-slider .card-face.back .desc .back-title { display: block;} /*************************** 28-5-19 package border by Neha************************************/ .current-package-block .current-package-image.img-bg, .change-package-info .package-block .package-image.img-bg{ border-bottom-left-radius: 0px;border-bottom-right-radius: 0px;} /***********************************home banner From ****************************************/ .CLFpopup .rightBlock, .CLFpopup .leftBlock{ text-align: center;padding-bottom: 20px; } .CLFpopup .leftBlock{ border-right: #e2e2e2 solid 1px;} @media screen and (max-width: 992px) { .CLFpopup .leftBlock{ border-right:none;border-bottom: #e2e2e2 solid 1px;padding-bottom: 30px;margin-bottom: 20px;} .CLFpopup .rightBlock, .CLFpopup .leftBlock{ padding-left:0px; padding-right:0px; } } .CLFpopup h2{ color: #36bee4;font-size: 26px; margin-bottom: 10px; } .CLFpopup h3{ color: #777777;margin-bottom: 30px;margin-top: 10px;font-size: 28px; font-weight: normal; } .CLFpopup .btn-blue{ border: #36bee4 solid 1px; Background: #36bee4; Color:#fff; box-shadow:none; width: auto!important;border-radius: 25px; padding: 10px 15px!important; } .CLFpopup .btn-blue img { margin-left: 40px;width: 25px;} .mobileAppIcon{ display: inline-block;margin: 10px;} #CLFpopup .modal-content {background: #f7f7f7 !important;padding: 30px;overflow: auto; font-size: 18px;line-height: 26px; box-shadow: 0 5px 15px rgba(0,0,0,.5);} #CLFpopup .modal-content button.close {width: 70px;height: 70px;font-size: 20px;line-height: 20px;top: -35px;right: -35px;} .modal-content button.close {width: 30px;height: 30px;font-size: 14px;line-height: 14px;background: #fff!important;border-radius: 100%;opacity: 1;position: absolute;top: -35px;right: 0;color: #ddd;z-index: 999;padding: 0;cursor: pointer;background: 0 0;border: 0;} #CLFpopup .feedback-dialog {background: #224a73;padding: 0;z-index: 999;position: relative;margin-top: 15% !important;} #CLFpopup {background: rgba(0,0,0,.5);} .leftBlock img.mobileAppIcon {width: 135px;} @media screen and (max-width: 425px) { .CLFpopup h2{ font-size: 22px; } .CLFpopup h3{ font-size: 24px;} .CLFpopup .btn-blue{ padding:12px;} #CLFpopup .modal-content button.close { width: 50px!important; height: 50px!important; top: -35px; right: -15px!important;} .mobileAppIcon{ width:110px; margin:10px 5px;} #CLFpopup .feedback-dialog { margin-top: 25% !important; } } /***************************End*********************************/ /***********************************home banner From for BBN ****************************************/ .bigBrotherpopup { background: rgba(0,0,0,.9) !important;} .bigBrotherpopup .modal-content{ /* background: url('/media/6980/bigbrotherbg.jpg') no-repeat right;*/ background-size: cover;border:#d3b0b5 solid 1px;margin: 0 auto;margin-top: 20%;} .en-ng .bigBrotherpopup .modal-content{ /*background: url('/media/7328/bbn-freebies_popup_revised.jpg') no-repeat right;*/ /*background: url('/media/6980/bigbrotherbg.jpg') no-repeat right;*/ background-size: cover;border:#d3b0b5 solid 1px;margin: 0 auto;margin-top: 20%;} .bigBrotherpopup .rightBlock{ margin-top: 40px;width:35%;text-align: center;border-left: #fff solid 1px;} .bigBrotherpopup .rightBlock .downloadNow{ width:80%;} .bigBrotherpopup .rightBlock .mobileAppIcon{ width:65%; margin: 0px;} .bigBrotherpopup .leftBlock{ width:65%;text-align: right;padding-bottom: 0px;margin-bottom: -15px;} .bigBrotherpopup .leftImg, .bigBrotherpopup .rightImg{ float: left;text-align: center;width:50%;} .bigBrotherpopup .leftImg img{ height: 400px;margin-top: -80px;max-width: none;} .bigBrotherpopup .rightImg img { width:80%;margin-top: 40px; } .bigBrotherpopup .rightImg img.speechBbl{ margin-top: 20px;width:100%;} .bigBrotherpopup .modal-content button.close{ width: 40px!important; height: 40px!important; font-size: 20px; line-height: 20px; top: -20px!important; right: -20px!important; position: absolute!important;} @media (min-width: 992px){ .bigBrotherpopup .modal-lg { width: 950px;} } .en-ng .bigBrotherpopup .rightBlock { width: 35%;} .en-ng .bigBrotherpopup .leftBlock { width: 65%;} @media (max-width: 667px) { .en-ng .bigBrotherpopup .rightBlock { width: 100%;} .en-ng .bigBrotherpopup .leftBlock { width: 100%;} } @media screen and (max-width: 992px) { .bigBrotherpopup .modal-content{ /*background: url('/media/6982/bigbrother-mobilebg.jpg') no-repeat;*/ background-size: cover; width:94%;} .en-ng .bigBrotherpopup .modal-content{ /* background: url('/media/6982/bigbrother-mobilebg.jpg') no-repeat;*/ background-size: cover; width:94%;} .bigBrotherpopup .leftImg{ display: none;} .bigBrotherpopup .leftImg, .bigBrotherpopup .rightImg{ width:100%;} .bigBrotherpopup .leftBlock, .bigBrotherpopup .rightBlock{ width:100%; display: block; text-align: center; border: none; margin-bottom: 20px;} .bigBrotherpopup .rightImg img.speechBbl{ width:80%;} .bigBrotherpopup .modal-content button.close{ width: 35px!important; height: 35px!important; font-size: 20px; line-height: 20px; top: -35px!important; right: -17px!important;} } /***************************End*********************************/ /***********************************home banner From for FA ****************************************/ .FApopup { background: rgba(0,0,0,.9);} .FApopup .modal-content{ background: url('/media/6483/fa-popup-bg-desktop.png') no-repeat right;background-size: cover;border:#d3b0b5 solid 1px;margin: 0 auto;margin-top: 20%;} .FApopup .rightBlock .downloadNow{ width:80%;} .FApopup .rightBlock .mobileAppIcon{ width:65%; margin: 0px;} .FApopup .leftBlock{ width:65%;text-align: center;padding-bottom: 0px;margin-bottom: -15px;} .FApopup .leftImg, .bigBrotherpopup .rightImg{ float: left;text-align: center;width:50%;} .FApopup .leftImg img{ height: 400px;margin-top: -80px;max-width: none;} .FApopup .rightImg img.speechBbl{ margin-top: 20px;width:100%;} .FApopup .modal-content button.close{ width: 40px!important; height: 40px!important; font-size: 20px; line-height: 20px; top: -20px!important; right: -20px!important; position: absolute!important;} @media (min-width: 992px){ .FApopup .modal-lg { width: 950px;} } @media screen and (max-width: 992px) { .FApopup .modal-content{ background: url('/media/6484/fa-popup-bg-mobile.png') no-repeat; background-size: cover; width:94%;} .FApopup .leftImg{ display: none;} .FApopup .leftImg, .bigBrotherpopup .rightImg{ width:100%;} .FApopup .leftBlock, .bigBrotherpopup .rightBlock{ width: 100% !important; display: block; text-align: center; border: none; margin-bottom: 20px;} .FApopup .rightImg img.speechBbl{ width:80%;} .FApopup .modal-content button.close{ width: 35px!important; height: 35px!important; font-size: 20px; line-height: 20px; top: -35px!important; right: -17px!important;} } @media screen and (min-width: 1024px) { .FApopup .rightImg img { width:80%;margin: 100px auto 0;position: absolute;left: 2%;right: 2%;} .FApopup .leftBlock div:nth-child(3n) {position:absolute;margin:210px auto 0; text-align:center;width:570px;} .FApopup .rightBlock { margin-top: 40px;width:35%;text-align: center;border-left: #fff solid 1px;} } @media screen and (max-width: 767px) { .FApopup .rightBlock{text-align:center;} .FApopup .rightImg {margin:30px auto; display:block;} } /***************************End*********************************/ @media only screen and (max-width: 767px) and (min-width: 320px){ .bg-white .low-hold .currencyStyleHmPgCards { margin-top: -5px;} } @media screen and (max-width: 767px) { body.tag-page-update-details .form-on-white fieldset>div.two-col>div {width: 100%;} } #faxNumber {color: #000;} img.greatwall-icon.frechimg {padding: 20px;} @media only screen and (max-width: 992px) { .how-to-pay-section.pt-4 .how-to-pay-container {/* min-height: 750px !important;*/ margin-bottom:110px;} } /******************Lead Form **************************/ @media only screen and (max-width: 667px) and (min-width: 320px){#colorbox #cboxWrapper #cboxContent #cboxLoadedContent { overflow: auto!important;} .slide-holder.red-tab span.arrow-btn-watch {margin-right: 35%!important;} } #for-package-landing-page .banner-content .container{margin: 20px;width: 100%;} .contact-us, .package-popup-overlay#packagepopupform {top: 0%!important;border-radius: 5px;} .package-landing .fullwidthpopup .contact-us, .package-landing .fullwidthpopup .package-popup-overlay#packagepopupform {padding: 40px 0;} .bg-dark.compare-packs .package-block .package-logo {margin-bottom: -6px;} .highleight-mid {margin-top: 15px;} .slick-active .highleight-mid {box-shadow: -13px 10px 12px -7px rgba(0,0,0,.8);border-radius: 9px;} .webform .wg2k_textareaField textarea {background: no-repeat;} .webform div[class^=wg2k_] label { background: #fff!important;} .contactPage .webform div[class^=wg2k_] label {background: #f7f7f7!important;} body.wtachPage.home-page.tag-page-home.scrollhidden {overflow: auto;} .find-dealer-installer-landing footer.footer-2.bg-dark.pt96.pt-xs-40.bg-white.straight {/* margin-bottom: 80px !important; */margin-top: 211px;} a.btn.btn-rounded.anim-btn.home-btn.btn-white.package-header-track.btn-hide-btn {display: none;} .contactPage .webform .wg2k_textareaField textarea {background: #f7f7f7!important;} .home-page.tag-page-home.modal-open .modal-content button.close:hover {color: #ddd;} @media only screen and (max-width: 420px) and (min-width: 320px) { .fix-error section {text-align: center;font-size: 12px;} } #twitter,#facebook{display:none;} .wrap .logo-hold {margin-right: 16px;} .tag-page-fix-errors tag-fix-errors-logged-in .popup a.cta { max-width: 205px !important;} @media only screen and (max-width: 450px) and (min-width: 320px){#toast-container .toast.toast-error {margin-top: 18px;} } .second-slider .highlight-item-text {border-radius: 0 0 6px 6px;} .contactPage a.roundBtn.contact-hide {display: none!important;} @media only screen and (max-width: 667px) and (min-width: 320px) { .package-landing .banner-content .container h1, .heading .banner-content .container h2, .banner-content .container h3, .banner-content .container h4, {text-align: left !important;} /* .package-landing .banner-content .container h1, .heading .banner-content .container h2, .banner-content .container h3, .banner-content .container h4, .banner-content .container p {text-align: left !important;} */ } .contactPage.modal-open .popup.success h2 {text-align: center;line-height: 40px;} @media only screen and (max-width: 667px) and (min-width: 320px) { .contactPage.modal-open #commonModalPopup .modal-content {padding: 0px;background: #f7f7f7;} } @media only screen and (max-width: 667px) and (min-width: 320px) { .contactPage.modal-open .popup.success h4{ line-height: 27px }} @media only screen and (max-width: 667px) and (min-width: 320px) { .contactPage.modal-open .popup.unsuccessful h4 {line-height: 27px;} } /* 23.07.2019 Tumelo: Language Selector Menu Styles */ button.btn.btn-primary.dropdown-toggle {background: none !important;width: auto !important;min-width: auto !important;display: inline-block;border: none;box-shadow: none;} .dropdown-lang {text-align: left;} ul.dropdown-lang {min-width: auto;background: rgba(0,0,0,0.6);border: 1px solid #fff;padding: 0;margin: 0;} .lang-dropdown img {vertical-align: middle;} .dropdown-lang li {margin: 0;} .lang-dropdown .dropdown-menu>.active>a, .lang-dropdown .dropdown-lang.active>a:focus, .lang-dropdown .dropdown-lang>.active>a:hover, .lang-dropdown span.globe-text:hover, .lang-dropdown .f32 a:hover, .lang-dropdown .dropdown-lang li a:hover, .lang-dropdown .dropdown-lang li a:focus {color:#000 !important; background:#fff !important;} .dropdown-lang-header, .dropdown-lang>li>a {padding: 5px 10px !important;font-size: 16px;color: #fff !important;} span.lang-menu {color: #fff;} /* End Tumelo: Language Selector Menu Styles */ a.btn.btn-rounded.anim-btn.btn-default.pay-now-removed {visibility: hidden;/* display: none; */} .show-slider .card .front.multi-card { box-shadow: -8px 9px 29px -12px rgba(0,0,0,1) !important;} .col-md-3.col-sm-6.col-xs-12.contact-btns-sec.map-contact-btn.moz {max-width: 260px;} @media only screen and (min-width: 768px){ .home-page .header-sec .search-container img {margin-left: 8px !important;position: relative;margin-top: -3px !important;width: 35px;height: 35px; } } @media only screen and (max-width: 667px) and (min-width: 320px) { .find-dealer-installer-landing .faq-box-slider.soft-shadow.mb-3 { margin-left: 3% !important;} .low-area .arrow-btn-watch {margin-right: 25px;} } @media only screen and (max-width: 667px) and (min-width: 320px) { .home-page .header-sec .search-container img { margin-left: 0px !important; position: relative; margin-top: 0px !important;} } @media only screen and (max-width: 667px) and (min-width: 320px) { .tag-page-home .package-slider .card-face .bg-holder { background-size: auto!important;} } /* css change for how to pay page credit card and bank payment section date:- 19-09-2019*/ @media only screen and (max-width: 420px) and (min-width: 320px) { .inner-content .modal-body {padding: 1px!important;} } @media only screen and (max-width: 420px) and (min-width: 320px) { .form-group button.btn.btn-base.pull-right {float: left !important;} } .en-ng .modal-content.bbn p {margin: 0 0 0px;/* opacity: .5; */opacity: 1;} .en-ng .bigBrotherpopup .bbn .rightImg {width: 50%;padding-bottom: 20px;padding-top:20px;} @media only screen and (min-width: 320px) and (max-width: 667px) { .en-ng .bigBrotherpopup .bbn .rightImg {width: 100%;padding-bottom: 20px;padding-top:20px;} } .en-ng .bbn span.middel-content-num {color: #e7a310;} .home-page .second-slider .slick-list.draggable {padding: 0 10px 10px;} #loginLinkLabel-NewHome{display: none!important;} .NewDstvPage #loginLinkLabel{display: none!important;} .NewDstvPage #loginLinkLabel-NewHome{display: block!important;} .Thanks-page .partnerCards span.slick-prev.slick-arrow:before {display: none!important;} #countryDropdown-newhome a.country {float: right;font-size: 13px;color: #fff !important;font-weight: 700;padding: 0px 0;line-height: 30px;} #countryDropdown-newhome img#countryIcon-newhome {width: 32px;height: 35px;display: block !important;} @media only screen and (min-width:992px) { .package-section .package-slider .card-face.back .desc { padding: 50px 54px 26px;} } @media only screen and (min-width: 320px) and (max-width: 370px){ .compare-package.en-tz .change-package .packages li .pricebar .channels { margin-left: 0px; }} @media only screen and (min-width: 992px) { .show-slider-holder .show-slider .slick-list.draggable { padding: 0 10vw!important;} } /************************************ Payment Suit Popup **********************************************/ a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {border-bottom-right-radius: 20px;border-top-right-radius: 20px;left: -15px;position: relative;padding: 13px;min-width: 180px !important; max-width: 180px;} a.btn.anim-btn.secondpayletf-btn {background-color: #4F4F4F;color: #fff;border: none;} .customer-info-section {width: 300px;margin: 0 auto;background: #3E3E3E;padding: 30px 20px;} .main-top-payment-info .pay-btn-section {position: absolute;top: 40%;} .main-top-payment-info .custom-details-sec{float: right;} .main-top-payment-info h4.modal-title {font-weight: 100;text-align: center;margin: 20px 0;} #smartnumberLegend, #accountholderLegend, #editamountLegend, #countryLegend {font-size: .8em!important;text-align: left;} .form-group.edit_amount{width: 250px;margin: 20px auto;} .edit_amount.form-group fieldset {border: 1px solid blue;} .edit_amount #editamountLegend {color: blue;} .customer-info-section .form-group fieldset, .edit_amount.form-group fieldset {border: 1px solid #fff;border-radius: 25px;margin-bottom: 13px;} .customer-info-section .form-group fieldset select, .customer-info-section .form-group fieldset input, .edit_amount.form-group fieldset input {padding-top: 0px;box-shadow: none;border: none !important;background: transparent;height: 30px; font-size: 18px;line-height: 22px;color: #ffff; border-radius: 10px;} .customer-info-section .jcf-select { border: none;margin: 0px;width: 100%;height: 30px;border-radius: 0px;top: -7px;} .customer-info-section .jcf-select .jcf-select-text { font-size: 14px;color: #fff;text-transform: initial;} .customer-info-section .jcf-select .jcf-select-opener:after {color: #fff;} .customer-info-section .jcf-select.jcf-focus .jcf-select-text{color: #fff;} /*******************Payment history pop up ***********************/ .main-top-payment-history-info.row table#tblTransactionHistory {overflow: auto;max-height: 400px;display: block;} .main-top-payment-history-info.row .financial-table .table th {font-weight: 400;text-align: center;} #paymentHistoryModal .col-lg-12.col-sm-12.col-xs-12.col-md-12.Pay-history .pay-history-details {width: 350px;margin: 0 auto;/* background: #3E3E3E; */ padding: 30px 20px;margin-bottom: 15px;} #paymentHistoryModal .col-lg-9.col-lg-offset-2.Pay-history-transaction {font-weight: lighter;} #paymentHistoryModal .modal-header, #dashboardModelFixError .modal-header {border-bottom: none;padding: 15px;} #paymentHistoryModal .modal-content, #dashboardModelFixError .modal-content{ font-family: roboto;background: #131313;width: 100%;padding: 0px 0px;border: 1px solid #707070;opacity: 1;backdrop-filter: blur(30px);-webkit-backdrop-filter: blur(30px);background: transparent url(/media/8065/layer-2.png) 100% 0% no-repeat padding-box;} #paymentHistoryModal .col-lg-12.col-sm-12.col-xs-12.col-md-12.Pay-history h4.modal-title {text-align: center; font-weight: 300;} #paymentHistoryModal .col-lg-12.Pay-history-transaction-feild {background: #3a3737;font-size: 15px;text-align: center;margin-top: 30px;padding: 12px;} #paymentHistoryModal .form-group fieldset {border-radius: 35px;background: transparent;/* margin-bottom: 25px; *//* background: rgb(55, 60, 84); *//* background: rgba(255,255,255,.14); *//* position: relative; *//* border: 1px solid #FFFFFF; */border-radius: 100px;opacity: 1;} #paymentHistoryModal span.jcf-select.jcf-unselectable.jcf-select-form-control {border: 1px solid #FFFFFF;border-radius: 100px;opacity: 1;} #paymentHistoryModal .jcf-select .jcf-select-text { color: #fff;} #paymentHistoryModal .jcf-select .jcf-select-opener:after {color: #fff;} #paymentHistoryModal .col-lg-12.Pay-history-transaction-feild-details {text-align: center;font: Light 16px/25px Roboto;letter-spacing: 0;color: #FFFFFF;opacity: 1;font-size: 16px;padding: 50px;} @media only screen and (min-width: 320px) and (max-width: 767px){#paymentHistoryModal .modal-content button.close {top: -5px; right: -5px;} #paymentHistoryModal .col-lg-3.col-md-3.col-sm-3.col-xs-3 {margin-top: -9px; font-size: 10px;} #paymentHistoryModal .col-lg-12.col-sm-12.col-xs-12.col-md-12.Pay-history .pay-history-details {width: 100%;} #paymentHistoryModal .col-lg-4.col-md-4.col-sm-4.col-xs-4 .jcf-radio { height: 16px;width: 16px;} #paymentHistoryModal .modal-content p {text-align: center;font-size: 12px;} #paymentHistoryModal .col-lg-12.Pay-history-transaction-feild-details {padding: 25px;} } @media only screen and (min-width: 320px) and (max-width: 350px){ #paymentHistoryModal .col-lg-4.col-md-4.col-sm-4.col-xs-4 {font-size: 10px;} } @media only screen and (max-width: 767px) and (min-width: 351px){#paymentHistoryModal .col-lg-4.col-md-4.col-sm-4.col-xs-4 {font-size: 11px;} } @media only screen and (min-width: 768px) and (max-width: 1200px){#paymentHistoryModal .col-lg-12.Pay-history-transaction-feild {padding: 20px;margin-top: 50px;} #paymentHistoryModal .col-lg-3.col-md-3.col-sm-3.col-xs-3 {margin-top: -12px;} } .financial-table #tblTransactionHistory tr.record1 {background: #3a3737 !important;font-size: 15px;text-align: center;margin-top: 30px;padding: 12px;font-weight:lighter;} .financial-table #tblTransactionHistory tr.record {background: #3a3737 !important;font-size: 15px;text-align: center;margin-top: 30px;padding: 12px;} .financial-table #tblNoRecords tr.record1 {background: #3a3737 !important;font-size: 15px;text-align: center;margin-top: 30px;padding: 12px;} @media only screen and (min-width: 320px) and (max-width: 350px) { .financial-table #tblTransactionHistory tr.record1 {font-size: 10px;} } @media only screen and (min-width:351px) and (max-width: 767px) { .financial-table #tblTransactionHistory tr.record1 {font-size: 12px;} } .main-top-payment-history-info.row .financial-table #tblTransactionHistory.table tr:hover, .financial-table #tblTransactionHistory.table.table-striped>tbody>tr:nth-of-type(odd):hover {background-color: transparent;} .main-top-payment-history-info.row #tblTransactionHistory .line-item td {color: #CCCCCC;font-size: 14px;padding: 23px 15px;line-height: 5px !important; font-family: robotoregular;text-align: center;opacity:0.9;} .main-top-payment-history-info.row .financial-table #tblTransactionHistory.table th {padding: 21px 21px;font-size: 14px;font-weight: 400;text-align:center;} .main-top-payment-history-info.row .financial-table .table tr:hover, .financial-table .table.table-striped>tbody>tr:nth-of-type(odd):hover { background-color: transparent !important;} @media only screen and (min-width:300px) and (max-width: 480px) { .main-top-payment-history-info.row .financial-table #tblTransactionHistory.table th {padding: 0px 5px;font-size: 12px;} } @media only screen and (min-width:481px) and (max-width: 550px) { .main-top-payment-history-info.row .financial-table #tblTransactionHistory.table th {padding: 0px 30px;font-size: 12px;width:100%;} } @media only screen and (min-width:551px) and (max-width: 766px) { .main-top-payment-history-info.row .financial-table #tblTransactionHistory.table th {padding: 0px 40px;font-size: 12px;width:100%;} } @media only screen and (min-width:300px) and (max-width: 767px) { .main-top-payment-history-info.row #tblTransactionHistory .line-item td {padding: 16px 8px;} } @media only screen and (min-width: 768px){ #paymentHistoryModal .modal-content button.close {top:50px !important;} .ncb #paymentHistoryModal .modal-content button.close {top:-20px !important;} #paymentHistoryModal {padding-top:20px;} .ncb #paymentHistoryModal {padding-top:0px;} } #paymentHistoryModal .jcf-select-drop .jcf-hover {background: #6CDFF6 0% 0% no-repeat padding-box !important;/*border: 1px solid #707070;*/opacity: 0.9;color: #fff !important;backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);font-weight: 400;font-size: 15px;} #paymentHistoryModal .jcf-select-drop-content .jcf-list {background: #131313;border: 1px solid #707070;margin-top:5px;} #paymentHistoryModal .jcf-list .jcf-option {font-size: 15px;font-weight: 400;backdrop-filter: blur(0px) contrast(0.9);} #paymentHistoryModal .jcf-select-drop .jcf-select-drop-content:after{ display:none;} #paymentHistoryModal .jcf-select .jcf-select-opener:after {font-size: 18px;font-weight: 100;} @media (min-width: 768px){#paymentHistoryModal .modal-dialog {margin-top: 5%;} } @media (max-width: 450px) { .main-top-payment-history-info.row #tblTransactionHistory .line-item td {line-height: 12px !important;} } #paymentHistoryModal .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {border-top: 1px solid #292727;} #paymentHistoryModal .financial-table .table td {font-size: 14px;font-family: roboto;font-weight: 300;padding: 23px 42px;text-align: left;letter-spacing: 0;color: #FFFFFF;opacity: 0.45;} @media (max-width: 767px){#paymentHistoryModal .close img {width: 15px;} #paymentHistoryModal .financial-table .table td {padding: 23px 15px;} } .btn-pink {color: #ffffff !important;background-color: pink !important;} /*******************************************Fix Error *************************************/ .dashboardModal.modal {background: rgba(0,0,0,.8);text-align: center!important;} .webform.container.modal-dialog.modal-lg.feedback-dialog {text-align: center;} .heading-fix-error{font-size: 35px letter-spacing: 0;color: #FFFFFF;} .sub-text-error{text-align: center;font-size: 18px;letter-spacing: 0;} .smartcard_slider{/* background: transparent linear-gradient(180deg, #283B836C 0%, rgba(9, 106, 159, .6) 48%, rgba(0, 161, 215, .6) 100%) 0% 0% no-repeat padding-box; */box-shadow: 3px 3px 3px #00000029;display: block;float: left;width: 100%;padding: 20px 0 20px 20px;margin: 3em 0px 4em;height: 160px;} .left-heading-smarcard{text-align: left;font-size:30px;letter-spacing: 0;color: #FFFFFF;margin-bottom: 20px; padding-left: 2em;} .decoder-img-left {background: transparent;border-radius: 5px 0 0 0;} .smartcard.col-lg-6 {background: #de7c00 url(/media/6659/button-pattern.png) no-repeat right center;background-repeat: no-repeat;background-size: 22px;border-radius: 0 5px 0 0; font-size: 13px;line-height: 21px; width:49.5%;} .smartcard-section-bottom{width: 100%;background: none;height: 90px;clear: both;padding: 10px 0;border-radius: 0 0px 5px 5px;display:block !important;} .fix-package {padding-top: 20%;/* padding-right:10% !important; */} .three-section:nth-child(2) { border-right: 1px solid #ccc; border-left: 1px solid #ccc; } .decoder-img-left img{margin-top: -10px;} .fix-package .second-span .icon-pack {font-size: 1.9em;} .smartcard-section-bottom .second-span {width: 100%;float: left;padding: -1px 10px;font-size: 11px;/*font-weight: 500;*/ } .three-section:last-child {border: none;} .three-section span {font-size: 11px;} .list-info {display: inline;width: 100%;margin: 20px 0px;clear: both;} .fix-error .list-info { display: block;} .fix-smartcard-slider { padding-top:12%;/* padding-left: 15%; */} .fix-smartcard-slider.slick-initialized .slick-slide {display: block;margin-right: 20px; margin-top: 36px;} .fix-smartcard-slider.slider {margin: 0px;margin-top: 35px;width: 80%;} .arrows-fix-smart {height: 30px;width: 25%;right: 15px;position: absolute;} .dashboard-page .arrows-fix-smart .slick-next, .dashboard-page .arrows-fix-smart .slick-arrow {background-color: transparent; box-shadow: none;} .fix-error-option {margin-top: 50px;} .fix-error-options.form-group fieldset {border: 1px solid #c0c0c0;} .form-group .fix-error-options {clear: both;margin: 0 auto;width: 280px;} .fix-error-options .jcf-select { border: none;height: 30px;} .fix-error-options.form-group fieldset {border: 1px solid #c0c0c0;} .fix-error-options.form-group fieldset { background: transparent;} .fix-error-options .jcf-select .jcf-select-text { text-align: left; margin: 7px 35px 0 50px; font-size: 14px;} .fix-error-options .jcf-select .jcf-select-opener:after {font-size: 15px; color: #fff;} .fix-error-options .jcf-select.jcf-focus .jcf-select-opener:after{color: #fff;} .fix-btn-bootom {width: 100%;text-align: center;margin: 20px 0px;} .fix_errorBtn {font-size: 16px;height: 42px;padding: 0 6px 0 20px;position: relative;color: #fff;background: #179DD8;border-radius: 26px;max-width: 260px;min-width: 210px;font-weight: bold;border: none;} span.bottom-note-text {text-align: center;width: 70%;margin: 0 auto;display: block;} .error-package{padding-bottom: 25px;} .tick-select {height: 30px;width: 30px;background: #ccc;border-radius: 30px;float: right;top: -15px;position: absolute;z-index: 9;right: -15px;} .dashboard-page .act-image{left:50% !important;} .dashboard-page .smartcard-section-top .jcf-radio {margin: 18px 0px;} .active-status-icon{background: #008A3B;width: 20px !important;height: 20px !important;border-radius: 20px;padding: 1px 0px;margin: 0px 6px;display: inline-block;position: relative;top: 3px;} .active-status-icon:before {content: "\e946";font-family: 'DSTV-Icons';color: #fff;font-size: 14px;margin: 0px 0px;line-height: 0px;} .dashboardPOP .modal-content p {margin: 0 0 0px;opacity: 1;} .disable-fixerror-links { pointer-events: none !important; cursor: default; color:Gray; } /*************************************************************************************/ .error-no {border-radius: 39px;background: #ccc;padding: 14px 10px;} .first-error-option, .second-error-option, .third-error-option{margin: 3em 0px;} .first-error-option .error-info, .second-error-option .error-info{border-image: linear-gradient(270deg, #6CDFF6 2%, #00000000 100%) 0% 0% 5%;border-width: 1px;border-style: solid;width: 100%;padding: 0 0 40px 0;} .error-info{float: left; text-align: left;} /**************************************Fix Error Success ***************************************/ .success-sub-text { font-size: 16px;font-weight: 100;opacity: 0.8;} .success-tips { font-size: 18px;font-weight: 100;} .success-fix-error {color: #59AE5C;font-size: 36px !important;font-weight: 400;} .main-row-success-option {display: block;width: 450px;margin: 0 auto;padding: 50px;background: #3E3E3E;} .tel-section, .add-section {margin-bottom: 30px;} .modal-content .main-row-success-option p { margin: 0 0 0px; opacity: 1;} .fix-smt {width: 50% !important;padding: 8px 20px 8px 15px !important;} .form-group.fix-error-option .note.p-3.relative span {/* text-transform: lowercase;*/ } .p-0.block-4 .container-fluid.main-section .popup.unsuccessful p {color: black !important;} /************************************************************************ Change Package CSS *************************************************************************/ body .dashboardPOP #errorMessageModal .modal-body { margin: 20px auto; display: block; max-width: 100% !important; } .dashboardPOP#changepackageModal #errorMessageModal .modal-header, .dashboardPOP#addOnPackageModal .modal-header { max-width: 100%; margin: 0 auto; display: block; } .main-top-package-info {display: block;width: 100%;} .package-info-right { padding: 0px !important;} .package-info-left { padding: 0px !important;top: 20px;left: 20px } .package-name-font {font-size: 35px;} .main-top-package-info .smartcard, #changepackageModal .smartcard, #currentpackageModal .smartcard{ background: #de7c00 url(/media/6659/button-pattern.png) no-repeat right center;background-size: 22px;border-radius: 0 5px 0 0;/* float: left; */padding: 10px 8px 10px;text-align: left;font-size: 16px;z-index: 88;position: relative;padding-left: 55px; font-weight: 100;} #changepackageModal .number, #currentpackageModal .number{font-size: 15px;font-weight: bold;} #changepackageModal .modal-body, #currentpackageModal .modal-body {position: relative;padding: 0px;} .package-info-right img {width: 25%;z-index: 99;position: absolute;top: -27px;left: -43px;} #changepackageModal .modal-footer, #currentpackageModal .modal-footer{padding: 15px;text-align: right;border-top: none;} .dashboard-page .modal-dialog {/*width: 600px;*/margin: 5px auto;} .dashboard-page .model .modal-content , #updateDetailsModel .modal-content, #notificationMeg .modal-content, #addOnPackageModal .modal-content, #costSummaryAddon .modal-content, #updateDetailsModel .modal-content, #currentpackageModal .modal-content, #changepackageModal .modal-content, #costSummary .modal-content, #paymentModal .modal-content {background: transparent;width: 100%;float: left;padding: 0px 0px 0px;border: 1px solid #707070;backdrop-filter: blur(3px);display: block;box-shadow: none;height:100%} .modal#updateDetailsModel .modal-content{padding: 0px 0px;} .second-top-package-info{background: #514222;display: block;width: 100%;float: left;padding: 10px;} .second-top-first, .second-top-second {text-align: center;} .second-top-second { border-left: 1px solid #716c6c; border-right: 1px solid #716c6c; } .second-top-third{ text-align: center;} span.package-text-price, span.package-text-amount{text-align: left;font-size: 14px;letter-spacing: 0;color: #FFFFFF;opacity: 1;font-weight: 300;} span.package-price, span.package-amount{text-align: left;font-size: 14px;letter-spacing: 0;color: #FFFFFF;font-weight: bold;} .third-top-package-info {padding: 0px;float: left;width: 100%;display: block;background-color: #611B14;padding: 10px 5px;} .col-lg-4.addOnPackage-info {border-right: 1px solid #614f4f;/* margin-bottom: 10px; */padding: 12px 10px;} .addOntext{text-align: left;font-size: small;letter-spacing: 0;color: #FFFFFF;cursor: pointer;font-weight: 300;} .addOn-info{text-align: left;font-size: medium;letter-spacing: 0;color: #FFFFFF;font-weight: 400;} .package-change-bottom-section {width: 100%;float: left;display: block;padding: 20px;} .package-change-bottom-section h2 {text-align: center; font-size: 30px;font-family: Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 600;} .right-packagelist-section{ background: #de7c00 url(/media/6659/button-pattern.png) no-repeat right center;} .main-packagelist-section {margin-bottom: 20px;text-align: center;vertical-align: middle;} .left-packagelist-section {background-color: #495965;} .left-packagelist-section {padding: 18px 10px;background: rgb(255, 255, 255, .03);backdrop-filter: blur(6px);} .package-list-premium{font-size: 30px; top: 8px;position: relative;left: 10px;} .left-packagelist-section img {width: 23px;} .package-list{height: 220px;min-height:120px;overflow: hidden;position: relative;} .package-list .main-packagelist-section:nth-of-type(2) {margin: 0 0 70px;} .package-list.fullHeight .main-packagelist-section:nth-of-type(2) {margin: 0 0 20px;} .package-list.fullHeight {height: auto;padding: 0 0 40px;} .fullHeight .overlayBottom img {-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-o-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);} .package-change-bottom-section .fullHeight .overlayBottom { position:absolute;} .package-change-bottom-section .overlayBottom, .bottom-section-addon .overlayBottom { background:none;} .dashboard-page .package-list .jcf-radio {margin: 0px 10px; position: relative; top: -6px; right: 20px;} .dashboard-page .addOnPacakgeModal .package-list .jcf-radio {margin: 0px 10px; position: relative; top: -30px; right: 20px;} .right-packagelist-section, .left-packagelist-section{height: 66px;} .left-packagelist-section input {margin: 0px 15px !important;} @media only screen and (min-width: 768px) { .notificationMeg .modal-content button.close, #changepackageModal .modal-content button.close, #currentpackageModal .modal-content button.close{top: -15px;right: -15px;} } @media only screen and (min-width: 320px) and (max-width: 667px) { .dashboard-page .package-list .jcf-radio { margin: 0px 6px; right: 0px;} #changepackageModal .package-list .left-packagelist-section {padding: 12px 0px;} #changepackageModal .package-list .right-packagelist-section {padding: 1px 0px; } .package-change-bottom-section .main-packagelist-section { margin-bottom: 45px;} .package-change-bottom-section .package-list { height: 160px;} .package-change-bottom-section .package-list.fullHeight {height: auto;} .modal-body .package-change-bottom-section { padding: 20px 10px;} } /**************************************************************** Cost Summary Popup CSS *****************************************************************/ .cost-details.row {padding: 15px 40px;margin: 20px;margin-top: 5em;} .details-info-price {text-align: right;font-weight: bold;font-size: 18px;width: 30% !important;} .details-info {margin-bottom: 20px;font-family: Roboto,Helvetica,Arial,sans-serif;letter-spacing: 0px;text-align:left;} .details-info-text{font-size: medium;width: 70% !important;} .pay-btn-cost, .save_details_btn{font-size: 16px;height: 42px;padding: 0 6px 0 20px;position: relative;color: #fff;background: #179DD8;border-radius: 26px;max-width: 260px;min-width: 210px;font-weight: bold;border: none;line-height: 42px;} .dashboardPOP .pay-btn-cost, .dashboardPOP .save_details_btn{font-size: 16px;height: 42px;padding: 0;position: relative;color: #fff;background: #179DD8;border-radius: 26px;max-width: 260px;min-width: 210px;font-weight: bold;border: none;line-height: 1.1;} .details_btn .save_details_btn{ max-width: 200px;min-width: 125px; } .cost-btn, .details_btn {width: 100%;text-align: center; margin-top: 20px;} .summery-details {width: 100%;text-align: center;padding: 0 20px 20px;} #costSummary .summery-details p {font-family: Roboto,Helvetica,Arial,sans-serif; text-align: center;letter-spacing: 0;color: #FFFFFF; opacity: 1;padding: 0px 0px 0px 0px;font-size: 16px;font-weight: 100;} .backcard.lslide {padding-top: 0px;} .backcard-packageItem.Plus.Grande {background: #00b7ae;} .backcard-packageItem .backcardprice {margin-top: 30px;margin-bottom: 14px;font-size: 14px;height: 35px;z-index: 999;position: relative;margin-left: 10px;} .backcard-packageItem .btn-package {background: #006472;color: #fff;border-radius: 18px;font-size: 14px;z-index: 999;padding: 3px 20px;border: #fff solid 1px;float: right;} .backcard-packageItem.Plus .btn-package {background: #006472;} .backcardImg {position: absolute;right: 0px;bottom: 50px;z-index: 99;height: 200px;} .backcard .bottomBar {background: rgba(0,0,0,0.5);padding: 15px 10px;min-height: 50px;margin-left: -15px;margin-right: -15px;} .backcard-packageItem {background: #a8b3b8;margin-top: 50px;width: 270px !important;margin: 0;border-radius: 5px;padding: 15px 0px;position: relative;background: #000000;min-height: 180px;color: #fff;padding-bottom: 0px;margin: 0 auto;} .backcard-packageItem .icon-pack {font-size: 2em;padding: 0 15px;} .selected-package{position: relative;z-index: 999;margin-left: 4em;top: 5em;padding: 0 15px;} .back-package{position: absolute;z-index: 8;margin-left: 7em;opacity: .8;/*filter:blur(1px);*/} /*.back-package .backcard-packageItem.Compact.Plus {width: 220px !important; min-height: 150px;} .back-package .backcardprice {height: 20px ;}*/ .back-package .bottomBar {min-height: 20px;} .back-package .backcardImg { bottom: 30px; height: 175px;} img.back-icon-img {position: absolute;top: 7.7em;left: 1.3em;z-index: 9999;} .package-selection img.back-icon-img {top: 10em;left: 5em;} .package-change-bottom-section .change-btn {text-align: center;display: block;border: none;border-radius: 35px;margin: 20px auto;} .card-img-overlay a:hover{color: #23527c;} span.date-no {font-weight: 600;} /*****************Change package *******************/ #updateDetailsModel h4.modal-title, #changepackageModal h4.modal-title {padding: 10px;border-bottom: none;text-align: center;font-size: 35px;font-family: Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 600;} #changepackageModal span.smartcard1 {font-size: 15px;font-weight: 300;} #changepackageModal span.smat-text {font-weight: 300;} #changepackageModal span.smat-number {font-weight: bold;} #changepackageModal button.close, #currentpackageModal button.close, #costSummary button.close{font-size: 30px;font-weight: 200;} .icon-background-img {background: #008A3B;width: 20px;height: 20px;border-radius: 20px;padding: 3px;margin: 0 5px;} /********************************************* Current PAckage POPUP **********************************************/ @media only screen and (min-width: 768px){#currentpackageModal .modal-content button.close {top: -20px;right: -15px;} } .col-lg-4.col-xs-4.col-sm-4.col-md-4.addOnPackage-info .package-name-font {font-size: 30px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second {text-align: left;padding-left: 45px;} .col-lg-8.col-xs-8.col-sm-8.col-md-8.addOnPackage-details {text-align: left;padding-left: 45px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-first {line-height: 20px;} #currentpackageModal .current-package-info-text{ text-align: center;font: Light 18px/22px Roboto;letter-spacing: 0;color: #FFFFFF;opacity: 0.7 !important;padding: 10px 50px 10px 65px;} .smartcardStatus img.icon-background-img {border: 0;background-color: red;height: 20px;width: 20px;background-color: green;border-radius: 50%;display: inline-block;} #currentpackageModal .modal-body.second-pop-up {position: relative;padding: 0px;padding: 0px 40px 0px 40px;} #currentpackageModal .third-top-package-info-card.col-lg-12 { padding: 10px 10px 10px 10px; text-align: center;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;} #currentpackageModal .modal-body.second-pop-up img.icon-background-img-card {margin-left: 10px;} .modal-body.second-pop-up .second-top-package-info {padding: 4px 0px 0px 0px;} #currentpackageModal .first-top-package-info-card.col-lg-12 {background-color: #373635; padding: 0px 0px 0px 0px;text-align: center;border-top-right-radius: 5px;border-top-left-radius: 5px;} #currentpackageModal .third-top-package-info.forth-top-info.col-lg-12 {background-color: #373635; padding: 12px 12px 12px 12px;text-align: center;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;} #currentpackageModal .modal-body.second-pop-up img.icon-background-img-card-section {margin-right: 10px;height: 25px; margin-top: -20px;width: 25px;} .modal-body.second-pop-up .package-info-left-card.col-lg-6 {text-align: left;margin-top: 13px;} .modal-body.second-pop-up .col-lg-6.addOnPackage-details-info {text-align: left;background: #de7c00 url(/media/6659/button-pattern.png) no-repeat right center;background-size: 22px;border-radius: 0 5px 0 0;} .modal-body.second-pop-up span.number-info {font-weight: bold;} .modal-body.second-pop-up span.smartcard1 {font-size: 15px;} .modal-body.second-pop-up .third-top-package-info.col-lg-12 {padding: 15px 15px 10px 10px;} @media only screen and (min-width: 320px) and (max-width: 350px){ .modal-body.second-pop-up span.package-price, span.package-amount {margin-left: 10px;font-size: 16px;letter-spacing: 0px;} .modal-body.second-pop-up .addOntext {text-align: left;font-size: 12px;} } @media only screen and (min-width: 320px) and (max-width: 667px) { .dashboard-page button.close {top: -5px !important;right: 2px !important;} #costSummary img.back-icon-img {position: absolute;top: 10em;left: 3em;height: 20%;width: 20%;} #changepackageModal .number, #currentpackageModal .number{font-size: medium;font-weight: 400;} #costSummary .cost-details.row {padding: 20px 5px;} .details-info-text, .details-info-price {padding: 0px 10px !important;} .package-info-left-card .package-name-font {font-size: 26px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-first .smartcard1 {padding-left: 15px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.addOnPackage-info .package-name-font {font-size: 25px !important;} #updateDetailsModel .modal-header h4, #changepackageModal .modal-header h4, #costSummary .modal-header h4, #currentpackageModal .modal-header h4{ font-size:30px;} .modal-body.second-pop-up .col-lg-6.addOnPackage-details-info, #changepackageModal .col-lg-6.addOnPackage-details-info{text-align: center;margin-top: 0px; padding:5px;} #changepackageModal button.close, #currentpackageModal button.close, #costSummary button.close{font-size: 12px;font-weight: 100;} .modal-body.second-pop-up span.number-info {margin-left: 10px;} #changepackageModal .package-info-left.col-lg-6 {top: 6px;text-align: center;} #changepackageModal .smartcard, #currentpackageModal .smartcard {font-size: small;font-weight: 300;} .modal-body.second-pop-up .smartcardStatus img.icon-background-img {margin-left: 10px;} .modal-body.second-pop-up span.smartcardStatus, #changepackageModal span.smartcardStatus{} .modal-body.second-pop-up .addOn-info, #changepackageModal .addOn-info{font-size: medium;font-weight: 400;} .modal-body.second-pop-up .col-lg-4.second-top-second, #changepackageModal .col-lg-4.second-top-second { padding-left: 25px;} .modal-body.second-pop-up .col-lg-4.second-top-first, #changepackageModal .col-lg-4.second-top-first { } .modal-body.second-pop-up .col-lg-4.addOnPackage-info, #changepackageModal .col-lg-4.addOnPackage-info { text-align: center;} .modal-body.second-pop-up .col-lg-8.addOnPackage-details, #changepackageModal .col-lg-8.addOnPackage-details{text-align: center;padding: 8px 0;} .modal-body.second-pop-up .package-info-left-card.col-lg-6, #changepackageModal .package-info-left-card.col-lg-6{text-align: center;} .dashboard-page .modal-content .modal-header button.close, #updateDetailsModel .modal-content .modal-header button.close, #currentpackageModal .modal-content .modal-header button.close ,#changepackageModal .modal-content .modal-header button.close, #costSummary .modal-content .modal-header button.close{top: 0px;} .main-top-payment-info .pay-btn-section {position: inherit;top: 0%;text-align: center;} .main-top-payment-info .custom-details-sec {float: none;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {left: 0px;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {border-bottom-left-radius: 20px;border-top-left-radius: 20px;} } @media only screen and (min-width: 351px) and (max-width: 667px){ .modal-body.second-pop-up span.package-price, span.package-amount, #changepackageModal span.package-price, span.package-amount {margin-left: 10px;font-size: 16px;letter-spacing: 2px;} .modal-body.second-pop-up span.package-text-price, span.package-text-amount, #changepackageModal span.package-text-price, span.package-text-amount{letter-spacing: 2px;} } @media only screen and (min-width: 768px){#costSummary .modal-content button.close {top: -20px;} } #changepackageModal .container { width: 600px; margin: 100px auto; } .modal-header .progressbar, #changepackageModal .progressbar, #costSummary .progressbar{ counter-reset: step; padding: 15px 10px 15px 10px; } .modal-header .progressbar li, #costSummary .progressbar li, #costSummaryAddon .progressbar li{ list-style-type: none; width: 32%; float: left; font-size: 12px; position: relative; z-index: 1; text-align: center; text-transform: uppercase; color: #7d7d7d; } .modal-header .progressbar li:before{ width: 15px; height: 15px; content: close-quote; counter-increment: step; line-height: 30px; border: 7px solid #7d7d7d; display: block; text-align: center; margin: 0 auto 10px auto; border-radius: 50%; background-color: white;} .modal-header .progressbar li:before{ width: 15px; height: 15px; content: close-quote; counter-increment: step; line-height: 30px; display: block; text-align: center; margin: 0 auto 10px auto; border-radius: 50%; background-color: white; } .modal-header .progressbar li:after{ width: 100%;height: 2px;content: '';position: absolute;background-color: #7d7d7d;top: 7px;left: -47%;z-index: -1; } .modal-header .progressbar li:first-child:after { content: none; } .modal-header .progressbar li.active { color: white; z-index: 11; } .modal-header .progressbar li.active:before{ border-color: white; } #costSummary .modal-header .progressbar li.active:after{ background-color: #fff; } .modal-header .progressbar li.active + li:after{background-color: gray;z-index: -1; } #changepackageModal p.package-price, #changepackageModal p.package-amount{font-weight: 700;color: #fff;text-align: center;line-height: 0px;opacity:1;} #changepackageModal p.package-text-price, #changepackageModal p.package-text-amount{text-align: center;opacity: 1;font-size: 15px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-text-price {/* text-align: left; */font-size: 14px;letter-spacing: 0;color: #FFFFFF;opacity: 1;font-weight: 100;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-price {font-size: 14px;letter-spacing: 0;color: #FFFFFF;font-weight: bold;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-text-amount {font-size: 14px;letter-spacing: 0;color: #FFFFFF;opacity: 1;font-weight: 100;} .pricePerMonth {font-weight: 100;} .smartcard1 {font-weight: 100;} .smat-text {font-weight: 100;} .smartcard1.decoder-name{font-weight: 700;} .package-text-amount.price-bten{ padding-top: 10px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-amount {font-size: 14px;letter-spacing: 0;color: #FFFFFF;font-weight: bold;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-first .smartcard1 {font-size: 14px;text-align: left;padding-left: 35px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-third .Status-info {font-size: 14px;font-weight: bold;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-third.smartcardStatus {font-size: 14px;} @media only screen and (min-width: 320px) and (max-width: 667px) { .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-text-price {font-size: 14px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second {padding-left: 30px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-price {font-size: 14px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-text-amount {font-size: 13px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-second .package-amount {font-size: 14px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-first .smartcard1 {font-size: 13px; padding-left: 15px;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-third .Status-info {font-size: 14px;font-weight: bold;} .col-lg-4.col-xs-4.col-sm-4.col-md-4.second-top-third.smartcardStatus {font-size: 14px;} .package-info-left.col-lg-5 .package-name-font {font-size: 30px;} .package-change-bottom-section h2 { font-size: 25px;} #changepackageModal .package-list-premium {font-size: 20px;top: 0px;position: relative;left: 10px;} } @media only screen and (min-width: 320px) and (max-width: 350px) { .package-info-right img {width: 33%;top: -13px;left: -36px;} } @media only screen and (min-width: 351px) and (max-width: 400px) { .package-info-right img {width: 30%;top: -15px;left: -43px;} } @media only screen and (min-width: 401px) and (max-width: 450px) { .package-info-right img {width: 29%;top: -22px;left: -43px;} .package-selection .back-package { margin-left: 2em;} .package-selection .selected-package { top: 3em;} #costSummary img.back-icon-img {left: 1em;} } @media only screen and (min-width: 451px) and (max-width: 500px) { .package-info-right img {width: 26%;top: -21px;} .package-selection .back-package { margin-left: 2em;} .package-selection .selected-package { top: 3em;} #costSummary img.back-icon-img {left: 1em;} } @media only screen and (min-width: 550px) and (max-width: 600px){#costSummary img.back-icon-img {left: 5em;} } @media only screen and (min-width: 600px) and (max-width: 766px) { .package-info-right img {width: 18%;z-index: 99;position: absolute;top: -22px;} } .right-packagelist-section.col-lg-7.col-xs-7.col-sm-7.col-md-7 .smat-number {font-size: 14px;font-weight: bold;text-align: left;padding-left: 20px;} .right-packagelist-section.col-lg-7.col-xs-7.col-sm-7.col-md-7 .smat-text { text-align: left; padding-left: 20px; font-size: large; line-height: 10px; margin-top: 18px; } @media only screen and (min-width: 320px) and (max-width: 767px) { .right-packagelist-section.col-lg-7.col-xs-7.col-sm-7.col-md-7 .smat-number {font-size: 12px;} .right-packagelist-section.col-lg-7.col-xs-7.col-sm-7.col-md-7 .smat-text {text-align: left;padding-left: 20px;font-size: 14px;margin-top: 9px;} #currentpackageModal .modal-body.second-pop-up {position: relative;padding: 0px;padding: 0px 0px 0px 0px;} #currentpackageModal .package-name-font {font-size: 25px;} #currentpackageModal .current-package-info-text {padding: 0px 0px 0px 0px;} #costSummary .back-package .backcard-packageItem.Compact.Plus {width: unset;min-height: 150px;} } @media only screen and (min-width: 320px) and (max-width: 380px) { .package-selection .back-package { margin-left: 1em;} .package-selection .selected-package {margin-left: 3em;} .package-selection .back-package .backcard-packageItem.Compact.Plus {width: 210px !important;} .package-selection .backcard-packageItem {width: 240px !important;} #costSummary .package-selection img.back-icon-img { top: 7.2em; left: 1px; height: 20%; width: 29%; z-index: 9999; } #changepackageModal .smartcard, #currentpackageModal .smartcard {top:0px;} } /************************************ Package Addon CSS ************************************/ .addon-icon-img{position: absolute;top: 11em;width: 50px;left: 3em;z-index: 999;} #costSummaryAddon .addon-icon-img{left:8em;} #costSummaryAddon .back-package{margin-left:8em;} .details-info {border-image: linear-gradient(270deg, #6CDFF6 2%, #00000000 100%) 0% 0% 5%;border-width: 1px;padding: 20px 15px;border-style: solid;border: none;background: rgb(255, 255, 255, 4%);margin: 0 auto 13px;} .details-info:last-child {border: none;} #costSummaryAddon .modal-header .modal-title{padding: 15px;border-bottom: none;text-align: center;font-size:35px;font-family:Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 100;} .bottom-section-addon{height: 400px;overflow: hidden;position: relative; float: left;} .bottom-section-addon.fullHeight {height: auto;} .dashboard-page .modal-header .modal-title {padding: 15px;border-bottom: none;text-align: center;font-size:35px;font-family:Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 600;} .dashboard-page .modal-header{border-bottom: none;} /********************************* End **********************************/ .alert-msg, .alert-msg-success{width: 100%;display: block;text-align: center;float:left; margin: 6em 0px;} #successMessageModal .alert-msg-success{margin: 20px 0px;} .alert-msg .icon-icon-warning, .alert-msg-success .icon-icon-warning{font-size: 8em;color: red;} .icon-icon-tick{font-size: 3em;color: #fff;font-weight: 800 !important;background: #50A146;width: 1.5em !important;height: 1.5em;margin: 0 auto;border-radius: 70px;padding: 12px;} .backcard-packageItem .bottomBar {background: rgba(0,0,0,0.5);padding: 10px 15px;min-height: 0px;margin-left: 0px;margin-right: 0px;width: 100%;text-align: left;font-weight: 300;float: left;height: 46px;} .alert-msg span, .alert-msg-success span{ width: 100%; display: inline-block; margin: 0px; } #errorMessageModal .alert-msg span.response-icon { padding: 20px; } .pay-success-msg {color: #50A146;} .btn.anim-btn.btn-default.ok-btn.close { opacity: 1;display: block;text-align: center;margin: 2em auto;border-radius: 20px;padding: 6px 30px;min-width: 180px;width: 180px !important;float: none;} .error-note {font-size: 16px; margin: 30px 0px;padding: 10px;margin-top: 10px !important;} .error-wrong-msg { font-size: 24px;} .pay-success-msg { font-size: 26px; margin: 35px 0px;} .date-area{width: 100%;display: block;float: left;text-align: left;background: transparent url(/media/8200/rectangle-5623-1.svg) 35% 95% no-repeat padding-box;margin-bottom: 30px; padding: 30px;} .date-area span {font-size: 16px;margin-bottom: 0px;font-weight: lighter;} .left-packagelist-section {text-align: left;} .btn.anim-btn.btn-default.view-chg-btn{ opacity: 1;display: block;text-align: center;margin: 4em auto;border-radius: 20px;padding: 6px 30px;min-width: 180px;width: 180px !important;float: none; } .alert-msg-success .backcard-packageItem .backcardprice {float: left;width: 100%;text-align: left;padding: 0px 15px;} .alert-msg-success .backcard-packageItem .icon-pack {text-align: left;float: left;padding: 0px 15px;} .bottomBar i.icon-pack {font-size: 24px;padding-top: 4px;} .alert-msg-success .backcard-packageItem {margin-top: 5em; } img.add-icon {width: 27px;float: left;margin: 0px 15px 0px 0px;} .date-sec {width: 270px;margin: 0 auto;} .fullHeight img{-webkit-transform: rotate(180deg); /* Chrome and other webkit browsers */ -moz-transform: rotate(180deg);/* FF */ -o-transform: rotate(180deg); /* Opera */ -ms-transform: rotate(180deg); /* IE9 */ transform: rotate(180deg); /* W3C compliant browsers */ } .backcard-packageItem.Compact.Plus, .backcard-packageItem.COMPLE36, .backcard-packageItem.COMPLS20 { background: transparent linear-gradient(245deg, #00ACBD 0%, #000000 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.PRME36, .backcard-packageItem.PREPRTSE36 , .backcard-packageItem.PRMS20, .backcard-packageItem.PRWASIE36, .backcard-packageItem.PREE36, .backcard-packageItem.Premium, .backcard-packageItem.PRWE36, .backcard-packageItem.PRM { background: #495965; } .backcard-packageItem.MINIBS20, .backcard-packageItem.IS20MINIBS20, .backcard-packageItem.Compact, .backcard-packageItem.COMPE36, .backcard-packageItem.COMPS20 { background: transparent linear-gradient(245deg, #FCB515 0%, #5C430C 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Confam, .backcard-packageItem.NNJ2E36 { background: transparent linear-gradient(246deg, #D41E79 0%, #4D0127 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Yanga, .backcard-packageItem.NNJ1E36 { background: transparent linear-gradient(245deg, #51A13B 0%, #0B3400 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.ASIME36, .backcard-packageItem.India, .backcard-packageItem.ASIA1S20, .backcard-packageItem.ASIADDE36, .backcard-packageItem.ASIA3KU, .backcard-packageItem.ASIAE36 , .backcard-packageItem.Asian{ background: transparent linear-gradient(245deg, #FFC124 0%, #725200 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.French.touch, .backcard-packageItem.FRN15E36 { background: #210f0c; } .backcard-packageItem.Family, .backcard-packageItem.COFAME36, .backcard-packageItem.COFAMS20 { background: transparent linear-gradient(245deg, #EE3780 0%, #26000F 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Access, .backcard-packageItem.ACSSE36, .backcard-packageItem.ACSSS20 { background: transparent linear-gradient(244deg, #00AB4E 0%, #000804 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Grande, .backcard-packageItem.COMPTE36 { background: #FCB515; } .backcard-packageItem.Grande.plus, .backcard-packageItem.PTPLSE36 { background: #00ACBD; } .backcard-packageItem.Bue, .backcard-packageItem.PORBDDE36, .backcard-packageItem.BUEPE36, .backcard-packageItem.E36BUEPE36 { background: #ef3a37; } .backcard-packageItem.French-Plus, .backcard-packageItem.FRN7E36 { background: transparent linear-gradient(246deg, #9C50AA 0%, #2D1033 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Mega, .backcard-packageItem.PREPRTS, .backcard-packageItem.PRWPRTSE36 { background: #cd539e; } .backcard-packageItem.Facil, .backcard-packageItem.PTACSE36 { background: #07aa4d; } .backcard-packageItem.Familia, .backcard-packageItem.PTFAME36 { background: #EE3780; } .backcard-packageItem.French, .backcard-packageItem.PREFRNSE36 { background: #ef3a37; } .backcard-packageItem.Basico, .backcard-packageItem.PTBASE36 { background: transparent linear-gradient(245deg, #CCCBCA 0%, #191919 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Padi, .backcard-packageItem.NLTESE36 { background: transparent linear-gradient(246deg, #1390D2 0%, #000A0F 100%) 0% 0% no-repeat padding-box; } .backcard-packageItem.Lite, .backcard-packageItem.LITES20 { background: #c1921c; } .second-top-package-info.Mega{background: #cd539e;} .second-top-package-info.French-Plus{background: transparent linear-gradient(246deg, #9C50AA40 0%, #2D10334d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Bue, .second-top-package-info.E36BUEPE36, .second-top-package-info.BUEPE36{background:#ef3a37;} .second-top-package-info.Grande{background: #FCB515;} .second-top-package-info.Access, .second-top-package-info.ACSSS20{background: transparent linear-gradient(244deg, #00AB4E40 0%, #0008044d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Family{background: transparent linear-gradient(245deg, #EE378040 0%, #26000F4d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.French.touch{background: transparent linear-gradient(245deg, #CC4F3B40 0%, #4D11084d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.India, .second-top-package-info.ASIADDE36, .second-top-package-info.Asian, .second-top-package-info.ASIAE36{background: transparent linear-gradient(245deg, #FFC12440 0%, #7252004d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Yanga{background: transparent linear-gradient(245deg, #51A13B40 0%, #0B34004d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Confam{background: transparent linear-gradient(246deg, #D41E7940 0%, #4D01274d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Compact, .second-top-package-info.MINIBS20{background: transparent linear-gradient(245deg, #FCB51540 0%, #5C430C4d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Compact.Plus{background: transparent linear-gradient(245deg, #00ACBD40 0%, #0000004d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Basico {background: transparent linear-gradient(245deg, #CCCBCA40 0%, #1919194d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.French{background: #ef3a37;} .second-top-package-info.Facil{ background: #07aa4d;} .second-top-package-info.Grande.Plus{background: #00ACBD;} .second-top-package-info.Premium{background: transparent linear-gradient(245deg, #49596540 0%, #0b0b0b4d 100%) 0% 0% no-repeat padding-box;background: rgb(255, 255, 255, .05);backdrop-filter: blur(6px);} .second-top-package-info.Great.Wall{background: transparent linear-gradient(245deg, #CC1F2740 0%, #5803074d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Padi, .second-top-package-info.NLTESE36{background: transparent linear-gradient(246deg, #1390D240 0%, #000A0F4d 100%) 0% 0% no-repeat padding-box;} .second-top-package-info.Lite, .second-top-package-info.LITES20{background: #c1921c;} .back-package .backcard-packageItem {min-height: 180px;/*transform: scale(.9);left: -30px;*/} .showmaxPopup .back-package .backcard-packageItem {min-height: 160px;left: -10px;} .backcard-packageItem .backgroundimg{ height: 100%; width: 100%; position: absolute; bottom: 45px; background-size: 60%; background-repeat: no-repeat; left: 0; right: 0; background-position: top right; } .package-info-right .backgroundimg{ height: 110px; width: 50%; position: absolute; bottom: 0; background-size: 64%; background-repeat: no-repeat; left: -80px; right: 0; background-position: left; top: -38px; z-index: 99999; } .Compact.Plus .backgroundimg, .backcard-packageItem.COMPLE36 .backgroundimg, .backcard-packageItem.COMPLS20 .backgroundimg{ background-image: url(/media/7289/compactplus.png); } .PRME36 .backgroundimg, .PREPRTSE36 .backgroundimg, .PRMS20 .backgroundimg, .backcard-packageItem.PREE36 .backgroundimg, .backcard-packageItem.PRWPRTSE36 .backgroundimg, .Premium .backgroundimg, .backcard-packageItem.PRWASIE36 .backgroundimg, .backcard-packageItem.PRWE36 .backgroundimg{ background-image: url(/media/8474/premium.png); } .IS20MINIBS20 .backgroundimg, .MINIBS20 .backgroundimg, .Compact .backgroundimg, .backcard-packageItem.COMPS20 .backgroundimg, .backcard-packageItem.COMPKU .backgroundimg, .backcard-packageItem.COMPE36 .backgroundimg{ background-image: url(/media/8473/compact.png); } .Yanga .backgroundimg, .backcard-packageItem.NNJ1E36 .backgroundimg{ background-image: url(/media/8680/yanga.png); } .ASIME36 .backgroundimg, .India .backgroundimg, .ASIA1S20 .backgroundimg, .ASIADDE36 .backgroundimg, .backcard-packageItem.ASIA3KU .backgroundimg, .Asian .backgroundimg, .ASIAE36 .backgroundimg{ background-image: url(/media/8475/india.png); } .French.touch .backgroundimg, .backcard-packageItem.FRN15E36 .backgroundimg{ background-image: url(/media/8738/frenchtouch.png); } .Family .backgroundimg, .COFAMS20 .backgroundimg, .backcard-packageItem.FMLY .backgroundimg, .backcard-packageItem.COFAME36 .backgroundimg{ background-image: url(/media/8471/family.png); } .Access .backgroundimg, .backcard-packageItem.ACSSS20 .backgroundimg, .backcard-packageItem.Access .backgroundimg, .backcard-packageItem.ACSSE36 .backgroundimg{ background-image: url(/media/8741/access.png); } .Confam .backgroundimg, .backcard-packageItem.NNJ2E36 .backgroundimg{ background-image: url(/media/8649/confam.png); } .Mega .backgroundimg, .backcard-packageItem.PREPRTS .backgroundimg, .backcard-packageItem.PRWPRTSE36 .backgroundimg { background-image: url(/media/9014/dstv-hero-mega.png); } .Bue .backgroundimg, .PORBDDE36 .backgroundimg, .BUEPE36 .backgroundimg, .backcard-packageItem.BUEPE36 .backgroundimg, .backcard-packageItem.E36BUEPE36 .backgroundimg{ background-image: url(/media/9013/dstv-hero-bue.png); } .Grande.Plus .backgroundimg, .backcard-packageItem.PTPLSE36 .backgroundimg{ background-image: url( /media/8472/compactplus.png); } .Facil .backgroundimg, .backcard-packageItem.PTACSE36 .backgroundimg{ background-image: url( /media/9082/dstv-hero-facil.png); } .French-Plus .backgroundimg, .backcard-packageItem.FRN7E36 .backgroundimg{ background-image: url( /media/8740/frenchplus.png); } .French-Touch .backgroundimg, .backcard-packageItem.FRN15E36 .backgroundimg{ background-image: url( /media/9083/frenchtouch.png); } .French .backgroundimg, .backcard-packageItem.PTBASE36 .backgroundimg, .backcard-packageItem.PREFRNSE36 .backgroundimg{ background-image: url( /media/9083/frenchtouch.png); } .Great.Wall .backgroundimg, .backcard-packageItem.GWALLE36 .backgroundimg{ background-image: url(/media/8720/greatwall.png); } .Familia .backgroundimg, .backcard-packageItem.PTFAME36 .backgroundimg{ background-image: url(/media/8471/family.png); } .Grande .backgroundimg, .backcard-packageItem.COMPTE36 .backgroundimg{ background-image: url(/media/8473/compact.png); } .Basico .backgroundimg, .backcard-packageItem.PTBASE36 .backgroundimg , .PTBASE36 .backgroundimg{ background-image: url(/media/9732/mask-group-13.png); } .Padi .backgroundimg, .backcard-packageItem.NLTESE36 .backgroundimg , .NLTESE36 .backgroundimg{ background-image: url(/media/9083/frenchtouch.png); } .Lite .backgroundimg, .backcard-packageItem.LITES20 .backgroundimg , .LITES20 .backgroundimg{ background-image: url(/media/8473/compact.png); } .right-packagelist-section.BUEPE36, .package-info-right.BUEPE36 .smartcard, .third-top-package-info.BUEPE36 {background: rgba(239, 58, 55, .2) url(/media/8218/family-3x.png) no-repeat right center !important;} .right-packagelist-section.Family, .package-info-right.Family .smartcard, .third-top-package-info.Family {background: rgba(238, 55, 128, .2) url(/media/8218/family-3x.png) no-repeat right center !important;} .right-packagelist-section.MINIBS20, .package-info-right.MINIBS20 .smartcard, .right-packagelist-section.Compact, .package-info-right.Compact .smartcard, .third-top-package-info.Compact {background: rgba(252, 181, 21, .2) url(/media/8216/compact-3x.png) no-repeat right center !important;} .right-packagelist-section.Compact.Plus, .package-info-right.Compact.Plus .smartcard, .third-top-package-info.Compact.Plus {background: rgba(36, 79, 79, .2) url(/media/8215/compact-plus-3x.png) no-repeat right center !important;background-size: auto 100% !important;} .right-packagelist-section.Premium, .package-info-right.Premium .smartcard, .third-top-package-info.Premium{background: rgba(73, 89, 101, .2) url(/media/8222/premium-pattern-3x.png) no-repeat right center !important;} .right-packagelist-section.DStv.Ingles, .package-info-right.DStv.Ingles .smartcard, .third-top-package-info.DStv.Ingles{background: rgba(73, 89, 101, .2) url(/media/8222/premium-pattern-3x.png) no-repeat right center !important;} .right-packagelist-section.Access, .package-info-right.Access .smartcard, .third-top-package-info.Access{background: rgba(37, 74, 40, .2) url(/media/8213/access-3x.png) no-repeat right center !important;} .right-packagelist-section.Yanga, .package-info-right.Yanga .smartcard, .third-top-package-info.Yanga {background: rgba(81, 161, 59, .2) url(/media/8224/yanga-3x.png) no-repeat right center !important;} .right-packagelist-section.Confam, .package-info-right.Confam .smartcard, .third-top-package-info.Confam {background: rgba(212, 30, 121, .2) url(/media/8217/confam-3x.png) no-repeat right center !important;} .package-info-right.Asian .smartcard, .right-packagelist-section.Asian, .third-top-package-info.Asian{background: rgba(221, 192, 84, .2) url(/media/8220/indian-3x.png) no-repeat right center !important;} .package-info-right.Basico .smartcard, .right-packagelist-section.Basico, .third-top-package-info.Basico{background: rgba(73, 85, 94, .2) url(/media/8214/basico-3x.png) no-repeat right center !important;} .package-info-right.Facil .smartcard, .right-packagelist-section.Facil, .third-top-package-info.Facil{ background: rgba(7, 170, 77, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.Indian .smartcard, .right-packagelist-section.Indian, .third-top-package-info.Indian{background: rgba(221, 192, 84, .2) url(/media/8220/indian-3x.png) no-repeat right center !important;} .package-info-right.Grande .smartcard, .right-packagelist-section.Grande, .third-top-package-info.Grande{background: rgba(252, 181, 21, .2) url(/media/8224/yanga-3x.png) no-repeat right center !important;} .package-info-right.Grande.Plus .smartcard, .right-packagelist-section.Grande.Plus, .third-top-package-info.Grande.Plus, .right-packagelist-section.PTPLSE36{background: rgba(0, 172, 189, .2) url(/media/8224/yanga-3x.png) no-repeat right center !important;background-size: auto 100% !important;} .package-info-right.Portuguese .smartcard, .right-packagelist-section.Portuguese, .third-top-package-info.Portuguese{background: rgba(0, 172, 189, .2) url(/media/8224/yanga-3x.png) no-repeat right center !important;background-size: auto 100% !important;} .package-info-right.Familia .smartcard, .right-packagelist-section.Familia, .third-top-package-info.Familia{background: rgba(238, 55, 128, .2) url(/media/8224/yanga-3x.png) no-repeat right center !important;background-size: auto 100% !important;} .package-info-right.French .smartcard, .right-packagelist-section.French, .third-top-package-info.French{background: rgba(239, 58, 55, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.French.Touch .smartcard, .right-packagelist-section.French.Touch, .third-top-package-info.French.Touch{background: rgba(33, 15, 12, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.French.Plus .smartcard, .right-packagelist-section.French.Plus, .third-top-package-info.French.Plus{background: rgba(156, 80, 170, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.Great.Wall .smartcard, .right-packagelist-section.Great.Wall, .third-top-package-info.Great.Wall{background: rgba(204, 31, 39, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.Padi .smartcard, .right-packagelist-section.Padi, .third-top-package-info.Padi{background: rgba(37, 129, 196, .2) url(/media/9832/padi-3x.png) no-repeat right center !important;} .package-info-right.Lite .smartcard, .right-packagelist-section.Lite, .third-top-package-info.LITES20{background: rgba(193, 146, 28, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .package-info-right.Mega .smartcard, .right-packagelist-section.Mega, .third-top-package-info.Mega{background: rgba(206, 82, 158, .2) url(/media/8219/french-touch-3x.png) no-repeat right center !important;} .right-packagelist-section.Compact.Plus{background-size: auto 100%!important;} .package-change-bottom-section .package-list .right-packagelist-section {background-size: auto 100%!important;} .main-top-package-info .package-info-right .smartcard, .modal-body .third-top-package-info, .modal-body .third-top-package-info.French.Plus, .modal-body .third-top-package-info.French.Touch {background-size: auto 100%!important;} .Disconnected img.icon-background-img, .Suspended img.icon-background-img{display: none;} span.icon-icon-warning {font-size: 22px;margin: 0px 5px;padding: 0px 0px;color: yellow;position: relative;top: 3px;} .Active span.icon-icon-warning {display: none;} .backcard a.btn-package { display: none;} @media only screen and (min-width: 768px){ #currentpackageModal .modal-content button.close {top: -20px; right: -15px;} } .details-info-text{width: 50% !important;} .details-info-price {width: 50% !important;top: .5em;} #currentpackageModal .current-package-info-text{ text-align: center; font: Light 18px/22px Roboto; letter-spacing: 0; color: #FFFFFF; opacity: 0.7 !important; padding: 10px 50px 10px 65px;} .smartcardStatus img.icon-background-img {border: 0; background-color: red; height: 20px; width: 20px; background-color: green; border-radius: 50%; display: inline-block;} #currentpackageModal .modal-body.second-pop-up {position: relative; padding: 0px; padding: 0px 40px 0px 40px;} #currentpackageModal .third-top-package-info-card.col-lg-12 { padding: 10px 10px 10px 10px; text-align: center; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;} #currentpackageModal .modal-body.second-pop-up img.icon-background-img-card {margin-left: 10px;} .modal-body.second-pop-up .second-top-package-info {padding: 4px 0px 0px 0px;} #currentpackageModal .first-top-package-info-card.col-lg-12 {background-color: #373635; padding: 17px 12px 7px 12px; text-align: center; border-top-right-radius: 5px; border-top-left-radius: 5px;} #currentpackageModal .third-top-package-info.forth-top-info.col-lg-12 {background-color: #373635; padding: 12px 12px 12px 12px; text-align: center; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px;} #currentpackageModal .modal-body.second-pop-up img.icon-background-img-card-section { margin-right: 10px; height: 25px; margin-top: -20px; width: 25px;} .modal-body.second-pop-up .package-info-left-card.col-lg-6 {text-align: left;} .modal-body.second-pop-up .col-lg-6.addOnPackage-details-info {text-align: left; margin-top: -13px;} .modal-body.second-pop-up span.number-info {font-weight: bold;} .modal-body.second-pop-up span.smartcard1 {font-size: 15px;} .modal-body.second-pop-up .third-top-package-info.col-lg-12 {padding: 15px 15px 10px 10px;} @media only screen and (min-width: 320px) and (max-width: 350px){ .modal-body.second-pop-up span.package-price, span.package-amount { margin-left: 10px;font-size: 16px; letter-spacing: 0px;} .modal-body.second-pop-up .addOntext {text-align: left; font-size: 12px;} } @media only screen and (min-width: 320px) and (max-width: 767px){ .modal-body.second-pop-up .col-lg-6.addOnPackage-details-info {text-align: center; margin-top: 0px; } .modal-body.second-pop-up span.number-info {margin-left: 10px;} .modal-body.second-pop-up .smartcardStatus img.icon-background-img {margin-left: 10px;} .modal-body.second-pop-up span.smartcardStatus {letter-spacing: 2px;} .modal-body.second-pop-up .addOn-info { margin-left: 10px;} .modal-body.second-pop-up .col-lg-4.second-top-second {border: none;} .modal-body.second-pop-up .col-lg-4.second-top-first {border: none;} .modal-body.second-pop-up .col-lg-4.addOnPackage-info { border: none; text-align: center;} .modal-body.second-pop-up .col-lg-8.addOnPackage-details {text-align: center;} .modal-body.second-pop-up .package-info-left-card.col-lg-6 {text-align: center;} #currentpackageModal .modal-content .modal-header button.close{top: 0px;} .main-top-payment-info .pay-btn-section {position: inherit; top: 0%; text-align: center;} .main-top-payment-info .custom-details-sec {float: none;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {left: 0px;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {border-bottom-left-radius: 20px; border-top-left-radius: 20px;} .main-packagelist-section .right-packagelist-section, .main-packagelist-section .left-packagelist-section {height: 50px;} } @media only screen and (min-width: 351px) and (max-width: 667px){ .modal-body.second-pop-up span.package-price, span.package-amount {margin-left: 10px;font-size: 16px;letter-spacing: 2px;} .modal-body.second-pop-up span.package-text-price, span.package-text-amount {letter-spacing: 2px;} } .progressbar { counter-reset: step; } .progressbar li { list-style-type: none; width: 25%; float: left; font-size: 12px; position: relative; text-align: center; text-transform: uppercase; color: #fff; z-index: 1050; } .progressbar li:before { width: 30px; height: 30px; content: counter(step); counter-increment: step; line-height: 30px; border: 2px solid #fff; display: block; text-align: center; margin: 0 auto 10px auto; border-radius: 50%; background-color: white; } .progressbar li:after { width: 100%; height: 2px; content: ''; position: absolute; background-color: #fff; top: 15px; left: -50%; z-index: -1; } .progressbar li:first-child:after { content: none; } .progressbar li.active { color: green; } .progressbar li.active:before { border-color: #fff; } .progressbar li.active + li:after { background-color: #fff; } .progressbar-section { width: 600px; margin: 100px auto; } .modal-header .progressbar li.active.plus + li.active:after {background-color: #fff;} .customer-info-section .form-group fieldset {background: transparent;} .form-group.edit_amount input.form-control.input-lg {padding: 10px 30px;} #paymentModal .modal-dialog .modal-content .modal-header { padding: 0px;} /*Style for Spinner/Loader - Start - Added by Ashim*/ #cpoverlay{ position: fixed; top: 0; z-index: 100; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6);} #addonoverlay{ position: fixed; top: 0; z-index: 100; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6);} #paymentsoverlay{ position: fixed; top: 0; z-index: 100; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6); max-width: 600px;} #boxofficeoverlay{ position: fixed; top: 0; z-index: 100; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6);left: 0px; margin: 0px;} #showmaxoverlay{ position: fixed; top: 0; z-index: 100; width: 100%; height:100%; display: none; background: rgba(0,0,0,0.6); max-width: 600px;} .cv-spinner { height: 100%; display: flex; justify-content: center; align-items: center;} .cpspinner { width: 75px; height: 75px; /*border: 4px #ddd solid;*/ border-top: 4px #2e93e6 solid; border-radius: 50%; animation: sp-anime 0.8s infinite linear;} .showmaxspinner { width: 75px; height: 75px; /*border: 4px #ddd solid;*/ border-top: 4px #E83D8E solid; border-radius: 50%; animation: sp-anime 0.8s infinite linear;} @keyframes sp-anime { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } .is-hide{ display:none;} input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none;-moz-appearance: none;appearance: none;margin: 0;} /*Style for Spinner/Loader - End*/ /*************change package style *************/ .dashboard-page #changepackageModal .modal-dialog {margin: 35px auto;height: auto;} .dashboard-page #addOnPackageModal .modal-dialog {margin: 35px auto;height: auto;} @media only screen and (min-width: 768px){#addOnPackageModal .modal-content button.close {top: -18px;right: -20px;} } .alert-msg-success .date-area .date-sec span.date-text {font-weight: bold;} #packageActionButton img {width: 18%;margin-left: 30px;} /*******************************************************************************************/ .notify-sec .icon-icon-warning.icon-notify {font-size: 8em;color: #f1f179;margin-bottom: 20px;} span.msg-text-notify {font-weight: 100;font-size: 2em;} .notify-msg {margin-bottom: 20px;font-weight: 100;font-size: 16px;margin: 20px auto;} .notify-sec span {width: 100%;margin-bottom: 20px;display: block;float: left;clear: both;} .notify-area {width: 100%;display: block;text-align: center;float: left;margin: 6em 0px;} .notify-close-btn{float: left;width: 100%;display: block;} .btn.anim-btn.btn-default.notify-close {opacity: 1;display: block;text-align: center;margin: 3em auto;border-radius: 20px;padding: 6px 30px;min-width: 180px;width: 180px !important;float: none;} .third-top-package-info .icon-pack {font-size: 27px;} .main-top-package-info .package-info-right {float: right;} /************************************************* Details HTML CSS *******************************************/ .details-coloum span, .contact-coloum span {float: left;width: 100%;} .details-coloum span.jcf-select-form-control{border: none;height: auto;margin-bottom: 0px;} .details_coloums, .contact_coloums {width: 100%;text-align: center;padding: 20px;} .details_coloums span, .contact_coloums span {margin: 20px 25px;border-image: linear-gradient(270deg, #7E8283 0%, #00000000 100%) 0% 0% 5%;border-style: solid;border-width: 1px;padding: 5px;cursor: pointer;} .details_coloums span.active, .contact_coloums span.active {border-image: linear-gradient(270deg, #6CDFF6 2%, #00000000 100%) 0% 0% 5%;} span.person_name_details {text-align: center;display: block;} .update-details-section, .contact-details-section {width: 90%;display: block;margin: 0 auto 30px; padding: 30px;background-color: #000;} .details-rows, .contact-rows {margin-bottom: 20px;border-bottom: 1px solid #131313;} .profile-img-icon{text-align: center;} img.profile_image_user { width: 115px;} #updateDetailsModel .modal-body { padding: 0px 15px 15px;} #updateDetailsModel .modal-header {padding: 0px 15px;border: none;} .details_edit_iocn {width: 20px;margin: 8px;} .details_edit, .contact_edit {float: right;margin-bottom: 20px;width: 35px;height: 35px;background: #777;border-radius: 20px;} /*.details-coloum-value span.jcf-select, .contact-coloum-value span.jcf-select { border: none;}*/ .details-coloum-value span.jcf-select-text, .contact-coloum-value span.jcf-select-text {margin: 0px; padding: 10px;} .details-coloum-value .jcf-select .jcf-select-opener:after, .contact-coloum-value .jcf-select .jcf-select-opener:after{content: none;} span.details-coloum-value , span.contact-coloum-value { color: #00aeef;} .details-coloum-value, .contact-coloum-value{ color: #5B5d5d;background-color: transparent;border: none;font-size: 14px;margin: 0px;padding: 0px;} .main-top-Details-info .jcf-select .jcf-select-text { font-weight: normal;color: #5B5d5d;text-transform: capitalize; font-size: 14px;padding: 0px;} @media only screen and (min-width: 320px) and (max-width: 767px){body.dashboard-page #updateDetailsModel .modal-dialog {margin: 0px auto;} .modal#updateDetailsModel .modal-content {border: none;} .main-top-Details-info .update-details-section {width: 100%;margin: 0 auto 30px;padding: 30px 20px;} .main-top-Details-info .details_coloums {padding: 20px 0px;} .main-top-Details-info .contact-details-section {width: 100%;} .main-top-Details-info .update-details-section, .main-top-Details-info .contact-details-section {padding: 15px;} } .modal#updateDetailsModel .modal-content{padding: 0px 0px;} #updateDetailsModel h4.modal-title{padding: 10px;border-bottom: none;text-align: center;font-size: 35px;font-family: Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 100;} .details_btn .save_details_btn, .details_btn .back_details_btn {max-width: 200px;min-width: 125px;padding: 0px;} .save_details_btn{float:right;} .details_btn .back_details_btn {float:left; background-color: transparent; border: 1px solid #ccc;} .save_details_btn, .back_details_btn {font-size: 16px;height: 42px;padding: 0 6px 0 20px;position: relative;color: #fff;background: #179DD8;border-radius: 26px;max-width: 260px;min-width: 210px;font-weight: bold;border: none;} .details_btn {width: 90%;text-align: center;margin: 0px auto 30px;padding-bottom: 20px; opacity: 0.5; cursor: not-allowed;pointer-events: none;} .response-end .update-done-btn {background: #fff;border: none;max-width: 225px;color: #444;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: center;padding: 0 30px;height: 50px;width: 100%;text-transform: uppercase;font-weight: 700;letter-spacing: 1px; border-radius: 47px;} .modal-content .response-end.success-update h4 {color: #B1D89C;margin-top: 30px;} .dashboard-page #updateDetailsModel .modal-dialog {margin: 35px auto;} /***************************** End **********************************/ /************************************************ Payment Siute Failure ********************************************/ .response-end {text-align: center;} .modal-content h1 {line-height: normal; text-align: center;font-size: 35px !important;font-weight: 300; margin: 0 0 10px;} #paymentModal .modal-content h4 {text-align: center;font-size: 20px !important;font-weight: 300;} #paymentModal .modal-content .response-end h4 {font-size: 32px !important;margin: 40px auto;line-height: normal;} .response-end.failed h5 {color: #B61C0E;} .modal-content .response-end p {max-width: 460px;margin: 0 auto;opacity: 1;font-weight: 400;} .response-end .dppinnerwrap.details {border-top: 1px solid #6f6f6f;border-bottom: 1px solid #6f6f6f;padding: 20px 0;margin: 20px auto 30px;} .dppinnerwrap.details {display: block;clear: both;width: 100%;padding: 30px 0 40px;float: left;border-top: 1px solid #505050;} .batched {width: 80%;clear: both;display: block;margin: 0 auto;} .response-end .details .field-title {max-width: 50%;display: inline-block;float: left;width: 50%;margin: 0 0 6px;text-align: right;padding-right: 10px;} .details .field-title {max-width: 50%;display: inline-block;float: left;width: 50%;margin: 0 0 6px;font-size: 16px;text-align: left;} .response-end .details .field-value {max-width: 50%;display: inline-block;float: right;width: 50%;text-align: left;font-weight: 900;margin: 0 0 6px;color: #B1D89C;} .details .field-value {max-width: 50%;display: inline-block;float: right;width: 50%;text-align: right;font-weight: 900;margin: 0 0 6px;font-size: 18px;} .response-end.failed .details .field-value:nth-of-type(3n) {color: #B61C0E;} .response-end.failed #cancel.dpp-pay-btn {background: transparent;border: 1px solid #fff;max-width: 225px;color: #fff;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} .response-end.failed .dpp-pay-btn {margin: 0 20px !important;} .dpp-pay-btn:before { content: "\e949";font-size: 30px;width: 20px;height: 20px;display: inline-block;float: right;font-family: 'dstvFont' !important;} .dpp-pay-btn {background: #FFFFFF;border: 1px solid #707070;border-radius: 100px;max-width: 225px;color: #444444;margin: 0 auto !important;float: none !important;font-size: 18px;height: 50px;width: 100%;text-transform: uppercase;font-weight: 700;letter-spacing: 1px;} .response-end .dpp-pay-btn {background: #fff;border: none;max-width: 225px;color: #444;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} /**************************************** Payment suite Pending ********************************************/ .response-end.pending h1.response-icon:before {color: #E5C026;content: "\e931";font-family: 'dstvFont' !important;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;} .response-end.pending h5 {color: #E5C026;} .response-end.pending .details .field-value:nth-of-type(3n) {color: #E5C026;} .response-end.pending .dpp-pay-btn {background: transparent;border: 1px solid #fff;max-width: 225px;color: #fff;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} .modal-content .response-end.success h4 {color: #B1D89C;} a.svg-holder-link {overflow: visible !important;max-width: unset !important;width: 220px !important;} .feedback-unit.wa-link .smiley-icon a.svg-holder-link {width: 65px !important;height: 65px !important;} .feedback-unit.wa-link .smiley-icon a.svg-holder-link svg {text-shadow: 6px 9px 60px #000 !important;} .feedback-unit .smiley-icon, .feedback-unit .smiley-icon:hover, .feedback-unit .smiley-icon:focus, button.open-button.live-chat, button.open-button.live-chat:hover, button.open-button.live-chat:focus {background: none !important;height: 65px;animation: shake ease-in-out 4s infinite alternate;transform: translate3d(0, 0, 0);backface-visibility: hidden;perspective: 1000px;/* animation-iteration-count: 3; */} @keyframes shake { 0% {transform: translate3d(-1px, 0, 0); } 1% {transform: translate3d(2px, 0, 0); } 2% {transform: translate3d(-1px, 0, 0); } 3% {transform: translate3d(2px, 0, 0); } 4% {transform: translate3d(-1px, 0, 0); } 100% {transform: translate3d(-1px, 0, 0); } } .feedback-unit.wa-link {left: 0;right: auto;bottom: 20px;width: auto !important;height: 65px !important;} .smiley-icon {left: 20px;right: auto;width: auto !important;height: 65px !important;} .feedback-unit.wa-link .smiley-icon a.svg-holder-link:before {} .feedback-unit.wa-link .smiley-icon a.svg-holder-link:before {display: none;} @media only screen and (min-width: 768px) { .NewDstvPage .banner-content img {max-width: 31vw !important;max-height: 31vh !important;width:auto !important;height:auto !important;} } /********************************************* Full width popup ***********************************************/ body .dashboardPOP .modal-body { margin: 20px auto; display: block; max-width: 600px;} body .dashboardPOP .modal-dialog {width: 100%; margin: 5px auto !important;} body .dashboardPOP .modal-dialog .modal-content { border: none !important;} body .dashboardPOP .modal-content .modal-header button.close, .dashboard-page .dashboardPOP .modal-content button.close {top: -20px !important;right: 0px !important;background-color: transparent !important;color: #ccc !important; margin-top: 0px;} .dashboardPOP .modal-content .modal-header {padding: 25px 15px;} html body.dashboard-page .dashboardPOP#boxOfficeModal.modal .modal-content button.close, body.dashboard-page .dashboardPOP#topupModalPopup .modal-content button.close, body.dashboard-page .dashboardPOP#rentNowModalPopup .modal-content button.close{top: -20px !important;right: 0px !important;background-color: transparent !important;color: #ccc !important; margin-top: 0px;} @media only screen and (min-width: 320px) and (max-width: 767px){html body .dashboardPOP .modal-content .modal-header button.close { top: 0px !important;} .dashboardModal.dashboardPOP .webform.container.modal-dialog.modal-lg.feedback-dialog {top: 0vh;} } .dashboardPOP#changepackageModal .modal-header, .dashboardPOP#addOnPackageModal .modal-header{max-width: 600px;margin: 0 auto;display: block;} body .dashboardPOP#dashboardModelFixError .modal-body, body .dashboardPOP#boxOfficeModal .modal-body {max-width: 900px; height: 100%;display: block;} body .dashboardPOP#rentNowModalPopup .modal-body {margin: 50px auto;display: block;max-width: 600px;background: #fff;height: auto;} body .dashboardPOP#rentNowModalPopup .modal-content {background: none;} body .dashboardPOP#dashboardModelFixError .modal-dialog .modal-content, body .dashboardPOP#dashboardModelFixError .modal-body, body .dashboardPOP#dashboardModelFixError .modal-dialog{/*height: auto;*/} /**************************************************** End ****************************************************/ /************************************************* Details HTML CSS *******************************************/ #updateDetailsModel .modal-content{background: rgba(95, 95, 95, 0.10);width: 100%;float: left;padding: 0px 0px 0px;border: 1px solid #707070;backdrop-filter: blur(3px); display: inline-table;} .details-coloum span, .contact-coloum span {float: left;width: 100%;} .dashboardPOP .modal-content .main-top-Details-info .details-coloum span.jcf-select-form-control{border: none;height: auto;margin-bottom: 0px;} .details_coloums, .contact_coloums {width: 100%;text-align: center;padding: 20px;} .details_coloums span, .contact_coloums span {margin: 20px 25px;border-image: linear-gradient(270deg, #7E8283 0%, #00000000 100%) 0% 0% 5%;border-style: solid;border-width: 1px;padding: 5px;cursor: pointer;} .details_coloums span.active, .contact_coloums span.active {border-image: linear-gradient(270deg, #6CDFF6 2%, #00000000 100%) 0% 0% 5%;} span.person_name_details {text-align: center;display: block;} .update-details-section, .contact-details-section {width: 90%;display: block;margin: 0 auto 30px; padding: 30px;background-color: #000;} .details-rows, .contact-rows {margin-bottom: 20px;border-bottom: 1px solid #131313;} .profile-img-icon{text-align: center;} img.profile_image_user { width: 115px;} #updateDetailsModel .modal-body { padding: 0px 15px 15px;} #updateDetailsModel .modal-header {padding: 0px 15px;border: none;} .details_edit_iocn {width: 20px;margin: 8px;} .details_edit, .contact_edit {float: right;margin-bottom: 20px;width: 35px;height: 35px;background: #777;border-radius: 20px;} /*.details-coloum-value span.jcf-select, .contact-coloum-value span.jcf-select { border: none;}*/ .details-coloum-value span.jcf-select-text, .contact-coloum-value span.jcf-select-text {margin: 0px; padding: 10px;} .details-coloum-value .jcf-select .jcf-select-opener:after, .contact-coloum-value .jcf-select .jcf-select-opener:after{content: none;} span.details-coloum-value , span.contact-coloum-value { color: #00aeef;} .details-coloum-value, .contact-coloum-value{ color: #5B5d5d;background-color: transparent;border: none;font-size: 14px;margin: 0px;padding: 0px;} .main-top-Details-info .jcf-select .jcf-select-text { font-weight: normal;color: #5B5d5d;text-transform: capitalize; font-size: 14px;padding: 0px;} @media only screen and (min-width: 320px) and (max-width: 767px) { .main-top-Details-info .details_coloums span, .main-top-Details-info .contact_coloums span {margin: 20px 15px;} body.dashboard-page #updateDetailsModel .modal-dialog {margin: 0px auto;} .modal#updateDetailsModel .modal-content {border: none;} .main-top-Details-info .update-details-section {width: 100%;margin: 0 auto 30px;padding: 30px 20px;} .main-top-Details-info .details_coloums {padding: 20px 0px;} .main-top-Details-info .contact-details-section {width: 100%;} .main-top-Details-info .update-details-section, .main-top-Details-info .contact-details-section {padding: 15px;} } .modal#updateDetailsModel .modal-content{padding: 0px 0px;} #updateDetailsModel h4.modal-title{padding: 10px;border-bottom: none;text-align: center;font-size: 35px;font-family: Roboto;letter-spacing: 0;color: #FFFFFF;font-weight: 100;} .details_btn .save_details_btn, .details_btn .back_details_btn {max-width: 200px;min-width: 125px;padding: 0px;} .save_details_btn{float:right;} .details_btn .back_details_btn {float:left; background-color: transparent; border: 1px solid #ccc;} .save_details_btn, .back_details_btn {font-size: 16px;height: 42px;padding: 0 6px 0 20px;position: relative;color: #fff;background: #179DD8;border-radius: 26px;max-width: 260px;min-width: 210px;font-weight: bold;border: none;} .details_btn {width: 90%;text-align: center;margin: 0px auto 30px;padding-bottom: 20px; opacity: 0.5; cursor: not-allowed;pointer-events: none;} .response-end .update-done-btn, .response-end .retry-done-btn{background: #fff;border: none;max-width: 225px;color: #444;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: center;padding: 0 30px;height: 50px;width: 100%;text-transform: uppercase;font-weight: 700;letter-spacing: 1px; border-radius: 47px;} .modal-content .response-end.success-update h4 {color: #B1D89C;margin-top: 30px;} .dashboard-page #updateDetailsModel .modal-dialog {margin: 35px auto;} .update-details-section.active .details_edit, .contact-details-section.active .contact_edit{background:#00aeef;} .modal-body .main-top-Details-info .update-details-section.active .jcf-select .jcf-select-text, .update-details-section.active .details-coloum-value, .contact-details-section.active .contact-coloum-value, .modal-body .main-top-Details-info .contact-details-section.active .jcf-select .jcf-select-text{color:#00aeef;} .main-top-Details-info.active .details_btn{opacity:1; cursor:pointer; pointer-events:auto;} .update-details-section.active #country, .update-details-section.active #postalcode{color:#5B5d5d;} .contact-details-section.active #contactname, .contact-details-section.active #contactupdatetitle, .contact-details-section.active #contactupdatesurname{color:#5B5d5d;} .text-contact-gray { display: block;margin: 20px 20px 30px; display: none;} .main-top-Details-info.active .text-contact-gray { display: block;} span.contact-link-text {text-align: center;width: 100%;} .contact-link-text a:hover { color: #0095da;} .failed-update .icon-icon-warning{font-size: 6em;color: red;margin-bottom: 20px;font-family: 'DStvAfrica' !important;} .icon-icon-warning:before {content: "\e971";} .main-top-Details-info.active .red {color: red;font-size: 14px;} .invalidpostalCodeMsgRed {color: red; padding-left: 14px;/* font-size: 14px; */} /***************************** End **********************************/ .in-page .main-section .popup.success p {color: #fff;} .card .multi-card .show-btn {border: none;} /*.dashboardPOP .modal-content, .dashboardPOP .modal-dialog{height: 100% !important;}*/ .pt-mz .decoderItem .get {font-size: 20px;height: 110px;margin: 20px 0 0;display: table-cell;vertical-align: middle;} .in-page .form-holder .suspended p {margin: 0 0 24px;color: #fff;font-size: 18px;font-weight: 400;letter-spacing: 0px;} /************************************ Payment Suit Popup **********************************************/ .dashboardPOP.modal.in {background: #00000000 url(/media/7411/bg.jpg) no-repeat fixed right top !important;background-size: cover !important;height: 100%;} .btn.anim-btn.btn-default.payletf-btn, .btn.anim-btn.secondpayletf-btn {border-bottom-right-radius: 20px; border-top-right-radius: 20px; left: -15px; position: relative; padding: 13px; min-width: 180px !important; max-width: 180px;} .btn.anim-btn.secondpayletf-btn { background-color: #595959; color: #fff; border: none;} .customer-info-section, .edit_amount { width:100%;margin: 0 auto; background: #3E3E3E; padding: 30px 20px;float: left;} .customer-info-section .form-group {margin: 20px 0px;} .customer-info-section{ height: 235px;} .custom-fields-sec .edit_amount { background: #fff; padding-top: 0px;} .main-top-payment-info .pay-btn-section {position: absolute; top: 40%;} .custom-details-sec-desk{display: inline-flex;width: 100%;float: left;margin: 2em 0px;} .main-top-payment-info h4.modal-title {font-weight: 300; text-align: center; margin: 5px 0;} #smartnumberLegend, #accountholderLegend, #editamountLegend, #countryLegend {font-size: .8em!important; text-align: left;} .form-group.edit_amount{ margin: 0px;margin-top: 0px;height: 85px;padding: 0px !important;line-height: 10px;width: 100%;} .edit_amount.form-group fieldset {border: 1px solid #00ACDE;} .custom-fields-sec, .amount-details-sec {width: 50%; padding: 0px !important;border: 1px solid #3E3E3E;} .edit_amount #editamountLegend {color: #00ACDE;} .customer-info-section .form-group fieldset, .edit_amount.form-group fieldset {border: 1px solid #00ACDEs; border-radius: 25px; margin-bottom: 13px;} .customer-info-section .form-group fieldset select, .customer-info-section .form-group fieldset input, .edit_amount.form-group fieldset input {padding-top: 0px; box-shadow: none; padding: 3px; border: none !important; background: transparent; height: 30px; font-size: 15px; line-height: 22px; color: #ccc; border-radius: 10px; padding: 0px 10px 10px;} .customer-info-section .jcf-select { border: none; margin: 0px; width: 100%; height: 30px; border-radius: 0px; top: -7px; } .customer-info-section .jcf-select .jcf-select-text { font-size: 14px; color: #fff; text-transform: initial;} .customer-info-section .jcf-select .jcf-select-opener:after {color: #fff;} .customer-info-section .jcf-select.jcf-focus .jcf-select-text{color: #fff;} span.edit-payment-icon { width: 32px; height: 32px; position: relative; float: right; top: -36px; border-radius: 20px; right: 3px;} .payFORU input.form-control.input-lg { width: 240px; margin: 0 auto; z-index: 1; border-radius: 26px;} #editamountLegend { font-size: .7em!important; text-align: left; margin-left: -1em; position: relative; top: 13px; z-index: 3; background: #fff; padding: 0px 5px; } .edit-iner-section {margin: 0 auto;width: 240px;margin-top:-5px;} @media only screen and (min-width: 768px){ .edit_amount #editamountLegend {/*top: 15px;*/} } @media only screen and (min-width: 320px) and (max-width: 667px){ .custom-details-sec .custom-details-sec-desk {display: block;} .edit_amount #editamountLegend {/*background: #131313;*/background: #fff;} .custom-details-sec.second-sec-slider span.custom-country-pay-now-info {vertical-align: baseline;top: 0px;} .amount-details-sec, .custom-fields-sec{width: 300px;margin: 0 auto;} .custom-fields-sec .form-group.edit_amount {height: 90px;} .edit-iner-section span.countryCode { top: 35px;} #paymentModal .modal-content {margin-top:0px;} .custom-details-sec-desk .custom-fields-sec, .custom-details-sec-desk .amount-details-sec {border: none;} .custom-fields-sec .form-group.edit_amount input.form-control.input-lg {padding: 10px 40px;background-color: transparent;} .edit_amount span.edit-payment-icon {right: 3px; } #paymentModal.modal.in .modal-dialog { margin: 0px; width:100%;} #paymentModal .modal-body {padding: 0px; margin-top: 5px;} .pay-btn-section .btn.anim-btn.btn-default.payletf-btn, .pay-btn-section .btn.anim-btn.secondpayletf-btn{ left: 0px;} .modal-body .main-top-payment-info .pay-btn-section { margin: 40px auto;} .main-top-payment-info .second-sec-slider .customer-info-section.second-sec { padding: 6em 0;background-size: 65%;background-position: 45% 50%;} .main-top-payment-info .pay-btn-section {position: inherit; top: 0%; text-align: center;} .main-top-payment-info .custom-details-sec {float: none;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {left: 0px;} a.btn.anim-btn.btn-default.payletf-btn, a.btn.anim-btn.secondpayletf-btn {border-bottom-left-radius: 20px; border-top-left-radius: 20px;} .payment-smartcardError .error-text-pay {margin: 0px; padding: 10px;} #paymentModal .modal-dialog {margin: 0px !important;padding: 0px !important;} #paymentModal .modal-content{border: none;} #paymentModal .modal-header .icon-Close_M{text-shadow: none; font-size: 16px;} #paymentModal button.close {top: 0px !important;right: 0px !important;background-color: transparent !important;color: #ccc !important;} #paymentModal .PaySuitResponse.row { width: 100%;} } @media only screen and (min-width: 320px) and (max-width: 380px){ .custom-details-sec .customer-info-section, .main-top-payment-info .second-sec-slider .customer-info-section.second-sec { width: 100%;} .amount-details-sec, .custom-fields-sec {width: 100%;margin: 0 auto;float: none;} } .second-sec-slider .customer-info-section.second-sec {text-align: center; background: url(/media/9071/group-2111.svg) no-repeat 41% 54% #1B1B1B;content: '';padding: 4em 0;background-size: 70%; overflow: visible; transform: rotate(0deg); width: 100%; height: 235px;} .second-sec-slider span.custom-country-info {color: #087EB4; font-size: 18px;} .second-sec-slider span.custom-country-amount-info {font-weight: 600; font-size: 25px;} .second-sec-slider span.custom-country-decriptive-info {font-size: 12px; opacity: 0.8;} .second-sec-slider span.custom-country-pay-now-info { float: none; text-align: center; display: block; padding: 10px 0; font-size: 16px; } .second-sec-slider .pay-now-decription {text-align: center; background: #908989 0% 0% no-repeat padding-box; background: #53B4E6; padding: 0px 0;height: 85px;} .pay-btn-section .btn.anim-btn.btn-default.active {background-color: #53B4E6;} .btn.anim-btn.btn-default.payletf-btn.noactive {background: #595959; border:none;} .error-icon-pay, .error-text-pay{text-align: center; width: 100%; float: left; margin: 5px;} .customer-info-section .form-group fieldset {background: transparent;} .form-group.edit_amount input.form-control.input-lg {padding: 9px 40px; background-color: transparent;} #paymentModal .modal-dialog .modal-content .modal-header { padding: 0px; border:none;} #paymentModal .modal-content, a#paybtn-dashboard{color: #fff;} #topupModalPopup .modal-content, #topupModalPopup .modal-dialog, #paymentModal .modal-content, #paymentModal .modal-dialog, #rentNowModalPopup .modal-content, #rentNowModalPopup .modal-dialog{ display: block; height: auto; } span.countryCode {position: relative;top: 33px;color: #000;font-size: 12px;padding-left: 10px;} /************************************************ Payment Siute Failure ********************************************/ .response-end {text-align: center;} .modal-content h1 {line-height: normal; text-align: center;font-size: 35px !important;font-weight: 300; margin: 0 0 10px;} .response-end h1.response-icon {font-size: 5em !important;color: #B61C0E;line-height: 1em;} #paymentModal .modal-content h4 {text-align: center;font-size: 20px !important;font-weight: 300;} #paymentModal .modal-content .response-end h4 {font-size: 32px !important;margin: 40px auto;line-height: normal;} .response-end.failed h5 {color: #B61C0E;} .modal-content .response-end p {max-width: 460px;margin: 0 auto;opacity: 1;font-weight: 400;} .response-end .dppinnerwrap.details {border-top: 1px solid #6f6f6f;border-bottom: 1px solid #6f6f6f;padding: 20px 0;margin: 20px auto 30px;} .dppinnerwrap.details {display: block;clear: both;width: 100%;padding: 30px 0 40px;float: left;border-top: 1px solid #505050;} .batched {width: 80%;clear: both;display: block;margin: 0 auto;} .response-end .details .field-title {max-width: 50%;display: inline-block;float: left;width: 50%;margin: 0 0 6px;text-align: right;padding-right: 10px;} .details .field-title {max-width: 50%;display: inline-block;float: left;width: 50%;margin: 0 0 6px;font-size: 16px;text-align: left;} .response-end .details .field-value {max-width: 50%;display: inline-block;float: right;width: 50%;text-align: left;font-weight: 900;margin: 0 0 6px;color: #B1D89C;} .details .field-value {max-width: 50%;display: inline-block;float: right;width: 50%;text-align: right;font-weight: 900;margin: 0 0 6px;font-size: 16px;} .response-end.failed .details .field-value:nth-of-type(3n) {color: #B61C0E;} .response-end.failed #cancel.dpp-pay-btn {background: transparent;border: 1px solid #fff;max-width: 225px;color: #fff;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} .response-end.failed .dpp-pay-btn {margin: 0 20px !important;} .dpp-pay-btn:before { content: "\e949";font-size: 30px;width: 20px;height: 20px;display: inline-block;float: right;font-family: 'dstvFont' !important;} .dpp-pay-btn {background: #FFFFFF;border: 1px solid #707070;border-radius: 100px;max-width: 225px;color: #444444;margin: 0 auto !important;float: none !important;font-size: 18px;height: 50px;width: 100%;text-transform: uppercase;font-weight: 700;letter-spacing: 1px;} .response-end .dpp-pay-btn {background: #fff;border: none;max-width: 225px;color: #444;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} /**************************************** Payment suite Pending ********************************************/ .response-end.pending h1.response-icon:before {color: #E5C026;content: "\e931";font-family: 'dstvFont' !important;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;} .response-end.pending h5 {color: #E5C026;} .response-end.pending .details .field-value:nth-of-type(3n) {color: #E5C026;} .response-end.pending .dpp-pay-btn {background: transparent;border: 1px solid #fff;max-width: 225px;color: #fff;margin: 0 auto !important;float: none !important;font-size: 18px;text-align: left;padding: 0 30px;} .modal-content .response-end.success h4 {color: #B1D89C;} /*****FOR NEW PAYMENT SUITE UI****/ tag-payments-new .modal-dialog {display:block !important } .dashboard-page .modal-dialog .modal-content .modal-body { height: 100%;} .dashboard-page #topupModalPopup .modal-dialog .modal-content .modal-body{ height: auto; max-width: 600px; background: #fff; } .dashboardModal#topupModalPopup .modal-content { padding: 30px; background: transparent; } .dashboard-page .modal-dialog .modal-content .modal-body iframe {border: none;height: 100%;} /********************************************** Curency Toggle******************************************/ .currencyToggle {float: right; display: inline-flex;margin-right: 30px;} .package-landing .currencyToggle {float: none; display: inline-flex;margin-bottom: 30px;} .switch { position: relative;display: block;vertical-align: top;width: 82px;height: 30px;padding: 3px;margin:0;border-radius: 18px;cursor: pointer; box-sizing:content-box;} .switch-input { position: absolute;top: 0;left: 0;opacity: 0; box-sizing:content-box;} .switch-label { position: relative;display: block;height: inherit;font-size: 12px;text-transform: uppercase;background: #009F4C;border-radius: inherit;box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15); box-sizing:content-box;} .switch-label:before, .switch-label:after { position: absolute;top: 50%;margin-top: -.5em;line-height: 1;-webkit-transition: inherit;-moz-transition: inherit;-o-transition: inherit;transition: inherit; box-sizing:content-box;} .switch-label:before { content: attr(data-off);right: 20px;color: #fff;text-shadow: 0 1px rgba(255, 255, 255, 0.5);} .switch-label:after { content: attr(data-on);left: 17px;color: #FFFFFF;text-shadow: 0 1px rgba(0, 0, 0, 0.2);opacity: 0;} .jcf-checked ~ .switch-label { background: #1F9DD9;box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);} .jcf-checked~ .switch-label:before { opacity: 0;} .jcf-checked ~ .switch-label:after { opacity: 1;} .switch-handle { position: absolute;top: 4px;left: 4px;width: 28px;height: 28px;background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);border-radius: 100%;box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);} .switch-handle:before { content: "";position: absolute;top: 50%;left: 50%;margin: -6px 0 0 -6px;width: 12px;height: 12px;background: linear-gradient(to bottom, #eeeeee, #FFFFFF);background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);border-radius: 6px;box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);} .jcf-checked ~ .switch-handle { left: 55px;box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);} /* Switch Left Right ==========================*/ .switch-left-right .switch-label { overflow: hidden;} .switch-left-right .switch-label:before, .switch-left-right .switch-label:after { width: 20px;height: 20px;top: 4px;left: 0;right: 0;bottom: 0;padding: 11px 0 0 0;text-indent: -12px;border-radius: 20px;box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(0, 0, 0, 0.1);} .switch-left-right .switch-label:before { background: #eceeef;text-align: left;padding-left: 80px;} .switch-left-right .switch-label:after { text-align: left;text-indent: 9px;background: #FF7F50;left: -100px;opacity: 1;width: 100%;} .switch-left-right .jcf-checked ~ .switch-label:before { opacity: 1;left: 100px;} .switch-left-right .jcf-checked ~ .switch-label:after { left: 0;} .switch-left-right .jcf-checked ~ .switch-label { background: inherit;} /* Switch Flat ==========================*/ .switch-flat { padding: 0;background: #FFF;background-image: none;} .switch-flat .switch-label { background: #FFF;border: solid 2px #eceeef;box-shadow: none;} .switch-flat .switch-label:after { color: #0088cc;} .switch-flat .switch-handle { top: 6px;left: 6px;background: #dadada;width: 22px;height: 22px;box-shadow: none;} .switch-flat .switch-handle:before { background: #eceeef;} .switch-flat .jcf-checked ~ .switch-label { background: #FFF;border-color: #0088cc;} .switch-flat .jcf-checked ~ .switch-handle { left: 72px;background: #0088cc;box-shadow: none;} /* Switch Yes No ==========================*/ .switch-yes-no { padding: 0;margin: 15px 0 0;background: #FFF;border-radius: 0;background-image: none;} .switch-yes-no .switch-label { box-shadow: none;background: none;} .switch-yes-no .switch-label:after, .switch-yes-no .switch-label:before { width: 100%;height: 70%;top: 5px;left: 0;text-align: center;padding-top: 10%;box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(0, 0, 0, 0.1);} .switch-yes-no .switch-label:after { color: #FFFFFF;background: #32CD32;backface-visibility: hidden;transform: rotateY(180deg);} .switch-yes-no .switch-label:before { background: #eceeef;backface-visibility: hidden;} .switch-yes-no .switch-handle { display: none;} .switch-yes-no .jcf-checked ~ .switch-label { background: #FFF;border-color: #0088cc;} .switch-yes-no .jcf-checked ~ .switch-label:before { transform: rotateY(180deg) } .switch-yes-no .jcf-checked ~ .switch-label:after { transform: rotateY(0) } /* Switch Slide ==========================*/ .switch-slide { padding: 0;background: #FFF;border-radius: 0;background-image: none;} .switch-slide .switch-label { box-shadow: none;background: none;overflow: hidden;} .switch-slide .switch-label:after, .switch-slide .switch-label:before { width: 100%;height: 65%;top: 5px;left: 0;text-align: center;padding-top: 10%;box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(0, 0, 0, 0.1);} .switch-slide .switch-label:after { color: #FFFFFF;background: #87CEEB;left: -100px;} .switch-slide .switch-label:before { background: #eceeef;} .switch-slide .switch-handle { display: none;} .switch-slide .jcf-checked ~ .switch-label { background: #FFF;border-color: #0088cc;} .switch-slide .jcf-checked~ .switch-label:before { left: 100px;} .switch-slide .jcf-checked ~ .switch-label:after { left: 0;} /* Switch Light ==========================*/ .switch-light { padding: 0;background: #FFF;background-image: none;} .switch-light .switch-label { background: #FFF;border: solid 2px #eceeef;box-shadow: none;} .switch-light .switch-label:after { color: #9370DB;} .switch-light .switch-label:before { right: inherit;left: 11px;} .switch-light .switch-handle { top: 6px;left: 72px;background: #dadada;width: 22px;height: 22px;box-shadow: none;} .switch-light .switch-handle:before { background: #eceeef;} .switch-light .jcf-checked ~ .switch-label { background: #FFF;border-color: #9370DB;} .switch-light .jcf-checked ~ .switch-handle { left: 72px;box-shadow: none;background: #9370DB } .switch-light .jcf-checked ~ .switch-handle:before { background: rgba(255,255,255,0.7);} /* Transition ============================================================ */ .switch-label, .switch-handle { transition: All 0.3s ease;-webkit-transition: All 0.3s ease;-moz-transition: All 0.3s ease;-o-transition: All 0.3s ease;} .currencyToggle .jcf-checkbox {vertical-align: unset;display: none;} span.currencyWord {color: #fff;margin: 5px 10px;font-size: 16px;} .package-landing span.currencyWord {color: #fff;margin: 5px 10px 5px 0px;font-size: 16px;} .compare-header .currencyWord {color: #000;} @media only screen and (min-width: 320px) and (max-width: 767px){ .currencyToggle { float: none; margin-right: 0px;} } /****************************************************** Currency Toggle END**********************************************/ #loginPopup .login-icon .login-person-icon { /*display: none;*/ } #paymentHistoryModal.dashboardPOP .modal-dialog, #paymentHistoryModal.dashboardPOP .modal-content{ height: 100%; overflow: auto;display: block; } .modal-open .modal#paymentHistoryModal { overflow-x: hidden; overflow-y: hidden; } .package-info-right.French .backgroundimg { width: 40%; left: -60px; } @media only screen and (min-width: 320px) and (max-width: 767px){ .modal-body .package-info-right .backgroundimg { height: 110px; width: 110px; position: absolute; bottom: 0; background-size: 74px; background-repeat: no-repeat; left: -30px; right: 0; background-position: left; top: -46px; z-index: 99999; } .popup a#topupBtn.cta {text-align: center;} .modal-content .package-list .left-packagelist-section input { margin-right: 11px !important; margin-left: 0px !important; } .center-heading-smarcard{ float: none; width: 100%; text-align: center; font-size: 18px; margin-bottom: 20px; } .main-top-fix-error-info{ margin-top: 20px;} .dashboardModal#dashboardModelFixError h1 { text-align: center; font-size: 34px !important; font-weight: 300; line-height: 30px; } .second-top-third span.icon-icon-warning {font-size: 18px;margin: 0px 3px 0px 0px;} .second-top-third{ padding: 0px !important;} .arrows-fix-smart span.slick-next.slick-arrow:before, .arrows-fix-smart span.slick-prev.slick-arrow:before {font-size: 24px !important;} .smartcard_slider .arrows-fix-smart {right: auto;} } @media only screen and (min-width: 320px) and (max-width: 350px){ .modal-content.changePackModel .package-change-bottom-section .package-list .icon-pack { font-size: 20px;} .modal-content .package-list .left-packagelist-section input { margin-top: -5px !important; margin-right: 5px !important; margin-left: 5px !important; } .fix-smartcard-slider .slider.fix-slider .package-item .decoder-img-left {max-width: 90px;} .modal-body .main-top-package-info .icon-pack { font-size: 2em; position: relative; top: -7px; } .modal-content.addOnPacakgeModal .package-change-bottom-section .package-list .icon-pack {font-size: 18px;} } @media only screen and (min-width: 351px) and (max-width: 676px){ .changePackModel .package-change-bottom-section .package-list .icon-pack { font-size: 22px; position: relative; top: 3px;} .modal-content.addOnPacakgeModal .package-change-bottom-section .package-list .icon-pack { font-size: 22px; position: relative; top: -2px; } } .main-top-package-info .icon-pack { font-size: 2.3em; position: relative; top: -7px; } .left-packagelist-section input { margin-top: -17px !important; } body.nav-active #navNewClick.nav-opener:after {margin-left: 10px;} .failure .modal-content, .failure .modal-dialog, .success .modal-content, .success .modal-dialog{ height:100%; display:block; } #rentNowModalPopup .popup a.cta:hover { margin: 20px auto 20px !important; } section.manage-section.viewport-section.bg-gradient-45.in-viewport { padding: 0px 0 0px; } tag-fix-errors-logged-out .popup.success h2 { color: #04be5b;} .in-page tag-fix-errors-logged-out .main-section .popup.success p, tag-fix-errors-logged-out .popup.success h4, tag-fix-errors-logged-out .popup.suspended h4, .in-page .form-holder tag-fix-errors-logged-out .suspended p {color: #000;} tag-fix-errors-logged-out .popup.suspended h2 {color: #ec9400;} tag-fix-error-managepage .popup{ width: 100%; background: #f7f7f7; max-width: 560px; box-shadow: 0px 0px 12px rgba(0,0,0,0.4); display: block; border-radius: 16px; min-height: 60px; padding: 40px; text-align: center; margin: 0 auto 20px; position: relative; } tag-fix-error-managepage .popup.success p, tag-fix-error-managepage .popup.suspended p, tag-fix-error-managepage .popup.unsuccessful p, tag-fix-error-managepage .popup.update p{ color: #000; } tag-fix-error-managepage .popup.success h2{ color: #04be5b;} tag-fix-error-managepage .popup.success h4, .in-page tag-fix-error-managepage .main-section .popup.success p{color: #000;} tag-fix-error-managepage .popup.suspended h2 {color: #ec9400;} tag-fix-error-managepage .popup.suspended h4, .in-page .form-holder tag-fix-error-managepage .suspended p{color: #000;} .packages .txt-wrapper p a:hover { color: #0095da; } .package-null-sec .col-xs-4 { margin: 0 auto; } /********************************** Error Upgreade Popup ********************************/ .dashboardPOP#errorUpgreadeModel.modal.in { background: rgba(0,0,0,.95)!important; } #errorUpgreadeModel .modal-content { padding: 30px; background: transparent; backdrop-filter: blur(5px); height: 100%; } #errorUpgreadeModel .modal-dialog .modal-content .modal-body { height: 100%; margin-top: 0px; max-width:600px; } #errorUpgreadeModel .modal-content button.close.btnClose { top: 0px !important; right: 0px !important; background-color: transparent !important; color: #ccc !important; margin-top: 0px; box-shadow: none; position: absolute!important; } #errorUpgreadeModel .modal-dialog { z-index: 999; position: relative; margin-top: 0px; width: 100%; height: 100%; } .icon-icon-warning.errorUpgradeIcon { font-size: 6em; margin: 0px 5px 20px; padding: 0px 0px; color: #E06E0B; position: relative; top: 0px; } #errorUpgreadeModel h2{ margin: 20px; font-weight: 300; text-transform: uppercase; font-size: 30px; } .boldText{ font-weight: 500; } .colorBrown{ font-size: 25px; font-weight: 300; color: #E06E0B; } .errorUpdateMessage{ border-image: linear-gradient(270deg, #7E8283 0%, #00000000 100%) 5% 0% 5%; border-width: 1px; border-style: solid; margin: 30px 0 10px; padding: 3em 0px; } .errorUpgradeButtons{ display: flex; float: none; width: 100%; } .popup .errorUpgradeButtons a.cta.callnowButton{ width: 160px; text-align: center; padding: 10px; border: 1px solid; background-color: transparent; line-height: 20px; border-radius: 30px; margin: 20px auto; } .popup .errorUpgradeButtons a.cta.closeButton{ width: 160px; text-align: center; padding: 10px; border: 1px solid; background-color: #fff; line-height: 20px; border-radius: 30px; margin: 20px auto; color: #000; } p.firstSection { margin-bottom: 39px !important; } #errorUpgreadeModel .popup { background-image: url(/media/9694/layer-2.svg); background-repeat: no-repeat; background-position: top right; background-size: 66%; } .icon-icon-warning.errorUpgradeIcon.package{ font-size: 4em; margin-bottom: 0px; text-align: center; float: left; margin: 0 auto; position: unset; width: 100%; } .dashboard-page #wrapper .main .col-md-4.packages{ padding-top: 0px; } .dashboard-page .packages.col-md-4 .txt-wrapper p { color: white; font-weight: 400; margin: 5px; font-size: 13px; font-family: Roboto-light; text-align: center; line-height: 24px; } .dashboard-page .packages .callnowButton.cta{ font-size: 16px; color: #fff; background: transparent; border: 1px solid #fff; border-radius: 25px; padding: 8px 20px; float: left; text-align: left; margin: 5px auto; max-width: 200px; width: 200px; text-transform: uppercase; position: relative; z-index: 1; } .errorUpgradeButtons .icon-ico-arrow-next{ float: right; } .dashboard-page .packages.col-md-4 .txt-wrapper { display: block; height: auto; /*height:45px;*/ } .dashboard-page #wrapper .packages .txt-wrapper:after { background: none; } @media only screen and (min-width: 320px) and (max-width: 676px){ .dashboardPOP#errorUpgreadeModel .modal-content{ padding: 10px;} .dashboardPOP#errorUpgreadeModel .modal-dialog .modal-content .modal-body{ padding: 0px; margin: 0px !important; width: 100%; } .error.popup .errorUpgradeButtons a.cta.callnowButton, .error.popup .errorUpgradeButtons a.cta.closeButton {max-width: 120px;} .dashboard-page #wrapper .packages.col-md-4 .txt-wrapper {height: auto;/*height:65px;*/} #errorUpgreadeModel .error h2 {line-height: 35px;} .errorUpdateMessage p.firstSection {margin-bottom: 20px !important;} .change-package.compare-packages .decoder-list.packages li { width: 320px; margin: 0 auto; } } /******************************** End ****************************/ /************************************************* Recurring Payment terminatedBouquet ***************************************/ .dashboardPOP#terminatedBouquet.modal.in { background: rgba(0,0,0,.95)!important; } #terminatedBouquet .modal-content { padding: 30px 30px 0px; background: transparent; height: auto; max-width: 600px; margin: 2em auto 0px; } #terminatedBouquet .bouquet-content:after { position: absolute; background: transparent linear-gradient(324deg, #051C41 0%, #152D5A 29%, #190864 100%, #10054D 100%) 0% 0% no-repeat padding-box; opacity: 0.75; content: ''; top: 0px; left: 0px; bottom: 0; right: 0px; } #terminatedBouquet .modal-dialog .modal-content .modal-body { height: auto; margin-top: 0px; z-index: 1; } #terminatedBouquet .modal-content button.close.btnClose { top: 20px !important; right: 4px !important; background-color: #fff !important; color: #000 !important; margin-top: 0px; box-shadow: none; position: absolute!important; width: 30px; height: 30px; font-size: 14px; line-height: 34px; } #terminatedBouquet .modal-dialog { z-index: 999; position: relative; margin-top: 0px; width: 100%; height: 100%; } .bouquetsubheading, .bouquettext { font-weight: 100; font-size: 18px; } .bouquetHeading{ font-size: 28px !important; font-weight: 500; } .bouquetbutton button{ background-color: #1F9DD9; color: #fff; padding: 8px 15px; border-radius: 29px; border-color: transparent; font-size: 15px; width: 210px; text-align: left; } .bouquetbutton .icon-icon-next{ float: right; font-size: 27px; position: relative; top: 2px; } .bouquetbutton{ margin-top: -135px; float: left; margin-left: 15px; width: 100%; display: block; position: relative; } .popup.bouquet{ z-index: 1; } @media only screen and (min-width: 320px) and (max-width: 676px){ .bouquet-img img { max-width: 80%;} .popup bouquet .main-text{ padding: 0px 20px;} .dashboardPOP#terminatedBouquet .modal-content{ padding: 10px; margin-top: 0px;} .dashboardPOP#terminatedBouquet .modal-dialog .modal-content .modal-body{ padding: 0px; margin: 0px !important; width: 100%; } .bouquet .bouquetHeading{ margin-top: 1em !important; line-height: 30px; padding: 20px; } .bouquet-img .bouquetbutton{margin-top: -70px; margin-left: 10px;} .bouquet-img .bouquetbutton button{ width: 180px; position: relative; } .bouquet-img .bouquetbutton .icon-icon-next { top: 0px; line-height: 17px;} #paymentModal button.close { position: relative;} } body.modal-open { overflow: hidden; } .hd-zapper .package-null-sec .col-xs-4 { margin: 1px auto; } .grey-cards.compare-terms .card .desc-hold {background:#333 !important;} .grey-cards.compare-terms .card .desc-hold .content {color:#fff !important;} .change-package .decoder-list.packages li .package-block .package-name { font-size: 21px; word-break: break-word; position: absolute; bottom: 0px; left: 0px; color: #fff; font-weight: 500; top: 10px; padding: 10px; line-height: 25px; } .change-package .decoder-list.packages li .package-block .package-image.img-bg { background-size: cover; background-position: 100% 50%; padding: 0 0 0; height: 175px; } @media only screen and (max-width: 667px) and (min-width: 320px){ .tag-page-home .package-slider .scene .card-face .bg-holder { background-size: cover!important; }} .pt-ao #header .col-xl-6.col-lg-6.col-md-6.col-sm-6.newMenu a, .pt-mz #header .col-xl-6.col-lg-6.col-md-6.col-sm-6.newMenu a{ font-size: 14px; } @media only screen and (max-width: 1250px) and (min-width: 768px){ .pt-ao #header .col-xl-6.col-lg-6.col-md-6.col-sm-6.newMenu a, .pt-mz #header .col-xl-6.col-lg-6.col-md-6.col-sm-6.newMenu a{ font-size: 12px; }} @media only screen and (max-width: 767px) and (min-width: 320px){ .backcard-packageItem { min-height: 168px; } .back-package .backcard-packageItem { min-height: 152px;left: 20px; } #af-smart-banner.afb-container { position: relative !important } header#header { top: 0 !important; } body #cookie-policy-bar { text-align:left; padding:20px 15px !important; } body #cookie-policy-bar .cookie_close { top:4px; right:2px; padding: 0px 5px; border-width:0; border-radius:0; transform: translate(0%, 0%); } #signInModalPopup, #paymentHistoryModal {top:26%;} .ncb #signInModalPopup, .ncb #paymentHistoryModal {top:0;} #signInModalPopup .loginPage .SignInSection1 {margin-top:130px;} .ncb #signInModalPopup .loginPage .SignInSection1 {margin-top:50px;} .dropdown-content.f32 {top:26%;} .ncb .dropdown-content.f32 {top:0;} #nav .mega-menu.mega-stacked {margin-top:100px; width: 100% !important; padding-left: 12% !important; padding-right: 12% !important;} .ncb #nav .mega-menu.mega-stacked {margin-top:0;} } @media only screen and (max-width: 380px) and (min-width: 320px){ .backcard-packageItem .backgroundimg { bottom: 38px; }} .decoders-landing div#colorbox, .decoders-landing div#colorbox { width: 100% !important; height: 100% !important; max-width: 100% !important; position: fixed !important; overflow-y: scroll; top: 5% !important; } .decoders-landing div#cboxWrapper, .decoders-landing div#cboxWrapper{ width: 485px !important; height: 100% !important; overflow: unset; left: 0; right: 10px; position: relative; float: right; margin-right: 10px; } section#packagepopupform{ padding: 55px 0px; } section#packagepopupform .jcf-list { background: #053142; } section#packagepopupform .jcf-list ul li { border-bottom: 1px solid #ecf4f75e; } section#packagepopupform .jcf-select { border: 1px solid #eef4f7e3; } section#packagepopupform .jcf-select .jcf-select-text { color: #fff; } section#packagepopupform .jcf-select-drop .jcf-hover { color: #fff; } section#packagepopupform .jcf-select .jcf-select-opener:after, section#packagepopupform .jcf-select-drop .jcf-select-drop-content:after { color: #fff; } section#packagepopupform .jcf-select-drop .jcf-select-drop-content:after { border-bottom: 6px solid #fff; } .decoders-landing div#cboxContent {width: 100% !important;height: auto !important;overflow: unset;} .decoders-landing div#cboxContent #cboxClose:after {color:#fff} .decoders-landing #cboxContent .container {width: 95%;margin: 0 auto;color: #fff;height: auto;overflow: unset;} .decoders-landing div#cboxLoadedContent {width: 100% !important;background: #00648a90;backdrop-filter: blur(6px);height: 100% !important;border-radius: 5px;} .decoders-landing .compare-terms.package-popup-overlay fieldset {width: 100%;} .decoders-landing .compare-terms.package-popup-overlay .webform .wg2k_textareaField, .decoders-landing .webform .wg2k_textField, .decoders-landing .webform .wg2k_emailField {box-shadow: 0 0 13px rgba(0, 0, 0, 0.4);border:none;background: rgba(255,255,255,.14);padding-top: 15px !important;padding-bottom: 18px !important;padding-left: 60px !important;padding-right: 20px !important;} .decoders-landing textarea {min-height:60px;resize:none;} .decoders-landing .compare-terms.package-popup-overlay .webform div[class^=wg2k_] input::-webkit-input-placeholder, .webform .wg2k_textareaField textarea::-webkit-input-placeholder {color: #fff;text-transform: none;font-size: medium;} .decoders-landing .compare-terms.package-popup-overlay .decoder-test label {display: none;} .decoders-landing .compare-terms.package-popup-overlay .webform {max-width: 90%;margin: 0 auto;} .decoders-landing .compare-terms.package-popup-overlay .webform fieldset div[class^=wg2k_].decoder-name:before, .decoders-landing .webform fieldset div[class^=wg2k_].decoder-surname:before {content: "\e934";font-family: 'DStvAfrica' !important;font-size: 24px;width: 50px;height: 58px;left: 0;position: absolute;vertical-align: middle;display: table-cell;padding-left: 16px;color: #ffffff;} .decoders-landing .compare-terms.package-popup-overlay .webform fieldset div[class^=wg2k_].decoder-contactno:before {content: "\e924";font-family: 'DStvAfrica' !important;font-size: 24px;width: 50px;height: 58px;left: 0;position: absolute;vertical-align: middle;display: inline-block;padding-left: 16px;color: #ffffff;} .decoders-landing .compare-terms.package-popup-overlay .webform fieldset div[class^=wg2k_].decoder-email:before {content: "\e93c";font-family: 'DStvAfrica' !important;font-size: 24px;width: 50px;height: 58px;left: 0;position: absolute;vertical-align: middle;display: inline-block;padding-left: 16px;color: #ffffff;} .decoders-landing .compare-terms.package-popup-overlay .webform fieldset div[class^=wg2k_].decoder-message:before {content: "\e92b";font-family: 'DStvAfrica' !important;font-size: 24px;width: 50px;height: 58px;left: 0;position: absolute;vertical-align: middle;display: inline-block;padding-left: 16px;color: #ffffff;} .decoders-landing .compare-terms.package-popup-overlay .webform div[class^=wg2k_] input[type=submit] {/* border-radius: 34px !important; *//* padding: 10px 40px !important; *//* font-size: 14px !important; */color: #000 !important;/* font-weight: 700 !important; *//* max-width: 270px !important; */margin: 22px auto 0;display: block !important;background: #fff !important;/* width: 100% !important; */left: unset;float: none;/* line-height: 1 !important; *//* height: 40px; *//* min-height: unset; */} .decoders-landing .compare-terms.package-popup-overlay .webform div[class^=wg2k_] input[type=text], .decoders-landing .webform div[class^=wg2k_] input[type=email], .decoders-landing .webform div[class^=wg2k_] textarea {color:#fff;text-transform: none;} .decoders-landing .compare-terms.package-popup-overlay .head-area+.content {margin-bottom:0;} @media screen and (max-width: 767px) { .decoders-landing div#colorbox {right: 0% !important;left: 0% !important;width: 100% !important;height: 92vh !important;top: 4vh !important;position: absolute !important;bottom: 4vh;overflow: auto;} .decoders-landing .compare-terms.package-popup-overlay .head-area+.content {text-align:center;} .decoders-landing .webform .wg2k_textareaField, .decoders-landing .webform .wg2k_textField, .decoders-landing .webform .wg2k_emailField {margin:0 auto 20px;padding-top: 10px !important;padding-bottom: 10px !important;} .decoders-landing.home-page #cboxWrapper section {padding: 10px 0 40px !important;} body.package-landing div#cboxWrapper, body.decoders-landing div#cboxWrapper {width: 90% !important;margin-right: 0px;margin: 0 auto;float: none;} body.decoders-landing button#cboxClose { right: 30px;} .decoders-landing #commonModalPopup .modal-content button.close {right: 20px !important;top: -35px;} #commonModalPopup.dashboardModal .webform.modal-lg {width: 100%;margin: 0px; } } .decoders-landing #cboxOverlay {background:rgba(0,0,0,.9) !important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);} .decoders-landing .in-page-form label.error {color:#ffbf00; font-size:medium;font-weight:normal;} .decoders-landing button#cboxClose {top:10px;right:20px;} body.scrollhidden {overflow: hidden;} #commonModalPopup .webform.modal-lg {width: 100%;} #commonModalPopup .modal-content button.close {top: -80px;} .webform div[class^=wg2k_] input:-webkit-autofill, .webform div[class^=wg2k_] input:-webkit-autofill:hover, .webform div[class^=wg2k_] input:-webkit-autofill:focus, .webform div[class^=wg2k_] textarea:-webkit-autofill, .webform div[class^=wg2k_] textarea:-webkit-autofill:hover, .webform div[class^=wg2k_] textarea:-webkit-autofill:focus, .webform div[class^=wg2k_] select:-webkit-autofill, .webform div[class^=wg2k_] select:-webkit-autofill:hover, .webform div[class^=wg2k_] select:-webkit-autofill:focus {-webkit-text-fill-color: #fff !important;-webkit-box-shadow: 0 0 0px 1000px #2b3a43 inset !important;transition: background-color 5000s ease-in-out 0s !important;} .response-end.success-update{display:none;} .right-packagelist-section.Entertainment{ background: #67BFEC url(/media/8224/yanga-3x.png) no-repeat right center !important; background-size: auto 100%!important;} .right-packagelist-section.Educational{ background: #F4EB00 url(/media/8224/yanga-3x.png) no-repeat right center !important; background-size: auto 100%!important;} .backcard-packageItem.EENTE36 .backgroundimg { background-image: url(/media/10021/mask-group-70-2x.png); } .backcard-packageItem.EDUE36 .backgroundimg { background-image: url(/media/10020/mask-group-70-2x.png); } .backcard-packageItem.EENTE36 { background: #67BFEC; } .backcard-packageItem.EDUE36 { background: #F4EB00; } /*Showmax ATB*/ .showmax-offer{ margin: 0 auto; width: 240px; background: #1F2B38; margin-top: 4px; font-size: 18px; font-weight: 100; padding: 5px 0px; float:left; } .showmax-price-section{ float: left; width: 100%; text-align: left; background: #18191a; padding: 10px 0px; } .price-left, .payment-showmax-right{ float: right; width: 50%; } .make-payshowmax, .cancel-showmax{ font-size: 14px; text-align: center; } .make-payshowmax{color: #E83D8E;} .Price{ text-align: left; padding-left: 20px; font-size: 14px; line-height: 10px; margin-top: 10px; width: 100%; float: left; } .showmax-price-section .smat-number{ text-align: left; padding-left: 20px; font-size: 18px; line-height: 10px; margin-top: 20px; width: 100%; float: left; font-weight: 100 !important; } .cancel-showmax{ float: right; } .cancel-icon{ float: left; width: 100%; text-align: center; } .package-change-bottom-section .right-packagelist-section.showmaxRightSection{ background: #3b001c url(/media/10055/white-corner-circle.png) no-repeat right center !important; background-size: auto 100%!important; } .showmaxPackageSection .icon-SHOWMAX, .showmaxPackageSection .icon-showmax{ background-image: url(/media/10051/showmax-logo.svg); width: 75%; height: 100%; float: left; background-repeat: no-repeat; margin-top: 0px; background-size: 100%; } .icon-pack.icon-SHOWMAXE36, .icon-pack.icon-SHOWMAXIS20{ background-image: url(/media/10051/showmax-logo.svg); width: 75%; height: 100%; float: left; background-repeat: no-repeat; margin-top: -5px; background-size: 100%; } .left-packagelist-section #SHOWMAXE36[type="radio"], .left-packagelist-section #SHOWMAXIS20[type="radio"]{ width: 20px; height: 21px; float: left; top: 23px; position: relative; } .showmaxPackageSection .left-packagelist-section input[type="radio"]{ width: 20px; height: 21px; margin-right: 0px !important; float: left; top: 23px; position: relative; margin-left: 5px !important; } @media only screen and (max-width: 667px){ .left-packagelist-section #SHOWMAXE36[type="radio"], .left-packagelist-section #SHOWMAXIS20[type="radio"]{ top: 10px; } span.icon-pack.icon-SHOWMAXE36, span.icon-pack.icon-SHOWMAXIS20 { width: 70%; float: right; } } .dashboardModal#showmaxModel .modal-content .modal-body{ max-width: 500px;} .dashboardModal#showmaxModel .modal-content{background: transparent; height: 100%;} .dashboardModal#showmaxModel .modal-dialog { height: 100%;} .ShowmaxPackagePopup .modal-title{ padding: 10px 10px 30px; border-bottom: none; text-align: center; font-size: 35px; font-family: Roboto; letter-spacing: 0; color: #FFFFFF; font-weight: 600; } .contactPage .main-section .popup.success .row h2 { color: #397c1f; } .contactPage #commonModalPopup .webform.modal-lg { width: 70%; } .contactPage #commonModalPopup .modal-content button.close { top: -35px; } @media screen and (max-width: 667px) { .contactPage #commonModalPopup .modal-content button.close { margin-right: -10px; }} .dashboard-page #changepackageModal .modal-dialog { Position:relative; } #cpoverlay {Position:absolute!important; bottom: 0;} @media screen and (max-width: 550px){ .change-package .packages li .pricebar .channels { margin-left: 0px!important; font-size: 14px!important; text-align: center!important; float: none!important; } .change-package .packages li .pricebar .pack-price { text-align: center!important; } .change-package .packages li .compare .check-select { bottom: 14px!important; }} @media only screen and (min-width: 767px){ .dashboard-page #wrapper .main .col-md-4.packages { /*overflow: auto!important; max-height: 342px!important; */ }} .list-inline.footer-menu a:first-child:before {display:none;} .list-inline.footer-menu li {padding:0 5px;} .list-inline.footer-menu li:last-child:after {display:none;} .list-inline.footer-menu li:after { content: "|"; height: 5px; right: -4px; position: relative; } .webform .wg2k_dropdownlistField .jcf-select span.jcf-select-text { text-align: left; } .login-popup .dropdown-menu>li>a { padding: 3px 10px; margin: 0px 5px; border-left: #fff solid 8px; } .login-popup .dropdown-menu>li>a:hover { text-transform:none;} .compare-channels .accordion-area .panel-group .panel-heading+.panel-collapse>.panel-body, .compare-channels .accordion-area .content .table tr:first-child td {border-top:0;} .compare-channels .accordion-area .panel-group .panel-heading+.panel-collapse>.panel-body {margin-bottom:15px;} textarea {resize:none;} .webform form div[class^=wg2k_] input, form .jcf-select .jcf-select-text, .webform form .wg2k_textareaField textarea {text-transform:none;} .msgBox label.error {color: #a94442;} .header-banner-img{width:450px; height:257px; display:block; margin-left:auto; margin-right:auto;} .header-banner-img-lg{width: 500px; height: 436.791px; display: block; margin-left: auto; margin-right: auto;} #countryDropdownGlobe .img-globe {font-size:35px; color:#fff;} #loader {position:fixed; left:0px; top:0px; bottom:0px; right:0px; width:100%; height:100%; z-index:99999999; background:#fff url('/media/3863/eclipse-1s-150px.gif') 50% 50% no-repeat;} .ng-whatsapp-icon {right:auto !important; left:20px; width:90px !important;} .row.footer-menu.text-center .mega-stacked.mega-menu>li.lvl-1.has-dropdown {width:auto; display:table-cell; float:none; border:none; text-align:left; padding:0 0 0 90px;} .row.footer-menu.text-center .mega-menu.mega-stacked .mega-toggle {display: inline-block; width: 100%; min-width: 140px; padding: 0 60px 0 0; position: relative; cursor: pointer; background: 0 0; border: none; text-align: left; outline: 0; } .row.footer-menu.text-center .mega-stacked.mega-menu>li.lvl-1.has-dropdown span.menu-item-txt {font-size: 17px;} .row.footer-menu.text-center .mega-stacked.mega-menu>li.lvl-1.has-dropdown span.mega-icon {display:inline-block; position:absolute; margin-right:-135px !important; right: calc(100% + 99px); top:-17px;} .row.footer-menu.text-center .mega-menu.mega-stacked {display:-webkit-inline-box; width:auto!important; margin-left:-75px !important; text-align:left; padding-top:7px; padding-bottom:5px;} .row.footer-menu.text-center .mega-menu>li.lvl-1 .icon {font-size:23px; display:inline-block; color:#fff; opacity:0.4;} .row.footer-menu.text-center .mega-stacked.mega-menu>li.lvl-1.has-dropdown span.toggle-span {display:block; margin-top:35px !important;} .row.footer-menu.text-center .mega-stacked.mega-menu>li.lvl-1.has-dropdown span.toggle-span {display:block; margin-right:92px;} .row.footer-menu.text-center > ul > li.has-dropdown.lvl-1.active > ul > li.lvl-2 {font-size:10px;} #contact-top-section {min-height:auto; background:#21567e; background:-moz-linear-gradient(-45deg, #21567e 0%, #1e3155 100%); background:-webkit-linear-gradient(-45deg, #21567e 0%, #1e3155 100%); background:linear-gradient(135deg, #21567e 0%, #1e3155 100%);} .contact-maps-bg {background:grey;} #fid-contact-map{background:#ffffff; padding:10px; min-height:639px; box-shadow:0 0 49px 0 rgba(0, 0, 0, 0.20);} .pb170{padding-bottom:170px;} .news-landing .banner-card {-webkit-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0.45);-moz-box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0.45);box-shadow: 1px 1px 4px 0.2px rgba(219,219,219,0.45);position: absolute;height: 516px;width: 800px;z-index: 1;border-radius: 10px;margin-top: 247px;margin-left: 336px;} .news-landing .banner-content .card {height: 613px;width: 400px;margin-left: 4px;margin-top: 190px;z-index: 3;color: #fff !important;} .news-landing .banner-content .card .card-body {background: rgba(8,11,14,1);height: 360px;padding: 33px;} .news-landing .banner-content .card .card-header {background: rgb(80,80,80);background: -moz-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: -webkit-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);height: 220px;border-top-left-radius: 10px;border-top-right-radius: 10px;padding: 36px;} .news-landing .banner-content .card .card-footer.text-muted {background: rgb(80,80,80); background: -moz-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%); background: -webkit-linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);background: linear-gradient(18deg, rgba(80,80,80,1) 0%, rgba(26,31,37,1) 46%, rgba(8,11,14,1) 81%);height: 53px;border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;color: #fff;padding: 15px;} .news-landing .col-sm-6.home-same-height.v-align-image {margin-left:-121px; margin-top:236px;} .news-landing img.inline-block.img-responsive {border-radius: 10px;} .news-landing button.btn.btn-primary{color:#fff;background-color:#0095da;border-color:#fff;border-radius:30px;margin-bottom:50px;margin-left:50px} .news-landing .img-responsive{display:block;width:100%;height:100%} .news-landing .col-sm-6.home-same-height{z-index:3} .news-landing #header,.news-landing .slick-dots,.news-landing button.slick-next.slick-arrow,.news-landing button.slick-prev.slick-arrow{z-index:1200!important} .find-dealer-installer-landing .Location-icon { width: 25px; height: 36px; font-family: icomoon; font-size: 35.5px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: center; color: #ffffff; } .find-dealer-installer-landing .btn.btn-primary, .btn.btn-white.btn-bordered{ font-family: Roboto; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: center; } .find-dealer-installer-landing .btn.btn-primary { border-radius: 36px; border: solid 1px #0e3178; background-color: #0e3178; color: #ffffff; } .find-dealer-installer-landing .btn.btn-white.btn-bordered{ border-radius: 36px; border: solid 1px #0e3178; color: #0e3178; } .find-dealer-installer-landing .col-md-6.trading-hours { font-family: Roboto; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.6; letter-spacing: normal; color: #00aeef; } .find-dealer-installer-landing .col-md-6.trading-hours.header { color: #000000; } /* Always set the map height explicitly to define the size of the div * element that contains the map. */ .find-dealer-installer-landing #map { height: 100%; } /* Optional: Makes the sample page fill the window. */ body.find-dealer-installer-landing { height: 100%; margin: 0; padding: 0; } .find-dealer-installer-landing #description { font-family: Roboto; font-size: 15px; font-weight: 300; } .find-dealer-installer-landing #infowindow-content .title { font-weight: bold; } .find-dealer-installer-landing #infowindow-content { display: none; } .find-dealer-installer-landing #map #infowindow-content { display: inline; } .find-dealer-installer-landing .pac-card { margin: 10px 10px 0 0; border-radius: 2px 0 0 2px; box-sizing: border-box; -moz-box-sizing: border-box; outline: none; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); background-color: #fff; font-family: Roboto; } .find-dealer-installer-landing #pac-container { padding-bottom: 12px; margin-right: 12px; } .find-dealer-installer-landing .pac-controls { display: inline-block; padding: 5px 11px; } .find-dealer-installer-landing .pac-controls label { font-family: Roboto; font-size: 13px; font-weight: 300; } .find-dealer-installer-landing #pac-input { background-color: #fff; } .find-dealer-installer-landing #pac-input:focus { border-color: #4d90fe; } .find-dealer-installer-landing #title { color: #fff; background-color: #4d90fe; font-size: 25px; font-weight: 500; padding: 6px 12px; } .find-dealer-installer-landing #target { width: 345px; } .find-dealer-installer-landing .spinner { box-shadow: 0 0 0 1px rgba(255,255,255,.1), 2px 1px 0 #1c0f84 !important; } .webform .decoder-test div[class^=wg2k_] input:-webkit-autofill, .webform .decoder-test div[class^=wg2k_] input:-webkit-autofill:hover, .webform .decoder-test div[class^=wg2k_] input:-webkit-autofill:focus, .webform .decoder-test div[class^=wg2k_] textarea:-webkit-autofill, .webform .decoder-test div[class^=wg2k_] textarea:-webkit-autofill:hover, .webform .decoder-test div[class^=wg2k_] textarea:-webkit-autofill:focus, .webform .decoder-test div[class^=wg2k_] select:-webkit-autofill, .webform .decoder-test div[class^=wg2k_] select:-webkit-autofill:hover, .webform .decoder-test div[class^=wg2k_] select:-webkit-autofill:focus {-webkit-text-fill-color: #ffffff !important;-webkit-box-shadow: 0 0 0px 1000px #245468 inset !important;} .mapwhiteBox .webform div[class^=wg2k_] input:-webkit-autofill, .mapwhiteBox .webform div[class^=wg2k_] input:-webkit-autofill:hover, .mapwhiteBox .webform div[class^=wg2k_] input:-webkit-autofill:focus, .mapwhiteBox .webform div[class^=wg2k_] textarea:-webkit-autofill, .mapwhiteBox .webform div[class^=wg2k_] textarea:-webkit-autofill:hover, .mapwhiteBox .webform div[class^=wg2k_] textarea:-webkit-autofill:focus, .mapwhiteBox .webform div[class^=wg2k_] select:-webkit-autofill, .mapwhiteBox .webform div[class^=wg2k_] select:-webkit-autofill:hover, .mapwhiteBox .webform div[class^=wg2k_] select:-webkit-autofill:focus {-webkit-text-fill-color: #00aeef !important;-webkit-box-shadow: 0 0 0px 1000px #f7f7f7 inset !important;} .app-download-box {display:none;position:fixed;top:50%;right:0px;transform: translateY(-50%);background:#e0e0e0;width:240px;border-radius:6px;padding:25px 20px 15px;z-index:1050;} .app-download-box a {display:block;} .app-download-box a img {margin:16px auto;display: block;border-radius: 6px;} .app-download-box .close-btn {width: 16px;position: absolute;right: 17px;top: 25px;cursor:pointer;} .app-download-box .title-bar span, .app-download-box .title-bar h3 {display: inline-block;} .app-download-box .title-bar h3 {font-size: 16px;line-height: 20px;color: #000;margin: 5px 5px 5px 0;} #cookie-policy-bar {width: 100%;z-index: 999999;position: relative !important;top:0;bottom: auto !important;left: 0;background: #2A2626;color: #fff;font-size: 14px;padding: 20px 60px 20px 20px !important;font-family: Roboto,sans-serif,serif;line-height: 20px;box-sizing: border-box;text-align: center;} #cookie-policy-bar .policy_link {text-decoration: none;color: #1676CB;display: inline-block;} #cookie-policy-bar .policy_link:hover, .policy_link:hover {text-decoration: underline;color: #1676CB;} #cookie-policy-bar .cookie_close {background: transparent;color: #f7f7f7;padding: 2px 8px;margin:0 !important;border: 2px solid #f7f7f7;border-radius: 20px;cursor: pointer;display: inline-block;position: absolute;right: 20px;top: 50%;transform: translate(0%, -50%);z-index:999;} .new-landing-main-sec {color: #fff;font-family: Roboto,sans-serif,serif;font-size: 14px;height: 100%;line-height: 1.5;font-weight: 300;letter-spacing: .2px;padding-right: 0!important;background: #000000;background: -moz-linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%) fixed;background: -webkit-linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%) fixed;background: linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17212b', endColorstr='#4d565d',GradientType=1 );} .new-landing-main-sec {color: #fff;font-family: Roboto,sans-serif,serif;font-size: 14px;height: 100%;line-height: 1.5;font-weight: 300;letter-spacing: .2px;padding-right: 0!important;background: #000000;background: -moz-linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%) fixed;background: -webkit-linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%) fixed;background: linear-gradient(45deg, rgba(0,0,0,1) 15%,rgb(27, 27, 27) 80%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17212b', endColorstr='#4d565d',GradientType=1 );} .dashboard-page .m-package .smartcard, .dashboard-page .m-package .package-footer-section-new { background-color: #4c98d8; } .dashboard-page .m-package { background: #85bdd7 !important; } .icon-pack.icon-MnetAS20:before { content: "\e9d3"; font-family: 'dstv-packages-icomoon'; } .MnetAS20 .backgroundimg, .backcard-packageItem.MnetAS20 .backgroundimg, .backcard-packageItem.MnetAS20 .backgroundimg { background-image: url(/media/11190/m-net.png); } .right-packagelist-section.MnetAS20, .package-info-right.MnetAS20 .smartcard, .third-top-package-info.MnetAS20 { background: #4c98d8 url(/media/9832/padi-3x.png) no-repeat right center !important; } .second-top-package-info.MnetAS20 { background: #85bdd7; backdrop-filter: blur(6px); } .backcard-packageItem.MnetAS20 { background: transparent linear-gradient(246deg, #85bdd7 0%, #4c98d8 100%) 0% 0% no-repeat padding-box; }