@font-face{
    font-family: 'Exo 2';
    font-weight: normal;
    src: url('font-exo2/Exo2.0-Light-webfont.eot');
    src: url('font-exo2/Exo2.0-Light-webfont.eot?iefix') format('eot'),
         url('font-exo2/Exo2.0-Light-webfont.woff') format('woff'),
         url('font-exo2/Exo2.0-Light-webfont.ttf') format('truetype'),
         url('font-exo2/Exo2.0-Light-webfont.svg#webfont') format('svg');
}

@font-face{
    font-family: 'Exo 2';
    font-weight: bold;
    src: url('font-exo2/Exo2.0-Bold-webfont.eot');
    src: url('font-exo2/Exo2.0-Bold-webfont.eot?iefix') format('eot'),
         url('font-exo2/Exo2.0-Bold-webfont.woff') format('woff'),
         url('font-exo2/Exo2.0-Bold-webfont.ttf') format('truetype'),
         url('font-exo2/Exo2.0-Bold-webfont.svg#webfont') format('svg');
}


body {
    font-family: "Exo 2", "Arial", sans-serif;
    font-weight: normal;
    font-size: 14px;
}


.header-links a {
    font-weight: bold;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Exo 2", "Arial", sans-serif !important;
    font-weight: bold;
}

.row-cols-same-height {
    display:  -webkit-box;
    display: -webkit-flex;
    display:  -ms-flexbox;
    display:         flex;
    flex-wrap: -webkit-wrap;
    flex-wrap:         wrap;
}

.table thead > tr > th,
.table thead > tr > td,
.table tfoot > tr > th,
.table tfoot > tr > td {
    padding-top: 0;
    padding-bottom: 0;
}

.table thead > tr > th {
    font-size: inherit;
}

.help-block {
    margin-top: 0;
}

.submit-row > * {
    padding: 0.5em;
}

.btn-wide {
    min-width: 12em;
}

.text-left { /* in Bootstrap this class is defined after .btn, and .btn always takes precedence => have to redefine it here */
    text-align: left;
}

.text-small {
    font-size: 80%;
}

.view-label {
    font-size: 80%;
    font-weight: normal;
    color: #999;
    display: block;
}

pre.light {
    background: #EEE;
}

a.link-large {
    display: block;
    text-decoration: none !important;
}

a.link-large:hover {
    text-decoration: none !important;
    position: relative;
    top: -1px;
}

a.link-large:active {
    position: relative;
    top: 0px;
}

.margin-top {
    margin-top: 1em;
}

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

.margin-bottom-small {
    margin-bottom: 0.2em;
}

.margin-right {
    margin-right: 1em;
}

.margin-left {
    margin-left: 1em;
}

/* Forms */

ul.errorlist {
    background-color: #de815c;
    color: #fff;
    display: block;
    border: none;
    border-radius: 3px;
    line-height: 20px;
    padding: 15px 3em;
    margin-bottom: 20px;
}


/* Blocks */

/* Improve block titles for longer titles */
.block-title {
    position: relative;
}

.block-options.block-options-fixed-right {
    position: absolute;
    right: 0;
    top: 0;
    float: none;
}

.block-title h1, .block-title h2, .block-title h3, .block-title h4, .block-title h5, .block-title h6 {
    word-break: keep-all;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Sidebar menu */

/* only second-level menu items */
ul.sidebar-nav > li > ul > li > a {
    word-break: keep-all;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: relative;
}

.sidebar-nav a span.sidebar-nav-mini-hide {
}

.modal-header {
    padding: 2px 15px 5px;
}

.modal-header .close {
    margin-top: 10px;
}


/* Specific feature styles */

.force-one-line {
    word-break: keep-all;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.sidebar-title img {
    margin-right: 0.5em;
}

.widget-content-slim {
    padding: 5px 15px;
}

.dropdown-menu > li > div.dropdown-menu-item {
    padding: 8px 10px;
}

/* Extensions */

.alert.alert-compact {
    padding: 5px;
}

.themed-color-on-themed-color {
    color: white;
}

.fa.fa-large {
    font-size: 200%;
    vertical-align: middle;
}

/* Base admin page */
.content-header .header-section {
    text-overflow: ellipsis;
    overflow: hidden;
    /*word-break: keep-all;*/
    white-space: nowrap;
}

.content-header .header-tools {
    padding-top: 1em;
}

/* Changelist *//*.ascending  */
.table-changelist th.sorted {
    background-color: #F9F9F9;
}

.table-changelist th.sortable {
    background-image: url('img/jquery.datatables/sort_both.png');
    background-position: center right;
    background-repeat: no-repeat;
    position: relative;
}

.table-changelist th.sortable .text {
    padding-right: 1em;
}

.table-changelist th.sorted .text  {
    padding-right: 1.3em;
}

.table-changelist th.sorted.ascending {
    background-image: url('img/jquery.datatables/sort_asc.png');
    background-position: center right;
    background-repeat: no-repeat;
}

.table-changelist th.sorted.descending {
    background-image: url('img/jquery.datatables/sort_desc.png');
    background-position: center right;
    background-repeat: no-repeat;
}

.table-changelist thead th a,
.table-changelist thead th span {
    color: black;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    display: block;
}

thead th.sortable a.sortremove {
    visibility: hidden;
}

table thead th.sorted:hover a.sortremove {
    visibility: visible;
}

table thead th.sortable a.sortremove {
    position: absolute;
    right: 13px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    display: inline-block;
    background: url(img/sorting-icons.svg) 0 0 no-repeat;
    background-position: 0 0;
    background-size: 14px auto;
}

table thead th.sorted a.sortremove:after {
    content: '\\';
    position: absolute;
    top: -5px;
    left: 2px;
    font-weight: 200;
    font-size: 18px;
    color: #999;
}

table thead th.sorted a.sortremove:focus:after,
table thead th.sorted a.sortremove:hover:after {
    color: #447e9b;
}

table thead th.sorted a.sortremove:focus,
table thead th.sorted a.sortremove:hover {
    background-position: 0 -14px;
}

.pagination>li>span.page-inactive:hover, .pagination>li>span.page-inactive:focus {
    color: inherit;
    background-color: inherit;
    border-color: inherit;
}

.changelist-top {
    padding: 0.4em;
}


.changelist-filters-and-search {
}

.changelist-search {
}

.changelist-filters {
    /* HACK: this allows datepickers to be displayed on top of popups,
             even though the datepicker's parent is the body,
             and the popups are displayed in the in the filter form to allow submitting the form
        See for more details: http://philipwalton.com/articles/what-no-one-told-you-about-z-index/#stacking-contexts
     */
    opacity: 0.99;
}

.changelist-filters-and-search-apply-reset {
}

.filters-modal h3, .filters-modal h4, .filters-modal h5, .filters-modal h6 {
    margin-left: 0;
    margin-bottom: 0;
    padding-left: 0;
    padding-bottom: 0;
}

.filter-popup-container {
    max-height: 20em;
    overflow-y: scroll;
}

.filter-popup-container .filter-item {
    display: block;
    line-height: 2;
    margin-bottom: 5px;
    border: 1px solid #eee;
    padding: 0 10px;
    text-overflow: ellipsis;
    word-break: keep-all;
    white-space: nowrap;
    overflow: hidden;
}


.filter-info {
    margin-left: 1em;
}

.filter-info a {
    color: white !important;
}

.filter-popup-container .filter-item {

}

.popover .control-label {
    padding-top: 0.5em;
}

/* Changeform styles */

.empty-form {
    display: none;
}

.form-control-readonly {
    padding-top: 6px;
    padding-bottom: 6px;
}

/* Fix for password fields wrapping on a second line */
.form-control {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

input[type=file] {
  height: auto;
  min-height: 34px;
}

fieldset.collapse {
    display: block; !important;  /* must override bootstrap's style because Django admin uses this */
}

fieldset.collapse legend {
    cursor: pointer;
}

fieldset.collapse legend:after {
    content: " ..."
}

fieldset.collapse div.fieldset-content {
    display: none;
}

/* Plugin styles */
.chosen-container {
    font-family: "Arial", sans-serif;
}


/* Printing ------------------------------------------- */


@media print {
    /* Disable displaying of link hrefs in print */
    a:after { content:''; }
    a[href]:after { content: none !important; }

    .row.print-normal {
        overflow-y: hidden;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .print-full-width { width: 100% !important; }

    .print-normal {
        float: none !important;
        width: auto !important;
    }

    .tab-pane.print-show {
        display: block !important;
    }

    /* Force the SMALL Bootstrap layout when printing - https://gist.github.com/donnierayjones/6fd9802d992b2d8d6cfd */
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6,
    .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; }

    .col-pr-12 { width: 100% !important; }
    .col-pr-11 { width: 91.66666667% !important; }
    .col-pr-10 { width: 83.33333333% !important; }
    .col-pr-9  { width: 75% !important; }
    .col-pr-8  { width: 66.66666667% !important; }
    .col-pr-7  { width: 58.33333333% !important; }
    .col-pr-6  { width: 50% !important; }
    .col-pr-5  { width: 41.66666667% !important; }
    .col-pr-4  { width: 33.33333333% !important; }
    .col-pr-3  { width: 25% !important; }
    .col-pr-2  { width: 16.66666667% !important; }
    .col-pr-1  { width: 8.33333333% !important; }

    .col-sm-12 { width: 100%; }
    .col-sm-11 { width: 91.66666667%; }
    .col-sm-10 { width: 83.33333333%; }
    .col-sm-9  { width: 75%; }
    .col-sm-8  { width: 66.66666667%; }
    .col-sm-7  { width: 58.33333333%; }
    .col-sm-6  { width: 50%; }
    .col-sm-5  { width: 41.66666667%; }
    .col-sm-4  { width: 33.33333333%; }
    .col-sm-3  { width: 25%; }
    .col-sm-2  { width: 16.66666667%; }
    .col-sm-1  { width: 8.33333333%; }
    .col-sm-pull-12 { right: 100%; }
    .col-sm-pull-11 { right: 91.66666667%; }
    .col-sm-pull-10 { right: 83.33333333%; }
    .col-sm-pull-9  { right: 75%; }
    .col-sm-pull-8  { right: 66.66666667%; }
    .col-sm-pull-7  { right: 58.33333333%; }
    .col-sm-pull-6  { right: 50%; }
    .col-sm-pull-5  { right: 41.66666667%; }
    .col-sm-pull-4  { right: 33.33333333%; }
    .col-sm-pull-3  { right: 25%; }
    .col-sm-pull-2  { right: 16.66666667%; }
    .col-sm-pull-1  { right: 8.33333333%; }
    .col-sm-pull-0  { right: auto; }
    .col-sm-push-12 { left: 100%; }
    .col-sm-push-11 { left: 91.66666667%; }
    .col-sm-push-10 { left: 83.33333333%; }
    .col-sm-push-9  { left: 75%; }
    .col-sm-push-8  { left: 66.66666667%; }
    .col-sm-push-7  { left: 58.33333333%; }
    .col-sm-push-6  { left: 50%; }
    .col-sm-push-5  { left: 41.66666667%; }
    .col-sm-push-4  { left: 33.33333333%; }
    .col-sm-push-3  { left: 25%; }
    .col-sm-push-2  { left: 16.66666667%; }
    .col-sm-push-1  { left: 8.33333333%; }
    .col-sm-push-0  { left: auto; }
    .col-sm-offset-12 { margin-left: 100%; }
    .col-sm-offset-11 { margin-left: 91.66666667%; }
    .col-sm-offset-10 { margin-left: 83.33333333%; }
    .col-sm-offset-9  { margin-left: 75%; }
    .col-sm-offset-8  { margin-left: 66.66666667%; }
    .col-sm-offset-7  { margin-left: 58.33333333%; }
    .col-sm-offset-6  { margin-left: 50%; }
    .col-sm-offset-5  { margin-left: 41.66666667%; }
    .col-sm-offset-4  { margin-left: 33.33333333%; }
    .col-sm-offset-3  { margin-left: 25%; }
    .col-sm-offset-2  { margin-left: 16.66666667%; }
    .col-sm-offset-1  { margin-left: 8.33333333%; }
    .col-sm-offset-0  { margin-left: 0%; }
    .visible-xs { display: none !important; }
    .hidden-xs  { display: block !important; }
    table.hidden-xs              { display: table; }
    tr.hidden-xs                 { display: table-row !important; }
    th.hidden-xs, td.hidden-xs   { display: table-cell !important; }
    .hidden-xs.hidden-print      { display: none !important; }
    .hidden-sm                   { display: none !important; }
    .visible-sm                  { display: block !important; }
    table.visible-sm             { display: table; }
    tr.visible-sm                { display: table-row !important; }
    th.visible-sm, td.visible-sm { display: table-cell !important; }


    /*
        Timeline
        --------
        The "normal" layout is defined in AppUI's CSS for media screen and size > 768px.
        To allow the same layout for printing, the CSS is copied here.
    */
    .timeline-list li {
        padding: 20px 0;
    }

    .timeline-list:after {
        position: absolute;
        display: block;
        width: 4px;
        top: 0;
        left: 134px;
        bottom: 0;
        content: "";
        background-color: #f9f9f9;
        z-index: 1;
    }

    .timeline-icon {
        left: 115px;
        right: auto;
    }

    .timeline-time {
        float: left;
        padding: 0;
        text-align: right;
        width: 100px;
        height: 40px;
        line-height: 40px;
        border-bottom: none;
        margin-bottom: 0;
        background-color: transparent;
    }

    .timeline-content {
        padding-left: 166px;
    }
}