@font-face {
    font-family: 'Asmaa';
    src: url('fonts/asmaa.eot');
    src: url('fonts/asmaa.eot?#iefix') format('embedded-opentype'), url('fonts/asmaa.woff') format('woff'), url('fonts/asmaa.ttf') format('truetype'), url('fonts/asmaa.otf') format('opentype');
}

a:hover {
    text-decoration: none !important;
}

html, body {
    font-family: "Asmaa" !important;
    margin: 0rem;
    padding: 0rem;
    font-size: 10px;
    text-align: right;
    scroll-behavior: smooth;
    min-height: 100%;
    height: auto;
    outline: none;
    user-select: none;
    -webkit-text-size-adjust: none !important;
}

.reset-translateZ {
    -webkit-transform: translateZ(0px);
    transform: translateZ(0px);
}

div#__next {
    height: 100%;
    padding-top: 75px;
    min-height: 100%;
}
.hide{display: none!important}
.show-menu{
    overflow: hidden;
}

header.mbc3-header {
    background: #fff;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    z-index: 1006;
    position: fixed;
    width: 100%;
    top:0px;
    left:0px;
    height: 7.5rem
}


ul.nav-navbar {
    height: 100%;
    width: 71rem;
    margin: auto;
    padding: 0;
}

.show {
    display: block !important;
}

.container-fluid {
    width: 100%;
    margin: auto;
}

.container::after {
    content: "";
    clear: both
}

.container {
    max-width: 150rem;
    margin: auto;
    position: relative;
}

.show-menu .MainNav .nav-navbar {
    display: block
}

.MainNav {
    max-width: 103rem;
    position: relative;
    margin: auto;
    background: #fff;
    z-index: 105;
    box-sizing: border-box;
    max-width: 102.4rem;
    height: 7.5em
}

.sr-only {
    position: absolute;
    width: 0.1rem;
    height: 0.1rem;
    padding: 0;
    margin: -0.1rem;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    z-index: 9999999;
}

.navbar-toggle .icon-bar {
    display: block;
    height: 0.3rem;
    width: 2.4rem;
    margin-bottom: 0.4rem;
    line-height: 2.6rem;
    border-radius: 1px;
    box-sizing: border-box;
}

.navbar-toggle .icon-bar {
    background-color: #3fb702;
}

.navbar-toggle {
    position: absolute;
    float: right;
    right: 1rem;
    padding: 1rem 1rem 0.5rem;
    background-color: transparent;
    top: 0.8rem;
    border: 0rem;
    display: none;
}

button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.MainNav li {
    margin-top: 0.6rem;
    float: right;
    list-style: none;
    position: relative;
    margin-right: 2.6rem;
    width: 9.2rem;
    height: 9.2rem;
    box-sizing: border-box;
}

/* Nav Icons Style */
.MainNav .icon {
    width: 9.2rem;
    height: 9.2rem;
    box-sizing: border-box;
    display: inline-block;
    margin-top: 0.6rem;
    background: url(../img/nav/icons.svg) no-repeat;
    -webkit-filter: drop-shadow(0 0 3px #000);
    filter: drop-shadow(0 0 3px #000);
}

.MainNav .icon a {
    height: 100%;
    width: 100%;
    display: block;
}

.MainNav .albums-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: 0rem;
    background-position-y: -13.1rem;
}

.MainNav .albums-icon:hover,.MainNav .active .albums-icon {
    background-position-x: 0rem;
    background-position-y: -0.6rem;
}

.MainNav .shows-icon {
    background-position-x: -12.3rem;
    background-position-y: -13rem;
}

.MainNav .shows-icon:hover,.MainNav .active .shows-icon {
    background-position-x: -12.3rem;
    background-position-y: -0.5rem;
}

.MainNav .videos-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -25rem;
    background-position-y: -13.1rem;
}

.MainNav .videos-icon:hover,.MainNav .active .videos-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -25rem;
    background-position-y: -0.6rem;
}

.MainNav .games-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -37rem;
    background-position-y: -12.9rem;
}

.MainNav .games-icon:hover,.MainNav .active .games-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -37rem;
    background-position-y: -0.4rem;
}

.MainNav .home-icon {
    background-position-x: -50rem;
    background-position-y: -13rem;
}

.MainNav .home-icon:hover,.MainNav .active .home-icon {
    background-position-x: -50rem;
    background-position-y: -0.5rem;
}

.MainNav .grid-icon {
    background-position-x: -59.5rem;
    background-position-y: -71.1rem;
}

.MainNav .grid-icon:hover,.MainNav .active .grid-icon {
    background-position-x: -47.3rem;
    background-position-y: -71.1rem;
}

.MainNav li .grid-icon .title{
    font-size: 2.1rem;
    width: 100%;
    display: inline-block;
    left: 0rem;
    bottom: 1.3rem;
    transform: rotate(-3deg) scale(1.07);
}


.MainNav .back-icon {
    background-position-x: 0.1rem;
    background-position-y: -47.6rem;
    width: 5.1rem;
    height: 5.1rem;
    margin: 0;
}

.MainNav li .title ,.back .title {
    position: absolute;
    bottom: 1rem;
    left: 4rem;
    font-size: 2.4rem;
    font-family: Asmaa;
    transform: rotate(-3deg);
    color: white;
    /* text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; */
    text-shadow:rgb(0, 0, 0) 3px 0px 0px, rgb(0, 0, 0) 2px 1px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) 1px 1px 0px, rgb(0, 0, 0) 1px 2px 0px, rgb(0, 0, 0) 0 2px 0px, rgb(0, 0, 0) 0 2px 0px, rgb(0, 0, 0) -1px 2px 0px, rgb(0, 0, 0) -1px 2px 0px, rgb(0, 0, 0) -2px 1px 0px, rgb(0, 0, 0) -2px 1px 0px, rgb(0, 0, 0) 2px 0 0px, rgb(0, 0, 0) -2px 0 0px, rgb(0, 0, 0) -2px -1px 0px, rgb(0, 0, 0) -2px -1px 0px, rgb(0, 0, 0) -1px -2px 0px, rgb(0, 0, 0) -1px -1px 0px, rgb(0, 0, 0) -1px -2px 0px, rgb(0, 0, 0) 0 -2px 0px, rgb(0, 0, 0) 1px -2px 0px, rgb(0, 0, 0) 2px -2px 0px, rgb(0, 0, 0) 2px -2px 0px, rgb(0, 0, 0) 2px -1px 0px, rgb(0, 0, 0) 2px -1px 0px, rgb(0, 0, 0) 2px 0 0px
}

.back .title {
    left: 4rem;
}

.shows-icon .title {
    margin-left: 0.4rem;
}

.albums-icon .title {
    margin-left: 0rem;
}

.brand-logo {
    float: right;
    height: 5.9rem;
    width: 5.9rem;
    margin-top: -0.7rem;
    margin-right: 5rem;
}

.brand-logo .animated-logo {
    width: 140px; 
    height: auto;
}

/* Shows */
.content {
    background: url(../img/show-bg.png) center -6px no-repeat #D10200;
    min-height: -webkit-fill-available;
    width: 100%;
    padding-bottom: 50px
}

.indentImg {
    z-index: 100;
    width: 50.4rem;
    display: inline-block;
    margin: -2.7rem auto 3.5rem -22rem;
}

.landing-page .indentImg, .leaf .indentImg {
    margin: -3.05rem auto -3.2rem;
}

.bubbles {
    z-index: 101;
    position: absolute;
    display: block;
    margin: auto;
    width: 25rem;
    right: -31.19rem;
    left: 0;
    top: 8rem;
    height: 24.8rem;
}

.time {
    z-index: 101;
    position: absolute;
    display: block;
    margin: auto;
    right: -66rem;
    left: 2.6rem;
    top: 21.5rem;
    width: 12.5rem;
    height: 5.9rem;
}

.time img {
    position: absolute;
    bottom: -26px;
    left: -10px;
}

.bubbles img {
    width: 24.6rem;
}

.timing {
    width: 100%;
    height: 100%;
    line-height: 1.9rem;
    text-align: center;
    position: absolute;
    right: 0;
    top: 0;
    padding: 1rem 1rem 1rem 1.1rem;
    box-sizing: border-box;
    font-weight: bolder;
}

.safari-browser .timing {
    top: -7px;
}

.timing .title {
    display: inline-block;
    font-size: 1.3rem;
    text-align: center;
    color: #000;
    height: 100%;
    width: 100%;
}

.tabs {
    margin: -100px auto 0.7rem;
    width: 98rem;
    overflow: visible;
    z-index: 102;
    position: relative;
}

.tabs::after {
    clear: both;
}

.tabs ul {
    padding: 0;
}

.tabs li {
    list-style: none;
    width: 32.6rem;
    display: inline-block;
    position: relative;
}

.tabs .tab {
    display: block;
    width: 25rem;
    height: 17.9rem;
    position: relative;
    box-sizing: border-box;
    transform: scale(1);
}

.tabs .tab-0 a {
    left: 4.4rem;
}

.tabs .tab-0 .title {
    right: 1.8rem;
}

.tabs .tab-1 a {
    left: 1.7rem;
}

.tabs .tab-1 .title {
    right: 2.8rem;
}

.tabs .tab-2 a {
    right: 0.9rem;
}

.tabs .tab-2 .title {
    right: 1.7rem;
}

.tabs .tab img {
    width: 25rem;
    margin: auto;
    right: 0px;
    position: absolute;
    z-index: 1;
}

.tabs .title {
    color: #f0f0f0;
    font-size: 3.9rem;
    text-decoration: none !important;
    position: absolute;
    left: auto;
    top: auto;
    z-index: 1;
    bottom: 2.3rem;
    text-shadow: rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) 3.87565px 0.989616px 0px, rgb(0, 0, 0) 3.51033px 1.9177px 0px, rgb(0, 0, 0) 2.92676px 2.72656px 0px, rgb(0, 0, 0) 2.16121px 3.36588px 0px, rgb(0, 0, 0) 1.26129px 3.79594px 0px, rgb(0, 0, 0) 0.282949px 3.98998px 0px, rgb(0, 0, 0) -0.712984px 3.93594px 0px, rgb(0, 0, 0) -1.66459px 3.63719px 0px, rgb(0, 0, 0) -2.51269px 3.11229px 0px, rgb(0, 0, 0) -3.20457px 2.39389px 0px, rgb(0, 0, 0) -3.69721px 1.52664px 0px, rgb(0, 0, 0) -3.95997px 0.56448px 0px, rgb(0, 0, 0) -3.97652px -0.432781px 0px, rgb(0, 0, 0) -3.74583px -1.40313px 0px, rgb(0, 0, 0) -3.28224px -2.28625px 0px, rgb(0, 0, 0) -2.61457px -3.02721px 0px, rgb(0, 0, 0) -1.78435px -3.57996px 0px, rgb(0, 0, 0) -0.843183px -3.91012px 0px, rgb(0, 0, 0) 0.150409px -3.99717px 0px, rgb(0, 0, 0) 1.13465px -3.8357px 0px, rgb(0, 0, 0) 2.04834px -3.43574px 0px, rgb(0, 0, 0) 2.83468px -2.82216px 0px, rgb(0, 0, 0) 3.44477px -2.03312px 0px, rgb(0, 0, 0) 3.84068px -1.11766px 0px, rgb(0, 0, 0) 3.9978px -0.132717px 0px;
}

a.tab:hover span.title, a.tab.selected span.title{
    color: #fdd331
}

.poly-2 {
    -webkit-clip-path: polygon(30px 184px, 247px 187px, 225px 68px, 6px 98px) !important;
    clip-path: polygon(30px 184px, 247px 187px, 225px 68px, 6px 98px) !important;
    /* clip-path: url("#clipPolygon-2"); */
    width: 25rem;
    height: 19.1rem;
    position: relative;
    z-index: 0;
}

.poly-1 {
    -webkit-clip-path: polygon(5px 66px, 21px 185px, 234px 183px, 248px 83px, 5px 67px) !important;
    clip-path: polygon(5px 66px, 21px 185px, 234px 183px, 248px 83px, 5px 67px) !important;
    /* clip-path: url("#clipPolygon-1"); */
    width: 24.9rem;
    height: 18.7rem;
    position: relative;
    z-index: 0;
}

.poly-0 {
    -webkit-clip-path: polygon(5px 188px, 250px 186px, 234px 71px, 15px 96px) !important;
    clip-path: polygon(5px 188px, 250px 186px, 234px 71px, 15px 96px) !important;
    /* clip-path: url("#clipPolygon-0"); */
    width: 25rem;
    height: 18.9rem;
    position: relative;
    z-index: 0;
}

.tab:hover div[class*="poly-"] {
    background-image: url(../img/demo/hover-tab.svg);
    background-position: center top;
    background-repeat: no-repeat
}

.tab:hover {
    cursor: pointer;
}

.stream ,.static-container,.grid-container {
    width: 100rem;
    margin: auto;
    padding: 0rem;
    border: none;
    position: relative;
    overflow: visible;
    margin-bottom: 6rem;
}

.stream.bootstrap-wrapper .row {
    display: block;
    padding: 0 1rem
}

.grid-container{
    min-width: 100rem;
}

.static-container, .grid-container {
    margin-top: 31.7rem
}

.static-container-wrapper, .grid-container-wrapper{
    padding: 3.7rem 2.6rem!important;
    direction: rtl
}

.static-container-wrapper h1, .grid-container-wrapper h1, h1.search-result-title {
    font-size: 3rem;
    margin-bottom: 0.8rem;
    color: #3b9e2d;
    font-weight: lighter
}

.static-container-wrapper p, .static-container-wrapper li {
    color: #4a4a4a;
    font-size: 2rem;
    margin-bottom: 3.4rem;
    line-height: 3.4rem
}

.stream:before, .static-container:before, .grid-container:before {
    content: '';
    display: block;
    position: absolute;
    box-sizing: border-box;
    background: #F4F4F4;
    transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    position: absolute;
    overflow: visible;
    box-shadow: 0px 0px 6px 3px #00000012;
    width: 100%;
    height: 100%;
    max-height: 23rem;
    z-index: 1;
    transform-origin: 33rem 24rem;
    top: 0;
}

.stream:after, .static-container:after, .grid-container:after {
    content: '';
    display: block;
    position: absolute;
    box-sizing: border-box;
    background: #F4F4F4;
    transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    position: absolute;
    overflow: visible;
    box-shadow: 0px 0px 6px 3px #00000012;
    width: 100%;
    height: 100%;
    max-height: 23rem;
    z-index: 0;
    bottom: 0;
    transform-origin: 60rem 0rem;
}

.static-container:before {
    -ms-transform: skew(0deg,1.5deg);
    -webkit-transform: skew(0deg,1.5deg);
    transform: skew(0deg,1.5deg);
    width: 98%;
    left: 1%;
}

.card {
    position: relative;
    padding: 0rem;
    width: 31.1rem;
    overflow: hidden;
    box-sizing: border-box;
    height: 23.3rem;
    transform: scale3d(1, 1, 1);
    transition-property: transform;
    transition-duration: .1s;
    filter: blur(0);
    margin: 1.5rem auto 1rem;
    display: block;
}

.active.card:before {
    content: '';
    width: 31.1rem;
    height: 23.3rem;
    background: url(../img/card/cardFrame.svg) 100% 0 no-repeat;
    display: block;
    position: absolute;
    background-size: 100%;
    z-index: 2;
}

.active.card:after {
    content: '';
    display: block;
    position: absolute;
    background-size: 100%;
    z-index: 2;
    top: 0;
    width: 30.4rem;
    height: 23.6rem;
    -webkit-box-shadow: 0rem -10.8rem 3.5rem -5.75rem rgba(0, 0, 0, 0.78) inset;
	-moz-box-shadow: 0rem -10.8rem 3.5rem -5.75re rgba(0, 0, 0, 0.78) inset;
    box-shadow: 0rem -10.8rem 3.5rem -5.75rem rgba(0, 0, 0, 0.78) inset;
}

.card.no-border:before {
    display: none;
}

.show.card:before,.show.card .cardInfo {
    display: none
}

.ad-card {
    padding: 0.6rem;
    position: relative;
    height: 23rem;
    width: 30.6rem;
}

.cardInfo {
    position: absolute;
    width: 30.4rem;
    height: 2.6rem;
    bottom: 2.3rem;
    text-align: right;
    z-index: 3;
}

.cardTitle {
    display: inline-block;
    position: absolute;
    width: 24.5rem;
    right: 0rem;
    top: 0;
    font-size: 1.5rem;
    z-index: 0;
    padding: 0.3rem 1.1rem 0 0;
    direction:rtl;
    color: #000;
}

.cardTitle::after {
    content: "";
    display: block;
    border-top: 2.2rem solid #fff;
    border-left: 1rem solid transparent;
    border-right: 0 solid #ee5757;
    height: 0;
    width: 24rem;
    position: absolute;
    right: 0.2rem;
    top: 0.2rem;
    z-index: -1;
}

.cardTitle::before {
    content: "";
    display: block;
    border-top: 2.6rem solid #000;
    border-left: 1.2rem solid transparent;
    border-right: 0 solid #ee5757;
    height: 0;
    width: 24.5rem;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.cardLogo {
    width: 3.3rem;
    height: 2.8rem;
    background-size: 19.7rem !important;
}

.icone-image {
    background: url(../img/nav/icons.svg) no-repeat 0px -3px;
}

.icone-show {
    background: url(../img/nav/icons.svg) no-repeat -65px -6px;
}

.icone-game {
    background: url(../img/nav/icons.svg) no-repeat -97px -3px;
}

.icone-home {
    background: url(../img/nav/icons.svg) no-repeat -132px -3px;
}

.icone-video {
    background: url(../img/nav/icons.svg) no-repeat -33px -3px;
}

.cardImage {
    width: 30rem;
    height: 22.6rem;
    margin-top: 0.4rem;
    margin-right: 0.7rem;
    position: relative;
    z-index: 1;
}

.stream-wrraper, .static-container-wrapper, .grid-container-wrapper {
    background: #fff;
    overflow: auto;
    overflow-x: hidden;
    /* IE 9 */
    box-shadow: 0rem 0rem 1rem 0.4rem #0000004d;
    padding: 0.1rem 0 1.2rem;
    width: 100%;
    z-index: 2;
    position: relative;
}

/* .static-container-wrapper {
    box-shadow: none;
} */

/* Update on the Bootstrap */
.bootstrap-wrapper .row {
    display: inline;
    margin-left: 0rem;
    margin-right: 0rem;
}

.bootstrap-wrapper [class^="col-"] {
    padding: 0.5rem;
    float: right;
    box-sizing: border-box;
    padding: 0;
}

.overlay {
    position: fixed;
    height: 100vh;
    width: 100%;
    background: rgba(0, 0, 0, 0.322);
    top: 0px;
    bottom: 0px;
    z-index: 1001;
    display: none;
    overflow: hidden;
    scroll-behavior: unset;
}

.show-menu {
    overflow: hidden;
    position: relative;
    height: 100%;
    width: 100%;
}

.show-menu .overlay {
    display: none;
}

.background-container {
    background: none center 54px no-repeat scroll transparent;
    overflow: hidden;
}

.white-bg {
    background-color: #ffffff;
}

footer {
    direction: rtl;
    margin-top: 6rem;
}

.no-service footer {
    display: none;
}

.footer-nav {
    text-align: center;
    font-size: 1.6rem;
}

.footer-nav ul {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

.footer-nav ul li {
    display: inline-block;
    padding: 0px 8px;
    border-left: solid 1px #fff;
    line-height: 1.4rem
}

.footer-nav ul li:first-child {
    padding-right: 0px
}

.footer-nav ul li:last-child {
    border-left: none
}

.footer-nav ul li a {
    color: #fff
}

.footer-nav ul li a:hover {
    color: #D2D2D2
}

.copyrights {
    padding-top: 2rem;
    padding-bottom: 3rem;
    text-align: center;
    font-size: 1.6rem;
    color: #fff;
}

.preloader {
    position: fixed;
    left: 0;
    top: 75px;
    width: 100vw;
    height: 100vh;
    font-size: 48px;
    text-align: center;
    line-height: 100vh;
    background: #fff;
    direction: rtl;
    z-index: 104;
    color: #fff
}

.preloader img {
    display: block;
    position: absolute;
    top: 40%;
    transform: translate(-50%);
    left: 50%;
    width:15rem
}

.cardInfo .icon {
    width: 4rem;
    height: 4rem;
    display: block;
    top: -0.7rem;
    position: absolute;
    left: 1.4rem;
    background: url(../img/nav/icons.svg) no-repeat;
}

.cardInfo .game-icon, .search-result-icon[data-type="game"] {
    background-position-x: -40.4rem;
    background-position-y: -25rem;
}

.cardInfo .album-icon, .search-result-icon[data-type="album"] {
    background-position-x: -2.4rem;
    background-position-y: -25rem;
}

.cardInfo .event-icon, .search-result-icon[data-type="event"] {
    background-position-x: -15.2rem;
    background-position-y: -25rem;
}

.cardInfo .video-icon, .search-result-icon[data-type="video"] {
    background-position-x: -27.8rem;
    background-position-y: -25rem;
}

.cardInfo .shows-icon, .search-result-icon[data-type="show"] {
    background-position-x: -15.1rem;
    background-position-y: -25rem;
}

span.icon.form-icon, .search-result-icon[data-type="form"] {
    background-position-x: -53rem;
    background-position-y: -25rem;
}

.back {
    position: absolute;
    top: 1.2rem;
    left: 2rem;
    cursor: pointer;
}

.landing-page .Jumbotron .container, .leaf .Jumbotron .container {
    width: 100%;
}

.Jumbotron {min-height: 31.5rem}
.Jumbotron .container {
    text-align: center;
    position: relative;
    width: 90rem;
    margin: 0rem auto 0rem;
    height: auto;
    display: inline-block;
}

.Jumbotron {
    text-align: center;
    padding: 0px;
    box-sizing: border-box;
    width: 98rem;
    margin: auto;
    position: relative;
}

.inactive.card:after {
    background-image: url(../img/placeholder.png);
    width: 30.8rem;
    height: 22.6rem;
    margin-right: 0;
    content: '';
    background-size: 100%;
    display: block;
    position: absolute;
    top: 0.3rem;
    left: 0;
    z-index: 0;
}

.show.card:after {
    display: none!important
}

/* main {
    min-height: 100%;
} */

.container-fluid {
    min-height: 100%;
}

/* Sponsored logo design */
.takeover.sponsored-logos {
    position: absolute;
    max-height: 24rem;
    height: auto;
    width: 13rem;
    left: 0;
    top: 0;
    background-color: #00000080;
    border-radius: 0 0 0.7rem 0.7rem;
    z-index: 101;
}

.takeover.sponsored-logos a.sponsored-logo-link {
    display: block;
    width: 8.2rem;
    height: 4.8rem;
    margin: 0.9rem auto 1.4rem;
}

.takeover.sponsored-logos a.sponsored-logo-link:nth-child(4) {
    margin-top: 1.9rem;
}

.takeover.sponsored-logos a.sponsored-logo-link img {
    width: 8.2rem;
    height: 4.8rem;
}

.takeover.sponsored-logos span.takeover-title {
    display: block;
    width: 5.5rem;
    height: 2.8rem;
    margin: 0.9rem auto 0;
    color: #fff;
    direction: rtl;
    font-size: 1.6rem;
}

/*  Takeover design */
.takeover {
    position: absolute;
    height: 25.2rem;
    width: 13rem;
    left: 0;
    top: -1.2rem;
    border-radius: 0 0 0.7rem 0.7rem;
    z-index: 101;
}

.takeover a.takeover-link {
    display: block;
    height: 25.2rem;
    width: 13rem;
}

a.takeover-link img {
    height: 25.2rem;
    width: 13rem;
}

.not-found .container-fluid,
.no-service .container-fluid {
    background-size: cover!important;
    background-position: center center!important
}

.not-found footer {
    display: none
}

.notFound span, .noService span  {
    color: white;
    text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-size: 2.5rem;
    position: absolute;
    width: 100%;
    text-align: center;
    left: 1.1rem;
    bottom: 4.8rem
}
.noService span, .notFound span {
    color: white;
    text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    font-size: 2.5rem;
    position: absolute;
    width: 100%;
    text-align: center;
    left: 1.1rem;
    bottom: 4.8rem
}

.splash {
    max-width: 33.5rem;
    display: block;
    margin: auto
}

.avatar {
    max-width: 30rem
}

.option-1 .splash {
    margin-top: -23.3rem;
    margin-right: 0
}

.option-1 .avatar {
    margin-top: -13.1rem;
    margin-right: -7.3rem
}

.ContactForm .field {
    display: block;
    margin-bottom: 2rem;
}

.ContactForm label {
    width: 12.8rem;
    font-size: 2rem;
    text-align: left;
    margin-left: 2rem;
    display: inline-block;
    vertical-align: top;
}

.ContactForm .submit-field .control {
    margin: 0 15.6rem 2.1rem  0;
}

.ContactForm input,
.ContactForm textarea,
.ContactForm select {
    max-width: 46rem;
    width: calc(100% - 10rem);
    padding: 0.1rem 1rem;
    box-sizing: border-box;
    border-radius: 0.5rem;
    border: solid 1px #ddd;
    font-size: 1.8rem;
    display: inline-block;
    vertical-align: bottom;
}

.ContactForm div#g-recaptcha {
    display: inline-block;
}

.ContactForm .control select :disabled {
    color: #d0d0d0
}

.ContactForm select#country {
    display: none;
}

.ContactForm textarea {
    min-height: 11.8rem
}
.ContactForm .error{
    border:solid 1px #ec4848
}

.ContactForm button[type="submit"] {
    border-radius: 0.5rem;
    background-color: #6ed232;
    color: #fff;
    font-size: 1.5rem;
    min-width: 11.8rem;
    border: none;
    box-shadow: 0px 4px #55ad21;
    outline: none;
    cursor: pointer;
}

.ContactForm  button.button.is-primary:active {
    background-color: #349328;
    box-shadow: 0px 4px #349328;
}

::-webkit-input-placeholder {
    color: #d0d0d0;
}

::-moz-placeholder {
    color: #d0d0d0;
    opacity: 1;
}

:-ms-input-placeholder {
    color: #d0d0d0;
}

/* .error::-webkit-input-placeholder {
    color: #ec4848;
}

.error::-moz-placeholder {
    color: #ec4848;
    opacity: 1;
}

.error:-ms-input-placeholder {
    color: #ec4848;
}
 */

 .ContactForm  div.dropdown-container > div.dropdown-display.error > span{
    color: #d0d0d0;
}
.ContactForm input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
    -webkit-appearance: textfield;
}
.ContactForm button[type="submit"] {
    border-radius: 0.5rem;
    background-color: #6ed232;
    color: #fff;
    font-size: 1.5rem;
    min-width: 11.8rem;
    border: none;
    box-shadow: 0px 4px #55ad21;
}

.ContactForm span.error-msg {
    display: block;
    position: relative;
    right: 15rem;
    color: #ec4848;
    font-size: 1.6rem;
    line-height: 3rem;
    top: 1rem;
}

.ContactForm .dropdown-container {
    display: inline-block !important;
    z-index: 1;
    max-width: 46rem;
    width: calc(100% - 10rem);
}

.ContactForm .error-list{margin:0 12.7rem 0 0;padding:0;list-style-type: none;font-size:1.4rem;color:#ec4848}
.ContactForm .error-list li:before { content: "*";line-height: 100%;margin-left:0.3rem}

.slick-slider .slick-prev:before, .slick-slider .slick-next:before {
    content: '';
}

.leaf-container {
    width: 91rem;
    margin: 3.5rem auto;
    padding: 4rem 10.5rem 0;
    background: #232323;
    height: 68rem;
    box-sizing: border-box;
    overflow: hidden;
}

.game .leaf-container {
    width: 100%;
    margin: 0;
    padding: 0;
    background: #232323;
    min-height: 68rem;
    box-sizing: border-box;
}

.game .stream-wrraper {
    padding: 0;
}

.game.ads-overlay-visible .stream-wrraper{
    overflow: hidden;
}

.theo-primary-color, .vjs-selected {
    color: #6ed232 !important;
}

.theoplayer-container ,
.theo-big-play-button-svg-container {
    width: 100%;
    height: 100%;
}

.theo-big-play-button-svg-container>svg,
.vjs-big-play-button::after,
.theo-upnext-panel-autoplay>svg,
.vjs-time-divider,
.theo-cast-button,
.theo-airplay-button,
.theo-upnext-panel-showing .theo-upnext-bar,
.theo-upnext-panel-showing .vjs-control-bar>*{
    display: none !important;
}

.vjs-fullscreen.theo-upnext-panel-showing .vjs-control-bar>.vjs-fullscreen-control{
    display: inline-block !important;
    position: absolute !important;
    right: 6px;
}

.vjs-big-play-button{
    width: 11rem !important;
    height: 12rem !important;
    padding: 0 !important;
    background: transparent !important;
}

.theo-upnext-panel-content{
    height: 100%;
    background: rgba(0,0,0,0.4);
}
 
#upnext-loader>svg{
    opacity: .8;
    z-index: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 11em;
    height: 11em;
    transform: translate(-5.6em,-5.5em);
}

.theo-upnext-panel-autoplay{
    width: 8em !important;
    height: 9em !important;
    padding: 0 !important;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    cursor: pointer;
    z-index: 20;
}

.theo-upnext-panel-autoplay::after {
    display: block !important;
}

.theo-upnext-panel-image{
    height: 21.4em !important;
    width: 28.4em !important;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-size: contain !important;
    background-repeat: no-repeat;
}

.theo-upnext-panel-image::before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.35);
}

.theo-upnext-panel-image::after{
    content: '';
    position: absolute;
    left: -.7em;
    top: -.25em;
    right: -.5em;
    bottom: -.5em;
    background: url(../img/card/cardFrame_white.svg) top left / contain no-repeat;
}

.theo-big-play-button-svg-container::before,
.theo-big-play-button-svg-container::after,
.theo-upnext-panel-autoplay::before,
.theo-upnext-panel-autoplay::after {
    content: '';
    position: absolute;
    background: url(../img/nav/icons.svg) no-repeat;
}

.theo-big-play-button-svg-container::before {
    left: 0;
    top: 0;
    width: 110px;
    height: 120px;
    background-position: 0 -55.8rem;
}

.theo-upnext-panel-autoplay::before {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-position: 0 -40em;
    background-size: 50em;
}

.theo-big-play-button-svg-container::after {
    width: 52px;
    height: 60px;
    background-position: -38px -71rem;
    left: 30px;
    top: 26px;
}

.theo-upnext-panel-autoplay::after {
    width: 5em;
    height: 5em;
    background-position: -3em -61.5em;
    background-size: 60em;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.theo-upnext-panel-text{
    top: 50%;
    font-family: Asmaa;
    padding: 0 !important;
    transform: translateY(-18em);
}

.theo-upnext-panel-text>.theo-upnext-panel-upnext{
    color: #c2c2c2;
    font-size: 2em !important;
}

.theo-upnext-panel-text>.theo-upnext-panel-title{
    font-size: 3em !important;
}

.theo-upnext-bar {
    font-family: Asmaa;
}

.theo-upnext-bar .theo-upnext-bar-upnext {
    color: #c2c2c2;
}

.vjs-control-bar {
    height: 4em !important;
}

.vjs-time-control {
    line-height: 4em !important;
}

.theoplayer-container.theo-mobile .vjs-duration {
    top: -0.5em !important;
    right: 5.6em !important;
}

.theoplayer-container.theo-mobile:not(.vjs-ended) .vjs-current-time {
    display: inline-block !important;
    font-size: 1.3em;
    margin-top: -0.5em !important;
}

.vjs-progress-control {
    left: 16em !important;
    right: 11em !important;
    bottom: 43% !important;
}

.theoplayer-container.theo-mobile .vjs-progress-control {
    left: 11em !important;
}

.vjs-volume-control {
    width: 5em !important;
    margin-right: 0.5em !important;
}

.vjs-volume-bar {
    opacity: 1 !important;
}

.vjs-duration {
    right: 8em;
    position: absolute !important
}

.vjs-progress-control .vjs-progress-holder {
    background: #fff !important;
}

.vjs-progress-control .vjs-load-progress>div {
    background: #4c9023 !important;
}

.vjs-progress-control .vjs-slider-bar::before {
    content: '' !important;
    background: #fff;
    width: 18px;
    height: 18px;
    border-radius: 50%;
}

.vjs-control-bar>.vjs-button {
    height: 3.5em !important;
    margin: auto 0.2em !important;
}

.vjs-control-bar>.vjs-button::before,
.vjs-control-bar>.vjs-button::after {
    content: '' !important;
    background-image: url(../img/nav/icons.svg);
    background-repeat: no-repeat;
    position: absolute;
    background-size: 23em;
}

.vjs-control-bar>.vjs-button::before {
    width: 1.8em !important;
    height: 2em !important;
    background-position: 0 -8.8em;
    background-size: 11em;
    font-size: 1.8em !important;
}

.vjs-control-bar>.vjs-button:active::before,
.vjs-control-bar>.vjs-button:hover::before {
    background-position: -2.19em -8.8em;
}

.vjs-control-bar>.vjs-button::after {
    width: 2.5em;
    height: 2.2em;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.vjs-play-control.vjs-paused::after {
    background-position: -0.8em -23.4em;
}

.vjs-play-control.vjs-playing::after {
    background-position: -4.2em -23.4em;
}

.vjs-mute-control::after {
    background-position: -.9em -26.1em;
}

.vjs-mute-control.vjs-vol-0::after{
    background-position: -7.7em -26.1em;
}

.vjs-mute-control.vjs-vol-1::after,
.vjs-mute-control.vjs-vol-2::after {
    background-position: -4.4em -26.1em;
}

.theo-settings-control-button::after {
    background-position: -10.76em -23.35em;
}

.theo-settings-control-label-hd {
    right: -.3em !important;
    top: .70em !important;
}

.vjs-fullscreen-control::after {
    background-position: -7.52em -23.35em;
}

.vjs-fullscreen .vjs-fullscreen-control::after {
    background-position: -10.7em -26.1em;
}

.theoplayer-container .video-header {
    transition: opacity 0.3s;
}

.theoplayer-container .title-shadow {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 6em;
    pointer-events: none;
    background: -webkit-linear-gradient(bottom, rgba(0,0,0,0), black);
    background: -moz-linear-gradient(bottom, rgba(0,0,0,0), black);
    background: linear-gradient(to top, rgba(0,0,0,0), black);
}

.theoplayer-container .leaf-video-title {
    font-family: Asmaa;
    font-size: 1.5em;
    position: absolute;
    bottom: -2em;
    right: 0;
    text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.theoplayer-container.vjs-fullscreen .leaf-video-title {
    bottom: auto;
    top: 1em;
    right: .5em;
}

.theoplayer-container.vjs-fullscreen.vjs-ended .leaf-video-title {
    right: 3em;
}

.theoplayer-container .leaf-video-back {
    display: none;
    position: absolute;
    top: -3em;
    left: 1em;
    width: 1.8em;
    height: 2em;
    font-size: 1.5em;
    cursor: pointer;
    background: url(../img/nav/icons.svg) no-repeat;
    background-position: -4.34em -8.8em;
    background-size: 11em;
}

.theoplayer-container .leaf-video-replay {
    position: absolute;
    font-size: 1.5em;
    width: 2.8em;
    height: 3em;
    cursor: pointer;
    display: none;
    right: -4.7em;
    top: -1.2em;
    background: url(../img/replay.svg) no-repeat;
    background-size: contain;
}

.theoplayer-container.vjs-fullscreen .leaf-video-back {
    display: block;
    top: .5em;
    left: .5em;
}

.theoplayer-container.vjs-fullscreen .leaf-video-replay {
    top: .5em;
    right: .5em;
    width: 1.8em;
    height: 2em;
}

.theoplayer-container.vjs-ended:not(.vjs-error) .leaf-video-replay {
    display: block;
}

.vjs-fullscreen.vjs-user-inactive.vjs-playing:not(.theo-menu-opened) .video-header {
    opacity: 0;
}

.slick-slide img {
    width: 70rem;
    height: 52.5rem;
    object-fit: cover
}

.slick-slider .slick-prev, .slick-slider .slick-next {
    top: 26.3rem;
    width: 3.5rem;
    height: 5rem;
    background: transparent;
}

.slick-slider .slick-prev {
    left: -7.5rem;
    background: url(../img/nav/icons.svg) -9rem -47.6rem no-repeat !important;
    filter: drop-shadow(0 0 3px black);
}

.slick-slider .slick-next {
    right: -7.5rem;
    background: url(../img/nav/icons.svg) -15rem -47.6rem no-repeat !important;
    filter: drop-shadow(0 0 3px black);
}

.slick-slider .slick-prev.slick-disabled {
    background: url(../img/nav/icons.svg) -21rem -47.6rem no-repeat !important;
}

.slick-slider .slick-next.slick-disabled {
    background: url(../img/nav/icons.svg) -27rem -47.6rem no-repeat !important;
}

.slick-slider .photo-album-info {
    min-height: 11.5rem;
    padding: 0 5.4rem 0 0;
    position: relative;
    background-image: linear-gradient(to bottom, rgba(35, 35, 35, 0.45), #232323);
    -webkit-transition: margin-top 0.3s;
    -webkit-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    margin-top: 0.5rem;
    transition: margin-top 0.3s;
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}

.slick-slider .photo-album-info.expand {
    margin-top: -12.4rem;
}

.slick-slider .photo-album-info a {
    position: absolute;
    right: 1.5rem;
    top: 1.5rem;
    width: 2.4rem;
    height: 2.4rem;
    background: url(../img/nav/icons.svg) -34.5rem -48.89rem no-repeat !important;
}

.slick-slider .photo-album-info.expand a {
    background: url(../img/nav/icons.svg) -39.4rem -48.89rem no-repeat !important;
}

.slick-slider .photo-album-info span.photo-album-title {
    font-size: 2.4rem;
    line-height: 5rem;
    text-align: right;
    color: #ffffff;
}

.slick-slider .photo-album-info p.photo-album-caption, 
.display-text-group {
    width: 100%;
    min-height: 10.6rem;
    font-size: 1.8rem;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.39;
    letter-spacing: normal;
    text-align: right;
    color: #bdbdbd;
    margin: 0;
    height: auto;
}

span.read-more-button {
    color: #6ed232;
}

.game-player {
    width: 100%;
    height: auto;
    margin: 0rem;
    -webkit-overflow-scrolling: touch;
}

.game-player iframe {
    border: none;
    width: 100%;
    height: 63rem
}
.game-player iframe:focus{
    border:solid 1px #c00
}

.event-container img {
    max-width: 100%
}

.event-container>.theoplayer-container{
    height: 433px !important;
}

.leaf.event .leaf-container {
    width: 100%;
    background: #fff;
    height: auto;
    margin: 0 auto;
}

.g-recaptcha iframe.error{
    border: 1px solid red
}

.display-text-group {
    display: none;
}

.event-container {
    text-align: center;
}

.event-container .theoplayer-container:not(.vjs-fullscreen) .leaf-video-title,
.event-container .leaf-video-back {
    display: none !important;
}

.is-animated-pop{
    transform: translateZ(0);
    animation: bounceOut 0.4s;
}

.is-animated-pop:hover{
    transform: scale(1.09);
    animation: bounceIn 0.3s;
}

@keyframes bounceIn {
    0%   {transform: scale(1);}
    20%  {transform: scale(1.05);}
    100% {transform: scale(1.09);}
}

@keyframes bounceOut {
    0%   {transform: scale(1.09);}
    30%  {transform: scale(1);}
    40%  {transform: scale(1.03);}
    100% {transform: scale(1);}
}

.border-box {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
div.dropdown-container {
  display: block;
  position: relative;
  width: 46rem;
}
div.dropdown-container::after {
    content: '';
    position: absolute;
    left: 0;
    width: 4rem;
    height: 4rem;
    background: url(../img/nav/icons.svg) -51.7rem -48rem no-repeat;
}
div.dropdown-container.show > div.dropdown-list {
  transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
}
div.dropdown-container > div.dropdown-display {
  float: left;
  width: 100%;
  /* background: white; */
  height: 3.6rem;
  border: solid 1px #dddddd;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  border-radius: 0.5rem;
}

div.dropdown-container > div.dropdown-display > * {
  height: 100%;
  height: 3.6rem;
  line-height: 3.5rem !important;
  display: inline-block;
  vertical-align: middle;
}
div.dropdown-container > div.dropdown-display > span {
  font-size: 1.8rem;
  width: 100%;
  position: relative;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  padding-right: 1rem;
  padding-left: 1rem;
  color:#d0d0d0;
}
div.dropdown-container > div.dropdown-display > span[class*="selected"],
div.dropdown-container > div.dropdown-display.error > span[class*="selected"]{
    color:#000000;
}
div.dropdown-container > div.dropdown-display.error{
    border: solid 1px #ec4848;
    color: #ec4848;
}

div.dropdown-container > div.dropdown-display.error > span{
    color: #ec4848;
}
div.dropdown-container > div.dropdown-display > i {
  position: relative;
  width: 1.4rem;
  margin-left: -2.4rem;
  font-size: 1.125em;
  font-weight: bold;
  padding-right: 1rem;
  text-align: right;
}
div.dropdown-container > div.dropdown-list {
  float: left;
  position: relative;
  width: 100%;
  transform: scale(1, 0);
  -ms-transform: scale(1, 0);
  -webkit-transform: scale(1, 0);
  -o-transform: scale(1, 0);
  -moz-transform: scale(1, 0);
  -webkit-transition: -webkit-transform ease 250ms;
  -moz-transition: -webkit-transform ease 250ms;
  -ms-transition: -webkit-transform ease 250ms;
  -o-transition: -webkit-transform ease 250ms;
  transition: -webkit-transform ease 250ms;
  -webkit-transition: transform ease 250ms;
  -moz-transition: transform ease 250ms;
  -ms-transition: transform ease 250ms;
  -o-transition: transform ease 250ms;
  transition: transform ease 250ms;
}
div.dropdown-container > div.dropdown-list > div {
  position: absolute;
  width: 100%;
  z-index: 2;
  cursor: pointer;
  background: white;
  min-height: 20.5rem;
  max-height: 30.5rem;
  overflow:scroll;
  border:solid 1px #dddddd;
  border-radius: 0.5rem;
}
div.dropdown-container > div.dropdown-list > div > div {
  float: left;
  width: 100%;
  padding: 0 10px;
  font-size: 1.8rem;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  border-top: none;
}
div.dropdown-container > div.dropdown-list > div > div:hover {
  background: #6ed232;
}
div.dropdown-container > div.dropdown-list > div > div:hover span{
    color:#fff
}
div.dropdown-container > div.dropdown-list > div > div.selected {
  background: #2875c7;
  color: white;
}
div.dropdown-container > div.dropdown-list > div > div > * {
  height: 4rem;
  line-height: 4rem !important;
  display: inline-block;
  vertical-align: middle;
}
div.dropdown-container > div.dropdown-list > div > div > span {
  float: left;
  width: 100%;
  position: relative;
  padding-right:1.4rem;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  color: #000;
}
div.dropdown-container > div.dropdown-list > div > div > i {
  float: left;
  width: 2rem;
  margin-left: -2rem;
  display: none;
}
div.dropdown-container > div.dropdown-list > div > div.selected > i {
  display: inline-block;
}
_::-webkit-full-page-media, _:future, :root .safari_only, .ContactForm input {
    font-size: 1.6rem !important;
    height: 4rem !important;
    line-height: 4rem !important;
}

_::-webkit-full-page-media, _:future, :root .safari_only, input::-webkit-input-placeholder {
    font-size: 1.6rem !important;
    line-height: 4rem !important;
    height: 4rem !important;
    
}

.event-container a.event-link {
    display: block;
    height: auto;
    width: auto;
}

.noService, .notFound {
    position: relative;
    max-width: 120rem;
    margin: auto;
}

.noService .splash-container, .notFound .splash-container {
    display: inline-block;
    position: absolute;
    left: 24rem;
    top: 5rem;
}

.noService .avatar-container, .notFound .avatar-container {
    display: inline-block;
    position: absolute;
    right: 28.5rem;
    top: 7.7rem;
}

.avatar {
    margin: 2rem auto 0;
    display: block;
}

.geo-restriction .geo-restriction-container {
    max-width: 98rem;
    margin: auto;
}

.geo-restriction .geo-image {
    width: 11.8rem;
    height: 12rem;
    margin: 10.3rem auto 4.5rem;
    position: relative;
}

.geo-restriction .geo-image img{
    width: 100%;
    height: 100%;
    display: inline-block;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.geo-restriction span.geo-title {
    font-size: 3rem;
    font-family: Asmaa;
    text-align: center;
    display: block;
    color: white;
    margin-bottom: 0.5rem;
    text-shadow:rgb(0, 0, 0) 3px 0px 0px, rgb(0, 0, 0) 3px 1px 0px, rgb(0, 0, 0) 2px 2px 0px, rgb(0, 0, 0) 2px 2px 0px, rgb(0, 0, 0) 1px 2px 0px, rgb(0, 0, 0) 1px 3px 0px, rgb(0, 0, 0) 0 3px 0px, rgb(0, 0, 0) 0 3px 0px, rgb(0, 0, 0) -1px 3px 0px, rgb(0, 0, 0) -2px 3px 0px, rgb(0, 0, 0) -3px 2px 0px, rgb(0, 0, 0) -3px 1px 0px, rgb(0, 0, 0) 3px 0 0px, rgb(0, 0, 0) -3px 0 0px, rgb(0, 0, 0) -3px -1px 0px, rgb(0, 0, 0) -3px -2px 0px, rgb(0, 0, 0) -2px -3px 0px, rgb(0, 0, 0) -1px -3px 0px, rgb(0, 0, 0) -1px -3px 0px, rgb(0, 0, 0) 0 -3px 0px, rgb(0, 0, 0) 1px -3px 0px, rgb(0, 0, 0) 2px -3px 0px, rgb(0, 0, 0) 3px -3px 0px, rgb(0, 0, 0) 3px -2px 0px, rgb(0, 0, 0) 3px -1px 0px, rgb(0, 0, 0) 3px 0 0px
}

.geo-restriction span.geo-message {
    font-size: 2.5rem;
    font-family: Asmaa;
    text-align: center;
    display: block;
    color: #3fba00;
}

.geo-restriction header, .geo-restriction footer {
    display: none;
}
.geo-restriction .container-fluid {
    background: none !important;
}

/*Grid Page*/
ul.weekly-based-navigation {
    display: block;
    width: 94.6rem;
    margin: 0 auto 0;
    padding: 0;
    direction: rtl;
    margin: 2rem 0 3.8rem;
}

li.weekly-day {
    display: inline-block;
    list-style: none;
    width: 13rem;
    height: 3.2rem;
    margin-left: 0.6rem;
    background: #6ED232;
    color: #fff;
    text-align: center;
    border-radius: 0.5rem;
    box-shadow: 0px 4px #55ad21;
}

li.weekly-day:hover, li.weekly-day.selected {
    background-color: #349328;
    box-shadow: 0px 4px #349328;
}

li.weekly-day:last-child {
    margin:0;
}

li.weekly-day a{
    font-size: 1.8rem;
    display: block;
    height: 100%;
    width: 100%;
    color: #fff;
    padding-top: 0.4rem;
}

.program-wrapper {
    width: 57rem;
    height: 15.6rem;
    margin: 0;
    direction: rtl;
    display: inline-block;
    margin-right: 2rem;
    box-sizing: border-box;
    position: relative;
}

.program-wrapper > div {
    display: block;
    float: right;
}

.program-wrapper .program-image {
    width: 15rem;
    height: 11.3rem;
    position: relative;
    margin-top: 2.15rem;
}

.program-wrapper .program-image img {
    height: 100%;
    width: 100%;
}


.program-wrapper .programInfo {
    margin-right: 3rem;
    color: #4a4a4a;
    text-align: right;
    height: auto;
    padding: 0;
    width: 39rem;
    margin-top: 5.2rem;
}

.program-wrapper .programInfo span.title {
    display: block;
    max-width: 100%;
    height: 4.5rem;
    font-size: 2.5rem;
    overflow: hidden;
}

.program-wrapper .programInfo .time-box {
    max-width: 100%;
    height: 30px;
    font-size: 2rem;
    direction: ltr;
    height: 5rem;
    border-bottom: 2px solid #dddddd;
    margin-top: 1rem;
}

.program-wrapper .current-show, .program-wrapper .next-show  {
    position: absolute;
    left: 0;
    top: 0;
    width: 15.35rem;
    height: 100%;
    text-align: center;
}

.program-wrapper .current-show:after, .program-wrapper .next-show:after {
    content:'';
    position: absolute;
    left: 0;
    top: 0;
    border-top: 15.6rem solid #6ed232;
    border-right: 2.9rem solid transparent;
    width: 15.35rem;
    height: 100%;
}

.program-wrapper .current-show span, .program-wrapper .next-show span {
    position: absolute;
    display: block;
    z-index: 1;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: auto;
    color: #ffffff;
    font-size: 1.8rem;
}


.program-wrapper .programInfo bdi{
    padding-right: 0.4rem
}

.grid-container div.dropdown-container {
    width: 100%;
    height: 3.7rem;
    margin-bottom: 4rem;
    position: relative;
    z-index: 2;
}

.grid-container .dropdown-container {
    display:  none;
}

div.dropdown-container select{
    display:none;
}

.grid-container div.dropdown-container > div.dropdown-display{
    border: solid 3px #000;
    border-radius: 0;
}
.grid-container div.dropdown-container > div.dropdown-list > div{
    border: solid 3px #000;
    border-radius: 0;
    margin-top: -0.3rem;
}

.grid-container div.dropdown-container {
  background: none;
}

.grid-container div.dropdown-container:after {
    content: '';
    position: absolute;
    width: 0px;
    height: 13px;
    background: #000;
    top: 14px;
    left: 1.8rem;
    border: 0.22rem solid #000;
    border-radius: 5px 5px 0 0;
    transform: rotate(-46deg);
}

.grid-container div.dropdown-container:before {
    content: '';
    position: absolute;
    width: 0px;
    height: 13px;
    background: #000;
    top: 14px;
    left: 25px;
    border: 0.22rem solid #000;
    border-radius: 5px 5px 0 0;
    transform: rotate(46deg);
}

.grid-page .container-fluid.background-container {
    background-position-y: 0rem !important;
}

/*** Unsupported browser page style ***/

.unsupported-browser .unsupported-browser-container {
    max-width: 98rem;
    margin: auto;
}

.unsupported-browser .unsupported-browser-image {
    width: 11.8rem;
    height: 12rem;
    margin: 10.3rem auto 4.5rem;
    position: relative;
}

.unsupported-browser .unsupported-browser-image img{
    width: 100%;
    height: 100%;
    display: inline-block;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.unsupported-browser span.unsupported-browser-title {
    font-size: 3rem;
    font-family: Asmaa;
    text-align: center;
    display: block;
    color: white;
    margin-bottom: 0.5rem;
    text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.unsupported-browser span.unsupported-browser-message {
    font-size: 2.5rem;
    font-family: Asmaa;
    text-align: center;
    display: block;
    color: #3fba00;
}

.unsupported-browser header, .unsupported-browser footer {
    display: none;
}

.unsupported-browser .container-fluid {
    background: none !important;
}

.unsupported-browser .supported-browsers {
    max-width: 48.4rem;
    margin: 4rem auto 0;
    height: 18.7rem;
    background: url(../img/supported-browser.png) top center no-repeat transparent;
    background-size: contain;
    position: relative;
}

.unsupported-browser .chrome {
    display: inline-block;
    width: 50%;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: 0;
}

.unsupported-browser .firefox {
    display: inline-block;
    width: 50%;
    text-align: center;
    position: absolute;
    right: 0;
    bottom: 0;
}

.unsupported-browser  .download-browser{
    display: inline-block;
    list-style: none;
    width: 13rem;
    height: 3.2rem;
    background: #6ED232;
    color: #fff;
    text-align: center;
    border-radius: 0.5rem;
    box-shadow: 0px 4px #55ad21;
    font-size: 1.6rem;
    line-height: 3.5rem;
}

.unsupported-browser .download-browser:hover {
    background-color: #349328;
    box-shadow: 0px 4px #349328;
}
/* End of unsupported browser page style*/

/*competition*/
.leaf competition {
    margin: auto;
}

.leaf .compeition-container, .leaf .compeition-container p{
    margin: 0
}

.trivai .leaf-container {
    padding: 4rem 10.5rem;
    min-height: 57rem;
    height: auto;
    background: #fff;
}

.trivia-container iframe.trivial {
    min-height: 57rem;
    position: relative;
    z-index: 1004;
}



.popup-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.3);
    display: block;
    top: 0;
    left: 0;
    z-index: 1004;
}
.popup-box {
    height: 17.5rem;
    width: 50rem;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translate(0, -100%);
    -webkit-animation: popup-box .5s ease;
    -moz-animation: popup-box .5s ease;
    animation: popup-box .5s ease;
}

@keyframes popup-box
{
  0% {
    top: 0%;
  }
  100% {
    top: 50%;;
  }
}

.popup-box::before {
    content: '';
    display: block;
    box-sizing: border-box;
    background: #fff;
    transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    position: absolute;
    overflow: visible;
    box-shadow: 0px 0px 6px 3px #00000012;
    width: 100%;
    height: 100%;
    max-height: 23rem;
    z-index: -1;
    top: 0;
}

.popup-box::after {
    content: '';
    display: block;
    box-sizing: border-box;
    background: #ffffff;
    position: absolute;
    overflow: visible;
    width: 100%;
    height: 100%;
    max-height: 23rem;
    z-index: 0;
    bottom: 0;
    box-shadow: 0rem 0rem 1rem 0.4rem #0000004d;
}

.popup-message {
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translate(0, -50%);
    text-align: center;
    font-size: 3rem;
    font-family: Asmaa;
    color: white;
    text-shadow: rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) 3.87565px 0.989616px 0px, rgb(0, 0, 0) 3.51033px 1.9177px 0px, rgb(0, 0, 0) 2.92676px 2.72656px 0px, rgb(0, 0, 0) 2.16121px 3.36588px 0px, rgb(0, 0, 0) 1.26129px 3.79594px 0px, rgb(0, 0, 0) 0.282949px 3.98998px 0px, rgb(0, 0, 0) -0.712984px 3.93594px 0px, rgb(0, 0, 0) -1.66459px 3.63719px 0px, rgb(0, 0, 0) -2.51269px 3.11229px 0px, rgb(0, 0, 0) -3.20457px 2.39389px 0px, rgb(0, 0, 0) -3.69721px 1.52664px 0px, rgb(0, 0, 0) -3.95997px 0.56448px 0px, rgb(0, 0, 0) -3.97652px -0.432781px 0px, rgb(0, 0, 0) -3.74583px -1.40313px 0px, rgb(0, 0, 0) -3.28224px -2.28625px 0px, rgb(0, 0, 0) -2.61457px -3.02721px 0px, rgb(0, 0, 0) -1.78435px -3.57996px 0px, rgb(0, 0, 0) -0.843183px -3.91012px 0px, rgb(0, 0, 0) 0.150409px -3.99717px 0px, rgb(0, 0, 0) 1.13465px -3.8357px 0px, rgb(0, 0, 0) 2.04834px -3.43574px 0px, rgb(0, 0, 0) 2.83468px -2.82216px 0px, rgb(0, 0, 0) 3.44477px -2.03312px 0px, rgb(0, 0, 0) 3.84068px -1.11766px 0px, rgb(0, 0, 0) 3.9978px -0.132717px 0px;
}

.static-container-wrapper {
    overflow: visible;
}


/***Form CSS (Trivia, Form Builder)***/



.leaf-form-builder .leaf-container {
    width: 100%;
    margin: 0 auto;
    padding: 0 !important;
    height: 100%;
    background: #fff;
}

iframe#formFrame {
    height: 100%;
    width: 100%;
    min-height: 50vh !important;
}


form#form-builder {
    float: none;
}

div#fs-form-wrap {
    height: auto;
}

.formFrame .leaf-container {
    padding: 0;
    height: auto;
}

/* html body.compeition-popup-opened{
    height: auto;
    overflow: auto;
    width: 100%;
    position: static;
}     */


.leaf-form-builder.compeition-popup-opened div#TriviaApp {
    display: none
}

div#TriviaApp competition {
    margin: auto;
}

body.compeition-popup-opened .popup-compeition {
    display: block!important;
    width: 100vw;
    position: relative;
    height: auto!important;
    overflow: initial;
    min-height: auto;
}

body.compeition-popup-opened ol.fs-fields.active-order-list li,
body.compeition-popup-opened.compeition-review-phase .compeition-content {
    height: auto;
}

.leaf-trivia trivia .answer.text p {
    height: auto;
}

.trivia-page{
    background: #fff;
    height: auto !important;
    min-height: initial;
}

.leaf-trivia #TriviaApp {
    padding: 0 !important;
    margin: 0;
    text-align: center;
    background: #fff;
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
}

.leaf-trivia header {
    z-index: 0;
}
.leaf-trivia trivia,
.leaf-trivia trivia #question-trivia,
.leaf-trivia p.final-result,
.leaf-trivia trivia .result .score{
    height: auto;
}

.leaf-trivia trivia header {
    display: block
}

.trivia-loader {
    z-index: 2;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    transform: translate(-50%, -50%);
}
.leaf-trivia p.final-result.second-point-result {
    padding: 15px 0 15px 0;
}
.leaf-trivia p.title-total-result{
    padding-bottom: 15px !important;
}

.grid-container-wrapper {
    overflow: visible;
}

.scroll-button-container {
    position: relative;
    width: 100%;
    max-width: 94.6rem;
    z-index: 1;
}

.scroll-button {
    display: inline-block;
    list-style: none;
    width: 13rem;
    height: 3.2rem;
    margin-left: 0.6rem;
    background: #6ED232;
    color: #fff;
    text-align: center;
    border-radius: 0.5rem;
    box-shadow: 0px 4px #55ad21;
    left: 0;
    position: absolute;
    cursor: pointer;
    margin: 0;
}

.scroll-button span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 1.8rem;
    width: 100%;
}

.scroll-button:hover {
    background-color: #349328;
    box-shadow: 0px 4px #349328;
}

body.leaf.game .game-player span.title {
    height: 5rem;
    display: block;
    color: #fff;
    font-size: 2rem;
    padding: 0.65rem 1.3rem;
}

/*Ads Style*/

.ads.ads-overlay {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    background: rgba(0,0,0,0.3);
    height: 100%;
    width: 100%;    
}

.ads .ads-container {
    width: auto;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.ads .adslot-250-300 {
    width: 30rem;
    height: 25rem;
    background: #fff;
}

.ads .ads-timer,
.ads .skip-ads {
    color: #fff;
    border: 0.2rem solid #fff;
    position: absolute;
    font-family: "Asmaa";
    text-align: center;
    background-color: rgba(0,0,0,.3);
}

.ads .ads-timer {
    height: 5rem;
    width: 5rem;
    border-radius: 50%;
    bottom: -6rem;
    left: 1rem;
    font-size: 2.5rem;
    line-height: 4.2rem;
}

.ads .skip-ads {
    height: 3.5rem;
    width: 9rem;
    bottom: -5.25rem;
    right: 1rem;
    cursor: pointer;
    font-size: 1.5rem;
    line-height: 3rem;
}

.ads .skip-ads.disabled{
    opacity: .5;
    cursor: default;
}

.slick-initialized .slick-slide {
    position: relative;
}

button.slick-arrow.disabled-arrow {
    pointer-events: none;
    opacity: 0.3;
}

.landing-page  .adslot-250-300,
.show-page .adslot-250-300{
    height: 258px;
    width: 300px;
    margin: 0 10px;
    padding-top: 7px;
}

.formFrame .leaf-container {
    background: #fff;
}

[id^="adslot"] {
    display: block !important;
}


.cookie-notice {
    position: fixed;
    right: 0;
    bottom: 0;
    width: 100vw;
    z-index: 1100;
    height: 5.5rem;
    background-color: #263238;
    display: block;
}

.cookie-notice .cookie-notice-body {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: .5rem;
}

.cookie-notice .cookie-notice-body .text {
    font-size: 1.4rem;
    line-height: 1.5rem;
    text-align: right;
    color: #d8d8d8;
    padding: 1rem 1rem 0;
    direction: rtl;
}

.cookie-notice .cookie-notice-body .text a {
    color: #fff;
    text-decoration: underline;
}

.cookie-notice .agree-button {
    cursor: pointer;
    border-radius: .25rem;
    padding: .5em 1rem;
    line-height: 1.5rem;
    color: #fff;
    background-color: #2f444f;
    border: 1px solid #eceff1;
    font-size: 1.4rem;
}

@keyframes preloader-rotation {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.preload-album-image::after {
    position: absolute;
    content: '';
    color: black;
    top: 26.25rem;
    left: 50%;
    width: 100px;
    height: 100px;
    margin-left: -50px;
    margin-top: -50px;
    justify-content: center;
    align-items: center;

    border: 10px solid transparent;
    border-top: 10px solid #6ed231;
    stroke-linecap: round;
    border-radius: 50%;

    animation: preloader-rotation;
    animation-iteration-count: infinite;
    animation-duration: 1s;
}

.preload-album-image {
    position: relative;
}

.videos-icon span.title {
    left: 3rem;
}

.episode-title {
    color: #fff;
    font-size: 1.8rem;
    text-shadow: 2px 2px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.SmartBanner {
    height: 100px;
    background: #3B9D46;
    position: fixed;
    width: 100%;
    z-index: 1004;
    display: flex;
    top: 0;
    justify-content: center;
    align-items: center;
}


.download-app {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 30rem;;
}

a.download-link {
    width: 12rem;
    height: 3.8rem;
    display: block;
}

a.download-link.playstore-app {
    background: url(../img/playstore.png) top center / 12rem 3.8rem  no-repeat transparent;
}

a.download-link.appstore-app {
    background: url(../img/appstore.png) top center / 12rem 3.8rem no-repeat transparent;
}

.download-app span {
    flex: 1;
    font-size: 1.5rem;
    color: #fff;
}

.SmartBanner .close-banner {
    width: 3rem;
    height: 3rem;
    border-radius: 4rem;
    position: absolute;
    background: url(../img/close-banner.png) top center / 3rem 3rem no-repeat transparent;
    top: 1.5rem;
    right: 3rem;
    cursor: pointer;
}

.main-layout {
    position: static !important;
}


/* Search Style */
a.search-button {
    position: relative;
    display: block;
    width: 4rem;
    height: 4rem;
    float: left;
    background: url(../img/nav/icons.svg) no-repeat;
    margin-top: 1.8rem;
    margin-left: 10rem;
    cursor: pointer;
    background-position-x: -42.8rem;
    background-position-y: -80.5rem;
}

.search-box {
    width: 100%;
    min-height: 20rem;
    position: fixed;
    background: #f1f1f1;
    z-index: 1005;
    display: flex;
    justify-content: start;
    flex-direction: column;
    opacity: 0.97;
}

.close-search-container {
    height: 5.1rem;
    width: 100%;
    display: flex;
    justify-content: start;
    align-items: center;
}

.search-field-container {
    height: 6.8rem;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
}

.suggested-result-container {
    height: 23.1rem;
}

.show-all-result-container {
    height: 7.2rem;
    width: 100%;
    display: flex;
}


a.close-search {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -56.3rem;
    background-position-y: -81.6rem;
    margin-left: 3.2rem;
    cursor: pointer;
}

.search-field-wrapper {
    height: 5.6rem;
    width: calc(100% - 2rem);
    max-width: 90rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-direction: row;
    background: #fff;
    border: solid 1px #cfcfcf;
    margin-top: 3.1rem;
}

input.search-field {
    max-width: 83.4rem;
    width: 100%;
    height: 100%;
    direction: rtl;
    border: none;
    outline: none;
    font-size: 1.8rem;
    box-sizing: border-box;
    padding-right: 2rem;
}

.search-icon {
    width: 2.4rem;
    height: 2.4rem;
    background: url(../img/nav/icons.svg) no-repeat;
    background-position-x: -51.3rem;
    background-position-y: -81.6rem;
    border-right: 0.2rem solid #d8d8d8;
    padding-right: 4.4rem;
    margin-left: 2.5rem;
}


.show-all-result-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.show-all-result-button {
    display: inline-block;
    list-style: none;
    width: 100%;
    max-width: 30rem;
    height: 3.2rem;
    margin-left: 0.6rem;
    background: #6ED232;
    color: #fff;
    text-align: center;
    border-radius: 0.5rem;
    box-shadow: 0px 4px #55ad21;
    cursor: pointer;
    position: relative;
}

.show-all-result-button span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 1.8rem;
    width: 100%;
}

.show-all-result-button:hover {
    background-color: #349328;
    box-shadow: 0px 4px #349328;
}

.suggested-result-container {
    display: block;
    width: 100%;
    max-width: 90rem;
    margin: auto;
    margin-top: 3.2rem;
    direction: rtl;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    box-sizing: border-box;
}

a.search-result-card {
    max-width: 13.2rem;
    text-align: right;
    display: inline-block;
    position: relative;
    width: 100%;
    height: 100%;
    vertical-align: top;
    margin-right: 6rem;
}

a.search-result-card:first-child{
    margin-right: 0rem;
}

img.search-result-image {
    width: 100%;
    height: 9rem;
}

.search-result-icon {
    background: url(../img/nav/icons.svg) no-repeat;
    width: 4rem;
    height: 4rem;
}

.search-result-card span.result {
    font-size: 1.5rem;
    height: 7.6rem;
    text-overflow: ellipsis;
    width: 100%;
    overflow: auto;
    white-space: normal;
    color: #595959;
}

html, .search-result {
    min-height: 100%;
    height: 100%;
}

.search-result .main-layout{
    margin-top: 7.5rem;
}
.search-result .main-layout .stream-wrraper{
    min-height: 40rem;
}


.search-result .main-layout .stream-wrraper .row {
    margin-top: 2.75rem;
}

h1.search-result-title {
    padding: 3.6rem 3.6rem 0 0;
}

.search-result-query-wrapper {
    padding: 2rem 3.6rem 0;
}

bdi.search-result-query {
    font-size: 2rem;
    margin-bottom: 0.8rem;
    color: #4a4a4a;
    font-weight: lighter;
}

.no-autocomplete {
    display: block;
    width: 100%;
    max-width: 90rem;
    margin: auto;
    margin-top: 3.2rem;
    direction: rtl;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    padding-right: 2rem;
}

.no-autocomplete span{
    font-size: 1.8rem;
    color: #595959;
}