html {
  position: relative;
  min-height: 100%;
}
body{
  padding-top: 62px;
  padding-bottom: 40px;
  background-color: #E9E4E4;
}

/* DATE PICKER STYLE */
#ui-datepicker-div
{
  z-index: 9999 !important;
}


.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  color:whitesmoke;
  background: linear-gradient(to right, rgba(0,0,0,0) 7%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 89%); 
}
.footer .container .text-muted {
margin: 10px 0;
color:whitesmoke !important;
}

#test{
  position:fixed;
  width:100%;
  text-align:center;
  padding:1px;
}
.container{
  
}
.content {
  background-color: #fff;
  padding: 20px;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -webkit-border-top-left-radius: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;
  -moz-border-radius-topleft: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-top-left-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
}

.hero-unit h1 {
  font-size: 50px;
}

.hero-unit {
  padding:20px !important;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
  background: #020031; /* Old browsers */
  background: -moz-linear-gradient(45deg,  #020031 0%, #6d3353 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#020031), color-stop(100%,#6d3353)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* IE10+ */
  background: linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
     -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
          box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
        
    line-height: 25px;
}


.msg{
    margin-bottom:0px !important;
}
.form{
border-radius:4px;
padding: 14px;
background-color: rgb(220,220,220);
box-shadow: 0px 0px 10px 0px rgb(200,200,200),
            0px 0px 3px 0px rgb(200,200,200), 
            0px 0px 5px 0px rgb(190,190,190) inset, 
            0px 0px 20px 0px rgb(180,180,180) inset;
}
.ribbon {
 font-size: 24px !important;
 font-family: 'Brawler', serif !important;
 /* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */
 width: 112%;
 position: relative;
 background: #BA8989;
 color: #fff;
 text-align: center;
 padding: 8px; /* Adjust to suit */
 margin: 20px 0px;
 box-shadow: 0px 10px 15px -3px rgb(155,155,155),0px 0px 7px 1px rgba(120, 120, 120, 0.6) inset;
 border:none !important;

}
//.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: -1em;
 border: 1.5em solid #986794;
 z-index: -1;
}
//.ribbon:before {
 left: -2em;
 border-right-width: 1.5em;
 border-left-color: transparent;
}
//.ribbon:after {
 right: -2em;
 border-left-width: 1.5em;
 border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
 content: "";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: #804f7c transparent transparent transparent;
 bottom: -.8em;
}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: .8em 0 0 .8em;
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: .8em .8em 0 0;
}

/* Colors */
#dataTable thead{
  background-image: linear-gradient(to bottom,#5D9DD3 0,#8ABCE5 100%);
  background-repeat: repeat-x;
}
.dashboard-table-header, .dashboard-card-title{
  background-image: linear-gradient(to bottom,#5D9DD3 0,#8ABCE5 100%);
  background-repeat: repeat-x;  
}

thead>.topHead{
  border-bottom: 3px solid white;
}
.table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th {
background-color: #F5F3E4;
}
/*
thead>.lead{
  color:black;
}
*/



.radioButtonList { list-style:none; margin: 0; padding: 0;}
    .radioButtonList.horizontal li { display: inline;}

    .radioButtonList label{
        display:inline;
    }

.apprentice_comments {

width:100%;
resize:auto;

}

#total_hours {

font-size:22px;

}

@media (max-width: 767.98px) {
  .form-control{
    padding: .175rem .3rem !important;
  }
  .form-row>.col, .form-row>[class*=col-]{
    padding-right:4px;
    padding-left:0px;
  }
}

.jumbotron .btn {
    margin: 4px;
}

.navbar {
    position: fixed !important;
}

/* GROCERY CRUD FIXES*/
#field-userID {
  width:100% !important;
}

.readonlyDate:not([disabled]){
  background-color: #fff !important
}

.btn-approve, .btn-send-glab {

  display:none;

}