personal-website/static/css/main.css

86 lines
1.4 KiB
CSS

body {
font-family: monospace;
font-size:20px;
line-height:1.5;
position:relative;
color: #fff;
background-color:#2e4051;
}
a {
color:#fff;
text-decoration: underline 2px dotted white;
}
a:hover {
text-decoration: underline 2px solid white;
}
:focus {
border-bottom: none;
outline: 2px dashed white;
}
.layout {
max-width: 1000px;
margin: 0 auto 200px;
}
.big-text-header {
font-size: 70px;
line-height: 1;
text-align: center;
display: flex;
justify-content: center;
}
.big-text-header__text {
font-size: 1em;
padding: 10px;
}
.layout__left-col {
display: flex;
flex-direction: column;
align-items: center;
}
.left-nav {
min-width: 180px;
}
.left-nav__categories {
padding: 0;
margin: 0;
list-style-type: none;
}
.left-nav__category {
margin-bottom: 16px;
}
.left-nav .category-label {
padding-left: 16px;
}
.left-nav__list {
font-family: monospace;
list-style-type: none;
padding: 0;
margin: 0;
font-size: 20px;
line-height: 1;
}
.left-nav__block {
margin: 4px 4px 12px 4px;
background-color: #2e2f51;
position: relative;
border: 2px solid;
border-color: #2e2f51;
}
.left-nav__list-link,
.left-nav__list-link:visited {
color: #fff;
padding: 6px;
display: block;
}
@media screen and (min-width: 800px) {
.layout__columns {
display: flex;
}
.layout__left-col {
align-items: start;
}
.left-nav {
margin-right: 24px;
}
}