.boldtable30
{
font-variant:small-caps;   
font-family:sans-serif;
font-size:30pt;
color:black;
}

.boldtable26
{
font-variant:small-caps;   
font-family:sans-serif;
font-size:26pt;
color:black;
}

.boldtable24
{
font-variant:small-caps;    
font-family:sans-serif;
font-size:24pt;
color:black;
}

.boldtable20
{
font-variant:small-caps;    
font-family:sans-serif;
font-size:20pt;
color:black;
}

.boldtable16
{
font-variant:small-caps; 
font-family:sans-serif;
font-size:16pt;
color:black;
}

.boldtable12
{
font-variant:small-caps; 
font-family:sans-serif;
font-size:12pt;
color:black;
}

table#sortable
{
  font-family: sans-serif;
  font-size:  10pt;
  background-color: #fdf5e6;
  border-collapse: collapse;
}

table#sortable tr:first-child
{
  font-size: 11pt;
  font-weight: bold;
  border-bottom: 2px solid #5e5e5e;
  cursor: pointer;
}


table#sortable tr:nth-child(n+2)
{
  border-bottom: thin solid #4b4b4b;
}



.table10
{
 
 font-family: sans-serif;
 font-size:  10pt;
 color: black;
 background-color: #fdf5e6;
 border-style: inset;
 border-width: 3px;
 border-color: ghostwhite;
 
}

.table10_noborder
{
 font-family: sans-serif;
 font-size:  10pt;
 color: black;
 background-color: #fdf5e6;
 
}

.table12
{
 font-family:sans-serif;
 font-size:12pt;
 color:black;
 background-color:#fdf5e6;
 border-style: inset;
 border-width: 3px;
 border-color: ghostwhite;
}

.table12_noborder
{
 font-family:sans-serif;
 font-size:12pt;
 color:black;
 background-color:#fdf5e6;
}

.table16_noborder
{
 font-variant:small-caps;
 font-family:sans-serif;
 font-size:16pt;
 color:black;
}

.table16
{
 font-variant:small-caps;
 font-family:sans-serif;
 font-size:16pt;
 color:black;
 background-color:#fdf5e6;
 border-style: inset;
 border-width: 3px;
 border-color: ghostwhite;
 
 }
.table20
{
 font-family:sans-serif;
 font-size:20pt;
 color:black;
 background-color:#fdf5e6;
 border-style: inset;
 border-width: 3px;
 border-color: ghostwhite;
}

.breadcrumb
{
 font-family: sans-serif;
 font-size: 10pt;
 color: black;
 background-color: #fdf5e6;
 border-style: inset;
 border-width: 3px;
 border-color: ghostwhite;
}

.big-button
{
  font-variant:small-caps;
  font-family:sans-serif;
  font-size:20pt;
  color:Blue;
  font-weight:bolder;
  background-color: lightsteelblue;
  
}

.big-button-gray
{
  font-variant:small-caps;
  font-family:sans-serif;
  font-size:20pt;
  color:gray;
  font-weight:bolder;
  background-color: lightgrey;
  
}

.bigger-button
{
  font-variant:small-caps;
  font-family:sans-serif;
  color:blue;
  font-weight:bolder;
  background-color: lightsteelblue;
  font-size:14pt;
}

.bigger-button-gray
{
  font-variant:small-caps;
  font-family:sans-serif;
  color:gray;
  font-weight:bolder;
  background-color: lightgrey;
  font-size:14pt;
}

.button
{
    font-family:sans-serif;
    color:blue;
    font-weight: bolder;
    background-color: lightsteelblue;
    font-size:10pt;
}

.button-gray
{
    font-family:sans-serif;
    color:gray;
    font-weight: bolder;
    background-color: lightgrey;
    font-size:10pt;
}

.my-password-field {
  font-family: text-security-disc;
  /* Use -webkit-text-security if the browser supports it */
  -webkit-text-security: disc;
}

.info {
   right: 30%;
   left: 30%;
   height: 10%;
   position: fixed;
}

.rid_list {
   margin: 20%;
   overflow-y: auto;
   bottom: 0;
}

/*----------- popup CSS code -----------*/

 /* Popup container */
 .popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
} 

/*----------- end popup -----------*/