.header {
    background-color: #8D0404;
    font-family: Arial, Helvetica, sans-serif;
    color: #d9e0e4;
}

.fuel-btn {
    height: 60px;
    background-color: #1B3E54;
    color:white;
}

.fuel-btn:hover {
	color:#3287B2;
}

.own-btn {
    height: 60px;
}

.own-btn:hover {
    color:#7FFFAA;
}

.msg-btn:hover {
    color:black;
}

.msg-btn {
    height: 60px;
}

.edit-text {
    color: blue;
}

.edit-text:hover {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

.logout-btn {
    height: 60px;
}

.logout-btn:hover {
    color:white;
}

.admin-edit-fuel {
    background-color: #1B3E54;
    color:white;
}

.admin-edit-fuel:hover {
    color: gray;
}

.admin-navbar-dropdown {
    background-color: #dbdbdb; 
    color:rgba(255,255,255,.55)
}

.admin-navbar-dropdown:hover {
    color:rgba(255,255,255,.8)
}

.footer {
    height: 50px;
    background-color: #1B3E54;
}

.link-text {
    color: rgb(32, 32, 161) !important;
    cursor: pointer !important;
    text-decoration: none !important;
  }

.link-text:hover {
    color: rgb(32, 32, 161) !important;
    cursor: pointer !important;
    text-decoration: underline !important;
  }

@media only screen and (max-width: 768px) {
    .header-text {
      font-size: 1.3rem;  
    }
}

@media only screen and (min-width: 768px) {
    .header-text {
      font-size: 2rem;  
    }
}

.error {
    font-family: Arial, Helvetica, sans-serif;
    font-size: small;
}

/* FUEL GAUGE WITH ANIMATION*/
.fuel-max {
    position: relative;
    height: 100%;
    background-color: rgb(245, 60, 60);
    color:whitesmoke;
    border-radius: 5px;
}

.fuel-level {
    position: absolute;
    bottom:0;
    max-height: 100%;
    background-color: rgb(27, 216, 27);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    transition: background-color 2s;
}

.fuel-level:hover{
    background-color:rgb(174, 174, 212);
    cursor:pointer;
}