html,
body {
    height: 100%;
}

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
}

.wrap > .container {
    padding: 0px 15px 20px; /* dsm 7 dec 16 : topbar  70px 15px 20px; */
}

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}
.icon-red {
    color: red;
    font-style: italic;
}
.icon_green {
    color: green;
    font-style: italic;
}
.icon-amber {
    color: #FFC200;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: "\e151";
}

a.desc:after {
    content: "\e152";
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.grid-view td {
    white-space: nowrap;
}

.grid-view .filters input,
.grid-view .filters select {
    min-width: 50px;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav > li > form {
    padding: 8px;
}

@media(max-width:768px) {
	.nav li > form {
	    padding: 3px;
	}
}

.nav > li > form > button:hover {
    text-decoration: none;
}


/* dsm 20 aug 16
*/
.navbar-inverse {
    background-color: #663300;
    border-color: #663300;
}
.navbar-inverse .navbar-brand {
    color: #fff;
}
.navbar-inverse .navbar-nav > li > a {
    color: #fff;
}
#banner{
    background-color: #00AA88;
    color:white;
}


/* dsm 7 dec 16 : topbar from kvs for top banner */
.top-links {
    background: #996600;
    /**border-bottom: 3px solid #663300;*/
    /**padding: 3px 0 6px;**/
    font-size: 11px;
    line-height: 24px;
}
.center-hold {
    max-width: 1235px;
    margin: 0 auto;
    padding: 0 5px;
    text-align: center;
}
.center-hold:after {
    content: "";
    display: block;
    clear: both;
}
.network {
    float: left;
    color: #ffffff;
    position: relative;
    z-index: 30;
}
.network strong {
    display: inline-block;
    font-weight: normal;
    margin-right: 16px;
}
.network ul {
    display: inline-block;
}
.network li {
    display: inline-block;
    vertical-align: top;
    padding: 0 17px 0 21px;
    /*background: url('../images/bullet.png') no-repeat 0 50%;*/
}
.network li:first-child {
    background: none;
    padding-left: 0;
}
.network a {
    color: #ffffff;
}
.network a:hover {
    color: #ffffff;
    text-decoration: underline;
}
.network .more {
    display: none;
}
/* dsm 7 dec 16 : EOtopbar from kvs for top banner */

/*
http://jsfiddle.net/DTcHh/541/
http://stackoverflow.com/questions/27209336/placing-banner-above-the-bootstrap-3-navbar

#topnavbar {
    margin: 0;
}
#topnavbar.affix {
    position: fixed;
    top: 0;
    width: 100%;
}

#banner {
    background-color: yellow;
}
*/

/*
#toggle-translate {
    display:inline;
    position:relative;
    padding: 0 0 0 0;
    border:none;
    color:red;
}
*/
.disabled > a {
    pointer-events: none;
    cursor: default;
}

.chewy {
    /*font-family: ChewyRegular, Georgia,'Times New Roman', Times, serif;*/
    font-family: ChewyRegular, Georgia,'Times New Roman', Times, serif;

    color: #996600;
}

/**
.fcontainer {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}
.fitem {
    flex:1;
    width:150px;
}
**/
.fcontainer {
    display: flex;
    width:100%;
}

.fitem {
    width: 150px;  /* Or whatever */
    height: 200px; /* Or whatever */
    margin: auto;  /* Magic! */
    background-color: red;
}

.gi-2x{font-size: 2em;}
.gi-3x{font-size: 3em;}
.gi-4x{font-size: 4em;}
.gi-5x{font-size: 5em;}
.brown {
    color: #663300;
}
.red {
    color: darkred;
}
.blue {
     color: darkblue;
}

.lobby a {
    background-color: #663300;
    color: white;
    cursor: pointer;
    padding: 5px;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:focus {
    background-color: #663300;  !important;/* dsm 28 nov 20 : vue header*/
    border-color: #663300;      !important;
}
.btn-hank {
    color: #ffffff;
    background-color: #663300;  !important;
    border-color: #572718;      !important;
}

.btn-hank:hover,
.btn-hank:focus,
.btn-hank:active,
.btn-hank.active,
.open .dropdown-toggle.btn-hank {
    color: #ffffff;
    background-color: #8B4513;  !important;
    border-color: #572718;      !important;
}


/*
https://stackoverflow.com/questions/28261287/how-to-change-btn-color-in-bootstrap
Leads to...
http://blog.koalite.com/bbg/
 */
.btn-hank.disabled,
.btn-hank[disabled],
fieldset[disabled] .btn-hank,
.btn-hank.disabled:hover,
.btn-hank[disabled]:hover,
fieldset[disabled] .btn-hank:hover,
.btn-hank.disabled:focus,
.btn-hank[disabled]:focus,
fieldset[disabled] .btn-hank:focus,
.btn-hank.disabled:active,
.btn-hank[disabled]:active,
fieldset[disabled] .btn-hank:active,
.btn-hank.disabled.active,
.btn-hank[disabled].active,
fieldset[disabled] .btn-hank.active {
    background-color: #663300;
    border-color: #572718;
}

.btn-hank .badge {
    color: #663300;
    background-color: #ffffff;
}


/* WRONG! Fucking nav bar, does not affect links??
ul.nav li a, ul.nav li a:visited {
    color: #663300 !important;
}

ul.nav li a:hover, ul.nav li a:active {
    color: #8B4513 !important;
}

ul.nav li.active a {
    color: #8B4513 !important;
}
**/
a.hank-link:link {
    color: #663300 !important;
}
/* visited link grey */
.hank-link a:visited {
    color: #663300 !important;
}
/* mouse over link blue */
.hank-link a:hover {
    color: #8B4513 !important;
}
/* selected link blue */
.hank-link a:active {
    color: #8B4513 !important;
}
/*** have to kill bootstrap navbar I think. I can never get this shit.
.navbar-fixed-top {
    top: 20px;
}
#network {
    top: 0;
    position: fixed;
    background-color: #fff;
    height: 40px;
    width: 100%;

}***/


.panel-hank > .panel-heading {
    background-color:  #996600;
    color:white;
}

.dotted { /* HKB coupon */
    border: 3px dashed #8B4513;
    padding: 5px;
}