@import (less) "../css/bootstrap.css";
@import (less) "../css/icons.css";
@import (less) "../css/pygments.css";

@import "lesshat.less";

@font-face {
    .font-face(merriweatherlight, "../font/merriweather-light", 300);
}

@font-face {
    .font-face(ralewaymedium, "../font/raleway-medium", 500);
}

body {
    background-color: #fafafa;
    font-family: merriweatherlight;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'ralewaymedium';
}

a {
    .transition(color 0.2s ease-in-out);
    color: #2e2e2e;
    // text-decoration: underline;
    &:hover {
        color: orange;
    }
    &.nodec {
        text-decoration: none;
    }
}

.header {
    background-color: #efefef;
    border-bottom: 1px solid #ddd;
    border-top: 5px solid #333;
    margin-bottom: 30px;
    padding: 30px 0;
    .header-image {
        margin-right: 30px;
        width: 200px;
    }
    .header-name {
        font-size: 82px;
        margin-top: 0;
    }
    .header-text {
        color: #000;
        font-size: 22px;
        margin-bottom: 51px;
        margin-top: 0;
    }
    .header-menu {
        font-size: 18px;
        margin-bottom: 0;
        li {
            &:first-child {
                padding-left: 0;
            }
            &:last-child {
                padding-right: 0;
            }
        }
    }
}

.footer {
    background-color: #efefef;
    color: grey;
    border-top: 1px solid #ddd;
    font-size: 12px;
    margin-top: 30px;
    padding: 30px 0;
}

.post {
    font-size: 16px;
    &.mini-post {
        padding: 30px 0;
        border-bottom: 1px solid #ddd;
        &:last-child {
            border-bottom: none;
        }
        .post-title {
            font-size: 16px;
            line-height: 1.42857143; // Bootstrap
            margin-bottom: 10px;
            margin-top: 0;
        }
    }
    &.full-post {
        * img {
            max-width: 940px;
        }
    }
}

// .highlight {
//     width: 600px;
//     margin-left: 50px;
//     margin-bottom: 20px;
//     overflow: auto;
//     border: 1px solid grey;
//     border-radius: 5px;
// }

.separator {
    margin-top: 30px;
    margin-bottom: 30px;
}