header{
background-color: #89D1D1;
}
.recorridos{
margin-top: 78px;
}
.mapa{
width: 800px;
margin-left: auto;
margin-right: auto;
border: 2px solid #333;
padding: 2px;
position: relative;
margin-bottom: 100px;
}
.punto{
position: absolute;
background-image: url('../images/bg-punto.png');
background-position: 15px 50px;
background-repeat: no-repeat;
padding-bottom: 18px;
}
.punto:hover{
text-decoration: none;
}
.punto:hover span{
color: #333;
}
.punto span{
display: block;
width: 50px;
line-height: 50px;

color: #FFF;
font-size: 50px;
text-align: center;
}
.punto span, .leyenda, .lavel{
background-color: rgba(136, 209, 209, .9);
}
.leyenda{
position: absolute;

font-size: 18px;
color: #333;
line-height: 18px;
border: 2px solid #FFF;
padding: 3px 20px;
}
#p1{
left: 340px;
top:150px;
}
#p2{
left: 400px;
top:370px;
}
#p3{
left: 305px;
top: 355px;
}
#p4{
left: 345px;
top:270px;
}
#p5{
left: 280px;
top:460px;
}
#p6{
left: 360px;
top:480px;
}
#p7{
left: 10px;
top:10px;
}
#p8{
left: 70px;
top:70px;
}
#l1{
left: 350px;
top: 220px;
}
#l2{
left: 420px;
top:440px;
}
#l3{
left: 200px;
top: 425px;
}
#l4{
left: 365px;
top:340px;
}
#l5{
left: 160px;
top:530px;
}
#l6{
left: 360px;
top:550px;
}
#l7{
left: 10px;
top:80px;
}
#l8{
left: 70px;
top:140px;
}
.recorrido{
position: relative;
text-align: center;
margin-bottom: 30px;
}
.recorrido a.bloque{
display: inline-block;
}
.lavel{
position: absolute;
top:10px;
display: flex;
align-items: center;
line-height: 50px;
color: #FFF;
padding-left: 10px;
padding-right: 20px;
}
.lavel span:nth-child(1){
/*font-size: 48px;*/
font-weight: bold;
}
.lavel span:nth-child(2){
/*font-size: 21px;
margin-left: 50px;*/
}
.lavel:hover, .lavel:hover span{
text-decoration: none;
color: #FFF;
}
.tagsline{
margin-top: 50px;
margin-bottom: 50px;
}
.zoomed{
transform: scale(.5, .5);
}
.rutaprox{
max-width: 800px;
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
}