pre {border:1px solid #09242f}
code {font-family: 'Inconsolata', monospace;}
body {font-family: 'Source Serif Pro', serif;font-size:17px;background:#04141b;color:#d8d8d8;}
div, article, nav {box-sizing: border-box;}
p {line-height: 170%;}
li {margin-bottom: 2px;}
#container {margin:0 auto;padding:25px;max-width:1440px;}
/*#main {float:left;width:76%;}
#menu {padding: 5px 15px;float:right;width:22%;}*/
#menu ul {margin:0;padding:0;list-style:none;}
#menu li {margin-bottom: 10px;font-size: 14px;}
#menu h4 {margin:25px 0 15px}
h1 {color:#fafafa;}
h3 {color: #d85655;margin-top: 30px;}
a {color:#29c;text-decoration: none;word-wrap: break-word;}
a.active {color:#d85655;}
a:hover {color:#4ae;}
a.active:hover {color:#d85655;}
.nav {margin:-25px 0 -10px;}
.nav a {display:inline-block;padding: 20px;box-sizing: border-box;}
a#logo {padding-left:0;}
.pull-left {float:left;}
.pull-right {float:right;}

#adminbar a {padding:8px 14px;display:block;float:right;background: #d85655;color: #000;}

/* top nav */
#topnav {text-align: right}
#topnav ul.nav {margin:0;padding:0;display: inline-block;}
#topnav ul > li {display:inline-block;}
#topnav li a {padding:20px;}
#topnav .nav>li>a:focus, #topnav .nav>li>a:hover {background: transparent;color: #fff;}
#topnav button.navbar-toggle {
    display: inline-block;
    padding: 16px 10px;
}



/* Toggle Styles */
body .navbar-toggle {
    display: inline-block;
    margin-right:0;
}
.navbar-toggle .icon-bar {background:#3f9ed6;}

#wrapper #main {
    margin: 0 auto;
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    padding-bottom: 90px;
}

#wrapper #main .row {margin:0 auto;max-width: 820px}

#wrapper.toggled #main {
  /*  padding-left: 260px;*/
}

#sidebar-wrapper {font-size:14px;margin-top: 20px}
#sidebar-wrapper .side-menu-header {font-size: 130%;margin-top:10px;}
#sidebar-wrapper ul, #sidebar-wrapper li {margin:0;padding:0;list-style: none;}
#sidebar-wrapper a {    padding: 5px 20px;    display: block;}

#sidebar-wrapper {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
   
}

#main {
    padding: 15px;
}

#wrapper.toggled #main {
}
/* logo */
#joomlacode-logo {text-align:left;padding:20px;}
#joomlacode-logo img {}



/* top bar */
body #main .navbar-toggle {
    display: inline-block;
    float: left;
    left: 2px;
    top: -2px;
    margin-right: 0;
    margin-top: 8px;
}

#topbar {height:45px;margin:0;padding:0;border-bottom: 1px solid #ddd;background:#fff;}

/* heading bar */
h1 {
    font-size: 29px;
    color: #e8e8e8;
    font-weight: 100;
    margin: 30px 0 20px;
}

#headingbar {min-height:70px;background:#f5f5f5;padding:40px 45px 10px;}


.joomlacode-header-container {
    background: #dbdfe2;
    color: #333;
    padding: 8px 12px;
}


/* ###### MEDIA QUERIES ############################################################################################# */


@media(max-width:1919px) {
    #sidebar-wrapper ul.nav li a {padding:6px;}
}

@media(max-width:1199px) {
    body .navbar-toggle {top:0;margin:0;}
    .nav>li>a {padding:5px 15px;}
    .tbtable td, .tbtable th {font-size:12px;}
    #headingbar, #tb_content, #tb_indextable, #tb_form, #tb_footer {padding:10px 25px 15px;}
}

@media all and (max-width:999px){

   #wrapper #sidebar-wrapper {
        display: none;
    }

    #wrapper.toggled #sidebar-wrapper {
        display: block;
        position: absolute;
        background: #04141b;
        width: 261px;
        z-index: 2;
        border-right:1px solid #999;
        top:0;
        margin: 0;border-bottom: 1px solid #999
    }
}


@media all and (max-width:767px){
    body {font-size: 15px;}
    .nav {text-align: center;}
    .nav a#logo {padding:15px 70px;}
    .nav > a {display:inline-block;float:none;}
    #main, #menu {width:auto;float:none;padding:0;}
    #wrapper #topnav > ul {display: none;}
    #wrapper .col-sm-8 {position: static;}
    #wrapper #topnav > button {position: absolute;top:5px;right:3px;}
}

@media(min-width:1000px) { 
    body.catid-8 #nav-tutorials {display:none;}
    body.catid-9 #nav-documentation {display:none;}

    #page-content-wrapper {}
    #wrapper.toggled #page-content-wrapper {}

    #sidebar-wrapper {
        width: 261px;
        float:left;
    }

    #wrapper.toggled #sidebar-wrapper {
        display: none;
    }

    #main {
        width: calc(100% - 262px);
        float: left;
        padding: 0px;
    }

    #wrapper.toggled #main {
        position: relative;
        margin-right: 0;
        float:none;
        width: auto;
    }

}