Skip to content

Instantly share code, notes, and snippets.

@alejandroiglesias
Created October 9, 2012 19:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save alejandroiglesias/3860960 to your computer and use it in GitHub Desktop.
Save alejandroiglesias/3860960 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>MediaKit 2012</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="assets/styles/css/main.css">
<!--[if IE]><link rel="stylesheet" href="assets/styles/css/jquery.ui.1.8.16.ie.css"><![endif]-->
<script src="assets/scripts/vendor/modernizr-2.6.1.min.js"></script>
</head>
<body id="top">
<!--[if lt IE 7]>
<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
<![endif]-->
<header id="header">
<div class="container">
<h1 class="logo ir">MediaKit 2012</h1>
<div class="brand-select" tabindex="1">
<button class="btn btn-small btn-slim btn-sharp"><span class="caret"></span></button>
<ul class="list">
<li class="item active"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
<li class="item"><a href="#"><img src="upload/brand-logo.jpg" alt="Life&amp;Style"></a></li>
</ul>
</div>
<div class="sprite-images-arrow-right ir">&gt;</div>
<nav class="nav nav-inline">
<ul>
<li><a href="#">Contacto</a></li><li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Seleccione una plataforma<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Revista</a></li>
<li><a href="#">Tv/Video</a></li>
<li><a href="#">Web</a></li>
<li><a href="#">Móviles</a></li>
<li><a href="#">Aplicaciones</a></li>
<li><a href="#">Eventos</a></li>
</ul>
</li>
</ul>
</nav>
<div class="language-selector btn-group pull-right">
<a class="btn btn-small btn-sharp dropdown-toggle" data-toggle="dropdown" href="#">
<span class="sprite-images-flag-mx ir">Español</span>
<span class="caret"></span>
</a>
<ul class="dropdown-menu dropdown-menu-language">
<li><a href="#"><span class="sprite-images-flag-mx ir">Español</span></a></li>
<li><a href="#"><span class="sprite-images-flag-us ir">English</span></a></li>
</ul>
</div>
<div class="btn-group pull-right">
<button type="button" class="btn btn-small"><i class="icon-printer"></i></button>
<a class="btn btn-small" href="#"><i class="icon-install"></i></a>
</div>
</div>
</header>
<div class="brand-hero" style="background-image: url(upload/brand-hero.jpg);"><div class="mask"></div></div>
<section class="container" role="main">
<div class="well">
<h1 class="title">Life&amp;Style</h1>
<h3 class="subtitle">The Art of Living</h3>
<div class="alt-content clearfix">
<ul id="staff-list" class="staff pull-left">
<li class="person">
<b>Gerente Comercial</b>
<span>Irma Bautista</span>
</li>
<li class="person">
<b>Editor General</b>
<span>Marco Hernández</span>
</li>
</ul>
<p class="announce mark pull-right">¿Quieres anunciar en <strong>Life&amp;Style</strong>? &nbsp;&nbsp; <a class="btn btn-small btn-danger" href="#contact"><i class="icon-email"></i> Contacto</a></p>
</div>
</div>
<div class="about-brand">
<div class="image"><img src="upload/brand-image.jpg" alt=""></div>
<div class="description">
<h2>Sobre Life&amp;Style</h2>
<p>Lorem ipsum dolor sit amet, <a href="#">consectetur</a> adipiscing elit. Cras eget blandit lacus. Phasellus in enim eu ligula bibendum tristique ut tristique diam. Fusce pulvinar euismod turpis, sit amet pretium enim vehicula a.</p>
<h4>Audiencia general</h4>
<p>Integer ac lorem non ligula dictum commodo quis id sem. Curabitur pharetra mauris eu dolor tempus nec imperdiet mauris tempor. Donec mollis sodales dictum. Pellentesque elementum felis scelerisque lectus pretium nec ultricies dolor fermentum.</p>
<p><a href="#modal-gallery-container" class="btn btn-small fancybox"><i class="icon-images"></i> Galería de fotos y videos</a> &nbsp; <a class="btn btn-small" href="#"><i class="icon-contact"></i> Suscribirse a la revista</a></p>
</div>
<div id="modal-gallery-container" class="gallery-container">
<div id="gallery" class="content">
<div class="slideshow-container">
<div id="loading" class="loader"></div>
<div id="slideshow" class="slideshow"></div>
</div>
</div>
<div id="thumbs" class="navigation">
<ul class="thumbs">
<? for ($i = 0; $i < 20; $i++): ?>
<li>
<a class="thumb" name="leaf" href="http://farm4.static.flickr.com/3261/2538183196_8baf9a8015.jpg" title="">
<img src="http://farm4.static.flickr.com/3261/2538183196_8baf9a8015_s.jpg" alt="">
</a>
</li>
<? endfor ?>
</ul>
<div class="btn-group">
<button class="btn btn-small prev">&laquo; Anterior</button>
<button class="btn btn-small next">Siguiente &raquo;</button>
</div>
</div>
</div>
</div>
<ul class="nav nav-tabs">
<li class="active"><a href="#magazine" data-toggle="tab">Revista</a></li>
<li><a href="#tv" data-toggle="tab">Tv/Video</a></li>
<li><a href="#web" data-toggle="tab">Web</a></li>
<li><a href="#mobile" data-toggle="tab">Móviles</a></li>
<li><a href="#applications" data-toggle="tab">Aplicaciones</a></li>
<li><a href="#events" data-toggle="tab">Eventos</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="magazine">
<h2>Frecuencia y circulación</h2>
<ul class="distribution-info">
<li class="datum">
<span class="icon-clock">Frecuencia</span>
<span class="value">Semanal</span>
</li>
<li class="datum">
<span class="icon-users">Audiencia</span>
<span class="value">59,500</span>
</li>
<li class="datum">
<span class="icon-thumbs-up">Pass along (*)</span>
<span class="value">3.5</span></li>
<li class="datum">
<span class="icon-documents">Tiraje</span>
<span class="value">17,000</span>
</li>
<li class="datum">
<span class="icon-flight">Distribución</span>
<span class="value">Nacional</span>
</li>
</ul>
<div class="divider"></div>
<h2>Audiencia específica: <strong>perfil psicodinámico</strong></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nulla ligula, dictum vel faucibus ut, faucibus a velit. Etiam sed odio eget augue venenatis tincidunt. Aenean in tellus ut leo congue ullamcorper. Pellentesque vel purus eu augue pulvinar vehicula. Suspendisse id ultricies est. Nullam nec eleifend justo. Praesent lectus eros, eleifend non vestibulum in, molestie quis arcu. Nam congue lacinia diam, non posuere mi euismod vel.</p>
<div class="divider"></div>
<h2>Audiencia específica: <strong>información demográfica</strong></h2>
<div class="two-cols">
<div class="col">
<table id="chart1" class="chart">
<caption>Género</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
<table id="chart2" class="chart">
<caption>NSE (*)</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
<table id="chart3" class="chart">
<caption>Especialidad / profesión</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
</div>
<div class="col">
<table id="chart4" class="chart">
<caption>Edad</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
<table id="chart5" class="chart">
<caption>Tamaño de empresa</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
<table id="chart6" class="chart">
<caption>Perfil laboral</caption>
<thead>
<tr>
<th></th>
<th>Masculino (70%)</th>
<th>Femenino (30%)</th>
</tr>
</thead>
<tbody>
<tr>
<th></th>
<td>70</td>
<td>30</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="divider"></div>
<h2>Calendario editorial para <strong>Septiembre 2012</strong>
<div class="pull-right">
<select name="pretty" tabindex="1" class="pretty dk">
<option id="x" value="">Elija otro mes</option>
<option value="201210">Octubre 2012</option>
<option value="201211">Noviembre 2012</option>
<option value="201212">Diciembre 2012</option>
<option value="201301">Enero 2013</option>
<option value="201302">Febrero 2013</option>
<option value="201303">Marzo 2013</option>
<option value="201304">Abril 2013</option>
<option value="201305">Mayo 2013</option>
<option value="201306">Junio 2013</option>
<option value="201307">Julio 2013</option>
<option value="201308">Agosto 2013</option>
<option value="201309">Septiembre 2013</option>
</select>
</div>
</h2>
<div class="editorial-calendar">
<div class="calendar-container">
<input type="hidden" id="calendar-dates-closing" value="[<? echo strtotime('2012-10-4') * 1000 ?>, <? echo strtotime('2012-10-11') * 1000 ?>, <? echo strtotime('2012-10-18') * 1000 ?>, <? echo strtotime('2012-10-25') * 1000 ?>]">
<input type="hidden" id="calendar-dates-publication" value="[<? echo strtotime('2012-10-6') * 1000 ?>, <? echo strtotime('2012-10-13') * 1000 ?>, <? echo strtotime('2012-10-20') * 1000 ?>, <? echo strtotime('2012-10-27') * 1000 ?>]">
<div id="calendar" class="calendar"></div>
<ul class="calendar-legend">
<li><span class="sprite-images-calendar-legend-yellow"></span> Cierre</li>
<li><span class="sprite-images-calendar-legend-sky"></span> Publicación</li>
<li><span class="sprite-images-calendar-legend-today"></span> Hoy</li>
</ul>
</div>
<table class="table table-editions">
<thead>
<tr>
<th>Ediciones de Septiembre 2012</th>
<th class="publishing">Publicación</th>
<th class="closing">Cierre</th>
</tr>
</thead>
<tbody>
<tr>
<td><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento Red Book Otoño-Invierno</td>
<td class="publishing">06/09/12</td>
<td class="closing">04/09/12</td>
</tr>
<tr>
<td><abbr class="badge badge-blue" title="Especial">E</abbr> Autos</td>
<td class="publishing">11/09/12</td>
<td class="closing">13/09/12</td>
</tr>
<tr>
<td><abbr class="badge badge-orange" title="Franquicia">F</abbr> Gourmet y Drinks</td>
<td class="publishing">18/09/12</td>
<td class="closing">20/09/12</td>
</tr>
<tr>
<td><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Best of the Best</td>
<td class="publishing">25/09/12</td>
<td class="closing">27/09/12</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="3">
<ul class="table-editions-legend pull-left">
<li><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento</li>
<li><abbr class="badge badge-blue" title="Especial">E</abbr> Especial</li>
<li><abbr class="badge badge-orange" title="Franquicia">F</abbr> Franquicia</li>
<li><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Temática</li>
</ul>
<a class="btn btn-small pull-right fancybox" href="#modal-editorial-calendar-yearly">Ver calendario anual</a>
</td>
</tr>
</tfoot>
</table>
</div>
<div id="modal-editorial-calendar-yearly" class="modal hide">
<h2>Calendario editorial <strong>anual</strong>
<ul class="table-editions-legend pull-right">
<li><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento</li>
<li><abbr class="badge badge-blue" title="Especial">E</abbr> Especial</li>
<li><abbr class="badge badge-orange" title="Franquicia">F</abbr> Franquicia</li>
<li><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Temática</li>
</ul>
</h2>
<table class="table table-editions">
<thead>
<tr>
<th>Período</th>
<th>Ediciones de Septiembre 2012</th>
<th class="publishing">Publicación</th>
<th class="closing">Cierre</th>
</tr>
</thead>
<tbody>
<tr>
<th>Septiembre 2012</th>
<td><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento Red Book Otoño-Invierno</td>
<td class="publishing">06/09/12</td>
<td class="closing">04/09/12</td>
</tr>
<tr>
<th>Octubre 2012</th>
<td><abbr class="badge badge-blue" title="Especial">E</abbr> Autos</td>
<td class="publishing">11/09/12</td>
<td class="closing">13/09/12</td>
</tr>
<tr>
<th>Noviembre 2012</th>
<td><abbr class="badge badge-orange" title="Franquicia">F</abbr> Gourmet y Drinks</td>
<td class="publishing">18/09/12</td>
<td class="closing">20/09/12</td>
</tr>
<tr>
<th>Diciembre 2012</th>
<td><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Best of the Best</td>
<td class="publishing">25/09/12</td>
<td class="closing">27/09/12</td>
</tr>
<tr>
<th>Septiembre 2012</th>
<td><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento Red Book Otoño-Invierno</td>
<td class="publishing">06/09/12</td>
<td class="closing">04/09/12</td>
</tr>
<tr>
<th>Octubre 2012</th>
<td><abbr class="badge badge-blue" title="Especial">E</abbr> Autos</td>
<td class="publishing">11/09/12</td>
<td class="closing">13/09/12</td>
</tr>
<tr>
<th>Noviembre 2012</th>
<td><abbr class="badge badge-orange" title="Franquicia">F</abbr> Gourmet y Drinks</td>
<td class="publishing">18/09/12</td>
<td class="closing">20/09/12</td>
</tr>
<tr>
<th>Diciembre 2012</th>
<td><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Best of the Best</td>
<td class="publishing">25/09/12</td>
<td class="closing">27/09/12</td>
</tr>
<tr>
<th>Septiembre 2012</th>
<td><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento Red Book Otoño-Invierno</td>
<td class="publishing">06/09/12</td>
<td class="closing">04/09/12</td>
</tr>
<tr>
<th>Octubre 2012</th>
<td><abbr class="badge badge-blue" title="Especial">E</abbr> Autos</td>
<td class="publishing">11/09/12</td>
<td class="closing">13/09/12</td>
</tr>
<tr>
<th>Noviembre 2012</th>
<td><abbr class="badge badge-orange" title="Franquicia">F</abbr> Gourmet y Drinks</td>
<td class="publishing">18/09/12</td>
<td class="closing">20/09/12</td>
</tr>
<tr>
<th>Diciembre 2012</th>
<td><abbr class="badge badge-fuchsia" title="Temática">T</abbr> Best of the Best</td>
<td class="publishing">25/09/12</td>
<td class="closing">27/09/12</td>
</tr>
<tr>
<th>Septiembre 2012</th>
<td><abbr class="badge badge-green" title="Suplemento">S</abbr> Suplemento Red Book Otoño-Invierno</td>
<td class="publishing">06/09/12</td>
<td class="closing">04/09/12</td>
</tr>
</tbody>
</table>
</div>
<div class="divider"></div>
<h2>Formatos y tarifas
<span class="note">Estas tarifas incluyen el 15% de comisión de agencia. No incluyen IVA.</span>
</h2>
<table class="table table-formats-and-rates">
<thead>
<tr>
<th class="format-col">Formato</td>
<th class="frequency">Frecuencia anual <span class="light">(en n&deg; de veces)</span></td>
</tr>
</thead>
<tbody>
<tr>
<td class="format-col">
<div class="format-image sprite-images-format-page ir">1 página</div>
<a class="btn btn-small btn-format-preview fancybox" href="upload/sample-format.jpg"><i class="icon-eye"></i> Ejemplo y medidas</a>
</td>
<td>
<table class="table table-prices">
<thead>
<tr>
<th class="mark">Espacio</th>
<th class="amount">1-3</th>
<th class="amount">4-6</th>
<th class="amount">7-9</th>
<th class="amount">10-14</th>
<th class="amount">15+</th>
</tr>
</thead>
<tbody>
<tr>
<td>1 página</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
<tr>
<td>2a y 3a de forros</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
<tr>
<td>4a de forros</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="format-col">
<div class="format-image sprite-images-format-half-page ir">&frac12; página</div>
<a class="btn btn-small btn-format-preview fancybox" href="upload/sample-format.jpg"><i class="icon-eye"></i> Ejemplo y medidas</a>
</td>
<td>
<table class="table table-prices">
<thead>
<tr>
<th class="mark">Espacio</th>
<th class="amount">1-3</th>
<th class="amount">4-6</th>
<th class="amount">7-9</th>
<th class="amount">10-14</th>
<th class="amount">15+</th>
</tr>
</thead>
<tbody>
<tr>
<td>&frac12; página</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="format-col">
<div class="format-image sprite-images-format-2-columns ir">2 columnas</div>
<a class="btn btn-small btn-format-preview fancybox" href="upload/sample-format.jpg"><i class="icon-eye"></i> Ejemplo y medidas</a>
</td>
<td>
<table class="table table-prices">
<thead>
<tr>
<th class="mark">Espacio</th>
<th class="amount">1-3</th>
<th class="amount">4-6</th>
<th class="amount">7-9</th>
<th class="amount">10-14</th>
<th class="amount">15+</th>
</tr>
</thead>
<tbody>
<tr>
<td>2 columnas</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="format-col">
<div class="format-image sprite-images-format-1-columns ir">1 columna</div>
<a class="btn btn-small btn-format-preview fancybox" href="upload/sample-format.jpg"><i class="icon-eye"></i> Ejemplo y medidas</a>
</td>
<td>
<table class="table table-prices">
<thead>
<tr>
<th class="mark">Espacio</th>
<th class="amount">1-3</th>
<th class="amount">4-6</th>
<th class="amount">7-9</th>
<th class="amount">10-14</th>
<th class="amount">15+</th>
</tr>
</thead>
<tbody>
<tr>
<td>1 columna</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
<td class="amount">$80,000</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<hr>
<p class="note"><strong>Nota:</strong> Para evitar que los elementos o textos de los anuncios sean cortados al refinar la revista, utilizar medidas de margen de seguridad (5mm por cada lado). Los anuncios de páginas enfrentadas en las que el texto se extienda hasta el doblez del centro de la revista (medianil), mantener un margen de seguridad al centro, de 5mm en cada lado.</p>
</div>
<div class="tab-pane" id="tv"></div>
<div class="tab-pane" id="web"></div>
<div class="tab-pane" id="mobile"></div>
<div class="tab-pane" id="applications"></div>
<div class="tab-pane" id="events"></div>
</div>
<div class="well well-related-brands">
<p>Los que anunciaron en <span class="mark">Life&amp;Style</span> también anunciaron en:
<a class="brand" href="#"><img src="upload/brand-alt.png" alt="Metros cúbicos"></a>
<a class="brand" href="#"><img src="upload/brand-alt2.png" alt="Quién"></a>
<a class="brand" href="#"><img src="upload/brand-alt3.png" alt="Travel+Leisure"></a>
</p>
</div>
</section>
<div class="scroll-top scroll-top-fixed">
<a class="scroll-top-arrow-link" href="#top" title="Volver arriba">
<div class="sprite-images-arrow-up ir">Volver arriba</div>
</a>
<a class="textimage-link" href="#top">
<div class="sprite-images-back-to-top-text"></div>
</a>
</div>
<footer id="footer">
<div class="two-cols container">
<aside class="col">
<h3>Ediciones especiales</h3>
<div id="footer-slider" class="slider">
<ul>
<li>
<figure>
<img src="upload/special-edition-sample.jpg" alt="">
<figcaption>Juegos Olímpicos Londres 2012 <small>Agosto 2012</small></figcaption>
</figure>
</li>
<li>
<figure>
<img src="upload/special-edition-sample.jpg" alt="">
<figcaption>Juegos Olímpicos Londres 20222222 <small>Agosto 2012</small></figcaption>
</figure>
</li>
</ul>
<div class="slider-nav">
<a class="next" href="#"><span class="sprite-images-arrow-right ir">Siguiente</span></a>
<a class="prev" href="#" disabled><span class="sprite-images-arrow-left ir">Anterior</span></a>
</div>
</div>
</aside>
<div class="col footer-media-container">
<h3>Medios de Grupo Expansión</h3>
<nav>
<ul class="list-all-media">
<li><a href="#">ADN Político</a></li>
<li><a href="#">Balance</a></li>
<li><a href="#">Chilango</a></li>
<li><a href="#">CNN Expansión</a></li>
<li><a href="#">CNN México</a></li>
<li><a href="#">Dinero Inteligente</a></li>
<li><a href="#">Elle</a></li>
<li><a href="#">Endless Vacation</a></li>
<li><a href="#">Expansión</a></li>
<li><a href="#">IDC</a></li>
<li><a href="#">InStyle</a></li>
<li><a href="#">Life&amp;Style</a></li>
<li><a href="#">Manufactura</a></li>
<li><a href="#">Medio Tiempo</a></li>
<li><a href="#">Metros Cúbicos</a></li>
<li><a href="#">Obras</a></li>
<li><a href="#">Quién</a></li>
<li><a href="#">Quo</a></li>
<li><a href="#">Revolution</a></li>
<li><a href="#">Travel + Leisure</a></li>
<li><a href="#">360</a></li>
</ul>
</nav>
<div class="scroll-top">
<a class="scroll-top-arrow-link" href="#top" title="Volver arriba">
<div class="sprite-images-arrow-up ir">Volver arriba</div>
</a>
</div>
</div>
</div>
<div class="copy">
<div class="container">
<p>2006-2012, Derechos Reservados Expansión S.A. de C.V. / Av. Constituyentes 956 Col. Lomas Altas CP. 11950, México D.F. Una empresa de Time Inc. <a class="contact-link pull-right" href="#"><i class="icon-email"></i> Contacto</a></p>
</div>
</div>
</footer>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="assets/scripts/vendor/jquery-1.8.2.min.js"><\/script>')</script>
<script src="assets/scripts/main.min.js"></script>
<script src="http://shepherd-interactive.googlecode.com/svn/trunk/overlay-comp/overlay-comp.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<!--
<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
-->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment