@font-face {
  font-family: 'Roboto Slab';
  src: url('../assets/fonts/RobotoSlab-Regular-webfont.eot'); /* IE9 Compat Modes */
  src: url('../assets/fonts/RobotoSlab-Regular-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../assets/fonts/RobotoSlab-Regular-webfont.woff') format('woff'), /* Modern Browsers */
  url('../assets/fonts/RobotoSlab-Regular-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../assets/fonts/RobotoSlab-Regular-webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

body {
    font: normal 12pt Arial, Helvetica, sans-serif;
}

h1 {
    font: normal 18pt 'Open Sans', Arial, Helvetica, sans-serif;
}

h2 {
    font: normal 16pt 'Open Sans', Arial, Helvetica, sans-serif;
}

h3 {
    font: normal 14pt 'Open Sans', Arial, Helvetica, sans-serif;
}

li {
    list-style-type: none;
}

.btn,
.btn-default,
.btn-default:hover {
  color: white;
  background-color: #17a2b8;
  border-color: transparent;
}

.btn:hover,
.btn-default:hover {
    border-color: black;
}

.product-name {
  font-family: "Roboto Slab", Arial, sans-serif;
}
/*-----------------
	The Header
------------------*/

header {
  font: normal 100% Arial, Helvetica, sans-serif;
  position: fixed;
  top: 0;
  left:0;
  right:0;

  height: 4em;
  z-index: 100;

  background-color: #2a7d2e;
  padding: 1em 2em;
  color: #fff;
  box-shadow: 0em 0.1em 0.2em rgba(0, 0, 0, 0.1);
}

header a {
    color: #ffffff;
    text-decoration: none;
}

header h1 {
    margin: 0.5em;
    padding-right: 1em;
    display: inline;
}



header input {
    margin: 0.1em 0.1em 0.1em 0.1em;
    display: inline;
    color: black;
}

header button{
  background-color: #17a2b8;
  color: #ffffff;
  border: 0;
  font-weight: bold;
  font-size: 1.2em;
  cursor: pointer;
  border-radius: 0.1em;
  height: 2em;
  margin: 0em 0.5em 0em 0.5em;
}

header button #text {
    margin: 0em 1em 0em 1em;
}

/*@media (max-width: 30em){*/

/*header {*/
/*padding: 1em 0.75em;*/
/*}*/

/*header h1{*/
/*font-size: 1.5em;*/
/*margin: 0;*/
/*}*/

/*}*/

/*-----------------
	Login
------------------*/
#login input {
    font: normal 1.5em sans-serif;
    width: 7em;
    margin: 0.5em 1em 0em 1em;
}

#login button{
  background-color: #17a2b8;
  color: #ffffff;
  border: 0;
  font-weight: bold;
  font-size: 1.5em;
  cursor: pointer;
  border-radius: 0.1em;
  height: 1.5em;
  margin: 0.5em 1em 0em 1em;
}

/*-----------------
	Main Content
------------------*/
div.container {
    width: 100%;
}

div.tab-description {
    width: 50%;
    margin-right: auto;
    padding-bottom: 1em;
    text-align: left;
}

div.child-table-div {
    margin-left: 3em;
}

.main-content {
    box-sizing: border-box;
    text-align: center;
    margin: 5em auto 1.5em;
    padding: 0 0.5em;
}

div.dataTables_length,
div.dataTables_info,
div.dataTables_wrapper .col-sm-6 {
    text-align: left;
}

div.dataTables_length select {
    font-size: 1em;
}

.main-content h3 {
    font-size: 1.7em;
    color: #5a96b9;
    padding-bottom: 1em;
}

.main-content p {
    text-align: left;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
    color: rgb(149, 183, 238);
}

.tab-content {
    margin-top: 1em;
}

.tab-pane #child-table-subtitle {
    text-align: left;
    text-decoration: underline;
}

.td-select > select {
    height: 100%;
    width: 100%;
    position: relative;
    text-align: center;
    text-align-last: center;
}

.delete-option-btn {
    margin-right: 2em;
}

div.date-range {
    text-align: left;
}

input.date-box {
    display: inline;
    margin-bottom: 1em;
}

td.selected-border {
    outline: 2px solid #95B7EE;
}

/*-----------------
	Data Tables Stuff
------------------*/
.table-striped>tbody>tr:nth-child(odd)>td,
.table-striped>tbody>tr:nth-child(odd)>th {
  background-color: #f0f8e7;
}

.table-striped>tbody>tr:nth-child(even)>td,
.table-striped>tbody>tr:nth-child(even)>th {
  background-color: white;
}

.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
  z-index: 3;
  color:
    #fff;
  cursor: default;
  background-color:
    #17a2b8;
  border-color:
    #17a2b8;
}