*, *:before, *:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
    
html {
    height: 100%;
}

body {
    font-family: 'Open Sans';
    color: white;
    min-height: 100%; 
}

@media (min-width: 40rem){
    html { font-size: 112%; }
    
    .column {
        float: left;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    .column.full { width: 100%; }
    .column.two-thirds { width: 66.7%; }
    .column.half { width: 50%; }
    .column.third { width: 33.3%; }
    .column.fourth { width: 25%; }
    .column.flow-opposite { float: right; } 
    
}

@media (min-width: 64rem) {
    html { font-size: 120%; }
}

.container {
    margin: 0 auto;
    max-width: 64rem;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.navbar {
    position: relative;
    padding: 0.5rem;
    background-color: rgba(101,18,95,0.5);
    z-index: 1;
}

.navbar .logo {
    position: relative;
    left: 2rem;
    cursor: pointer;
}

.navbar .links-container {
    display: table;
    position: absolute;
    top: 0;
    right: 0;
    height: 100px;
    color: white;
    text-decoration: none;
}

.links-container .navbar-link {
    display: table-cell;
    position: relative;
    height: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
    vertical-align: middle;
    color: white;
    font-size: 0.625rem;
    letter-spacing: 0.05rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
}

.links-container .navbar-link:hover {
    color: rgb(233,50,117);
}

.container.narrow {
    max-width: 56rem;
}