@import url("/css/rtve.2019.television/rtve.series/cuentame-TE_SCUENT/TE_SCUENT.basics.personajes.css");

/*BASIC*/
.infoBox {overflow:hidden;}
.infoBox .list-pers{width:500%;display:flex;align-items:start;}
.infoBox .list-pers button{padding:0 .1rem;}
.infoBox .list-pers button img{left:-40%;}
/*FICHA*/
.infoBox .infoFicha{position:relative;margin-top:4rem;padding:0 3rem;}
.infoBox .infoFicha li .infoBox{flex-direction:row;}
.infoBox .infoFicha li .mediaBox{order:1;width:40%;margin:2.2rem 0 0 4%;}
.infoBox .infoFicha li .contentBox{order:2;width:52%;padding:1rem 3rem;}
.wrapper .infoBox .fichaBox .infoFicha li .mainBox .contentBox .auxBox *{font-size:1.6rem;}
.infoBox .infoFicha li .txtBox{padding-bottom:2rem;}
.infoBox .infoFicha li .txtBox span{font-size:1.8rem;}
.infoBox .infoFicha li .txtBox span strong{font-size:5rem;line-height:1.2;font-weight:lighter;text-transform:uppercase;}
.infoBox .infoFicha li .contentBox .auxBox{font-size:1.6rem;line-height:1.6;font-weight:300;}

/*lista de personajes fija sin flechas*/
.infoBasic .actor {display:none;}
.slideBox .controlBox {display:none;}
.infoBox .list-pers button{width:9.09%;}
.infoBox .list-pers{width:100%;margin:0!important;}
.infoBox .list-pers button .img{height:20rem;}

/*focus*/
.infoBox .list-pers button[class*="pers"] .img{transition:all .2s;}
.infoBox .list-pers button[class*="pers"]:hover .img{opacity:.6;}
.infoBox .list-pers button[class*="pers"]:focus .img{opacity:1;box-shadow:0 .2rem .4rem .1rem rgba(0,0,0,.6);display:block;filter:brightness(.4) grayscale(.8) contrast(.8);-webkit-filter: grayscale(80%) brightness(40%) contrast(80%);-moz-filter:brightness(.4) grayscale(.8) contrast(.8);-o-filter:brightness(.4) grayscale(.8) contrast(.8);-ms-filter:brightness(.4) grayscale(.8) contrast(.8);}
.infoBox .controlBox .arrow:focus {border: .1rem solid #fff;}
.infoBox .infoFicha li .contentBox .linkMas:hover,
.infoBox .infoFicha li .contentBox .linkMas a:focus{background:#000;color:#fff;}

.infoBox .controlBox .arrow.izq {height:18rem;background: url(/css/rtve.2017.television/rtve.programas/ot-2017/i/portada-ot_arrows.png) no-repeat;background-size:14rem;left: 0;opacity:1;background-position:10% center;color:transparent;}
.infoBox .controlBox .arrow.der {height:18rem;background: url(/css/rtve.2017.television/rtve.programas/ot-2017/i/portada-ot_arrows.png) no-repeat;background-size:16rem;right:0;opacity:1;background-position:90% center;color:transparent;}