/*general*/
.wrapper.bodier:before {content:"";display:block;background:url("/css/division/tve/catalunya/laPeluqueria/i/LACA_SPRAY.png") no-repeat;background-size:contain;height:41rem;width:37rem;position:fixed;left:-5%;top:20%;}    
body[data-cat='TE_SLAPELU'] .bodier {background: url(/css/division/tve/catalunya/laPeluqueria/i/fondo3.png)center bottom no-repeat rgba(178, 78, 164, 0.68);padding-bottom: 25rem;}    
@media (max-width: 1440px) { .bodier {background: url(/css/division/tve/catalunya/laPeluqueria/i/fondo3.png)65% bottom no-repeat rgba(178, 78, 164, 0.68);padding-bottom:3rem;background-size:120% 80%;}
		.wrapper.bodier:before {width:20rem;height:25rem;}}

/*person*/
.person .cell .infoBox .list-pers {position:relative;overflow:hidden;}
.person .cell .infoBox .list-pers li {display:inline-block;width:26%;border:3rem solid transparent;float:left;}
.person .cell .infoBox .list-pers li.pers1, .person .cell .infoBox .list-pers li.pers4 {margin-left:11%;}
.person .cell .infoBox .list-pers li.pers7, .person .cell .infoBox .list-pers li.pers11 {margin-left:10%;}
.person .cell .infoBox .list-pers li.pers4, .person .cell .infoBox .list-pers li.pers7, .person .cell .infoBox .list-pers li.pers11  {clear:both;}
.person .cell .infoBox .list-pers li:nth-child(7),.person .cell .infoBox .list-pers li:nth-child(8),
.person .cell .infoBox .list-pers li:nth-child(9), .person .cell .infoBox .list-pers li:nth-child(10),
.person .cell .infoBox .list-pers li:nth-child(11), .person .cell .infoBox .list-pers li:nth-child(12),
.person .cell .infoBox .list-pers li:nth-child(13), .person .cell .infoBox .list-pers li:nth-child(14) {width:20%;border:2rem solid transparent;}
.person .cell .infoBox .list-pers li label {cursor:pointer;}
.person .cell .infoBox .list-pers li label > .chipBox {background-color:#FFFED5;padding:1rem;text-align: center;-webkit-box-shadow: 0px 1px 7px rgba(0,0,0,.25);-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);background-image: url("/css/rtve.2015.television/rtve.series/cuentame/i/polaroid_textura.png");}

/*rotacion*/
.person .pers1 label > .chipBox {-webkit-transform: rotate(2deg);-moz-transform: rotate(2deg);transform: rotate(2deg);}
.person .pers2 label > .chipBox {-webkit-transform: rotate(-4deg);-moz-transform: rotate(-4deg);transform: rotate(-4deg);}
.person .pers3 label > .chipBox {-webkit-transform: rotate(-3.5deg);-moz-transform: rotate(-3.5deg);transform: rotate(-3.5deg);}
.person .pers4 label > .chipBox {-webkit-transform: rotate(-3.8deg);-moz-transform: rotate(-3.8deg);transform: rotate(-3.8deg);}
.person .pers5 label > .chipBox {-webkit-transform: rotate(6deg);-moz-transform: rotate(6deg);transform: rotate(6deg);}
.person .pers6 label > .chipBox {-webkit-transform: rotate(-5deg);-moz-transform: rotate(-5deg);transform: rotate(-5deg);}

/*tarjeta*/
.person .cell .infoBox .list-pers li > input, .person .cell .infoBox .list-pers li > input ~ label > .mainBox {clip:rect(0,0,0,0);position:absolute;}
.person .cell .infoBox .list-pers li > input:checked ~ label .mainBox, .person .cell .infoBox .list-pers li > input:checked ~ label > .chipBox {clip:auto;}
.person .cell .infoBox .list-pers li > input:checked ~ label > .mainBox {z-index:2;opacity:1;-webkit-transform: scale(1);transform:scale(1);}
.person .cell .infoBox .list-pers .mainBox .mediaBox .ima {padding-top:0;}
.person .cell .infoBox .list-pers .mainBox {background:url("/css/division/tve/catalunya/laPeluqueria/i/mosaico.jpg");width:98%;height:33.7%;top:1%;left:1%;border:1px solid transparent;-webkit-transform: scale(0);transform:scale(0);-webkit-transition: all ease 0.3s;transition: all ease 0.3s;}
.person .cell .infoBox .list-pers .pers7 .mainBox,.person .cell .infoBox .list-pers .pers8 .mainBox,
.person .cell .infoBox .list-pers .pers9 .mainBox, .person .cell .infoBox .list-pers .pers10 .mainBox,
.person .cell .infoBox .list-pers .pers11 .mainBox, .person .cell .infoBox .list-pers .pers12 .mainBox,
.person .cell .infoBox .list-pers .pers13 .mainBox, .person .cell .infoBox .list-pers .pers14 .mainBox {top:56%;}
.person .cell .infoBox .list-pers .mainBox .mediaBox {width:33.9%;margin:2rem;float:left;} 
.person .cell .infoBox .list-pers .mainBox .mediaBox .ima img {position:relative;height:100%;right:0;left:auto;opacity:1;}
.person .cell .infoBox .list-pers .mainBox .contentBox {height:100%;padding:4rem 4rem 1.8rem 40%;}
.person input:checked + label:after {content:'';display:block;position:absolute;top:0;left:0;height:100%;width:100%;z-index:1;background:rgba(192, 125, 183, 0.7);}
.person .cell .infoBox .list-pers input:checked ~ label .mainBox:before {content:'';display:block;width:2.3rem;height:2.3rem;background:url("/css/division/tve/catalunya/laPeluqueria/i/aspa2.png") no-repeat;position:absolute;top:0;right:0;border:1.5rem solid transparent;filter:invert(100%);}

/*fuente*/
.person .cell .infoBox .list-pers li label > .chipBox p , 
.person .cell .infoBox .list-pers .mainBox .mediaBox span {font-family: "Roboto";color:#182242;}
.person .cell .infoBox .list-pers li label > .chipBox p {font-size:1.8rem;font-weight:500;max-width:90%;margin:1.5rem auto;}
.person .cell .infoBox .list-pers .pers7 label .chipBox p,.person .cell .infoBox .list-pers .pers8 label .chipBox p,
.person .cell .infoBox .list-pers .pers9 label .chipBox p, .person .cell .infoBox .list-pers .pers10 label .chipBox p,
.person .cell .infoBox .list-pers .pers11 label .chipBox p, .person .cell .infoBox .list-pers .pers13 label .chipBox p, 
.person .cell .infoBox .list-pers .pers14 label .chipBox p {font-size:1.6rem;}
.person .cell .infoBox .list-pers .pers7 .mainBox .relBox,.person .cell .infoBox .list-pers .pers8 .mainBox .relBox,
.person .cell .infoBox .list-pers .pers9 .mainBox .relBox, .person .cell .infoBox .list-pers .pers10 .mainBox .relBox,
.person .cell .infoBox .list-pers .pers11 .mainBox .relBox, .person .cell .infoBox .list-pers .pers12 .mainBox .relBox,
.person .cell .infoBox .list-pers .pers13 .mainBox .relBox, .person .cell .infoBox .list-pers .pers14 .mainBox .relBox {display:none;}
.person .cell .infoBox .list-pers .pers12 label .chipBox p {max-width:100%;font-size:1.5rem;}
.person .cell .infoBox .list-pers .mainBox .contentBox .txtBox {padding:0 3rem 1.5rem 3rem;font-size:250%;line-height:1.2;}
.person .cell .infoBox .list-pers .mainBox .contentBox .txtBox span strong {display:block;font-size:4rem;}
.person .cell .infoBox .list-pers .mainBox .contentBox .auxBox {width:100%;height:100%;color:#000;padding:1rem 3rem;letter-spacing:.25pt;line-height:1.2;font-size:1.6rem;font-weight:400;overflow:auto;max-height:20rem;}
.person .cell .infoBox .list-pers .mainBox .contentBox .relBox {position:absolute;bottom:15%;left:60%;}
.person .cell .infoBox .list-pers .mainBox .contentBox .relBox a {padding:1rem 2rem;background:#FFFFCF;font-size:1.5rem;}

/*efecto hover*/
.person label:hover .chipBox{
    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -webkit-transition: -webkit-transform .3s ease-out;
    -moz-transition: -moz-transform .0.3s ease-out;
    -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    position: relative;
}