@charset "UTF-8";

/* ###################### GENERAL ###################### */

/* ------------------ SIMPLE LINK LIST -------------------- */

ul.simpleLinkList {
    margin: 0;
    list-style: none;
}

ul.simpleLinkList > li {
    padding: 2px 0;
}

ul.simpleLinkList > li > a:hover {
    color: #3e3e3e;
}

ul.simpleLinkList > li > a:before {
    content: '»';
    padding-right: 3px;
}

/* ------------------ GROUP BUTTON -------------------- */

.groupBtn {
    white-space: nowrap;
    position: relative;
}

.groupBtn .timezoneButton {
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    font: bold 12px Arial, Helvetica, sans-serif;
    padding: 0 10px;
    display: block;
    height: 30px;
    line-height: 30px;
    color: #8f8474;
    background: #f5f4f2 url(abfd73e56333725e59ab575dbd0c40c73a07977a.png)  right center no-repeat;
}

.groupBtn .timezoneButton:hover {
    background: #f5f4f2 url(3ecd02f133038437d73a7504316fdd18ef9ed420.png)  right center no-repeat;
    color: #3e3e3e;
}

.groupBtn.opened .timezoneButton {
    background: #f5f4f2 url(9469495671d649fe61e77915bd982694a09da20a.png)  right center no-repeat;
}

.groupBtn.opened .timezoneButton:hover {
    background: #f5f4f2 url(819fa8829a15a0a4bfb888dc36187d6d390b0ddf.png)  right center no-repeat;
}

.groupBtn .dropdownMenu {
    display: none;
    position: absolute;
    z-index: 90;
    box-shadow: 4px 8px 7px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 4px 8px 7px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 4px 8px 7px rgba(0, 0, 0, 0.3);
    background: #f5f4f2;
    left: 0;
    right: auto;
}

.groupBtn .dropdownMenu.dropdownMenuRight {
    right: 0;
    width: 400px;
    margin-left: -180px;
}

.groupBtn.opened .dropdownMenu {
    display: block;
}

.groupBtn .dropdownMenu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
}

.groupBtn .dropdownMenu ul > li.tutorial.text {
	padding: 10px 25px 5px 10px;
	font: italic 11px Arial, Helvetica, sans-serif;
	line-height: 15px;
	color: #D7D3CD;
	white-space: normal;
    height: 100px;
}

.groupBtn .dropdownMenu ul > li.tutorial.text:after {
	content:"";
	width: 100%;
	border: solid #D3CFCA;
	border-width: 0 0 1px;
	display: block;
	margin-top: 10px;
}

.groupBtn .dropdownMenu ul > li > a {
    padding: 8px 10px;
    color: #8f8474;
    display: block;
    font: bold 12px Arial, Helvetica, sans-serif;
}

.groupBtn .dropdownMenu ul > li > a:hover {
    color: #3e3e3e;
}

/* ------------------ WATCH LINKS -------------------- */

a.blueWatchLink {
    color: #0087eb;
    font: 12px Arial, Helvetica, sans-serif;
    font-weight: bold;
    background: url(3df99dbfd6126234f604781cc44283d2543b52d4.png)  -7px center no-repeat;
    padding-left: 18px;
    margin: 8px 0;
    display: inline-block;
}

a.blueWatchLink:hover {
    color: #3e3e3e;
    background: url(d39c26ba0b7dfadff93e1889a2925831946b691d.png)  -7px center no-repeat;
}

a.lgreyWatchLink {
    color: #888888;
    font: 12px Arial, Helvetica, sans-serif;
    font-weight: bold;
    background: url(10060563d3257e8f20e76b18d9a4645402bf7e94.png)  -7px center no-repeat;
    padding-left: 18px;
    margin: 8px 0;
    display: inline-block;
}

a.lgreyWatchLink:hover {
    color: #ffffff;
    background: url(f44d4630cffea0a065002968aca20aaad38db8c0.png)  -7px center no-repeat;
}

/* ###################### EPG ###################### */

#epgArea {
    background-color: #e6e3e0;
    width: 940px;
}

#epgArea .epgCarouselH {
    overflow: hidden;
}

#epgArea .epgCarouselH .epgCarouselHSlider {
    overflow: hidden;
    position: relative;
}

/* ------------------ DAY CAROUSEL -------------------- */

#epgArea .dayCarousel {
    background-color: #d7d3cd;
    margin-bottom: 5px;
}

#epgArea .dayCarouselSlider {
    width: 939px;
    height: 30px;
}

#epgArea .dayCarouselSlider .dayCarouselPrev {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(c925616d462a1bbf4ce61ca209161bcf224f6b8a.png)  left center no-repeat;
    z-index: 20;
}

#epgArea .dayCarouselSlider .dayCarouselPrev:hover {
    background: url(b256bc39b8260b7f9539d609099e5cf9ad16128c.png)  left center no-repeat;
}

#epgArea .dayCarouselSlider .dayCarouselNext {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(3198ed60ff507f3f9933d04e0458041703124fd9.png)  left center no-repeat;
    z-index: 20;
}

#epgArea .dayCarouselSlider .dayCarouselNext:hover {
    background: url(cb1de1443cdc6e6827cab732565d98fa54fda337.png)  left center no-repeat;
}

#epgArea .dayCarouselSlider .dayCarouselPrev.disabled,
#epgArea .dayCarouselSlider .dayCarouselNext.disabled {
    display: none !important;
}

#epgArea .dayCarouselSlider .carouselElements {
    position: relative;
    width: 9999px;
}

#epgArea .dayCarouselSlider .carouselElements .epgDay {
    float: left;
    width: 253px;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #3e3e3e;
    padding: 0 30px;
    text-align: center;
    height: 30px;
    line-height: 30px;
    outline: none;
}

#epgArea .dayCarouselSlider .carouselElements div.timezoneFillerPrev > span,
#epgArea .dayCarouselSlider .carouselElements div.timezoneFillerNext > span {
    visibility: visible;
}

#epgArea .dayCarouselSlider .carouselElements div.timezoneFillerPrev.inactive > span,
#epgArea .dayCarouselSlider .carouselElements div.timezoneFillerNext.inactive > span {
    visibility: hidden;
}

#epgArea .dayCarouselSlider .carouselElements div.dayPrev {
    text-align: left;
}

#epgArea .dayCarouselSlider .carouselElements div.dayNext {
    text-align: right;
}

#epgArea .dayCarouselSlider .carouselElements div.dayPrev > span,
#epgArea .dayCarouselSlider .carouselElements div.dayNext > span {
    color: #8f8474;
}

#epgArea .dayCarouselSlider .carouselElements div.dayPrev > span:hover,
#epgArea .dayCarouselSlider .carouselElements div.dayNext > span:hover {
    cursor: pointer;
    color: #3e3e3e;
}

#epgArea #epgContent {
    background-color: #8f8474;
    height: 30px;
}

#epgArea .epgContent {
    height: 361px;
    overflow: hidden;
    position: relative;
}

#epgArea .epgContent .leftArea {
    float: left;
    width: 133px;
    height: 100%;
}

#epgArea .epgContent .rightArea {
    float: left;
    width: 807px;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#epgArea .rightAreaShadow {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 80;
    box-shadow: inset -6px 0 20px -4px rgba(0, 0, 0, 0.1), inset 6px 0 12px -4px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset -6px 0 20px -4px rgba(0, 0, 0, 0.1), inset 6px 0 12px -4px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: inset -6px 0 20px -4px rgba(0, 0, 0, 0.1), inset 6px 0 12px -4px rgba(0, 0, 0, 0.2);
    pointer-events: none;
}

/* ------------------ TIMEZONE SELECTION -------------------- */

.timezoneCarousel .timezoneCarouselSlider {
    position: relative;
    padding: 0;
}

.timezoneCarousel a.timezoneCarouselPrev {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(9469495671d649fe61e77915bd982694a09da20a.png)  left center no-repeat;
    z-index: 20;
}

.timezoneCarousel a.timezoneCarouselNext {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
    background: url(abfd73e56333725e59ab575dbd0c40c73a07977a.png)  left center no-repeat;
    z-index: 20;
}

.timezoneCarousel a.timezoneCarouselPrev:hover {
    background: url(819fa8829a15a0a4bfb888dc36187d6d390b0ddf.png)  left center no-repeat;
}

.timezoneCarousel a.timezoneCarouselNext:hover {
    background: url(3ecd02f133038437d73a7504316fdd18ef9ed420.png)  left center no-repeat;
}

.timezoneGroupBtn .timezoneDropdown > li > a > span {
    font-weight: normal;
}

#epgArea .timezoneGroupBtn .dropdownMenu {
    background: transparent;
}

#epgArea .timezoneGroupBtn .timezoneButton {
    background: #8f8474 url(ae4eb88a1a4c4454342d0ce5e9f18527129f86ca.png)  right center no-repeat;
    color: #d7d3cd;
}

#epgArea .timezoneGroupBtn .timezoneButton:hover {
    background: #8f8474 url(84812b3e3ba5c04bb6f154ad6a5316dfc52ccbf1.png)  right center no-repeat;
    color: #ffffff;
}

#epgArea .timezoneGroupBtn.opened .timezoneButton {
    background: #8f8474 url(5abb24aa4ed1bf1bfdbd61b45bdb5be36b373593.png)  right center no-repeat;
}

#epgArea .timezoneGroupBtn.opened .timezoneButton:hover {
    background: #8f8474 url(831361a262f4767832f557b2db503a179077c49f.png)  right center no-repeat;
}

#epgArea .timezoneCarousel:before {
    content: '';
    width: 400px;
    height: 5px;
    background: #8f8474;
    display: block;
}

#epgArea .timezoneDropdown > li > a {
    color: #c7c1b9;
}

#epgArea .timezoneDropdown > li > a:hover {
    color: #ffffff;
}

#epgArea .timezoneCarousel .timezoneCarouselSlider {
    background: #8f8474;
}

#epgArea .timezoneCarousel a.timezoneCarouselPrev {
    background: url(5abb24aa4ed1bf1bfdbd61b45bdb5be36b373593.png)  left center no-repeat;
}

#epgArea .timezoneCarousel a.timezoneCarouselPrev:hover {
    background: url(831361a262f4767832f557b2db503a179077c49f.png)  left center no-repeat;
}

#epgArea .timezoneCarousel a.timezoneCarouselNext {
    background: url(ae4eb88a1a4c4454342d0ce5e9f18527129f86ca.png)  left center no-repeat;
}

#epgArea .timezoneCarousel a.timezoneCarouselNext:hover {
    background: url(84812b3e3ba5c04bb6f154ad6a5316dfc52ccbf1.png)  left center no-repeat;
}

/* ------------------ CHANNEL SELECTION -------------------- */

#epgArea .epgContent .channelAccordion .channel {
    background: #d7d3cd;
    margin: 4px 0;
}

#epgArea .epgContent .channelAccordion .channel > a {
    margin: 0;
    padding: 7px 0 7px 7px;
    font-size: 13px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #8f8474;
    display: block;
}

#epgArea .epgContent .channelAccordion .channel:not(.closed) > a {
    color: #3e3e3e;
    cursor: default;
}

#epgArea .channel .ui-widget-content {
    background: none repeat scroll 0 0 #d7d3cd;
    border: 0;
}

#epgArea .ui-state-active, #epgArea .ui-widget-content .ui-state-active, #epgArea .ui-widget-header .ui-state-active {
    background: none;
}

#epgArea .ui-state-default, #epgArea.ui-widget-content .ui-state-default, #epgArea .ui-widget-header .ui-state-default {
    border: 0;
}

#epgArea .ui-widget-content a {
    color: #0087EB;
}

#epgArea .ui-state-default {
    background: none;
}

#epgArea .epgContent .channelAccordion .channel > a:hover {
    color: #3e3e3e;
}

#epgArea .epgContent .channelAccordion .channel > a > span {
    font-size: 12px;
    font-weight: normal;
}

#epgArea .epgContent .channelAccordion .channel .channelWrapper {
    height: 151px;
}

#epgArea .epgContent .channelAccordion .channel .channelWrapper > ul {
    padding: 0 10px 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

/* ------------------ TIME CAROUSEL -------------------- */

#epgArea .timeCarouselSlider {
    width: 807px;
    height: 361px;
}

#epgArea .timeCarouselSlider .carouselWrapper {
    width: 999999px;
    position: relative;
}

#epgArea .timeCarouselSlider .timeCarouselPrev {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(d636e666285badb3620a18906d46d4f219694754.png)  left center no-repeat;
    z-index: 80;
}

#epgArea .timeCarouselSlider .timeCarouselPrev:hover {
    background: url(a998929b3e06cdcd8191f831074aab4ef7a8a7a5.png)  left center no-repeat;
}

#epgArea .timeCarouselSlider .timeCarouselNext {
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 30px;
    background: url(865b9eddc82ff8288accec91ace79956ad4d5393.png)  left center no-repeat;
    z-index: 80;
}

#epgArea .timeCarouselSlider .timeCarouselNext:hover {
    background: url(aa9c0aa11c3f38583d9fadd4ce090790ece780f0.png)  left center no-repeat;
}

#epgArea .timeCarouselSlider .timeCarouselNext.disabled,
#epgArea .timeCarouselSlider .timeCarouselPrev.disabled {
    display: none !important;
}

#epgArea .timeCarouselSlider .timeElements {
    height: 30px;
    margin-bottom: 5px;
    background-color: #aaa195;
}

#epgArea .timeCarouselSlider .timeElements div.epgTime {
    float: left;
    width: 152px;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #d7d3cd;
    padding: 0 10px;
    background: #8f8474;
    margin-right: 5px;
    height: 30px;
    line-height: 30px;
}

#epgArea .timeCarouselSlider .timeElements div.now {
    padding: 0 14px 0 6px;
}

#epgArea .timeCarouselSlider .timeElements div.now > span {
    background: url(95652f155dfe3748d8392815e632f246877411dc.png)  top center no-repeat;
    color: #ffffff;
    padding: 2px 4px 8px;
    position: relative;
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
    line-height: 0;
    font-size: 0;
}

/* ------------------ PROGRAM CAROUSEL -------------------- */

#epgArea .timeCarouselSlider .channelElements {
    margin-bottom: 5px;
    height: 181px;
    position: relative;
}

#epgArea .timeCarouselSlider .channelElements.closed {
    height: 30px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram {
    float: left;
    width: 172px;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #3e3e3e;
    background: #f5f4f2;
    margin-right: 5px;
    height: 100%;
    border-bottom: 1px solid #d7d3cd;
    overflow: hidden;
    position: absolute;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram a.blueWatchLink {
    position: absolute;
    bottom: 0;
    right: 10px;
    left: auto;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.special a.blueWatchLink,
#epgArea .timeCarouselSlider .channelElements div.epgProgram.special a.blueWatchLink:hover {
    color: #ffffff;
    background: url(f44d4630cffea0a065002968aca20aaad38db8c0.png)  -7px center no-repeat;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.now {
    background: #ffffff;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.special {
    background: #dc0f6e;
    color: #f5cdda;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.dummy {
    background: #f5f4f2;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.special div.specialText {
    font-size: 14px;
    max-width: 800px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgramTeaserXS {
    width: 120px;
    height: 68px;
    margin: 10px 0 0 10px;
    overflow: hidden;
    -webkit-transition: width 300ms ease-in-out;
    -moz-transition: width 300ms ease-in-out;
    -o-transition: width 300ms ease-in-out;
    transition: width 300ms ease-in-out;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgramTeaserXS.hidden {
    width: 0;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.stickyTitle .epgProgramTeaserXS {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram.stickyTitle .epgProgramTeaserXS {
    display: block;
}

#epgArea .timeCarouselSlider .channelElements.rtl.closed div.epgProgram.stickyTitle .epgProgramTeaserXS {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent {
    overflow: hidden;
    padding: 0 10px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent div.innerContent {
    height: 155px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram:not(.special):not(.dummy) div.teaserContent div.innerContent:after {
    content: "";
    pointer-events: none;
    position: absolute;
    width: 1000px;
    height: 21%;
    right: 0;
    background-image: -webkit-linear-gradient(bottom, rgba(254, 244, 242, 1), rgba(255, 255, 255, 0));
    background-image: -moz-linear-gradient(bottom, rgba(254, 244, 242, 1), rgba(255, 255, 255, 0));
    background-image: -ms-linear-gradient(bottom, rgba(254, 244, 242, 1), rgba(255, 255, 255, 0));
    background-image: -o-linear-gradient(bottom, rgba(245, 244, 242, 1), rgba(255, 255, 255, 0));
    background-image: linear-gradient(to top, rgba(245, 244, 242, 1), rgba(255, 255, 255, 0));
    bottom: 24px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.now:not(.special):not(.dummy) div.teaserContent div.innerContent:after {
    content: "";
    pointer-events: none;
    position: absolute;
    width: 1000px;
    height: 21%;
    right: 0;
    background-image: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -moz-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -ms-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -o-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    bottom: 24px;
}

#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram div.imgTeaserXS {
    margin-left: 0;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .title {
    font: 16px/22px Georgia, Times, serif;
    margin: 4px 0 2px 0;
    white-space: normal;
    display: inline-block;
    position: relative;
    z-index: 40;
    padding-right: 5px;
    background: #f5f4f2;
    box-shadow: 8px 0 15px rgba(245, 244, 242, 1);
    -moz-box-shadow: 8px 0 15px rgba(245, 244, 242, 1);
    -webkit-box-shadow: 8px 0 15px rgba(245, 244, 242, 1);
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.now div.teaserContent .title {
    background: #ffffff;
    box-shadow: 8px 0 15px rgba(255, 255, 255, 1);
    -moz-box-shadow: 8px 0 15px rgba(255, 255, 255, 1);
    -webkit-box-shadow: 8px 0 15px rgba(255, 255, 255, 1);
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.special div.teaserContent .title {
    margin-top: 0;
    text-transform: uppercase;
    font: bold 14px/30px Arial, Helvetica, sans-serif;
    color: #ffffff;
    background: #dc0f6e;
    box-shadow: 8px 0 15px rgba(220, 15, 110, 1);
    -moz-box-shadow: 8px 0 15px rgba(220, 15, 110, 1);
    -webkit-box-shadow: 8px 0 15px rgba(220, 15, 110, 1);
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .title a {
    color: #3e3e3e;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .title a:hover {
    color: #0087eb;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .broadcastTime {
    font: bold 12px Arial, Helvetica, sans-serif;
    margin-bottom: 10px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .topics {
    list-style-type: none;
    padding-left: 9px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .topics > li {
    font: 13px/17px Georgia, Times, serif;
    font-weight: normal;
    text-indent: -8px;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram div.teaserContent .topics > li:before {
    content: "- ";
    text-indent: -5px;
}

/* right to left (for arabic language) */

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram a.blueWatchLink {
    right: auto;
    left: 10px;
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram div.teaserContent .title {
    padding-right: 0;
    padding-left: 5px;
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram div.teaserContent .title {
    box-shadow: -8px 0 15px rgba(245, 244, 242, 1);
    -moz-box-shadow: -8px 0 15px rgba(245, 244, 242, 1);
    -webkit-box-shadow: -8px 0 15px rgba(245, 244, 242, 1);
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram.now div.teaserContent .title {
    box-shadow: -8px 0 15px rgba(255, 255, 255, 1);
    -moz-box-shadow: -8px 0 15px rgba(255, 255, 255, 1);
    -webkit-box-shadow: -8px 0 15px rgba(255, 255, 255, 1);
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram.special div.teaserContent .title {
    box-shadow: -8px 0 15px rgba(220, 15, 110, 1);
    -moz-box-shadow: -8px 0 15px rgba(220, 15, 110, 1);
    -webkit-box-shadow: -8px 0 15px rgba(220, 15, 110, 1);
}

/* Program S */
#epgArea .timeCarouselSlider .channelElements div.epgProgram.programS .epgProgramTeaserXS {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.programS div.teaserContent .broadcastTime {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.programS div.teaserContent .topics {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.programS .blueWatchLink {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.titleExpander {
    z-index: 41;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.titleExpander:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background: #b8b1a7 url(db9450cd3526f54851f14508967ba1841700b4d9.png)  left center no-repeat;
    width: 8px;
    height: 100%;
    z-index: 41;
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram.titleExpander:after {
    right: auto;
    left: 0;
    background: #b8b1a7 url(658e771c6d81bde1bc9d50982a0f8a6cc73425e8.png)  left center no-repeat;
}

#epgArea .timeCarouselSlider .channelElements div.epgProgram.titleExpander.expanded:after {
    background: #b8b1a7 url(658e771c6d81bde1bc9d50982a0f8a6cc73425e8.png)  left center no-repeat;
}

#epgArea .timeCarouselSlider .channelElements.rtl div.epgProgram.titleExpander.expanded:after {
    background: #b8b1a7 url(db9450cd3526f54851f14508967ba1841700b4d9.png)  left center no-repeat;
}

/* Program M */
#epgArea .timeCarouselSlider .channelElements div.epgProgram.programS .epgProgramTeaserXS {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram.programS div.teaserContent .broadcastTime {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram.programS div.teaserContent .topics {
    display: none;
}

/* Program L */
#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram.programS .epgProgramTeaserXS {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram.programS div.teaserContent .broadcastTime {
    display: none;
}

#epgArea .timeCarouselSlider .channelElements.closed div.epgProgram.programS div.teaserContent .topics {
    display: none;
}

/* ###################### SENDUNGSINFO-TEASER ###################### */

div.programInfoTeaser {
    position: relative;
}

div.programInfoTeaser div.subHeader {
    border-width: 0 0 2px;
}

div.programInfoTeaser .groupBtn .dropdownMenu ul > li.tutorial.text {
	color: #8F8474;
}

div.programInfoTeaser ul {
    margin: 0 0 20px 0;
    padding: 0;
    list-style: none;
    color: #3e3e3e;
}

div.programInfoTeaser div.recentEdition, div.programInfoTeaser div.nextEdition {
    margin-right: 20px;
}

div.programInfoTeaser div.col1 {
    width: 220px;
}

div.programInfoTeaser div.nextEdition {
    background: #f5f4f2;
    overflow: hidden;
}

div.programInfoTeaser div.news {
    overflow: hidden;
    border-bottom: none;
    background: transparent;
    padding: 0 0 20px 0;
}

div.programInfoTeaser div.recentEdition div.news {
    padding-bottom: 0;
}

div.programInfoTeaser div.teaserContent {
    overflow: hidden;
}

div.programInfoTeaser div.programInfoS {
    margin: 20px 20px 0 0;
}

div.programInfoTeaser div.programInfoS div.teaserContentWrap {
    padding: 2px 0;
    height: auto;
}

div.programInfoTeaser div.programInfoS div.teaserContentWrap a {
    margin-left: 10px;
}

div.programInfoTeaser h2 {
    font: 18px/25px Georgia, Times, serif;
    padding: 0 0 8px;
    color: #000000;
}

div.programInfoTeaser h4 {
    color: #8f8474;
    margin: 20px 0 8px 0 !important;
}

div.programInfoTeaser div.teaserContent ul li:before {
    content: '-';
    margin-right: 5px;
}

div.programInfoTeaser div.teaserContent ul li {
    font: 16px/24px Georgia, Times, serif;
}

div.programInfoTeaser p {
    font: 14px/20px Georgia, Times, serif;
    margin-bottom: 10px;
}

div.programInfoTeaser ul.broadcastTimes li {
    font: 12px/21px Arial, Helvetica, sans-serif;
}

div.programInfoTeaser ul.broadcastTimes li span.bold {
    font-weight: bold;
}

div.programInfoTeaser div.timezoneGroupBtn {
    margin-top: 20px;
    width: auto;
}

div.teaserContent div.episodeInfo,
ul.broadcastTimes {
    position: relative;
}

div.teaserContent div.episodeInfo[aria-expanded="false"] div.fadeOut,
ul.broadcastTimes[aria-expanded="false"] div.fadeOut {
    position: absolute;
    width: 100%;
    height: 21%;
    bottom: 0;
    background-image: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -moz-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -ms-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: -o-linear-gradient(bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    background-image: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

div.teaserContent div.episodeInfo[aria-expanded="false"] div.fadeOut.next,
ul.broadcastTimes[aria-expanded="false"] div.fadeOut.next {
    background-image: -webkit-linear-gradient(bottom, rgba(245, 244, 243, 1), rgba(245, 244, 243, 0));
    background-image: -moz-linear-gradient(bottom, rgba(245, 244, 243, 1), rgba(245, 244, 243, 0));
    background-image: -ms-linear-gradient(bottom, rgba(245, 244, 243, 1), rgba(245, 244, 243, 0));
    background-image: -o-linear-gradient(bottom, rgba(245, 244, 243, 1), rgba(245, 244, 243, 0));
    background-image: linear-gradient(to top, rgba(245, 244, 243, 1), rgba(245, 244, 243, 0));
}

.teaserExpanderWrap {
    overflow: hidden;
}

a.teaserExpander {
    display: none;
    float: right;
    width: auto !important;
}

a.teaserExpander > span {
    color: #3e3e3e;
    font: 12px Arial, Helvetica, sans-serif;
    font-weight: bold;
    padding-left: 30px;
    margin: 8px 0 8px 0;
    display: inline-block;
}

a.teaserExpander:hover > span {
    color: #0087eb;
}

a.teaserExpander.more > span {
    background: url(3ecd02f133038437d73a7504316fdd18ef9ed420.png)  left center no-repeat;
}

a.teaserExpander.more:hover > span {
    background: url(2980b9d5c2c9cfe8066b174c105de49cb881d702.png)  left center no-repeat;
}

a.teaserExpander.less > span {
    background: url(819fa8829a15a0a4bfb888dc36187d6d390b0ddf.png)  left center no-repeat;
}

a.teaserExpander.less:hover > span {
    background: url(f7143d3c5bd5b200fb3b70b1904c52db3f920000.png)  left center no-repeat;
}

div.linkList.teaser {
    margin-right: 0;
    border-bottom: none;
}

div.linkList.teaser h2 {
    font: 16px Georgia, Times, serif;
}

div.linkList.teaser h2:before {
    content: '- ';
    margin-right: 1px;
}

div.linkList.teaser h2 {
    padding: 0;
    line-height: 24px;
    text-indent: -12px;
    margin: 0 0 0 12px;
}

/* ###################### RADIO PROGRAM ###################### */

#radioProgramArea {
    width: 940px;
}

#radioProgramArea table {
    background: #f5f4f2;
    border-collapse: collapse;
    width: 940px;
    table-layout: fixed;
}

#radioProgramArea .timeCol {
    width: 86px;
    min-width: 86px;
}

#radioProgramArea .programCol {
    width: 122px;
    min-width: 122px;
}

#radioProgramArea table td, #radioProgramArea tr, #radioProgramArea th {
    padding: 0;
    border: none;
}

#radioProgramArea .head {
    background: #8f8474;
}

#radioProgramArea table th {
    text-align: left;
    font: 17px/30px Georgia, Times, serif;
    color: #ffffff;
    padding: 0 10px;
}

#radioProgramArea table th span.programDate {
    font: 12px Arial, Helvetica, sans-serif;
}

#radioProgramArea table tr {
    border-bottom: 2px solid #f5f4f2;
}

#radioProgramArea .daysRow {
    background: #d7d3cd;
    height: 30px;
}

#radioProgramArea .daysRow td {
    text-align: center;
    font: bold 14px/30px Arial, Helvetica, sans-serif;
    color: #3e3e3e;
}

#radioProgramArea .timeRow td {
    vertical-align: top;
    font: 15px/18px Georgia, Times, serif;
    border-right: 2px solid #f5f4f2;
    border-bottom: 1px solid #dcdbd9;
    background: #ffffff;
}

#radioProgramArea .timeRow.separator td {
    border-right: none;
}

#radioProgramArea .timeRow .program {
    padding-left: 10px;
    float: left;
    height: 100%;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
}

#radioProgramArea .timeRow .program .programInfo {
    overflow: hidden;
    padding-bottom: 10px;
    word-wrap: break-word;
    -ms-word-wrap: break-word;
}

#radioProgramArea .timeRow .program h2.title {
    font: 15px/18px Georgia, Times, serif;
    margin: 6px 10px 6px 0;
    color: #3e3e3e;
}

#radioProgramArea .timeRow .program div.radioProgramTeaserXS {
    width: 100px;
    height: 56px;
    display: block;
    margin-bottom: 5px;
    margin-right: 10px;
}

#radioProgramArea .timeRow .programInfo.multiColumn div.radioProgramTeaserXS {
    margin-right: 10px;
}

#radioProgramArea .timeRow .program div.radioProgramTeaserXS .teaserImg,
#radioProgramArea .timeRow .program div.radioProgramTeaserXS .teaserImg img {
    width: 100px;
    height: 56px;
}

#radioProgramArea .timeRow .program p {
    font: 13px/16px Georgia, Times, serif;
    margin: 5px 10px 0 0;
}

#radioProgramArea .timeRow td.time {
    background-color: #e6e3e0;
    color: #8f8474;
    font: bold 12px/18px Arial, Helvetica, sans-serif;
}

#radioProgramArea .timeRow td.empty {
    background-color: #f6f4f2;
}

#radioProgramArea .timeRow .time a, #radioProgramArea .timeRow .time span {
    font: bold 12px/30px Arial, Helvetica, sans-serif;
    color: #8f8474;
    padding-left: 15px;
}

#radioProgramArea .timeRow .time a:hover {
    color: #3e3e3e;
}

#radioProgramArea .timeRow.opened .time a {
    color: #3e3e3e;
    cursor: default;
}

#radioProgramArea .timeRow.closed .program .programInfo {
    padding-bottom: 0;
}

#radioProgramArea .timeRow.closed .program div.radioProgramTeaserXS {
    display: none;
}

#radioProgramArea .timeRow.closed .program p {
    display: none;
}

#radioProgramArea .timeRow.closed .program.opened div.radioProgramTeaserXS {
    display: block;
}

#radioProgramArea .timeRow.closed .program.opened p {
    display: block;
}
