/* Edit pkgdown/extra.css to customize the theme */

/* Color:
 * logo-purple:     #8709b0;
 */

@import url('https://fonts.googleapis.com/css?family=Roboto:300,500');

body { 
    font-family: 'Roboto', sans-serif; 
    font-weight: 300;
}

/* The "default" hyperlinks: default bright blue, hover pinkish */
a       { color: #8709b0;}

/* Font size for the content and the navigation bar (top): increase
 * font size by a factor of 1.3 (1.3 elements, global) */
#navbar, div.contents { font-size: 1.3em; }

#tocnav > ul > li > a:hover {
    color: #8709b0;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Roboto', sans-serif; 
    font-weight: 500;
}

b, strong, th {
    font-weight: 500;
}

.navbar-brand {
    background-image: url('logo_wide.png');
    background-repeat: no-repeat;
    background-position: 12.5px 5px;
    background-size: 110px auto;
    width: 200px;
    height: 58px;
}

.navbar-brand > .navbar-link {
    opacity: 0;
    width: 0;
    height: 0;
    display: block;
    font-size: 1.7em;
    line-height: 1em;
    width: 110px;
    height: 30px;
    float: left;
}

/* Adjust main navigation bar (top) to match the size of the
 * branding/logo */
.navbar-brand > .label {
    display: block;
    margin-left: 110px;
    margin-top: 14px;
    font-weight: normal;
    background-color: transparent;
    /*color: #8709b0;*/
    color: #777;
}

/* Make the logo slightly smaller to avoid line breaks
 * on the collapsed view */
@media all and (max-width: 250px) {
    .navbar-brand {
        width: 110px;
        background-size: 100px;
        background-position: 10px 5px;
        height: 39px;
    }
    .navbar-brand > .navbar-link { height: 25px; width: 100px; }
    .navbar-brand > .label { margin-top: 10px; margin-left: 100px; }
}

.navbar .navbar-nav > li > a {
    margin: 11px 0.5em;
    padding: 8px 8px;
}
.navbar > .navbar-nav > li.dropdown.open > a,
.navbar > .navbar-nav > li.dropdown.open:hover,
.navbar > .navbar-nav > li.dropdown.open > a:hover {
    background-color: transparent;
}

.dropdown-menu > li {
    background-color: white;
}
.dropdown-menu > li > a:hover {
    color: #8709b0;
}
.navbar .navbar-nav > li:hover,
.navbar .navbar-nav > li.dropdown:hover {
    background-color: #8709b0;
}
.navbar .navbar-nav > li > a:hover, .navbar .navbar-nav > li.dropdown > a:hover,
.navbar .navbar-nav > li:hover > a, .navbar .navbar-nav > li.dropdown:hover > a {
    background-color: #8709b0;
    color: white;
}
.navbar .navbar-nav > .active {
    background-color: #ececec;
}
.navbar .navbar-nav > .active:hover {
    background-color: #8709b0;
}
.navbar .navbar-nav > .active:hover > *,
.navbar .navbar-nav > .active > a:hover {
    color: white;
    background-color: transparent;
}
.navbar .navbar-nav > li.dropdown.open:hover,
.navbar .navbar-nav > li.dropdown:hover {
    background-color: #8709b0;
}
.navbar .navbar-nav > li.dropdown.open:hover,
.navbar .navbar-nav > li.dropdown:hover,
.navbar .navbar-nav > li.dropdown > *:hover {
    color: white;
}
.navbar .navbar-nav > .active > a,
.navbar .navbar-nav > .active > a:hover {
    background-color: transparent;
}


div#overview div.page-header h1 {
    margin-top: 22px;
    padding: 0;
    font-size: 250%;
    color: dimgray;
}

div#system-requirements th {
    text-align: center;
}

div.page-header h1 {
    font-size: 250%;
    color: dimgray;
}

div.page-header h4 {
    padding-top: 10px;
    font-size: 120%;
}

div.contents h1 {
    color: dimgray;
    font-size: 200%;
    padding-top: 80px;
}

div.contents h2 {
    font-size: 150%;
    padding-top: 70px;
}

div.contents h3 {
    font-size: 120%;
    padding-top: 60px;
}

div.contents h4 {
    font-size: 100%;
    padding-top: 60px;
}

pre {
    overflow-x: auto;
    font-size: 80%;
    line-height: 150%;
}