@import url(https://fonts.googleapis.com/css?family=Nunito:700|Carme);  
#container-lateral,
#container-filmografias,
#container-estrenos {
    width: 99.5%;  /* Ancho del contenedor */
/*linea alrededor*/
/*
border-radius: .30em .25em .25em .25em;
border: 1px solid #2b2b2b;
*/	

}

#container-lateral input,
#container-filmografias input,
#container-estrenos input {
    height: 1.9em ; /*indica el alto de la solapa*/
	visibility: hidden;
margin-top: 0;
/*
ponemos 0 px porque los input ocupan espacio aunque este oculto asi permite mostrar todo
*/
width: 0px;
}
#container-filmografias label, 
#container-estrenos label{
	background: #2b2b2b;  /* Fondo de las pestaņas */
	border-radius: .25em .25em 0 0;
	color: #fff;  /* Color del texto de las pestaņas */
	cursor: pointer;
	display: block;
	float: left;
	font-size: 1.1em;  /* Tamaņo del texto de las pestaņas */
	line-height: 2.0em;
	margin-right: .25em;
	padding: 0 1.5em;
	text-align: center;
font-family: nunito, sans-serif;    
height: 1.9em;
}
#container-lateral label{
	background: #2b2b2b;  /* Fondo de las pestaņas */
	border-radius: .25em .25em 0 0;
	color: #fff;  /* Color del texto de las pestaņas */
	cursor: pointer;
	display: block;
	float: left;
	font-size: 1.0em;  /* Tamaņo del texto de las pestaņas */
	line-height: 2.0em;
	margin-right: .05em;
	padding: 0 0.2em 0.2em 0.2em;
	text-align: center;
font-family: nunito, sans-serif;    
height: 1.9em;
}

#container-lateral input:hover + label,
#container-filmografias input:hover + label,
#container-estrenos input:hover + label{
	background: #2b2b2b;  /* Fondo de las pestaņas al pasar el cursor por encima */
	color: #996ad2;  /* Color del texto de las pestaņas al pasar el cursor por encima */
transition: all .5s ease;
font-family: nunito, sans-serif;
}
#container-lateral input:checked + label,
#container-filmografias input:checked + label,
#container-estrenos input:checked + label {
	background: #996ad2;  /* Fondo de las pestaņas al presionar */
	color: #fff; /* Color de las pestaņas al presionar */
	z-index: 6;
    
	/*
	-webkit-transition: .1s;
	-moz-transition: .1s;
	-o-transition: .1s;
	-ms-transition: .1s;
	*/
}
#content-filmografias {
	background: #ddd;  /* Fondo del contenido */
	border-radius: 0 .25em .25em .25em;
	min-height: 12em;  /* Alto del contenido */
	position: relative;
	width: 100%;
	z-index: 5;
border: 1px solid #2b2b2b;
}
#content-estrenos {
	background: #ddd;  /* Fondo del contenido */
	border-radius: 0 .25em .25em .25em;
	min-height: 32em;  /* Alto del contenido */
	position: relative;
	width: 100%;
	z-index: 5;
border: 1px solid #2b2b2b;
}
#content-lateral {
	background: #ddd;  /* Fondo del contenido */
	border-radius: 0 .25em .25em .25em;
	min-height: 40em;  /* Alto del contenido */
	position: relative;
	width: 100%;
	z-index: 5;
border: 1px solid #2b2b2b;
}


#content-lateral div,
#content-filmografias div,
#content-estrenos div {
	opacity: 0;
	padding: 0.5em;
	position: absolute;
	z-index: -100;
transition: all 0.5s ease;
	border: 2px;
    /*
	transition: all linear 0.1s;
	*/
}
#content-filmografias img {width:80px;height:110px;border:0; border-radius: 0 .35em 0 .35em;}
#content-lateral img {width:80px;height:110px;border:0; border-radius: 0 .35em 0 .35em;}

#content-estrenos img {width:120px;height:170px;border:0; border-radius: 0 .35em 0 .35em;}

#content-filmografias p {
	float:left;
	width:88px;
    height:185px;
    margin-top:2px;
	margin-right:4px;
	margin-bottom:2px;
	opacity:0.8;
	transition: all 0.2s;
    font-weight: bold;
	font-size:13px;
	text-align:center;    
}

#content-lateral p {
	float:left;
	width:88px;
    height:185px;
    margin-top:2px;
	margin-right:2px;
	margin-bottom:2px;
	opacity:0.8;
	transition: all 0.2s;
    font-weight: bold;
	font-size:13px;
	text-align:center;    
}

#content-estrenos p {
	float:left;
	width:124px;
    height:240px;
    margin-top:2px;
	margin-right:4px;
	margin-bottom:2px;
	opacity:0.8;
	transition: all 0.2s;
    font-weight: bold;
	font-size:13px;
	text-align:center;    
}

#content-lateral p:hover,#content-filmografias p:hover,#content-estrenos p:hover {
	opacity:2;
}
#content-lateral a,#content-filmografias a,#content-estrenos a {
		color:black;
text-decoration:none;
}
#content-lateral a:hover,#content-filmografias a:hover,#content-estrenos a:hover {
	color:#136CB2;
}
#container-lateral input#tab-1-lateral:checked ~ #content-lateral #content-lateral-1,
#container-lateral input#tab-2-lateral:checked ~ #content-lateral #content-lateral-2,
#container-filmografias input#tab-1-filmo:checked ~ #content-filmografias #content-filmografias-1,
#container-filmografias input#tab-2-filmo:checked ~ #content-filmografias #content-filmografias-2,
#container-estrenos input#tab-1-estrenos:checked ~ #content-estrenos #content-estrenos-1,
#container-estrenos input#tab-2-estrenos:checked ~ #content-estrenos #content-estrenos-2,
#container-estrenos input#tab-3-estrenos:checked ~ #content-estrenos #content-estrenos-3,
#container-estrenos input#tab-4-estrenos:checked ~ #content-estrenos #content-estrenos-4,
#container-estrenos input#tab-5-estrenos:checked ~ #content-estrenos #content-estrenos-5,
#container-estrenos input#tab-6-estrenos:checked ~ #content-estrenos #content-estrenos-6 {
    opacity: 1;
    z-index: 100;
}