@font-face {
    font-family: mobbin;
    src: url(/fonts/mobbin.woff2);
    font-display: swap;
}

:root {
    --putih:#fff;
    --hitam:#000;
    --silver:#F0F0F0;

    --hitam2:#161A13;
    --hijau:#86DB6B;

    --unguBanget: #9e13c5;
    --ungu:#ECE6ED;
    --ungu2:#9D80A3;
    --bgUngu: #FFFDFC;



    --tinggiHeader: 1rem;
}
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
*:focus {
    outline: none;
}
body {
    font-family: mobbin;
    color: var(--hitam);
    width: 100%;
    height: 100%;
    background-color: var(--putih);

    font-size: .8rem;
}
html {    
    scroll-behavior: smooth;
}
a {
    text-decoration: none;
    color: inherit;
    -webkit-tap-highlight-color:transparent;
}


/* css tambahan */
.tombol {
    cursor: pointer;
    -webkit-tap-highlight-color:transparent;
}

@keyframes efekMasuk {
    from {
        opacity: 0;
        transform: translateY(1rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes efekMasuk2 {
    from {
        opacity: 0;
        transform: translateY(-2rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes efekMasuk3 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.muncul {
    animation: efekMasuk 0.5s ease-out forwards;
}
.muncul2 {
    animation: efekMasuk2 0.6s ease-out forwards;
}
.muncul3 {
    animation: efekMasuk3 0.4s ease-out forwards;
}


/* batas */


.content {
    height: max-content;
    min-height: 100vh;
    width: 100%;
}