@import url('//fonts.googleapis.com/css?family=Inconsolata');

/*RESET*/
html{font-size:62.50%;}
.bbody,form{font-family:Inconsolata,Roboto,arial,sans-serif;}
*{margin:0;padding:0;box-sizing:border-box;-moz-box-sizing:border-box;}
/*FIN RESET*/

/*html{background:url('http://img.rtve.es/css/rtve.2015.television/rtve.series/el-caso/i/especial_bg2.png') #f8f0e3;margin:0;}*/

.bbody{width:50%;display:inline-block;margin:-0.2rem;}
.info{position:relative;padding-left:4em;padding-top:4em;}
.info .ima{position:absolute;top:4em;left:4em;z-index:-1;}
.info > img{border:0.5em solid #fff;max-width:100%;height:auto;}
.step2 .info{padding:0;}

form{width:50%;display:inline-block;top:4em;position:absolute;margin:0 -0.2em;padding-left:2em;}
form .step2.hddn ~ .pasos{left:0;}
form .pasos{width:50%;position:relative;padding:0 2em;display:inline-block;left:50%;}
form .pasos h2{font-size:260%;color:#242520;font-weight:600;line-height:1;}
form .pasos p{font-size:180%;color:#242520;font-weight:500;line-height:1.5;padding-bottom:0.5em;}
form .step2.hddn{clip:rect(0,0,0,0);}
form .step2{position:absolute;clip:auto;}
form .step2 h2{padding-top:2rem;}

form .select{width:13em;height:3.6em;position:relative;}
form .select span{width:100%;height:100%;display:inline-block;background:#222222;color:#f8f0e3;padding:0.8rem 0rem;font-size:180%;text-align:center;position:absolute;}
form .select input{opacity:0;height:100%;width:100%;cursor:pointer;}

form .droparea{position:relative;height:34em;float:left;width:23.4em;background:rgba(0,0,0,0);display:table;}
form .droparea.hddn{position:absolute;clip:rect(0,0,0,0);}
form .droparea span{vertical-align:middle;text-align:center;display:table-cell;width:100%;font-size:160%;padding:0 4rem;border:0.1rem solid #959593;cursor:default;}
form .droparea input{width:100%;height:100%;opacity:0;position:absolute;display:inline-block;left:0;}

form .info label{position:absolute;clip:rect(0,0,0,0);}
form .info input[type="text"]{background:transparent;border:0.1rem solid #222222;padding:1rem;text-align:center;font-size:160%;margin-bottom:1rem;}

form .info input[type="text"]:-moz-placeholder{color:#222222;}
form .info input[type="text"]::-webkit-input-placeholder{color:#222222;}
form .info input[type="text"]:-ms-input-placeholder{color:#222222;}


form .step2 input[type="submit"]{background:#222222;color:#f8f0e3;border:none;width:13rem;height:3.6rem;font-family:Inconsolata,Roboto,arial,sans-serif;font-size:180%;position:absolute;top:100%;/* left:-100%; *//* margin-left:2rem; */}

/* estilos portada */
.generador .f16x9{padding-top:28.125%;}
.generador .mod:not(.no_ima) .mediaBox>a:after{display:none;}
.generador section, .generador + .container section{background:url('http://img.rtve.es/css/rtve.2015.television/rtve.series/el-caso/i/especial_bg2.png') #f8f0e3;padding:0 3em 3em;}
.generador ~ .container.byside{margin-top:-5.2em;}
.generador ~ .container.byside .gridBox .cell .mark iframe{border:0.1rem solid #222222;height:42rem;}