/* 
Pastels: fbb4ae b3cde3 ccebc5 decbe4 fed9a6 ffffcc e5d8bd fddaec f2f2f2
or try:
https://www.w3schools.com/colors/colors_monochromatic.asp
 */

:root {
  --title-bg: #e8ebec;
  --table-header-bg: #083370;    /* #006699; */
  --div-bg011:#fbb4ae;    /* lite green */
  --div-bg012:#b3cde3;   /* golden yellow */
  --div-bg013:#ccebc5;
  --div-bg014:#decbe4;
  --div-bg015:#fed9a6;
  --div-bg016:#ffffcc;
  --div-bg017:#e5d8bd;
  --div-bg018:#fddaec;
  --div-bg019:#f2f2f2;
  --div-bg01:#8dd3c7;
  --div-bg02:#ffffb3;
  --div-bg03:#bebada;
  --div-bg04:#fb8072;
  --div-bg05:#80b1d3;
  --div-bg06:#fdb462;
  --div-bg07:#b3de69;
  --div-bg08:#fccde5;
  --div-bg09:#d9d9d9;    /* grey */
  --div-bg10:#bc80bd;
  --div-bg11:#ccebc5;
  --div-bg12:#ffed6f;
  --table-row-even1: #fbb4ae;
  --table-row-even2: #e5d8bd;
  --table-row-even3: #ccebc5;
  --table-row-odd1: #decbe4;
  --table-row-odd2: #fed9a6;
  --table-row-odd3: #ffffcc;
  
 
}

* {
  margin:0;
  padding:0;
  border:0;
  list-style: none;
  box-sizing: border-box;
   font-family: Sans-Serif;
  
}
a { text-decoration: none; }
p {
   text-indent: 45px;
}
.center {
    text-align:center;
}
.alignright { text-align: right; }
.alignleft { text-align: left; }
.small {
    font-size: small;
}
.xsmall {
    font-size: x-small;
}

#wrapper {
  /* 
  border: 1px solid #000;
  width: 1350px;
  margin: auto; 
  */

  
  padding: 0;
  max-width: 85%; /* // or any percentage that match previous `25rem` horizontal padding value, or just any size that you want */
  margin: 0 auto; /* // don't forget to set horizontal margin to `auto` to make it centered */
  border: 1px solid #000;
}


.page-content {
  padding:15px 5px;
  margin: 5px;
  /* background: white; */
  min-height: 500px;
  
}




.title{
   padding: 14px 0;  
   background: var(--title-bg) ; /* var(--title-bg); #e8ebec */
   font-size: 20px;
   text-align: center;
   color: white;
   border:1px solid black;
   border-radius: 10px;
}


/* header images masthead */
#masthead {
  /* width:1350px; */
  width: 100%;
  background: #004080;   /* #013366; */
  
}
#masthead img {
  /* height:50px; */
  padding:0;
  margin:0;
  
} 
/* Clear floats after image containers */
#masthead::after {
  content: "";
  clear: both;
  display: table;

}

/* Pill BUTTONS */
.button{
  padding: 2px 5px;
  border: 1px solid black;
  background: grey;
  font-size: 10px;
  color: white;
  border-radius: 5px;
}
.red-text{
   color:red;
}
.pill {
  padding: 0px 4px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin: 0px 0px;
  cursor: pointer;
  font-size: 11px;
  border-radius: 16px;
}
.pill-md{
   font-size:13px;
   padding: 1px 5px;
}
.pill-lg{
   font-size:14px;
   padding: 2px 6px;
   min-width:100px;
}
/* Fall Colors https://colorkit.co/palette/00202e-2c4875-8a508f-bc5090-ff6361-ff8531-ffa600-80d353-609f3f-406a2a/ */
 /* #00202e,  #2c4875,  #8a508f,  #bc5090,  #ff6361,  #ff8531,  #ffa600,  #80d353,  #609f3f */
  /* #9e3a14,  #aa4f30,  #b56348,  #bf765e,  #ca8974,  #d39d8b,  #ddb0a1,  #e6c4b8,  #efd7cf and  #f7ebe7. */
/*  https://colorkit.co/palettes/10-colors/ */
.pill-colorkit1 {
  background-color: #00202e;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit2 {
  background-color: #2c4875;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit3 {
  background-color: #8a508f;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit4 {
  background-color: #bc5090;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit5 {
  background-color: #ff6361;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit6 {
  background-color: #ff8531;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit7 {
  background-color: #ffa600;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit8 {
  background-color: #80d353;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit9 {
  background-color: #609f3f;
  border: 1px solid grey;
  color: white;
}
/*  #0a2d2e,  #1c4e4f,  #436e6f,  #6a8e8f,  #879693,  #a49e97,  #deae9f,  #efd7cf,  #f7ebe7 */
.pill-colorkit10 {
  background-color: #0a2d2e;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit11 {
  background-color: #1c4e4f;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit12 {
  background-color: #436e6f;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit13 {
  background-color: #6a8e8f;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit14 {
  background-color: #879693;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit15 {
  background-color: #a49e97;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit16 {
  background-color: #deae9f;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit17 {
  background-color: #efd7cf;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit18 {
  background-color: #f7ebe7;
  border: 1px solid grey;
  color: white;
}
 /* Muted Reds #9e3a14,  #aa4f30,  #b56348,  #bf765e,  #ca8974,  #d39d8b,  #ddb0a1,  #e6c4b8,  #efd7cf and  #f7ebe7. */
 .pill-colorkit20 {
  background-color: #9e3a14;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit21 {
  background-color: #aa4f30;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit22 {
  background-color: #b56348;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit23 {
  background-color: #bf765e;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit24 {
  background-color: #ca8974;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit25 {
  background-color: #d39d8b;
  border: 1px solid grey;
  color: white;
}
.pill-colorkit26 {
  background-color: #ddb0a1;
  border: 1px solid grey;
  color: #405D5D;
}
.pill-colorkit27 {
  background-color: #e6c4b8;
  border: 1px solid grey;
  color: #405D5D;
}
.pill-colorkit28 {
  background-color: #efd7cf;
  border: 1px solid grey;
  color: #405D5D;
}
.pill-colorkit29 {
  background-color: #f7ebe7;
  border: 1px solid grey;
  color: #405D5D;
}

/* END https://colorkit.co */
.pill-brown {
  background-color: brown;
  border: 1px solid black;
  color: white;
}
.pill-indigo {
  background-color: indigo;
  border: 1px solid black;
  color: white;
}
.pill-khaki {
  background-color: khaki;
  border:  1px solid black;
  color: black;
}
.pill-lightseagreen {
  background-color: lightseagreen;
  border:  1px solid black;
  color: black;
}
.pill-aqua {
  background-color: #88d8c0;
  border:  1px solid black;
  color: black;
}
.pill-mediumorchid {
  background-color: MediumOrchid;
  border:  1px solid black;
  color: white;
}
.pill-midnightblue {
  background-color: midnightblue;
  border:  1px solid black;
  color: white;
}
.pill-lightpink {
  background-color: LightPink;
  border:  1px solid black;
  color: black;
}
.pill-slateblue {
  background-color: SlateBlue;
  border:  1px solid black;
  color: white;
}
.pill-orange {
  background-color: orange;
  border: 1px solid black;
  color: black;
}
.pill-tomato {
  background-color: tomato;
  border: 1px solid grey;
  color: black;
}
.pill-green {
  background-color: green;
  border: 1px solid black;
  color: white;
}
.pill-lavender-lg {
  background-color: lavender;
  border: 1px solid black;
  color: black;
  width:150px;
  font-size:18px;
}
.pill-teagreen-lg {
  background-color: #D0F0C0;
  border: 1px solid black;
  color: black;
  width:150px;
  font-size:18px;
}
.pill-grayed {
  background-color: lightgrey;
  border: 1px solid grey;
  color: grey;
  cursor:default;
}
.pill-grey-lg {
  background-color: lightgrey;
  border: 1px solid grey;
  color: grey;
  width:150px;
  font-size:14px;
  padding:3px 0px;
  cursor:default;
}
 .download_browser_text_excel {
  float: right;
  top: 2px;
  font-size: 12px;
}  
#footer {
   border: 1px solid black;
   padding: 10px 30px;
   margin: 5px;
} 
.alpha-list {
  letter-spacing: 2px;
}
.alpha-select{
   
}
.dropdown-homd{
   font-size:15px;
   height:25px;
   width:150px;
   border:1px solid brown;
}
.pull_right{
    float:right;
}
.nowrap{
    white-space: nowrap;
}