@import url(http://fonts.googleapis.com/css?family=Open+Sans:300);
#espionaje .gm-style div,#espionaje .gm-style span,#espionaje .gm-style label,#espionaje .gm-style a {font-family: 'Open Sans', sans-serif;}
#espionaje .title {display: inline-block;
width: 98%;
height: 50px;
line-height: 50px;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
font-size: 30px;
background: url(i/espia.png) no-repeat 530px 0px #008493;
color: #fff;
text-align: right;
padding-right: 2%;
font-weight: bold;}
#espionaje #map-canvas {width: 100%; height: 700px;background: #C6DDED !important}

#espionaje #map-canvas .info-box {margin:0;overflow: hidden;background: #f8f8f8;padding-left: 40px;padding-top: 10px; min-height: 500px}
#espionaje #map-canvas .info-box .header {width: 593px;
height: 55px;
float: left;
background: url('/css/rtve.infografias/espionaje/i/lupa_big.png') no-repeat left center;
padding-left: 50px;
margin-left: 10px;
margin-top: 10px;}
#espionaje #map-canvas .info-box .header .de {font-size: 26px;
color: #00859C;
line-height: 30px;
display: inline-block;
height: 30px;
width: 100%;
font-family: 'Open Sans', sans-serif;
margin-left: 10px;}
#espionaje #map-canvas .info-box .header .asunto {font-size: 18px;
font-weight: normal;
margin-left: 10px;
color: #3D627D;
line-height: 25px;
display: inline-block;
height: 25px;
width: 100%;
font-family: 'Open Sans', sans-serif;}
#espionaje #map-canvas .info-box .asunto span {font-weight: bold;padding-left: 10px;}
#espionaje #map-canvas .info-box .content {padding: 10px;}
#espionaje #map-canvas .info-box .content .icons {float: left;
overflow: hidden;
width: 100%;
margin: 10px auto;}
#espionaje #map-canvas .info-box .icons li {float: left;height: auto;margin: 0 10px;}
#espionaje #map-canvas .info-box .icons li span{color: #656565;padding-top: 60px;height: 30px;display: inline-block;font-family: 'Open Sans', sans-serif;width: 60px;text-align: center;}
#espionaje #map-canvas .info-box .icons li.politico span{background: url('/css/rtve.infografias/espionaje/i/politicos.png') no-repeat center 0px;}
#espionaje #map-canvas .info-box .icons li.empresa span{background: url('/css/rtve.infografias/espionaje/i/empresas.png') no-repeat center 0px;}
#espionaje #map-canvas .info-box .icons li.persona span{background: url('/css/rtve.infografias/espionaje/i/ciudadano.png') no-repeat center 0px;}
#espionaje #map-canvas .info-box .img {width: 50%;
display: block;
float: right;
margin: 0 0px 10px 10px;}
#espionaje #map-canvas .info-box .img img{width: 100%;}
#espionaje #map-canvas .info-box p {line-height: 160%; font-size: 14px; padding-bottom: 10px}
#espionaje #map-canvas .info-box p strong {color: #008493; font-weight: normal;}
#espionaje #map-canvas .info-box p a {color: #008493; font-weight: bold; text-decoration: underline;}
#espionaje #map-canvas .info-box a.more {background: #008493;padding: 10px;display: inline-block;margin: 5px 200px;color: #fff;font-size: 16px;width: 165px;text-align: center;}

/*BOX OJOS*/
#espionaje #map-canvas .info-box.cinco-ojos {min-height: 460px;}
#espionaje #map-canvas .info-box.cinco-ojos .header {background: url('/css/rtve.infografias/espionaje/i/ojo_big.png') no-repeat left center;}
#espionaje #map-canvas .info-box.cinco-ojos .header .de {height: 50px;display: inline-block;line-height: 50px;}
#espionaje #map-canvas .info-box.cinco-ojos .VideoContainer{width: 100%; text-align: center; margin-bottom: 50px}
#espionaje #map-canvas .info-box.cinco-ojos ul {width: 340px;margin: 10px auto;overflow: hidden;}
#espionaje #map-canvas .info-box.cinco-ojos ul li {float: left;margin: 5px;}
#espionaje #map-canvas .info-box.cinco-ojos ul li span {}
#espionaje #map-canvas .info-box.cinco-ojos ul li span img{}
#espionaje #map-canvas .info-box.cinco-ojos p {float: left;width: 100%;line-height: 160%; margin-top: 10px}

/** BOX METODOS **/
#espionaje #map-canvas .info-box.como {min-height: 600px;padding: 0;margin: 0;}
#espionaje #map-canvas .info-box.como ul {overflow: hidden; width: 100%; height: 100%}
#espionaje #map-canvas .info-box.como ul li {height: 600px;
float: left;
width: 50px;
overflow: hidden;
position: relative;
transition: all 0.3s;}
#espionaje #map-canvas .info-box.como ul li .header {transform: rotate(270deg);
-ms-transform: rotate(270deg);
-webkit-transform: rotate(270deg);
height: 50px;
float: left;
width: 600px;
background: #376273;
position: absolute;
top: 275px;
left: -275px;
margin: 0;
padding: 0;
cursor: pointer}
#espionaje #map-canvas .info-box.como ul li .header .query {color: #fff;
font-size: 24px;
line-height: 50px;
padding-left: 10px;
font-weight: normal;
display: none}
#espionaje #map-canvas .info-box.como ul li .header em {float: right;
line-height: 50px;
color: #fff;
font-style: normal;
font-size: 33px;
padding-right: 10px;}
#espionaje #map-canvas .info-box.como ul li .header .titleMetodo {float: right;
line-height: 50px;
padding-right: 10px;
color: #fff;
font-size: 25px;}
#espionaje #map-canvas .info-box.como ul li .content {position: absolute;
top: 0;
left: 50px;
width: 500px;
height: 600px;
box-sizing: border-box;}
#espionaje #map-canvas .info-box.como ul li .content h2 {font-size: 30px;
color: #376273;
display: inline-block;
line-height: 35px;
font-weight: normal;
font-family: 'Open Sans', sans-serif;}
#espionaje #map-canvas .info-box.como ul li .content p {line-height: 160%;
font-size: 14px;
padding-bottom: 10px;}
#espionaje #map-canvas .info-box.como ul li .content .img {display: inline-block;
margin: 0 auto;
width: 100%;
text-align: center;
margin-bottom: 30px;}
#espionaje #map-canvas .info-box.como ul li .content .img img{width: auto;}

#espionaje #map-canvas .info-box.como ul li.active {width: 550px;height: 600px;}
#espionaje #map-canvas .info-box.como ul li.active .header .query {display: inline-block;}
#espionaje #map-canvas .info-box.como ul li:nth-child(1) .header {opacity: 0.5}
#espionaje #map-canvas .info-box.como ul li:nth-child(2) .header {opacity: 0.7}
#espionaje #map-canvas .info-box.como ul li:nth-child(3) .header {opacity: 0.5}
#espionaje #map-canvas .info-box.como ul li.active .header {opacity: 1}
