@media screen { 

body {
background-color: LightYellow;}

#top {position: absolute;
top: -20px;}

h2 {font-family: verdana;
}

h3 {
position: absolute;
top: 55px;
right: 13px;
background-color: yellow;
height: 45px;
color: red;
padding: 1px;
}

h5 {
	position: absolute;
	top: -15px;
	right: 15px;
	background-color: yellow;
   height: 45px;
   color: red;
   padding: 1px;
}

#yearly  {
font-family:verdana;
font-size: 12px;
color: red;
background-color: aquamarine;
}

h6 {
font-family:verdana;
color: darkorange;
background-color: whitesmoke;
}

.dropbtn{
background-color: salmon;
color: white;
width: 100px;
padding: 10px;
border: 0;
font-size: 12px;
}

.dropdown {
position: relative;
display: inline-block;
width: 100px;
}




.dropdown-content {
display: none;
background-color: whitesmoke;
width: 100%;
}

.dropdown-content a {
display: block;
color: black;
padding: 12px;
text-decoration: none;
font-size: 12px;
}

.dropdown:hover .dropbtn {
background-color: sandybrown;
}

.dropdown-content a:hover {
background-color: lightgrey;
}

.dropdown:hover .dropdown-content {
display: block;
}

.dropbtn2{
background-color: salmon;
color: white;
width: 100px;
padding: 12px;
border: 0;
font-size: 12px;
}


.dropdown2 {
position: relative;
display: inline-block;
width: 100px;
}

.dropdown2-content {
display: none;
background-color: whitesmoke;
width: 100%;
}

.dropdown2-content a {
display: block;
color: black;
padding: 12px;
text-decoration: none;
}

.dropdown2:hover .dropbtn {
background-color: sandybrown;
}

.dropdown2-content a:hover {
background-color: lightgrey;
}

.dropdown2:hover .dropdown-content {
display: block;
}


table {
position: absolute;
top: 550px;
border-collapse: separate;
border-spacing: 3px 5px;
border-width: 1px;
border-color: green;
padding: 1px;

   
}

#table2 {
position: absolute;
top: 0px;
left: 310px;
width: auto;
border-collapse: separate;
border-spacing: 3px 5px;
border-width: 1px;
border-color: green;
padding: 1px;

   
}

th {
	font-family: arial;
	font-size: 17px;
background-color: lawngreen;
padding: 1px;

}


td {
	font-family: verdana;
	font-size: 16px;

padding: 1px;
text-align: center;

}

td:nth-child(7) {background-color: yellow;
}

.tableStyle1 {width: 100%;}

/*Table Even Rows Styles*/
   .tableStyle1 tr:nth-child(even){
   background-color: cyan;
   }
   /*Table ODD Rows Styles*/
    .tableStyle1 tr:nth-child(odd){
   background-color: lightcyan;
   }
  	
 /*Table Row HOver Style*/
          .tableStyle1 tr:hover{
         background-color: yellow;
         }


 .tableStyle2 {position: fixed;
top: 40px;
right: 160px;
width: 150px;
 font-weight: bold;
 color: red;
 background-color: yellow;
}
.tableStyle2 th{color: navy;
background-color: lightblue;

}

 .tableStyle3 {position: fixed;
top: 40px;
right: 13px;

 	width: 150px;
 font-weight: bold;
 color: red;
 background-color: yellow;
}

.tableStyle3 th {color: mediumblue;
background-color: snow;
} 


  .tableStyle4 {width: 100%;}

/*Table Even Rows Styles*/
   .tableStyle4 tr:nth-child(even){
   background-color: cyan;
   }
   /*Table ODD Rows Styles*/
    .tableStyle4 tr:nth-child(odd){
   background-color: lightcyan;
   }	
 /*Table Row HOver Style*/
          .tableStyle4 tr:hover{
         background-color: yellow;
         }
       



#nav {
position: absolute;
top: 360px;
font-family: verdana;
font-size: 30px;
font-weight: bold;
background-color: aqua;
left: 340px;
}

#fuelform {
	position: absolute;
	top: 0px;
	max-width: 300px;
	background-color: yellow;
font-size: 20px;
font-family: verdana;}


#signon {
	max-width: 300px;
	background-color: yellow;
font-size: 20px;
font-family: verdana;}

#signoff {
	max-width: 300px;
	background-color: yellowgreen;
font-size: 20px;
font-family: verdana;}


#success {
background-color: lightgreen;
font-family: verdana;
font-size: 75px;}


#failure {
background-color: red;
font-family: verdana;
font-size: 75px;}


}

@media (max-width: 2000px) {
  .text {
    font-size: 50px;
  }}