body {
    padding-top: 44px;
}
/* ==========================================================================
   Selectize Bootstrap overrides
   ========================================================================== */
.form-control.selectize-control {
    height: 34px;
}

/* Django Messages
   ========================================================================== */

ul.messages {
    padding: 0 0 5px 0;
    margin: 0;
}

ul.messages li {
    font-size: 12px;
    display: block;
    padding: 4px 5px 4px 25px;
    /* padding: 9px 5px 10px 25px; */
    margin: 0 0 3px 0;
    border-bottom: 1px solid #ddd;
    color: #666;
}

.info,
.success,
.warning,
.error,
.validation {
    padding: 4px 5px 4px 25px;
    margin: 0 0 3px 0;
    border-bottom: 1px solid #ddd;
}

.info {
    background: #ffc url(../admin/img/icon_success.gif) 5px .3em no-repeat;
}

.success {
    background: #ffc url(../admin/img/icon_success.gif) 5px .3em no-repeat;
}

.warning {
    background: #ffc url(../admin/img/icon_alert.gif) 5px .3em no-repeat;
}

.error {
    background: #ffc url(../admin/img/icon_error.gif) 5px .3em no-repeat;
}

/* ==========================================================================
   Site Wide
   ========================================================================== */

#msg-payload pre {
    background-color: white;
    border: 0 none black;
}

div:focus {
    outline: 0;
}

.errorlist {
    list-style-type: none;
    padding-left: 0;
}

.errorlist li {
    background: #FF8080 url(../img/admin/icon_alert.gif) no-repeat scroll 5px 0.3em;
    border: 1px solid #FF8080;
}

#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: white;
}

#footer p {
    margin: 10px 0 17px;
}

#footer.scrolling {
    position: static;
    clear: both;
}

/* Progressive Enhancement Styling
   ========================================================================== */
.js-show {
    display: none;
}

.js-off {
    display: none;
}

.js-on {
    display: block;
}

.not_paginated {
    display: none;
}

/* ==========================================================================
   Header
   ========================================================================== */
.navbar-dev {
    background-color: #904141;
    background-image: none;
}

.navbar-brand > img {
    display: inline;
    margin-top: -5px;
    padding-right: 1em;
}

#nav-inner {
    display: table;
    margin: 0 auto;
}

#navigation {
    display: inline-block;
    list-style-type: none;
    margin: 10px auto;
    padding: 0;
}

#navigation li {
    border-right: 1px solid #5b80b2;;
    display: inline;
    padding: 0 10px 0 10px;
}

#navigation li:last-child {
    border-right: none;
}

.pipe {
    border-right: 1px solid #DDD;
    margin-right: 0.5em;
    padding-right: 0.8em;
}

.nav-menu {
    color: white;
    display: inline-block;
    margin-right: 15px;
}

.nav-menu > a:link, .nav-menu > a:visited {
    color: white;
}

#login {
    margin: 12px 5px;
}

#login a:hover {
    text-decoration: underline;
}

a.toggle:active, a.toggle:focus {
    color: #337ab7;
    text-decoration: none;
}

a.toggle:hover {
    color: #23527c;
    text-decoration: underline;
}

@media (max-width: 767px) {
    .login-user {
        display: none;
    }
}

/* ==========================================================================
   Login Page
   ========================================================================== */
.corral {
    margin: 0 auto;
    width: 460px;
}

#login-container {
    position: relative;
    margin: 130px auto 0;
    padding: 30px 10% 50px;
}

#login-button {
    width: 100%;
}

@media (max-width: 767px) {
    .corral {
        width: 100%;
    }

    #login-container {
        margin-top: 30px;
        padding: 0 10% 30px;
        width: 100%
    }
}

/* ==========================================================================
   Main Page
   ========================================================================== */
#search-wrapper {
    margin: 0 auto;
    width: 680px;
}

#search-container {
    position: relative;
    margin: 130px auto 0;
    padding: 30px 10% 10px;
}

@media (max-width: 767px) {
    #header-text {
        display: none;
    }

    #search-wrapper {
        width: 100%;
    }

    #search-container {
        margin-top: 30px;
        padding: 0 10% 10px;
        width: 100%
    }
}

/* ==========================================================================
   Browse
   ========================================================================== */
#browse-top {
    margin-top: 30px;
}

.browse_section {
    margin: 0 auto;
    clear: both;
}

#browse-page h3 {
    padding: 4px 15px;
    text-align: center;
    border-bottom: 1px solid #D6D6D6;
}

ul.browse_list {
    padding-left: 0;
}

ul.browse_list li {
    list-style-type: none;
    white-space: nowrap;
}

#id_browse_form .selectize-input {
    width: 300px;
}

.browse_section:last-child {
    overflow: auto;
    padding-bottom: 30px;
}

/* ==========================================================================
   Static Index
   ========================================================================== */

#static-page {
    line-height: 1.2;
}

.static-index li {
    list-style: none outside none;
}

.static-index li .name-col {
    margin-left: 1em;
}

.static-index strong {
    margin: 4px 0 4px -10px;
}

/* ==========================================================================
   Advanced Search
   ========================================================================== */

#adv-search-container {
    margin-top: 30px;
}

.date-field {
    margin-left: 15px;
}

.advanced #id_q {
    width: 100%;
}

.term-set {
    margin-bottom: 10px;
}

.chunk {
    margin-bottom: 10px;
}

.btn-remove {
    display: none;
}

.removable .btn-remove {
    display: inline-block;
}

@media (min-width: 768px) {
    #rules-form .operand {
        width: 325px;
    }
}

/* ==========================================================================
   Admin
   ========================================================================== */
#admin-page h3 {
    background-image: linear-gradient(to bottom, #5392b1 0%, #417690 100%);
    background-repeat: repeat-x;
    color: white;
    text-align: center;
}

#admin-top {
    margin-top: 30px;
}

#admin-top .form-control {
    width: 100%;
}

#id_admin_form .row {
    margin-bottom: 15px;
}

#id_admin_form .subrow .subrow-left {
    padding-left: 0;
}

#id_admin_form .subrow .subrow-right {
    padding-right: 0;
}

#result-list .row {
    margin-bottom: 15px;
}

.nav-tabs > li, .nav-pills > li {
    float:none;
    display:inline-block;
}

.nav-tabs, .nav-pills {
    text-align:center;
}

#admin-view-pane {
    height: 132px;
    overflow-y: scroll;
    padding: 0 20px;
}

.result-list .row {
    margin: 0;
}

#admin-page .result-table {
    table-layout: fixed;
}

#admin-page th.col1, #admin-page th.col2 {
    width: 5%;
}

#admin-page th.col5 {
    width: 10%;
}

#admin-page .tab-content {
    height: calc(100vh - 345px);
    overflow: auto;
}

#admin-page .tab-content.spam-mode {
    height: calc(100vh - 435px);
}

.spinner {
    margin: 0 20px;
}

/* ==========================================================================
   Help
   ========================================================================== */
#help_page {
    margin-left: 10%;
    margin-right: 10%;
    overflow: auto;
}

/* ==========================================================================
   Export
   ========================================================================== */
ul.export-buttons li {
    list-style-type: none;
    display: inline;
}

.export-spinner {
    display: none;
    text-align: center;
}

/* ==========================================================================
   Search
   ========================================================================== */
#sidebar {
    color: #808080;
    float: left;
    height: calc(100vh - 44px);
    padding-left: 20px;
    padding-top: 10px;
    position: relative;
    width: 250px;
}

#sidebar ul {
    padding-left: 0;
    margin-bottom: 18px;
}

a.selected {
    color: #23527c;
    text-decoration: underline;
}

i.toggle-pane {
    color: lightgrey;
}

#search-filters h4 {
    margin-top: 25px;
}

.filter-options li {
    list-style: none outside none;
}

.filter-options li input {
    margin-left: 0;
    margin-right: 4px;
}

.filter-options li .full {
    display: none;
}

.filter-popup {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #D6D6D6;
    box-shadow: 0 2px 4px #D6D6D6;
    color: #333333;
    /* display: none; */
    line-height: 17px;
    padding-bottom: 5px;
    padding-top: 5px;
    position: absolute;
    left: 60px;
    top: 130px;
    z-index: 1002;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 450px;
    width: 400px;
}

.filter-popup:focus {
    outline: 0;
}

.filter-popup ul li {
    line-height: 17px;
    padding: 3px 10px 3px 10px;
}

.filter-popup ul li.control {
    display: none;
}

.filter-popup li .truncated {
    display: none;
}

.filter-popup li .full {
    display: inline;
}

nav.navbar {
    margin: 10px 0;
}

.navbar-form #id_q {
    width: calc(100vw - 760px);
}

.navbar-collapse.in .navbar-form #id_q {
    width: 100%;
}

input[type="search"]::-webkit-search-cancel-button {
  /*Bootstrap 3 override*/
  -webkit-appearance: searchfield-cancel-button;
}

#msg-components {
    float: left;
    width: calc(100% - 250px);
    padding: 0 20px;
    position: relative;
}

#msg-components.x-full-width {
    width: 100%;
}

#toolbar-left {
    float: left;
}

#toolbar-left .container-fluid {
    padding-left: 0;
    padding-right: 0;
}

#toolbar .collapse, #toolbar .container-fluid {
    /* padding-right: 0; */
}

#toolbar .dropdown-menu {
    z-index: 1002;
}

#msg-panes {
    position: relative;
    height: calc(100vh - 124px);
}

#msg-panes .navbar {
    margin-top: 8px;
    margin-bottom: 8px;
}

.msg-list {
    border-top: 1px solid #D6D6D6;
    cursor: pointer;
    height: calc(100% - 73px);
    overflow: auto;
    position: relative;
}

#msg-list-controls {
    border-top: 1px solid #D6D6D6;
    padding: 8px 1em 8px 1em;
}

.page-nav {
    margin: 0;
    text-align: center;
    vertical-align: middle;
}

table.msg-table > thead > tr > th {
    padding: 0 0 0 8px;
}

table.msg-table th:hover {
    background-color: rgb(238,238,238);
}

table.msg-table th a {
    color: black;
    padding: 8px 8px 8px 0;
    display:inline-block;
    width:100%;
}

table.msg-table th a:hover {
    text-decoration: none;
}

table.msg-list-header-table th a.btn {
    border: 0;
}

.fa-sort, .fa-sort-asc, .fa-sort-desc {
    float: right;
    vertical-align: middle;
    padding-top: 3px;
}

.fa-sort {
    color: lightgrey;
}

.fa-sort-asc, .fa-sort-desc {
    color: black
}

.fa-arrow-right {
    float: right;
    vertical-align: middle;
    padding-top: 3px;
}

#list-pane {
    border: 1px solid #D6D6D6;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.row-selected {
    background-color: #DDECFE;
}

.date-col {
    white-space: nowrap;
}

.list-col {
    min-width: 60px;
}

.xtable.thread-sorted .xtd.depth-1, li.depth-1 {
    padding-left: 2em;
}

.xtable.thread-sorted .xtd.depth-2, li.depth-2 {
    padding-left: 3em;
}

.xtable.thread-sorted .xtd.depth-3, li.depth-3 {
    padding-left: 4em;
}

.xtable.thread-sorted .xtd.depth-4, li.depth-4 {
    padding-left: 5em;
}

.xtable.thread-sorted .xtd.depth-5, li.depth-5 {
    padding-left: 6em;
}

.xtable.thread-sorted .xtd.depth-6, li.depth-6 {
    padding-left: 7em;
}

.xtd a i {
    width: 15px;
}

#msg-list.no-preview .subj-col span {
    display: none;
}

#msg-list.no-preview .subj-col a {
    display: table-cell;
}

#msg-list.no-preview .subj-col a:visited {
    color: #551A8B;
}

#msg-list.no-preview .xtd {
    padding-bottom: 2px;
    padding-top: 2px;
}

#msg-list .subj-col a {
    display: none;
}

#splitter-pane {
    background-position: 50%;
    background-repeat: no-repeat;
    background-image: url("../images/horizontal-grip.png");
    background-color: #f6f6f6;
    border-left: 1px solid #D6D6D6;
    border-right: 1px solid #D6D6D6;
    position: absolute;
    left: 0;
    right: 0;
    top: 100px;
    cursor: row-resize;
    height: 8px;
}

#view-pane {
    border: 1px solid #D6D6D6;
    bottom: 0;
    left: 0;
    overflow-y: scroll;
    padding: 1em;
    position: absolute;
    right: 0;
    top: 205px;
}

#msg-header {
    display: none;
}

.msg-header {
    color: #808080;
    margin: 0 0 20px;
}

.wordwrap {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: normal;
    word-break: normal;
}

#msg-body a.copy-link {
    position:  absolute;
    top: 8px;
    right: 12px;
    padding: 5px;
    z-index: 10;
    background-color:  white;
    color: #808080;
}

#msg-body h3 {
    font-size: 18px;
    font-weight: normal;
    margin: 2px 0;
}

#msg-body pre {
    padding: 0;
}

#msg-link {
    /* background: #FFF4C8; */
    background: #FFF;
    /* border-left: 1px solid #CCC; */
    border-top: 1px solid #CCC;
    bottom: 0;
    padding: 2px 5px;
    position: fixed;
    right: 20px;
    z-index: 2;
}

#msg-list-controls {
    overflow: hidden;
}

#message-count {
    float: left;
}

.progress {background: rgba(245, 245, 245, 1); border: 0px solid rgba(245, 245, 245, 1); border-radius: 4px; height: 15px;}
.progress-bar-custom {background: rgba(51, 122, 183, 1);} 
.progress-striped .progress-bar-custom {background-color: rgba(51, 122, 183, 1); background-image: -webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255, 255, 255, 0.15),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255, 255, 255, 0.15)),color-stop(0.75,rgba(255, 255, 255, 0.15)),color-stop(0.75,transparent),to(transparent))); background-image: -webkit-linear-gradient(45deg,rgba(255, 255, 255, 0.15) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, 0.15) 50%,rgba(255, 255, 255, 0.15) 75%,transparent 75%,transparent); background-image: linear-gradient(45deg,rgba(255, 255, 255, 0.15) 25%,transparent 25%,transparent 50%,rgba(255, 255, 255, 0.15) 50%,rgba(255, 255, 255, 0.15) 75%,transparent 75%,transparent); background-size: 40px 40px;}

.progress {
    display: none;
    width: calc(100% - 350px);
    float: left;
    margin-left: 80px;
    margin-top: 2px;
}

#toggle-preview {
    float: right;
}


/* Responsive Styling
   ========================================================================== */
@media (min-width: 768px)
{
    .page-nav {
        float: right;
    }

    .page-nav a {
        padding: 0 8px;
    }

    #toolbar {
        height: 42px;
        margin-left: 46px;
    }
}


@media (max-width: 767px)
{
    #sidebar, #splitter-pane, #view-pane, #message-count, #toggle-preview, #toolbar-left {
        display: none;
    }
    
    #msg-components {
        padding: 0 10px;
        width: 100%;
    }
    
    #msg-panes, .msg-list {
        height: 100%;
    }
    
    #list-pane {
        height: 100%;
        bottom: 0;
        border: 0;
        position: static;
    }
    
    #msg-list-controls {
        border-top: 0;
        margin: 20px 0;
        overflow: auto;
    }
}

/* Result Table Responsive Styling
   ========================================================================== */
.date-col, .list-col {
    display: inline;
}

.list-col {
    float: right;
}

.xtr {
    border: 1px solid #D6D6D6;
    margin: 8px 4px;
    padding: 4px 8px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}

.header {
    width: 23.5%;
    display: inline-block;
}

.header a {
    color: black;
    padding: 8px;
    display: inline-block;
    width: 100%;
}

@media (min-width: 768px)
{
    .xtable {
        display: table;
    }
    
    .xthead {
        display: table-header-group;
    }
    
    .xtd {
        border-bottom: 1px solid #dddddd;
        display: table-cell;
        padding: 6px 8px;
        line-height: 1.42857143;
        vertical-align: top;
    }
    
    /*
    .xtd a {
        display: block;
    }
    */
    
    .xtbody {
        display: table-row-group;
    }
    
    .xtr {
        border: 0;
        margin: 0;
        padding: 0;
        box-shadow: none;
        display: table-row;
    }
    
    .xtable.thread-sorted .xtr.thread-border .xtd {
        border-top: 1px solid #dddddd;
    }

    #msg-list.no-preview .xtable:not(.thread-sorted) .xtr.date-border .xtd{
        border-top: 1px solid #585858;
    }

    .list-col {
        float: none;
    }
    
    .subj-col, .from-col, .date-col {
        border-right: 1px solid #f6f6f6;
    }
    
    .header a, .header span {
        color: black;
        padding: 8px;
        display: inline-block;
        width: 100%;
    }
    
    .header {
        padding: 0;
        border-top: 0;
        font-weight: bold;
    }

    .header.sortable:hover {
        background-color: rgb(238,238,238);
    }

    .header a:hover {
        text-decoration: none;
    }
}

/* ==========================================================================
   Message Detail
   ========================================================================== */
ul.navbar-nav a.disabled, ul.navbar-nav a.disabled:hover {
    color: #d6d6d6;
}

#msg-detail {
    padding-top: 15px;
}

#msg-aside ul {
    margin: 15px 0 0 0;
    padding: 0;
    list-style-type: none;
    text-align: center;
}

#msg-aside ul li {
    display: inline;
    margin: 0 12px;
}

#msg-nav {
    margin-bottom: 60px;
}

#msg-nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: center;
}

#msg-nav ul li {
    display: inline;
    margin: 0 12px;
}

.attachment-list {
    margin: 2em 0;
    padding-left: 0;
}

.attachment-list li {
    list-style: none;
}

.btn-toolbar.msg-detail-toolbar {
    display: none;
}

.msg-detail-toolbar .btn-group {
    width: 100%;
    margin-bottom: 10px;
}

.msg-detail-toolbar .btn-group a {
    width: 33%;
}

.thread-snippet {
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
    font-size: 13px;
    list-style-type: none;
    margin-top: 30px;
    padding-left: 0;
}

.current-msg {
    background: #f4f5f5
}

@media (min-width: 768px)
{
    #msg-aside ul {
        text-align: left;
    }
    
    #msg-aside ul li {
        margin: 1em 0;
        display: block;
    }
}

@media (max-width: 767px) {
    .navbar-msg-detail {
        display: none;
    }

    .btn-toolbar.msg-detail-toolbar {
        display: block;
    }
}
/* ==========================================================================
   Admin Guide
   ========================================================================== */
/* fix for fragment identifier and fixed header */
#admin_page h2:before { 
  display: block; 
  content: " "; 
  margin-top: -44px; 
  height: 44px; 
  visibility: hidden; 
}

#topics {
    margin-top: 20px;
}

/* ==========================================================================
   Admin Console
   ========================================================================== */

#admin_page {
    background: #f6f6f6;
}

#console-container {
    margin-top: 10px;
}
/* ==========================================================================
   Test
   ========================================================================== */
#view-pane {
    /* background-color: #F0FFFF; */
}