<div class="container-fluid"> <div class="row"> <div class="col-md-9 section-left"> <div class="section-inner-content"> <div class="story-content" style="background-image: url(images/c6_IMG_story.jpg)"> <!-- img src="images/c6_IMG_story.jpg" class="img-responsive" /> --> <!-- imagen de historia--> </div> <div class="data-content" style="display:none"> <div class="row"> <div class="col-sm-2 col-lg-1 " style="margin-top:2em"> <ul class="carousel-btn"> <a href="#" data-target="#myCarousel" data-slide-to="0" class="carouselGotoBtn btn btn-default btn-block active" > <li > 2011 </li> </a> <a href="#" data-target="#myCarousel" data-slide-to="1" class="carouselGotoBtn btn btn-default btn-block"> <li > 2012 </li></a> <a href="#" data-target="#myCarousel" data-slide-to="2" class="carouselGotoBtn btn btn-default btn-block"> <li > 2013 </li></a> <a href="#" data-target="#myCarousel" data-slide-to="3" class="carouselGotoBtn btn btn-default btn-block"> <li > 2014 </li></a> <a href="#" data-target="#myCarousel" data-slide-to="4" class="carouselGotoBtn btn btn-default btn-block"> <li > 2015 </li></a> <a href="#" data-target="#myCarousel" data-slide-to="5" class="carouselGotoBtn btn btn-default btn-block"> <li > 2016 </li></a> <a href="#" data-target="#myCarousel" data-slide-to="6" class="carouselGotoBtn btn btn-default btn-block"> <li> 2017 </li></a> </ul> </div> <div class="col-sm-10 col-lg-11"> <div id="myCarousel" class="carousel" data-ride="carousel"> <div class="carousel-inner"> <div class="item active"> <img src="images/c6_aerea2011.jpg" alt="2011"> </div> <div class="item"> <img src="images/c6_aerea2012.jpg" alt="2012"> </div> <div class="item"> <img src="images/c6_aerea2013.jpg" alt="2013"> </div> <div class="item"> <img src="images/c6_aerea2014.jpg" alt="2014"> </div> <div class="item"> <img src="images/c6_aerea2015.jpg" alt="2015"> </div> <div class="item"> <img src="images/c6_aerea2016.jpg" alt="2016"> </div> <div class="item"> <img src="images/c6_aerea2017.jpg" alt="2017"> </div> </div> </div> <div> <img src="images/c6_IMG_grafico_inferior.jpg" class="img-responsive"> </div> </div> </div> </div> </div> </div> <div class="col-md-3"> <div class="menu-content"> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <div class="menu-story-content"> <div class="row"> <div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1"> <div class="menu-story-inner"> {{:storytext}} </div> <!-- <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c6_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>--> </div> </div> </div> <div class="menu-data-content" style="display:none"> <div class="row"> <div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1"> <div class="menu-data-inner"> {{:maptext}} </div> <a href="#" class="referencias" id="referencias-page-btn-6"> Referencias bibliográficas </a> <!--<a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c6_ver_story.jpg" class="verstory img-responsive" /> </a>--> </div> </div> </div> </div> <div class="extra-btn-container"> <a class="" id="map-btn-page-{{:n_page}}" href="#"> <img src="images/c{{:n_page}}_menu_mapa.png" width="60px" height="74px" class="mapa img-responsive" /> ver mapa </a> <a href="#" class="switchMode verstory-btn" class="btn btn-circle"> <img src="images/c{{:n_page}}_menu_story.png" width="60px" height="74px" class="verstory img-responsive" /> ver historia </a> <a href="#" class="switchMode vergrafico-btn" class="btn btn-circle"> <img src="images/c{{:n_page}}_menu_datos.png" width="60px" height="74px" class="vergrafico img-responsive" /> ver datos </a> </div> </div> </div> </div> <div class="map-popover" id="map-page-6"> <img src="images/c6_mapa_ACT.jpg" class="img-responsive" /> </div>