/* ( o ) ---------- */
/*  | |  CSS Styles */
/*----------------- */

/*.thumbnail{outline:1px solid yellow}*/

.thumbnail{width:auto;clear:both;margin:0 8px 1.25em;padding-bottom:1em;}
.thumbnail.block{margin:0 0 1.25em;}
.thumbnail .visual{display:block;position:relative;}
.thumbnail .play-overlay, .thumbnail .thumb-overlay {position:absolute;top:0; left:0;right :0 ; bottom:0;background:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiICB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE1MHB4IiBoZWlnaHQ9IjE1MHB4IiB2aWV3Qm94PSItNTAgLTUwIDE1MCAxNTAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgLTUwIC01MCAxNTAgMTUwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjUiLz4KPGNpcmNsZSBmaWxsPSIjRkZGRkZGIiBjeD0iMjUiIGN5PSIyNSIgcj0iMjIiLz4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjAiLz4KPHBvbHlnb24gZmlsbD0iI0ZGRkZGRiIgcG9pbnRzPSIxNy4wMTksMzMuNSAzNywyNS4wNjUgMTcsMTYuNSAiLz4KPC9zdmc+") center center no-repeat;opacity:0.7 }
.thumbnail .download-overlay {background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB3aWR0aD0iNTBweCIgaGVpZ2h0PSI1MHB4IiB2aWV3Qm94PSIwIDAgNTAgNTAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjUiLz4KPGNpcmNsZSBmaWxsPSIjRkZGRkZGIiBjeD0iMjUiIGN5PSIyNSIgcj0iMjIiLz4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjAiLz4KPGc+PGxpbmUgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjRkZGRkZGIiBzdHJva2Utd2lkdGg9IjMiIHgxPSIyNSIgeTE9IjM2IiB4Mj0iMjUiIHkyPSIxMiIvPjxwb2x5bGluZSBmaWxsPSJub25lIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMyIgcG9pbnRzPSIxNSwyOCAyNSwzOCAzNSwyOCAiLz48L2c+Cjwvc3ZnPg==")}
.thumbnail .watchlater-overlay {background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB3aWR0aD0iNTBweCIgaGVpZ2h0PSI1MHB4IiB2aWV3Qm94PSIwIDAgNTAgNTAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUwIDUwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjUiLz4KPGNpcmNsZSBmaWxsPSIjRkZGRkZGIiBjeD0iMjUiIGN5PSIyNSIgcj0iMjIiLz4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjAiLz4KPHBvbHlsaW5lIGZpbGw9Im5vbmUiIHN0cm9rZT0iI0ZGRkZGRiIgc3Ryb2tlLXdpZHRoPSIzIiBwb2ludHM9IjM1LDMxIDI1LDI2IDI1LDExIAkiLz4KPC9zdmc+")}
.sm-thumb .play-overlay {background-image:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiICB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjI1cHgiIGhlaWdodD0iMjVweCI+CjxjaXJjbGUgY2xhc3M9ImNvdWwiIGN4PSIxMi41IiBjeT0iMTIuNSIgcj0iMTIuNSIgLz4KPGNpcmNsZSBmaWxsPSIjRkZGRkZGIiBjeD0iMTIuNSIgY3k9IjEyLjUiIHI9IjExIi8+CjxjaXJjbGUgY2xhc3M9ImNvdWwiIGN4PSIxMi41IiBjeT0iMTIuNSIgcj0iOS41IiAvPgo8cG9seWdvbiBmaWxsPSIjRkZGRkZGIiBwb2ludHM9IjgsMTcgMTksMTIuNSA4LDggIi8+Cjwvc3ZnPg==")}
    .portrait-thumbnail .visual{width:25%;margin-left:15%}
.thumbnail .visual img{width:100%;display: block;}
.poster{position: relative;}
.poster img{display: block;}
.thumbnail .brand, .poster .brand{position: absolute;right: 0px;bottom:0px; left:0px;height:12%;padding:5px 10px;border-top: 1px solid rgba(169,169,169,0.6);}
.thumbnail .format-icons {position: absolute;right: 3px;bottom:3px;}
.partner .format-icons {position: absolute;right: 3px;bottom:45px;}
.thumbnail .rating {position: absolute;left: 3px;font-size: 12px}

.thumbnail .title {font-size:1.3077em;padding:0.6154em 0 0; font-family:"franklin-gothic-urw", Arial, sans-serif;}
.thumbnail .infos > ul {margin:1.25em 0}
.thumbnail .credits li{display:inline}
.thumbnail .description{margin:1em 0}
.thumbnail .runtime{white-space: pre}
.thumbnail .produits {}
.thumbnail .meta {min-height:1.6454em;font-size:0.6154em;}
.thumbnail .meta li {display: inline;}
.thumbnail .tools li{display:inline-block;}
.thumbnail .tools .right{float:right;}
/*buttons // todo:  mobile-first styles to move in the button css */
.thumbnail .produits li{margin:1em 0}
.thumbnail .bouton{display:block}

.thumbnail .downloads li {margin:2px 0;}
.thumbnail .licence {margin:1.6454em 0;font-size:0.6154em;}
.stack-thumb{padding:0em;}

/*badges*/
.format-icons{text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff; }
.format-icons{font-size: 16px;color:#000;line-height: 0.8}

/* layout modifier */
.stack-thumb{margin:0 0px 1.25em;position: relative}
/*.stack-thumb{border: 1px solid #999;padding:1em;}*/
.boxed-thumb{border: 1px solid #999;padding:1em;}

/*badges*/
.thumb-badge{background-color: #666;border-radius: 9px;padding:4px 8px;font-size: 11px}
.campus-badge{text-transform: uppercase;background-color: #0088C1}
.brand{background-repeat: no-repeat;background-size: contain;background-position: center;background-origin: content-box;}

.rating{width:24px;height:24px;position:absolute;top:2px;left:2px;z-index:20;text-align: left;}
.rating i{font-size: 1.6em;color: #DA2F2F;  text-shadow:-1px -1px 0 #dd9, 1px -1px 0 #dd9, -1px 1px 0 #dd9, 1px 1px 0 #dd9;}
.rating i:hover{color: #f7b045;  text-shadow:-1px -1px 0 #960,  1px -1px 0 #960, -1px 1px 0 #960, 1px 1px 0 #960;}
    /*style of the warning text on roll over*/
    .rating i[data-title]:hover:after {
  content: attr(data-title); padding: 8px; color: #533625; text-shadow: 0 0 0; position: absolute; left: 22px; top: 100%; width:140px; z-index: 20; font-size: 11px; font-family: sans-serif; font-weight: bold -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 0px 0px 4px #222; -webkit-box-shadow: 0px 0px 4px #222; box-shadow: 0px 0px 4px #222; background-color: #f7b045; background-color: rgba(247, 176, 69, 0.8); }



/*search categories*/
.cat [class*="type-"]{position:relative;background-color: #333 ;color:#ccc;padding: 2px 6px 2px 4px;font-size: 1.2em;}
.cat [class*="type-"]:before{
    content: " ";
    position:absolute;
    top:0;
    right:100%;
    width:0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 10px 10px 10px 0
}

.cat .type-film {background-color: #333 ;}
.cat .type-film:before {border-right-color: #333 ;}


/*states*/
.thumb-disable .thumb-overlay{background-color: #ccc; background-image: none; z-index: 10}

/*TODO:  a faire evoluer avec la grille responsive */
.thumb-row{}

/* OVERLAY ICONS ARE IN => board-ui-buttons.css */


/* TABLETTE */
@media (min-width: 704px){
    .thumbnail {width:204px;float:left;clear: none;}
    .thumbnail.block {width:auto;float:none;}
    .thumbnail .infos {font-size: 1em;line-height: 1.25}
    .thumbnail .produits {margin-top: 0.5em}
    .thumb-badge{font-size: 80%;line-height: 1.25;padding:1px 4px;}

	.thumb-row .thumbnail{margin-left: 1.5em}
	.thumb-row .thumbnail:first-child {margin-left: 0em}

	/*horizontal thumbnail*/
	.stack-thumb:before, 
	.stack-thumb:after { content:""; display:table; }
	.stack-thumb:after { clear:both; }
    .stack-thumb{width:auto;float:none;margin-right: 0}
    .stack-thumb .visual{width: 33.333333%;float:left;}
    .stack-thumb .infos{width:66.666666%;float:left;}
    .stack-thumb .infos .title, .stack-thumb .infos>ul{padding-left: 20px}
    .stack-thumb .infos .title{padding-top: 0px;}
    .stack-thumb .tools{margin-top:-1em;}
    .stack-thumb  .produits li {display: inline-block;}
    .stack-thumb  .produits li.trailer {display: block;}
	.sm-thumb {margin-bottom: 1em;padding-bottom: 0}
	.sm-thumb .title {margin-bottom: 2px; line-height: 1}
	.sm-thumb .infos > ul {margin:0 0}
	.sm-thumb .visual{width:20%;}
	.sm-thumb .infos{width:70%;}
	.sm-thumb .produits li {margin-bottom: 0;font-size: 0.8em;margin-right: 16px}
	.sm-thumb .cat{position: absolute;right:0;top:0;line-height: 30px}
}