/* copyright (c) xiobb / xioiox imxb.de 2025.07 */

:root {
    color-scheme: light;
    --in: 72.06% .191 231.6;
    --su: 64.8% .15 160;
    --wa: 84.71% .199 83.87;
    --er: 71.76% .221 22.18;
    --pc: 89.824% .06192 275.75;
    --ac: 15.352% .0368 183.61;
    --inc: 0% 0 0;
    --suc: 0% 0 0;
    --wac: 0% 0 0;
    --erc: 0% 0 0;
    --rounded-box: 1rem;
    --rounded-btn: .5rem;
    --rounded-badge: 1.9rem;
    --animation-btn: .25s;
    --animation-input: .2s;
    --btn-focus-scale: .95;
    --border-btn: 1px;
    --tab-border: 1px;
    --tab-radius: .5rem;
    --p: 49.12% .3096 275.75;
    --s: 69.71% .329 342.55;
    --sc: 98.71% .0106 342.55;
    --a: 76.76% .184 183.61;
    --n: 32.1785% .02476 255.701624;
    --nc: 89.4994% .011585 252.096176;
    --b1: 100% 0 0;
    --b2: 96.1151% 0 0;
    --b3: 92.4169% .00108 197.137559;
    --bc: 27.8078% .029596 256.847952;
}

.headimg {
    max-width: 200px;
}

@media screen and (max-width: 600px) {
    .hero_nimg {
        text-align: center;
    }

    .handwave {
        display: none;
    }
}

.s2 {
    background-image: repeating-linear-gradient(45deg, var(--fallback-b1, oklch(var(--b1))), var(--fallback-b1, oklch(var(--b1))) 13px, var(--fallback-b2, oklch(var(--b2))) 13px, var(--fallback-b2, oklch(var(--b2))) 14px);
    background-size: 40px 40px;
}

.s2 .child_cont {
    padding-top: 48px;
    max-width: 1200px;
    margin: 0 auto;
}

i.fa {
    width: 16px;
}

.text-muted {
    color: var(--text-muted, #6c757d);
}

.proj {
    position: relative;
    border-radius: 6px;
    object-fit: none;
    cursor:POINTER;
    font-weight:BOLDER;
    width: 233px;height:133px;
}

.proj img {
    width: 100%;
    height: auto;
    border-radius: 6px;
    z-index: 1;
    transition: .3s all;
}

.proj .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 6px;
    background: grey;
    opacity: .88;
    z-index: 2;
    transition: .3s all;
}

.proj .title {
    z-index: 3;
    color: white;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.5rem;
    transition: .22s all;
}

.proj:hover .title {
    transition: .22s all;
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.5) ;
}
.proj:hover .overlay {
    transition: .3s all;
    opacity: 0;
}

.proj:hover img {
    transition: .3s all;
    transform: scale(1.05);
}


.divider.np {
    padding:0;
    margin:0;
    
}