﻿/* additional generic classes in the bootstrap style */
.debugBorder {border: solid 1px #000;}

.text-bold { font-weight: bold; }
.text-italic { font-style: italic; }

.text-small {font-size: 85%;}
.text-smaller { font-size: 70%; }
.text-smallest { font-size: 55%; }

.margin-none { margin: 0; }
.margin-extra-small { margin: 24px; }
.margin-small { margin: 32px; }
.margin-medium { margin: 48px; }
.margin-large { margin: 64px; }
.margin-extra-large { margin: 96px; }

.margin-bottom-none { margin-bottom: 0; }
.margin-bottom-extra-small { margin-bottom: 24px; }
.margin-bottom-small { margin-bottom: 32px; }
.margin-bottom-medium { margin-bottom: 48px; }
.margin-bottom-large { margin-bottom: 64px; }
.margin-bottom-extra-large { margin-bottom: 96px; }

.margin-top-none { margin-top: 0; }
.margin-top-extra-small { margin-top: 24px; }
.margin-top-small { margin-top: 32px; }
.margin-top-medium { margin-top: 48px; }
.margin-top-large { margin-top: 64px; }
.margin-top-extra-large { margin-top: 96px; }

.margin-left-none { margin-left: 0; }
.margin-left-extra-small { margin-left: 24px; }
.margin-left-small { margin-left: 32px; }
.margin-left-medium { margin-left: 48px; }
.margin-left-large { margin-left: 64px; }
.margin-left-extra-large { margin-left: 96px; }

.margin-right-none { margin-right: 0; }
.margin-right-extra-small { margin-right: 24px; }
.margin-right-small { margin-right: 32px; }
.margin-right-medium { margin-right: 48px; }
.margin-right-large { margin-right: 64px; }
.margin-right-extra-large { margin-right: 96px; }

.padding-none { padding: 0; }
.padding-extra-small { padding: 24px; }
.padding-small { padding: 32px; }
.padding-medium { padding: 48px; }
.padding-large { padding: 64px; }
.padding-extra-large { padding: 96px; }

.padding-bottom-none {padding-bottom: 0;}
.padding-bottom-extra-small { padding-bottom: 24px; }
.padding-bottom-small { padding-bottom: 32px; }
.padding-bottom-medium { padding-bottom: 48px; }
.padding-bottom-large { padding-bottom: 64px; }
.padding-bottom-extra-large { padding-bottom: 96px; }

.padding-top-none { padding-top: 0; }
.padding-top-extra-small { padding-top: 24px; }
.padding-top-small { padding-top: 32px; }
.padding-top-medium { padding-top: 48px; }
.padding-top-large { padding-top: 64px; }
.padding-top-extra-large { padding-top: 96px; }

.padding-left-none { padding-left: 0; }
.padding-left-extra-small { padding-left: 24px; }
.padding-left-small { padding-left: 32px; }
.padding-left-medium { padding-left: 48px; }
.padding-left-large { padding-left: 64px; }
.padding-left-extra-large { padding-left: 96px; }

.padding-right-none { padding-right: 0; }
.padding-right-extra-small { padding-right: 24px; }
.padding-right-small { padding-right: 32px; }
.padding-right-medium { padding-right: 48px; }
.padding-right-large { padding-right: 64px; }
.padding-right-extra-large { padding-right: 96px; }





.display-none { display: none; }

/* smaller pills */
.nav-sm > li > a { padding: 4px 8px; font-size: 13px; }

/* all HRs in modals should go full width */
.modal .modal-body hr { margin-left: -15px; margin-right: -15px; }

/* add pipe delimiter to some lists */
ul.list-delimited li { padding: 0; }
    ul.list-delimited li:before { color: #ccc; content: "|"; padding: 0 6px 0 2px; }
    ul.list-delimited li:first-child:before { content: ""; }

/* an even-more-condensed version of bootstrap's table-condensed */
.table-verycondensed > thead > tr > th,
.table-verycondensed > tbody > tr > th,
.table-verycondensed > tfoot > tr > th,
.table-verycondensed > thead > tr > td,
.table-verycondensed > tbody > tr > td,
.table-verycondensed > tfoot > tr > td { padding: 2px; }

@media (max-width: 768px) {
    .table-verycondensed { font-size: .8em; }
}

.table-noborder > thead > tr > th, .table > tbody > tr > th, .table-noborder > tfoot > tr > th, .table-noborder > thead > tr > td, .table-noborder > tbody > tr > td, .table > tfoot > tr > td { border-top: 0; }

/* separate divs with a sort-of horizontal rule */
.rule-separated > div { border-top: 1px solid #eee; margin-top: 15px; padding-top: 15px; }
    .rule-separated > div:first-child { border-top: 0; margin-top: initial; padding-top: initial; }

.rule-separated.rule-separated-large > div { margin-top: 30px; padding-top: 30px; }
    .rule-separated.rule-separated-large > div:first-child { border-top: 0; margin-top: initial; padding-top: initial; }

/* add extra vertical space to some lists */
ul.list-padded li { margin: 5px 0; }

/* allow form-inline to work in xs viewport */
@media (max-width: 767px) {
    .form-inline-xs .form-control { display: inline-block; width: auto; vertical-align: middle; }
}

@media (max-width: 767px) {
    .form-inline-xs .form-group { display: inline-block; vertical-align: middle; }
}

/* new row-table // my intention is to replace old tables with these */
.row-table .row { padding-bottom: 5px; padding-top: 5px; font-size: .95em; }
.row-table .row { padding-bottom: 5px; padding-top: 5px; font-size: .95em; }
.row-table .row-header { text-transform: uppercase; color: #00578e; font-weight: bold; }
    .row-table .row-header .sort { cursor: pointer; }
.row-table .row-subheader { margin-top: 8px; font-weight: bold; }

.row-table.row-table-small { font-size: .9em; }
.row-table .row.active { font-weight: bold; }

.row-table.row-table-striped .row:nth-child(2n-1) { background-color: #eee; }
.row-table.row-table-striped .row-header.row:nth-child(2n) { background-color: initial; }
.row-table.row-table-striped .row-subheader.row:nth-child(2n) { background-color: initial; }

.row-table.row-table-lined .row { border-bottom: 1px solid #ddd; }
    .row-table.row-table-lined .row:last-child { border-bottom: 0; }
.row-table.row-table-lined .row-header { border-bottom: 2px solid #ddd; }

.row-table .glyphicon { cursor: pointer; }

/* for dev, helps to see exactly where the row columns are */
.row-table.row-dev .row > div { background-color: pink; border-right: 1px solid #eee; border-left: 1px solid #eee; }
