portfolio/src/App.css
2022-07-27 21:07:04 +02:00

91 lines
1.3 KiB
CSS

.container {
max-width: 1000px;
margin: 0 auto;
padding: 0 1em;
}
.nav .container {
height: 3em;
}
.nav {
background-color: rgb(47, 46, 58);
height: 3em;
box-shadow: inset 0px 3px 20px 10px rgba(0, 0, 0, 0.3);
}
.nav a {
text-decoration: none;
color: #e5e5ff;
transition: 0.3s;
}
.nav a:hover {
color: #fff;
text-shadow: 0 0 5px #f2ef00;
}
.nav-items {
display: flex;
justify-content: space-between;
height: 100%;
align-items: center;
}
.menu-items {
display: flex;
}
.menu-items div {
margin-left: 1em;
}
.logo {
font-size: 2em;
font-weight: bold;
}
.logo a {
text-shadow: 0 0 5px #ccff00, 0 0 15px #ccff00, 0 0 30px #ccff00;
}
.hamburger {
display: none;
}
.copyright {
font-size: 0.7em;
text-align: center;
}
.hamburger-menu {
background-color: rgba(47, 46, 58, 0.9);
z-index: 100;
position: absolute;
right: 0;
backdrop-filter: blur(3px) contrast(60%);
-webkit-backdrop-filter: blur(3px) contrast(60%);
top: 3em;
bottom: 0;
left: 0px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-end;
}
.hamburger-menu a {
font-size: 2em;
text-decoration: none;
margin-right: 1em;
}
@media screen and (max-width: 768px) {
.hamburger {
display: inline;
}
.menu-items {
display: none;
}
}