<commit_before>@import '../libs/blueleaf/scss/blueleaf.scss';

@font-face {
    font-family: PinyonScript;
    src: url("../font/PinyonScript-Regular.ttf");
} 

body {
    font-family: sans-serif;
}

.page-header {
    @include container();
    background-color:#006785;
    color:white;
    height:calc(100vh - 3.6rem);
    min-height:35rem;
    
    @include bp(s, down) {
        @include visibility(hide);
    }
    
    .wrapper {
        @include align(center);
        @include container(6,auto,center,height);
    }
    
    .logo-spacer {
        @include row(2);
        @include col(12);
    }
    
    .logo {
        @include row(5);
        @include col(12);
        @include gutter(4);
        
        @include bp(m,onl) {
            font-size:0.7em;
        }
        
        h1 {
            font-size:8em;
            font-weight:normal;
            margin:0;
            
            img {
                @include inline-image();
            }
        }
        
        p {
            font-size:1.5em;
            margin:0;
            text-align:right;
        }
    }
    
    .logo-sub, .logo-sub2 {
        @include row(2);
        @include col(12);
    }
    
    .logo-sub {
        font-size:2em;
    }
    
    .logo-sub2 {
        font-size:1.3em;
    }
}

.page-navi {
    @include container();
    @include bp(m, up) {
        @include sticky("body",t,t);
    }
    
    border-top: #006785 0.5em solid;
    background-color:#037698;
    
    .wrapper {
        @include container(8);
    }
    
    .logo {
        @include gutter(4);
        
        @include bp(s) {
            @include col(10);
        }
        
        @include bp(l) {
            @include col(3);
        }
        
        @include bp(m,onl) {
            @include visibility(hide);
        }
                
        h1 {
            padding:0;
            margin:0;
            font-size:1.3rem;
            color:white;
            font-weight:normal;
            display:block;
            
            a {
                color:white;
                text-decoration:none;
            }
            
            @include visibility(invisible);
                
            @include bp(s,onl) {
                @include visibility(show);
            }
                
            img {
                @include inline-image();
            }
        }
    }
    
    @include bp-sticked() {
        .logo h1 {
            @include visibility(show);
        }
    }
    
    .menu-button {
        @include col(2);
        @include align(right);
        
        @include bp(m) {
            @include visibility(hide);
        }
        
        a {
            font-size:2.7rem;
            color:white;
            text-decoration:none;
            height:3rem;
            @include offcanvas-toggle(".page-navi .menu");
        }
    } 
    
    .menu {
        @include bp(s) {
            @include col(12);
        }
        
        @include bp(l) {
            @include col(9);
        }
        
        @include bp(s, onl) {
            @include offcanvas();
            @include offcanvas-toggle(".page-navi .menu");
        }
        
        ul {
            @include menu(vertical);
            @include menu-gutter(inner,5);
            @include bp(m) {
                @include menu(horizontal);
            }
            @include bp(l) {
                @include align(right);
            }

            a {
                text-decoration:none;
                color:white;
                &:hover {
                    background-color:#006785;
                }
                @include bp-scrolled {
                    background-color:#006785;
                }
            }
        }
    }
    
    a {
        @include bp(m) {
            @include smoothscrolling();
        }
    }
}

.page-footer {
    @include container();
    
    background-color: #4c4c4c;
    border-top: #575757 1em solid;
    color:#999;
    
    .wrapper {
        @include container(8);
    }
    
    .menu-left, .menu-right {
        ul {
            @include menu(vertical);
            @include menu-gutter(inner,5);
            @include bp(m) {
                @include menu(horizontal);
            }

            a {
                color:white;
                text-decoration:none;
                &:hover {
                    background-color:#575757;
                }
            }
        }
    }
    
    .menu-left {
        @include col(12);
        @include bp(m) {
            @include col(5);
        }
    }
    
    .menu-right {
        @include col(12);
        @include bp(m) {
            @include col(7);
            @include align(right);
        }
    }
    
    .copyright {
        @include col(12);
        @include gutter(5);
    }
}

.page-content {
    .wrapper {
        @include container(8);
        @include gutter(0,4);
    }
    
    line-height:1.5em;
    
    h1,h2,h3,h4,h5,h6 {
        font-weight:normal;
        margin:2em 0 0.5em 0;
    }
        
    h2.desc {
        text-align:center;
    }
        
    p, ul {
        margin: 0.2em 0 0 0;
        text-align:justify;
    }

    ul.features {
        list-style: none;
        padding:0;
        
        li {
            padding:0.25em 0.25em 0.25em 2.5em;
            background:url(../img/favicon.svg) no-repeat;
            background-size:auto 75%;
            background-position:left center;
            color:#555;
        }
    }
    
    p.sub {
        font-size:1.2em;
    }
       
    
    div.highlight {
        font-size:1.2em;
        @include gutter(16, 0);
        margin-top:1rem;
        
        @include bp(s,down) {
            @include gutter(8, 0);
        }
        
        h2 {
            margin:0;
        }
        
        p.sub {
            margin-bottom:0.5em;
        }
        
        .fa { // TODO ausrichtung durch mixin (image align)
            font-size:10em;
            float:right;
            margin-left:4rem;
            @include bp(s,onl) {
                @include visibility(hide);
            }
        }
    }
    
    div.highlight-1 {
        background:#000 url("../img/bg1.png") repeat-x;
        color:#fff;
    }
    
    div.highlight-box {
        @include gutter(8);
                        
        h2 {
            margin:0;
        }
    }
    
    div.highlight-2 {
        background:#ddd;
    }
    
    .threebox {
        @include bp(s) {
            @include col(12); 
            @include gutter(4,0);
        }
        
        @include bp(m) {
            @include col(4); 
            @include gutter(8, 4);
        }
        
        .icon {
            color:#555;
            font-size:5em;
            text-align:center;
        }
        
        .icon i {
            padding: 0 0.2em;
        }
        
        h3 {
            color:#555;
            margin-top:0.2em;
        }
    }
    
    .page-inline-menu {
        @include menu(vertical);
        @include menu-gutter(inner,5);
        @include menu-gutter(outer,2);

        @include bp(m) {
            @include menu(horizontal);
        }

        a {
            color:white;
            text-decoration:none;
            background-color:#037698;<commit_msg>adjusted homepage to use new APIs<commit_after>@import '../libs/blueleaf/scss/blueleaf.scss';

@font-face {
    font-family: PinyonScript;
    src: url("../font/PinyonScript-Regular.ttf");
} 

body {
    font-family: sans-serif;
}

.page-header {
    @include container();
    background-color:#006785;
    color:white;
    height:calc(100vh - 3.6rem);
    min-height:35rem;
    
    @include bp(s, down) {
        @include visibility(hide);
    }
    
    .wrapper {
        @include align(center);
        @include container(6,auto,center,height);
    }
    
    .logo-spacer {
        @include row(2);
        @include col(12);
    }
    
    .logo {
        @include row(5);
        @include col(12);
        @include gutter(4);
        
        @include bp(m,onl) {
            font-size:0.7em;
        }
        
        h1 {
            font-size:8em;
            font-weight:normal;
            margin:0;
            
            img {
                @include inline-image();
            }
        }
        
        p {
            font-size:1.5em;
            margin:0;
            text-align:right;
        }
    }
    
    .logo-sub, .logo-sub2 {
        @include row(2);
        @include col(12);
    }
    
    .logo-sub {
        font-size:2em;
    }
    
    .logo-sub2 {
        font-size:1.3em;
    }
}

.page-navi {
    @include container();
    @include bp(m, up) {
        @include sticky("body",t,t);
    }
    
    border-top: #006785 0.5em solid;
    background-color:#037698;
    
    .wrapper {
        @include container(8);
    }
    
    .logo {
        @include gutter(4);
        
        @include bp(s) {
            @include col(10);
        }
        
        @include bp(l) {
            @include col(3);
        }
        
        @include bp(m,onl) {
            @include visibility(hide);
        }
                
        h1 {
            padding:0;
            margin:0;
            font-size:1.3rem;
            color:white;
            font-weight:normal;
            display:block;
            
            a {
                color:white;
                text-decoration:none;
            }
            
            @include visibility(invisible);
                
            @include bp(s,onl) {
                @include visibility(show);
            }
                
            img {
                @include inline-image();
            }
        }
    }
    
    @include bp-sticked() {
        .logo h1 {
            @include visibility(show);
        }
    }
    
    .menu-button {
        @include col(2);
        @include align(right);
        
        @include bp(m) {
            @include visibility(hide);
        }
        
        a {
            font-size:2.7rem;
            color:white;
            text-decoration:none;
            height:3rem;
            @include offcanvas-toggle(".page-navi .menu");
        }
    } 
    
    .menu {
        @include bp(s) {
            @include col(12);
        }
        
        @include bp(l) {
            @include col(9);
        }
        
        @include bp(s, onl) {
            @include offcanvas();
            @include offcanvas-toggle(".page-navi .menu");
        }
        
        ul {
            @include menu(vertical,(innrgttr: 5));
            @include bp(m) {
                @include menu(horizontal,(innrgttr:5));
            }
            @include bp(l) {
                @include align(right);
            }

            a {
                text-decoration:none;
                color:white;
                &:hover {
                    background-color:#006785;
                }
                @include bp-scrolled {
                    background-color:#006785;
                }
            }
        }
    }
    
    a {
        @include bp(m) {
            @include smoothscrolling();
        }
    }
}

.page-footer {
    @include container();
    
    background-color: #4c4c4c;
    border-top: #575757 1em solid;
    color:#999;
    
    .wrapper {
        @include container(8);
    }
    
    .menu-left, .menu-right {
        ul {
            @include menu(vertical,(innrgttr:5));
            @include bp(m) {
                @include menu(horizontal,(innrgttr:5));
            }

            a {
                color:white;
                text-decoration:none;
                &:hover {
                    background-color:#575757;
                }
            }
        }
    }
    
    .menu-left {
        @include col(12);
        @include bp(m) {
            @include col(5);
        }
    }
    
    .menu-right {
        @include col(12);
        @include bp(m) {
            @include col(7);
            @include align(right);
        }
    }
    
    .copyright {
        @include col(12);
        @include gutter(5);
    }
}

.page-content {
    .wrapper {
        @include container(8);
        @include gutter(0,4);
    }
    
    line-height:1.5em;
    
    h1,h2,h3,h4,h5,h6 {
        font-weight:normal;
        margin:2em 0 0.5em 0;
    }
        
    h2.desc {
        text-align:center;
    }
        
    p, ul {
        margin: 0.2em 0 0 0;
        text-align:justify;
    }

    ul.features {
        list-style: none;
        padding:0;
        
        li {
            padding:0.25em 0.25em 0.25em 2.5em;
            background:url(../img/favicon.svg) no-repeat;
            background-size:auto 75%;
            background-position:left center;
            color:#555;
        }
    }
    
    p.sub {
        font-size:1.2em;
    }
       
    
    div.highlight {
        font-size:1.2em;
        @include gutter(16, 0);
        margin-top:1rem;
        
        @include bp(s,down) {
            @include gutter(8, 0);
        }
        
        h2 {
            margin:0;
        }
        
        p.sub {
            margin-bottom:0.5em;
        }
        
        .fa { // TODO ausrichtung durch mixin (image align)
            font-size:10em;
            float:right;
            margin-left:4rem;
            @include bp(s,onl) {
                @include visibility(hide);
            }
        }
    }
    
    div.highlight-1 {
        background:#000 url("../img/bg1.png") repeat-x;
        color:#fff;
    }
    
    div.highlight-box {
        @include gutter(8);
                        
        h2 {
            margin:0;
        }
    }
    
    div.highlight-2 {
        background:#ddd;
    }
    
    .threebox {
        @include bp(s) {
            @include col(12); 
            @include gutter(4,0);
        }
        
        @include bp(m) {
            @include col(4); 
            @include gutter(8, 4);
        }
        
        .icon {
            color:#555;
            font-size:5em;
            text-align:center;
        }
        
        .icon i {
            padding: 0 0.2em;
        }
        
        h3 {
            color:#555;
            margin-top:0.2em;
        }
    }
    
    .page-inline-menu {
        @include menu(vertical,(innrgttr:5,outrgttr:2));

        @include bp(m) {
            @include menu(horizontal,(innrgttr:5,outrgttr:2));
        }

        a {
            color:white;
            text-decoration:none;
            background-color:#037698;
{'fraction_non_alphanumeric': 0.1205521259624055, 'fraction_numerical': 0.028716099049732956, 'mean_word_length': 0.9944667312214691, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5381722', 'n_tokens_mistral': 4756, 'n_tokens_neox': 4434, 'n_words': 703}