html {
        height: 100%;
        min-width: 320px;
        max-height: 100%;
        font-size: 62.5%;
    }
    
    body {
        width: 100%;
        height: 100%;
        max-height: 100%;
        font-size: 1.8rem;
        line-height: 1.5em;
        color: #3e3e3e;
        background: #333;
    }
    
    nav#chapter {
        width: 30%;
        position: fixed;
        top: 0px;
        bottom: 0;
        left: 0;
        color: #fff;
        text-align: center;
        background-color: cadetblue;
        overflow: auto;
        z-index: 1;
    }
    
    nav#chapter ul {
        width: 100%;
        height: 50%;
        position: absolute;
        top: 15%;
        display: block;
        padding: 46px 11.4%;
        margin: 30px 0 30px 0;
    }
    
    nav#chapter li {
        width: 100%;
        padding: 10px 0 15px 0;
        border-bottom: 1px dashed #fff;
    }
    
    nav#chapter li a {
        display: block;
        color: #fff;
        font-size: 18px;
        font-family: 'Roboto Slab', serif;
        transition: color 1s ease;
    }
    
    nav#chapter li a span {
        display: block;
        font-size: 14px;
        line-height: 18px;
        font-family: 'Open Sans', sans-serif;
    }
    
    nav#chapter li a:hover {
        color: gray;
    }
    
    nav#chapter li:last-child {
        border-bottom: none;
    }
    
    main {
        width: 70%;
        position: relative;
        margin: 0 0 0 30%;
        background: #fff;
    }
    
    article {
        padding: 70px 11.14% 20px 11.14%;
    }
    
    article a {
        text-decoration: none;
        font-weight: 600;
        color: #0f95e8;
    }
    
    article img {
        display: block;
        max-width: 100%;
        margin: 0 auto 30px 0;
    }
    
    article h1,
    article h2 {
        margin-bottom: 25px;
        line-height: 1.2em;
    }
    
    article h1 {
        font-family: 'Open Sans', sans-serif;
        font-size: 2em;
        color: dimgrey;
    }
    
    .titulo {
        font-weight: 400;
        font-size: 2.6em;
        text-align: center;
    }
    
    .titulo span {
        font-size: 1.4em;
    }
    
    article h2 {
        border-top: cadetblue 2px solid;
        font-size: 1.2em;
        font-weight: 600;
        color: #696969;
    }
    
    .fuente {
        text-transform: uppercase;
        font-size: 12px;
    }
    
    article .bajada {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 30px;
        font-weight: 400;
        color: cadetblue;
    }
    
    article p {
        font-size: 16px;
        line-height: 20px;
        font-weight: 400;
        margin-bottom: 20px;
    }
    
    article p.column {
        width: 40%;
        margin-left: 5%;
        float: right;
    }
    
    .puntos li {
        list-style: disc;
        list-style-position: inside;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.4em;
        margin-bottom: 5px;
        color: gray;
        padding-left: 5%;
    }
    
    @media screen and (max-width: 600px) {
        article p.column {
            width: 90%;
            margin: auto;
            float: none;
        }
    }
    
    blockquote {
        width: 80%;
        margin: 30px auto;
        padding: 0 0 0 20px;
        font-style: italic;
        font-family: 'Roboto Slab', serif;
        font-size: 20px;
        font-weight: 600;
        border-left: #4a4a4a 10px solid;
    }
    
    blockquote span {
        margin-top: 15px;
        font-family: 'Open Sans', serif;
        font-size: 16px;
        color: #ccc;
    }
    
    blockquote a {
        text-decoration: none;
        color: cadetblue;
    }
    
    @media only screen and (max-width: 900px) {
        nav#chapter {
            display: none;
        }
        main {
            width: 100%;
            max-width: none;
            margin: 0% auto;
        }
    }
    
    @media only screen and (max-width: 500px) {
        blockquote {
            width: 100%;
            font-size: 16px;
        }
        main {
            width: 100%;
            max-width: none;
            margin: 0% auto;
        }
        article {
            width: auto;
            font-size: 0.8em;
            line-height: 1.6em;
        }
    }
    /*graficos*/
    
    .mobile_view {
        display: none;
    }
    
    .desktop_view,
    .mobile_view {
        margin: 15px;
        0;
    }
    
    .desktop_view .wrapper {
        width: 590px;
        height: 690px;
        overflow: hidden;
    }
    
    .imageFull {
        width: 100%;
    }
    
    .mobile_view .wrapper {
        height: 400px;
        overflow: hidden;
    }
    
    .cifras {
        padding: 20px;
        width: 48%;
        margin: 0 auto;
        display: inline-block;
    }
    
    .cifras p {
        text-align: center
    }
    
    .cifras p span {
        font-size: 60px;
        font-weight: 200;
        border-bottom: 2px black solid;
    }
    
    @media (max-width: 650px) {
        .cifras p span {
            font-size: 50px;
        }
    }
    
    @media (max-width: 600px) {
        .mobile_view {
            display: block;
        }
        .desktop_view {
            display: none;
        }
        .cifras {
            margin: 0 auto;
            width: 100%;
            text-align: center
        }
    }