* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@font-face {
    font-family: 'prelobook';
    src: url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.eot');
    src: url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.eot?#iefix') format('embedded-opentype'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.woff2') format('woff2'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.woff') format('woff'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.ttf') format('truetype'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Book-webfont.svg#prelobook') format('svg');
}

@font-face {
    font-family: 'prelobold';
    src: url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.eot');
    src: url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.woff2') format('woff2'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.woff') format('woff'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.ttf') format('truetype'),
         url('/especiales/personajes-fallecidos-2016/fonts/Prelo-Bold-webfont.svg#prelobold') format('svg');
}

body {
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #000; 
    /*    overflow: hidden;*/
    font-weight: normal;
    font-style: normal;

}

.container {
    margin: 0 auto;
    width: 980px;
}

#intro {
    background-color: aliceblue;
    height: 600px;
}

#controls {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding-top: 10px;
}

.left,
.right {
    float: left;
    width: 50%;
}

#controls .right {
    text-align: right;
}

#buttons {
    vertical-align: bottom;
    display: inline-block;
    width: 38px;
    height: 38px;
    background: black;
    color: white;
    font-size: 30px;
    padding: 0 12px;
    cursor: pointer;
}

#scroll {
    display: inline-block;
    font-weight: bold;
    padding: 10px;
    color: green;
    margin-right: 5px;
}

#scroll.locked {
    text-decoration: line-through;
    color: gray;
    background: none;
    font-weight: bold;
}

.category {
    border-radius: 20px;
    display: inline-block;
    color: white;
    font-size: 15px;
    padding: 10px;
}

.good {
    background-color: rgb(31, 119, 180);
}

.bad {
    background-color: rgb(255, 127, 14);
}

#content {
    padding-top: 80px;
    padding-left: 20px;
}

.text {
    float: left;
    background: gray;
    width: 270px;
    padding: 20px;
    margin-right: 20px;
}

#top {
    height: 350px;
    width: 7300px;
    background-color: #D0D0D0;
}

#draw {
    padding-top: 20px;
    height: 420px;
    width: 7300px;
    background-color: #DFDFDF;
}

#chart {
    display: none;
    height: 400px;
    background-color: #DFDFDF;
}

.c3-axis.c3-axis-y,
path.domain,
g.tick>line,
line.c3-xgrid-focus {
    display: none;
}

.c3-circle {
    cursor: pointer;
}

#draw .c3-line {
    stroke-width: 6px;
}

.menu {
    position: relative;
    display: inline-block;
}

.menu-heading {
    background-color: #F7C600;
    padding: 10px 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.menu-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 100px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

.menu-item {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.menu-item:hover {
    background-color: #f1f1f1
}

.menu:hover .menu-content {
    display: block;
}

.menu:hover .menu-heading {
    background-color: #FFE57D;
}

.modal{
    border-radius: 0;
    left: 100px;
    max-width: 920px;
    position: fixed;
    top: 120px;
}


.contenedor{
   
}
    .portada{
        background: url(/especiales/personajes-fallecidos-2016/img/bg-portada.jpg) no-repeat;
        height: 910px;
        width: 1540px;
    }  
        .ctn-portada{
            margin: 270px auto 0 445px;
            position: absolute;
            width: 710px;
        }
            .c-comercio{
                display: block;
                margin: 0 auto;
            }
            .texto-portada{
                display: block;
                margin-top: 40px;
            }

    #social{
        text-align: center;
        width: 100%;
    }
        #social ul{
            display: inline-block;
            margin: 30px auto 0;
            padding: 0;
            vertical-align: middle;
        }
            #social ul li{
                display: inline-block;
                margin: 0 3px;
                vertical-align: middle;
            }
                #social ul li a{
                    display: block;
                    height: 36px;
                    width: 36px;
                    text-indent: -9999px;
                }
                    #social ul li a.facebook{
                        background: url(/especiales/personajes-fallecidos-2016/img/sprite-redes.png) no-repeat 0 0;  
                        background-size: 75px;                         
                    }
                    #social ul li a.tw{
                        background: url(/especiales/personajes-fallecidos-2016/img/sprite-redes.png) no-repeat -37px 0;  
                        background-size: 75px;                         
                    }

    .pared{
        background: url(/especiales/personajes-fallecidos-2016/img/bg-pared.jpg) no-repeat;
        background-position-x: 1540px;
        height: 880px;
        width: 8200px;
    }
    h4{
        font: 20px/22px 'prelobold';
        margin: 15px auto 10px;
    }
    p{
        font: 16px/20px 'prelobook';
        margin: 5px auto;
    }
        .cuadro{
            cursor: pointer;
            position: absolute;
        }
            .titulo-mundo{
                left: 1770px;
                top: 540px;
            }
            .titulo-peru{
                left: 6365px;
                top: 390px;
            }
            .sumilla-1{
                left: 2455px;
                top: 372px;
            }
            .sumilla-2{
                left: 3945px;
                top: 420px;
            }
            .cuadro-1{
                left: 1750px;
                top: 140px;
            }
            .cuadro-2{
                left: 2200px;
                top: 140px;
            }
            .cuadro-3{
                left: 2420px;
                top: 140px;
            }
            .cuadro-4{
                left: 2203px;
                top: 380px;
            }
            .cuadro-5{
                left: 2203px;
                top: 600px;
            }
            .cuadro-6{
                left: 2475px;
                top: 600px;
            }
            .cuadro-7{
                left: 2750px;
                top: 600px;
            }
            .cuadro-8{
                left: 2750px;
                top: 140px;
            }
            .cuadro-9{
                left: 2970px;  
                top: 150px;
            }
            .cuadro-10{
                left: 2970px;  
                top: 380px;
            }
            .cuadro-11{
                left: 2973px;
                top: 595px;
            }
            .cuadro-12{
                left: 3240px;
                top: 155px;
            }
            .cuadro-13{
                left: 3450px;
                top: 155px;
            }
            .cuadro-14{
                left: 3450px;
                top: 380px;
            }
            .cuadro-15{
                left: 3450px;
                top: 600px;
            }
            .cuadro-16{
                left: 3685px;
                top: 155px;
            }
            .cuadro-17{
                left: 3685px;
                top: 385px;
            }
            .cuadro-18{
                left: 3960px;
                top: 155px;
            }
            .cuadro-19{
                left: 4200px;
                top: 155px;
            }
            .cuadro-20{
                left: 4200px;
                top: 385px;
            }
            .cuadro-21{
                left: 4200px;
                top: 610px;
            }
            .cuadro-22{
                left: 4445px;
                top: 155px;
            }
            .cuadro-23{
                left: 4445px;
                top: 380px;
            }
            .cuadro-24{
                left: 4685px;
                top: 157px;
            }
            .cuadro-25{
                left: 5120px;
                top: 157px;
            }
            .cuadro-26{
                left: 5125px;
                top: 470px;
            }
            .cuadro-27{
                left: 5320px;
                top: 395px;
            }
            .cuadro-28{
                left: 5780px;
                top: 150px;
            }
            .cuadro-29{
                left: 5980px;
                top: 150px;
            }
            .cuadro-30{
                left: 5830px;
                top: 385px;
            }
            .cuadro-31{
                left: 6060px;
                top: 385px;
            }
            .cuadro-32{
                left: 6240px;
                top: 150px;
            }
            .cuadro-33{
                left: 6060px;
                top: 622px;
            }
            .cuadro-34{
                left: 6505px;
                top: 145px;
            }
            .cuadro-35{
                left: 6280px;
                top: 505px;
            }
            .cuadro-36{
                left: 6700px;
                top: 145px;
            }
            .cuadro-37{
                left: 6560px;
                top: 505px;
            }
            .cuadro-38{
                left: 6780px;
                top: 505px;
            }
            .cuadro-39{
                left: 7130px;
                top: 145px;
            }
            .cuadro-40{
                left: 7020px;
                top: 505px;
            }
            .cuadro-41{
                left: 7225px;
                top: 358px;
            }
            .cuadro-42{
                left: 7225px;
                top: 596px;
            }
            .cuadro-43{
                left: 7365px;
                top: 118px;
            }
            .cuadro-44{
                left: 7635px;
                top: 118px;
            }
            .cuadro-45{
                left: 5370px;
                top: 160px;
            }