/* ============================================================
    Reset
============================================================ */

.page {
    position: relative;
}



/* ============================================================
    Elements
============================================================ */

/*a:link {
    color: #c2262e
}

a:visited {
    color: #921a1f;
}*/

h1,
h2 {
    font-size: 20px;
    font-weight: bold;
    margin: 0;
}

h3 {
    font-size: 20px;
    font-weight: bold;
    margin: 0;
}

h4 {
    font-weight: bold;
    margin: 0;
}

/* ============================================================
    Clearfix
============================================================ */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

* html .clearfix {height: 1%;}

.clearfix {display: block;}

/* ============================================================
    Dev
============================================================ */

    .viewport__site {
        position: fixed;
        top: 0;
        left: 0;
        overflow: auto;
        height: 100%;
        width: calc(100% - 300px);
        -moz-transition: width .3s ease;
        -webkit-transition: width .3s ease;
        transition: width .3s ease;
    }

    .viewport__console {
        position: fixed;
        width: 300px;
        height: 100%;
        right: 0;
        top: 0;
        overflow: auto;
        background-color: #eee;
        box-shadow: 0 0 5px rgba(0,0,0,.5);
        font-family: sans-serif;
        font-size: 10px;
        -moz-transition: width .3s ease;
        -webkit-transition: width .3s ease;
        transition: width .3s ease;
    }