/* 
    Document   : main.layout
    Created on : 2013-07-27, 20:24:21
    Author     : Marek
    Description:
        Purpose of the stylesheet follows.
*/

* {
    font-family: sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.box {
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    -webkit-flex-flow: column nowrap;
    -moz-flex-flow: column nowrap;
    flex-flow: column nowrap;
}

.row {
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    -moz-flex-flow: row nowrap;
    flex-flow: row nowrap;

    height: 100%;
}

.box header {
    -webkit-box-ordinal-group: 1;   /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 1;      /* OLD - Firefox 19- */
    -ms-flex-order: 1;              /* TWEENER - IE 10 */
    -webkit-order: 1;               /* NEW - Chrome */
    order: 1;

    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    flex: 0 1 auto;

    -webkit-align-self: auto;
    align-self: auto;
    
    min-width: 100%;
    /* min-height: 65px;
    height: 65px; */
    min-height: 45px;
    height: 45px;
    position: relative;
}

nav {
    float: right;
    position: absolute;
    bottom: 0;
    right: 5px;
}
nav ul {
    vertical-align: bottom;
}

nav ul li {
    float: left;
    padding: 5px 15px;
    margin-right: 1px;
    bottom: 0;
    margin-top: 13px;
}

.box div#content {
    -webkit-box-ordinal-group: 2;   /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 2;      /* OLD - Firefox 19- */
    -ms-flex-order: 2;              /* TWEENER - IE 10 */
    -webkit-order: 2;               /* NEW - Chrome */
    order: 2;

    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    flex: 1 1 auto;

    -webkit-align-self: auto;
    align-self: auto;
    
    min-width: 100%;
    /*min-height: auto;*/
    height: 100%;
    overflow: hidden;
    position: relative;
}

.box div#main {
}
.box div#sidebar {
    -webkit-box-ordinal-group: 1;   /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 1;      /* OLD - Firefox 19- */
    -ms-flex-order: 1;              /* TWEENER - IE 10 */
    -webkit-order: 1;               /* NEW - Chrome */
    order: 1;

    -webkit-flex: 0 1 auto;
    -moz-flex: 0 1 auto;
    flex: 0 1 auto;

    -webkit-align-self: auto;
    align-self: auto;
    
    min-width: 50px;
    /*min-height: auto;*/
    height: 100%;
}

.box footer {
    -webkit-box-ordinal-group: 3;   /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-ordinal-group: 3;      /* OLD - Firefox 19- */
    -ms-flex-order: 3;              /* TWEENER - IE 10 */
    -webkit-order: 3;               /* NEW - Chrome */
    order: 3;

    -webkit-flex: 0 2 auto;
    -moz-flex: 0 2 auto;
    flex: 0 2 auto;

    -webkit-align-self: flex-end;
    align-self: flex-end;
    
    min-width: 100%;
    min-height: 13px;
    height: 13px;
}