﻿* { margin: 0; padding: 0; border: 0; }
* html .visualIEFloatFix { height: 0.01%; }
body { text-align: center; background-color: #ffffff; }
h3 { font-size: 14px; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; margin: 4px 0 4px 10px; }
p { font-size: 11px; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; }

#page { width: 480px; margin: 10px auto; text-align: left; }
#page #header { position: relative; clear: both; background-color: #969390; width: 480px; height: 30px; color: #ffffff; }
#page #header h1 { color: #ffffff; font-size: 20px; font-weight: bold; margin: 6px 0 0 10px; }
#page #header a { text-decoration: none; }
#page #header .searchbox { position: absolute; top: 7px; right: 7px; height: 15px; width: 220px; }
#page #header .searchbox p { clear: both; color: #fff; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; padding: 5px 0; text-align: right; }
#page #header .searchbox input.text { float: right; height: 150px; height: 15px; background-color: #fff; }
#page #header .searchbox input.image { float: right; height: 15px; width: 34px; margin-left: 3px; }

#page #menu { clear: both; background-color: #ffffff; width: 480px; height: 30px; line-height: 30px; }
#page #menu ul { list-style-type: none; width: 480px; height: 16px; line-height: 16px; margin: 7px auto 0 auto; }
#page #menu ul li { float: left; display: inline-block; padding: 0 10px 0 10px; border-right: 1px dotted #000; height: 16px; }
#page #menu ul li a { color: #000; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; text-decoration: none; }
#page #menu ul li.last { border-right: none; }
#page #submenu { clear: both; background-color: #eeeeee; width: 480px; height: 30px; }
#page #content { clear: both; background-color: #ffffff; width: 480px; padding: 20px 0; }
#page #content .inner { float: left; padding: 0; width: 480px; }
#page #content .inner h2 { font-family: Trebuchet MS, Verdana, Sans-serif; color: #000000; font-size: 18px; line-height: 1em; margin: 20px 0 20px 0px; }
#page #content h2 img { vertical-align: middle; }
/*#page #content .inner p { font-family: Trebuchet MS, Verdana, Sans-serif; color: #000000; font-size: 12px; margin: 7px 0 10px 7px; }*/
#page #footer { background-color: #969390; height: 20px; clear: both; color: #000000; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; margin: 1px 0 18px 0; }
#page #footer p { text-align: right; padding: 2px; }
#page #footer a { color: #000000; text-decoration: none; margin: 0 2px 0 2px; }

body.category #page #content .inner h2 { text-transform:uppercase; }

.tabs { position: relative; background-color: #eeeeee; display: block; width: 480px; height: 20px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 11px; margin: 0 0 5px 0; }
.tabs .tab { float: left; display: inline-block; background-color: #eeeeee; height: 20px; width: 100px; margin: 0; text-align: center; line-height: 16px; }
.tabs .tab p { padding: 2px 0 0 0; }
.tabs .tab p a { text-decoration: none; color: #000; }
.tabs .tab p a:hover { text-decoration: underline; color: #000; }
.tabs .selected { background-color: #969390; }
.tabs .selected p a { color: #fff; }
.tabs .selected p a:hover { color: #fff; }


.dropdown { border: 0; font-size: 12px; width: 135px; margin: 6px 0 0 15px; height: 18px; #height: 20px; }
.clear { clear: both; }
.clearwithsmallmargin { clear: both; margin: 0 0 6px 0; }
.clearwithmargin { clear: both; margin: 0 0 20px 0; }

.dayselect { clear: both; position: relative; display: block; width: 480px; height: 20px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; background: #969390; margin-bottom:20px; }
.dayselect .day { float: left; display: inline-block; width: 65px; height: 20px; background-color: #969390; text-align: center; }
.dayselect .day p { padding: 2px 0 0 0; }
.dayselect .day p a { text-decoration: none; color: #fff; }
.dayselect .day p a:hover { text-decoration: underline; color: #fff; }
.dayselect .selected { background-color: #aba9a6; color: #000; }
.dayselect .selected p a { color: #000; font-weight: bold; }
.dayselect .selected p a:hover { color: #000; font-weight: bold; }

.onechannelprogram { position: relative; display: block; width: 480px; margin: 0 0 15px 0; border-bottom: solid 1px Grey; }
.onechannelprogram .header { position: relative; }
.onechannelprogram .header img { float: left; margin-right: 10px; }
.onechannelprogram .header span { font-size: 12px; font-weight: bold; float: left; margin: 5px 5px 5px 0; text-transform: uppercase; }
.onechannelprogram .header span a { text-decoration: none; color: #000; }
.onechannelprogram .text { position: relative; margin-bottom: 10px; }
.onechannelprogram .text h3 { font-size: 14px; font-weight: bold; margin: 5px 0 5px 0; }
.onechannelprogram .text h3 a { text-decoration: none; color: #000; }
.onechannelprogram .text p { font-size: 12px; margin: 5px 0 5px 0; }

#channelnav { position: relative; display: block; width: 480px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 11px; overflow: hidden; margin: 5px 0 5px 0; }
#channelnav .nav { float: left; display: inline-block; height: 20px; width: 115px; margin: 0; text-align: center; line-height: 16px; }
#channelnav .nav p { padding: 2px 0 0 0; }

#trailer { float: left; display: inline-block; width: 230px; margin:0; padding: 0 0 5px 0; }
#trailer #trailerFrame { float: right; }

#channels { clear: both;  position: relative; display: block; width: 480px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; overflow: hidden; }
#channels .channel { float: left; display: inline-block; width: 230px; margin-right: 10px; }
#channels .right { margin-right: 0; }
#channels .channel .header { float: none; }
#channels .channel .header { position: relative; border:1px solid white; width: 230px; height: 35px; border-top:1px solid #969390; margin-bottom: 10px; }
#channels .first-child .header { border: 1px solid white; }
#channels .channel .header img { margin:0 10px 0 0; }
#channels .channel .header h2 { margin: 5px 0 10px 10px !important; line-height: 20px; }
#channels .channel .header h2 a { font-size: 12px; color: #000; text-decoration: none; vertical-align: bottom; }
#channels .channel .header h2 a.channelName { position: relative; left: 0; bottom: 10px; }
#channels .channel ul { list-style-type: none; }
#channels .channel ul li { height: auto; min-height: 15px; padding: 0 10px 0 10px; }
#channels .channel ul li a { color: #000; text-decoration: none; }
#channels .channel ul li a:hover { text-decoration: underline; }
#channels .channel ul li.active { background-color: #969390; }
#channels .channel ul li.active a { color: #fff; }
#channels .channel ul li.inactive a { color: #bbb; }

.programmes { position: relative; display: block; width: 480px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; }
.programmes .program { position: relative; margin-bottom: 20px; border-bottom: solid 1px Grey; }
.programmes .program .channel { position: relative; clear: both; height: 35px; padding: 2px 5px; }
.programmes .program .channel img { float: left; }
.programmes .program .channel p { float: left; margin: 5px; }
.programmes .program .text { clear: both; background-color: #ffffff; margin: 0 0 1px 0; }
.programmes .program .text img { float: left; margin-right: 10px; }
.programmes .program .text p { font-size: 12px; }
.programmes .program .text h3 { font-size: 14px; }
.programmes .program .text h3 a { color: #000000; text-decoration: none; font-weight: bold; }
.programmes .program .buttons { margin: 8px 0 8px 0; }
.programmes .program .inactive { color: #bbb; }
.programmes .program .inactive h3 a { color: #bbb; text-decoration: none; }
.programmes .program .inactive a { color: #bbb; text-decoration: none; }

#program { float: left; width: 416px; margin-right: 10px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 11px; }
#program .text { background-color: #fff; }
#program .channel { clear: both; position: relative; margin: 1px 0 0 0; background-color: #fff; height: 50px; }
#program .channel .logo { position: absolute; top: 10px; left: 0; width: 68px; margin: 0; padding: 0; }
#program .channel .text { position: absolute; top: 10px; left: 68px; width: 200px; margin: 0; padding: 0; }
#program .channel .text p { margin: 0; padding: 0; }
#program .images { clear: both; padding: 5px 10px 5px 0; margin: 1px 0 0 0; background-color: #fff; }
#program .images img { clear: both; margin: 0 0 2px 0; }
#program .buttons { clear: both; height: 30px; margin: 1px 0 8px 0; }
#program .buttons a { float: left; display: block; margin: 1px 1px 0 0; }
#program .buttons input { float: left; display: block; margin: 1px 1px 0 0; }

#selections {width:480px;font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; margin:0;padding: 10px;}

.header { float: left; width: 240px; }

#sortable1 { height:490px; overflow:auto; background: white none repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; float: left; width: 230px; color: rgb(68, 68, 68); }
#sortable1 .item { margin: 1px; height: 26px; padding: 4px; background: #eee none repeat scroll 0% 0%; text-align: left; cursor: default; width: 200px; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; line-height:23px; }
#sortable1 .item .logo { float: left; height: 26px; width: 49px; margin: 0 5px 0 0; overflow:hidden; text-align:center; }
#sortable1 .item .logo img { }

#sortable2 { height:490px; overflow:auto; background: white none repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; float: left; width: 230px; color: rgb(68, 68, 68); }
#sortable2 .item { margin: 1px; border:1px solid #eee;height: 24px; padding: 4px; background: #fff none repeat scroll 0% 0%; text-align: left; cursor: default; width: 198px; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; display: block; line-height:23px; }
#sortable2 .item .logo { float: left; height: auto; width: 49px; margin: 0 5px 0 0; overflow:hidden; text-align:center; }
#sortable2 .item .logo img { }


#interaction-draggable-container {border:1px solid #BBB;background:white;}
.item.selected {background:#eee !important;}

.red { border:2px dotted red; }
.green { border:2px dotted green; }
.button { clear: both; }
.clear { float: none; clear: both; }

.notifications { clear: both; margin-top: 20px; }
.notifications .row { position: relative; height: 22px; font-size: 11px; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; }
.notifications .row .text { position: absolute; top: 3px; left: 3px; width: 250px; }
.notifications .row .button { position: absolute; top: 3px; right: 10px; }
.notifications .brown { background: #f7f7f7; }

.jqmWindow { display: none; position: fixed; top: 17%; left: 50%; margin-left: -300px; width: 600px; background-color: #eeeeee; color: #333; border: 1px solid #121212; padding: 5px; }
.jqmOverlay { background-color: #ffffff; padding: 10px; }
.jqmOverlay h3 { font-size: 14px; font-weight: bold; font-family: Trebuchet MS, Verdana, Sans-serif; margin: 4px; }
.jqmOverlay p { font-size: 11px; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; margin: 4px; }
.jqmOverlay input { font-size: 11px; font-weight: normal; font-family: Trebuchet MS, Verdana, Sans-serif; border: 1px solid #cecece; }


/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .jqmWindow { position: absolute; top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px'); }

.readMoreLink { text-decoration: none; color: Black;}

.tipFriend { float: right; }

#tv_spot { display: block; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px; text-align: left; margin: 0 auto; }
#tv_spot a { color: #000; text-decoration: none;}
#tv_spot .subnavlist a { color: #0194FC; display: block; line-height: 18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 95%; }
#tv_spot .subnavlist a:hover { text-decoration: underline; }
#tv_spot .subnavlist a.active { font-weight: bold; }
#tv_spot .subnavlist a span { display: inline-block; color: #000; width: 34px; }
#tv_spot h1 { min-height: 22px; text-align: left; font-size: 16px; font-weight: normal; padding-bottom: 10px; border-bottom: 1px solid #d4d4d4; }
#tv_spot .tochartpage { float: right; margin-top: 4px; color: #444;}
#chartsouter {
    overflow: hidden;
    clear: both;
    border-bottom: 1px solid #D4D4D4;
}
#chartsinner {
    width: 100%;
    border-right: 1px solid transparent;
    margin-left: -1px;
    margin-top: -1px;
}

#tv_spot .navlist {
    float: left;
    margin: 0;
    width: 25%;
    padding: 15px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: solid #d4d4d4;
    border-width: 1px 0 0 1px;
}
#tv_spot .navlist.vertical { width: 100%; }
#tv_spot .navlist li { display: block; list-style-type: none; }
#tv_spot .subnavlist { margin:0 0 0 0; list-style-type: none;}
#tv_spot .subnavlist li { list-style-type: none; float:none;width: auto; }
#tv_spot .subnavlist li + li { margin-top: 2px; }
#tv_spot h3 { margin:0 0 10px; font-family: Trebuchet MS, Verdana, Sans-serif; font-size: 12px;text-align: left; }
#tv_spot .subnavlist h3 a { line-height: 35px; }
#tv_spot a img { vertical-align: middle; }
#tv_spot .subnavlist a.inactive { color:#7B99A2; }
#tv_spot .subnavlist a.active { background-color: #e7eeef }