/* v.2.0.0 */




/* delme
.headerBannerImg {
height: 120px;
background-image: url('/img/header-banner.svg');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
margin-bottom: -30px;
}


*/

.headerBannerImg {
padding-top: 10px;
display: block;
margin: 0 auto;
max-height: 120px;
margin-bottom: -30px;
position: relative;
z-index: -1;
}


.menu {
display: grid;
/*grid-template-areas: "a a a a a";*/
/*grid-template-columns: repeat(4, 1fr);*/
/*grid-template-columns: repeat(auto-fill, 130px);*/
/*grid-auto-columns: 1fr;*/
grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
grid-gap: 5px;
margin: 0 auto;
justify-content: center;
}

@media(max-width: 150px) { .menu { display: block; width: 100%; }}



.menu a {
display: flex;
min-width: 100%;
min-height: 100%;
justify-content: center;
align-content: center;
text-transform: lowercase;
padding: 9px;
margin: 0 auto;
text-decoration: none;
}


.postFooter {
margin-top: 7px;
display: grid;
grid-template-columns: 70% 29%;
grid-gap: 1%;
}
.postTaglist { text-align: left; }
.postTime { text-align: right; }
.postTagList a, .postTime a{ font-size: calc(100% - 5%); }


@media (prefers-color-scheme: light) {
body{
background-image: url("/img/tpl/bg.svg");
background-repeat: repeat;
background-attachment: fixed;
}
}

@media (prefers-color-scheme: dark) {
body{
background-image: url("/img/tpl/bg-dark.svg");
background-repeat: repeat;
background-attachment: fixed;
}
}


.logo, .logo2{
position: relative;
border-radius: 50%;
display: inline-flex;
vertical-align: middle;
text-align: center;
padding: 1px;
border: 2px dashed color-mix(in srgb, var(--brand) 50%, transparent);
opacity: 1;
transition: transform .250s ease-in-out;
width: 60px;
}

.logo:hover, .logo2:hover{
transform: rotate(360deg);
transition: transform 1.5s ease-in-out;
}

.logo2 { width: 26px; height: 26px; }

@media (prefers-reduced-motion) {
.logo:hover, .logo2:hover{ border-color: var(--c); }
}