/* layout styles */

.container {
margin:0px 0px;
padding:0px; 
background-color: #ffffff;
max-width: 100%; }


.sidebar {
min-width: 24rem;
float: left; }

section, .section-heading {
}

.flex_container {
  display: flex; /* or inline-flex */
}

.flex_item {
flex-basis: 0;
  flex-grow: 1;
}

section {
margin: 25px 0px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
border:solid 2px;
border-color: #00bcbd; }

.section-heading {
border-top-left-radius: 18px;
border-top-right-radius: 18px;
background-color: #00bcbd; }

.section-heading-title {
font-size: 2rem;
padding: 5px 10px;
margin: 0px; }

.section-content {
margin: 10px; }

.hidden {
display:none; }

.expandSectionLink {
display: inline; }

/* flex column styles */
.flex-container {
  display: flex;
  flex-flow: wrap;
}

.flex-child {
    padding: 5px;
    flex: 0.5;
}  


/* Inserting this collapsed row between two flex items will make 
 * the flex item that comes after it break to a new row */
 .flex-container hr {
  width: 100%;
  height:0;
  margin:0;
}

.flex-child:first-child {
    margin-right: 20px;
} 

.sidebar {
    padding: 5px;
    flex: 0.5;
}  

.main-content {
flex: 3; }


/* element styles */
td {
border:0px; }



ul.listTable {
border: solid 1px; }

ul.listTable li {
display: inline-block; }

.li-nolist {
list-style-type: none; }

th.pageLinks li {
display: inline-block;
margin: 0px 5px; }

ul.hlist > li {
margin:0px 5px;
display: inline-block; }

.label {
  border-radius: 8px;
  color: #ffffff;
  background: #73AD21;
  padding: 2px 4px;
}

.productTerm {
  border-radius: 8px;
  color: #ffffff;
  background: #73AD21;
  padding: 2px 4px;
  margin: 0px 5px;
}


.red {
color: #d91c1c; }

.green {
color: #7ac223; }

.small {
font-size: 80%;}

.larger {
font-size: 120%;}

.muchLarger {
font-size: 140%;}

.jsLink {
cursor: pointer; }

div.input, div.inputForm {
border-radius: 10px; 
padding: 10px; 
margin: 10px 0px;
background-color: #d6f1ff; }

div.inputForm input {
width:600px; }


/* areas styles */

div.paginator_numbers a {
margin: 0px 3px; }


.box {
padding: 0.6em;
margin: 10px 0px;
border:solid #ff9933; 
border-width: 2px 1px;}




/* autocomplete fields */
div.autocomplete {
  position:absolute;
  width:250px;
  background-color:white;
  border:1px solid #888;
  margin:0;
  padding:0;
}
div.autocomplete ul {
  list-style-type:none;
  margin:0;
  padding:0;
}
div.autocomplete ul li.selected { background-color: #ffb;}
div.autocomplete ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  height:32px;
  cursor:pointer;
}




/* table rows */

.odd, .even {
padding: 2px 5px; 
margin: 2px 0px; }
.odd {
background-color: #ffeecc; }
.even {
background-color: #ffddbb; }



/* breadcrumbs */
ul.breadcrumbs-trail {
  list-style: none;
}
ul.breadcrumbs-trail li {
margin: 0px 3px;
  display: inline;
  font-size: 18px;
}
ul.breadcrumbs-trail li+li:before {
  padding: 8px;
}
ul.breadcrumbs-trail li a {
  text-decoration: none;
}
ul.breadcrumbs-trail li a:hover {
  text-decoration: underline;
}




/* input styles */

input.qty {
width: 80px; }

.modelComponentSubProduct {
 margin-left: 50px;
}

/* update progress bar */
.update-bar {
  width:100%;
  height: 2rem;
  border: solid 1px lightseagreen; 
}

.update-fill {
  width:0%;
  height:100%;
  background-color: #ff9933;
}