/* RESET */

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}


/* === FUENTES === */ 

@font-face{font-family:Roboto;font-style:normal;font-weight:400;src:url("https://e00-elmundo.uecdn.es/fonts/roboto/Roboto-Regular.woff2") format("woff2"),url("https://e00-elmundo.uecdn.es/fonts/roboto/Roboto-Regular.woff") format("woff")}

@font-face{font-family:Roboto;font-style:bold;font-weight:700;src:url("https://e00-elmundo.uecdn.es/fonts/roboto/Roboto-Bold.woff2") format("woff2"),url("https://e00-elmundo.uecdn.es/fonts/roboto/Roboto-Bold.woff") format("woff")}

@font-face {
	font-family: Roboto_condensed;
	font-style: normal;
	font-weight: 400;
	src: url("https://e00-elmundo.uecdn.es/fonts/roboto/RobotoCondensed-Regular.woff2") format("woff2"), url("https://e00-elmundo.uecdn.es/fonts/roboto/RobotoCondensed-Regular.woff") format("woff")
}

@font-face {
	font-family: Roboto_condensed;
	font-style: bold;
	font-weight: 700;
	src: url("https://e00-elmundo.uecdn.es/fonts/roboto/RobotoCondensed-Bold.woff2") format("woff2"), url("https://e00-elmundo.uecdn.es/fonts/roboto/RobotoCondensed-Bold.woff") format("woff")
}

/* @font-face {
	font-family: Roboto;
	font-style: normal;
	font-weight: 400;
	src: url("fonts/roboto/Roboto-Regular.woff2") format("woff2"), url("fonts/roboto/Roboto-Regular.woff") format("woff")
}

@font-face {
	font-family: Roboto;
	font-style: normal;
	font-weight: 700;
	src: url("fonts/roboto/Roboto-Bold.woff2") format("woff2"), url("fonts/roboto/Roboto-Bold.woff") format("woff")
}

@font-face {
	font-family: Roboto_condensed;
	font-style: normal;
	font-weight: 400;
	src: url("fonts/roboto/RobotoCondensed-Regular.woff2") format("woff2"), url("fonts/roboto/RobotoCondensed-Regular.woff") format("woff")
}

@font-face {
	font-family: Roboto_condensed;
	font-style: normal;
	font-weight: 700;
	src: url("fonts/roboto/RobotoCondensed-Bold.woff2") format("woff2"), url("fonts/roboto/RobotoCondensed-Bold.woff") format("woff")
} */

/* === BÁSICO === */

#container{
    width:470px;
    height:650px;
    color:#262626;
    box-sizing: border-box;
    font-family:"Roboto_condensed", "Roboto condensed", "Roboto", arial, sans-serif;
    margin:auto;
    overflow:hidden;
    padding: 15px;
    position: relative;
    background-color: #f3f3f3;
	font-size: 15px;
}

#title{
    /* font-family:"Roboto_condensed", "Roboto condensed", "Roboto", arial, sans-serif; */
    font-size:20px; 
    font-weight:bold; 
    text-align:left; 
    text-transform: uppercase; 
    /* line-height: 23px; */
    position: absolute;
    top: 15px; 
    left: 15px;
}

#footer{
    font-family: "Roboto", arial, sans-serif;
    width:100%;
    color:#000;
    font-size:11px;
    line-height:13px;
    position: absolute;
    bottom: 15px;
    left: 15px;
}

#footer span{
	font-weight: bold;
	text-transform: uppercase;
}

#key{
	width: 440px;
	position:absolute;
	top: 55px;
	left: 15px;
	height: 30px;
	font-size: 14px;
}

#key li{
	margin-bottom: 3px;
	/* width: 110px; */
	float:left;
	margin-right:12px;
}

#key li:last-child{
	margin-right:0;
}

.square{
	width: 13px;
	height: 13px;
	background-color: #000;
	float: left;
	margin-right: 5px;
}

#menu{
	position: absolute;
	top: 100px;
	width: 440px;
}

#menu li{
	width: 13.5%;
	height: 40px;
	box-sizing: border-box;
	text-align:center;
	padding-top:12px;
	float: left;
	margin-right: 0.6%;
	margin-bottom: 2px;
	border: 1px solid #f3f3f3;
	cursor: pointer;
}

.selected{
	border: 1px solid #262626 !important;
}

#info{
	width:330px;
	position:absolute;
	left: 50%;
	margin-left: -165px;
	top:265px;
}

#date{
	font-size: 19px;
	font-weight: bold;
	padding-bottom:10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #262626;
}

#info-list{
	width:330px;
	font-weight: bold;
}

#info-list li{
	float:left;
	margin-right:15px;
}

#info-list li:nth-child(1){
	width: 60px;
}

#info-list li:nth-child(2){
	width: 120px;
}

#info-list li:nth-child(3){
	margin-right:0;
}


#info-list li span{
	font-weight: normal;
}

#graph-box{
	width:330px;
	height: 240px;
	position:absolute;
	top: 70px;
	left: 50%;
	margin-left: -165px;
	overflow:hidden;
}

#graph-content{
	position: absolute;
	left:0;
	top:0;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}



/* AI2HTML */


#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box ,
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box .g-artboard {
	margin:0 auto;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box p {
	margin:0;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box .g-aiAbs {
	position:absolute;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box .g-aiImg {
	position:absolute;
	top:0;
	display:block;
	width:100% !important;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box .g-aiSymbol {
	position: absolute;
	box-sizing: border-box;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas-box .g-aiPointText p { white-space: nowrap; }
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas {
	position:relative;
	overflow:hidden;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas p {
	font-weight:500;
	line-height:15px;
	height:auto;
	filter:alpha(opacity=100);
	-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity:1;
	letter-spacing:0em;
	font-size:14px;
	text-align:left;
	color:rgb(38,38,38);
	text-transform:none;
	padding-bottom:0;
	padding-top:0;
	mix-blend-mode:normal;
	font-style:normal;
	position:static;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle0 {
	height:15px;
	text-align:right;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle1 {
	height:15px;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle2 {
	line-height:17px;
	height:17px;
	text-align:center;
	color:rgb(255,255,255);
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle3 {
	height:15px;
	text-align:right;
	color:rgb(255,255,255);
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle4 {
	line-height:17px;
	height:17px;
	text-align:right;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle5 {
	font-weight:700;
	height:15px;
	text-align:right;
}
#g-20210624-Etapas-Tour-una-pieza-WEB-etapas .g-pstyle6 {
	font-weight:700;
	height:15px;
}




@media (max-width:469px){
	#container{
		width: 360px;
	}

	#key{
		width: 330px;
	}

	#menu{
		width: 330px;
	}
}