// Bootstrap Framework
@import "bootstrap/bootstrap.less";

// Unofficial GitHubButtons
@import (inline) "social-buttons/social-buttons.css";

/*! EnlighterJS Syntax Highlighter | MIT License (X11) | http://enlighterjs.andidittrich.de/ */
body{
    // credits bg
    background-color: #202021;

    // Static Nav
    padding: 50px 0px 0px 0px;
}

footer {
    background-color: #ffffff;
    border-top: solid 1px #e0e0e0;
    padding: 40px 0px 40px 0px;

    .footer-links {
        a {
            padding: 0px 10px 0px 10px;
        }
        span {
            padding-right: 10px;
        }
    }
    p.text-muted{
        padding-bottom: 15px;
    }
}

#ghb {
    padding-bottom: 20px;
    > div {
        display: inline-block;
        padding: 0px 20px 0px 0px;
    }
}


/* Beyond Technology Corporate
------------------------------------------------ */
#beyond_corporate_credits{
    background-color: #202021;
    color: #929292;
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 5px 0px;

    a{
        color: inherit;
    }
    .slogan{
        color: #e0e0e0;
    }
}

/* NAVS
------------------------------------------------ */
nav{
    &.topnav{
        background-color: @brand-primary;
        padding: 0px 0px 0px 0px;
        height: 50px;
        overflow: hidden;
        border: none;
        position: fixed;
        left: 0px;
        top: 0px;
        width: 100%;
        z-index: 100;
        border-bottom: solid 1px lighten(@brand-primary, 5%);

        .glyphicon{
            color: #f0f0f0;
            font-size: 16px;
            padding-right: 10px;
        }

        li{
            display: inline-block;
            padding: 0px;
        }

        a {
            height: 50px;
            line-height: 50px;
            display: inline-block;
            color:  lighten(@brand-primary, 65%);
            padding: 0px 15px 0px 15px;

            &:hover, &:active{
                text-decoration: none;
                border-bottom: none;
                color: #ffffff;
                background-color: #192c48;

                .glyphicon{
                    color: #ffffff;
                }
            }
        }

        .container{

        }

        .nav-tabs{
            border: none;
        }
    }

}

/* Header
------------------------------------------------ */
header {
    background-color: @brand-primary;
    background-image: svg-gradient(to bottom, @brand-primary, lighten(@brand-primary, 10%));
    padding: 20px 0px 20px 0px;
    color: #ffffff;

    h1{
        color: inherit;
        font-size: 60px;
        font-weight: normal;
    }
    .lead{
        color:  lighten(@brand-primary, 65%);
    }
}

/* Notifications
------------------------------------------------ */
#ReleaseNotifier{
    height: 40px;
    background-color: #f9f9f9;
    border-bottom: solid 1px #e0e0e0;
    color: #707070;

    p{
        line-height: 40px;
    }
}


/* Content Sections
------------------------------------------------ */
section{
    padding: 15px 0px 15px 0px;
    background-color: #f7f7fa;
    // primary section
    &:nth-of-type(2) {
        background-color: #e0e0e0;
    }
}

/* CONTENT
------------------------------------------------ */

article{
    background-color: #ffffff;
    padding: 10px 20px 50px 20px;
    border-top: solid 0px #e0e0e0;
    border-bottom: solid 1px #e0e0e0;

    span.anchor{
        display: block;
        visibility: hidden;
        position: relative;
        top: -50px;
    }

    .icon{
        display: block;
        text-align: center;
        font-size: 15px;
        color: #a0a0a0;
        padding: 20px 0px 0px 0px;
        font-style: italic;

        .glyphicon{
            font-size: 50px;
            color: #e0e0e0;
        }
    }

    .bordered{
        border: dashed 5px #f0f0f0;
        padding: 10px 20px 30px 20px;
    }
    pre{
        background-color: #f5f5f5;
        border-radius: 0px;
        border: solid 1px #f0f0f0;

        &.raw{
            width: 50%;
            margin: auto;
        }
    }

    h2{
        border-bottom: solid 5px #f0f0f0;
        color: #535353;
        font-size: 40px;
        height: 60px;
        margin: 50px 0px 20px 0px;
        padding: 10px 0px 10px 0px;

        &:nth-of-type(1){
            margin-top: 0px;
        }
    }
    h3 {
    }
    h4{
        padding-top: 25px;
    }
    p{
    }

    blockquote{
        font-size: 14px;
        color: #707070;
    }

    // fallback content nav
    .sec-nav .btn{
        margin: 5px;
    }
}


/* CONTENT NAVIGATION
-------------------------------------------------- */
#content-nav{
    &.fixedPosition{
        position: fixed;
        top: 70px;
    }

    display: block;
    position: relative;
    width: auto;
    height: auto;
    top: 10px;
    left: auto;

    list-style: none;
    margin: 0px;
    padding: 0px;
    line-height: 18px;

    // scrollspy active
    .spyActive{

        > a{
            font-weight: bold;
        }

        ul{
            display: block;
        }
    }
    li{
        padding: 0px;
    }

    a{
        color: lighten(@brand-primary, 15%);
        text-decoration: none;
        padding: 4px 5px 4px 5px;
        display: block;


        &:hover{
            background-color: #ffffff;
        }
    }


    ul{
        list-style: none;
        margin: 10px 0px 10px 15px;
        padding: 0px;
        line-height: 18px;
        font-size: 12px;
        display: none;
    }
}

/* To Top Button
-------------------------------------------------- */
#ToTop{
    display: none;
    position: fixed;
    right: 50px;
    top: 52%;
    font-size: 35px;
    width: 50px;
    height: 50px;

    .visible-lg;

    a{
        color: #e0e0e0;
    }
    a:hover{
        text-decoration: none;
    }
}


/* CLOUD BUILDER
-------------------------------------------------- */
#builder-form .checkbox {
    display: block;
    padding: 3px 0px 3px 30px;
}

#builder-form .checkbox label {
    color: #707070;
}

#builder-form a {
    cursor: pointer;
}