@import url("rtveplay.users.basics.css");

/** REDEFINICION LANDING USERS ******************/
/************************************************/
/*body*/
.landingBody {background: #fff}

/*logo*/
.landing .logo {height:4rem;position:relative;z-index:1;}
.landing .logo img {height:100%;width:auto;}

/*cerrar*/
.cerrar-landing {position:absolute;top:4.8rem;right:4.8rem;width:4.8rem;height:4.8rem;z-index:2;}
.cerrar-landing img {width:2.8rem;height:2.8rem;}
.cerrar-landing a {display:flex;height:100%;justify-content:center;align-items:center;opacity:0.67;}
.cerrar-landing a:hover {opacity:1;}

/*contenedor general*/
.landing-container .landing {height:100%;}
.landing .cuenta {display:flex;flex-direction: column;height:100%;width:45%;justify-content:flex-start;}
.landing .cuenta .txtBox {max-width:100%;}

.landing-container {height:auto;max-height:100vh;}
.moreInfo .landing-container {max-height:inherit;max-width:132rem;margin:0 auto;}
.landing-container .landing {position:relative;display:flex;flex-direction:column;justify-content:space-between;width:100%;padding:4.8rem 9.6rem 4.8rem 9.6rem;}
.landing-container .landing span a:hover {border-color:#E65F0C}

/*imagen fondo */
.ima {position:absolute;left:auto;right:0;bottom:0;width:100%;z-index:-1;}
.ima img {width:45%;float: right;}
.intro .ima {position:relative;}

/*botones*/
.landing .cuenta .botones-landing {margin-top:5vh;    padding-bottom: 5vh;}
.landing .cuenta .botones-landing button.black {margin-bottom:2rem;}
.landing .cuenta .botones-landing button:hover {background-color: #E65F0C;color:#fff}
.landing .cuenta .botones-landing button.black:hover {background-color: #000;}

/*trozos verticales*/
.iniciar-sesion {padding:2.4rem 4.8rem;min-width:calc(40rem + (4.8rem * 2));}
.iniciar-sesion #formContainer {width:auto;min-width:40rem;height:100%;background-color:#f1f0ef;border: solid 0.1rem #979797;border-radius:0.3rem;box-shadow:0 0.2rem 1.8rem 0 rgba(0,0,0,0.5);}

/** REDEFINICION LANDING USERS ******************/
/** END *****************************************/ 

.moreInfo .texto {padding:6rem 0;position:relative;z-index:-1;}
.landingBody .ladillo {font-family:'Noto Serif',serif;font-weigh:400;font-size:2.4rem;line-height:3.2rem;padding:3.2rem 0 1.6rem 0;}
.moreInfo .botones-landing {display:flex;padding-bottom:6rem;}
.moreInfo .botones-landing button {margin-right:2.4rem;}

.landing .cuenta p {max-width:36rem;}
.landing .cuenta .ima {height:100%;right:0;border-bottom:0.1rem solid #979797;}
.landing .cuenta .ima img {height:calc(100% - 18rem);min-height:18rem;width:auto;right:0;bottom:0;position:absolute;}


.intro {display:grid;border-bottom:0.1rem solid #979797;position:relative;}
.intro .ima img {position:absolute;bottom:0;}
.intro ul {margin-bottom:4rem;padding-right:4rem;}
/*player*/

.videoBox {position:fixed;width:100%;height:100%;display:inline-block;opacity:0;z-index:-1;background:rgba(0,0,0,0.85);left:0;top:0;}

.videoBox.active {opacity:1;z-index:2;}
.videoBox video {position:absolute;width:100%;aspect-ratio:16/9;background:rgba(0,0,0,0.2);}
.videoBox .cerrar-video {width:4.8rem;height:4.8rem;display:flex;justify-content:center;align-items:center;filter:invert(1);right:4.8rem;top:4.8rem;position:absolute;cursor:pointer;}
.videoBox .cerrar-video img {width:2.8rem;height:2.8rem;}

@media all and (orientation:portrait) {
	.videoBox video {top:12rem;left:0;}
	}

@media all and (orientation:landscape) {
	.videoBox video {left:50vw;top:50vh;transform:translate(-50%,-50%);max-width:calc(100vw - 24rem);max-height:calc(100vh - 12rem);}
	}

@media all and (min-width:1200px) {
	.intro {grid-template-rows:auto auto 6.4rem;grid-template-columns:0.85fr 1.15fr;z-index:0;}
	.intro h1,.intro ul {z-index:1;position:relative;}
	.intro .ima {grid-row-start:1;grid-row-end:span3;grid-column-start:2;top:-13.8rem;height:calc(100% + 13.8rem);}
	.intro .ima img {right:-9.6rem;height:100%;width:auto;max-height:48rem;}
	.intro:before {content:'';display:inline-block;position:absolute;height:calc(100% + 13.8rem);width:100%;bottom:0;left:0;background:linear-gradient(90deg,white 25%,transparent 75%);}
}
@media all and (max-width:1199px) {
	.intro {grid-template-rows:auto auto 1fr;grid-template-columns:1fr;}
	.intro .ima {grid-row-start:3;aspect-ratio:16/9;}
	.intro .ima img {width:100%;height:auto;}
}
/*boton play*/
.intro .play {position:relative;width:auto;background:#cbcac5;display:flex;align-items:center;padding:0 2.4rem 0 0.8rem;height:4rem;border-radius:0.4rem;justify-self:left;margin:1.2rem;cursor:pointer;}
.intro .play:hover {background:#000;}
.intro .play:hover strong {color:#fff;}
.intro .play:hover .rtve-icons {filter:invert(1);}
.intro .play strong {font:500 1.6rem/2rem 'Roboto',sans-serif;}
.intro .play .rtve-icons {
    background: url('https://img2.rtve.es/css/rtve.2021/i/rtve-icons.svg/rtve-icon_playVideo_masa_000000.svg') no-repeat 50%;
    background-size:2.6rem 2.6rem;
    width:3.6rem;
    height:3.6rem;
    display:inline-block;
    opacity:0.67;}