/* General page styles */

.wrapper {
    /* TODO: use an optional sidebar as a way of restricting the width of the text */
}

.main-content {
    position: relative;
    padding-bottom: 2em;
}

h1 {
    font-size: 2.5em;
}

h1 > .glyphicon {
    font-size: 0.7em;
}

h2 > .glyphicon {
    font-size: 0.5em;
}

.section {
    margin-bottom: 3em;
}

.section-title {
    font-size: 2em;
    padding-bottom: 0.2em;
    border-bottom: 1px solid #ddd;
}

.jump-link {
    margin-left: 0.3em;
    font-size: 0.65em;
    color: #aaa;
}

.jump-link:hover,
.jump-link:active,
.jump-link:focus {
    color: rgb(60, 170, 220);
}

h3 {
    margin-top: 0;
}

.todo {
    color: red;
    font-weight: bold;
}


/* Header and nav */

.header {
    position: relative;
    padding: 1em 0;
    border-bottom: 3px solid rgb(60, 170, 220);
    margin-bottom: 2em;
}

.cse-logo {
    float: left;
    /* border-right: 3px solid rgb(60, 170, 220); */
    border-right: 3px solid #DDD;
    padding-right: 1em;
    margin-right: 1em;
    width: 300px;
    height: 60px;
    padding-top: 15px;
}

.cse-logo > img {
    margin: 0;
}

.site-title {
    float: left;
    font-size: 1.5em;
    padding-top: 0.5em;
}

.site-title > a {
    color: #333;
}

.site-title > a:hover,
.site-title > a:focus,
.site-title > a:active {
    color: rgb(60, 170, 220);
    text-decoration: none;
}


/* Index page */

.toc-selector {
    margin-bottom: 1em;
}

.toc-segment > ul {
    list-style-type: none;
    padding-left: 0;
}

.toc-segment li > ul {
    padding-left: 2em;
}


/* Rules */

.rule {
    margin-bottom: 2em;
}

.rule-title {
    font-size: 1.3em;
}

.collapsed {
    display: none;
    padding-top: 1em;
}

.btn-expand {
    border: 1px solid rgb(60, 170, 220);
    background-color: #fff;
}

.btn-expand:focus,
.btn-expand:hover,
.btn-expand:active {
    background-color: #eee;
    border-color: #A720C6;
}

.example {
    position:relative;
    -webkit-box-shadow:inset 0 3px 6px rgba(0,0,0,.05);
    box-shadow:inset 0 3px 6px rgba(0,0,0,.05);
    border-color:#e5e5e5 #eee #eee;
    border-style:solid;
    border-width:1px 0;
    padding: 45px 15px 15px;
    border-radius: 10px;
    margin-bottom: 0.5em;
}

.example:after {
    position:absolute;
    top:15px;
    left:15px;
    font-size:12px;
    font-weight:700;
    color:black;
    text-transform:uppercase;
    letter-spacing:1px;
    content:"Example";
}

.example.bad {
    background-color: rgba(192, 0, 0, 0.6);
}

.example.better {
    background-color: rgba(192, 192, 0, 0.6);
}

.example.good {
    background-color: rgba(0, 192, 0, 0.6);
}

.example.bad:after {
    content:"Bad Example";
}

.example.good:after {
    content:"Better Example";
}

.example.good:after {
    content:"Good Example";
}

.example>.list-group {
    max-width:400px;
}

pre.line-numbers > code {
    margin-left: -15px;
}

pre[class*="language-"].line-numbers {
    padding: 3px;
}

pre[class*="language-"].line-numbers code {
    padding-left: 3.5em;
}

pre {
    border-radius: 10px;
}

img {
    max-width: 100%;
    margin: 15px 0;
}

.fixed {
    position: fixed;
}


/* Tweaks to custom google search */

/* Fix for google search button courtesy of
 * http://stackoverflow.com/q/36799767/646543
 */
.cse .gsc-search-button input.gsc-search-button-v2,
input.gsc-search-button-v2 {
    height: 26px !important;
    margin-top: 0 !important;
    min-width: 13px !important;
    padding: 5px 26px !important;
    width: 68px !important;
}

/* Fix for hidden bottom border courtesy of
 * http://www.webdesignerforum.co.uk/topic/82187-issues-with-google-custom-search-bottom-border-missing/
 */
.gsib_a {
    padding: 0 8px 0 !important;
}