/* reset.css */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, address, code, del, dfn, em, img, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body{line-height:1.5;}
table{border-collapse:separate;border-spacing:0;}
caption, th, td{text-align:left;font-weight:normal;}
table, td, th{vertical-align:middle;}
a img{border:none;}
img{border:0;}

/*Fonts*/
@font-face {font-family:'ClearSans-Light';
src:url('webfonts/clearsans/EOT/ClearSans-Light.eot');
src:url('webfonts/clearsans/EOT/ClearSans-Light.eot?#iefix') format('embedded-opentype'),
url('webfonts/clearsans/WOFF/ClearSans-Light.woff') format('woff'),
url('webfonts/clearsans/TTF/ClearSans-Light.ttf') format('truetype'),
url('webfonts/clearsans/SVG/ClearSans-Light.svg#Humanist-Light') format('svg'),
url('webfonts/clearsans/SVG/ClearSans-Light.svgz#Humanist-Light') format('svg');}

@font-face {
font-family:'ClearSans-Roman';
src:url('webfonts/clearsans/EOT/ClearSans-Regular.eot');
src:url('webfonts/clearsans/EOT/ClearSans-Regular.eot?#iefix') format('embedded-opentype'), 
url('webfonts/clearsans/WOFF/ClearSans-Regular.woff') format('woff'), 
url('webfonts/clearsans/TTF/ClearSans-Regular.ttf') format('truetype'), 
url('webfonts/clearsans/SVG/ClearSans-Regular.svg#Humanist-Light') format('svg'), 
url('webfonts/clearsans/SVG/ClearSans-Regular.svgz#Humanist-Light') format('svg');
}

@font-face {font-family:'ClearSans-Medium';
src:url('webfonts/clearsans/EOT/ClearSans-Medium.eot');
src:url('webfonts/clearsans/EOT/ClearSans-Medium.eot?#iefix') format('embedded-opentype'),
url('webfonts/clearsans/WOFF/ClearSans-Medium.woff') format('woff'),
url('webfonts/clearsans/TTF/ClearSans-Medium.ttf') format('truetype'),
url('webfonts/clearsans/SVG/ClearSans-Medium.svg#Humanist-Light') format('svg'),
url('webfonts/clearsans/SVG/ClearSans-Medium.svgz#Humanist-Light') format('svg');}
 
@font-face {font-family:'ClearSans-Bold';
src:url('webfonts/clearsans/EOT/ClearSans-Bold.eot');
src:url('webfonts/clearsans/EOT/ClearSans-Bold.eot?#iefix') format('embedded-opentype'),
url('webfonts/clearsans/WOFF/ClearSans-Bold.woff') format('woff'),
url('webfonts/clearsans/TTF/ClearSans-Bold.ttf') format('truetype'),
url('webfonts/clearsans/SVG/ClearSans-Bold.svg#Humanist-Light') format('svg'),
url('webfonts/clearsans/SVG/ClearSans-Bold.svgz#Humanist-Light') format('svg');}

.ClearSans-Light, .fw-light, .fw-200{ font-family:ClearSans-Light;}
.ClearSans-Roman, .fw-roman, .fw-regular, .fw-300{ font-family:ClearSans-Roman;}
.ClearSans-Medium, .fw-medium, .fw-400, .fw-500 { font-family:ClearSans-Medium;}
.ClearSans-Bold, .fw-bold, .fw-600, .fw-700, .fw-800 { font-family:ClearSans-Bold;}

/* GENERAL */

* {
box-sizing:border-box; 
}

html{
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
overflow-y:scroll;
}

body{
color:#333;
background:#222;
font-size:16px;
line-height:1.5;
font-family:ClearSans-Roman, sans-serif;
/* TEMP, to be removed when working on full responsive version */
min-width:900px;
}

.body--blank {
background:#fff;
}

h1,h2,h3,h4,h5,h6,h7,h8{
font-family:ClearSans-Light, sans-serif;
text-align:left;
}

.title--hero{
font-size:32px;
line-height:1.2;
font-family:ClearSans-Medium, sans-serif;
}

a{
text-decoration:none;
color:#2caed3;
}

a:hover{
text-decoration:none;
color:#000;
}

.clickable {
opacity:0.95;
}
.clickable:hover {
opacity:1;
}

.content--mydartfish--grey a{
color:#ffba00;
}
.content--mydartfish--grey a:hover{
color:#fff;
}

.disc{
border-radius:50%;
}
.rounded{
border-radius:2px;
}

input{
min-height:34px;
border-radius:2px;
}

input[type=checkbox],
input[type=radio] {
min-height:13px;
display:inline-block;
vertical-align:middle;
}

.input--search {
border-top-right-radius:0px;
border-bottom-right-radius:0px;
padding:5px 0 5px 6px;
float:left;
margin-top:0px;
-webkit-appearance:none;
border:1px solid #ccc;
width:162px;
height:30px;
min-height:30px;
}

#drawerSearchBox {
margin-top:4px;
overflow:hidden;
}

#drawerSearchBox .beauton--search {
height:30px;
}

.content--mydartfish .input--search {
background-color:#48474c;
border-color:#777;
color:#eee;
position:relative;
z-index:2;
}
.content--mydartfish .input--search::-webkit-search-cancel-button {
  -webkit-appearance: none;
  background-image: url(../img/channel/pictos/clear_orange.svg);
  background-repeat: no-repeat;
  background-size: contain;
  color: orange;
  content: 'X';
  width: 0.7em;
  height: 0.7em;
  padding-right: 5px;
}

.white-space-normal{
white-space:normal !important;
}

.opacity-100 {
opacity:1 !important;
}

.strong {
font-weight:bold;
}

/* global structure classes */

.tvhome {
background:#000 url(../img/products/logo-my-dartfish-light.svg) 0.5em center no-repeat;
background-size:113px;
height:2.5em;
width:275px;
text-indent:-1000px;
border:none;
display:block;
}

.grid_high {
  min-height: 70vh !important;
}

.grid{
overflow:auto;
clear:both;
}

.grid.grid--max-height {
  max-height: calc(100vh - 540px);
  min-height: 500px;
}

.grid.grid--list {
  display: inline-block;
  margin-top: 5px;
  width: 100%;
}

.grid--inuit {
  overflow: visible;
  letter-spacing: -0.31em;
}

.grid__item{
float:left;
position:relative;
min-height:2px; /*for respecting size with empty content*/
}

.grid--center {
text-align:center;
}
.grid--center .grid__item {
text-align:center;
display:inline-block;
float:none;
}

.grid--inuit .grid__item {
display:inline-block;
float:none;
letter-spacing:normal;
word-spacing:normal;
vertical-align:top;
}

.grid--center .grid__item h4 {
text-align:center;
margin-top:15px;
font-size:80%;
font-weight:bold;
}

.grid--center .grid__item .smalllink {
font-size:70%;
}

.smalllink.orange > a {
  color: #ffba00;
}

.no-radius{
  border-radius: 0 !important;
}

.df-academy {
  width: 100%;
  background: #222 !important;
  height: fit-content;
}

.df-academy > img {
  width: 100%;
  height: auto;
  display: block;
}

.learn-more{
  max-width: 100%;
}

.grid__item.multiline span,
.grid__item.multiline a.fullwidth {
  width: 100%;
  float: left;
}

.grid__item .hint{
font-size:0.80em;
padding:10px 0px 5px;
}

.grid__item--minivideo{ width:50%;}

@media (min-width:480px)  {  .grid__item--minivideo{ width:33.333%;  }}
@media (min-width:960px)  {  .grid__item--minivideo{ width:25%;  }}

.one-whole    { width:100%; }
.one-half     { width:50%; }
.one-third    { width:33.333%;}
.two-thirds   { width:66.666%; }
.one-quarter     { width:25%; }
.one-fifth     { width:20%; }
.three-eighths     { width:37.5%; }
.five-eighths     { width:62.5%; }

.portable--one-whole,
.portable--one-half,
.portable--one-third,
.portable--two-thirds,
.portable--one-quarter,
.portable--one-fifth     { width:100%; }
@media (min-width:600px)  {
.portable--one-whole    { width:100%; }
.portable--one-half     { width:50%; }
.portable--one-third    { width:33.333%;}
.portable--two-thirds   { width:66.666%; }
.portable--one-quarter     { width:25%; }
.portable--one-fifth     { width:25%; }
}

@media (min-width:960px)  {
.desk--one-whole    { width:100%; }
.desk--one-half     { width:50%; }
.desk--one-third    { width:33.333%;}
.desk--two-thirds   { width:66.666%; }
.desk--one-quarter  { width:25%; }
.desk--one-fifth    { width:20%; }
.desk--three-eighths     { width:37.5%; }
.desk--five-eighths     { width:62.5%; }

.desk-wide--one-whole    { width:100%; }
.desk-wide--one-half     { width:50%; }
.desk-wide--one-third    { width:33.333%;}
.desk-wide--two-thirds   { width:66.666%; }
.desk-wide--one-quarter  { width:25%; }
.desk-wide--one-fifth   { width:20%; }
}
.grid--padding{
padding:5px;
}

.grid--padding .grid__item--minivideo,
.grid--padding .one-whole   ,
.grid--padding .one-half     ,
.grid--padding .one-third   ,
.grid--padding .two-thirds  ,
.grid--padding .one-quarter  ,
.grid--padding .one-fifth    ,
.grid--padding .portable--one-whole   ,
.grid--padding .portable--one-half    ,
.grid--padding .portable--one-third   ,
.grid--padding .portable--two-thirds  ,
.grid--padding .portable--one-quarter ,
.grid--padding .portable--one-fifth   ,
.grid--padding .desk--one-whole,
.grid--padding .desk--one-half ,
.grid--padding .desk--one-third  ,
.grid--padding .desk--two-thirds ,
.grid--padding .desk--one-quarter, 
.grid--padding .desk--one-fifth ,
.grid--padding .desk-wide--one-whole  ,
.grid--padding .desk-wide--one-half   ,
.grid--padding .desk-wide--one-third  ,
.grid--padding .desk-wide--two-thirds ,
.grid--padding .desk-wide--one-quarter,
.grid--padding .desk-wide--one-fifth  {
padding:0 5px 25px;
}

.soft{        padding:1em;}
.soft--top{   padding-top:1em;}
.soft--right{ padding-right:1em;}
.soft--bottom{padding-bottom:1em;}
.soft--left{  padding-left:1em;}
.soft--ends{  padding-top:1em; padding-bottom:1em;}
.soft--sides{ padding-right:1em; padding-left:1em;}


.top-right{
position:absolute;
top:10px;
right:0px;
}

.pull-right{
float:right !important;
}
.pull-left{
float:left !important;
}
.pull-right-abs{
position:absolute;
right:10px;
}

.is-hidden,
.beauton.is-hidden,
.button.is-hidden {
  display:none;
}

/* helpers */

.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

.ie .clearfix{
zoom:1;  
display:block;
}

.clearfix2 {
overflow:auto;
width:100%;
}

.center-v{
position:relative;
top:50%;
-webkit-transform:translateY(-50%);
-moz-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform:translateY(-50%);
}

.center-h{
position:relative;
left:50%;
-webkit-transform:translateX(-50%);
-moz-transform:translateX(-50%);
-ms-transform:translateX(-50%);
transform:translateX(-50%);
}

.center-hv,
.center-vh,
.center-all{
position:relative;
left:50%;
top:50%;
-webkit-transform:translateX(-50%) translateY(-50%);
-moz-transform:translateX(-50%) translateY(-50%);
-ms-transform:translateX(-50%) translateY(-50%);
transform:translateX(-50%) translateY(-50%);
text-align:center;
}




@media (min-width:960px) {

.border-right {
border-right:1px solid #ccc;
}
}
.font-size-bigger{
font-size:1.2em;
}
.font-size-smaller{
font-size:0.9em;
}

.fs-12{
font-size:12px;
line-height:1.4;
}
.fs-13{
font-size:13px;
line-height:1.4;
}
.fs-14{
font-size:14px;
line-height:1.4;
}

.fs-15{
font-size:15px;
line-height:1.4;
}

.fs-16{
font-size:16px;
line-height:1.4;
}


/* global styling classes */

.red {
color:#d93f38;
}

.warning {
color:#d93f38;
font-size:14px;
margin-top:-5px;
}
.fr .warning,
.it .warning{
margin-top:-15px;
}
.zh .warning{
margin-top:6px;
}

.box {
background:#fff;
}

.box--dark,
.content .colleft .box--dark {
background:#222 !important;
color:#fff;
border-top:4px solid #ffba00 !important;
float:none !important;
margin-bottom:0px !important;
}

.box--darkest,
.content .colleft .box--darkest {
background:#222 !important;
color:#fff;
border-top:4px solid #ffba00 !important;
float:none !important;
margin-bottom:0px !important;
}

.box--darkest h1 {
color:#ffba00;
font-family:ClearSans-Roman, sans-serif;
}

.box--darkest a {
color:#fff;
}

.box--darkest a:hover {
color:#ccc;
}

.box--dark a:not(.beauton){
color:#ffba00;
display:inline-block; 

}

.box__dark-header {
background:#222;
border-bottom:4px solid #ffba00;
padding:15px;
}

.box__dark-header h4 {
color:#eeeeee;
font-size:16px;
line-height:20px;
font-family:ClearSans-Medium,Arial,Verdana,sans-serif;
}

.box__dark-header h4 span {
display:block;
margin:0;
color:#ffba00;
font-size:22px;
line-height:1;
font-family:ClearSans-Bold,Arial,Verdana,sans-serif; 
}

.box__content {
padding:15px;
}


.noborder,
.no-border {
border-width:0 !important;
}

.lighter{
opacity:0.5;
}

.light-bg{
background:#eee !important;
overflow:auto;
}

.card{
display:block;
background-color:#fff;
text-align:left;
-webkit-border-radius:2px;
border-radius:2px;
-webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,0.26);
box-shadow:0 3px 5px 0 rgba(0,0,0,0.26);
border-top:1px solid rgba(0,0,0,0.1);
margin:0 0 2em;
overflow:auto;
color:#222;
}

.card:last-of-type{ 
margin:0;
}

.card__row{
padding:1.5em 1.5em;
border-top:1px solid #eee;
border-bottom:1px solid #fff;
}

.card__row.clickable{
cursor:pointer;
}

.card__row.clickable:hover{
background-color:rgba(0,0,0,0.1);
border-bottom:1px solid transparent;
}

.card:first-child{
margin-top:1em;
}

.card__header{
text-align:left;
font-size:22px;
padding:1em;
display:block;
line-height:1;
font-family:ClearSans-Bold,Arial,Verdana,sans-serif;
color:#48474c;
}

.column-center{
width:100%;
margin:0 auto;
text-align:center;
}

.column-tighter{
max-width:420px;
}

.center-text,
.text-center{
text-align:center;
}

.mobile-only {
display:none;
}

@media (max-width:960px) {
.center-mobileonly{
text-align:center;
}
.mobile-only {
display:block;
}
}

/* BUTTONS */

.beauton,
.button {
display:inline-block;
padding:5px 12px 7px;
color:#fff !important;
background:#2caed3;
border:none;
position:relative;
cursor:pointer;
white-space:nowrap;
}
.content--mydartfish--grey .beauton{
background-color:#ffba00;
}

.beauton.kw_s, .kw_s .button{
background:#FDB72A;
}

.button--warning,
.beauton--warning{
background-color:#cc3300 !important;
white-space:normal;
}

.beauton:hover{
background-color:#000;
color:#fff;
}
.content--mydartfish--grey .beauton:hover{
background-color:#ffdd33;
}

.beauton--disabled,
.beauton--disabled:hover{
color:#aaa;
background:#555;
cursor:default;
}

.beauton--small{
padding:2px 8px;
border-radius:2px;
}
.beauton--medium{
padding:0.5em 1.2em 0.6em;
font-size:1.1em;
}

.beauton--big,
.button--big{
padding:10px 20px !important;
border-radius:2px;
font-size:18px;
margin-top:10px;
margin-bottom:5px;
}

.beauton-nobg{
background:none !important;
color:#2caed3 !important;
padding:7px 12px 7px 0;
}
.content--mydartfish--grey .beauton-nobg{
background:none !important;
color:#ccc !important;
}

.beauton-nobg:hover{
background:none !important;
color:#000 !important;
}
.content--mydartfish--grey .beauton-nobg:hover{
background:none !important;
color:#fff !important;
}

.beauton--icon{
padding-left:45px !important;
}

.beauton--icon-nobg{
padding:6px 20px 6px 32px;
font-size:16px;
background:none !important;
margin:0;
color:#2caed3;
}

.matchDescPane .beauton--icon-nobg {
padding:15px 20px;
}

.beauton--icon-nobg:hover{
background:none !important;
color:#2caed3;
}

.beauton--icon-only{
background-color:#fff;
color:#fff;
margin-left:10px;
height:40px;
min-width:40px;
display:inline-block;
border-radius:2px;
line-height:31px;
color:#2caed3;
}
.beauton--icon-only:hover{
background-color:#fff;
}
.content--mydartfish--grey .beauton--icon-only{
background-color:transparent !important;
border:none;
margin-left:0;
}
.beauton--icon-only.transparent {
background-color:transparent !important;
}

.beauton--icon-text{
padding-left:45px;
}

.beauton--icon__inner-link{
display:inline-block;
margin:2px 6px 2px 45px;
}

.beauton--dartfish,
.button--dartfish {
color:#222 !important;
background:#ffba00;
border-radius:2px;
}
.beauton--dartfish:hover,
.button--dartfish:hover{
color:#222;
background:#ffdd33;
}

.beauton--highlight,
.button--highlight{
background:#2caed3;
color:#fff;
}
.beauton--highlight:hover,
.button--highlight:hover{
background:#222;
color:#fff;
}

.settings .beauton, .settings .beauton--highlight{
color:#222;
background:#ffba00;
font-size:16px;
padding:0.7em 1em 0.7em;
border-radius:2px;
}
.settings .beauton:hover,
.settings .beauton--highlight:hover{
color:#222;
background:#ffdd33;
}

.beauton--100,
.button--100{
width:100% !important;
text-align:center;
}

.topmenu .beauton--highlight,
.content--mydartfish.content--mydartfish--grey .beauton--highlight {
color:#222;
background:#ffba00;
white-space:normal;
color:#222 !important;
}
.topmenu .beauton--highlight:hover,
.content--mydartfish.content--mydartfish--grey .beauton--highlight:hover{
color:#222;
background:#ffdd33;
}

a.facebookbutton{
background:#445d92;
text-align:center;
border:1px solid #445d92;
color:#fff !important;
border-radius:2px;
display:block;
font-style:normal! important;
position:relative;
display:inline-block !important;
}

a.facebookbutton > span::before {
    content: "";
    background: transparent url(../img/platform/facebook-login2.png) left bottom repeat-x;
    background-size: 100%;
    width: 27px;
    height: 27px;
    position: relative;
    z-index: 2;
    display: block;
    top: Calc((100% - 27px)/2);
    right: 0px;
}

a.facebookbutton > span,
a.applebutton > span {
  display: flex;
  justify-content: center;
  column-gap: 5px;
}

a.applebutton{
background:#000000;
text-align:center;
border:1px solid #000000;
color:#fff !important;
border-radius:2px;
display:block;
font-style:normal! important;
position:relative;
display:inline-block !important;
}

a.applebutton:hover {
  background: #555;
}

a.applebutton > span::before {
  content: "";
  background: transparent url(../img/platform/apple-login.png) left top repeat-x;
  background-size: 100%;
  width: 27px;
  height: 27px;
  position: relative;
  z-index: 2;
  display: block;
  bottom: 1px;
  right: 0px;
  top: Calc((100% - 27px)/2);
}

.spacer {
  height: 20px;
}
.noscroll {
 position: fixed;
 overflow-y: scroll;
 width: 100%;
}


.spacer.password-space {
  height: 90px;
}

.NewsLetter {
  text-align: justify;
  margin-left: 10px;
  flex: 1;
}

.forminput.NewsLetter {
    display: flex;
    margin: 0;
}

.forminput.NewsLetter > input {
    margin: 6px 0 0 0;
    height: 1em;
/*    min-width: 13px;*/
}

.switch_login {
    text-align: left;
}

.switch_login > a {
    text-decoration: underline;
}

.forminput.terms_of_services {
    text-align: justify;
}

.beauton--mail {
padding:5px 15px 6px 28px;
background-image:url(../img/channel/pictos/contact.png);
background-size:15px;
background-repeat:no-repeat;
background-position:6px center;
margin-bottom:5px;
}

.formfield.connection {
    padding: 20px 0px;
}

/* TEMP: icons for player: use temporarly blue icons  */
.beauton--highlight{
color:#fff;
background:#2caed3;
}
.beauton--highlight:hover{
color:#fff;
background:#222;
}

#recentSearch {
background:#eee;
border:1px solid #bbb;
border-top:none;
position:absolute;
z-index:3;
width:201px;
max-height:350px;
overflow-y:auto;
overflow-x:hidden;
display:none;
margin-top:30px;
font-size:12px;
}

.content--mydartfish #recentSearch {
background-color:#48474c;
border-color:#777;
width:121px;
}


#recentSearch a {
float:left;
display:block;
width:100%;
border-bottom:1px solid #eee;
height:28px;
padding:3px 5px 0px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

#recentSearch a:hover {
cursor:pointer;
}

.beauton--search{
margin-left:0;
background-color:#eee;
border:1px solid #ccc;
border-top-right-radius:2px;
border-bottom-right-radius:2px;
border-left:none;
text-indent:-20000px;
min-height:30px;
min-width:39px;
padding:4px 10px;
float:left;
}

.content--mydartfish .beauton--search{
background-color:#6b6a74;
border-color:#777;
}

.beauton--search:hover, .beauton--share:hover{
background-color:#ddd;
}
.content--mydartfish .beauton--search:hover{
background-color:#5c5b64;
background-position:-50px -481px;
}

.beauton--search.icon::before {
position:absolute;
height:24px;
left:50%;
-webkit-transform:translateX(-50%) translateY(-50%) ;
-moz-transform:translateX(-50%) translateY(-50%) ;
-ms-transform:translateX(-50%) translateY(-50%) ;
transform:translateX(-50%) translateY(-50%) ;
top:50%;
width:25px;
}

.beauton-wrapper{
display:inline-block;
}

.beauton--filter {
    height: auto !important;
    min-height: 42px;
    padding: 10px 4px 10px 45px !important;
    margin: 0 0 0 0px;
    display: block !important;
    border-radius: 2px;
    border-left: solid 1px #ccc;
}
.beauton--filter::before {
margin-top:-2px ;
}
.beauton--filter--no-left-border{
margin:0;
border-top-left-radius:0;
border-bottom-left-radius:0;
}
.beauton--filter--no-right-border {
    margin: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.beauton--share{
background-color:#eee;
border:1px solid #ccc;
border-radius:2px;
height:40px;
width:40px;
cursor:pointer;
white-space:nowrap;
margin:6px 0 0 9px;
padding:0;
}

.content--mydartfish .beauton--share {
border:1px solid #777;
background-color:#6b6a74;
margin:19px 0 0 10px;
}

.content--mydartfish .beauton--share:hover {
background-color:#5c5b64;
}

.beauton--share::before {
height:40px !important;
width:40px !important;
padding:0px;
top:-4px !important;
left:-5px !important;
}

.typePane{
float:right;
margin-left:10px;
}

.typePane .itemtype{
color:#777;
font-size:16px;
float:left;
display:block;
background:#eee;
position:relative;
border:1px solid #ccc;
padding:8px 18px 0px;
height:42px;
}

.typePane .itemtype:hover {
color:#222;
cursor:pointer;
}

.typePane .itemtype.selected{
color:#222;
cursor:default;
}

.typePane .itemtype.itemtype__videos {
border-top-left-radius:2px;
border-bottom-left-radius:2px;
}
.typePane .itemtype.itemtype__videos.selected {
background:#E0E9EC;
}

.typePane .itemtype.itemtype__events {
border-left:none;
border-right:none;
}
.typePane .itemtype.itemtype__events.selected {
background:#F0E5CE;
}

.typePane .icon--small::before {
position:absolute;
left:0px;
top:3px;
width:40px;
height:40px;
}

.button-store--win {
  display: block;
  background-size: 130px !important;
  background: transparent url(../img/apps/GetIt_Windows10_11.svg) 0px 0px no-repeat;
}

.de .button-store--win {
width:180px;
}

.button-store--win:hover {
color:white;
}


.button-store {
  width: 130px;
  height: 40px;
  display: inline-block;
  border: none;
  opacity: 0.8;
  text-indent: -2000px;
  overflow: hidden;
  -webkit-transition: opacity 250ms ease;
  -moz-transition: opacity 250ms ease;
  -o-transition: opacity 250ms ease;
  transition: opacity 250ms ease;
  margin-right: 8px;
}

.button-store--apple {
 background:transparent url(../img/apps/Download_AppStore.svg) 0 0px no-repeat;
 background-size:130px;
}
.button-store--android {
  background: transparent url(../img/apps/GetIt_GooglePlay.svg) 0 0px no-repeat;
  background-size: 130px;
}


.button-store:hover {
opacity:1;
}

/* BLUE ICONS */
.icon::before,
.beauton--icon::before {
position:relative;
content:" ";
display:block;
z-index:1;
width:inherit;
height:inherit;
background-size:150px 2600px;
background-image:url(../img/channel/channelPictos.svg?v21);
}

/* yellow icons:*/
.content--mydartfish .icon::before,
.content--mydartfish .beauton--icon::before {
  background-image:url(../img/channel/channelPictos-mydartfish.svg?v6);
}
/* TEMP:icons for player:use temporarly blue icons  */
.content--mydartfish .matchPane .icon::before,
.content--mydartfish .matchPane .beauton--icon::before {
background-image:url(../img/channel/channelPictos.svg?v21);
}

.content--mydartfish .icon{
opacity:0.75;
}
.content--mydartfish .icon:hover{
opacity:1;
}

.icon--disabled {
-webkit-filter:grayscale(1);
filter:grayscale(1);
opacity:0.4;
cursor:default !important;
pointer-events:none !important;
}

.content--mydartfish .icon--disabled{
opacity:0.30 !important;
cursor:default !important;
}

.beauton--icon::before,
.beauton--icon-nobg::before{
content:""; 
position:absolute;
width:45px;
height:45px;
left:1px;
top:6px;
}
.beauton--icon-only::before{
content:"";
position:absolute;
width:45px;
height:45px;
left:-3px;
top:-3px;
}

.icon--blockleft{
float:left;
width:30px;
height:44px;
}

.icon--inline{
display:inline-block;
height:50px;
padding:12px 12px 8px 45px;
position:relative;
}

.icon--inline.icon--small{
height:45px;
padding:0px 10px 0px 25px;
}

.icon--inline.icon--mini{
height:25px;
padding:0px 6px 0px 25px;
}

.icon--inline::before{
position:absolute;
height:49px;
width:49px;
left:0;
top:0;
}

.icon--inline.selected {
color:#000;
}

.icon--inline:hover {
cursor:pointer;
}

.icon--inline.icon--highlight {
border:1px solid #2caed3;
}

.icon--inline.icon--highlight:hover {
border-color:#000;
}

.app-icon--small {
height:75px;
}

.app-icon--middle {
height:100px;
}

.app-icon--big {
height:150px;
}

.icon--small::before{
width:45px;
height:45px;
background-size:120px 2080px;
}

.icon--mini::before{
width:25px;
height:25px;
background-size:75px 1300px;
}

.icon--ilist::before {
width:20px;
height:20px;
background-size:100px 1733px;
}

.icon--mainmenu::before{
margin:0 auto;
height:42px;
width:50px;
}

.icon--topmenu::before{
position:absolute;
left:0px;
top:4px;
}
.icon--manageplaylists::before {
  background-image: url(../img/playlists/icon-manage-playlist.svg);
  background-repeat: no-repeat;
  z-index: 0;
}

.topmenu__drawer--playlist .icon--manageplaylists::before {
  height: 35px;
  left: 2px;
  top: calc((100% - 35px) / 2);
  background-size: contain;
}

.icon--edit{
position:relative;
height:32px;
width:77px;
}
.icon--edit::before{
height:30px;
width:30px;
}

.nokeyword{
display:block;
float:left;
margin:4px 0;
}

.icon--home::before{                         background-position:0 0; }
.icon--keyword::before{                      background-position:0 -50px; }
.icon--collections::before{                  background-position:0 -100px; }
.icon--explore::before{                      background-position:0 -150px; }
.icon--videos::before{                       background-position:0 -150px; }
.icon--playlists::before{                    background-position:0 -200px; }
.icon--subscriptions::before{                background-position:0 -300px; }
.icon--favoritevideo::before{                background-position:0 -250px; }
.icon--embedplaylists::before{               background-position:0 -350px; }
.icon--tv::before{                           background-position:-105px -802px; background-size:150px 2600px; z-index:0; } 
.icon--admin::before{                        background-position:0 -1277px; }
.icon--manage::before {                      background-position:3px -1600px;}       
.icon--search::before {                      background-position:-18px -495px; background-size:180px 3120px;}
.content--mydartfish .icon--search::before { background-position:3px -482px; background-size:180px 3120px;}
.icon--backlink::before{                     background-position:-10px -1803px;}
.icon--premium::before{                      background-position:-153px -1854px; background-size:150px 2600px;}
.icon--link::before{                         background-position:0 -2052px; }
.icon--delete::before{                       background-position:0 -1349px; }
.icon--thumbnail::before {                   background-position:0 -1046px;}
.icon--movecoll::before{                     background-position:0 -97px; }
.icon--assignkw::before{                     background-position:3px -48px; }
.icon--removefav::before{                    background-position:0 -1399px; }
.content--mydartfish .icon--removefav::before{ background-position:-50px -1399px; }
.icon--add-to-headlines::before{             background-position:0 -900px; }
.icon--addvideo::before {                    background-position:0 -998px;}
.icon--filter::before{                       background-position:0 -1900px; }
.icon--filter-negative::before{              background-position:-50px -1900px; }
.icon--edit::before{                         background-position:0 -1100px; }
.content--mydartfish.content--mydartfish--grey .icon--edit::before{ background-position:-50px -1100px; }
.icon--add-to-fav::before{                   background-position:0px -1201px;}
.icon--add-to-fav.selected::before{          background-position:-98px -1401px;}
.icon--add-to-fav.selected                  {color:#2aadd2;}
.icon--add-to-fav.selected:hover            {color:#000;}
.icon--download::before{                     background-position:0px -1251px;}
.icon--print::before{                        background-position:0px -1501px;}
.icon--attach::before{                       background-position:0px -1550px;}
.icon--csv::before{                          background-position:0px -1944px;}
.icon--help::before{                         background-position:0px -2000px;}
.icon--share-link::before{                   background-position:0px -2051px; }
.content--mydartfish .channelheader .icon--share-link::before { background-image:url(../img/channel/channelPictos-mydartfish.svg?v6); background-position:0px -2006px; }
.content--mydartfish .icon--share-link::before {  background-image:url(../img/channel/channelPictos.svg?v21);background-position:0px -2102px; }
.icon--report::before{                       background-position:-2px -2149px; }
.icon--create_splist::before{                background-size: 86px 40px; width:43px; height:40px; background-image: url(../img/channel/create_smart_playlist.svg?v2); background-position:40px 0px; top:4px;}
   
.selected .icon--home::before{                background-position:-50px 0; }
.selected .icon--keyword::before{             background-position:-50px -50px; }  
.selected .icon--collections::before{         background-position:-50px -100px; }
.selected .icon--explore::before{             background-position:-50px -150px; }
.selected .icon--videos::before{              background-position:-50px -150px; }  
.selected .icon--playlists::before{           background-position:-50px -200px; }
.selected .icon--subscriptions::before{       background-position:-50px -300px; }
.selected .icon--favoritevideo::before{       background-position:-50px -250px; }
.selected .icon--embedplaylists::before{      background-position:-50px -350px; }
.selected .icon--admin::before{               background-position:-50px -1277px; }
.selected.icon--add-to-headlines::before,.selected.icon--add-to-headlines:hover::before{ background-position:-100px -900px; cursor:default; }
.selected.icon--print::before{                background-position:-50px -1501px;}
.selected.icon--attach::before{               background-position:-50px -1550px;}
.selected.icon--csv::before{                  background-position:-50px -1944px;}
.selected.icon--report::before{               background-position:-50px -2149px; }
     
.icon--home:hover::before{                   background-position:-50px 0; }
.icon--keyword:hover::before{                background-position:-50px -50px; }
.icon--collections:hover::before{            background-position:-50px -100px; }
.icon--explore:hover::before{                background-position:-50px -150px; }
.icon--videos:hover::before{                 background-position:-50px -150px; }
.icon--playlists:hover::before{              background-position:-50px -200px; }
.icon--subscriptions:hover::before{          background-position:-50px -300px; }
.icon--favoritevideo:hover::before{          background-position:-50px -250px; }
.icon--embedplaylists:hover::before{         background-position:-50px -350px; } 
.icon--delete:hover::before{                 background-position:-50px -1349px; }
.icon--thumbnail:hover::before {             background-position:-50px -1046px;}
.icon--movecoll:hover::before{               background-position:-50px -97px; }
.icon--assignkw:hover::before{               background-position:-47px -48px; }
.icon--removefav:hover::before{              background-position:-50px -1399px; }
.icon--link:hover::before{                   background-position:-50px -2052px; }
.icon--add-to-headlines:hover::before{       background-position:-50px -900px; }
.icon--addvideo:hover::before{               background-position:-50px -998px;}
.icon--admin:hover::before{                  background-position:-50px -1277px; }
.icon--manage:hover::before{                 background-position:-47px -1600px;} 
.icon--search:hover::before{                 background-position:-78px -495px; background-size:180px 3120px; }
.content--mydartfish .icon--search:hover::before { background-position:-117px -482px; }
.content--mydartfish .icon--search:hover::before { background-position:-117px -482px; }
.icon--backlink:hover::before{               background-position:-60px -1803px;}
.icon--add-to-fav:hover::before{             background-position:-50px -1201px;}
.icon--add-to-fav.selected:hover::before{    background-position:-50px -1401px;}
.icon--download:hover::before{               background-position:-50px -1251px;}
.icon--print:hover::before{                  background-position:-50px -1501px;}
.icon--attach:hover::before{                 background-position:-50px -1550px;}
.icon--csv:hover::before{                    background-position:-50px -1944px;}
.icon--share-link:hover::before{             background-position:-50px -2051px;}
.content--mydartfish .channelheader .icon--share-link:hover::before {background-image:url(../img/channel/channelPictos-mydartfish.svg?v6);background-position:-50px -2006px;}
.content--mydartfish .icon--share-link:hover::before { background-image:url(../img/channel/channelPictos.svg?v21);background-position:-50px -2102px;}
.icon--report:hover::before{                 background-position:-50px -2149px;}
.icon--create_splist:hover::before{          background-size: 86px 40px; width:43px; height:40px; background-image: url(../img/channel/create_smart_playlist.svg?v2); background-position:0px 0px; top:4px;}

/* assign keyword button in keyword list control */
.matchKw .icon--assignkw{ height:33px; }
.matchKw .icon--assignkw::before{       background-position: 3px -58px; }
.matchKw .icon--assignkw:hover::before{ background-position:-47px -58px; }

#menu-mobile .mainmenu .icon--collections::before{  background-position:0 -75px;}
#menu-mobile .mainmenu .icon--home::before{  background-position:0 5px; }
#menu-mobile .mainmenu .icon--keyword::before{  background-position:0 -36px; }
#menu-mobile .mainmenu .icon--videos::before{       background-position:0 -115px; }
#menu-mobile .mainmenu .icon--shop::before{       background-position:0 -235px; }
#menu-mobile .mainmenu .icon--search::before{         background-position:-12px -482px; background-size:180px 3120px;}
#menu-mobile .mainmenu .icon--admin:hover::before{                  background-position:0px -1277px; }
#menu-mobile .mainmenu .icon--playlists::before{    background-position:0 -275px; }
#menu-mobile .icon--premium::before{         background-position:-15px -1423px; background-size:150px 2000px;}

#menu-mobile .mainmenu .icon--selected.collections::before{ background-position:-80px -75px;}
#menu-mobile .mainmenu .icon--selected.home::before{        background-position:-80px 5px; }
#menu-mobile .mainmenu .icon--selected.keyword::before{     background-position:-80px -36px; }
#menu-mobile .mainmenu .icon--selected.videos::before{      background-position:-80px -115px; }
#menu-mobile .mainmenu .icon--selected.events::before{      background-position:-80px -275px; }
#menu-mobile .mainmenu .icon--selected.search::before{      background-position:10px -468px; background-size:180px 3120px;}
#menu-mobile .mainmenu .icon--selected.playlists::before{   background-position:-80px -275px; }

/* player */
.icon--mini.icon--print::before{           background-position:2px -751px; }
.icon--mini.icon--reload::before{          background-position:2px -1194px; }
.icon--mini.icon--fullscreen::before{      background-position:2px -1172px; }
.icon--mini.icon--delete::before{          background-position:4px -676px; }
.icon--mini.icon--change::before{          background-position:6px -550px; }
.icon--mini.icon--report::before {         background-position:2px -1076px;}
.icon--mini.icon--download::before {       background-position:-45px -621px;}
.icon--small.icon--collections::before{    background-position:-80px -80px; }
.icon--small.icon--videos::before{         background-position:-80px -120px; }
.icon--small.icon--playlists::before{      background-position:-80px -160px; }
.icon--small.icon--subscriptions::before{  background-position:-80px -239px; }
.icon--small.icon--favoritevideo::before{  background-position:-80px -200px; }
.icon--small.icon--userlogout::before{     background-position:-76px -1358px; }
.icon--small.icon--embedplaylists::before{ background-position:-80px -280px; }
.icon--small.icon--usersettings::before{   background-position:-80px -360px; }
.icon--small.icon--useradmin::before{      background-position:-80px -360px; }
.icon--small.icon--admin::before{          background-position:-78px -1278px; height:35px; }
.icon--small.icon--edit::before{           background-position:0 -880px; }
.icon--small.icon--help::before{           background-position:-80px -1600px; }
.content--mydartfish.content--mydartfish--grey .icon--small.icon--edit::before{ background-position:-40px -880px; }

.icon--mini.icon--print:hover::before{      background-position:-23px -751px; }
.icon--mini.icon--reload:hover::before{     background-position:-23px -1194px; }
.icon--mini.icon--fullscreen:hover::before{ background-position:-23px -1172px; }
.icon--mini.icon--delete:hover::before{     background-position:-21px -676px; }
.icon--mini.icon--change:hover::before{     background-position:-19px -550px; }
.icon--mini.icon--report:hover::before{     background-position:53px -1076px;}

/* collection subscriber list */
.icon--small.icon--delete::before{       background-position:5px 997px; }
.icon--small.icon--delete:hover::before{ background-position:85px 997px; }

.icon--ilist--delete::before {background-position:-6px -908px;}
.icon--ilist--delete:hover::before {background-position:-40px -908px;}
.icon--ilist--movecoll::before {background-position:-8px -74px;}
.icon--ilist--movecoll:hover::before {background-position:-41px -74px;}
.icon--ilist--assignkw::before {background-position:-5px -42px;}
.icon--ilist--assignkw:hover::before {background-position:-38px -42px;}
.icon--ilist--removefav::before { background-size:150px 2600px; background-position:-60px -1000px; margin:0 3px 3px 0; }

.icon--kw-manager-negative::before {
  background: url('../img/channel/KeywordManager.svg') 0 0 no-repeat;
  background-size: 27px;
  background-position: center 10px;
}

.icon--close::before,
#toggleSearchBox-mobile.isopen::before {
  content: "\2715";
  font-size: 24px;
  font-weight: bold;
  background-image: none;
  text-indent: 0;
  text-align: center;
  line-height: 18px;
  font-family: ClearSans-Bold,Arial,Verdana,sans-serif;
  color: #2caed3;
  cursor: pointer;
}

.icon--close:hover::before,
#toggleSearchBox-mobile.isopen:hover::before {
color:#222;
}

.icon--close.kw-manager-close::before {
  color: black;
  right: 38px !important;
  top: 8px;
}

.icon--close.kw-manager-close:hover::before {
  color: gray;
}
.icon--close.kw-filter-close::before {
  color: black;
  right: 19px !important;
  top: 8px;
}

.icon--close.kw-filter-close:hover::before {
  color: gray;
}

.icon--close::before {
color:#2caed3;
background-image:none !important;
right:10px;
}

.icon--close.disabled::before {
color:#EEE;
}
.icon--close.disabled:hover::before {
cursor:default;
}

.content--mydartfish.content--mydartfish--grey .icon--close::before,
.content--mydartfish #toggleSearchBox-mobile.isopen::before{
color:white;
background-image:none;
}

.icon--my{
display:inline-block; 
width:18px;
height:18px;
background-color:rgba(0,0,0,0.3);
background-position:1px 2px;
background-repeat:no-repeat;
border-radius:50%;
background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiIFs8IUVOVElUWSBuc19mbG93cyAiaHR0cDovL25zLmFkb2JlLmNvbS9GbG93cy8xLjAvIj5dPjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxuczphPSJodHRwOi8vbnMuYWRvYmUuY29tL0Fkb2JlU1ZHVmlld2VyRXh0ZW5zaW9ucy8zLjAvIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE5MHB4IiBoZWlnaHQ9IjI4cHgiIHZpZXdCb3g9Ii0yIC02IDE5MCAyOCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAtMiAtNiAxOTAgMjgiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxkZWZzPjwvZGVmcz48cGF0aCBmaWxsPSIjRkFCODJGIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3ICAgICIgZD0iTTE1LjIyOSwxMy40NDVsMS42MzMtNy43MDJjMC4wOS0wLjQyMywwLjE1Ny0wLjc4NiwwLjE5OC0xLjA5YzAuMDQyLTAuMzAzLDAuMDYyLTAuNTYyLDAuMDYyLTAuNzc5YzAtMC4zNzQtMC4wOTUtMC42NDItMC4yODctMC44MDVjLTAuMTktMC4xNjEtMC40NTItMC4yNDItMC43ODUtMC4yNDJjLTAuMjQxLDAtMC41MDMsMC4wNDktMC43ODUsMC4xNWMtMC4yODIsMC4xLTAuNTczLDAuMjM0LTAuODcyLDAuNDA1Yy0wLjI5OCwwLjE3LTAuNiwwLjM3Mi0wLjkwMywwLjYwNGMtMC4zMDMsMC4yMzMtMC42LDAuNDc5LTAuODkxLDAuNzM1bC0xLjgzMiw4LjcyNEg3LjYwMWwxLjYzMi03LjcwMkM5LjMyNSw1LjMyLDkuMzkxLDQuOTYyLDkuNDM0LDQuNjY3YzAuMDQtMC4yOTcsMC4wNjItMC41MDIsMC4wNjItMC42MThjMC0wLjE5LTAuMDEzLTAuMzYtMC4wMzgtMC41MTJDOS40MzQsMy4zODgsOS4zODQsMy4yNiw5LjMwOSwzLjE1MkM5LjIzMiwzLjA0NCw5LjEyNiwyLjk2Myw4Ljk4NCwyLjkwOGMtMC4xNDItMC4wNTQtMC4zMjctMC4wODEtMC41Ni0wLjA4MWMtMC4yNjgsMC0wLjU0NywwLjA1OC0wLjg0MiwwLjE3QzcuMjg3LDMuMTA4LDYuOTg2LDMuMjU0LDYuNjgsMy40MzNjLTAuMzA4LDAuMTc4LTAuNjA3LDAuMzgtMC44OTgsMC42MDRDNS40OTEsNC4yNjIsNS4yMjIsNC40OSw0Ljk3MSw0LjcyMmwtMS44Myw4LjcyM0gwTDIuNzU0LDAuMzczaDMuMTRMNS41MzIsMi4wNjhDNi4yNTUsMS40MTEsNi45NzYsMC45MDIsNy42OTQsMC41NEM4LjQxMiwwLjE4LDkuMTMsMCw5Ljg0NCwwYzAuOTMxLDAsMS42NTEsMC4xOSwyLjE2MywwLjU3MWMwLjUxMSwwLjM4MywwLjc4NiwwLjk3NSwwLjgyOCwxLjc3MWMwLjQ0OC0wLjM3MywwLjg3My0wLjcwNiwxLjI3MS0wLjk5N2MwLjQtMC4yOTEsMC43ODItMC41MzUsMS4xNDctMC43MzVjMC4zNjUtMC4xOTksMC43MjEtMC4zNTEsMS4wNjUtMC40NTVDMTYuNjYzLDAuMDUyLDE3LjAwNSwwLDE3LjM0NiwwYzAuNTk5LDAsMS4wOTYsMC4wNzIsMS40ODksMC4yMTdjMC4zOTYsMC4xNDYsMC43MTEsMC4zNSwwLjk0NywwLjYxYzAuMjM3LDAuMjYyLDAuNDA2LDAuNTcsMC41MDYsMC45MzFjMC4xLDAuMzU2LDAuMTQ5LDAuNzQ2LDAuMTQ5LDEuMTdjMCwwLjMwOC0wLjAxOSwwLjYzNC0wLjA1NywwLjk3N2MtMC4wMzcsMC4zNDYtMC4xMDIsMC43MTEtMC4xOTIsMS4wOTJsLTEuNzk1LDguNDQ4SDE1LjIyOUwxNS4yMjksMTMuNDQ1eiIvPjxwYXRoIGZpbGw9IiNGQUI4MkYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgICAgIiBkPSJNMTkuNjc5LDE1LjIwM2MwLjM0MSwwLjEzMiwwLjY3NSwwLjIyNywxLjAwMiwwLjI3OWMwLjMzLDAuMDU1LDAuNjI2LDAuMDgsMC44OTIsMC4wOGMwLjIzMiwwLDAuNDYxLTAuMDM5LDAuNjg1LTAuMTE3YzAuMjI2LTAuMDc4LDAuNDUzLTAuMjEzLDAuNjg3LTAuNDA0YzAuMjM0LTAuMTkxLDAuNDcxLTAuNDQ1LDAuNzE2LTAuNzYyYzAuMjQ2LTAuMzE0LDAuNTA5LTAuNzA0LDAuNzkyLTEuMTdsMC40NjEtMC43NjJsLTIuMDctMTEuOTc1aDMuMTQxbDEuMjgzLDguNDI1bDQuODIzLTguNDI1aDMuMzY1bC04LjQ3NSwxMy45NzFjLTAuNDIzLDAuNzA1LTAuODM1LDEuMzEyLTEuMjM0LDEuODE4Yy0wLjM5OCwwLjUwNy0wLjgyLDAuOTI0LTEuMjY1LDEuMjUyYy0wLjQ0NCwwLjMyNy0wLjkzLDAuNTY4LTEuNDU4LDAuNzI1Yy0wLjUyNywwLjE1Mi0xLjEzMSwwLjIyOS0xLjgxMywwLjIyOWMtMC4zOTgsMC0wLjgyNC0wLjA0My0xLjI3Ni0wLjEzMmMtMC40NTMtMC4wODYtMC45MDQtMC4xOTgtMS4zNTMtMC4zMjlMMTkuNjc5LDE1LjIwM3oiLz48cGF0aCBmaWxsPSIjQ0NDQ0NDIiBkPSJNMTQ1Ljg4NSwxMC42OGg4LjE4YzAuODU1LDAsMS43MjktMC4wOTUsMS43MjktMS4xMTNjMC0xLjE0NS0wLjQ3My0xLjIxNi01LjY3MS0xLjIxNmMtNi4wNzIsMC02Ljc2OS0wLjcyNy02Ljc2OS0zLjk2MmMwLTIuMzgzLDAuMjE5LTQuMjIsNS4zMTEtNC4yMmg1LjYzMmM0LjE3OSwwLDQuOTU4LDEuMjczLDUuMDc3LDMuMjAzYzAuMDA4LDAuMDk4LDAuMDA4LDAuMjAyLDAuMDEyLDAuMzA5Yy0wLjI3OS0wLjI3Mi0wLjkwOC0wLjU2OC0yLjc2NC0wLjU2OGgtNy43MDRjLTAuOTA4LDAtMS41MjYsMC4zMTEtMS41MjYsMS4wMjFjMCwxLjE0NiwwLjQ5MywxLjE4MSw0LjgyLDEuMTY0YzYuMjcxLTAuMDE4LDcuNzI1LDAuMzYxLDcuNzI1LDQuMTk5YzAsMy41NDUtMS4xOTksNC4xMjgtNi41NjIsNC4xMjhoLTQuODkxYy0zLjU5OCwwLTUuMDg0LTAuNjY0LTUuMTQ0LTMuMzczQzE0My42MTksMTAuNTM4LDE0NC4zNTksMTAuNjc2LDE0NS44ODUsMTAuNjh6Ii8+PHBhdGggZmlsbD0iI0NDQ0NDQyIgZD0iTTc1LjE0MywxMy40NzNoMi4xOTJMNzAuMTE0LDAuMjg2aC03LjMxNUw2Mi43NCwwLjQzNWMxLjUxNiwwLjY0OCwxLjEwMywxLjYzLDAuNTcxLDIuNzI3bC01LjU4NCwxMC4zMTZoMS45OTVjMi4zNCwwLjAwMiwyLjQyMS0wLjcyOCwzLjctMi4zM3YwLjAwNEg3MS42bDAuMDIxLDAuMDMxQzcyLjc3MSwxMi43NTEsNzIuODk2LDEzLjQ3NSw3NS4xNDMsMTMuNDczeiBNNjQuOTMyLDguMzE3bDIuNTQ2LTQuOTQ2bDIuNjExLDQuOTQ2SDY0LjkzMnoiLz48cGF0aCBmaWxsPSIjQ0NDQ0NDIiBkPSJNMTA3LjMwNSwzLjU4N2g1LjY2NmMwLDAtMC44NzMtMy4yOTEtMy4wNDgtMy4zMDFIOTcuNTkxYzAsMCwwLjY0MiwzLjI5MSwzLjA2OCwzLjMwMWMyLjQyNCwwLjAwOSwyLjYwNCwwLDIuNjA0LDB2NC4zNWwwLDB2MS42N2MtMC4wMDIsMi4yMDMsMC41MDgsMy44NjEsMi44MzIsMy44NjVoMS4yMDdWNy43MThWNy43MTVWMy41ODdIMTA3LjMwNXoiLz48cGF0aCBmaWxsPSIjQ0NDQ0NDIiBkPSJNMTE0LjQ4NiwwLjQzMmMxLjMyLDAuNDcxLDEuOTI5LDEuOTg0LDIuMDYyLDIuOTAzdjYuMjcxYy0wLjAwNiwyLjIwMywwLjUwMywzLjg2OSwyLjgzMiwzLjg3M2gxLjIwNlY4Ljk4NGg1LjE4YzIuMjY5LTAuMDM5LDMuOTU3LTAuMzQ2LDQuMDg0LTIuNzU4VjUuOTM0aC05LjI2NFYzLjQ3OGg1LjgyMmMyLjE3OC0wLjA1NywzLjc4MS0wLjQyNiwzLjg5MS0yLjg4VjAuMjg2aC0xNS44MTJDMTE0LjQ4NiwwLjI4NCwxMTQuNDg2LDAuNDMyLDExNC40ODYsMC40MzJ6Ii8+PHBhdGggZmlsbD0iI0NDQ0NDQyIgZD0iTTEzMi43MTYsMC40MzJjMS4zMTMsMC40NzEsMS45MjksMS45ODIsMi4wNTYsMi45bDAuMDA0LDYuMjczYy0wLjAwNCwyLjIwMywwLjUwMiwzLjg2MiwyLjgzNiwzLjg2N2gxLjIwMVYwLjI5NlYwLjI5MmwtNi4wOTctMC4wMDZWMC40MzJMMTMyLjcxNiwwLjQzMnoiLz48cGF0aCBmaWxsPSIjQ0NDQ0NDIiBkPSJNMTc2Ljc4MiwwLjI4NnY0LjcxOWgtOC41MzlWMC4yOTZWMC4yOTJsLTYuMTAxLTAuMDA2djAuMTQ2YzEuMzI1LDAuNDcxLDEuOTI0LDEuOTgyLDIuMDYyLDIuOXY2LjI3M2MtMC4wMDgsMi4yMDMsMC41MDMsMy44NjIsMi44MzQsMy44NjdoMS4yMDRWOC40OTZoOC41Mzl2MS4xMDljLTAuMDA5LDIuMjAzLDAuNTAxLDMuODYyLDIuODI5LDMuODY3aDEuMjAzVjAuMjk2VjAuMjg4TDE3Ni43ODIsMC4yODZ6Ii8+PHBhdGggZmlsbD0iI0NDQ0NDQyIgZD0iTTU2Ljg2Miw2Ljg5YzAtMy4yNTUtMi4xNTEtNi42MDQtNi4xODgtNi42MDRoLTEzLjc4YzAtMC4wMDIsMCwwLjEyMSwwLDAuMTIxYzEuMzU4LDAuNDgyLDIuMiwyLjM1LDIuMzA4LDMuMjYybDAuMDA0LDUuOTExbDAuMDAzLTAuMDE2YzAuMDU3LDIuMTc0LDAuNDI5LDMuNzgxLDIuODk5LDMuOTA4aDguNTY2QzU0LjcxMSwxMy40NzMsNTYuODYyLDEwLjE0Myw1Ni44NjIsNi44OXogTTUyLjgyOCw2LjgzNmMwLDEuODcyLTEuNTUsMy4yNTQtMy4yNzYsMy4yNTRoLTYuMzFWMy41ODJoNi4zMUM1MS4yNzgsMy41ODIsNTIuODI4LDQuOTY0LDUyLjgyOCw2LjgzNnoiLz48cGF0aCBmaWxsPSIjQ0NDQ0NDIiBkPSJNOTEuNTM5LDAuMjg4aC0zLjk0OGwwLjAwOC0wLjAwMkg3Ny4yODNjMC0wLjAwMiwwLjE4NiwwLjEyMSwwLjE4NiwwLjEyMWMxLjM1OCwwLjQ4MiwxLjc3OCwyLjA1NSwxLjg4NywyLjk2NHYwLjgwN2wwLDBWOS41OGMtMC4wMDYsMi4yMDQsMC41MDEsMy44ODksMi44MzMsMy44OTNoMS4yMDR2LTMuNDM5aDYuMzQzYzAuOTYzLDAsMS40MTcsMC4yNzEsMS41OCwxLjAxNGMwLjI3MSwwLjk0NSwwLjM3OCwyLjMxNywyLjg1NCwyLjQyOGgxLjI1N3YtMi4yNTZjMC0yLjE2NC0wLjk5Ny0yLjY5MS0yLjIwMi0yLjkwOVY4LjI3MWMxLjg1Ni0wLjQ0LDIuMjU5LTEuNDc0LDIuMjU5LTMuMjM2VjQuMkM5NS40ODQsMS44MzUsOTQuNjQ4LDAuMjg4LDkxLjUzOSwwLjI4OHogTTkxLjU1Nyw1LjM3OWMwLDAuOTUxLTAuNDA0LDEuMzgyLTEuNDkzLDEuMzgyaC02LjY3MVYzLjU2Mmg2LjMwNGMxLjI3OCwwLDEuODYsMC4yMTksMS44NiwxLjM4M1Y1LjM3OXoiLz48L3N2Zz4=);
background-size:80px 14px;
}
.minivideo__infos .icon--my {
position:absolute;
top:-20px;
}

.medal {
background:white url("../img/apps/medal.png") center 0 no-repeat;
background-size:contain;
height:0;
width:100%;
padding-top:15%;
}


.loader-wrapper {
text-align:center;
}

.loader {
display:inline-block;
position:relative;
top:0px;
left:0px;
}

.applogocontainer {
position:relative;
width:75px;
margin:0 auto;
}

.mask75 {
display:block;
position:absolute;
top:0;
left:0;
z-index:1;
width:75px;
height:75px;
background:url("../img/products/mask75.png") 0 0 no-repeat;
background-size:75px 75px;
}


/* header */

.header{
min-height:51px;
border-bottom:2px solid #ffba00;
background-color:#222;
position:relative;
}

.header__center {
margin:0 auto;
width:960px;
}

.logo-dartfish{
display:block; 
float:left;
width:170px;
height:inherit;
min-height:38px;
background:transparent url(../img/products/logo-my-dartfish-light.svg) center center no-repeat;
background-color:transparent;
background-position:center center;
background-repeat:no-repeat;
background-size:contain;
margin-top:5px;
margin-left:-5px;
}

.logo-dartfish--center {
display:inline-block;
float:none;
}

.logo-dartfish--big {
width:235px;
}

/*User menu*/

div#js-usermenu-button{
float:right;
text-align:right;
position:relative;
padding:19px 0px 19px 4px;
height:100%;
}

.header .topmenu{
float:right;
}

.header .topmenu__channel,
.header .topmenu__user{
float:left;
position:relative;
}

.header .topmenu__beauton,
.header .topmenu__beauton:focus{
position:relative;
display:inline-block;
float:left;
padding:13px 10px;
cursor:pointer;
height:49px;
top:0px;
color:#fff;
font-size:16px; 
line-height:21px;
white-space:nowrap;
}

.header .topmenu__beauton a{
color:#fff;
}

.header .topmenu__beauton:hover{
color:#ccc;
}

.header .topmenu__beauton a:hover{
color:#ccc;
}

.header .topmenu__beauton--user{
padding:0;
cursor:pointer;
font-weight:normal;
}

.topmenu__beauton.selected{
color:#ffba00 !important;
}
.topmenu__beauton.selected:hover{
cursor:default;
}


.topmenu .beauton {
margin-top:10px;
}

.topmenu__icon{
display:block;
height:31px;
width:31px;
}


.user-button{
display:block;
/* padding:14px 10px; */
height:58px;
width:100%;
}

.avatar__logo{
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:#fff;
}

.avatar__logo span{
position:absolute;
width:100%;
display:flex;
align-items:center;
justify-content:center;
color:white;
}

.avatar__logo.avatar__logo--user-button{
display:inline-block;
top:-8px;
min-height:0 !important;
}

.avatar__logo.avatar__logo--profile{
margin-bottom:8px;
}

.banner .avatar__logo--channel-banner{
border:2px solid white;
}

.banner .avatar__logo--channel-banner span{
margin-top:-2px;
}

.avatar__logo.avatar__logo--subcribers{
float:left;
margin-right:-5px;
}

.avatar__logo.avatar__logo--subcriberslist{
float:left;
margin-top:5px;
}

.message-count{
border-radius:50%;
width:18px;
height:18px;
background-color:#EE0000;
float:right;
position:relative;
margin:-5px -5px 0px 1px;
}

.message-count span {
position:absolute;
top:-1px;
bottom:0;
width:100%;
display:flex;
align-items:center;
justify-content:center;
font-size:12px;
color:white;
text-shadow:1px 1px 1px #000;
}

.channel__logo{
background-position:center center;
background-size:contain;
background-color:transparent;
background-repeat:no-repeat;
border-radius:2px;
float:left;
}

.content--mydartfish.content--mydartfish--grey .channel__logo{
border:1px solid #5c5b64;
}

.channel__logo a{
background-color:transparent;
width:100%;
height:100%;
display:block;
}

.video__thumb{
width:100%;
height:100%;
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
}

.user-button__label{
display:inline-block;
position:relative;
top:-12px;
padding:0 1px 0 5px;
max-width:160px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.arrow{
position:relative;
}

.arrow--at-right{
padding-right:33px !important;
}

.arrow::before{
display:block;
width:0;
height:0;
position:absolute;
right:0;
top:40%;
}
.arrow--at-right::before{
right:16px;
}

.arrow--south::before {
content:" ";
border:none;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:8px solid #fff;
margin-top:1px;
}
.arrow--south:hover::before{
border-top-color:#ccc !important;
}

.selected.arrow--south::before,
.selected.arrow--south:hover::before,
.selected .arrow--south::before,
.selected .arrow--south:hover::before{
border-top-color:#ffba00 !important;
}

.arrow--north::before{
content:" ";
border:none;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-bottom:8px solid #fff;
}
.arrow--north:hover::before{
border-bottom-color:#ccc !important;
}
.selected.arrow--north::before,
.selected.arrow--north:hover::before,
.selected .arrow--north::before,
.selected .arrow--north:hover::before{
border-bottom-color:#ffba00 !important;
}

.header .topmenu__drawer{
display:none;
position:absolute;
top:49px;
right:0px;
z-index:30;
min-height:50px;
text-align:left;
background:#000;
border-top:2px solid #ffba00;
min-width:230px;
}

.header .topmenu__drawer--tv{
width:265px;
}

.header .topmenu__drawer--playlist {
  width: 265px;
  right: 142px;
}

.header #js-playlist-button.arrow--south:hover,
.header #js-quickmenu-button.arrow--south:hover,
.header #js-usermenu-button.arrow--south:hover {
  cursor: pointer;
}

.topmenu__drawer ul{
list-style:none;
margin:0;
padding:0;
border:none;
}

.topmenu__drawer__beauton a{
color:#fff;
}

.selected .topmenu__drawer__beauton,
.topmenu__drawer__beauton.selected,
.topmenu__drawer__beauton:hover,
.topmenu__drawer__beauton a:hover,
.mychannels__item:hover,
.myplaylists__item .topmenu__drawer__wrapper:hover {
  color: #ccc;
  background-color: #3D3C40;
}

.topmenu__drawer__beauton,
#menu-mobile .not-logged .topmenu__beauton,
.mychannels__item {
  background-color: #222;
  border: none;
  border-top: 1px solid #333;
  margin: 0;
  padding: 13px 16px 13px 46px;
  text-transform: initial;
  color: #fff;
  display: block;
  position: relative;
  overflow: hidden;
}

.myplaylists__item {
  background-color: #222;
  border: none;
  border-top: 1px solid #333;
  margin: 0;
  text-transform: initial;
  color: #fff;
  display: flex;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.myplaylists__item .topmenu__drawer__wrapper {
  display: flex;
  width: 100%;
}
.myplaylists__item .topmenu__drawer__beauton {
  padding: 13px 16px 13px 30px;
}
.myplaylists__item .hidden {
  display: none;
  visibility: hidden;
}
.myplaylists__item .playlist_kind_logo {
  width: 40px;
  padding: 8px 3px;
}
.myplaylists__item .playlist_name {
  width: 100%;
  margin: auto 0;
  padding-left: 5px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
  overflow: hidden;
  display: -webkit-box;
}

#menu-mobile .not-logged .topmenu__beauton,
#menu-mobile .not-logged .beauton {
  padding-left: 18px;
}

.topmenu__drawer__wrapper{
position:relative;
}

.mychannels__item,
.portal__item{
margin:0;
padding:0;
}

.mychannels__item .channel__logo{
position:absolute;
left:8px;
top:13px;
border:none;
}
#menu-mobile .topmenu__drawer__wrapper.myplaylists__item .playlist_kind_logo {
  --width: 35px;
  top: calc((100% - var(--width)) / 2);
  left: 46px;
  margin: auto 0;
  padding: 0;
  width: var(--width);
  position: absolute;
}
#menu-mobile .topmenu__drawer__wrapper.mychannels .mychannels__item .channel__logo {
  left: 48px;
}

.mychannels__item__descr{
display:block;
padding:13px 13px 13px 47px;
color:inherit;
}
#menu-mobile .topmenu__drawer__wrapper.myplaylists__item .playlist_name {
  margin: 13px 13px 13px 84px;
}
#menu-mobile .topmenu__drawer__wrapper.mychannels .mychannels__item .mychannels__item__descr {
  padding: 13px 13px 13px 84px;
}
#menu-mobile .icon--topmenu.icon--favoritevideo,
#menu-mobile .icon--topmenu.icon--tv {
  padding: 13px 16px 13px 84px;
}
#menu-mobile .icon--topmenu.icon--favoritevideo::before{
  left: 45px;
}
#menu-mobile .icon--topmenu.icon--tv::before {
  left: 38px;
}

.mychannels__item__descr:hover{
color:inherit;
}

.topmenu .mychannels__item .channel__logo {
background-color:white;
padding-top:5px;
}


.topmenu__drawer__beauton--admin-btn{
display:block;
float:right;
width:50px;
z-index:2;
padding:30px 7px 0 0;
color:#ddd;
font-size:11px;
line-height:13px;
text-align:center;
position:absolute;
right:0;
top:0;
bottom:0;
}

.menu__mobile .topmenu__drawer__beauton--admin-btn {
width:40px;
}

.topmenu__drawer__beauton--highlight{
background-color:#ffba00;
color:#222;
border:navajowhite;
}

.topmenu__drawer__beauton--highlight:hover{
background-color:#ffdd33 !important;
color:#222 !important;
}


/* content navigation:navtree, pathes */
.navbar{
position:relative;
width:100%;
float:left;
display:block;
padding:8px 10px 7px;
}

.navtree{
position:relative;
float:left;
}

.navtree #navtreemenu{
position:absolute;
top:41px;
z-index:999;
background:#fff;
display:none;
border:1px solid #ccc;
border-bottom:none;
box-shadow:2px 2px 2px rgba(0,0,0,0.3);
-moz-box-shadow:2px 2px 2px rgba(0,0,0,0.3);
-webkit-box-shadow:2px 2px 2px rgba(0,0,0,0.3);
}

.navtree + .beauton {
padding:14px;
margin:2px 0 0 5px;
}

.navtree ul li{
border-bottom:1px solid #eee;
list-style-type:none;
position:relative;
}

.navtree ul li:after {
content:"\203A";
position:absolute;
right:6px;
top:0;
font-size:24px;
line-height:24px;
color:#ddd;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.navtree ul li a{
display:block;
padding:7px 25px 9px 8px;
font-size:14px;
line-height:10px;
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
}

.navtree ul li a:first-of-type {
padding-left:15px;
}

.navtree #currentnavtree{
background-color:#eee;
color:#404040;
float:left;
border-radius:2px;
height:42px;
font-size:18px;
line-height:18px;
padding:10px 43px 6px 8px;
text-overflow:ellipsis;
overflow:hidden;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
white-space:nowrap;
border:1px solid #ccc;
}

.navtree #currentnavtree:hover {
background-color:#ddd;
}

.navtree #currentnavtree span{
float:left;
margin-left:8px;
text-overflow:ellipsis;
overflow:hidden;
line-height:20px;
width:100%;
}

.navtree #currentnavtree span:hover{
color:#000;
cursor:pointer;
}

.navtree #currentnavtree span::after{
content:" ";
background:transparent url(../img/channel/arrow_nav.png) right -18px no-repeat;
width:20px;
height:12px;
position:absolute;
right:8px;
top:18px;
}

.ie .navtree #currentnavtree{
background-color:#ddd !important;
}

.navtree .editNav {
font-size:0.8em;
padding-left:4px;
padding-top:8px;
float:left;
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
}

.navtree .editNav:before {
content:" ";
background-size:120px 2080px;
background-image:url(../img/channel/channelPictos.svg?v21);
background-position:-0px -612px;
width:36px;
height:25px;
float:left;
}

.navtree .editNav:hover:before {
background-position:-39px -612px;
}

.navpath{
margin:0;
padding-left:30px;
background:#fff;
padding:3px 0px 3px;
float:left;
display:block;
font-size:16px;
line-height:16px;
/*min-width:45%;*/
}

.navpath span,
.navpath .pathitem{
min-height:26px;
display:block;
padding:10px 10px 0 20px;
float:left;
position:relative;
line-height:18px;
white-space:nowrap;
} 

.navpath .pathitem:first-of-type{
padding:10px 10px 0 0;
}

.navpath span::after,
.navpath .pathitem::after{
content:"\203A";
position:absolute;
left:1px;
top:9px;
font-size:20px;
color:#aaa;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
} 

.navpath span{
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
display:block;
}

.navpath .pathitem:first-of-type::after{
content:none;
}

/*Share pane*/
#sharePopupPane h3 {
margin-top:2px;
font-size:24px;
}

.content--mydartfish.content--mydartfish--grey #sharePopupPane h3 {
color:#fff;
}

#sharePopupPane .shareheader {
float:left;
width:100%;
border-top:1px solid #eee;
padding:10px 0;
margin:5px 0;
}

.content--mydartfish.content--mydartfish--grey #sharePopupPane .shareheader {
border-top:1px solid #5c5b64;
border-bottom:1px solid #5c5b64;
color:#fff;
}

.sharePane .shareMenu {
float:left;
width:100%;
color:#3d3d3d;
font-size:16px;
line-height:32px;
}

.sharePane .shareMenuItem {
font-size:16px;
margin-right:30px;
margin-bottom:20px;
}

.sharePane .shareMenuItem.selected {
color:#3d3d3d;
border-bottom:3px solid #2caed3;
padding-bottom:5px;
cursor:default;
}

.content--mydartfish.content--mydartfish--grey .sharePane .shareMenu a.selected,
.content--mydartfish.content--mydartfish--grey .sharePane .shareMenu a.selected:hover {
color:#fff;
border-bottom:2px solid #fff;
}

.content--mydartfish.content--mydartfish--grey .sharePane .shareMenu a:hover {
color:#ffba00;
border-bottom:none;
}

#sharePopupPane .toolPane .toolPaneContent {
padding:0;
}

#sharePopupPane .toolPane .toolPaneContent .icon--close {
display:none;
}

#sharePopupPane .sharetitle {
width:100%;
float:left;
overflow: hidden;
text-overflow: ellipsis;
}

#sharePopupPane .sharedesc {
color:#333;
font-size:0.9em;
}

.content--mydartfish--grey #sharePopupPane .sharedesc {
  color: #aaa;
}

.sharePane .shareIcon {
width:100%;
float:left;
margin:0 0 5px;
}

.sharePane .shareDesc {
width:100%;
float:left;
font-size:14px;
padding-top:10px;
}

.sharePane .shareCollType {
float:left;
width:100%;
margin-top:25px;
}

.sharePane .shareCollType  div{
float:left;
}

.sharePane .shareCollType a {
font-size:14px;
margin-left:30px;
vertical-align:top;
}

.sharePane .shareCollType span{
display:block;
}

.sharePane .shareCollType .shareCollTypeDesc{
font-size:12px;
}

.sharePane .shareLinkPane {
float:left;
width:100%;
display:block;
padding:15px 0 25px;
}

.sharePane .shareembedPane {
display:none;
float:left;
width:100%;
min-height:30px;
padding:25px 0 5px;
}

.sharePane .shareSubscribersPane {
float:left;
display:block;
width:100%;
padding:15px 0;
}

.sharePane .shareBlock {
margin-top:10px;
float:left;
width:48px;
margin-right:10px;
margin-right:25px;
}

.sharePane .shareBlock span {
float:left;
font-size:12px;
text-align:center;
width:100%;
}

.sharePane .shareIcon a {
position:relative;
content:" ";
display:block;
z-index:1;
background-size:225px 3900px;
background-image:url(../img/channel/channelPictos.svg?v21);
width:48px;
height:48px;
float:left;
margin-right:10px;
cursor:pointer;
}

.sharePane .shareLinkPane a.shareReset {
width:auto;
height:auto;
font-size:14px;
margin:3px 0 0 20px;
background:none;
}

.playlistColl__popup .shareIcon a.shareEmail,
.sharePane .shareIcon a.shareEmail {
background-position:-159px 445px;
}

.playlistColl__popup .shareIcon a.shareMessage,
.sharePane .shareIcon a.shareMessage {
background-position:-86px 445px;
}

.playlistColl__popup .shareIcon a.shareMessage.ios,
.sharePane .shareIcon a.shareMessage.ios {
background-position:-159px 246px;
}

.playlistColl__popup .shareIcon a.shareMessage.android,
.sharePane .shareIcon a.shareMessage.android {
background-position:-86px 246px;
}

.playlistColl__popup .shareIcon a.shareWhatsapp,
.sharePane .shareIcon a.shareWhatsapp {
background-position:-13px 445px;
}

.playlistColl__popup .shareIcon a.shareFacebook,
.sharePane .shareIcon a.shareFacebook {
background-position:-86px 519px;
}

.playlistColl__popup .shareIcon a.shareLinkedIn,
.sharePane .shareIcon a.shareLinkedIn {
background-position:-16px 246px;
}

.playlistColl__popup .shareIcon a.shareTwitter,
.sharePane .shareIcon a.shareTwitter {
  background-position:-17px 519px;
}

.sharePane .shareIcon a.shareEmbed {
background-position:-158px 519px;
}

.sharePane .shareIcon a.shareWebShare {
background-position:-158px 1111px;
}

/*MyIceHockey start*/
.sharePane .shareBlock.myIceHockey{
margin-left:5px;
}

.sharePane .shareBlock.myIceHockey a {
background-image:url('https://app.myice.hockey/img/mih-share.svg');
background-size:auto;
}

.sharePane .shareBlock.myIceHockey span {
width:80px;
margin-left:-14px;
}
/*MyIceHockey end*/

.sharePane .shareLinkPane .beauton.shareClipboard {
  position:relative;
  display:block;
  float:left;
  cursor:pointer;
  margin-left:-1px;
  margin-right:0px;
  height:32px;
  line-height:20px;
}

.sharePane .shareTextBox {
font-size:14px;
color:#727272;
border:1px solid #D7D7D7;
width:240px;
max-width:100%;
min-height:32px;
float:left;
border-radius:0px;
}

.sharePane .shareTextBox input {
min-height:32px;
}

.sharePane .sharePos {
font-size:14px;
color:#3d3d3d;
margin:4px 0 0px 20px;
float:left;
display:block;
color:green;
}

.sharePane .sharePos input[type="checkbox"] {
border:1px solid #D7D7D7;
}

.sharePane .sharePosTextBox {
font-size:14px;
color:#727272;
margin-left:27px;
border:1px solid #D7D7D7;
height:20px;
width:60px;
margin-left:1px;
}

.sharePane .ccStatus {
float:left;
width:100%;
min-height:26px;
font-style:italic;
font-size:14px;
color:green;
padding:0 3px;
}

.sharePane .shareembedPane .embedBox {
font-size:11px;
color:#727272;
margin-left:27px;
height:75px;
width:500px;
margin-left:1px;
line-height:16px;
border:1px solid #D7D7D7;
}

.sharePane .shareembedPane .embedSize {
padding:8px 0;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.sharePane .shareembedPane .embedSize select {
margin:0 15px;
}

.sharePane .shareembedPane .embedDomain {
font-size:14px;
margin-bottom:10px;
float:left;
}

/******************  Popup ***************************/

#GlobalPopup {
  transform-origin: 0 100%;
  position: fixed;
  width: 100%;
  left: calc((100vw - 960px) / 2);
  transform: scaleY(1);
  transition: transform 0.2s ease-in, opacity 0.2s ease-in;
}
#GlobalPopup > div {
  background: #5c5a62;
  width: fit-content;
  max-width: 400px;
  border-radius: 5px;
  display: flex;
/*  padding: 15px;*/
}
#GlobalPopup .close {
  margin: auto;
  padding: 0 4px;
}
#GlobalPopup .close input {
  min-height: 0;
  border: none;
  background: transparent;
  color: orange;
  font-size: 20px;
  cursor: pointer;
}
#GlobalPopup .close input:hover {
  color: white;
}
#GlobalPopup .popup-content {
  color: white;
  word-break: break-word;
  padding: 15px;
  border-right: 1px solid #aaa;
  max-width: calc(100% - 40px);
}
#GlobalPopup .action {
  cursor: pointer;
  color: #ffba00;    
  background: none;
  border: none;
  font-size: inherit;
  min-height: 0;
}
#GlobalPopup .action:hover {
  color: white;
}
#GlobalPopup.hidden {
  opacity: 0;
  transform: scaleY(0);
  visibility: hidden;
/*  transition: opacity 1s linear, visibility 1s linear;*/
  transition: transform 0.2s ease-out, opacity 0.2s ease-out, visibility 0.2s linear;
}

/******************  move collections  ***************/

#moveCollPane {
height:630px;
max-height:800px;
}

#moveCollPane h3 {
float:left;
margin-top:2px;
font-size:24px;
width:100%;
line-height:0.9em;
padding:0 0 10px 0;
}

#moveCollPane h3 span {
font-size:14px;
}

#moveCollPane .videotitle {
font-size:12px;
padding:5px 0;
float:left;
max-width:325px;
word-wrap:break-word;
text-overflow:ellipsis;
overflow:hidden;
min-height:50px;
}

#moveCollPane .collheader {
float:left;
width:100%;
background:#eee;
border:1px solid #eee;
border-bottom:none;
height:43px;
padding:6px 5px 0;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .collheader {
background:#5c5b64;
border:1px solid #6b6a74;
}

#moveCollPane .collheader 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;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .collheader input[type=search] {
background-color:#6b6a74;
border-color:#777;
color:#eee;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .collheader input[type=search]::placeholder {
color:#ddd;
}

#moveCollPane .collList {
overflow:auto;
border:1px solid #eee;
border-top:none;
float:left;
height:455px;
width:100%;
}

#moveCollPane .cancel {
float:right;
margin:5px 0 0 10px;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .collList {
border:1px solid #5c5b64;
border-top:none;
}

#moveCollPane .cl {
width:auto;
padding:0 10px 2px;
overflow:hidden;
border-bottom:1px solid #EDEDED;
}

#moveCollPane .cl label {
display:block;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .cl {
border-bottom:1px solid #5c5b64;
}

#moveCollPane .cl.source {
background:#ddd;
}

.content--mydartfish.content--mydartfish--grey #moveCollPane .cl.source {
background:#6b6a74;
}

#moveCollPane .cl.source.partial input {
opacity:0.4;
}

#moveCollPane .cl span {
width:90%;
}

#moveCollPane .cl input {
float:right;
min-height:20px;
}

/******************  add to playlist  ***************/

.addtoplaylist_container {
display: flex;
flex-direction: column;
width: 100%;
height: calc(100% - 20px);
}

#addToPlaylistPane .playlistList {
  flex-grow: 1;
}

#addToPlaylistPane h3 {
float:left;
margin-top:2px;
font-size:24px;
width:100%;
line-height:0.9em;
padding:0 0 10px 0;
}

#addToPlaylistPane h3 span {
font-size:14px;
}

#addToPlaylistPane .playlistheader {
float:left;
width:100%;
background:#eee;
border:1px solid #eee;
border-bottom:none;
height:43px;
padding:6px 5px 0;
}

.content--mydartfish.content--mydartfish--grey #addToPlaylistPane .playlistheader {
background:#5c5b64;
border:1px solid #6b6a74;
}

#addToPlaylistPane .playlistheader 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;
}

#addToPlaylistPane .playlistfooter a.disabled {
  background: #ddd;
  pointer-events: none;
}

#addToPlaylistPane .playlistfooter > div > * {
  margin-top: 10px;
}
#addToPlaylistPane .playlistfooter .createbutton:hover {
  color: black;
}
#addToPlaylistPane .playlistfooter .createbutton {
  color: #2caed3;
  background: transparent;
  padding: 5px 0 7px;
  display: inline-block;
}
.content--mydartfish.content--mydartfish--grey #addToPlaylistPane .playlistfooter .createbutton {
  color: #ffba00;
}
.content--mydartfish.content--mydartfish--grey #addToPlaylistPane .playlistfooter .createbutton:hover {
  color: white;
}

#addToPlaylistPane .playlistfooter .actions {
  display: block;
}
#addToPlaylistPane .playlistfooter .create {
  display: none;
}
#addToPlaylistPane .playlistfooter.addplaylist .actions {
  display: none;
}
#addToPlaylistPane .playlistfooter.addplaylist .create {
  display: block;
}
#addToPlaylistPane .playlistfooter.addplaylist .create .namebox {
  width: 350px;
  max-width: calc(100% - 90px);
}
#addToPlaylistPane .playlistfooter.addplaylist .create a {
  margin-top: 15px;
  margin-left: 10px;
}

#addToPlaylistPane .playlistList {
overflow:auto;
border:1px solid #eee;
border-top:none;
float:left;
height:485px;
width:100%;
}
.content--mydartfish.content--mydartfish--grey #addToPlaylistPane .playlistList {
  border-color: #6b6a74;
}

#addToPlaylistPane .cl {
width:auto;
padding:0 10px 2px;
overflow:hidden;
border-bottom:1px solid #EDEDED;
}

#addToPlaylistPane .cl > label {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.content--mydartfish.content--mydartfish--grey #addToPlaylistPane .cl {
border-bottom:1px solid #5c5b64;
}
#addToPlaylistPane .cl span {
overflow: hidden;
word-break: break-word;
}

#addToPlaylistPane .cl input {
float:right;
min-height:20px;
}

/***** collection subscribers *****/

.sharePane .shareSubscribersPane .additionalsubscribers {
font-weight:bold;
float:left;
margin:5px 20px 0 15px;
}

.sharePane .shareSubscribersPane a.subscriberslink {
float:left;
margin:5px 0 0 0;
}

#subscribersPopupPane h3 {
margin-top:2px;
font-size:24px;
}

#subscribersPopupPane h4 {
margin-top:15px;
font-size:18px;
}

#subscribersPopupPane .formError,
#subscribersPopupPane .formSuccess,
#subscribersPopupPane .formInfo {
margin-bottom:5px;
}

.subscriberslist {
height:200px;
padding:10px;
overflow:auto;
border:1px solid #ccc;
}

.subscriberslist .subscriber {
height:35px;
}

.subscriberslist .subscriber .subscribername {
float:left;
margin:5px 0 0 15px;
}

.subscriberslist .subscriber .icon--delete{
margin-top:-7px;
height:40px;
}

.subscriberslist .subscriber .icon--download {
cursor:default;
}

/***** invite subscribers with autocompleter *****/

.invitesubscriberstitle {
height:42px;
}

.invitesubscriberstitle h4 {
float:left;
}

.invitesubscriberstitle a {
float:right;
margin-top:20px;
font-size:14px;
}

.invitesubscribers {
font-size:14px;
}

.invitesubscribers .selectedmembers {
border:1px solid #ccc;
padding:5px 5px 1px 5px;
width:100%;
height:auto;
max-height:124px;
overflow:auto;
cursor:text;
}

.invitesubscribers .selectedmembers .autocompleterhint {
border:none;
padding:4px 2px 6px 2px;
width:80%;
min-height:0;
margin-left:50px;
}

.invitesubscribers .selectedmembers .selected {
display:block;
float:left;
background:#f1f1f1;
-webkit-border-radius:11px;
-moz-border-radius:11px;
border-radius:11px;
padding:1px 1px 1px 9px;
margin:0 3px 3px 0;
border:1px solid #ccc;
font-size:11px;
}

.invitesubscribers .selectedmembers .selected.group {
background:#BFE5EE;
border:1px solid #2CAED3;
}

.invitesubscribers .selectedmembers .selected.notvalid {
background:#FCDFD9;
border:1px solid #F9A493;
}

.invitesubscribers .selectedmembers .selected .deletebutton {
display:block;
float:right;
height:18px;
width:18px;
margin-left:4px;
background:#bbb url(../img/iconfile/delete.png) -1px -1px no-repeat;
-webkit-border-radius:9px;
-moz-border-radius:9px;
border-radius:9px;
}

.invitesubscribers .selectedmembers .selected.group .deletebutton {
background-color:#87D5E9;
}

.invitesubscribers .selectedmembers .selected.notvalid .deletebutton {
background-color:#F4B8AB;
}

.invitesubscribers .selectedmembers .selected .deletebutton:hover {
background-color:#F9A493;
cursor:pointer;
}

.invitesubscribers .selectedmembers .selected span {
line-height:18px;
}

.invitesubscribers .actionbox {
display:none;
position:absolute;
z-index:43;
width:calc(100% - 40px);
padding:20px 20px 10px;
border:1px solid #ccc;
border-top:none;
background:#f3f3f3;
margin:-1px 0 0 -1px;
}

.invitesubscribers .actionbox span {
margin:0 5px;
}

.invitesubscribers textarea {
border:1px solid #ccc;
padding:5px;
width:100%;
min-width:100%;
max-width:100%;
height:85px;
min-height:85px;
max-height:240px;
overflow:auto;
font-size:1em;
cursor:text;
font-family:inherit;
}

.invitesubscribers .message textarea {
display:block;
margin:5px 0 10px;
}

.invitesubscribers #outofselect .checkbox {
margin-bottom:20px;
}

.invitesubscribers #outofselect .checkbox label {
font-size:0.9em;
padding-left:8px;
}

.invitesubscribers input.existingitemslist,
.invitesubscribers input.newitemslist {
display:none !important;
}

.invitesubscribers input#autocompleter {
width:auto;
padding:4px 0 6px;
color:#222;
float:left;
border:none;
outline:none;
min-height:0;
}

.invitesubscribers ul.ui-autocomplete {
position:absolute;
margin:0 0 0 1px;
padding:0;
list-style:none;
border:1px solid #ccc !important;
border-top:none;
border-bottom:none;
text-align:left;
z-index:50;
background-color:#fff;
overflow-y:scroll;
width:calc(100% - 40px) !important;
left:-2000px;
max-height:200px;
}

.invitesubscribers ul.ui-autocomplete li.ui-menu-item {
background:#fff url(../img/iconfile/letter.png) 8px 15px no-repeat;
display:block;
float:none !important;
cursor:pointer;
font-weight:normal;
overflow:auto;
font-size:1em;
border-top:1px solid #ccc;
margin-bottom:0;
height:53px;
}

.invitesubscribers ul.ui-autocomplete li.ui-menu-item a {
padding:5px 15px 5px 40px;
display:block;
}

.invitesubscribers ul.ui-autocomplete li.ui-menu-item:hover,
.invitesubscribers ul.ui-autocomplete .ui-state-hover {
background-color:#f3f3f3 !important;
background:#f3f3f3 url(../img/iconfile/letter.png) 8px 15px no-repeat;
}

.invitesubscribers ul.ui-autocomplete li .name {
display:block;
float:left;
margin-right:4px;
}

.invitesubscribers ul.ui-autocomplete li .email {
display:block;
clear:left;
margin-right:4px;
color:#555;
}

.invitesubscribers ul.ui-autocomplete li .keywords {
color:#888888;
display:block;
float:right;
font-size:11px;
text-align:right;
white-space:normal;
width:40%;
}


/* Select all videos checkbox */
.selectall {
height:20px;
width:30px;
}

.selectall__check {
position:relative;
bottom:-3px;
display: block;
}

.selectall__check input[type="checkbox"] {
position:absolute;
opacity:0;
}

.selectall__check input[type="checkbox"] + label:before {
content:'';
position:absolute;
top:3px;
left:0;
width:15px;
height:15px;
border:2px solid #999;
border-radius:50%;
}

.selectall__check input[type="checkbox"]:not(:checked) + label:before {
opacity:.6;
}

.selectall__check input[type="checkbox"]:checked + label:before {
background-color:#2caed3;
border-color:#2caed3;
box-shadow:0 2px 5px rgba(0,0,0,0.3);
-moz-box-shadow:0 2px 5px rgba(0,0,0,0.3);
-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.3);
}

.content--mydartfish.content--mydartfish--grey .selectall__check input[type="checkbox"]:checked + label:before {
background-color:#d6a219;
border-color:#d6a219;
}

.selectall__check input[type="checkbox"] + label:after {
content:'\2713';
position:absolute;
top:4px;
left:4px;
font-size:15px;
line-height:15px;
color:#999;
}

.selectall__check input[type="checkbox"]:not(:checked) + label:after {
opacity:0;
}

.selectall__check input[type="checkbox"]:not(:checked):hover + label:after,
.selectall__check.hover input[type="checkbox"]:not(:checked) + label:after {
opacity:1;
}

.selectall__check input[type="checkbox"]:checked + label:after {
opacity:1;
color:#fff;
}


/* multi-select videos */
.minivideo__check {
position:absolute;
top:5px;
left:13px;
}

.minivideo__check input[type="checkbox"] {
position:absolute;
opacity:0;
}

.minivideo__check input[type="checkbox"] + label:before {
content:'';
position:absolute;
top:3px;
left:0;
width:16px;
height:16px;
border:2px solid #eee;
border-radius:50%;
}

.minivideo__check input[type="checkbox"]:not(:checked) + label:before {
opacity:.6;
}

.minivideo__check input[type="checkbox"]:checked + label:before {
background-color:#2caed3;
border-color:#2caed3;
box-shadow:0 2px 5px rgba(0,0,0,0.3);
-moz-box-shadow:0 2px 5px rgba(0,0,0,0.3);
-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.3);
}

.content--mydartfish.content--mydartfish--grey .minivideo__check input[type="checkbox"]:checked + label:before {
background-color:#d6a219;
border-color:#d6a219;
}

.minivideo__check input[type="checkbox"] + label:after {
content:'\2713';
position:absolute;
top:4px;
left:4px;
font-size:16px;
line-height:16px;
color:#eee;
}

.minivideo__check input[type="checkbox"]:not(:checked) + label:after {
opacity:0;
}

.minivideo__check input[type="checkbox"]:not(:checked):hover + label:after,
.minivideo__check.hover input[type="checkbox"]:not(:checked) + label:after {
opacity:.6;
}

.minivideo__check input[type="checkbox"]:checked + label:after {
opacity:1;
color:#fff;
}

.minivideo__check__overlay {
display:block;
position:absolute;
top:1px;
left:6px;
width:95%;
height:59%;
}

.multiselect {
position:relative;
display:block;
float:left;
width:100%;
padding:0 10px;
margin:-60px 0 0 0;
background-color:#fff;
box-shadow:0 5px 5px rgba(0,0,0,0.3);
-moz-box-shadow:0 5px 5px rgba(0,0,0,0.3);
-webkit-box-shadow:0 5px 5px rgba(0,0,0,0.3);
z-index:3;
}

.content--mydartfish.content--mydartfish--grey .multiselect {
position:absolute;
margin:-78px 0 0 0;
background-color:#5c5b64;
}

.multiselect__close.top-left {
display:block;
float:left;
margin:20px 15px 0 12px;
}

.content--mydartfish.content--mydartfish--grey .multiselect__close.top-left {
margin-top:23px;
}

.multiselect__infos {
color:#2d2d2d;
font-size:17px;
line-height:56px;
display:block;
text-align:left;
float:left;
}

.content--mydartfish.content--mydartfish--grey .multiselect__infos {
color:#aaa;
line-height:64px;
}

.multiselect__tools {
float:right;
margin-top:5px;
}

.content--mydartfish.content--mydartfish--grey .multiselect__tools {
margin-top:9px;
}

.multiselect__tools a {
float:right;
}
.multiselect__tools input[type=image] {
  height: 38px;
  float: right;
  margin-top: 2px;
  border-radius: 0;
}
.multiselect__tools input[type=image]:hover {
  filter: brightness(0);
}


/* thumbnails */
.grid--minivideos {
min-height:450px;
}

.minivideo{
display:block;
position:relative;
-webkit-transition:background-color 200ms;
transition:background-color 200ms;
user-select:none;
-ms-user-select:none;
-moz-user-select:none;
-webkit-user-select:none;
}

.navlist .minivideo {
margin-bottom:0;
}

.minivideo__thumb{
display:block;
position:relative;
width:100%;
height:0;
padding-bottom:56.25%; /*16/9 ratio*/
background-size:cover;
background-position:center center;
border:1px solid #eee;
}
.static_playlist_info .minivideo__thumb {
  cursor: pointer;
}


.shadow_overlay {
  box-shadow:inset 0px 4.5em 20px -25px rgba(50, 50, 50, 0.55);
}


.content--mydartfish .minivideo__thumb{
border:none;
background-color: black;
}
.playlist_grid .minivideo__thumb {
  cursor: pointer;
  background-color: black;
}

.minivideo__thumb__overlay {
  display: block;
  height: 0;
  left: 30%;
  position: absolute;
  top: 0px;
  width: 40%;
  padding-top: 58%;
}

.minivideo__duration{
position:absolute;
top:-21px;
right:1px;
background-color:rgba(0,0,0,0.3);
color:rgba(255,255,255,0.8);
font-size:10px;
padding:2px 4px;
}

.minivideo__itemtype {
position:absolute;
top:0px;
left:0px;
color:rgba(255,255,255,0.8);
font-size:10px;
padding:2px 4px;
width:100%;
text-align:center;
}

.minivideo__infos{
display:block;
position:relative;
padding:5px;
min-height:59px;
border-left:1px solid #eee;
border-right:1px solid #eee;
border-bottom:1px solid #eee;
z-index:2;
-webkit-transition:background-color 200ms;
transition:background-color 200ms;
}

.navlist .minivideo__infos{
margin:16px 0 0px 2px;
width:120px;
text-align:center;
color:#787a7a;
}

.minivideo__navtitle{
position:absolute;
float:left;
top:0;
left:0;
right:0;
bottom:0;
color:#fff;
text-align:center;
font-size:16px;
line-height:16px;
background-color:rgba(0, 0, 0, 0.55);
}

.minivideo__navtitle span{
display:block;
width:100%;
text-align:center; 
padding-bottom:1.5em;
position:absolute;
top:40%;
-webkit-transform:translateY(-50%);
-moz-transform:translateY(-50%);
-ms-transform:translateY(-50%);
transform:translateY(-50%);
padding:0px 2px;
}

.minivideo__navcount{
position:absolute;
bottom:0;
left:0;
color:#fff;
width:100%;
padding:1px 5px;
text-align:center;
font-size:11px;
line-height:20px;
}

.minivideo__title{
overflow:hidden;
word-wrap:break-word;
font-size:14px;
line-height:16px;
font-family:ClearSans-Bold,Arial,Verdana,sans-serif;
height:35px;
}

.minivideo__title a{
word-wrap:break-word;
text-overflow:ellipsis;
}
.minivideo__title a:hover{
color:#2caed3;
text-decoration:underline;
}

.minivideo__subinfos{
font-size:10px;
margin-top:2px;
}

.minivideo__subinfos .addtoplaylist {
  float:right;
  margin-top:-8px;
  height: 24px;
  min-height: 0;
  margin-right: 10px;
}

.minivideo__subinfos .extrait {
width:18px;
height:22px;
float:right;
background-size:100px 1735px;
background-image:url(../img/channel/channelPictos.svg?v21);
background-position:-6px -1108px;
margin-top:-6px;
}

.minivideo__subinfos .extrait:hover {
background-position:-39px -1108px;
}

.minivideo__tools {
display:none;
position:absolute;
right:1px;
bottom:1px;
}

.minivideo__tools a {
float:right;
}

.minivideo:hover .minivideo__infos{
background-color:#eee;
}

.minivideo:hover .minivideo__thumb__overlay{
display:block;
cursor:pointer;
background:url(../img/channel/play.png) transparent no-repeat center center;
background-size:contain;
}

.minivideo:hover .minivideo__tools {
display:inline-block;
}

.minivideo:hover .minivideo__thumb input[type=checkbox]{
display:inline-block;
}

.content--mydartfish.content--mydartfish--grey .minivideo__infos{
background-color:#5c5b64;
border:none;
}
.content--mydartfish.content--mydartfish--grey .minivideo:hover .minivideo__infos{
background-color:#6b6a74;
}

.content--mydartfish.content--mydartfish--grey .minivideo__title a,
.content--mydartfish.content--mydartfish--grey .minivideo__subinfos{
color:#ddd;
}
.content--mydartfish.content--mydartfish--grey .minivideo:hover .minivideo__title a{
color:#fff;
}

/*Languages*/

#langpane{
float:left;
display:block;
}

#langpane a{
float:left;
display:block;
padding-right:15px;
}

#langpane a.selected,
#langpane a.selected:hover{
color:#ffba00;
}


/****************** footer ****************/

.footer{
background-color:#222;
padding:20px 0 55px;
font-size:0.8em;
color:#999;
line-height:1.3em;
}

.platform .footer{
padding:30px 0 50px;
}

.footer .corporate{
width:100%;
display:block;
float:left;
margin:60px 0 10px 0;
}

.footer a{
display:block;
color:#999;
line-height:18px;
}

.footer a:hover{
color:#fff;
}

.footer .helpcol{
float:left;
padding-right:100px;
}
.footer .dfcol{
float:left;
padding-right:100px;
}
.footer .followcol{
float:right;
text-align:right;
width:200px;
}

.footer h6{
color:#ffba00;
font-weight:normal;
font-size:24px;
padding-bottom:10px;
}

.footer .socialbtns{
float:right;
display:inline-block;
}

.footer .twitter,
.footer .instagram,
.footer .blogger,
.footer .facebook{
float:left;
display:block;
height:24px;
width:24px;
margin:0.5em 0 0.5em 0.5em ;
text-indent:-10000px;
}

.footer .blogger{
background:transparent url(../img/platform/blogger.svg) 0 0 no-repeat !important;
background-size:100% !important;
}

.footer .twitter{
background:transparent url(../img/platform/twitter.svg) 0 0 no-repeat !important;
background-size:100% !important;
}

.footer .instagram{
background:transparent url(../img/platform/instagram.svg) 0 0 no-repeat !important;
background-size:100% !important;
}

.footer .facebook{
background:transparent url(../img/platform/facebook.svg) 0 0 no-repeat !important;
background-size:100% !important;
}

.footer .lang,
.footer .terms,
.footer .copyright,
.footer .version{
float:left;
font-size:0.9em;
color:#666;
}

.footer .lang{
width:275px;
position:relative;
clear:both;
}

.footer .terms{
width:430px;
text-align:center;
}
.footer .terms a{
display:inline;
width:326px;
white-space:nowrap;
}
.footer .terms a:last-of-type{
border-right:none;
padding-right:0;
}

.footer .copyright{
float:right;
text-align:right;
width:250px;
}

.footer .terms a,
.footer .copyright a,
.footer .copyright a:hover{
color:#666;
}

.ja .footer h6{
font-size:17px;
}

.errorfooter {
font-size:12px;
}

/* very specific...*/

.settings .soft--sides {
margin:0 auto;
max-width:800px;
}

.content--mydartfish .light-bg {
background:transparent !important;
}

.settings .grid .grid__item:first-of-type{
padding-right:2em; 
opacity:0.8; 
}

/* Mobile menu */

#menu-mobile-beauton{
display:block;
padding:12px 11px 16px 10px;
cursor:pointer;
text-align:center;
background:transparent;
box-sizing:content-box;
z-index:51;
float:left;
}

#menu-mobile-beauton div{
height:4px;
margin-bottom:5px;
width:25px;
background:#ddd;
}
.content--personalchannel #menu-mobile-beauton div,
.content--tvchannel #menu-mobile-beauton div{
background:#48474c;
}

#menu-mobile-beauton div.last{
margin-bottom:0;
}

#menu-mobile-overlay{
position:absolute;
top:0;
bottom:0;
right:0;
left:0;
z-index:99;
background:#000;
opacity:0.5;
display:none;
}

.menu__mobile{
margin:0;
padding:0;
position:absolute;
width:275px;
height:auto;
min-height:320px;
left:0;
display:none;
overflow:auto;
z-index:25;
top:0;
font-size:16px;
line-height:22px;
background-color:#222;
overflow-x:hidden;
}

.menu__mobile--tvchannel{
background-color:#eee;
}

.menu__mobile h1,
.menu__mobile h3{
background-color:#eee ;
color:#888;
font-family:ClearSans-Bold,Arial,Verdana,sans-serif;
padding:1.0em 0.6em 0.2em;
line-height:2em;
text-align:left;
font-size:1.1em;
text-overflow:ellipsis;
overflow:hidden;
border-bottom:1px solid #eee;
}

.menu__mobile #js-usermenu{
display:none;
}

.menu__mobile #js-usermenu-button{
background-color:#3D3C40;
margin-right:0;
width:100%;
height:48px;
}

.menu__mobile #js-usermenu-button::after{
right:12px;
top:18px;
}

.menu__mobile #js-playlist-button,
.menu__mobile #js-quickmenu-button {
  display: none;
}

.menu__mobile .user-button__label {
top:-12px;
padding:5px 26px 1px 4px;
margin-left:36px;
float:left;
color:#fff;
}

.menu__mobile .avatar__logo--user-button {
position:absolute;
top:9px;
left:10px;
}

.menu__mobile .mainmenu{
display:block;
}

.menu__mobile .icon--mainmenu::before{
width:40px;
height:40px;
background-size:120px 2080px;
position:absolute;
left:0px;
top:0px;
}

.menu__mobile .beauton{
margin:0;
padding:1em 1em 1em 45px;
width:100%;
border-radius:0 0 0 0;
background-color:#222;
border:none;
margin:0;
text-transform:initial;
color:#fff;
display:block;
overflow:hidden;
}
.menu__mobile .beauton--highlight {
color:#222;
background:#ffba00;
}

.menu__mobile .channel-menu__beauton{
border:none;
margin:0;
padding:13px 16px 13px 42px;
display:block;
position:relative;
overflow:hidden;
}

.menu__mobile li:last-of-type .topmenu__drawer__beauton{
border-bottom:1px solid #333;
}

.menu__mobile .mainmenu .channel-menu__beauton{
text-transform:uppercase;
}

.menu__mobile .channel-menu__beauton{
border-top:none;
border-bottom:1px solid #ccc;
color:#2caed3;
}

.menu__mobile .selected .channel-menu__beauton{
background-color:#ddd;
}

.menu__mobile .channel-menu li.portalmenu{
position:relative;
}

.menu__mobile .channel-menu li .channel__logo{
position:absolute;
top:8px;
left:5px;
}

/* mobile specific */

#toggleSearchBox-mobile{
display:block;
position:absolute;
cursor:pointer;
border-left:1px solid #fff;
top:0;
right:0;
background-color:transparent;
border:none;
height:51px;
width:51px;
}

/* HOMEPAGE */

.separator{
border:none;
border-bottom:1px solid #eee;
margin:30px 0;
}

.headerline {
text-align:center;
padding:1em 0;
overflow:hidden;
}
.headerline span {
display:inline-block;
position:relative;  
}
.headerline span::before,
.headerline span:after {
content:"";
position:absolute;
border-top:1px solid #999;
top:0.81em;
width:10000px;
}
.headerline span::before {
right:100%;
margin-right:15px;
}
.headerline span:after {
left:100%;
margin-left:15px;
}

/* MEDIA QUERIES */

@media (min-width:960px)  {

body {
min-width:960px;
}
.desk--full-width{
width:100%;
}

.desk--half-width{
min-width:50%;
}

.desk--is-hidden{
display:none;
}

}

/************* branded login *******************/

.brand__pane{
padding-bottom:1em;
width:100%;
color:#8E8E8E;
}

.brand__pane .brand__logo{
display:inline-block;
float:left;
width:100%;
text-align:center;
margin-left:auto;
margin-right:auto;
}

.brand__pane .channel__logo{
/*background-color:white;*/
border:none !important;
}

.brand__pane .brand__logo__in{
display:inline-block;
margin-bottom:10px;
}

.brand__pane .brand__title{
color:#000;
display:block;
font-size:2.5em;
line-height:1em;
padding-bottom:20px;
}

.brand__pane .brand__help{
font-size:0.9em;
width:100%;
padding:15px 0 5px;
display:inline-block;
}

/************* message banner *******************/

.maintenancebanner,
.promobanner{
border-bottom:1px solid red;
background-color:#000;
}

.maintenancebanner .center,
.promobanner .center{
text-align:center;
min-height:25px;
line-height:1.2em;
font-size:14px;
}

.promobanner .center{
padding-right:5px;
}

.maintenancebanner .bottom,
.promobanner .bottom{
display:none;
}

.maintenancebanner .center span,
.promobanner .center span{
color:#D7D7D7;
padding:5px 2px 2px 25px;
display:inline-block;
}

.maintenancebanner .center a,
.promobanner .center a{
color:#FFBB00;
margin-left:5px;
text-decoration:underline;
display:inline;
}

.maintenancebanner .center span{
background:transparent url(../img/platform/warning.png) 0 0 no-repeat;
}

.promobanner .center span{
background:transparent url(../img/platform/infoGrey.png) 2px 2px no-repeat;
}

.promobanner a.closepromo {
cursor:pointer;
position:absolute;
top:5px;
right:5px;
}

.privacybanner, .appPromoBanner {
position:fixed;
z-index:1000;
bottom:0;
left:0;
right:0;
width:100%;
margin:0 auto;
box-sizing:border-box;
font-size:0.75em;
color:#5f738e;
background-color:#dee3eb;
padding:0.75em;
text-align:center;
}

.privacybanner p{
margin:0 45px 0 15px;
}

.privacybanner .agreePolicy, 
.appPromoBanner .closeAppPromoBanner{
position:absolute;
top:13px;
right:10px;
cursor:pointer;
min-width:35px;
height:30px;
line-height:1.4em;
font-size:1.4em;
font-weight:300;
border:1px solid #5f738e;
background:#5f738e;
padding:.1em;
color:#fff;
border-radius:.125em;
z-index:5;
}

.privacybanner .agreePolicy:hover {
cursor:pointer;
}

.expiredbanner {
position:absolute;
top:0;
text-align:center;
font-size:50px;
width:100%;
background-color:#ff000055;
height:140px;
padding-top:25px;
}

/************* kw filter *******************/

.kwFilter{
float:left;
display:block;
border:solid transparent;
border-width:1px 1px 1px 12px;
-webkit-border-image:url('../img/channel/keyword.png?v3') 1 1 1 12;
-o-border-image:url('../img/channel/keyword.png?v3') 1 1 1 12;
border-image:url('../img/channel/keyword.png?v3') 1 1 1 12;
border-color:transparent;
}

.kwFilter.kw_s{
-webkit-border-image:url('../img/channel/keywordSeg.png?v3') 1 1 1 12;
-o-border-image:url('../img/channel/keywordSeg.png?v3') 1 1 1 12;
border-image:url('../img/channel/keywordSeg.png?v3') 1 1 1 12;
}

.kwFilter span {
background-color:#E0E9EC;
max-width:300px;
float:left;
overflow:hidden;
text-overflow:ellipsis;
}

.kwFilter.kw_s span{
background-color:#F0E5CE;
}

.kwFilter span:hover{
color:#000;
}

.filterPane .kwFilter{
padding:0px;
margin:3px 9px 0px -6px;
color:#2d2d2d;
font-size:12px;
line-height:18px;
}

.filterPane .kwFilter span{
padding:0px 5px 1px 4px;
}

.filterPane .kwFilter span::after{
content:"\2715";
font-size:12px;
font-weight:bolder;
line-height:9px;
color:#000;
padding:0 0 0 6px;
color:#2caed3;
vertical-align:middle;
} 
.filterPane .kwFilter span:hover::after{
color:#000;
}

/* Player toolbar */
.player_toolbar {
height:50px;
width:100%;
display:block;
border:1px solid #777;
border-top:none;
font-weight:normal;
-webkit-tap-highlight-color:rgba(0,0,0,0);
background-color:#38373c;
position:relative;
}
.player_toolbar .centertoolbar{
  display: flex;
  justify-content: center;
  column-gap: 30px;
  margin: 0 auto;
}

.player_toolbar a{
  display: flex;
  align-items: center;
  margin: 13px 0;
  column-gap: 10px;
  cursor: pointer;
}
.player_toolbar a.disabled {
  pointer-events: none;
  filter: grayscale(1);
}
.player_toolbar a:hover img{
  filter: brightness(2) grayscale(1);
} 
.player_toolbar img{
  height: 24px;
} 

/*****MERGING channel.css AND channelmobile.css ************************************************************************************/

.toolbar{
height:50px;
width:100%;
display:block;
border:1px solid #ccc;
border-top:none;
font-weight:normal;
-webkit-tap-highlight-color:rgba(0,0,0,0);
background-color:#eee;
position:relative;
}

@media (max-width:480px)  {  
.toolbar .icon { 
width:40px;
text-indent:-10000px; 
}
}

.player .favPane .favContentPane,
.player .splPane .splContentPane{
float:left;
padding:0px 20px;
margin-top:-7px;
min-height:42px;
}

.player .favPane .favContentPane span,
.player .splPane .splContentPane span{
width:100%;
float:left;
}

.player .favPane.toolPane .toolPaneContent,
.player .splPane.toolPane .toolPaneContent{
padding:15px 0 6px;
}

.toolbar .centertoolbar{
display:table;
margin:0 auto;
} 

@media (max-width:600px)  {
  .toolbar .icon { 
  width:40px;
  text-indent:-10000px; 
  }
}

.toolbar .icon--delete{
position:relative;
}

.toolbar .icon--thumbnail {
position:absolute;
left:0;
bottom:0;
}

.toolbar .centertoolbar div{
display:inline-block;
} 

.toolbar .tbUPane{
display:inline;
}

.toolPane {
display:none;
width:100%;
}

.toolPane.reportPane.visibleByDefault {
 display:block;/*Must be visible by default to dispaly POWER BI dashboard*/
}

#sharePopupPane .toolPane {
display:block;
background:transparent;
border-bottom:none;
}

.content--mydartfish--grey .toolPane{
border-bottom:1px solid #5c5b64;
background:#5c5b64;
margin-bottom:10px;
}

.toolPane .toolPaneContent{
padding:15px 0;
position:relative;
float:left;
width:100%;
border:1px solid #ccc;
border-top:none;
}

.toolPane .button{
margin:2px 8px 0 0;
}

.changePane{
display:none;
position:absolute;
top:23px;
right:60px;
}

.changePaneContent{
text-align:right;
font-size:0.9em;
border-left:1px solid #CCCCCC;
border-top:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
}

.templatePane{
padding:1px 6px 2px;
background-color:#FFFFFF;
border-bottom:1px solid #CCCCCC;
}

.changeclicked{
background-color:#EEEEEE;
border-left:1px solid #CCCCCC;
border-top:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
margin-top:-1px;
margin-left:-1px;
padding-right:5px!important;
}

/* Progress bar start */
.progressbar_wrapper {
    background: #ffba00;
}

.progressbar_container {
padding: 20px 10px;
display: flex;
justify-content: space-between;
}


.progressbar_item {
    flex: 1;
    width: 100%;
    text-align: center;
}

.progressbar_item p {
    height: 100%;
    margin: 15px 5px 0px 5px;
    flex-wrap: wrap;
    font-size: 16px;
}

.progressbar_circle {
    --circle_radius: 4px;
    position: relative;
    margin: auto;
    width: calc(var(--circle_radius) * 2);
    height: calc(var(--circle_radius) * 2);
    border-radius: var(--circle_radius);
    background: black;
    z-index: 9;
}


.progressbar_selected {
    --circle_radius: 12px;
    position: relative;
    margin: auto;
    width: calc(var(--circle_radius) * 2);
    height: calc(var(--circle_radius) * 2);
    border-radius: var(--circle_radius);
    background: white;
    z-index: 8;
    top: calc(0px - var(--circle_radius) - 4px);
}


.progressbar_bar {
    top: 2px;
    height: 4px;
    width: calc(50% - 7px);
    background: white;
}

.progressbar_bar.left {
    position: relative;
    float: left;
    z-index: 0;
    border-start-end-radius: 2px;
    border-end-end-radius: 2px;
}

.progressbar_bar.hidden {
    visibility: hidden !important;
}

.progressbar_bar.right {
    position: relative;
    float: right;
    z-index: 1;
    border-start-start-radius: 2px;
    border-end-start-radius: 2px;
}

.progressbar_circle_container {
    padding: 2px 0px;
    height: 1px;
}
/* Progress bar end */


/* Playlist info in player */
.playlistsaved .formSuccess {
  background-color: transparent;
  border: none;
  color: white;
  margin: 0;
  padding: 5px;
  padding-left: 60px;
}
.playlistsaved {
  padding: 10px 60px 10px 20px;
  border: 1px solid #777;
  border-top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.playlistsaved input {
  border: none;
  background: transparent;
  color: #ffba00;
  font-family: inherit;
  font-size: inherit;
}
.playlistsaved input:hover {
  color: white;
}
.playlistsaved .savedcross {
  min-height: 0;
  padding: 0;
  margin-left: 10px;
  color: #ffba00;
  background: transparent;
  border: none;
  font-size: 1.5rem;
  position: absolute;
  right: 20px;
}
.playlistInfo {
padding:15px 20px 30px;
width:100%;
overflow:auto;
color:white;
border:1px solid #777;
border-top:none;
}
.playlistInfo .playlistPane > div {
  padding: 10px 0;
}
.playlistInfo .playlistPane > div:not(:last-child) {
  border-bottom: 1px solid #777;
}
.playlistInfo .playlistHeader,
.playlistInfo .playlistBody {
  overflow: auto;
  word-break: break-word;
}
.static_playlist_info .placeholder,
.playlistInfo .playlistBody .placeholder {
  color: #aaa;
  font-style: italic;
}
.playlistInfo .playlistHeader .inplaceeditpane {
float:left;
max-width:780px;
font-size:24px;
line-height:22px;
word-wrap:break-word;
min-height:32px;
}
.playlistInfo .bold {
  font-family: ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}
.playlistInfo .title {
  font-size: 24px;
  line-height: 22px;
}
.playlistInfo .right {
  float: right;
}

/* Match info in player */
.matchInfo{
padding:15px 20px 30px;
width:100%;
overflow:auto;
color:#222;
border:1px solid #ccc;
border-top:none;
}

.matchInfo .matchHeader{
padding:6px 0 25px 0;
overflow:auto;
position:relative;
left:-2px;
}

.playlist .matchInfo .matchHeader{
padding:6px 0 15px 0;
}

.matchInfo .matchHeader .inplaceeditpane{
float:left;
max-width:780px;
font-size:24px;
line-height:22px;
word-wrap:break-word;
min-height:32px;
}

.matchInfo .matchHeader .inplaceeditpane span {
word-break:break-all;
}

.matchInfo .matchHeader .inplaceedittextbox{
max-width:700px;
min-width:200px;
line-height:20px;
height:32px;
margin:0 8px 0 0;
float:left;
font-family:inherit;
font-size:24px;
}

.matchInfo .matchHeader input.inplaceedittextbox{
padding:2px 1px;
min-height:32px;
}

.matchInfo .matchHeader .icon--edit {
top:-3px;
transform:scale(1.2);
}

.matchInfo .matchHeader .inplaceedittextbox::-ms-clear {
width :0;
height:0;
}

.matchInfo .matchSubHeader {
border-bottom:1px solid #eee;
float:left;
width:100%;
}

.matchInfo .matchMetadata{
float:left;
}

.matchInfo .matchSubtools{
float:right;
margin-right:-10px;
margin-top:-10px;
}

.matchInfo .inplaceeditsavepane{
margin-top:7px;
height:25px;
float:left;
}

.matchInfo .matchViews{
float:right;
margin-top:8px;
}

.matchInfo .matchDuration,
.matchInfo .matchColl,
.matchInfo .matchKw{
width:100%;
float:left;
display:block;
}

.matchInfo .matchDuration .durTitle,
.matchInfo .matchColl .collTitle,
.matchInfo .matchKw .kwTitle{
float:left;
display:block;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
padding-right:3px;
}

.matchInfo .matchKw .kwTitle{
margin-top:4px;
}

.matchInfo .matchColl a{
float:left;
white-space:nowrap;
}

.matchInfo .matchColl .button{
margin:-1px 5px 0 5px;
}

.matchInfo .matchColl .icon--edit {
height:20px;
top:-11px;
transform:scale(0.8);
margin-left:-3px;
}

.matchInfo .matchPubDate{
display:block;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.matchInfo .matchModDate, .matchInfo .itemsCount{
display:block;
}

.playlist .matchInfo .matchModDate, .matchInfo .itemsCount{
font-size:1.1em;
}

.matchInfo .matchModDate, .matchInfo .itemsCountRights{
display:block;
font-size:0.7em;
color:#777;
}

.matchInfo .matchDescPane{
float:left;
display:block;
width:100%;
word-wrap:break-word;
padding:18px 0;
text-align:justify;
}

.matchInfo .matchDescPane .inplaceedittextbox{
min-width:100%;
max-width:100%;
resize:vertical;
font-family:inherit;
font-size:inherit;
line-height:inherit;
min-height:100px;
}

.player .matchInfo .matchDescPane .emptyValue{
font-style:italic;
}

.matchDescPane .icon--edit{
display:inline;
}

.descContentPane {
clear:both;
}

.matchDatePane{
padding-bottom:10px;
float:left;
}

.commentPane{
float:left;
display:block;
width:100%;
word-wrap:break-word;
padding:5px 0;
border-top:1px solid #eee;
}

.commentPane .comment {
width:100%;
float:left;
font-size:0.8em;
padding-bottom:20px;
}

.commentPane .comment .comLogin{
width:100%;
float:left;
}

.commentPane .button{
margin:11px 0 10px;
float:left;
display:block;
}

.commentHeader {
width:100%;
height:30px;
margin-bottom:5px;
}

.commentHeader .cAvatar {
float:left;
margin-right:10px;
}

.commentHeader .cUser {
font-weight:bold;
font-size:0.8em;
margin-top:0px;
float:left;
}

.commentHeader .cDate {
font-size:0.8em;
margin-top:-4px;
float:left;
}

.commentHeader .cDate b {
font-weight:normal;
}

.player .attach-button-pane{
position:relative;
float:left;
}

.player .matchSubtools .attach-count{
width:16px;
height:16px;
position:absolute;
bottom:11px;
right:13px;
}

.player .matchSubtools .attach-count span {
border-radius:50%;
background-color:#898787;
position:absolute;
top:0;
bottom:0;
width:100%;
display:flex;
align-items:center;
justify-content:center;
font-size:11px;
color:white;
}

.player .matchSubtools .attach-count span.highlight{
background-color:#ff0000;
}

.player .subToolPane {
display:none;
float:left;
width:100%;
border-bottom:1px solid #eee;
padding:18px 0 18px;
clear:both;
word-wrap:break-word;
}

.player .subToolPane .subToolTitle{
float:left;
display:block;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
margin-bottom:10px;
}

.player .subToolPane .attachList{
position:relative;
overflow:hidden;
display:block;
width:100%;
padding:0.5em 0 0;
min-height:26px;
}

.icon--delete--attachment{
float:right;
position:relative;
height:20px;
width:20px;
}

.icon--delete--attachment::before{
background-size:120px 2080px !important;
background-position:-10px -1090px !important;
}

.icon--delete--attachment:hover::before {
background-position:-50px -1090px !important;
}

div.addAttachment{
position:relative;
margin-top:10px;
padding:0 !important;
}

div.addAttachment:hover{
cursor:pointer;
}

div.addAttachment input{
position:absolute;
display:block !important;
width:100% !important;
height:100% !important;
opacity:0 !important;
overflow:hidden !important;
opacity:0 !important;
margin:0 !important;
}

div.addAttachment label,
div.addAttachment span{
display:block;
padding:2px 10px 3px;
}

.attachFilePicker {
margin:0 !important;
}

#attachloader{
padding:0 !important;
}

#attachloader.loader{
border:none;
}

.player .printPane{
float:left;
display:block;
width:100%;
padding:8px 0 10px;
}

.player .printLay{
width:60px;
float:left;
display:block;
padding-right:20px;
}

.player .printLay .layImg{
float:left;
display:block;
width:50px;
height:58px;
overflow:hidden;
}

.player .printLay .layImg.layout0{     background:url(../img/print/allTemplates.png)  0px 0 no-repeat;   background-size:252px 56px; }
.player .printLay .layImg.layout1{     background:url(../img/print/allTemplates.png) -50px 0 no-repeat;  background-size:252px 56px; }
.player .printLay .layImg.layout2{     background:url(../img/print/allTemplates.png) -100px 0 no-repeat; background-size:252px 56px; }
.player .printLay .layImg.layout3{     background:url(../img/print/allTemplates.png) -150px 0 no-repeat; background-size:252px 56px; }
.player .printLay .layImg.layout4{     background:url(../img/print/allTemplates.png) -200px 0 no-repeat; background-size:252px 56px; }

.player .csvHeader{
width:100%;
margin-bottom:-15px;
margin-left:-10px;
}

.player .csvHeader a.selected{
color:#000;
}

.player .csvPane, .player .printContentLay{
display:block;
float:left;
width:100%;
/*border-top:1px solid #eee;*/
}

.player .printContentLay{
margin-bottom:10px;
}

.player .printFormField span{
padding-left:8px;
font-size:0.8em;
}

.player .csvPane span{
display:block;
width:100%;
float:left;
}

.player .csvPane .csvContentPane{
display:none;
width:100%;
margin-top:15px;
}

.player .csvPane .button,
.player .csvPane .beauton{
margin:15px 0 5px;
}

.player .csvPane .csvScene{
margin-top:10px;
float:left;
}

.player .csvPane a.fileLink {
  float:left;
  width:100%;
}

.player .csvPane a.scene.fileLink{
font-size:13px;
}

.player .subToolPane input {
margin-left:16px;
}

.no-silverlight-plugin{
padding:10px;
color:#fff;
}

.no-silverlight-plugin h3{
font-size:26px;
}

.no-silverlight-plugin .grid__item{
padding:20px;
width:46%;
margin:2%;
border:1px solid #777;
background-color:#666;
border-radius:2px;
min-height:260px;
}

.grid__item--disabled {
color:#aaa;
}

.beauton.html5switch{
display:inline-block;
background-image:url("../img/channel/pictos/sleditswitch.png");
background-repeat:no-repeat;
padding:0.5em 20px 0.5em 40px;
background-position:3px 2px;
background-color:#111;
}

.matchKw{
padding:7px 0;
border-bottom:1px solid #eee;
}

.matchKw .kwFilter {
line-height:20px;
height:23px;
font-size:14px;
margin:5px 5px 5px 0;
}

.matchKw .kwFilter span {
padding:0px 10px 1px 6px;
max-width:none;
}

.player .fullHD {
background:transparent url(../img/channel/pictos/logoFullHD.png) no-repeat right center;
padding-left:40px;
float:right;
height:27px;
}

/* embed Report */
.embedReport {
position:relative;
background:#fff;
/*border-bottom:1px solid #eee;*/
float:left;
width:100%;
/*display:none;*/
}

.embedReport #reportLoader {
text-align:center;
/*background:#e8e8e8;*/
position:absolute;
width:100%;
height:100%;
z-index:2;
padding:0;
border:none;
min-height:200px;
}

.embedReport .createReportPane {
text-align:center;
min-height:200px;
}

.embedReport .createReportPane .createReportButton{
margin:80px 0 0;
}

.player .embedReport .reportHeader {
margin-top:-2px;
}

.embedReport .reportTools {
float:right;
font-size:14px;
cursor:pointer;
padding:5px 10px 10px 0;
position:relative;
}

.player .embedReport .reportTools {
padding:0px 60px 10px 0;
}

.embedReport .reportTools div{
float:right;
margin-top:-5px;
}

.embedReport .reportTitle {
padding:10px;
float:left;
font-family:ClearSans-Bold,Helvetica neue,Helvetica,Arial,Verdana,sans-serif;
}

.embedReport .reportStatusPane {
width:100%;
float:left;
position:relative;
}

.embedReport .reportStatus {
display:block;
margin:0 auto;
padding:10px 0 20px 0;
color:red;
width:75%;
text-align:center;
}

.embedReport .reportKwFilter {
width:100%;
min-height:35px;
border-top:1px solid #eee;
border-bottom:1px solid #eee;
float:right;
padding:0 5px 10px;
margin:-5px 0;
}

.embedReport .reportKwFilter .reportNoKw {
font-size:12px;
float:right;
padding:7px 5px 8px;
color:grey;
}

.embedReport .matchKw {
border:none;
padding:0;
}

.embedReport .matchKw a {
float:right;
}

.embedReport #embedContainer {
display:block;
width:100%;
/*height:100vh;*/
min-height:200px;
overflow:hidden;
border-bottom:1px solid #eee;
}

/* required for white background in fullscreen */
.embedReport #embedContainer iframe {
background-color:#fff;
}

.reportContentPane .reportFooter {
width:100%;
float:left;
text-align:center;
height:20px;
padding:9px 10px 0 10px;
color:darkgrey;
font-size:10px;
}

.reportContentPane .reportDate {
float:right;
}

.reportContentPane .reportSource {
float:left;
}

.reportContentPane .reportNote {
width:100%;
float:left;
text-align:center;
padding:10px;
color:darkgrey;
font-size:11px;
}

/*promo*/
.promocontent {
  border:1px #5c5b64 solid;
  margin-top:10px;
  text-align:center;
  float:left;
  margin-left:10px;
}

.promotitle {
color:#666666;
font-size:16px;
font-weight:bold;
height:130px;
line-height:130px;
width:220px;
text-align:center;
position:relative;
}

.promotitle span {
line-height:normal;
}

.promosubtitle {
background-color:#5c5b64;
padding:10px 12px;
}

.beauton--promo {
width:100%;
color:#000 !important;
font-weight:bold;
font-size:16px;
}

.beauton--promo:hover {
color:#000 !important;
}

.kwdatapane {
overflow-x:auto;
text-align:center;
min-height:100px;
}

table.kwtable {
border-collapse:collapse;
margin:10px auto;
font-size:14px;
}

table.kwtable th{
border:1px solid grey;
background-color:#aaa;
padding:2px;
font-size:0.9em;
max-width:100px;
word-wrap:break-word;
}
table.kwtable th:hover{
cursor:pointer; 
background-color:#444;
color:#ddd;
}
table.kwtable th.selected::after {
content:" \25BC";
}
table.kwtable th:first-of-type.selected::after {
content:" \25B2";
}
table.kwtable th.selected:hover {
cursor:default; 
background-color:#aaa;
color:#222;
}

table.kwtable td{
border:1px solid grey;
text-align:center;
}

table.kwtable tr td:first-of-type{
background-color:#ddd;
padding:0 1px;
text-align:left;
font-size:0.8em;
}

table.kwtable tr:last-of-type td{
background-color:#aaa;
padding:2px;
font-size:0.9em;
}
table.kwtable tr:last-of-type td a{
color:#222;
}

table.kwtable td.n-d{
background-color:#eee;
}

/**** Collaborator list  ***/
.collab_list {
  margin-bottom: 10px;
  height: 390px;
  border: 1px solid #aaa;
  overflow: auto;
}
.collab_list .collab_item {
  padding: 5px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.collab_list .collab_item .collab_item_data {
  display: flex;
  column-gap: 10px;
  align-items: center;
}
.collab_list .collab_item .collab_delete {
  min-height: 0;
  height: 20px;
}
.collab_list .collab_item .collab_delete:hover {
  filter: brightness(2);
}
.playlistColl__popup .shareTextBox {
font-size:14px;
color:#ccc;
border:1px solid #D7D7D7;
width:260px;
max-width:100%;
min-height:32px;
float:left;
border-radius:0px;
background: #48474c;
}

.playlistColl__popup .shareTextBox input {
min-height:32px;
}
.playlistColl__popup .beauton.shareClipboard {
  position:relative;
  display:block;
  float:left;
  cursor:pointer;
  margin-left:-1px;
  margin-right:0px;
  height:32px;
  line-height:20px;
}
.playlistColl__popup .shareBlock {
  display: inline-block;
}
.playlistColl__popup .data_text {
  font-size: 14px;
}
.playlistColl__popup a.shareReset {
width:auto;
height:auto;
font-size:14px;
margin:3px 0 0 20px;
background:none;
}
.playlistColl__popup .ccStatus {
float:left;
width:100%;
min-height:26px;
font-style:italic;
font-size:14px;
color:green;
padding:0 3px;
}

.playlistColl__popup .shareIcon a {
position:relative;
content:" ";
display:block;
z-index:1;
background-size:225px 3900px;
background-image:url(../img/channel/channelPictos.svg?v21);
width:48px;
height:48px;
float:left;
margin-right:10px;
cursor:pointer;
}
.playlistColl__popup .shareIcon .shareBlock {
margin-top:10px;
float:left;
width:48px;
margin-right:10px;
margin-right:25px;
}

.playlistColl__popup .shareIcon .shareBlock span {
float:left;
font-size:12px;
text-align:center;
width:100%;
}

/**** headlines  ***/

.headline .desc .picto{
display:block;
height:2.3em;
width:37px;
position:absolute;
bottom:1em;
left:0.15em;
}

.headline a.video .desc .picto{
background:transparent url(../img/channel/pictos/headlines/video.png) right center no-repeat;
}
.headline a.event .desc .picto{
background:transparent url(../img/channel/pictos/headlines/keyword.png) right center no-repeat;
}
.headline a.keyword .desc .picto{
background:transparent url(../img/channel/pictos/headlines/keyword.png) right center no-repeat;
}
.headline a.subscription .desc .picto{
background:transparent url(../img/channel/pictos/headlines/subscription.png) right center no-repeat;
}
.headline a.tree .desc .picto{
background:transparent url(../img/channel/pictos/headlines/tree.png) right center no-repeat;
}
.headline a.explore .desc .picto{
background:transparent url(../img/channel/pictos/headlines/explore.png) right center no-repeat;
}

.headline a.howto .picto{
color:#fff;
background:#2caed3 url(../img/channel/pictos/headlines/howto.png) 177px center no-repeat;
}



/* PORTAL */

.grid--thumbnails {
padding:5px 0;
margin-left:-5px;
margin-right:-5px;
}

.trash .grid--thumbnails,
.organizer .grid--thumbnails {
padding:5px;
margin:0;
}

.portal .colleft h3 {
padding:15px 15px 0;
}
.portal .colleft .item {
padding:15px 15px 30px 15px;
margin-bottom:5px;
border-bottom:1px solid #eee;
}
.portal .colleft .item:last-of-type {
border-bottom:none;
}

.portal .in {
float:right;
padding:33px 15px 0;
font-size:0.8em;
text-transform:lowercase;
}
.portal .in a {
text-transform:none;
}

.portal .metainfos {
float:left;
}

.portal .metainfos > a {
font-size:26px;
line-height:1;
padding:8px 8px 5px 0;
display:inline-block;
}

.metainfos > span {
font-size:0.8em;
}

.staticplaylist .pageheader {
  width: 100%;
}
.content .staticplaylist .pageheader,
.content .staticplaylist .channelheader {
  padding-right: 0;
  padding-left: 0;
}
.content .staticplaylist .pageheader .headertools {
  width: min-content;
}

#itemContextMenu {
  position: absolute;
  display: none;
  background: #58575c;
  border: 1px solid #bbb;
  z-index: 100;
}

#itemContextMenu > div {
  display: flex;
  flex-direction: column;
}

#itemContextMenu input {
  border: none;
  background: transparent;
  margin: 0;
  color: white;
  text-align: start;
  background-repeat: no-repeat;
  padding-left: 44px;
  padding-right: 15px;
  min-height: 0;
  cursor: pointer;

  background-size: 24px 24px;
  background-position-x: 8px;
  background-position-y: 6px;

  height: 36px;
}
#itemContextMenu input.disabled {
  color: #aaa;
  pointer-events: none;
}

#itemContextMenu input:hover {
  background-color: #716f76;
}

#playlistitemsgridwrapper {
  clear: both;
  max-height: 700px;
  overflow-y: auto;
}

.staticplaylist .warning_bar {
  width: 100%;
  background: #edc5ce;
  color: red;
  display: flex;
  justify-content: space-between;
  padding: 5px 10px;
}

.staticplaylist .warning_bar a {
  color: red;
  margin: auto 0;
}

.staticplaylist .warning_bar span {
  margin: auto 0;
}

.static_playlist_info.open .static_playlist_detailed > img {
  display: block;
  margin-top: 5px;
}

.static_playlist_info .name_zone {
  display: flex;
  column-gap: 10px;
  font-size: 1.2rem;
}
.static_playlist_info .name_zone .inplaceeditbutton,
.static_playlist_info .name_zone .title_rename {
  display: none;
}
.static_playlist_info .name_zone.edit .inplaceeditbutton {
  display: block;
}
.static_playlist_info .name_zone.edit .title_rename {
  display: block;
  min-height: 0;
  padding: 11px 5px;
  background: #58575c;
  color: white;
  width: 440px;
}
.static_playlist_info .name_zone.edit .rename_button,
.static_playlist_info .name_zone.edit .title {
  display: none;
}

.static_playlist_info input[type=image]:hover {
  filter: brightness(0.2);
}
.static_playlist_info input[type=image] {
  height: 18px;
  min-height: 0px;
  display: inline;
  margin-left: 10px;
}
.static_playlist_info .title {
  line-height: 1;
}
.static_playlist_info .created {
/*  font-size: 0.9rem;
  color: #bbbbbb;*/
}
.static_playlist_info .static_playlist_text {
  display: block;
  width: 100%;
}
.static_playlist_info .static_playlist_detailed {
  display: none;
}
.static_playlist_info.open .static_playlist_detailed {
  display: flex;
  margin-top: 10px;
  margin-bottom: 30px;
  column-gap: 10px;
}
.static_playlist_info.open .static_playlist_text .description_zone.edit {
  display: flex;
  column-gap: 10px;
}
.static_playlist_info.open .static_playlist_text .description_zone.edit span {
  display: none;
}
.static_playlist_info .static_playlist_text .description_zone {
  margin-top: 10px;
}
.static_playlist_info .static_playlist_text textarea {
  width: 100%;
  resize: none;
  background: #48474c;
  color: #bbbbbb;
  font: inherit;
  font-size: 0.9rem;
  border: none;
}
/*.static_playlist_info .static_playlist_text .description_zone.edit span,*/
.static_playlist_info .static_playlist_text .description_zone.edit .modify_description_button,
.static_playlist_info .static_playlist_text .description_zone textarea,
.static_playlist_info .static_playlist_text .description_zone .inplaceeditbutton {
  display: none;
}
.static_playlist_info .static_playlist_text .description_zone .inplaceeditbutton {
  flex-shrink: 0;
}
.static_playlist_info .static_playlist_text .description_zone.edit .inplaceeditbutton {
  display: block;
}
.static_playlist_info .static_playlist_text .description_zone span {
  max-height: 85px;
  overflow-y: auto;
  display: inline;
  -ms-overflow-style: none;
  scrollbar-width: none;
  word-break: break-word;
}
.static_playlist_info .static_playlist_text .description_zone span::-webkit-scrollbar {
  display: none;
}
.static_playlist_info .static_playlist_text .description_zone.edit textarea {
  width: 100%;
  background: #58575c;
  color: white;
  font: inherit;
  font-size: 0.9rem;
  border: solid 1px #b3b3b3;
  resize: vertical;
}
.static_playlist_info .static_playlist_text textarea:focus-visible {
  outline: none;
}

.static_playlist_action {
  margin-top: 20px;
}
.static_playlist_action .actions {
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 4px 10px 0 10px;
  column-gap: 10px;
  cursor: default;
}
.static_playlist_action.delete .actions {
  display: none;
}
.static_playlist_action .delete_confirmation {
  display: none;
}
.static_playlist_action.delete .delete_confirmation {
  display: flex;
  column-gap: 10px;
}
.static_playlist_action input{
  height: 25px;
  min-height: 0;
}
.static_playlist_action input:hover{
  filter: brightness(0.2);
}


.playlistkind_select {
  display: flex;
  column-gap: 20px;
}
.playlistcollections .playlistkind_select input {
  min-height: 0;
  padding: 0;
  border-radius: 0;
  padding-bottom: 5px;
  border: none;
  border-bottom: solid 4px transparent;
  cursor: pointer;
  color: #ffba00;
  background: none;
  font-size: inherit;
}
.playlistcollections .playlistkind_select input:hover {
  color: white;
}
.playlistcollections .playlistkind_select input.selected {
  color: white;
  border-color: #ffba00;
  pointer-events: none;
}
/* Grid for static playlist items manage */
.playlist_items_grid {
  overflow-x: auto;
  table-layout: fixed;
  width: max-content;
  min-width: 100%;
}
.playlist_items_grid .cantplay {
  color: #aaa;
}
.playlist_items_grid tbody tr:first-child {
  position: sticky;
  position: -webkit-sticky;
  left: 0;
  z-index: 2;
  top: 0;
}
.playlist_items_grid tbody th {
  position: sticky;
  position: -webkit-sticky;
  background: inherit;
  top: 0;
  z-index: 1;
  color: #bbb;
}
.playlist_items_grid tbody tr:first-child th:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  border-bottom: 1px solid #888;
}
.playlist_items_grid .col_index {
  background: inherit;
  position: sticky;
  left: 0;
  z-index: 1;
}
.playlist_items_grid .col_index:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border-right: 1px solid #888;
}
.playlist_items_grid tr {
  min-height: 26px;
  background: #48474c;
  height: 100%;
}
/*.playlist_items_grid tr:first-child {
  border-bottom: solid 1px #888;
}*/
.playlist_items_grid td,
.playlist_items_grid th {
  padding-right: 5px;
}

.playlist_items_grid tr:nth-child(odd) {
  background: #58575c;
}
.playlist_items_grid tr.grabbed,
.playlist_items_grid tr:not(:first-child):not(.grabbed):hover {
  background: #716f76;
}
.playlist_items_grid .col_index {
  width: 50px;
}
.playlist_items_grid th.col_index {
  z-index: 2;
  text-align: center;
}
.playlist_items_grid tr .col_index .item_index {
  display: block;
  text-align:center;
}
.playlist_items_grid tr .col_index .item_grab {
  display: none;
  height: 20px;
  filter: grayscale(1) brightness(2);
}
.playlist_items_grid.editable tr.grabbed .col_index .item_index,
.playlist_items_grid.editable tr:not(.grabbed):hover .col_index .item_index {
  display: none;
}
.playlist_items_grid.editable tr.grabbed .col_index .item_grab,
.playlist_items_grid.editable tr:hover .col_index .item_grab {
  display: flex;
}
.playlist_items_grid.editable tr:hover .col_index {
  cursor: grab;
}
.playlist_items_grid .name_container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 26px;
}
.playlist_items_grid .col_name {
padding-left: 5px;
max-width: 643px;
min-width: 643px;
}
.playlist_items_grid .col_added {
  width: 250px;
  max-width: 250px;
}
.playlist_items_grid .added_container {
  display: flex;
  justify-content: space-between;
}
.playlist_items_grid .added_container span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.playlist_items_grid .added_container img {
  height: 24px;
}
.playlist_items_grid .name_container input[type=image] {
  height: 20px;
  min-height: 0;
  filter: brightness(1.5);
}
.playlist_items_grid .name_container input[type=image]:hover {
  filter: brightness(0.2);
}
.playlist_items_grid .name_container .manage_container {
  height: 20px;
  margin: auto 0;
  column-gap: 10px;
  margin-right: 10px;
  display: none;
  pointer-events: none;
}
.playlist_items_grid .name_container > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.playlist_items_grid tr.selected .name_container .manage_container input.clicked {
  filter: brightness(0.2);
}
.playlist_items_grid.editable tr.selected .name_container .manage_container,
.playlist_items_grid.editable tr:not(.grabbed):hover .name_container .manage_container {
  display: flex;
  pointer-events: auto;
}
/*  */
#ht_playlist_more {
  position: fixed;
  z-index: 10;
  display: none;
  background: #58575c;
  border: 1px solid #bbb;
}
#ht_playlist_more.cm_opened {
  display: block;
}

#ht_playlist_more > div {
  display: flex;
  flex-direction: column;
}

#ht_playlist_more input {
  cursor: pointer;
  border: none;
  background: transparent;
  margin: 0;
  color: white;
  text-align: start;
  background-repeat: no-repeat;
  padding-left: 44px;
  padding-right: 15px;
  min-height: 0;

  background-size: 24px 24px;
  background-position-x: 8px;
  background-position-y: 6px;

  height: 36px;
}

#ht_playlist_more input:hover {
  background-color: #716f76;
}
/* Grid view list */
.gridview_list {
  font-size: 15px;
  overflow-x: auto;
  table-layout: fixed;
  width: max-content;
  min-width: 100%;
  max-width: 100%;
}
.gridview_list tr:nth-child(odd)
{
  background: #f5f5f5;
}
.content--mydartfish.content--mydartfish--grey .gridview_list tr:nth-child(odd)
{
  background: #58575c;
}

.gridview_list tr:not(:first-child):hover {
  background: #d0e5e8;
}
.gridview_list td,
.gridview_list th {
  padding-right: 5px;
}
.gridview_list tr {
  height: 24px;
  background: white;
}
.content--mydartfish.content--mydartfish--grey .gridview_list tr {
  background: #48474c;
}
.gridview_list tbody th {
  position: sticky;
  position: -webkit-sticky;
  background: inherit;
  top: 0;
  z-index: 1;
}
.gridview_list tbody th:first-child {
  position: sticky;
  position: -webkit-sticky;
  left: 0;
  z-index: 2;
}
.gridview_list tbody .col_parent{
  width: 390px;
  max-width: 390px;
  cursor: pointer;
}
.gridview_list.canmultiselect tr .col_index.selected .gridview__check,
.gridview_list tr .col_index .name,
.gridview_list.canmultiselect tr:hover .col_index .gridview__check {
  display: block;
}
.gridview_list.canmultiselect tr .col_index.selected .name,
.gridview_list.canmultiselect tr:hover .col_index .name,
.gridview_list tr .col_index .gridview__check {
  display: none;
}

.gridview__check {
position:absolute;
top:5px;
left:13px;
}

.gridview__check input[type="checkbox"] {
position:absolute;
opacity:0;
}

.gridview__check input[type="checkbox"] + label:before {
content:'';
position:absolute;
/*top:3px;*/
left:0;
width:12px;
height:12px;
border:2px solid #999;
border-radius:50%;
}
.gridview__check input[type="checkbox"]:checked + label:before {
background-color:#2caed3;
border-color:#2caed3;
box-shadow:0 2px 5px rgba(0,0,0,0.3);
-moz-box-shadow:0 2px 5px rgba(0,0,0,0.3);
-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.3);
}

.content--mydartfish.content--mydartfish--grey .gridview__check input[type="checkbox"]:checked + label:before {
background-color:#d6a219;
border-color:#d6a219;
}

.gridview__check input[type="checkbox"] + label:after {
content:'\2713';
position:absolute;
top:0;
left:3px;
font-size:13px;
line-height:16px;
color:#aaa;
}

.gridview__check input[type="checkbox"]:not(:checked) + label:after {
opacity:0;
}

.gridview_list.selectionmode tr:hover .gridview__check input[type="checkbox"]:not(:checked) + label:after,
.gridview__check input[type="checkbox"]:not(:checked):hover + label:after,
.gridview__check.hover input[type="checkbox"]:not(:checked) + label:after {
opacity:1;
}

.gridview__check input[type="checkbox"]:checked + label:after {
opacity:1;
color:#fff;
}


/* Segment grid view */
.segment_gridview .color_item {
  position: absolute;
  padding: 0;
  left: 35px;
}
.segment_gridview .color_item > div {
  position: relative;
}
.segment_gridview .color_item > div {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 5px;
  margin: 1px;
}
.segment_gridview tbody .col_position {
  min-width: 65px;
  cursor: pointer;
}
.segment_gridview tbody .col_duration {
  min-width: 70px;
  cursor: pointer;
}
.segment_gridview tbody .col_views {
  min-width: 70px;
  cursor: pointer;
}
.segment_gridview tbody .col_name {
  width: 215px;
}
.segment_gridview tbody .col_name > div {
  max-width: 215px;
}

.segment_gridview.selectionmode .sl_name_container,
.segment_gridview.selectionmode .parentname {
  pointer-events: none;
}

.segment_gridview tbody .col_index {
  background: inherit;
  position: sticky;
  position: -webkit-sticky;
  left: 0;
  z-index: 1;
  width: 40px;
  height: 0;
  padding: 0;
}
.segment_gridview .col_index {
  text-align: center;
}
.segment_gridview .col_index:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border-right: 1px solid #ccc;
}
.segment_gridview th:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  border-bottom: 1px solid #ccc;
}
@-moz-document url-prefix() {
  .segment_gridview tbody .col_index {
    height: 100%;
  }
}
.segment_gridview .col_index .index_container {
  position: relative;
  display: flex;
  height: 100%;
}
.segment_gridview .col_index .index_container > span {
  width: 100%;
  margin: auto;
  padding: 1px;
}
.segment_gridview .col_index .index_container .color_box {
  position: relative;
  top: 0;
  bottom: 0;
  margin: 2px 0;
  width: 5px;
}
.segment_gridview .col_created {
  width: 90px;
  position: relative;
}
.segment_gridview .sl_name_container {
  display: flex;
  justify-content: space-between;
  padding: 0 4px;
  overflow: hidden;
  white-space: nowrap;
  width: inherit;
  cursor: pointer;
}
.segment_gridview .sl_name_container:hover a,
.segment_gridview .sl_name_container.hovered a {
  color: black;
}
.segment_gridview tr .sl_name {
  height: 24px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.segment_gridview .parentname {
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.segment_gridview tr .sl_actions {
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 0px 10px 0 10px;
  column-gap: 10px;
  cursor: default;
}
.segment_gridview tr:hover .sl_actions {
  display: flex;
}
.segment_gridview tr:hover .sl_hidedonhover {
  display: none;
}
.segment_gridview .sl_actions .image_container {
  width: 24px;
}
.segment_gridview .sl_actions .extrait {
  width: 20px;
  height: 20px;
  float: right;
  margin: 2px 0;
  background-size: 100px 1735px;
  background-image: url(../img/channel/channelPictos.svg?v21);
  background-position: -8px -1108px;
}
.segment_gridview .sl_actions .extrait:hover {
  background-position: -41px -1108px;
}

.segment_gridview .sl_actions .play {
  height: 20px;
  margin: 2px 1px;
}
.segment_gridview .sl_actions input {
  height: 24px;
  min-height: 0;
  margin: auto 0;
  border-radius: 0;
}
.segment_gridview .sl_actions .play > img {
  height: 100%;
}
.segment_gridview .sl_actions input[type=image]:hover,
.segment_gridview .sl_actions .play:hover > img {
  filter: brightness(0);
}

/* Match list view */
.match_gridview tbody .col_index {
  background: inherit;
  position: sticky;
  position: -webkit-sticky;
  left: 0;
  z-index: 1;
  width: 45px;
  height: 0;
  padding: 0;
  text-align: center;
}
.match_gridview th:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  border-bottom: 1px solid #ccc;
}
.match_gridview .col_index:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border-right: 1px solid #ccc;
}
.match_gridview .col_name {
  width: 700px;
}
.match_gridview .col_name > div {
  cursor: pointer;
  width: inherit;
  padding: 0 4px;
}
.match_gridview .col_name > div a {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-all;
  display: block;
}
.match_gridview.selectionmode .col_name > div {
  pointer-events: none;
}
.match_gridview.selectionmode .col_name > div a {
  pointer-events: none;
}
.match_gridview.selectionmode tr {
  cursor: pointer;
}

.match_gridview .col_created {
  width: 80px;
}
.match_gridview .col_views {
  position: relative;
}

.match_gridview tr .actions {
  display: none;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 4px 10px 0 10px;
  column-gap: 10px;
  cursor: default;
}
.match_gridview tr:hover .actions {
  display: flex;
}


.match_gridview .name_container:hover a {
  color: black;
}
.content--mydartfish.content--mydartfish--grey .match_gridview .name_container:hover a {
  color: white;
}

.match_gridview tr:hover .hidedonhover {
  display: none;
}

/* list header */
.listheader {
  float: left;
  display: block;
  width: 100%;
  border-top: 1px solid #eee;
  padding: 1px 10px 0 10px;
  min-height: 30px;
}


.listheader.hidebar {
border-top:1px hidden #eee;
padding-top:2px;
}

.content--mydartfish.content--mydartfish--grey .listheader {
margin-top:5px;
border-top-color:#5c5b64;
}

.listheader.empty{
border-bottom:none;
}
  
.listheader .lhleft{
display:flex;
float:left;
padding-left:1px;
font-size:14px;
}

.listheader .lhright{
float:right;
padding:5px 1px 0;
display: flex;
column-gap: 10px;
}

.listheader .lhright.with-selector {
  padding-top: 2px;
}

.listheader .listnumber {
  color: #2d2d2d;
  font-size: 14px;
  line-height: 18px;
  display: block;
  text-align: left;
  margin: 0;
  padding: 5px 10px 5px 0;
  float: left;
}
.listheader .view_switch {
  display: flex;
}
.listheader .view_switch input {
  height: 22px;
  min-height: 0;
  margin: 0px;
  border: 1px solid #ccc;
  border-radius: 0;
}
.content--mydartfish.content--mydartfish--grey .listheader .view_switch input {
  border-color: #b3b3b3;
}
.listheader .view_switch input.active {
  background: #2caed3;
  pointer-events: none;
}
.content--mydartfish.content--mydartfish--grey .listheader .view_switch input.active {
  background: #a58430;
}
.listheader .view_switch input.left {
  padding: 1px 3px 1px 3px;
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px;
  border-right: none;
}
.listheader .view_switch input.right {
  padding: 1px 3px 1px 3px;
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
  border-left: none;
}


.listheader .listnumber.parenthesis {
  color: #2d2d2d;
  font-size: 14px;
  line-height: 18px;
  display: block;
  text-align: left;
  margin: 0;
  padding: 5px 0 0 0;
  float: left;
}

.listheader .listheader_selectall {
    font-size:14px;
    line-height:18px;
    display:block;
    text-align:left;
    margin:0;
    padding:5px 0px 5px 0;
    float:left;
}

.content--mydartfish.content--mydartfish--grey .listheader .listnumber {
color:#aaa;
}

.listheader select.sort{
float:right;
font-size:11px;
width:max-content;
margin-top:0;
padding:1px;
}

.listheader .progress{
color:#6b6a74;
position:absolute;
top:23px;
right:250px;
}

/* collection header */

.collectionheader{
padding:3px 15px 6px;
border-top:1px solid #eee;
float:left;
width:100%;
border-bottom:1px solid #eee;
margin-bottom:-1px;
}

.dashboard .collectionheader {
padding:3px 15px 3px;
margin-bottom:5px;
}

.collectionheader .colltypepane {
width:100%;
display:block;
}

.shareLinkPane .colltype,
.collectionheader .colltype {
display:inline-block;
min-height:20px;
line-height:20px;
-moz-background-size:20px auto !important;
-o-background-size:20px auto !important;
-webkit-background-size:20px auto !important;
background-size:auto 20px !important;
padding-left:25px;
margin:0 0 0 -4px;
}

.collectionheader .colltype {
font-size:14px;
}
.shareLinkPane .colltype.private, .collectionheader .colltype.private, .collection .colltype.private {
background:transparent url(../img/channel/collectionprivate.png) no-repeat 1px 0px;
padding-left:20px;
}

.shareLinkPane .colltype.limited,
.collectionheader .colltype.limited,
.collection .colltype.limited {
background:transparent url(../img/channel/collectionlimited.png) no-repeat 1px 2px;
}

.shareLinkPane .colltype.public,
.collectionheader .colltype.public,
.collection .colltype.public {
background:transparent url(../img/channel/collectionpublic.png) no-repeat 2px 2px;
}

.shareLinkPane .colltype.business,
.collectionheader .colltype.business,
.collection .colltype.business {
background:transparent url(../img/channel/collectionbusiness.png) no-repeat 0px 1px;
}

.collectionheader .colltypepane a{
min-height:20px;
line-height:20px;
padding-left:5px;
}

.collectionheader .description {
padding:10px 60px 10px 20px;
}

.collectionheader .inplaceeditpane{
float:left;
word-wrap:break-word;
margin-bottom:2px;
}

.collectionheader .inplaceedittextbox{
max-width:700px;
min-width:200px;
font-size:22px;
line-height:22px;
min-height:26px;
color:#867f70;
margin-right:10px;
}

.collectionheader .inplaceeditsavepane{
float:left;
margin-top:1px;
height:25px;
}
.static_playlist_info .playlistDetail,
.collectionheader .colldetailslinkpane{
float:right;
position:relative;
padding-right:0px;
cursor:pointer;
}

.static_playlist_info .playlistDetail a,
.collectionheader .colldetailslinkpane a{
font-size:13px;
padding-right:20px;
min-height:25px;
float:left;
}

.static_playlist_info .playlistDetail a:after {
content:" ";
width:0; 
height:0; 
position:absolute;
right:0px;
top:5px;
border-left:6px solid transparent;
border-right:6px solid transparent;	
border-top:10px solid #ffba00;
}
.static_playlist_info:not(.open) .playlistDetail a:hover:after {
border-top:10px solid #fff;
}
.static_playlist_info.open .playlistDetail a:after{
border-bottom:10px solid #ffba00;
border-top:none;
}
.static_playlist_info.open .playlistDetail a:hover:after{
border-bottom:10px solid #fff;
}

.collectionheader .colldetailslinkpane a:after{
content:" ";
width:0; 
height:0; 
position:absolute;
right:0px;
top:5px;
border-left:6px solid transparent;
border-right:6px solid transparent;	
border-top:10px solid #2CAED3;
}

.collectionheader .colldetailslinkpane a:hover:after{
border-top:10px solid #000;
}
.collectionheader .colldetailslinkpane a.open:after{
border-bottom:10px solid #2CAED3;
border-top:none;
}
.collectionheader .colldetailslinkpane a.open:hover:after{
border-bottom:10px solid #000;
}

#viewgridwrapper{
clear:both;
}

.trash-hint{
color:#999;
font-size:0.8em;
padding-left:10px;
display:block;
}

.devices-hint{
padding:10px 10px 0px 10px;
display:block;
float:left;
width:100%;
}


/* ADS */

.adExpress--home .logoMyDartfish {
width:100%;
max-width:280px;
margin:10px 0;
display:inline-block;
}

.content .colleft .adExpress .box {
float:none;
background:transparent;
}

.adExpress--home .box__dark-header h4 {
text-align:center;
padding:0;
}
@media (max-width:960px) {
.adExpress--home .box__dark-header h4 {
padding:0 10px;
}
}

.adExpress--home .box__dark-header h4 span{
display:inline;
}
.adExpress--home img{
max-width:100%;
}

.extend-bg-to-full-with {
width:100vw;
margin-left:calc(-50vw + 50%);
overflow:auto;
}


@media (max-width:960px) {
.extend-bg-to-full-with {
width:100%;
margin-left:0;
}
}


/*----------------------------------------*\
SPACINGS
\*----------------------------------------*/
/**
* MARGINS
* Generate margin classes based on spacing units
*
* mrg(|t|r|b|l|h|v)0   => no margin
* mrg(|t|r|b|l|h|v)--  => 1/4
* mrg(|t|r|b|l|h|v)-   => 1/2
* mrg(|t|r|b|l|h|v)    => 1x
* mrg(|t|r|b|l|h|v)+   => 2x
* mrg(|t|r|b|l|h|v)++  => 4x
*
* {nothing}  => all
* t          => top
* r          => right
* b          => bottom
* l          => left
* h          => horizontal (left + right)
* v          => vertical (top + bottom)
*/
/**
* PADDINGS
* Generate padding classes based on spacing units
*
* pdg(|t|r|b|l|h|v)0   => no margin
* pdg(|t|r|b|l|h|v)--  => 1/4
* pdg(|t|r|b|l|h|v)-   => 1/2
* pdg(|t|r|b|l|h|v)    => 1x
* pdg(|t|r|b|l|h|v)+   => 2x
* pdg(|t|r|b|l|h|v)++  => 4x
*
* {nothing}  => all
* t          => top
* r          => right
* b          => bottom
* l          => left
* h          => horizontal (left + right)
* v          => vertical (top + bottom)
*/
.pdg0 {
padding:0 !important;
}

.pdgt0 {
padding-top:0 !important;
}

.pdgr0 {
padding-right:0 !important;
}

.pdgb0 {
padding-bottom:0 !important;
}

.pdgl0 {
padding-left:0 !important;
}

.pdgh0 {
padding-right:0 !important;
padding-left:0 !important;
}

.pdgv0 {
padding-top:0 !important;
padding-bottom:0 !important;
}

.pdg {
padding:1em !important;
}

.pdgt {
padding-top:1em !important;
}

.pdgr {
padding-right:1em !important;
}

.pdgb {
padding-bottom:1em !important;
}

.pdgl {
padding-left:1em !important;
}

.pdgh {
padding-right:1em !important;
padding-left:1em !important;
}

.pdgv {
padding-top:1em !important;
padding-bottom:1em !important;
}

.pdg-- {
padding:0.25em !important;
}

.pdgt-- {
padding-top:0.25em !important;
}

.pdgr-- {
padding-right:0.25em !important;
}

.pdgb-- {
padding-bottom:0.25em !important;
}

.pdgl-- {
padding-left:0.25em !important;
}

.pdgh-- {
padding-right:0.25em !important;
padding-left:0.25em !important;
}

.pdgv-- {
padding-top:0.25em !important;
padding-bottom:0.25em !important;
}

.pdg- {
padding:0.5em !important;
}

.pdgt- {
padding-top:0.5em !important;
}

.pdgr- {
padding-right:0.5em !important;
}

.pdgb- {
padding-bottom:0.5em !important;
}

.pdgl- {
padding-left:0.5em !important;
}

.pdgh- {
padding-right:0.5em !important;
padding-left:0.5em !important;
}

.pdgv- {
padding-top:0.5em !important;
padding-bottom:0.5em !important;
}

.pdg\+ {
padding:2em !important;
}

.pdgt\+ {
padding-top:2em !important;
}

.pdgr\+ {
padding-right:2em !important;
}

.pdgb\+ {
padding-bottom:2em !important;
}

.pdgl\+ {
padding-left:2em !important;
}

.pdgh\+ {
padding-right:2em !important;
padding-left:2em !important;
}

.pdgv\+ {
padding-top:2em !important;
padding-bottom:2em !important;
}

.pdg\+\+ {
padding:4em !important;
}

.pdgt\+\+ {
padding-top:4em !important;
}

.pdgr\+\+ {
padding-right:4em !important;
}

.pdgb\+\+ {
padding-bottom:4em !important;
}

.pdgl\+\+ {
padding-left:4em !important;
}

.pdgh\+\+ {
padding-right:4em !important;
padding-left:4em !important;
}

.pdgv\+\+ {
padding-top:4em !important;
padding-bottom:4em !important;
}

.mrg0 {
margin:0 !important;
}

.mrgt0 {
margin-top:0 !important;
}

.mrgr0 {
margin-right:0 !important;
}

.mrgb0 {
margin-bottom:0 !important;
}

.mrgl0 {
margin-left:0 !important;
}

.mrgh0 {
margin-right:0 !important;
margin-left:0 !important;
}

.mrgv0 {
margin-top:0 !important;
margin-bottom:0 !important;
}

.mrg {
margin:1em !important;
}

.mrgt {
margin-top:1em !important;
}

.mrgr {
margin-right:1em !important;
}

.mrgb {
margin-bottom:1em !important;
}

.mrgl {
margin-left:1em !important;
}

.mrgh {
margin-right:1em !important;
margin-left:1em !important;
}

.mrgv {
margin-top:1em !important;
margin-bottom:1em !important;
}

.mrg-- {
margin:0.25em !important;
}

.mrgt-- {
margin-top:0.25em !important;
}

.mrgr-- {
margin-right:0.25em !important;
}

.mrgb-- {
margin-bottom:0.25em !important;
}

.mrgl-- {
margin-left:0.25em !important;
}

.mrgh-- {
margin-right:0.25em !important;
margin-left:0.25em !important;
}

.mrgv-- {
margin-top:0.25em !important;
margin-bottom:0.25em !important;
}

.mrg- {
margin:0.5em !important;
}

.mrgt- {
margin-top:0.5em !important;
}

.mrgr- {
margin-right:0.5em !important;
}

.mrgb- {
margin-bottom:0.5em !important;
}

.mrgl- {
margin-left:0.5em !important;
}

.mrgh- {
margin-right:0.5em !important;
margin-left:0.5em !important;
}

.mrgv- {
margin-top:0.5em !important;
margin-bottom:0.5em !important;
}

.mrg\+ {
margin:2em !important;
}

.mrgt\+ {
margin-top:2em !important;
}

.mrgr\+ {
margin-right:2em !important;
}

.mrgb\+ {
margin-bottom:2em !important;
}

.mrgl\+ {
margin-left:2em !important;
}

.mrgh\+ {
margin-right:2em !important;
margin-left:2em !important;
}

.mrgv\+ {
margin-top:2em !important;
margin-bottom:2em !important;
}

.mrg\+\+ {
margin:4em !important;
}

.mrgt\+\+ {
margin-top:4em !important;
}

.mrgr\+\+ {
margin-right:4em !important;
}

.mrgb\+\+ {
margin-bottom:4em !important;
}

.mrgl\+\+ {
margin-left:4em !important;
}

.mrgh\+\+ {
margin-right:4em !important;
margin-left:4em !important;
}

.mrgv\+\+ {
margin-top:4em !important;
margin-bottom:4em !important;
}

@media only screen and (min-width:960px) {
.desk--pdg0 {
padding:0 !important;
}

.desk--pdgt0 {
padding-top:0 !important;
}

.desk--pdgr0 {
padding-right:0 !important;
}

.desk--pdgb0 {
padding-bottom:0 !important;
}

.desk--pdgl0 {
padding-left:0 !important;
}

.desk--pdgh0 {
padding-right:0 !important;
padding-left:0 !important;
}

.desk--pdgv0 {
padding-top:0 !important;
padding-bottom:0 !important;
}

.desk--pdg {
padding:1em !important;
}

.desk--pdgt {
padding-top:1em !important;
}

.desk--pdgr {
padding-right:1em !important;
}

.desk--pdgb {
padding-bottom:1em !important;
}

.desk--pdgl {
padding-left:1em !important;
}

.desk--pdgh {
padding-right:1em !important;
padding-left:1em !important;
}

.desk--pdgv {
padding-top:1em !important;
padding-bottom:1em !important;
}

.desk--pdg-- {
padding:0.25em !important;
}

.desk--pdgt-- {
padding-top:0.25em !important;
}

.desk--pdgr-- {
padding-right:0.25em !important;
}

.desk--pdgb-- {
padding-bottom:0.25em !important;
}

.desk--pdgl-- {
padding-left:0.25em !important;
}

.desk--pdgh-- {
padding-right:0.25em !important;
padding-left:0.25em !important;
}

.desk--pdgv-- {
padding-top:0.25em !important;
padding-bottom:0.25em !important;
}

.desk--pdg- {
padding:0.5em !important;
}

.desk--pdgt- {
padding-top:0.5em !important;
}

.desk--pdgr- {
padding-right:0.5em !important;
}

.desk--pdgb- {
padding-bottom:0.5em !important;
}

.desk--pdgl- {
padding-left:0.5em !important;
}

.desk--pdgh- {
padding-right:0.5em !important;
padding-left:0.5em !important;
}

.desk--pdgv- {
padding-top:0.5em !important;
padding-bottom:0.5em !important;
}

.desk--pdg\+ {
padding:2em !important;
}

.desk--pdgt\+ {
padding-top:2em !important;
}

.desk--pdgr\+ {
padding-right:2em !important;
}

.desk--pdgb\+ {
padding-bottom:2em !important;
}

.desk--pdgl\+ {
padding-left:2em !important;
}

.desk--pdgh\+ {
padding-right:2em !important;
padding-left:2em !important;
}

.desk--pdgv\+ {
padding-top:2em !important;
padding-bottom:2em !important;
}

.desk--pdg\+\+ {
padding:4em !important;
}

.desk--pdgt\+\+ {
padding-top:4em !important;
}

.desk--pdgr\+\+ {
padding-right:4em !important;
}

.desk--pdgb\+\+ {
padding-bottom:4em !important;
}

.desk--pdgl\+\+ {
padding-left:4em !important;
}

.desk--pdgh\+\+ {
padding-right:4em !important;
padding-left:4em !important;
}

.desk--pdgv\+\+ {
padding-top:4em !important;
padding-bottom:4em !important;
}

.en .en--desk--pdgb- {
padding-bottom:0.5em !important;
}
}