@import url(bootstrap/bootstrap.min.css);
@import url(bootstrap/bootstrap-theme.min.css);

/*region BOOTSTRAP HTML OVERRIDE/FIXES */
html { height:100%; }
body { height:100%; }
body.homepage {
    background:     #000 url(../img/bg.jpg) no-repeat;
    background-size:cover;
}
fieldset legend { margin-bottom:0; }
fieldset > .content { padding-top:20px; }
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
p { margin-bottom:1.5em; }

.nkr-affix {
    position:static;
}
.nkr-affix.affixed {
    position:fixed;
}
.navbar-nav > li:hover > .dropdown-menu {
  display: block;
}
.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}
.homepage-card {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color:rgba(255,255,255,0.75);
    padding:2px 10px 2px 10px;
    margin:20px auto 0 auto;
    max-width:360px;
}
.homepage-card h4 { font-weight:bold;margin:3px 0 5px; }
.homepage-card ul { padding-left:15px; }
.homepage-card ul li {font-size:12px;}

.popover { max-width:420px; }
/*endregion*/

/*region DESIGN */
#xplantStats {
    position:absolute;top:190px;max-width:160px;z-index:1;right:0;padding-top:34px;font-size:14px;font-weight:bold;line-height:1.0em;background-color:rgba(255,255,255,0.7);
}
.label-full {
    font-size:100% !important;display:block;width:100%;
}
.label-flash-on.label-danger { background-color:#CC0000; }
.homepage .homepage-text-contrast {
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 1);
}
.title-font {
    font-family:serif;
}
.media-thumb-row {
    margin-top:20px;
}
.row-pad-4 .row {
    padding-top:4px;padding-bottom:4px;
}
.row-margined {
    padding-top:     10px;
    padding-bottom:  10px;
}
.row-margined-more {
    padding-top:     20px;
    padding-bottom:  20px;
}
.row-margined-less {
    padding-top:     4px;
    padding-bottom:  4px;
}
.row-underlined {
    border: solid #DDD;
    border-width:0 0 1px 0;
    padding-bottom:2px;
    margin-bottom:4px;
}
.vert-pad {
    padding-top:    10px;
    padding-bottom: 10px;
}
.bordered-btm {
    border: solid #DDD;
    border-width: 0 0 1px 0;
}
.homepage .footer-row { color:white; }
.footer-row {
    margin-top:40px;font-size:10px;
    }
    .homepage .footer-row a:link, .homepage .footer-row a:visited { color:white; }
    .homepage .footer-row a:hover, .homepage .footer-row a:active { color:#e2ff6e; }
.media-thumb {
    display:block;text-shadow: 1px 1px 0 rgba(0, 0, 0, 1);max-width:286px;margin:0 auto 20px;
    }
    .media-thumb > img { border:1px solid white; }
    .media-thumb > .media-label { color:white;font-size:16px;font-weight:bold;text-align:center; }
    .media-thumb > .media-title { color:white;font-size:14px;text-align:center; }
    a:link.media-thumb, a:visited.media-thumb, a:hover.media-thumb { text-decoration:none; }
    a:hover.media-thumb > img, a:active.media-thumb > img { border:1px solid red; }
.homepage-status-links {
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 1);
    }
    .homepage-status-links li { margin-bottom:9px;padding-left:20px;text-indent:-9px; }
    .homepage-status-links a:link, .homepage-status-links a:visited { color:white; }
    .homepage-status-links a:hover, .homepage-status-links a:active { color:#e2ff6e;text-decoration:none; }
.home-label {
    color:#ff502d;font-size:12px;
}

.navbar-nav > li > a {padding:15px 8px;font-size:11px;text-transform:uppercase; }
.navbar-nav > li > a:link, .navbar-nav > li > a:visited { color:white; }
.navbar-nav > li > a:hover, .navbar-nav > li > a:active { color:#ff502d !important; }

.text-xxlg { font-size:5.0em;line-height:1.0em; }
.text-xlg { font-size:3.0em;line-height:1.0em; }
.text-lg { font-size:2.0em;line-height:1.0em; }
.text-sm { font-size:0.8em;line-height:1.0em; }
.text-justified { text-align:justify; }

.hero-text { color:white;font-size:48px;margin-top:35px;font-weight:bold; }
.page_title {
    font-size:      36px;
    color:          #024965;
}
.page-heading {
    color:          #024965;
}

/**region --- SECTION HEADINGS */
.anchor-section {
    margin-top:     -60px;
    padding-top:    60px;
}
.section-heading {
    margin:         12px 0 16px 0;
    color:          #D68F0E;
    font-weight:    bold;
}
.subsection-heading {
    margin:         0 0 3px 0;
    color:          #024965;
}
.paragraph-heading {
    margin:         0 0 3px 0;
    color:          #024965;
}

.sub-question {margin-left: 20px;margin-bottom: 15px;padding-bottom: 10px;border: solid #CCC;border-width: 0 0 0 1px;}
/**endregion */

.heading {
    margin:         0 0 3px 0;
    font-size:      18px;
    color:          #D68F0E;
    font-weight:    bold;
}
.sub-heading {
    color:       #002C3E;
    font-size:   16px;
    font-weight: bold;
    margin:      0px 0px 3px 0px;
}
a.call-to-action {
    display:            block;
    color:              #000;
    font-size:          22px;
    border-radius:      5px;
    text-align:         center;
    line-height:        28px;
    padding:            22px;
    background:         #FF502D;
    margin:             10px auto;
    max-width:          100%;
}
a:link.call-to-action, a:visited.call-to-action { color:#000;text-decoration:none; }
a:hover.call-to-action, a:active.call-to-action {
    color:           #333;
    text-decoration: none;
    background:      #ff7343; /* Old browsers */
}
.btn-default.active {
    background-color:#9CF;
}
.btn-group label.btn-default {
    color:#AAA;
}
.btn-group label.btn-default.active {
    background-color: #2D6CA2;color:white;text-shadow:0 0 0 #FFF;
}
.highlight.highlight-success { background-color:#AEA; }
.highlight.highlight-warning { background-color:#F93; }
.highlight.highlight-danger { background-color:#EAA; }
.highlight.highlight-info { background-color: #9CF; }
.highlight.highlight-default { background-color:#FFF; }

.table-nkr th, .table-nkr td {
    white-space:nowrap;text-align:center;padding:3px 2px;
    }
    .table-nkr th.text-left, .table-nkr td.text-left, .table-nkr tr td:first-child, .table-nkr tr th:first-child {
        text-align: left;
    }
    .table-nkr th.text-right, .table-nkr td.text-right {
        text-align: right;
    }
.table-nkr-styled th, .table-nkr-styled td {
    white-space:nowrap;text-align:center;padding:3px 2px !important;
}
.table-nkr-styled th:first-child, .table-nkr-styled td:first-child {
    text-align:left;
}
.table-nkr-styled th:only-child, .table-nkr-styled td:only-child,
.table-nkr-styled th:first-child.text-center, .table-nkr-styled td:first-child.text-center {
    text-align:center;
}
.table-nkr-styled thead tr th { background-color:#DDD;border-color:#CCC; }
.table-nkr-styled thead tr:first-child th { background-color:#2D6CA2;color:#FFF; }
.table-nkr-styled thead tr:only-child th { background-color:#DDD;color:#000; }

.table-nkr-styled tfoot tr td { background-color: #83afdd;border-color: #c1c1dd; }

.table-angled-th { border:0; }
.table-angled-th > thead > tr:first-child > th {
    height: 200px;
    white-space: nowrap;
    width: 35px;
    background-color:#FFF;
    border:none;
    color:#000;
    }
    .table-angled-th > thead > tr > th:first-child {
        width:auto;
    }
    .table-angled-th > thead > tr > th > div {
        text-align: left !important;
        transform: translate(30px, -1px) rotate(315deg);
        width: 35px;
        padding-left: 5px
    }
    .table-angled-th > thead > tr > th > div > span {
        display: block;
        border-bottom: 1px solid #CCC;
        width: 200px;
    }

.table-striped-double-row tr:nth-child(4n-1), .table-striped-double-row tr:nth-child(4n) {
    background-color:#EEE;
}

.table-striped-double-row.table-first-column-highlight thead th:first-child {
    background-color: #CDF;
}
.table-striped-double-row.table-first-column-highlight tbody tr:nth-child(4n-2) td:first-child,
.table-striped-double-row.table-first-column-highlight tbody tr:nth-child(4n-3) td:first-child {
    background-color: #DEF;
}
.table-striped-double-row.table-first-column-highlight tbody tr:nth-child(4n-1) td:first-child,
.table-striped-double-row.table-first-column-highlight tbody tr:nth-child(4n) td:first-child {
    background-color: #CDF;
}


.table-first-column-highlight tbody tr:nth-child(even) td:first-child {
    background-color:#FFA;
}
.table-first-column-highlight tbody tr:nth-child(odd) td:first-child {
    background-color:#FAFACC;
}
.table-first-column-highlight tfoot > tr > td:first-child {
    background-color: #3689dd;color: white;
}
.table-last-column-highlight tbody tr:nth-child(even) td:last-child {
    background-color:#FFA;
}

.table-last-column-highlight tbody tr:nth-child(odd) td:last-child {
    background-color:#FAFACC;
}

.table-last-column-highlight tfoot > tr > td:last-child {
    background-color: #3689dd;color: white;
}
.table-absolute-sizing {
    table-layout:fixed;
}
.table-absolute-sizing > thead > tr > th, .table-absolute-sizing > tbody > tr > td {
    white-space:nowrap !important;
    overflow:hidden !important;
}
.table-spacer-cell {
    background:none transparent !important;border:0 !important;
}
.sort-bar {
    font-size:11px;border:solid #CCC;border-width:1px 0 0 0;padding:0 10px 0 10px;white-space:nowrap;
}
.padless { padding:0 0 0 0 !important; }
.wrappable { white-space:normal !important; }

.label-eval { min-width:30px;display:inline-block;padding:5px 3px;margin:2px; }
/*endregion*/

/*region SIMPLE BLOCK FORMATTING HELPERS*/
.shadowed {
    -moz-box-shadow:5px 5px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow:5px 5px 5px rgba(0,0,0,0.3);
    box-shadow:5px 5px 5px rgba(0,0,0,0.3);
}
/*endregion*/

/*region SIMPLE TEXT FORMATTING HELPERS */
.text-no-overflow { white-space: nowrap;overflow:hidden;text-overflow:ellipsis; }
[data-action=link] { cursor:pointer !important; }
.clickable { cursor:pointer !important; }
.clickable:hover { background-color:#DDD; }
.required-highlight { background-color: #fff17e; }
.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family: 'Glyphicons Halflings';  /* essential for enabling glyphicon */
    content: "\e114";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: black;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080";    /* adjust as needed, taken from bootstrap.css */
}

.form-group:before,
.form-group:after {
  clear: both;
  content: ' ';
  display: table;
}
/*endregion*/

/*region DESIGN AND PROGRESS/STATUS MODAL DEFINITIONS */
#progress-display {
    position:fixed;top:0;left:0;width:100%;height:100%;background-image:url(img/ajax-loader.gif);background-color: rgba(255, 255, 255, 0.8);background-repeat:no-repeat;background-position:center center;z-index:9996;display:none;
}
#status-notification {
    position:fixed;top:0;left:0;width:100%;height:100%;background-color: rgba(255, 255, 255, 0.8);z-index:9997;display:none;
    }
    #status-notification > .notification {
        position:fixed;top:20%;left:50%;width:290px;margin-left:-160px;border:1px solid #6f8976;border-radius: 5px;box-shadow:0 1px 5px 3px;;z-index:9998;
        padding:15px;text-align:center;
        font-weight:bold;font-size:1.1em;
        background-color: #D1EEDB;
    }
    #status-notification.error > .notification {
        border:1px solid #837676;background-color: #F2DEDE;
    }
    #status-notification > .notification > .close {
        position:absolute;top:0;right:5px;
    }

.status_container {
    margin:            20px 10px 20px 10px;
    padding:           3px 5px 3px 10px;
    border:            0px solid #CCCCCC;
    border-left-width: 1px;
}
.status_title {
    font-size:           16px;
    font-weight:         bold;
    color:               #024965;
    border:              0px solid #024965;
    border-bottom-width: 1px;
}
.status_message {
    font-size: 12px;
    color:     #024965;
}

#img-popover {
    position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000;background-color:rgba(0,0,0,0.9);display:none;padding:5%;
    }
    #img-popover #img-popover-img {
        display:block;width:100%;height:100%;
        background: no-repeat center center;
        -webkit-background-size: contain;
        -moz-background-size: contain;
        -o-background-size: contain;
        background-size: contain;
    }
/*endregion*/

.photo-zoom {
    position:relative;
    }
    .photo-zoom-notice { position:relative;top:-6px;font-size:8px;font-weight:bold;text-align:center; }

.row-xs-flex-center {
    display:flex;
    align-items:center;
}

.flex-valign-bottom {
    display:flex;
    align-items:flex-end;
}


.tab-title {
    font-size:18px;
    line-height:40px;
    font-weight:bold;
    margin:0 15px;
}
.xtabs {
    padding: 20px 0;
    background-color:transparent;
    }
    .xtabs > .content { background-color:white;border-left-width:1px; }
    .xtabs > .content fieldset { background-color:white; }
    .xtabs .main_tabs:before, .xtabs .main_tabs:after, .xtabs .sub_tabs:before, .xtabs .sub_tabs:after { clear:both;content:".";height:0;display:block;visibility: hidden;font-size:0;}
    .xtabs .main_tabs {
        position:relative;width:100%;
        border : 0 solid #CCC;
        background-color:transparent;
    }
    .xtabs .main_tabs .xtab > span {
        padding:4px 8px;
        display:block;float:left;
        background-color:white;
        border: solid #CCC;border-width: 0;
        border-radius:5px 5px 0 0;
    }
    .xtabs .main_tabs .xtab:link > span, .xtabs .main_tabs .xtab:visited > span {
        color:#006;font-weight:bold;font-size:14px;background-color:#FFF; cursor: pointer;
    }
    .xtabs .main_tabs .xtab:hover > span, .xtabs .main_tabs .xtab:active > span {
        color:#600;font-weight:bold;font-size:14px;background-color:#DDD; cursor: pointer;
    }
    .xtabs .main_tabs a.on > span { background-color:#CCC !important;border-radius:5px 5px 0 0; }
    .xtabs .sub_tabs {
        position:relative;min-height:15px;
        background-color:#CCC;
        border: solid #CCC; border-width: 0px 1px 0px 1px;

    }
    .xtabs .sub_tabs.tertiary {background-color:#e4e4e4;border:solid #CCC;border-width:0 1px 0 1px;}
    .xtabs .sub_tabs .xtab > span {
        margin:6px 0 0 3px;
        padding:4px 8px;
        line-height:21px;
        display:block;float:left;
        background-color:#FFF;
        border:0 solid #CCC;
    }
    .xtabs .sub_tabs .xtab:link > span, .xtabs .sub_tabs .xtab:visited > span {
        color:#006;font-weight:bold;font-size:14px;background-color:#CCC; cursor: pointer;
    }
    .xtabs .sub_tabs.with-tertiary .xtab:link > span, .xtabs .sub_tabs.with-tertiary .xtab:visited > span {
        background-color:#CCC;
    }
    .xtabs .sub_tabs.tertiary .xtab:link > span, .xtabs .sub_tabs.tertiary .xtab:visited > span {
        background-color:#e4e4e4;
    }
    .xtabs .sub_tabs .xtab:hover > span, .xtabs .sub_tabs .xtab:active > span {
        color:#600;font-weight:bold;font-size:14px;background-color:#EEE;cursor:pointer;
    }
    .xtabs .sub_tabs.with-tertiary .xtab:hover > span, .xtabs .sub_tabs.with-tertiary .xtab:active > span {
        background-color:#e4e4e4;
    }
    .xtabs .sub_tabs.tertiary .xtab:hover > span, .xtabs .sub_tabs.tertiary .xtab:active > span {
        background-color:#FFF;
    }
    .xtabs .sub_tabs a.on > span { background-color:#FFF !important;border-radius:5px 5px 0 0; }
    .xtabs .sub_tabs.with-tertiary a.on > span { background-color: #e4e4e4 !important; }
    .xtabs > .content {
        border: 1px solid #CCC;border-top-width:0px;
        padding: 10px;
    }
    .xtabs > .content:after { clear:both;content:".";height:0;display:block;visibility: hidden;font-size:0; }

    .xtabs > .main_tabs.no-sub-tabs {border:solid #CCC; border-width:0 0 1px 0; }
    .xtabs > .main_tabs.no-sub-tabs a.on > span { background-color:#FFF !important; border:solid #CCC;border-width:1px 1px 0 1px;position:relative;top:1px;z-index:1; }

    .badge-info { background-color: #63a7ff !important; }
    .badge-success { background-color: #5cb85c !important; }
    .badge-warning { background-color: #ff993d !important; }
    .badge-danger { background-color: #d9534f !important; }

    .pre-select-row .first-row-display { visibility:hidden; }
    .pre-select-row.first-row .first-row-display { visibility:visible; }

@media ( max-width:768px ) {
    .xsonly-tmargin {margin-top:12px;}
    .xsonly-bmargin {margin-bottom:12px;}
    .xsonly-vmargin {margin-top:6px;margin-bottom:6px;}

    .hero-text { font-size:48px; }
    .hero-text-sub { font-size:16px; }
    .padtop-xs { margin-top:8px; }
    .side-video-iframe { margin:12px 0;width:100%;height:320px; }
    a.call-to-action { font-size: 20px; }
}
@media ( max-width:480px ) {
    .side-video-iframe { margin:12px 0;width:100%;height:160px; }
}
@media ( min-width:768px ) {
    .row-sm-flex-center {
        display:flex;
        align-items:center;
    }
    .hero-text { font-size:32px; }
    .hero-text-sub { font-size:20px; }
    #logo { width:200px; }
    .side-video-iframe { margin:12px 0;width:100%;height:200px; }
    a.call-to-action { font-size: 16px;line-height:24px;font-weight:bold;padding:16px; }
    .homepage-card h4 { font-size:14px; }
    #xplantStats { top:160px; }
}
@media ( min-width: 992px ) {
    .row-md-flex-center {
        display:flex;
        align-items:center;
    }
    .hero-text { font-size:48px; }
    .hero-text-sub { font-size:24px; }
    #logo { width:300px;margin-top:-5px; }
    .side-video-iframe { margin:12px 0;width:100%;height:320px; }
    a.call-to-action { font-size: 22px;line-height:28px;font-weight:bold;padding:22px; }
    .homepage-card h4 { font-size:18px; }
    #xplantStats { top:190px; }
}
@media ( min-width: 1200px ) {
    .row-lg-flex-center {
        display:flex;
        align-items:center;
    }
    #logo { width:300px;margin-top:-5px; }
}
@media (max-width:767px ) { /** mobile only **/
    .hero-text { color:white;font-size:24px;margin-top:10px; }
    #logo { width:180px; }
    .xs-text-center { text-align:center; }
    .xs-text-right { text-align:right; }
    .xs-text-left { text-align:left; }
    .xs-block-center { margin-left:auto !important;margin-right:auto !important; }
    .xs-only-form-box { margin:0 0 12px;background-color:#DDD;padding:12px;  }
}

table.follow-up > thead > tr > th,
table.follow-up > tbody > tr > td {
    padding: 5px 2px 5px 2px;
}

@media (max-width: 1199px) {
    .col-lg-4 + .col-lg-8 {
        margin-left: 20px;
    }

    .col-lg-3 + .col-lg-9 {
        margin-left: 20px;
    }

    .col-lg-6 + .col-lg-6 {
        margin-left: 20px;
    }
}

@media (max-width: 768px) {
    .button-column {
        text-align: center;
    }
}

div.edit-swap-issue .form-group {
    margin-bottom: 5px;
}

table.protection-grid {
    border: 1px solid white;
    /*background-color: #B4C6E7;*/
    /*background-color: lightsteelblue;*/
    margin-top: 40px;
    margin-bottom: 40px;
}

table.protection-grid > tbody > tr > td {
    border: 1px solid #ccc;
}

td.protection-grid-label {
    font-size: 13px;
    font-weight: bold;
    padding: 5px 0px 5px 3px !important;
}

td.protection-grid-cell {
    background-color: white;
    text-align: center;
    vertical-align: middle !important;
    font-size: 16px;
}

div.protection-grid-text {
    font-weight: normal;
    margin-left: 20px;
}

a.protection-grid-expand {
    color: #333;
    font-size: 13px;
    font-weight: bold;
}

a.protection-grid-expand > .glyphicon {
    font-size: 12px;
}

div.protection-grid-section {
    display: flex;
    align-items: center;
    height: 30px;
}

@media screen and (max-width: 767px) {
    table.protection-grid {
        font-size: 11px;
    }

    table.protection-grid > td {
        font-size: 11px;
    }

    td.protection-grid-label {
        font-size: 11px;
        font-weight: bold;
    }
}


/* OLD CSS */
li.button_cell {list-style:none;}
.button_cell a {
    display:            block;
    background-color:   #D5E8F0;
    border:             1px solid black;
    height:             100px;
    text-align:         center;
    font-weight:        bold;
    font-size:          11px;
    line-height:        14px;
    text-decoration:    none;
    padding:            5px;
    width:              100px;
    margin:             0 15px;
}

.button_cell a:link, .button_cell a:visited {
    background-color: #D5E8F0; color: black;
}

.button_cell a:hover, .button_cell a:active {
    background-color: #799DAB; color: black;
}
.block { display:block; }
.margin_centered { margin:0 auto; }

@media print {
    .xtabs > .content {
        border:0;padding:0;
    }
    .print-break {
        page-break-before:always;
    }
    .no-print { display:none !important; }
    .container { width:100% !important; }
    .btn { display:none; }
    .col-print-1 {width:8%;  float:left;}
    .col-print-2 {width:16%; float:left;}
    .col-print-3 {width:25%; float:left;}
    .col-print-4 {width:33%; float:left;}
    .col-print-5 {width:42%; float:left;}
    .col-print-6 {width:50%; float:left;}
    .col-print-7 {width:58%; float:left;}
    .col-print-8 {width:66%; float:left;}
    .col-print-9 {width:75%; float:left;}
    .col-print-10{width:83%; float:left;}
    .col-print-11{width:92%; float:left;}
    .col-print-12{width:100%; float:left;}
}

table.table-nkr > tbody > tr > td,
table.search > tbody > tr > td,
table.complete > tbody > tr > td,
table.ruled-out > tbody > tr > td,
table.pending-followup > tbody > tr > td,
table.pending-contact > tbody > tr > td,
table.pending-donor > tbody > tr > td {
    vertical-align: middle;
}

table.search > tbody > tr > td select,
table.complete > tbody > tr > td select,
table.ruled-out > tbody > tr > td select,
table.pending-followup > tbody > tr > td select,
table.pending-contact > tbody > tr > td select,
table.pending-donor > tbody > tr > td select {
    padding: 3px 6px;
    height: 30px;
}