html {
    display: flex;
    height: 100%;
    width: 100%;
}

body {
    flex:1;
    padding:0;
    margin:0;
}

.body-content {
    padding: 15px;
}

.bold{
    font-weight:bold;
}

.nowrap{
    white-space: nowrap;
}

.center{
    text-align: center;
}

.help-icon:before{
    font-family: 'Glyphicons Halflings';
    font-size: 25px;
    content:"\e085";
    color: #337ab7;
    cursor:pointer;
}

button.icon-button{
    background-color: transparent;
    border: none;
    font-family: 'Glyphicons Halflings';
    font-size: 25px;
    width:40px;
    cursor:pointer;
    color: #286090;
}

.icon-button.print::before{
    content:"\e045";
}

.icon-button.export::before{
    content:"\e025";
}

.icon-button.add::before{
    content:"\2b";
}

.icon-button.go-back::before{
    content:"\e091";
}

.icon-button.go::before{
    color:green;
    content:"\e072";
}

.icon-button.stop::before{
    color:red;
    content:"\e074";
}

select.invalid,
input.invalid{
    background-color:#FFB3A7;
}

label.required:before{
    content: '**';
    color:red;
    font-size:larger;
}

.error-text{
    color:red;
}

.jumbotron {
    padding: 30px;
    margin-bottom: 30px;
}

.jumbotron img{
    height:150px;
}

.jumbotron .btn-lg{
    margin-bottom: 5px;
    margin-right:10px;
    width:235px;
}

.page-instructions span.bold{
    font-weight: bold;
    font-size: larger;
}

.login-buttons img{
    width:185px;
}


#user-widget{
    color:white;
    position:absolute;
    right:5px;
    top:2px;
}
#user-widget a{
    color:white;
}

.header-text{
    color:black;
    padding: 56px 0 0 20px;
    font-size: 45px;
    font-weight: bold;
    text-align: center;
}

.site-header{
    min-width: 640px;
    height: 160px;
    padding:5px;
    background: #FFFDE4;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #005AA7, #FFFDE4);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to bottom, #005AA7, #FFFDE4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

#header-logo img{
    height:150px;
}

.float-left{
    float:left;
}

.float-right{
    float:right;
}

.float-clear{
    clear: both;;
}

#container {
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    clear:both;
}

#leftNav{
    width:230px;
    min-width:230px;
    padding-right:20px;
    padding-top: 50px;
    font-size: 20px;
}

#leftNav ul{
    list-style-type: none;
    margin: 0;
    padding-left: 10px;
}

#leftNav .imposter{
    margin-top:20px;
    font-weight: bold;
    font-size: 30pt;
    color:red;
}

#pageContent{
    flex-grow: 1;
    padding-right:20px;
    margin-right:20px;
    padding-bottom:50px;
}

#siteFooter{
    clear:both;
    position: fixed;
    left:0;
    bottom: 0;
    height:60px;
    background-color: grey;
    color:white;
    width:100%;
    text-align: center;
    overflow: hidden;
}

#siteFooter a{
    color:lightblue;
}

.flex-row-container{
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
}

.flex-row-container .flex-item{
    flex-grow: 1;
}

.pageInstructions{
    padding-bottom:15px;
}

.volunteerSummary{
    margin-top:30px;
}

.game-details{
    margin:20px;
    padding:20px;
}

.col-sm-10.submit-buttons{
    margin-left: 15.666666666666664%;
}

.location-details .panel-heading{
    font-weight: bold;
    text-align: center;
}

#tripForm .container-fluid,
#truckForm .container-fluid,
#locationForm .container-fluid,
#gameForm .container-fluid{
    padding:25px;
}

.nav-buttons,
#truckForm .navButtons,
#locationForm .navButtons,
#gameForm .navButtons{
    text-align: right;
    padding-bottom: 15px;
}

.submit-buttons input{
    margin-bottom:5px;
}

#volunteerTime .panel-heading a{
    text-decoration: none;
}

#volunteerTime h4.day{
    text-transform: capitalize;
}

#volunteerTime button{
    margin:3px;
}

#volunteerTime .panel-heading  h3:before {
    font-family: 'Glyphicons Halflings';
    content: "\e236";
    float: right;
    transition: all 0.5s;
 }

 #volunteerTime button.btn-success:before{
    content: "- Thanks!";
    margin-left:4px;
    float: right;
    transition: all 0.5s;
 }

 #volunteerTime button[disabled]:before{
    content: "(taken)";
    margin-left:4px;
    float: right;
    transition: all 0.5s;
 }

 #volunteerTime.closed button[disabled]:before{
  content: unset;
 }

/* Volunteer Time Admin Styles */
.timeslot-container,
.job-container{
  position: relative;
}

.job-container .delete-link,
.job-container .edit-link {
    cursor:pointer;
    font-family: 'Glyphicons Halflings';
    font-size: 16px;
    text-align: center;
    text-decoration: none;
    position: absolute;
    top: 0px;
    color:red;
 }

 .job-sort-order{
  position: absolute;
  right: 50px;
  color: black;
  font-size: large;
  font-weight: 800;
  z-index:100;
}

.slot-sort-order{
   position: absolute;
   top:-20px;
   left: 40px;
   color: black;
   font-size: large;
   font-weight: 800;
 }

.btn-volunteer:hover span.slot-sort-order{
  z-index: 100;
  font-size: 30pt;
  font-weight: 800;
}


 .job-container .delete-link{
    left: -9px;
    z-index: 200;
 }

 .job-container .edit-link{
  left: -29px;
  z-index: 200;
 }

 .timeslot-container .delete-link{
  font-family: 'Glyphicons Halflings';
  font-size: 16px;
  text-align: center;
  text-decoration: none;
  position: absolute;
  top: -20px;
  left: -4px;
  color:red;
  z-index: 200;
 }

 .job-container .delete-item:before {
    content: "\e020";
 }

 .job-container .edit-item:before {
  content:"\270f";
}

 .add-button,
 .add-location,
 .add-game{
    text-align: right;
    padding-top:15px;
 }

 #locationList div.panel-heading{
    cursor: pointer;
 }

 #volunteerGames .add-location a{
    text-decoration: none;
    width:40px;
 }
 #volunteerGames .add-location a:before{
    font-family: 'Glyphicons Halflings';
    font-size: 30px;
    content:"\2b";
 }

 #volunteerGames #donationIncentives{
    font-size:16px;
    font-weight: 400;
    text-decoration: none;
 }

 #volunteerGames .item-list{
    margin-bottom: 30px;
    max-height: 400px;
    overflow: auto;
 }

#showGameList tr[status="processed"] .item-actions .approve-item:before {
    content:"\e013";
    color:#6CC417;
}

#showGameList tr[hasNotes="true"] .item-actions .edit-item {
    color:red;
}

 .item-list .item-actions{
     font-family: 'Glyphicons Halflings';
     font-size: 16px;
     text-align: center;
     white-space: nowrap;
 }

 .item-list .item-actions a{
    text-decoration: none;
 }

.item-list .approve-item:before{
    content:"\e157";
}

.item-list .delete-item:before{
    content:"\e020";
}

.item-list .edit-item:before{
    content:"\270f";
}

.item-list .impersonate-user:before{
    content:"\e008";
}

.item-list .print-item:before{
    content:"\e045";
}

.item-list a.sortable{
    cursor: pointer;
}

.item-list a.sortable:hover{
    text-decoration: none;
}

.item-list a.sortable.asc:after{
    font-size: 12px;
    margin-left: 7px;
    font-family: 'Glyphicons Halflings';
    content:"\e155";
}

.item-list a.sortable.desc:after{
    font-size: 12px;;
    margin-left:7px;
    font-family: 'Glyphicons Halflings';
    content:"\e156";
}

#tripList {
    padding:0 45px 45px 45px;
}

#stopList{
    clear: both;
}

#stopsTable{
    margin-bottom:40px;
}

#locationList .item-actions{
    float:right;
    text-align:right;
}
#locationList .location-actions a{
    float:left;
}

#locationList a.map-toggle{
    clear: both;
    cursor: pointer;
}

#locationList .location-div .panel-heading  h3:before {
    font-family: 'Glyphicons Halflings';
    content: "\e236";
    float: right;
    transition: all 0.5s;
 }

 #transportLocations #locationsMap{
    height:600px;
 }

 #transportLocations #locationsList{
    padding-left:5px;
    flex: 0 0 320px;
    overflow: auto;
}

#locationsList .header{
    font-size: 20px;
    font-weight: bold;
}

#locationsList .hasStop{
    background-color:lightgreen;
}

#locationsList .location-list-item{
    border-top: solid black 1px;
    padding: 3px;
}

#locationsList .location-list-item:hover{
    -moz-box-shadow: 0px 0px 100px 4px skyblue inset;
	-webkit-box-shadow: 0px 0px 100px 4px skyblue inset;
	box-shadow: 0px 0px 100px 4px skyblue inset;
}

#locationsList .location-list-item .name{
    font-weight: bold;
}

#stopModal .stopCounts{
    text-align: center;
}

#stopModal .stopCounts span{
    padding:10px;
    display: inline-block;
    font-weight: bold;
}

#stopListModal #stopList{
    margin-top:10px;
    height:60px;
    overflow: auto;
}

#stopListModal #stopList li{
    display:block;
}

#stopListModal #stopList li:before{
    content: "\e007";
    font-family: 'Glyphicons Halflings';
    float: left;
    margin-top: 1px;
    margin-left: -24px;
    color: #CCCCCC;
}

#stopListModal #stopList li a{
    color:blue;
}

#showGamesTable .selected{
    background-color: lightblue;
}

#editShowGameModal textarea{
    resize:none;
}