html{height:100%}

* {box-sizing: border-box;}
		
	/* Style the header */
	header {
	  width:100%;
	  background-color:black;
	  padding:1px;
	  text-align:center;
	  font-family:Playbill;
	  font-size: 40px;
	  letter-spacing:10px;
	  color:yellow;
	  line-height:0;
	  height: 200px;
	  margin-bottom:1px;
	  margin-top:20px
	        }
	
body {background-color:black}

/* Create two unequal columns that floats next to each other */
.column {
    	  float: left;
    	  padding: 10px;
    	  }
.left {
  	  width: 9%;  background-color:black; text-align:center; 
    	}
.right {
       width: 90%; background-color:#FFFFCC; color:black; height:550px;
       }
/* Clear floats after the columns */
.row:after {
        	  content: "";
        	  display: table;
        	  clear: both;
           }
	
img{max-height: 100%; max-width: 100%}

footer{
    line-height:30%;
    width:100%;
		background-color:black;	
		text-align:center;
		color:white;
		font-size:15px;
		padding-top:10px
		}
		
    /*---------------- ID's ----------------	*/

#hdr{
     margin-bottom:1px;margin-top:10px;
    }            
#ftr{
	    line-height:30%;
      width:100%;
			background-color:black;	
			text-align:center;
			color:white;
			font-size:15px;
      }

#viewlink {  background-color:transparent;
          color:lime;
          padding: 16px;
          font-size: 40px;   letter-spacing:5pt; 
          border: none;
          font-family:Playbill;
          margin-top: -50px;
          margin-right:40px;
          width:  100%;
          text-align:right;
          }
#version {
          width:100%;text-align:left;color:aqua;font-size:medium;margin-left: 20px;
         }
         
#formstyle{position: absolute;bottom: 30%;right: 40%;background: rgb(0, 0, 0);background:rgba(0, 0, 0, 0.5);
            color:yellow; padding-left: 20px; padding-right: 20px; padding-bottom: 20px; text-align:left; 
	        }

                /* -----------------  C L A S S E S  ----------------- */
a:link{color:yellow;}
a:active{color:silver;}
a:visited{color:yellow;}
a:hover{color:#CCFFCC;}

.frmlabel{
position:absolute;
margin-left:5px;
left:0;
background-color:white;
border:thin;
display:inline-block;
width:100px;
}
.frmin{
  left:100px;
}

input.formbox{
              float:right;
              left:0;
              margin-left:5px
              }

.container {
            position: relative;
            }

.textblock {position: absolute;            
            bottom: 40%;
            right: 40%;
            background: rgb(0, 0, 0); /* Fallback color */
            background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */          
            color:yellow;
            padding-left: 20px;
            padding-right:20px;
            padding-bottom:20px;
            }

.companyname {
      	font-family: Playbill;
      	font-size: 25px;
      	font-weight: normal;
      	font-style: normal;
      	font-variant: normal;
      	text-transform: none;
      	color: #FFFF00;
      	vertical-align: middle;
      	text-align: center;
      	word-spacing: normal;
      	letter-spacing: 3px;
      }
.tagline {
      	color:lime;
      	font-size:25px;
      	letter-spacing:	3px;
      	line-height:1px
         }
.auto-style1 {
        font-size: large;
      }
.auto-style2 {
        color: yellow;
        font-size:30px;
      }
.auto-style3 {
        font-size: small;
      }
.auto-style4 {
        margin-top: 34px;
      }
.auto-style5 
  {
	  position: absolute;
	  bottom: 35%;
	  right: 45%;
	  background: rgb(0, 0, 0);
    /* Fallback color */background: rgba(0, 0, 00, 0.5);
    /* Black background with 0.5 opacity */color: yellow;
	  padding-left: 20px;
	  padding-right: 20px;
	  padding-bottom: 20px;
	  text-align: right;
	}
	
.tblcontainer {
  position: absolute;
  bottom: 20%;
  right: 30%;
  background: rgb(0, 0, 0);
  /* Fallback color */background: rgba(0, 0, 00, 0.5);
  /* Black background with 0.5 opacity */color: yellow;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  margin-top:1px;
  width:40%; height:45%;
}
.internal-frm-headings{
  border:medium black solid;
  background:black; 
  color:white; 
  text-align:center; 
  margin-bottom:5px;
  margin-top:20px;
  font-weight:bold;
}
#table{
  background-color:#ffffcc;
  margin:auto;
  left:200px;
  border:medium black solid;
  padding:10px;
}
#tabhead{
  background-color:#cccccc;
  border:thin black solid;
  padding:5px;
}
#tblftr{
  position:absolute;
  bottom:20%;
  right:35%;
}
.highlight:hover{
  background-color:red;
}

.loginfrm{text-align:left;  
   }
.footerstyle
{
  min-height: calc(100vh - 50px);
}
/* D R O P  D O W N  S T Y L E S */

/* The container <div> - needed to position the dropdown content */
.dropdown {
  /* position: relative; 
  display: inline-block;*/
  /* Note to self: inline-block seemed to prohibit the right alignment from working.
     At this point I dont understand what it does. Check into it later! 5/23/21.  */
  text-align:right;
  float:right;
  margin-right:100px
}

 /* Dropdown Button */
.dropbtn {
  background-color:transparent;
  color:yellow;
  padding: 16px;
  font-size: 40px;   letter-spacing:5pt; 
  border: none;
  font-family:Playbill;
  margin-top: -50px;
  width:  100%;
  text-align:right;
}

/* Dropdown Content (Hidden by Default) */

.dropdown-content {
  display: none;
  position:fixed;
  background-color:black;
  color:white;
  min-width: 160px;
  z-index: 1;
  font-size:30px;
  font-family:Cambria;
}

/* Links inside the dropdown */
/*   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
.dropdown-content a {
  background-color:black; 
  color:white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size:30px;
  font-family:Cambria;
  text-align:left;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color:black;color:yellow;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color:black;}