
/**************** structure *************/
body {
min-width: 980px;
}

.main{
z-index:3;/*for clickable banner*/
}

.content{
min-height:400px;
background:#fff center top no-repeat;
padding:0 10px;
position:relative;
z-index:0;
}

.outercontent{
background:#fff;
float:left;
margin-bottom:40px;
width:100%;
}
.content--mydartfish.content--mydartfish--grey .outercontent {
  background: transparent;
}

.innercontent{
overflow:hidden;
min-height:650px;
z-index:2;
border: 1px solid #ccc;
}

.content--mydartfish .innercontent {
-webkit-border-radius: 2px;
border-radius: 2px;
}

.content--mydartfish,
.content--mydartfish.content--mydartfish--grey .innercontent,
.content--mydartfish .settings .innercontent {
background: #48474c;
border: none;
-webkit-border-radius:0px;
border-radius:0px;
}

.content--mydartfish .welcome .innercontent {
border: none;
}

.content--mydartfish.content--mydartfish--grey .innercontent{
color:#fff;
}

/*.content--tvchannel.content--tvchannel--banner .innercontent{
background-color: rgb(255,255,255);
background-color: rgba(255,255,255,0.85);
}*/

.innercontent .noitems{
float:left;
padding:20px 10px;
font-size:14px;
overflow:hidden;
position:relative;
}

.player .innercontent{
min-height:0;
}

.content .colleft{
float:left;
width: 700px;
padding:0;
overflow:auto;
position: relative;
}

.content.content--personalchannel .colleft,
.content.content--mydartfish .colleft{
width: 100%;
position: static;
}

.content .colleft .activity{  
padding:15px;
}

.content .colleft .activity.large{
width:660px;
}

.content .colleft .activity .item.commented {
width: 100%;
float: left;
margin-bottom: 20px;
}

.content .colright{
float:right;
padding:0;
width:260px;
}

.content .colright.hasoffset{
margin-top:175px;
}

.content .colright .box{
border-top:1px solid #ccc;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
padding: 14px 15px 19px;
overflow:auto;
min-height:22px;
overflow:hidden;
margin-left:-1px;/*for hidding left border*/
}

.content .colright .box:last-of-type {
border-bottom:1px solid #ccc;
}

/*.content--tvchannel.content--tvchannel--banner .colright .box{
background-color: rgb(255,255,255);
background-color: rgba(255,255,255,0.85);
}*/

.content .colleft .box {
background: #eee;
border: 1px solid #d2d2d2;
border-radius: 2px;
margin-bottom: 15px;
padding: 10px 15px 14px;
overflow: auto;
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
background: -moz-linear-gradient(top, #fff, #eee);
}


.ie .content .colleft .box{
/* filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee');*/
background:#f2f2f2;
}

.center{
width: 100%;
margin:0 auto;
position:relative;
z-index:3;
max-width: 960px;
}

.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

.ie .clearfix{
zoom:1; 
display:block;
}

/******************* general *******************/

h1,
.colright h3{
font-size:21px;
line-height:22px;
padding-bottom:12px;
word-wrap:break-word ;
}

h2,h3{
font-size: 32px;
line-height: 1.25em;
padding-left:1px;
padding-bottom:2px;
word-wrap:break-word ;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type="password"] {
border: 1px solid #e4e4e4;
display: block;
border-radius: 2px;
padding: 3px;
float: left;
width: 155px;
height: 17px;
}

.userform input[type=text],
.userform input[type=email],
.userform input[type=tel],
.userform input[type=number],
.userform input[type="password"],
.userform textarea,
.userform select {
border: 1px solid #e4e4e4;
display: block;
border-radius: 2px;
padding: 6px 7px;
float: left;
width: 155px;
height: 34px;
line-height: 16px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.inplaceeditbutton {
  border-radius: 50px;
  vertical-align: top;
  width: 24px;
  height: 24px;
  display: inline-block;
  margin: 0px;
  padding: 0px;
  text-align: center;
  line-height: 22px;
  -webkit-font-smoothing: antialiased;
}

.inplaceeditbutton--save{
font-size: 16px;
color: #fff;
background:#2caed3;
}
.content--mydartfish.content--mydartfish--grey .inplaceeditbutton--save {
  background-color:#898787;
}
.content--mydartfish.content--mydartfish--grey .inplaceeditbutton--save:hover {
  background-color: #000;
}

.inplaceeditbutton--save:hover{
color: #fff;
background:#000;
}

.inplaceeditbutton--save::before{
content:"\2713";
font-weight: bold;
color: #fff !important;
}

.inplaceeditbutton--cancel{
font-size: 18px;
color: #867f70;
background:#ddd;
border: 1px solid #ccc;
}
.content--mydartfish.content--mydartfish--grey .inplaceeditbutton--cancel {
background-color:#6b6a74;
border:none;
}

.inplaceeditbutton--cancel::before{
content: "\2715";
color: inherit;
font-weight: bold;
}

.inplaceeditbutton--cancel:hover{
color:#867f70;
background:#bbb;
}

.content--mydartfish.content--mydartfish--grey .inplaceeditbutton--cancel:hover {
background:#000;
}

.submitbutton {
font-size:1em;
padding:7px 16px; 
border:none;
}

.beauton.cart{
background:#2caed3 url(../img/channel/cart.png) 5px 5px no-repeat;
padding:7px 16px 7px 40px;
}

.button:hover,
.button.cancel:hover,
.submitbutton:hover{
background:#000;
color:#fff;
}

.beauton.cart:hover{
background:#000 url(../img/channel/cart.png) 5px 5px no-repeat;
}

.progress img{
vertical-align:middle;
padding-right:3px;
}

.tabsformobile {
display:none;
}

/******************* banner *******************/

.banner{
height:140px;
z-index:1;
}

.content--mydartfish .banner{
height:10px;
}

.banner .channel__logo{
background-color:#fff;
border-radius:2px;
}

.content--personalchannel .banner .channel__logo,
.content--mydartfish .banner .channel__logo{
background-size:cover;
border-radius:50%;
}

.banner h1{
font-size:28px;
line-height:1.1em;
color:#000;
padding:1px 0 0 0;
}

.content--mydartfish .banner h1{
color:#48474c;
}

.banner table{
height:140px;
vertical-align:middle;
width:700px;
}

.banner table td.logo{
padding:0 20px 0 0;
width:70px;
}

.slswitch {
display:block;
float:right;
background-color: #eee;
border: 1px solid #D6D6D6;
border-radius: 2px;
height: 40px;
width: 40px;
position: relative;
cursor: pointer;
white-space: nowrap;
margin: 6px 0 0 9px;
padding: 6px 20px;
}

.slswitch:hover {
background-color: #ddd;
border: 1px solid #ccc;
}

.slswitch.html5{
background:rgba(238,238,238,1) url(../img/channel/pictos/sleditswitch.png) 5px 4px no-repeat;
color:#cc3300;
}

.slswitch.silverlight {
background:rgba(238,238,238,1) url(../img/channel/pictos/sleditswitch.png) 5px -42px no-repeat;
}

.slswitch.edit {
background:rgba(238,238,238,1) url(../img/channel/pictos/sleditswitch.png) 5px -91px no-repeat;
}


/******************* content *******************/

.content .colleft h3{
font-size:24px;
padding:0 0 10px 0;
margin:0;
}

.content .colleft h3.card__header{
padding: 15px;
}

/* head (mainmenu and search */
.content .channelheader{
background-color:#fff;
border:1px solid #ccc;
border-bottom:none;
padding:0 10px 4px 0;
overflow:auto;
}

.content--mydartfish .channelheader{
border-bottom: none;
background-color: transparent;
overflow: hidden;
margin-bottom:0px;
border:none;
}

.channelheader .relitems {
float: right;
font-size: 34px;
line-height: 34px;
padding: 8px 14px 0 0;
}

.channelheader .relitems .relitems--previous::before{
content:"\2039";
margin-right:3px;
}

.channelheader .relitems .relitems--next::before{
content:"\203A";
}

.channelheader .relitems .relitems--previous.disabled,
.channelheader .relitems .relitems--next.disabled{
color:#aaa;
cursor:default;
}

/* mainmenu */ 
.mainmenu{
-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.mainmenu ul li{
display:block;
float:left;
}

.mainmenu ul li a{
display:block;
float:left;
margin:0;
padding:21px 14px 11px 14px;
font-family: ClearSans-Bold, sans-serif;
color: #444;
text-transform:uppercase;
font-size:15px;
line-height:15px;
position:relative;
text-align:center;
overflow: hidden;
}

.mainmenu ul li a:after{
content: "";
position: absolute;
left: 14px;
right: 14px;
bottom: 0;
height: 4px;
background-color: #2caed3;
-webkit-transition: transform 200ms ease, color 200ms ease;
-moz-transition: transform 200ms ease, color 200ms ease;
-ms-transition: transform 200ms ease, color 200ms ease;
transition: transform 200ms ease, color 200ms ease;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;  
transform-origin: 0 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: translateY(10px) rotate(15deg);
}

.mainmenu ul li a:hover::after,
.mainmenu ul li.selected a::after {
-webkit-transform: translateY(0px) rotate(0deg);
-moz-transform: translateY(0px) rotate(0deg);
-ms-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
}

.mainmenu ul li.selected a{
color: #000;
border-color: #2caed3;
}

.de .mainmenu ul li a,
.es .mainmenu ul li a, 
.ja .mainmenu ul li a{
padding-left: 11px;
padding-right: 11px;
}
.de .mainmenu ul li a:after,
.es .mainmenu ul li a:after, 
.ja .mainmenu ul li a:after{
left: 11px;
right: 11px;
}

.ja .mainmenu ul li a,
.ko .mainmenu ul li a{
font-size:16px;
font-weight: bold;
}


/* searchbox */
.searchbox {
float:right;
}

.searchctrl{
overflow:hidden;
padding:7px 0 0 0;
}

.content--mydartfish .searchctrl{
padding-right:1px;
padding-top:19px;
}

.content--mydartfish .channelcollections .innercontent{
position:static;
}
.playlistcollections .searchctrl,
.channelcollections .search_block.channelCollections .searchctrl {
  position: absolute;
  right: 10px;
  top: 4px;
  margin: 0px;
}

.content--mydartfish .channelcollections .search_block.channelCollections .searchctrl {
top:-1px;
}

.channelcollections .kwb{
max-height:512px;
}

.searchctrl .linky{
clear:both;
float:left;
padding-top:8px;
}

.loader{
top:0;
left:0;
position:absolute;
width:100%;
height:100%;
background-color:#fff;
border: 1px solid #ccc;
text-align:center;
font-size:15px;
padding:80px 0;
z-index:10;
color:#000;
overflow:hidden;
}

.loaderalpha{
top:0;
left:0;
position:absolute;
width:100%;
height:100%;
background-color:#ffffff80; /*white with alpha 50%*/
text-align:center;
font-size:15px;
padding:50% 0;
z-index:10;
color:#000;
overflow:hidden;
}

.content--mydartfish.content--mydartfish--grey .loader {
background-color:#48474c;
color:#ddd;
border:none;
}

/************** Edit notification settings  *****************/

.content--mydartfish .settings .innercontent .notification h2{
font-size:26px;
font-weight:bold;
padding:0 20px 0 20px;
margin:0;
}

.content--mydartfish .settings .innercontent .notification h3{
font-size:20px;
font-weight:bold;
padding:20px 20px 10px 20px;
margin-top:0;
}

/************** chanel header  *****************/

.colright .description,
.colright .website,
.colright .social{
padding:10px 0;
border-top:1px solid #eee;
clear:both;
word-wrap: break-word;
font-size: 13px;
line-height:18px;
}

.colright .description{
margin-top: 15px; 
}

.colright .nodescription{
clear:both;
}

.colright .description a.more{
font-size:1.1em;
padding:4px 0 0 ;
display:block;
}

.colright .chMore{
width:450px;
min-height:250px;
margin-left:-466px;
}

.chMore .chMoreContent{
padding:10px 20px 20px 20px;
}

.chMore .chMoreContent ol{
padding-left:20px;
}

.chMore .chMoreContent ul{
padding-left:20px;
}

.popup{
position:absolute;
-moz-box-shadow:0 0 20px #000;
-webkit-box-shadow:0 0 20px #000;
box-shadow:0 0 20px #000;
background:#eee;
border:2px solid #ddd;
border-radius:4px;
margin-bottom:15px;
padding:10px 15px 14px;
overflow:auto;
z-index:99999;
}

.popup .close{
float:right;
}

.popup .close::after{
content: "\2715";
font-size:24px;
color: #2caed3;
}

.popup a.close:hover::after{
cursor:pointer;
color: #000;
}

.popup h3{
padding:25px 35px 20px 20px;
}

#addToPlaylistPane {
  top: max(50vh - 400px, 0px) !important;
  position: fixed;
  height:630px;
  max-height:calc(100vh - 60px);
}

.social{
overflow:auto;
}

.social .sociallabel{
float:left;
padding-right:8px;
}

.social .facebookurl{
background:url(../img/channel/pictos/facebook-logo.png) left -17px no-repeat;
display:block;
width:16px;
height:16px;
float:left;
margin-right:8px;
}

.social .facebookurl:hover{
background:url(../img/channel/pictos/facebook-logo.png) no-repeat;
}

.social .twitterurl{
background:url(../img/channel/pictos/twitter-logo.png) left -17px no-repeat;
display:block;
width:16px;
height:16px;
float:left;
margin-right:8px;
}

.social .twitterurl:hover{
background:url(../img/channel/pictos/twitter-logo.png) no-repeat;
}

.channel .exploremenu{
width:100%;
float: left;
padding:15px;
border-bottom: 1px solid #eee;
}

.colright ul{
padding-bottom:10px;
list-style:none;
}

.colright .explorePortal,
.colright ul.explorenav{
padding-top:10px;
}

.colright ul.explorenav li a.highlight{
padding:0 0 3px 10px;
word-break:break-all;
font-size: 16px;
}
.colright ul.explorenav li::before {
content:"\2022";
color: #2caed3;
}
.colright ul.explorenav li:hover::before{
color: #000;
}

.colright .subscription{
padding:10px 8px 10px 38px;
display:block;
background:url(../img/channel/pictos/highlight-subscription.png) left 9px  no-repeat;
min-height:30px;
}

.mobile{
border-top:1px solid #eee;
padding:12px 0 0 0;
float:left;
}

.mobileapp{
float:left;
} 

.mobilelogo{
max-height:108px;
max-width:216px;
vertical-align:middle;
padding-right:8px;
float:left;
}

.mobiledesc{
float:left;
padding:9px 1px;
font-size:13px;
}

/**************** sponsor banner ***************/

.sponsors{
position:relative;
margin:0 auto;
width:960px;
z-index:2;/*between banner and main*/
}

.sponsors .clickablezone{
position:absolute;
background-color:transparent;
/*border:1px solid red;*/
}

/**************** activities *******************/

.channel__subscriptions {
float:right;
margin-top: -35px;
}

.activity .metainfos a{
/*font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;*/
font-size:1.1em;
}

.channel .activity .grid__item--minivideo {
width: 25%;
}

.channel .activity .grid__item--comments {
  width: 72%;
  margin-left:3%;
}

/******************* headlines *****************/

.headlines-wrapper {
padding: 15px;
clear: both;
overflow: auto;
border-bottom: 1px solid #eee;
}

.headlines {
position: relative;
}

.headlines .secondAndAfterHeadlinePlaceholder::-webkit-scrollbar-track{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #eee;
border-radius:2px;
}
.headlines .secondAndAfterHeadlinePlaceholder::-webkit-scrollbar{
width:6px;
background-color: #eee;
}
.headlines .secondAndAfterHeadlinePlaceholder::-webkit-scrollbar-thumb{
background-color: #aaa;
border-radius:2px;
}

.headline{
position:relative;
border-top:1px solid #eee;
display:block;
color:#222;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
overflow:auto;
}

.secondAndAfterHeadlinePlaceholder .headline:last-of-type {
border-bottom:1px solid #eee;
}

.headline:hover{
background:#eee;
}

.headline a{
display:block;
color:#222;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.firstHeadlinePlaceholder{
border-top:none !important;
position: relative;
width:335px;
float:left;
height:236px;
}

.secondAndAfterHeadlinePlaceholder{
border-top:none !important;
position: relative;
float:right;
padding-left:10px;
width:calc(100% - 337px);
height: 236px;
overflow-x: hidden;
overflow-y: auto;
}

.headline .wrap{
position:relative;
display:block;
width:100%;
}

.headline .wrap .video__thumb {
height: 0;
padding-top: 56.7%;
top:0;
}

.headline .wrap img{
position:relative;
display:block;
width:300px;
top:-1000px;
}

.headline .desc{
display:block;
padding:10px 9px 12px 40px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}

/* override global : */
.headline .desc .picto{
bottom: 0.4em;
}
.headline a.howto {
background-color:#aaa;
color:#fff;
}

.headline a.howto .picto{
background:transparent url(../img/channel/pictos/headlines/howto.png) 177px center no-repeat;
}

/* edit buttons */
.headlines .shadow{
-moz-box-shadow:0 2px 2px #5c5b64;
-webkit-box-shadow:0 2px 2px #5c5b64;
box-shadow:0 2px 2px #5c5b64;
}

.headlines a.edit{
background:#8A8A8A;
display:none;

height:15px;
text-align:center;
position:absolute;
z-index:2;
margin-top: 1px;
right: 45px;
padding-left:4px;
padding-right: 4px;
font-size:10px;
color:#fff;
border:none;
z-index:16;
}

.headlines a.up{
background:#8A8A8A url(../img/channel/pictos/headlines/edit-top.png) left top no-repeat;
display:none;
width:14px;
height:15px;
position:absolute;
z-index:2;
margin-top: 1px;
right: 30px;
border:none;
z-index:16;
}

.headlines a.down{
background:#8A8A8A url(../img/channel/pictos/headlines/edit-down.png) left top no-repeat;
display:none;
width:14px;
height:15px;
position:absolute;
z-index:2;
margin-top: 1px;
right: 15px;
border:none;
z-index:16;
}

.headlines a.delete{
background:#8A8A8A url(../img/channel/pictos/headlines/edit-delete.png) left top no-repeat;
display:block;
width:14px;
height:15px;
position:absolute;
z-index:2;
margin-top: 1px;
right: 0;
border:none;
display:none;
z-index:16;
}

.headlines a.show{
display:block;
}

.headlines a.action:hover{
background-color:#000;
}

.headlines a.down.disabled,
.headlines a.up.disabled,
.headlines a.down.disabled:hover,
.headlines a.up.disabled:hover{
background-color:#ccc;
}

.headlines span.overlay{
z-index:9;
display: block;
height: 0;
left: 30%;
position: absolute;
top: 0px;
width: 40%;
padding-top: 58%;
}

.headlines .headline:hover span.overlay{
cursor:pointer;
background: url(../img/channel/play.png) transparent no-repeat center center;
background-size:contain;
}

/* edition */
.headlines .editor{
padding: 0;
overflow:auto;
}

.headlines .editor img{
padding:0;
margin:0;
width:200px;
}

.headlines .editor input{
border: 1px solid #ccc;
padding: 2px 6px;
margin: 0px 8px 0 -7px;
min-height: 25px;
font-size: 11px;
}

.ie7 .headlines .editor input,
.ie8 .headlines .editor input{
width:150px;
}

.headlines .editor a.cancel{
float:left;
background:#999;
margin:2px 6px 0 0;
font-size:11px;
font-weight:normal;
padding:2px 8px 3px;
color:#fff;
}
.headlines .editor a.save{
float:left;
margin-right:12px;
background:#2caed3;
margin:2px 6px 0 0;
font-size:11px;
font-weight:normal;
padding:2px 8px 3px;
color:#fff;
}

.headlines .editor a.cancel:hover,
.headlines .editor a.save:hover{
background:#000;
}

/***********  nav bar **************************/
.navtree{
margin:0 20px 0 0;
}

.pageheader{
position:relative;
color:#999;
margin:0;
padding:8px 10px;
min-height:60px;
}

.pageheader h2{
margin-top:1px;
max-width:675px;
}

.organizer .pageheader h2{
max-width: 530px;
}

.en .organizer .pageheader h2{
max-width: 565px;
}

.content--mydartfish .pageheader h2{
max-width:620px;
}

.pageheader h2 .span {
word-wrap: break-word;
}

.content--mydartfish .playlistcollections .pageheader {
  padding-left: 0;
}
.content--mydartfish .pageheader{
display:block; 
float:left; 
border-bottom:none; 
overflow: hidden;
border: none;
min-width:675px;
padding: 8px 5px 8px 10px;
}

.content--mydartfish .settings .pageheader {
padding-left:94px;
width: 100%;
}

.content--mydartfish .settings .pageheader h2{
float:none;
max-width: none;
}

.pageheader h2{
color:#333;
float:left;
font-size: 30px;
}

.content--mydartfish .pageheader h2{
color:#fff;
padding-top:8px;
}

.content--mydartfish .pageheader .icon--backlink {
padding-top:8px;
margin-right:10px;
}

.pageheader .inplaceeditpane{
max-width:570px;
display:inline-block;
min-height:39px;
}

.pageheader .inplaceeditpane .inplaceedittextbox{
font-size:22px;
margin-top:5px;
max-width:490px;
}

.pageheader .inplaceeditsavepane {
float: left;
margin:5px 8px 0;
display:inline;
}

.pageheader a.inplaceeditbutton{
margin:5px 0 0;
}

/****************** listHeader *****************/

.pages_nav.multiple {
    display: flex;
}


.pages_nav{
    float:left;
    display:block;
    overflow:auto;
    padding:25px 20px 10px 0;
    font-size:14px;
    text-align:center;
    width:100%;
    color:#333;
}


.pages_nav_left {
    float: left;
    display: inline-block;
}

.pages_nav_right {
    flex: 1;
    float: right;
    text-align:right;
    display: inline-block;
}

.navlist .pages_nav,
.mlist .pages_nav{
border-top:1px solid #eee;
padding:25px 20px 10px 20px;
}

.content--mydartfish.content--mydartfish--grey .pages_nav{
color:#aaa;
border-top: 1px solid #5c5b64;
}

.filterButtonPane{
float:right;
}

.navbar .filterButtonPane,
.pageheader .filterButtonPane {
  height: 42px;
  display: flex;
}

.navbar .typePane{
height: 45px;
float:right;
}

.navbar .navContext{
width:calc(100% - 200px);
}

.collectionheader .filterButtonPane{
margin-top:-45px;
padding:0;
}

.filterPane{
float:left;
text-align:left;
font-size:0.9em;
}

.filterPane .filterby{
float: left;
display: block;
padding:5px 11px 0 0;
color:#999999;
}

.filterPane .clearfilter{
float: left;
display: block;
padding-top:5px;
font-size: 12px;
}

.filterPane .strFilter{
padding:5px 10px 0 0;
float: left;
display: block;
margin-left:-6px;
}

/******************  videos pop ups  ***************/

#cover{
position:fixed; 
top:0; 
left:0; 
background:rgba(0,0,0,0.7); 
z-index:5; 
width:100%;
height:100%;
display:none;
}

.videos__popup{
position:absolute;
z-index: 10;
border-radius:2px;
padding:15px 20px;
background:white;
display:none;
overflow: hidden;
top:-6px;
height:98%;
width:500px;
left: 0;
right: 0;
margin:8px auto;
}

.keyword_manager__popup {
position: fixed;
z-index: 10;
border-radius: 2px;
background: white;
display: none;
overflow: hidden;
top: 5vh !important;
height: 90vh;
min-height:450px;
width: 580px;
left: 0;
right: 0;
margin: 8px auto;
}


.keyword_manager {
  height: 100%;
  width: 100%;
}

.kwm_iframe_title {
  padding: 5px 0 5px 25px;
}
.kwf_iframe_title {
  padding: 5px 0 5px 3px;
}
.keyword_manager_panel {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.keyword_manager_iframe {
  width: 100%;
  height: 100%;
}


.keyword_manager_panel h3 {
  padding: 5px 0 5px 15px !important;
  background-color: transparent;
  color: black;
}

.keyword_manager__popup.kw_s {
  border: 2px solid #FDB72A;
}

#playlistCollPopupPane.videos__popup {
width: 55%;
height: auto;
top: 30px;
min-height: 300px;
}

#sharePopupPane.videos__popup {
width: 75%;
height: auto;
top: 55px;
min-height: 300px;
}

#extractPopupPane.videos__popup {
width: 75%;
top: 200px;
height:120px;
}

#subscribersPopupPane.videos__popup {
width: 50%;
height: auto;
top: 55px;
min-height: 300px;
overflow:visible;
}

.content--mydartfish.content--mydartfish--grey .videos__popup{
background:#48474c;
border:none;
color:white;
}

.videos__popup .closepp {
float:right;
padding:0;
margin:-20px -18px 0 0;
}

/******************  keyword filters  ***************/

#tagsPane.kwseg{
width:904px;
}

#tagsPane{
height:640px;
max-height:800px;
}

#tagsPane h3 {
float: left;
font-size: 24px;
padding:0;
}

#tagsPane .kwOptionsCheck {
float: left;
width: 100%;
margin: 0 0 2px -4px;
}

#tagsPane .kwOptionsCheck label{
line-height: 20px;
vertical-align:baseline;
}

#tagsPane .kwTreePane{
width: 100%;
height:477px;
float:left;
position: relative;
}

#tagsPane .kwTreePane .noKwPane{
position:absolute;
height:100%;
width:460px;
padding:20px 0px 10px;
background:white;
font-style:italic;
margin-top:45px;
}

#tagsPane .kwTreePane .kwTitle{
padding: 5px 0;
}

#tagsPane .kwList{
overflow:auto;
border:1px solid #ccc;
float:left;
height: 100%;
width: 100%;
font-size: 12px;
}

#tagsPane.kwseg  .kwList{
padding-right:20px;
}

#tagsPane a.icon_collapse,
#tagsPane a.icon_expand{
float: left;
margin:6px 10px 0px 10px;
}

#tagsPane ul.kwList li{
width:auto;
padding-bottom:2px;
}

#tagsPane ul.kwList li .kwr{
background:#eee;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
min-height:24px;
line-height:24px;
}

#tagsPane ul.kwList li .kwr:hover {
cursor:pointer;
}

#tagsPane ul.kwList li a.kwt{
float:left;
display:block;
font-size:12px;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
text-decoration:none;
-moz-outline:none;
padding:0px 0px 0px 39px;
min-height:24px;
}

#tagsPane ul.kwList li a.open{
background:url(../img/channel/tags_root_down.png?v2) no-repeat 5px 5px;
}
#tagsPane .kw_s ul.kwList li a.open{
background:url(../img/channel/tags_root_downSeg.png?v2) no-repeat 5px 5px;
}
#tagsPane ul.kwList li a.open:hover{
background:url(../img/channel/tags_root_down.png?v2) no-repeat 5px -25px;
cursor:pointer;
}
#tagsPane .kw_s ul.kwList li a.open:hover{
background:url(../img/channel/tags_root_downSeg.png?v2) no-repeat 5px -25px;
}
#tagsPane ul.kwList li a.closed{
background:url(../img/channel/tags_root_right.png?v2) no-repeat 5px 5px;
}
#tagsPane .kw_s ul.kwList li a.closed{
background:url(../img/channel/tags_root_rightSeg.png?v2) no-repeat 5px 5px;
}
#tagsPane ul.kwList li a.closed:hover{
background:url(../img/channel/tags_root_right.png?v2) no-repeat 5px -25px;
cursor:pointer;
}
#tagsPane .kw_s ul.kwList li a.closed:hover{
background:url(../img/channel/tags_root_rightSeg.png?v2) no-repeat 5px -25px;
}

#tagsPane ul.kwList a.tag{
display:block !important;
background:url(../img/channel/tag.png?v2) left 3px no-repeat;
cursor:pointer;
padding:1px 4px 2px 20px !important;
margin-left:17px;
overflow:hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
#tagsPane .kw_s ul.kwList a.tag{
background:url(../img/channel/tagSeg.png?v2) left 3px no-repeat;
}
#tagsPane ul.kwList a.tag:hover{
background:url(../img/channel/tag.png?v2) left -27px no-repeat;
}
#tagsPane .kw_s ul.kwList a.tag:hover{
background:url(../img/channel/tagSeg.png?v2) left -27px no-repeat;
}
#tagsPane ul.kwList a.tag.multi{
background:url(../img/channel/tags.png?v2) left 3px no-repeat;
}
#tagsPane .kw_s ul.kwList a.tag.multi{
background:url(../img/channel/tagsSeg.png?v2) left 3px no-repeat;
}
#tagsPane ul.kwList a.tag.multi:hover{
background:url(../img/channel/tags.png?v2) left -27px no-repeat;
}
#tagsPane .kw_s ul.kwList a.tag.multi:hover{
background:url(../img/channel/tagsSeg.png?v2) left -27px no-repeat;
}
#tagsPane ul.kwList a.tag.l1{
margin-left:40px;
}
#tagsPane ul.kwList a.tag.l2{
margin-left:62px;
}
#tagsPane ul.kwList a.tag.l3{
margin-left:84px;
}
#tagsPane ul.kwList a.tag.l4{
margin-left:96px;
}
#tagsPane ul.kwList a.tag.l5{
margin-left:118px;
}

#tagsPane .kwOptions{
float:left;
width: 100%;
min-height:33px;
font-size: 12px;
}

#tagsPane .kwOptions .button{
margin:0;
font-size:12px;
text-align:center;
float:right;
margin-bottom:5px;
padding:5px 3px;
width:125px;
}

#tagsPane .selKwLabel{
display:inline;
color:#999999;
float:left;
margin-top:4px
}

#tagsPane .kwOptions .filterPane{
border:none;
padding:2px 5px 5px;
width:320px;
}

#tagsPane .kwheader{
float:left;
width:100%;
border:1px solid #ccc;
border-bottom:none;
height:44px;
padding-top:7px;
position: relative;
}

#tagsPane .kwheader input[type=search] {
border-radius: 2px;
padding: 0 0 0 3px;
height: 28px;
float: left;
width: 247px;
margin-top: 0px;
-webkit-appearance: none;
border: 1px solid #ccc;
min-height: 20px;
}

#tagsPane #searchkwresults {
background: #eee;
border: 1px solid #bbb;
border-top: none;
z-index: 3;
width: 247px;
max-height: 300px;
overflow-y: auto;
overflow-x: hidden;
display: none;
margin-left: 38px;
margin-top: 28px;
font-size: 12px;
}

#tagsPane #searchkwresults a, #tagsPane #searchkwresults span{
float: left;
display: block;
width: 100%;
border-bottom:1px solid #eee;
height:24px;
padding:1px 5px 0px;
overflow:hidden;
text-overflow: ellipsis;
white-space:nowrap;
}

#tagsPane #searchkwresults a:hover {
cursor:pointer;
}

#tagsPane #searchkwresults a.selected {
background:#ccc;
color:#000;
}


/******************  keyword assign  ***************/

#assignKwPane.kwseg {
width:904px;
}

#assignKwPane {
height:640px;
max-height:800px;
}

#assignKwPane h3 {
float:left;
font-size:24px;
padding:0;
}

#assignKwPane .kwOptionsCheck {
float:left;
width:100%;
margin:0 0 2px -4px;
display:block;
}

#assignKwPane .kwOptionsCheck label {
line-height:20px;
vertical-align:baseline;
}

#assignKwPane .kwTreePane {
width:100%;
height:484px;
float:left;
position:relative;
}

#assignKwPane .kwTreePane .noKwPane {
position:absolute;
height:100%;
width:460px;
padding:20px 0px 10px;
background:white;
font-style:italic;
margin-top:45px;
}

#assignKwPane .kwTreePane .kwTitle {
padding:5px 0;
}

#assignKwPane .kwList {
overflow:auto;
border:1px solid #ccc;
float:left;
height:100%;
width:100%;
font-size:12px;
}

#assignKwPane.kwseg  .kwList {
padding-right:20px;
}

#assignKwPane a.icon_collapse,
#assignKwPane a.icon_expand {
float:left;
margin:6px 10px 0px 10px;
}

#assignKwPane ul.kwList li {
width:auto;
}

#assignKwPane ul.kwList li .kwr {
background:#eee;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
min-height:24px;
line-height:22px;
}

#assignKwPane ul.kwList li .kwb {
min-height:24px;
line-height:22px;
}

#assignKwPane ul.kwList li .kwr:hover {
cursor:pointer;
}

#assignKwPane ul.kwList li a.kwt {
float:left;
display:block;
font-size:12px;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
text-decoration:none;
-moz-outline:none;
padding:0px 0px 0px 39px;
min-height:24px;
}

#assignKwPane ul.kwList li a.open {
background:url(../img/channel/tags_root_down.png?v2) no-repeat 5px 5px;
}
#assignKwPane ul.kwList li a.open:hover {
background:url(../img/channel/tags_root_down.png?v2) no-repeat 5px -25px;
cursor:pointer;
}
#assignKwPane ul.kwList li a.closed {
background:url(../img/channel/tags_root_right.png?v2) no-repeat 5px 5px;
}
#assignKwPane ul.kwList li a.closed:hover {
background:url(../img/channel/tags_root_right.png?v2) no-repeat 5px -25px;
cursor:pointer;
}

#assignKwPane ul.kwList a.tag {
display:block !important;
background:url(../img/channel/tag.png?v2) left 6px no-repeat;
cursor:pointer;
padding:1px 4px 1px 20px !important;
margin-left:17px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
#assignKwPane ul.kwList a.tag:hover {
background:url(../img/channel/tag.png?v2) left -24px no-repeat;
}
#assignKwPane ul.kwList a.tag.multi {
background:url(../img/channel/tags.png?v2) left 6px no-repeat;
}
#assignKwPane ul.kwList a.tag.multi:hover {
background:url(../img/channel/tags.png?v2) left -24px no-repeat;
}
#assignKwPane ul.kwList a.tag.l1 {
margin-left:40px;
}
#assignKwPane ul.kwList a.tag.l2 {
margin-left:62px;
}
#assignKwPane ul.kwList a.tag.l3 {
margin-left:84px;
}
#assignKwPane ul.kwList a.tag.l4 {
margin-left:96px;
}
#assignKwPane ul.kwList a.tag.l5 {
margin-left:118px;
}

#assignKwPane ul.kwList a.kwa::before {
content:"";
background:url(../img/channel/checkbox3states.png) no-repeat;
background-size:14px 48px;
width:19px;
height:18px;
float:left;
}
#assignKwPane ul.kwList a.kwa.fullyAssigned::before {
background-position:0 4px;
}
#assignKwPane ul.kwList a.kwa.partiallyAssigned::before {
background-position:0 -13px;
}
#assignKwPane ul.kwList a.kwa.notAssigned::before {
background-position:0 -30px;
}

#assignKwPane .kwOptions {
float:left;
width:100%;
min-height:56px;
font-size:12px;
}

#assignKwPane .kwOptions .kwAssign {
float:right;
width:160px;
padding-bottom:5px;
}

#assignKwPane .kwOptions .kwAssign .button {
margin:0;
font-size:12px;
text-align:center;
float:right;
margin-bottom:5px;
padding:5px 3px;
width:100%;
}

#assignKwPane .selKwLabel {
display:inline;
color:#999999;
float:left;
margin-top:4px;
width:290px;
}

#assignKwPane .kwOptions .filterPane {
border:none;
padding:2px 5px 5px;
width:300px;
}

#assignKwPane .kwheader {
float:left;
width:100%;
border:1px solid #ccc;
border-bottom:none;
height:44px;
padding-top:7px;
position:relative;
}

#assignKwPane .kwheader input[type=search] {
border-radius:2px;
padding:0 0 0 3px;
height:28px;
float:left;
width:247px;
margin-top:0px;
-webkit-appearance:none;
border:1px solid #ccc;
min-height:20px;
}

#assignKwPane #searchkwresults {
background:#eee;
border:1px solid #bbb;
border-top:none;
z-index:3;
width:247px;
max-height:300px;
overflow-y:auto;
overflow-x:hidden;
display:none;
margin-left:38px;
margin-top:28px;
font-size:12px;
}

#assignKwPane #searchkwresults a,
#assignKwPane #searchkwresults span {
float:left;
display:block;
width:100%;
border-bottom:1px solid #eee;
height:24px;
padding:1px 5px 0px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

#assignKwPane #searchkwresults a:hover {
cursor:pointer;
}

#assignKwPane #searchkwresults a.selected {
background:#ccc;
color:#000;
}

/******************  web upload  ***************/

#webUploadPopupPane{
width: 540px;
height: 630px;
padding: 15px 0;
top: 0;
font-size: 15px;
}

.upload  #webUploadPopupPane{
margin:auto;
}

#webUploadPopupPane h3 {
padding: 0 20px 10px 20px;
}
#playlistPublishPopupPane progress,
#webUploadPopupPane progress {
  -webkit-appearance: none; /* Reset the default appearance */
  -moz-appearance: none;
  appearance: none;
  border: none; /* Get rid of default border in Firefox. */
  width: 160px;
  height: 6px;
  color: #AAA; /* Progress color for IE10 */
}
#playlistPublishPopupPane progress {
  vertical-align: middle;
}
#webUploadPopupPane progress::-webkit-progress-bar { /* For Chrome, Safari, Opera */
  background-color: #EEE;
  border-radius: 2px;
}
#webUploadPopupPane progress::-webkit-progress-value{ /* For Chrome, Safari, Opera */
background-color: #AAA;
border-radius: 2px;
}
#webUploadPopupPane progress::-moz-progress-bar{ /* For Firefox */
background-color: #AAA;
border-radius: 2px;
}

#webUploadPopupPane .wuTop{
width: 100%;
height: 80px;
padding: 0 20px;
overflow: hidden;
border-top: 1px solid #EEE;
border-bottom: 1px solid #EEE;
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
}

#webUploadPopupPane .wuTop .step{
overflow: hidden;
position: relative;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
border-radius: 50%;
background-color: #EEE;
width: 40px;
height: 40px;
margin-right: 5px;
float: left;
}

#webUploadPopupPane .wuTop .step.selected{
background-color: #AAA;
}

#webUploadPopupPane .wuTop .step span{
display: flex;
justify-content: center;
color: white;
font-size: 20px;
line-height: 35px;
}

#webUploadPopupPane .wuTop .stepLabel{
font-family: ClearSans-Light, sans-serif;
font-size: 18px;
line-height: 36px;
float: left;
}

#webUploadPopupPane .wuTop .longDash{
border-top: 2px solid #EEE;
margin: 0 10px;
}

#webUploadPopupPane .wuBody{
width: 100%;
height: 420px;
padding: 0 14px 15px 20px;
overflow-x: hidden;
overflow-y: scroll;
}

#webUploadPopupPane .wuBody #SelectButtonEnabled,
#webUploadPopupPane .wuBody #SelectButtonDisabled{
margin: 15px 5px 15px 0;
padding: 2px 10px 3px;
}

#webUploadPopupPane .wuBody .beauton.disabled{
background-color: #EEE;
}
#webUploadPopupPane .wuBody .beauton.disabled:hover{
cursor: default;
}

#webUploadPopupPane .wuBody #CancelLink{
font-size: 13px;
}

#webUploadPopupPane .wuBody #Storage {
  font-size: 12px;
  width: 180px;
  padding-top: 20px;
  float: right;
}

#webUploadPopupPane .wuBody #Storage progress {
  display: block;
  width: 100%;
}
#playlistPublishPopupPane .ppBody #Storage progress.green,
#webUploadPopupPane .wuBody #Storage progress.green {
  color: green; /* Progress color for IE10 */
}
#playlistPublishPopupPane .ppBody #Storage progress.green::-webkit-progress-value,
#webUploadPopupPane .wuBody #Storage progress.green::-webkit-progress-value { /* For Chrome, Safari, Opera */
  background-color: green;
}
#playlistPublishPopupPane .ppBody #Storage progress.green::-moz-progress-bar,
#webUploadPopupPane .wuBody #Storage progress.green::-moz-progress-bar { /* For Firefox */
  background-color: green;
}

#playlistPublishPopupPane .ppBody #Storage progress.orange,
#webUploadPopupPane .wuBody #Storage progress.orange {
  color: orange; /* Progress color for IE10 */
}
#playlistPublishPopupPane .ppBody #Storage progress.orange::-webkit-progress-value,
#webUploadPopupPane .wuBody #Storage progress.orange::-webkit-progress-value { /* For Chrome, Safari, Opera */
  background-color: orange;
}
#playlistPublishPopupPane .ppBody #Storage progress.orange::-moz-progress-bar,
#webUploadPopupPane .wuBody #Storage progress.orange::-moz-progress-bar { /* For Firefox */
  background-color: orange;
}

#playlistPublishPopupPane .ppBody #Storage progress.red,
#webUploadPopupPane .wuBody #Storage progress.red {
  color: red; /* Progress color for IE10 */
}
#playlistPublishPopupPane .ppBody #Storage progress.red::-webkit-progress-value,
#webUploadPopupPane .wuBody #Storage progress.red::-webkit-progress-value { /* For Chrome, Safari, Opera */
  background-color: red;
}
#playlistPublishPopupPane .ppBody #Storage progress.red::-moz-progress-bar,
#webUploadPopupPane .wuBody #Storage progress.red::-moz-progress-bar { /* For Firefox */
  background-color: red;
}

#webUploadPopupPane .wuBody::-webkit-scrollbar-track{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #eee;
border-radius: 2px;
}

#webUploadPopupPane .wuBody::-webkit-scrollbar{
width: 6px;
background-color: #eee;
}

#webUploadPopupPane .wuBody::-webkit-scrollbar-thumb{
background-color: #aaa;
border-radius: 2px;
}

#webUploadPopupPane .wuBody h4{
margin: 14px 0 15px;
font-size: 20px;
}

#webUploadPopupPane .wuBody #VideoList,
#webUploadPopupPane .wuBody #ActionList,
#webUploadPopupPane .wuBody #CleaningFailed{
border-top: 1px solid #EEE;
border-bottom: 1px solid #EEE;
margin-bottom: 15px;
padding: 10px 0;
}

#webUploadPopupPane .wuBody #VideoList .uploadProgress{
white-space: nowrap;
height: 24px;
}

#webUploadPopupPane .wuBody #VideoList .uploadProgress div{
width: 260px;
overflow: hidden;
text-overflow: ellipsis;
float: left;
}

#webUploadPopupPane .wuBody #VideoList .uploadProgress progress{
float: right;
margin-top: 10px;
}
#webUploadPopupPane .wuBody #VideoDocumentInfo label {
  display: block;
  margin-top: 16px;
  color: #AAA;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo input{
width: 100%;
float: none;
font-family: ClearSans-Roman, sans-serif;
font-size: 16px;
color: #333;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo textarea{
width: 100%;
min-width: 100%;
max-width: 100%;
height: 48px;
min-height: 48px;
border: 1px solid #e4e4e4;
display: block;
border-radius: 2px;
padding: 3px;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: ClearSans-Roman, sans-serif;
font-size: 16px;
color: #333;
}

/* start keywords autocomplete */
#webUploadPopupPane .wuBody #VideoDocumentInfo .keyword {
font-size: 13px;
display: flex;
width: 100%;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo .category {
width: 40%;
float: left;
white-space: nowrap;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo .category span {
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: inline-block;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo .selectedvalues {
width: 60%;
float: left;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo .selectedvalues input {
font-size: 13px;
min-height: 22px;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo ul.ui-autocomplete {
position: absolute;
padding: 0;
list-style: none;
border: 1px solid #ccc !important;
z-index: 50;
overflow-y: auto;
width: calc(540px * 0.6 - 24px) !important;
max-height: 150px;
-moz-box-shadow:2px 2px 7px #aaa;
-webkit-box-shadow:2px 2px 7px #aaa;
box-shadow:2px 2px 7px #aaa;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo ul.ui-autocomplete li.ui-menu-item {
background-color: #fafafa;
cursor: pointer;
font-weight: normal;
overflow: auto;
font-size: 13px;
height: 24px;
padding-left: 3px;
padding-top: 2px;
}

#webUploadPopupPane .wuBody #VideoDocumentInfo ul.ui-autocomplete li.ui-menu-item:hover,
#webUploadPopupPane .wuBody #VideoDocumentInfo ul.ui-autocomplete .ui-state-hover {
background-color: #f0f0f0 !important;
}
/* end keywords autocomplete */

#webUploadPopupPane .wuBody #PublishResult span{
color: red;
}

#webUploadPopupPane .wuBottom{
width: 100%;
height: 70px;
padding: 0 20px;
overflow: hidden;
border-top: 1px solid #EEE;
}

#webUploadPopupPane .wuBottom .uploadProgress{
margin-top: 20px;
float: left;
}

#webUploadPopupPane .wuBottom .uploadProgress progress{
width: 220px;
margin-bottom: 5px;
}

#webUploadPopupPane .wuBottom .button{
padding: 2px 10px 3px;
margin-top: 20px;
float: right;
}

#webUploadPopupPane .wuBottom .button.disabled{
background-color: #EEE;
}
#webUploadPopupPane .wuBottom .button.disabled:hover{
cursor: default;
}
/*15px 20px*/
/* Publish playlist */
#playlistPublishPopupPane {
  width: 550px;
  height: 690px;
  padding: 0;
}
#playlistPublishPopupPane > h3 {
  padding: 10px 20px;
}
#playlistPublishPopupPane .pp_warning {
  background: #ffc;
  color: red;
  padding: 3px 10px 5px 10px;
}
#playlistPublishPopupPane .pp_separator {
  height: 20px;
}
#playlistPublishPopupPane .hidden {
  display: none !important;
  visibility: hidden !important;
}
#playlistPublishPopupPane .ppBody {
  height: 530px;
}
#playlistPublishPopupPane .pp_publish_unvalid {
  height: 530px;
}
#playlistPublishPopupPane .pp_publish_result {
  height: 580px;
}
#playlistPublishPopupPane .ppBody {
  overflow-y: scroll;
  padding: 0px 20px 0 20px;
  border-top: solid 1px grey;
  scrollbar-width: thin;
}
#playlistPublishPopupPane .ppBody::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  background-color: #eee;
  border-radius: 2px;
}

#playlistPublishPopupPane .ppBody::-webkit-scrollbar {
  width: 6px;
  background-color: #6c6a72;
}

#playlistPublishPopupPane .ppBody::-webkit-scrollbar-thumb {
  background-color: #908d98;
  border-radius: 2px;
}
#playlistPublishPopupPane .ppBody textarea,
#playlistPublishPopupPane .ppBody select,
#playlistPublishPopupPane .ppBody input[type="text"] {
  background: #58575c;
  border-color: #777;
  color: white;
}
#playlistPublishPopupPane .ppBody input[type="text"]::placeholder {
  color: #bbb;
}
#playlistPublishPopupPane .ppBody .pp_block,
#playlistPublishPopupPane .ppBody #VideoDocumentInfo {
  color: #bbbbbb;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo input {
  width: 100%;
  float: none;
  font-family: ClearSans-Roman, sans-serif;
  font-size: 16px;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo textarea {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 48px;
  min-height: 48px;
  display: block;
  border-radius: 2px;
  padding: 3px;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: ClearSans-Roman, sans-serif;
  font-size: 16px;
}
#playlistPublishPopupPane .ppBody select {
  padding: 3px;
  width: 100%;
}
#playlistPublishPopupPane .ppHeader {
  display: flex;
  column-gap: 30px;
  border-bottom: 1px solid grey;
  border-top: 1px solid grey;
  padding: 10px 20px;
}

#playlistPublishPopupPane .ppHeader input[type="submit"].selected {
  border-bottom: 3px solid #2caed3;
  pointer-events: none;
}
.content--mydartfish.content--mydartfish--grey #playlistPublishPopupPane .ppHeader input[type="submit"].selected {
  border-color: #ffba00;
}
#playlistPublishPopupPane .ppHeader input[type="submit"] {
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: inherit;
  font-size: inherit;
  min-height: 0;
  cursor: pointer;
  padding: 0 0 3px 0;
}
#playlistPublishPopupPane .ppHeader input[type="submit"]:hover {
  color: #ccc;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo .keyword {
  font-size: 13px;
  display: flex;
  width: 100%;
  margin-top: 5px;
  color: white;
}
#playlistPublishPopupPane .ppBody .pp_channel_info {
  display: flex;
  flex-direction: row;
  column-gap: 10px;
}
#playlistPublishPopupPane .ppBody .pp_channel_info #Storage{
  display: flex;
  flex-flow: column;
  margin-top: 10px;
  font-size: 13px;
  color: #bbbbbb;
  row-gap: 3px;
}

#playlistPublishPopupPane .ppBody #VideoDocumentInfo .category {
  width: 40%;
  float: left;
  white-space: nowrap;
}

#playlistPublishPopupPane .ppBody #VideoDocumentInfo .category span {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  display: inline-block;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo .selectedvalues {
  width: 60%;
  float: left;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo .selectedvalues input {
  font-size: 13px;
  min-height: 22px;
}
#playlistPublishPopupPane .ppBody #VideoDocumentInfo ul.ui-autocomplete {
  color: black;
  position: absolute;
  padding: 0;
  list-style: none;
  border: 1px solid #ccc !important;
  z-index: 50;
  overflow-y: auto;
  width: calc(540px * 0.6 - 24px) !important;
  max-height: 150px;
  -moz-box-shadow: 2px 2px 7px #aaa;
  -webkit-box-shadow: 2px 2px 7px #aaa;
  box-shadow: 2px 2px 7px #aaa;
}

#playlistPublishPopupPane .ppBody #VideoDocumentInfo ul.ui-autocomplete li.ui-menu-item {
  background-color: #fafafa;
  cursor: pointer;
  font-weight: normal;
  overflow: auto;
  font-size: 13px;
  height: 24px;
  padding-left: 3px;
  padding-top: 2px;
}

#playlistPublishPopupPane .ppBody #VideoDocumentInfo ul.ui-autocomplete li.ui-menu-item:hover,
#playlistPublishPopupPane .ppBody #VideoDocumentInfo ul.ui-autocomplete .ui-state-hover {
  background-color: #f0f0f0 !important;
}
#playlistPublishPopupPane .pp_publish_unvalid,
#playlistPublishPopupPane .pp_publish_result,
#playlistPublishPopupPane .ppBottom {
  padding: 10px 27px;
  border-top: solid 1px grey;
}
#playlistPublishPopupPane .ppBottom .button {
  float: right;
  background: #ffba00;
}
#playlistPublishPopupPane .ppBottom .button.disabled {
  filter: grayscale(1);
  pointer-events: none;
}
/******************  presenter  ***************/
.presenter .innercontent {
  padding-bottom: 0px;
  min-height: 600px;
  background-color: black;
}

.presenter .colleft{
width:960px;
}

.presenter .content{
background:#333;
width:960px;
min-height:600px;
border:none;
border-top:none;
border-top-bottom-radius:0;
border-top-bottom-radius:0;
padding-bottom:0px;
}

.presenter .presenterApp{
float:left;
background-color:#5e6161;
margin:0;
overflow:hidden;
}

.presenter .getSilverlight {
float:left;
}

/******************  player ***************/

.player .colleft{
width:960px;
}

.player .innercontent{
width:960px;
min-height:600px;
border:0px;
padding-bottom:0;
}

.player .videoPlayer{
background-color:#000;
overflow:hidden;
width:960px;
height:540px;
display:block;
}

.content--mydartfish .player .videoPlayer{
border-color:#777;
}

.player .videoElement{
position:relative;
height:100%;
width:100%;
}

.player .videoPlayer .playerLoading{
color:#aaa;
text-align: center;
top: 50%;
position:relative;
font-size:2em;
}

.player .videoTag{
-ms-object-fit:contain;
-moz-object-fit:contain;
-o-object-fit:contain;
-webkit-object-fit:contain;
object-fit:contain;
}

.player .thumbPane .thumbPaneContent{
padding: 0px 20px 0px;
min-height: 26px;
}

.player .thumbPane .thumbPaneContent .loader {
padding: 15px 0 9px;
border:none;
}

.player .favPane .favContentPane .button{
margin:15px 0 10px;
}

.player .favPane .formSuccess,
.player .thumbPane .formSuccess,
.player .splPane .formSuccess{
border: none;
padding: 8px 0 10px 60px;
background-position: 0 center;
background-color: transparent;
margin:0 !important;
}

.player .favPane .allFav,
.player .splPane .allSpl{
float:right;
padding:0 75px 0 0;
}

.player .downPane .downContentPane{
padding:0px 20px 10px;
min-height:26px;
}

.player .downPane .downContentPane span{
float:left;
width:100%;
}

.player .downPane .downContentPane .button{
margin:15px 0 10px;
}

.player .sharingLoader{
font-size:15px;
line-height:20px;
color:#3d3d3d;
overflow:hidden;
vertical-align:top;
padding-bottom:15px;
}

.fileLinkBox{
float:left;
width:100%;
display:inline-block;
}

a.fileLink{
padding:0 0 4px 32px;
line-height:24px;
height:24px;
background:transparent url(../img/iconfile/blank.png) left top no-repeat;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}

a.fileLink.pdf/*,a.fileLink[href$='.pdf']*/{
background:transparent url(../img/iconfile/pdf.png) left top no-repeat;
}

a.fileLink.mp4{
background:transparent url(../img/iconfile/mp4.png) left top no-repeat;
}
a.fileLink.avi{
background:transparent url(../img/iconfile/avi.png) left top no-repeat;
}
a.fileLink.wmv{
background:transparent url(../img/iconfile/wmv.png) left top no-repeat;
}
a.fileLink.mpg,a.fileLink.mpeg,a.fileLink.mod,a.fileLink.tod,a.fileLink.3gp,a.fileLink.asf,
a.fileLink.mxf,a.fileLink.ts,a.fileLink.mts,a.fileLink.m2t,a.fileLink.m2ts{
background:transparent url(../img/iconfile/video.png) left top no-repeat;
}
a.fileLink.mov,a.fileLink.m4v{
background:transparent url(../img/iconfile/mov.png) left top no-repeat;
}
a.fileLink.swf,a.fileLink.flv{
background:transparent url(../img/iconfile/swf.png) left top no-repeat;
}

a.fileLink.mp3,a.fileLink.wav,a.fileLink.m4a,a.fileLink.wma{
background:transparent url(../img/iconfile/audio.png) left top no-repeat;
}

a.fileLink.jpg,a.fileLink.jpeg,a.fileLink.png,a.fileLink.bmp,a.fileLink.tif,a.fileLink.tga,a.fileLink.gif{
background:transparent url(../img/iconfile/image.png) left top no-repeat;
}

a.fileLink.odt{
background:transparent url(../img/iconfile/document.png) left top no-repeat;
}
a.fileLink.doc,a.fileLink.docx,a.fileLink.wps{
background:transparent url(../img/iconfile/doc.png) left top no-repeat;
}
a.fileLink.xls,a.fileLink.xlsx,a.fileLink.csv,a.fileLink.ods{
background:transparent url(../img/iconfile/xls.png) left top no-repeat;
}
a.fileLink.ppt,a.fileLink.pptx,a.fileLink.pps,a.fileLink.ppsx{
background:transparent url(../img/iconfile/ppt.png) left top no-repeat;
}

a.fileLink.txt,a.fileLink.rtf{
background:transparent url(../img/iconfile/txt.png) left top no-repeat;
}
a.fileLink.htm,a.fileLink.html{
background:transparent url(../img/iconfile/html.png) left top no-repeat;
}
a.fileLink.xml,a.fileLink.xps{
background:transparent url(../img/iconfile/xml.png) left top no-repeat;
}
a.fileLink.zip,a.fileLink.rar{
background:transparent url(../img/iconfile/zip.png) left top no-repeat;
}
a.fileLink.config,a.fileLink.settings{
background:transparent url(../img/iconfile/config.png) left top no-repeat;
}

a.fileLink.analyzerproject,a.fileLink.storyboard{
background:transparent url(../img/iconfile/storyboard.png?v2) left top no-repeat;

}
a.fileLink.dartclip{
background:transparent url(../img/iconfile/dartclip.png?v2) left top no-repeat;
background-size:24px 24px;
}
a.fileLink.playlistproject,a.fileLink.playerproject{
background:transparent url(../img/iconfile/playlistproject.png?v2) left top no-repeat;
background-size:24px 24px;
}
a.fileLink.simulcamproject,a.fileLink.simulcamfixedproject{
background:transparent url(../img/iconfile/simulcamproject.png?v2) left top no-repeat;
background-size:24px 24px;
}
a.fileLink.stromoproject,a.fileLink.stromofixedproject{
background:transparent url(../img/iconfile/stromoproject.png?v2) left top no-repeat;
background-size:24px 24px;
}
a.fileLink.taggingdb{
background:transparent url(../img/iconfile/taggingdb.png?v2) left top no-repeat;
background-size:24px 24px;
}
a.fileLink.taggingproject{
background:transparent url(../img/iconfile/taggingproject.png?v2) left top no-repeat;
background-size:24px 24px;
}

/***********  organizer ***************/

.organizer .colleft,
.trash .colleft,
.dashboard .colleft,
.upload .colleft {
width: 960px;
}

.channel .grid__item--minivideo {
max-width: 25%;
}

/***********  contentmanager ***************/
.contentmanager .colleft {
width: 960px;
}

/***********  channel  ***************/
.pageheader .headertools {
  display: block;
  float: right;
  padding: 0;
}

.dashboard .pageheader .headertools {
margin-right: -15px;
}

.content--mydartfish .pageheader .headertools {
padding:8px 0 0 0;
height:30px;
}
.content--mydartfish .pageheader .headertools input[type=image] {
  min-height: 0;
  height:24px;
  position: relative;
  top: 10px;
  opacity: 0.75;
}
.content--mydartfish .pageheader .headertools input[type=image]:hover {
  filter: brightness(200%) grayscale(1);
  opacity: 1;
}

.pageheader .playlistButtonPane {
  display: inline-flex;
  column-gap: 10px;
}
.content--mydartfish .pageheader .headertools .playlist-switch {
  display: flex;
  position: absolute;
  top: 24px;
  right: 130px;
  height: 28px;
}
.content--mydartfish .pageheader .headertools .playlist-switch .switch-button {
  height: 28px;
  border: 1px solid #b3b3b3;
  border-radius: 3px;
  padding: 0 5px 4px 5px;
  background: #a58430;
  color: white;
  pointer-events: none;
}
.content--mydartfish .pageheader .headertools .playlist-switch.active-left .switch-button.left:hover,
.content--mydartfish .pageheader .headertools .playlist-switch.active-right .switch-button.right:hover {
  background: #777;
}
.content--mydartfish .pageheader .headertools .playlist-switch.active-left .switch-button.left,
.content--mydartfish .pageheader .headertools .playlist-switch.active-right .switch-button.right {
  pointer-events: auto;
  background: transparent;
  cursor: pointer;
}

.content--mydartfish .pageheader .headertools .playlist-switch .switch-button.left {
  border-right: none;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.content--mydartfish .pageheader .headertools .playlist-switch .switch-button.right {
  border-left: none;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}
.content--mydartfish .pageheader .headertools .playlist-switch img {
  height: 12px;
  filter: brightness(2);
}

.pageheader .headertools .beauton{
margin: 0;
}

.channelcollections .pageheader .headertools {
float: left;
margin: -3px 0 0 10px;
}

.channelcollections .newcollpane{
float:left;
padding:10px 0 5px;
display:none;
border-top:none;
width: 100%;
cursor:default;
}

.channelcollections .newcollpane input[type=text]{
min-width:300px;
font-size:16px;
float:none;
margin-bottom:10px;
}

.channelcollections .newcollpane input[type=radio]{
margin-bottom:4px;
}

.channelcollections .newcollpane label{
font-size:14px;
}

.channelcollections .newcollpane .buttonsfield{
margin-top:10px;
}

.collection {
border-bottom: 1px solid #eee;
padding: 11px 10px;
overflow: auto;
}
.content--mydartfish.content--mydartfish--grey .collection {
border-bottom-color: #5c5b64;
}

.collection.collection--add{
border-top:1px solid #eee;
min-height: 64px;
padding: 11px 10px 8px 13px;
}
.content--mydartfish.content--mydartfish--grey .collection--add{
border-top-color: #5c5b64;
}

.collection.collection--add .beauton span::before {
content: "+";
font-size: 40px;
line-height: 16px;
margin-right: 10px;
vertical-align: text-top;
font-weight: bold;
}

.subscriptions .collection{
cursor:auto;
}

.collection .icon_channels{
position:absolute;
}

.collection .infos{
float:left;
margin-left:80px;
float:left;
}

.collection .infos h4{
margin:0;
display:block;
font-size:20px;
line-height:1em;
padding-bottom:5px;
width:100%;
float:left;
}

.collection .inplaceeditsavepane{
float:left;
margin-top:3px;
padding:0 5px;
height: 25px;
}

.collection .infos p,
.collection .infos .details{
padding-bottom:1px;
padding-right:5px;
margin:0;
float:left;
clear:left;
font-size:0.9em;
color:#333;
}
.content--mydartfish.content--mydartfish--grey .collection .infos p,
.content--mydartfish.content--mydartfish--grey .collection .infos .details{
color:#aaa;
}
.content--mydartfish.content--mydartfish--grey .collection .infos a{
color:#fff;
}

.collection .infos .details,
.collection .infos .description{
width:100%;
}

.collection .infos .description{
margin-top:10px;
}

.collection .infos .subsval{
color:#6b6a74;
padding-top:3px;
}

p.subsval, p.subsstat{
display:block !important;
padding:0;
}

.collection .colltype {
width: 22px;
height: 22px;
position: absolute;
margin: 35px 0 0px 35px;
overflow: hidden;
}

.collection:hover{
background:#eee;
cursor:pointer;
}

.content--mydartfish.content--mydartfish--grey .collection:hover{
background:#5c5b64;
}

.c{
background:#e7e8ea !important;
background-image:none !important;
}

/********* subscription  ********/

.colldetails{
padding-right:20px;
overflow:auto;
}

.colldetails h3{
width:100%;
padding:2px 0 26px;
}

.colldetails .description{
float:left;
max-width:65%;
padding:3px 15px 3px 0px;
overflow: hidden;
}

.colldetails ul{
margin:0;
padding:0  0 8px 13px;
}

.colldetails ol{
margin:0;
padding:0 0 8px 18px;
}

.colldetails .subsinfos span{
font-weight:700;
}

.colldetails .subsinfos {
max-width: 30%;
float: left;
color: #000;
clear: right;
background: #eee;
border: 1px solid #d2d2d2;
border-radius: 2px;
margin: 10px 20px 10px 0;
padding: 5px 15px 5px 15px;
overflow: auto;
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
}

.colldetails .subsinfos .nvideos{
overflow:auto;
font-weight:700;
padding:10px 0 5px;
float:left;
width:100%;
}

.colldetails .subsinfos p{
display:inline-block;
width:100%;
font-size: 12px;
line-height: 14px;
color:rgb(51, 51, 51);
}

.colldetails .subsinfos p.fee{
line-height:18px;
color:#000;
margin:5px 0;
float:left;
}

.colldetails .subsinfos p.fee b{
font-size:14px;
}

.colldetails .subsinfos p .beauton {
margin:8px 0;
}

.colldetails .subsinfos .subscribe_signin{
font-size:11px;
color:#5c5b64;
}

.colldetails .subsinfos .title{
font-weight:700;
display:block;
margin-bottom:6px;
}

.subsinfos .submitbutton{
margin:5px 0 0;
}

.colright .recheader{
height:112px;
}

.viewgrid__admin-links {
min-width: 65px;
}

/******* featured subscription (rightcol)  ******/

h4.featured{
font-size:20px;
line-height:1em;
margin:0;
padding:0 0 10px 0;
}

.collEdito{
overflow:auto;
color:#333;
margin-top:5px;
font-size:13px;
}

.collEdito h1,.chMoreContent h1,
.collEdito h2,.chMoreContent h2,
.collEdito h3,.chMoreContent h3{
padding:0 0 6px 0;
margin:0;
font-family:Helvetica neue, Helvetica, Arial,Verdana,sans-serif;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.collEdito h1,.chMoreContent h1{
font-size:16px;
}

.collEdito h2,.chMoreContent h2{
font-size:14px;
}

.collEdito h3,.chMoreContent h3{
font-size:12px;
}

.collEdito p,.chMoreContent p{
margin:0;
padding:0 0 2px 0;
}

.collEdito ul,.chMoreContent ul{
margin:0;
padding:0 0 6px 16px;
list-style-type:disc;
border-top:none;
}

.collEdito ol,.chMoreContent ol{
margin:0;
padding:0 0 6px 20px;
list-style-type:decimal;
}

.collEdito strong,.chMoreContent strong{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.collEdito em,.chMoreContent em{
font-style:italic;
}

/*******  rightcol  **************/

.filterby_block{
margin-bottom:0;
overflow: hidden;
}

.filterby_block .closed{
display:none;
}

.filterby_block .open{
display:block;
}

.filterby_block ul li{
overflow:auto;
margin:0;
}

.filterby_block ul li div.filter_text a,.filterby_block ul li div.ftl a{
text-decoration:none;
}

.filterby_block ul li div.filter_text a:hover,.filterby_block ul li div.ftl a:hover{
text-decoration:none;
}

.filterby_block ul{
list-style-type:none;
margin:0;
padding:0;
}

.filterby_block ul li div{
float:left;
width:100%;
}

.filterby_block ul li div.ftl{
height:18px;
overflow:hidden;
}
.filtercollection .filterby_block ul li div.ftl{
height:21px;
}

.filterby_block #showall{
padding:0 0 12px 0;
position:relative;
margin-top:-8px;
font-size:0.9em;
width:185px;
}

.filtercollection ul.kwList a{
line-height:14px;
font-size:12px;
display:block; 
text-overflow: ellipsis;
overflow:hidden;
max-height: 25px;
}

.filtercollection ul.kwList a.off{
display:block !important;
background:url(../img/channel/checkbox_on_off.png) 1px -28px no-repeat;
cursor:pointer;
padding:3px 0px 2px 18px !important;
margin-left:5px;
}
.filtercollection ul.kwList a.off:hover{
background:url(../img/channel/checkbox_on_off.png) 1px -88px no-repeat;
}
.filtercollection ul.kwList a.on{
background:url(../img/channel/checkbox_on_off.png) 1px 2px no-repeat;
padding:3px 0px 2px 18px !important;
margin-left:5px;
}
.filtercollection  ul.kwList a.on:hover{
background:url(../img/channel/checkbox_on_off.png) 1px -58px no-repeat;
}

.filtercollection  ul.kwList{
list-style-type:none;
margin:0;
padding:0;
clear:both;
border-top:none;
}

.filtercollection ul.kwList a.on, 
.filtercollection ul.kwList a.off{
margin-left:0px;
}

.collSelBox.selected,.collSelBox.s,.filterby_block ul li div.filter_text,.filterby_block ul li div.ftl{
background-color:#fff;
}

/********** icons ***********/

a.icon_expand, a.icon_collapse{
display:block;
width:18px;
height:18px;
float:right;
text-indent:-9999px;
}

a.icon_expand{
background:url(../img/channel/expandall.png) transparent no-repeat top left;
height:18px;
margin-top:-11px;
}

a.icon_expand:hover{
background:url(../img/channel/expandall.png) transparent no-repeat left -22px;
cursor:pointer;
}

a.icon_collapse{
background:url(../img/channel/collapseall.png) transparent no-repeat top left;
height:18px;
margin-top:-11px;
}
a.icon_collapse:hover{
background:url(../img/channel/collapseall.png) transparent no-repeat left -22px;
cursor:pointer;
}

/**********  thumblists  **********/

/* viewlist */
.viewlist{
padding:0;
clear:left;
}

/* channel lists */
.viewlist .channels_block{
border-bottom:none;
width:auto;
overflow:auto;
height:auto;
float:none;
margin-bottom:0;
padding:20px 20px 15px;
border-bottom:1px solid #eee;
}

.viewlist .channels_block_detail{
margin-left:90px;
}

.viewlist .channels_block h4{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
font-size:22px;
line-height:1em;
padding-bottom:3px;
float:left;
}

.viewlist .channels_block a.icon_expand,
.viewlist .channels_block a.icon_collapse{
float:left;
}

.viewlist .channels_block h4{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
font-size:22px;
line-height:1em;
padding-bottom:6px;
}

.viewlist .channels_block .favorite{
padding:8px 0 0 0;
float:left;
display:block;
}

.viewlist .channels_block .favorite .txt{
padding:1px 0 0 5px;
}

.viewlist .channels_block .channels_block_detail p{
width:100%;
float:left;
display:block;
}

.viewgrid{
float:left;
margin:20px 0 0;
width: 100%;
}

.viewgrid tr{
border:1px solid #eee;
height:50px;
}

.viewgrid th{
padding:10px;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
background:#EEEEEE;
text-align:left;
color:#999999;
font-size:15px;
white-space:nowrap;
}

.viewgrid th a{
font-size:12px;
color:#2caed3;
padding-right:20px;
padding-top:2px;
font-size:15px;
white-space:nowrap;
}

.playlist_grid th.selectedup a,
.viewgrid th.selectedup a {
  background: transparent url(../img/channel/arrow_up.gif) no-repeat right center;
}

.playlist_grid th.selecteddown a,
.viewgrid th.selecteddown a {
  background: transparent url(../img/channel/arrow_down.gif) no-repeat right center;
}

.viewgrid td{
padding:5px 15px;
text-align:left;
}

.viewgrid .colname{
width:40%;
max-width:475px;
overflow:hidden;
padding-right:10px;
}

/* Grid for playlist manage */
.playlist_grid {
  float: left;
  width: 100%;
}

.playlist_grid .hidden {
  display: none !important;
  visibility: hidden;
}

.playlist_grid tr:not(:last-child) {
  border-bottom: 1px solid #777;
  height: 50px;
}

.playlist_grid .rename_container .rename_form {
  width: 100%;
  display: flex;
}
.playlist_grid .rename_container .rename_textbox {
  margin: auto 0;
  width: calc(100% - 120px);
}
.playlist_grid .rename_container .rename_buttons {
  margin: auto 0;
}
.playlist_grid .rename_container .rename_buttons > a {
  margin-left: 15px;
}
.playlist_grid .delete_container {
  display: flex;
  align-items: center;
}
.playlist_grid .delete_container input {
  padding: 5px;
  min-height: 0;
  border-radius: 3px;
  border: none;
  font-size: inherit;
}
.playlist_grid .delete_container a {
  margin-left: 10px;
}
.playlist_grid .delete_container .btn_cancel {
  color: white;
}
.playlist_grid .delete_container .btn_delete:hover,
.playlist_grid .delete_container .btn_cancel:hover {
  color: #aaa;
}

.playlist_grid th {
  padding: 10px 0px;
  font-family: ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
  border-top: 1px solid #777;
  text-align: left;
  color: #aaa;
  font-size: 15px;
}

.playlist_grid th a {
  font-size: 12px;
  color: #eee;
  padding-right: 20px;
  padding-top: 2px;
  font-size: 15px;
  white-space: nowrap;
}
.playlist_grid .playlist_name_zone {
  height: 100%;
  display: contents;
}
.playlist_grid .playlist_name_zone .playlist_description {
  color: #aaa;
  font-size: 0.9em;
  width: 100%;
}
.playlist_grid .playlist_name_zone .playlist_description,
.playlist_grid .playlist_name_zone .playlist_title {
  display: block;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
  overflow: hidden;
  display: -webkit-box;
  margin-right: 5px;
}
.playlist_grid .playlist_name_zone .playlist_manage {
  display: none;
  pointer-events: none;
  column-gap: 30px;
  height: 30px;
}

.playlist_grid tr:hover .playlist_name_zone .playlist_context_holder {
  display: none;
}

.playlist_grid tr:hover .playlist_name_zone .playlist_manage {
  display: flex;
  pointer-events: auto;
}
.playlist_grid .playlist_name_zone .playlist_manage a img,
.playlist_grid .playlist_name_zone .playlist_manage > input {
  min-height: 0px;
  height: 20px;
  margin: auto 0;
  border-radius: 0;
  vertical-align: middle;
}
.playlist_grid .playlist_name_zone .playlist_manage a img:hover,
.playlist_grid .playlist_name_zone .playlist_manage > input:hover {
  filter: brightness(75%);
}
.playlist_grid .thumbnail_container {
  height: 100%;
  margin: 5px 15px 5px 0px;
  position: relative;
}
.static_playlist_info .thumbnail_container .thumbnail_databox,
.playlist_grid .thumbnail_container .thumbnail_databox {
  color: #edbe31;
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 100%;
  background: rgba(0,0,0,0.8);
  text-align: center;
  display: flex;
  flex-flow: column;
  justify-content: center;
  pointer-events: none;
}
.static_playlist_info .thumbnail_container .thumbnail_databox {
  height: 110.8px;
}
.static_playlist_info .thumbnail_container {
  width: 251px;
  position: relative;
}
.static_playlist_info .thumbnail_container .databox_logo,
.static_playlist_info .thumbnail_container .thumbnail_databox img {
  height: 40px;
}
.playlist_grid .thumbnail_container .databox_logo,
.playlist_grid .thumbnail_container .thumbnail_databox img {
  height: 36px;
}
.playlist_grid .thumbnail_databox.numbered .databox_logo {
  position: relative;
  top: -6px;
}
.playlist_grid .name_col {
  height: 95px;
}
.playlist_grid .thumbnail_col {
  width: 150px;
}
.playlist_grid .thumbnail_col .minivideo__thumb {
  cursor: pointer;
}
.playlist_grid .count_col {
  width: 110px;
}
.playlist_grid .modified_col {
  width: 120px;
}
.playlist_grid .avatar_col {
  width: 50px;
}
.playlist_grid .avatar_col .image_cointainer {
  text-align: center;
  padding-top: 6px;
}
.playlist_grid .type_col {
  width: 70px;
}
.playlist_grid > tbody > tr:not(:first-child):hover {
  background: #5c5b64;
}


.vatInfo {
  font-size: 12px;
  text-align: right;
  display: block;
  float: right;
  padding-right: 30px;
  margin-top: 15px;
  color: #999999;
}

.subsCmdLink{
float:left;
}

.subsCmdLink--small{
font-size:0.9em;
white-space:nowrap;
word-wrap:normal;
}

.subsCmdLink--admin {
background-size: 100px 1735px;
background-image: url(../img/channel/channelPictos.svg?v20);
background-position:-6px -1072px;
width: 24px;
height: 24px;
padding-left: 30px;
white-space: nowrap;
}

.subsCmdLink--admin:hover {
background-position: -40px -1072px;
}

.subscriptions .viewgrid span {
font-size:0.9em;
}

/***************  staticplaylist ***************************/

/* viewlist */
.playlist .viewlist .staticPlaylist{
float:left;
display:block;
width:95%;
padding: 12px 20px;
overflow:auto;
border-bottom: 1px solid #eee;
}

.playlist .staticPlaylist .minivideo{
height:70px;
margin:0;
padding:0;
}

.playlist .staticPlaylist .minivideo span.overlay{
left:0px;
}

.playlist .staticPlaylist .description{
margin-top:10px;
}

.playlist .staticPlaylist .tools{
float:right;
width:17px;
}

.playlist .staticPlaylist .tools a{
padding-bottom:8px;
}

.playlist .staticPlaylist .editfield{
width:450px;
}

.playlist .infos{
padding-left:5px;
float:left;
max-width:450px;
}

.playlist .infos h4 {
overflow: hidden;
line-height: 150%;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
word-wrap: break-word;
}

.playlist .playlistItem{
float: left;
display: block;
width: 100%;
}

.playlist .playlistItem.highlighted{
background-color:#c6c6c6;
}

.playlist .playlistItem .minivideo{
height:51px !important;
width:86px !important;
padding:0 !important;
margin-bottom:1px !important;
}

.playlist .playlistItem .minivideo span.overlay{
height:51px !important;
width:86px !important;
left:0px !important;
}

.playlist .playlistItem .minivideo a:hover span.overlay{
background: url(../img/channel/play.png) transparent no-repeat center center;
background-size:contain;
cursor:pointer !important;
display:block !important;
}

.playlist .playlistItem .minivideo .minivideo_options{
height:47px !important;
width:82px !important;
}

.playlist .playlistItem .tools a {
padding-bottom:1px !important;
}

.playlist .playlistItem .tools{
float:right !important;
width:68px !important;
}

/*************** embded playlists editor **************/

.plPane{
background-color:#eee;
display:block;
padding:20px;
overflow:auto;
margin-top:20px;
}

.plPaneLeft{
display:block;
float:left;
width:350px;
padding-left:3px;
padding-right:34px;
border-right:1px solid #AAAAAA;
}

.plPaneRight{
display:block;
float:right;
width:300px;
padding-left:3px;
padding-right:3px;
}

.plHelp, .plHelpShort, .plHelpLeft{
font-size:11px;
padding-bottom:3px;
color:#787A7A;
display:block;
margin-top:8px;
float:left;
}

.plHelp{
width:100%;
}

.plHelpLeft{
margin-top:1px;
float:left;
padding-right:5px;
}

.plDom{
width:100%;
float:left;
margin-bottom:7px;
}

.plDomSel{
margin-top:6px;
float:left;
}

.plHelpShort{
width:162px;
float:left;
}

.plIntro{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
font-size:12px;
display:block;
color:#787A7A;
padding-bottom:5px;
}

.plTitle{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
font-size:12px;
display:block;
}

.plEditPane{
float:left;
display:block;
width:100%;
}

.plEditPane.selKwPane{
margin:10px 0 5px;
}

.plEditPane .filterPane{
border:none;
width:auto;
padding:0;
}

.plField, .plFieldDesc{
font-size:11px;
padding-bottom:3px;
color:#787A7A;
display:block;
margin-top:8px;
}

.plFieldDesc{
margin-top:0px;
}

.plFieldHalf{
width:140px;
float:left;
}

.plFieldHalf .plField{
width:100%;
}

.plBtn{
width:125px;
min-height:22px;
}

.okPane{
float:right;
display:block;
margin-top:20px;
}

.btnPane{
float:right;
display:block;
margin-bottom:4px;
}

.plDrop{
font-size:10px;
float:left;
display:block;
margin-right:6px;
}

.plEmbed{
font-size:10px;
margin-top:6px;
margin-bottom:5px;
}

.plListPane{
width:100%;
}

.plListContainer{
display:block;
float:left;
width:100%;
padding-top:8px;
padding-bottom:1px;
margin-bottom:15px;
border-bottom:1px solid #eee;
}

.plEmpty{
font-style:italic;
display:block;
float:left;
font-size:1em;
}

.plItemPane{
display:block;
width:100%;
padding:3px 0;
border-top:1px solid #eee;
}

.plItemPane .selected{
color:#F36F0C;
text-decoration:none;
}

.plItemPane a{
color:#2caed3;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
font-size:12px;
margin-top:2px;
}

.embedPane{
width:100%;
}

.plPane input[type=text],
.plPane input[type=email],
.plPane input[type=tel],
.plPane input[type=number]{
width:265px;
max-height:22px;
}

/**********************************************/

.okLink{
padding:1px 0 0 2px;
}

a.titlelink{
text-decoration:none;
color:#2caed3;
font-weight:700;
font-size:12px;
border-bottom:1px dashed #2caed3;
}

a.titlelink:hover{
border-bottom:1px dashed #F36F0C;
color:#F36F0C;
}

.thumbnail_video{
width:120px;
}

.channels{
padding:6px 0;
overflow:hidden;
}

.box .promo{
padding:8px 0;
min-height:100px;
margin: 0 -10px 0 0;
position:relative;
}

.promo .descr{
margin:3px 4px 3px 115px;
position:relative;
}

.promo .clickablezone{
position:absolute;
background-color:transparent;
/*border:1px solid red;*/
}


.channels .descr{
margin:0 0 5px 40px;
}

.promo h4{
padding:3px 0 0;
margin:0;
font-size:16px;
}

.promo h4,
.channels h4{
margin:0;
margin-top:-3px;
}

.promo h4{
font-size:14px;
padding:0;
}

.promo .descr p,
.channels .descr p{
font-size:11px;
line-height:13px;
color:#5c5b64;
margin-top:2px;
}
.promo .descr p{
padding-top:1px;
}

.disabledSubs{
color:#EF8607;
}

.expiredSubs {
padding: 0 5px;
color: white;
background-color: #FF2222;
vertical-align: baseline;
}

.linky{
display:block;
padding:2px 0 0 0;
font-size:11px;
}

.content--mydartfish .search_block {
margin-top: 0;
padding: 0;
border-color: #5c5b64;
}

.search_block .collsearchlink{
margin-top:-10px;
}

.search_block .collsearchlink a{
float:left;
display:block;
margin:0 10px;
padding: 5px 2px 0 2px;
}

.search_block .collsearchlink a.selected {
color:#000;
border-bottom: 4px solid #2caed3;
}

.mb{
padding-bottom:12px;
}

.nopaddingtop{
padding-top:0;
margin-top:-2px;
}
.search_block .nopaddingtop{
margin-top:-15px;
}

.search_block p{
margin:0;
padding:0 0 8px;
}

.nofilter{
position:relative;
color:#999;
}

.pageheader .linkmanage{
float:right;
text-align:center;
min-width: 98px;
margin-right: 2px;
}

.featuredVid{
padding:20px 0 0px 0;
}

.nav_coll{
border:1px solid #000;
font-family:arial,sans-serif;
font-size:10px;
margin-top:2px;
width:236px;
padding:2px;
}

.formSuccess {
background: #eeffee url(../img/channel/pictos/modal/success.png) no-repeat 10px center;
border: 1px solid #bacf66;
margin-bottom: 20px;
padding: 20px 20px 20px 60px;
border-radius: 2px;
color: rgb(51, 51, 51);
word-wrap: break-word;
}

.formError {
background: #ffeeee url(../img/channel/pictos/modal/error.png) no-repeat 10px center;
border: 1px solid Red;
font-size: 14px;
line-height: 1.2em;
margin-bottom: 20px;
padding: 20px 20px 20px 60px;
border-radius: 2px;
color: Red;
word-wrap: break-word;
}

.formInfo {
background: #ffffff url(../img/channel/pictos/modal/info.png) no-repeat 10px center;
border: 1px solid #1589bf;
font-size: 14px;
line-height: 1.2em;
margin-bottom: 20px;
padding: 20px 20px 20px 60px;
border-radius: 2px;
color: rgb(51, 51, 51);
word-wrap: break-word;
}

.notify.top-right {
position:unset;
float:right;
margin:-10px -20px 0 0;
}

.notify.icon {
opacity:1 !important;
}

.formSuccess .icon--close::before {
color:#bacf66 !important;
}
.formError .icon--close::before {
color:Red !important;
}
.formInfo .icon--close::before {
color:#1589bf !important;
}

.organizer .formSuccess,
.organizer .formError,
.organizer .formInfo {
margin:20px 10px 10px 10px;
float:left;
width: calc(100% - 20px);
}

.channelcollections .formSuccess,
.channelcollections .formError,
.channelcollections .formInfo {
margin: 20px 10px 10px 10px;
float: left;
width: calc(100% - 20px);
}

/**********************************************/

*html .minivideo__infos h4,*+html .minivideo__infos h4{
line-height:110%;
}

#logo ul li a:link,#logo ul li a:visited,#bottom a:hover{
text-decoration:underline;
}

#logo ul li.lng,#logo ul li.lng a{
color:#747474;
}

/*Style for edito :to be synchronized with editor*/
.edito h1{
font-size:16px;
margin:8px 0;
padding:0;
}

.edito h2{
font-size:14px;
margin:8px 0;
padding:0;
}

.edito ul{
margin:0;
padding:0  0 8px 13px;
}

.edito ol{
margin:0;
padding:0 0 8px 18px;
}

/**********************************************/

.userform{
padding: 30px 0 50px;
}

.userform:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

.ie .userform{
zoom:1; 
display:block;
}

.userform{
padding-left:20px;
padding-right:20px;
}

.userform .formfield{
float:left;
padding:10px 0 0 0;
width:100%;
}

.userform .formfield.narrow{
padding:0 0 0 0;
}

.userform .formlabel{
float:left;
width:33.33%;
text-align:right;
padding:4px 30px 0 0;
color:#222;
}

.userform .forminput{
float:left;
}

.settings .userform .forminput{
width:66.67%;
}

.userform .formfieldSeparator{
margin-top: 30px;
float: left;
width: 100%;
}

.userform .forminputcustom{
float:left;
padding-top:3px;
width:400px;
}

.userform .forminputcustom.withdesc label {
display:inline-block;
min-width:40px;
}
.ja .userform .forminputcustom.withdesc label,
.ko .userform .forminputcustom.withdesc label {
min-width:60px;
}

.userform .forminputcustom.withdesc span {
font-size: 0.75em;
}
.de .userform .forminputcustom.withdesc span {
font-size: 0.65em;
}

.userform .forminputcustom.mtop{
padding-top:6px;
padding-bottom:10px;
}

.userform .forminputcustom.mbottom{
padding-top:6px;
padding-bottom:30px;
}

.userform .forminput.inputcheckbox{
padding:3px 0 13px 0;
width:400px;
}

.userform .forminput label{
font-size:0.9em;
padding-left:8px;
max-width:350px;
}

.userform input[type="checkbox"]{
float:left;
margin-top:7px;
min-height:10px;
}

.userform input[type="radio"]{
min-height:10px;
}

.userform input[type=text],
.userform input[type=email],
.userform input[type=tel],
.userform input[type=number],
.userform input[type=password],
.userform select{
border:1px solid #ccc;
width:240px;
margin-right:10px;
}

.userform textarea{
width:360px;
min-width:360px;
max-width:360px;
border:1px solid #ccc;
margin-right:10px;
height:65px;
font-family:Arial,Verdana,sans-serif;
}

.userform input[type=submit]{
}

.userform .beauton{
margin-top:10px;
}

.userform .forminput.ohelper{
padding-top:5px;
font-size:14px;
}

.userform .forminput.ohelper a{
float:none;
}

.userform .formhint{
font-size:0.7em;
line-height:normal;
padding-top:8px;
}

.userform .formvalidator{
float:left;
}

.userform .formvalidator .pwstrengthholder {
border: 1px solid #ccc;
width: 215px;
border-radius: 2px;
font-size: 16px;
margin: 5px 0 6px 0;
}

.userform .formvalidator .pwstrength{
width:25%;
height:10px;
background-color:#FF2222;
}

.userform .formvalidator .pwstrengthlabel{
font-size:13px;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.userform .formvalidator .pwmatch {
border: 1px solid #ccc;
border-radius: 2px;
display: none;
padding: 5px;
text-align: center;
width: 110px;
font-size: 16px;
}

.userform .formdesc{
padding:6px 0 10px 0;
height:27px;
}

.userform .userformintro{
padding:0px 20px 10px 20px;
line-height:1.5em;
}

.userform .userformdesc{
padding:40px 20px 0px 20px;
line-height:1.5em;
float:left;
width:100%;
}

.userform .longcomment {
width: 100%;
font-size: 0.9em;
padding: 15px 10px 15px 0;
}

.userform .longcomment input[type="checkbox"]{
margin-top:3px;
}

.userform .longcomment label{
min-height: 22px;
display: inline-block;
width: 90%;
}

.userform .longcomment textarea{
width:100%;
min-height:75px;
margin-top:5px;
}

.userform .pageheader{
float:left;
border-bottom:1px solid #eee;
width:663px;
padding-bottom:10px;
margin:0 0 20px -20px;
background:#fff;
}

.userform .subpaneinfo{
float:left;
width:660px;
}

.hinttip{
display:none;
float:left;
font-size:12px;
position:absolute;
border:1px solid #ccc;
box-shadow:1px 1px 5px 2px #ccc;
background:#fff;
padding:5px 5px 10px 10px;
margin:2px 0 0 0;
width:240px;
z-index:999;
}

.hinttip .arrow{
position:absolute;
left:-10px;
top:4px;
}

.hinttip.div{
font-size:16px;
margin:1px 0;
}

.progressIndicator{
float:left;
padding:10px 0 0 6px;
}

/***********  contact form ************/

.contact .formlabel{
float:left;
width:155px;
text-align:right;
padding:6px 10px 0 0;
}

.contact .forminput{
float:left;
width:462px;
}

.contact select{
width:272px;
padding:6px 6px 7px;
height:33px;
}

.contact .messageField{
height:200px;
width:100%;
resize:none;
}

.contact .formconfirmation{
padding:40px 20px;
}

/************** RETINA **************/

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

.popup .close{
background:url(../img/channel/pictos/closebutton@2x.png) no-repeat 0 0 ;
background-size: 26px 54px;
}

.popup a.close:hover{
background:url(../img/channel/pictos/closebutton@2x.png) no-repeat 0 -28px;
background-size: 26px 54px;
}

.header .center .top a.dartfish {
background:transparent url(../img/platform/logoMobile@2x.png) center center no-repeat;
background-size:144px 12px;
height: 22px;
width:144px;
}
.header .center .top a.dartfish img{
display:none;
}

.collection .colltype.private{
background:transparent url(../img/channel/private@2x.png) no-repeat 2px 0;
background-size:22px 22px;
}

.collection .colltype.limited{
background:transparent url(../img/channel/collectionlimited@2x.png) no-repeat 0 0;
background-size:22px 22px;
}

.collection .colltype.public{
background:transparent url(../img/channel/public@2x.png) no-repeat 1px 0;
background-size:22px 22px;
}

.collection .colltype.business{
background:transparent url(../img/channel/business@2x.png) no-repeat -1px 0;
background-size:22px 22px;
}

} /* end retina */

/* NEW CSS */

.mainmenu .icon::before {
display: none;
}
