/***********
Base Styles
***********/
html,
body {
  overflow-x: hidden; /* Prevent scroll on narrow devices */
  /*overflow-y:scroll; */
  /* y scroll always on show  */
}

body {
  padding-top: 70px;
  background-color: #eee;
  font-family: sans-serif;
}

/* Hide for validation, show when invalid */
.hints {
  border-radius: 5px;
  display: block;
  font-size: 1.0em;
  text-align: left;
  left: 105%;
  top: 25px;
  padding: 7px 10px;
  color: red;
}

.nav, 
.pagination, 
.carousel, 
.panel-title,
.order, 
a { cursor: pointer; }

.dropSelectInput{
  position: relative;
}

/***********
Login Style
***********/
.login-form{
  background: #fff;
  max-width: 450px;  border-radius: 5px;
  box-shadow: 0 0 1em #222;
  margin: 100px auto 0;
  padding: 4em 4em 3em;

}

/***********
Globals
***********/
.sub-header {
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
  background-color: blue;
}

/*Top navigation*/
.navbar-fixed-top {
  border: 0;
}

/* Sidebar navigation */
/* Icon when the collapsible content is shown */
.list-group .btn:after {
  font-family: "Glyphicons Halflings";
  content: "\e114";
  float: right;
  margin-left: 15px;
}
/* Icon when the collapsible content is hidden */
.list-group .btn.collapsed:after {
  content: "\e080";
}

.sideNavbar .list-group-item {
    width: 235px;
    margin-bottom: 3px;
    text-align: left;
    font-size: 14px;
    line-height: 14px;
}

#truckLoc {
  border-radius: 4px;
}

/***********
Homepage Styles
***********/
.panel-list{
  min-height: 480px;
}

.panel-heading h3 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: normal;
    width: 75%;
    padding-top: 8px;
}

.top-buffer-1 { margin-top:-20px; }
.top-buffer { margin-top:5px; }
.right-buffer { margin-right:20px; }


/***********
Add Customer Styles
***********/

.customer-card {
  padding:10px;
  background: #fff;
  border-radius: 5px;
  margin: 5px auto;
  box-shadow: -2px -1px 8px 1px rgba(0,0,0,0.3);
}


/***********
Sales Order Styles
***********/
#over {
  position: absolute;
  width: 533px;
  max-height: 169px;
  z-index:2; 
  overflow: auto;
}



td label {
  margin-top: 7px;  
}

.price {
  margin-left: 0px;
}

/*override bootstrap form-control*/
tr td input{
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;

}

/*sales order delete close icon*/
td button.close {
  margin-top: 5px;
  margin-left:20px;
  float: none;
}

.upLine{
  border-top: 2px solid #ccc;
  margin-top: 10px;
}

/*when item is selected in salesOrder details*/
.isSelected {
  background-color: #dae9ea;
}

.onFocus{
  background-color: #dae9ea;
}


/*.animate-repeat {
  line-height:13px;
  list-style:none;
  box-sizing:border-box;
}
*/
.animate-repeat.ng-move,
.animate-repeat.ng-enter{
  transition:all 0.2s;
}


.animate-repeat.ng-move,
.animate-repeat.ng-enter {
  opacity:0;
  max-height:0;
}

.animate-repeat.ng-move.ng-move-active,
.animate-repeat.ng-enter.ng-enter-active {
  opacity:1;
  max-height:30px;
}

.complete{
  background-color: lightblue;
}

/***********
Purchase Order Styles
***********/
#statusOverlay {
  position: absolute;
  left: 614px;
  top: 72px;
  width: 200px;
  max-height: 169px;
  z-index: 2;
}

.itemReceived {
  background-color: lightblue;
}

/*auto-Reorder List Scrollable  */
.selectVendor-modal-body{
    max-height: 550px;
    overflow-y: auto;
}

/***********
@media
***********/

@media (min-width: 768px){
  .container {
    width: 100%;
  }
}

@media (min-width: 992px){
  .container {
    width: 100%;
  }
}

@media screen and (min-width: 1198px) {
  #overLay {
    position: absolute;
    width: 700px;
    z-index:2; 
    max-height: 290px;
    overflow: auto;
  }
}


@media screen and (max-width: 1197px) {
  #overLay {
    position: absolute;
    width: 550px;
    z-index:2; 
    max-height: 290px;
    overflow: auto;
  }
}

@media screen and (min-width: 1200px) {
  .container {
      width: 1200px;
  }
  .col-md-3 {
      width: 25%;
  }

  .col-md-9 {
      width: 75%;
  }
}



@media screen and (max-width: 921px) {
  .sideNavbar .list-group-item {
    width: 208px;
    margin-bottom: 3px;
    text-align: left;
    line-height: 14px;
  }
}

@media screen and (min-width: 876px){
    .sidenav .closebtn{
        display: none;
    }

    .listIcon {
        display: none;
    }
}

@media screen and (max-width: 875px) {

  .col-xs-9 {
      width: 100%;
  }

  .sidenav {
      height: 100%;
      width: 0px;
      position: fixed;
      z-index: 100;
      margin-top: 71px;
      top: 0;
      left: 0;
      background-color: #d9edf7;
      overflow-x: hidden;
      padding-top: 10px;
      transition: 0.5s;
  }

}




/* The navigation menu links */
.sidenav a {

    text-decoration: none;
    font-size: 12px;
    color: #818181;
    display: block;
    transition: 0.2s
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover, .offcanvas a:focus{
    color: #337ab7;
}

@media screen and (max-width: 414px){
  h1{
     font-size: 24px;
  }

  .headtext{
    display: none;
  }
}

  

@media screen and (min-width: 415px) and (max-width: 768px){
  h1{
     font-size: 32px;
  }

  .headtext{
    display: none;
  }
}


.blink-2 {
	-webkit-animation: blink-2 2s infinite both;
	        animation: blink-2 2s infinite both;
}

/* ----------------------------------------------
 * Generated by Animista on 2019-6-19 16:37:26
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation blink-2
 * ----------------------------------------
 */
@-webkit-keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink-2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}