/*
Layout

Styleguide 3
*/

html, body {
    width: 100%;
    height: 100%;
}

/*
Body

Sets font and background

Styleguide 3.1
*/
.bauhaus-body {
    background: -webkit-linear-gradient(left, #eeeeee 0px, #eeeeee 200px, transparent 201px);
    font-family: Helvetica, Arial, sans-serif;
    margin: 0px;
    padding: 0px;

    .bauhaus-navigation {  
        top: 0px;
        bottom: 0px;
        position: absolute;
        float: left;
        padding: 20px 0;
    }
}

/*
Main Navigation

Main navigation on the side

Markup:
<div class="bauhaus-navigation">
    <ul class="navigation-list">
        <li class="navigation-list-item">
            <a href="#">
                <i class="navigation-icon fa fa-dashboard"></i>
                Dashboard
            </>
        </li>
    </ul>
</div>

Styleguide 3.2
*/

.bauhaus-navigation {
    width: 200px;
    display: block;

    .bauhaus-title {
        margin: 0 0 10px 0;
        font-weight: bold;
        color: #555555;
        font-size: 20px;
        text-align: center;
    }

    .navigation-list {
        list-style-type: none;
        margin: 0px;
        padding: 0px;

        .navigation-list-item a {
            color: #555555;
            text-decoration: none;
            padding: 8px 20px;
            display: block;

            .navigation-icon {
                width: 20px;
                text-align: center;
            }
        }
    }
}

/*
Top navigation

Styleguide 3.3
*/
.bauhaus-top-navigation {
    position: absolute;
    color: #555555;
    top: 15px;
    right: 25px;
    font-size: 14px;
}

/*
Content area

Styleguide 3.4
*/

.bauhaus-content {
    margin-left: 200px;
    padding: 0px;
}