45 lines
1.1 KiB
CSS
45 lines
1.1 KiB
CSS
.navbar {
|
|
background-color: #800000; /* Maroon background */
|
|
height: 50px; /* Navbar height */
|
|
width: 100%; /* Full width */
|
|
display: flex; /* Flexbox for alignment */
|
|
justify-content: flex-end; /* Align items to the right */
|
|
align-items: center; /* Center vertically */
|
|
padding: 0 20px; /* Horizontal padding for spacing */
|
|
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Subtle shadow */
|
|
position: fixed; /* Fix the navbar to the top */
|
|
top: 0;
|
|
z-index: 1000; /* Place above other elements */
|
|
}
|
|
|
|
.navbar {
|
|
box-sizing: border-box; /* Include padding and border in the height calculation */
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 1000;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.navbar select,
|
|
.navbar input {
|
|
height: auto;
|
|
margin: 0;
|
|
padding: 5px 10px;
|
|
font-size: 16px; /* Ensure consistent font size */
|
|
}
|
|
|
|
|
|
/* User Icon */
|
|
.user-icon {
|
|
font-size: 30px; /* Icon size */
|
|
color: #fff; /* White color for the icon */
|
|
cursor: pointer; /* Pointer cursor on hover */
|
|
transition: color 0.3s ease-in-out; /* Smooth hover effect */
|
|
}
|
|
|
|
.user-icon:hover {
|
|
color: #ffcccc; /* Light pink on hover */
|
|
}
|