/* FONTE */
@font-face{
    font-family: nunito;
    src: Roboto, SHPBurmese, SHPKhmer, Helvetica Neue, Helvetica, Arial, 文泉驛正黑, WenQuanYi Zen Hei, Hiragino Sans GB, 儷黑 Pro, LiHei Pro, Heiti TC, 微軟正黑體, Microsoft JhengHei UI, Microsoft JhengHei, sans-serif;;
}
@font-face{
    src: url('./light.woff') format('woff');
    font-display: swap;
    font-family: 'light';
    font-style: normal;
}
@font-face{
    src: url('./regular.woff') format('woff');
    font-display: swap;
    font-family: 'regular';
    font-style: normal;
}
@font-face{
    src: url('./bold.woff') format('woff');
    font-display: swap;
    font-family: 'bold';
    font-style: normal;
}

/* RAIZ */
*{
    box-sizing: border-box !important;margin:0;letter-spacing: 0.02em;-webkit-tap-highlight-color:transparent;font-family:regular, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
html{
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}
body{
    margin:0;font-feature-settings: 'kern';display:flex;flex-flow:column;
}
main{
    display:flex;flex-flow:column;min-width:100%;max-width:100%;
}
/* TEMP */
img{
    max-width:100%;
}
video{
    max-width:100%;
}


.loading{
    display:none;flex-flow:column;position:fixed;top:0;left:0;background-color:#ffffff;z-index:16;
}
    .loading > div{
        display:flex;flex-flow:column;width:100vw;height:100vh;
    }
        .loading > div > div{
            display:flex;align-items:center;min-width:44px;max-width:82px;min-height:20px;max-height:20px;width:max-content;margin:auto;position:relative;
        }
            .loading > div > div > span{
                width:10px;height:10px;background-color:#ee4d2d;border-radius:5px;position:absolute;
            }
            .loading > div > div > span:nth-of-type(1){
                top:0;left:0;animation: anim 0.5s linear 0s infinite;
            }
            .loading > div > div > span:nth-of-type(2){
                top:0px;left:17px;animation: anim 0.5s linear 0.2s infinite;
            }
            .loading > div > div > span:nth-of-type(3){
                top:0;left:34px;animation: anim 0.5s linear 0.4s infinite;
            }
  
            @keyframes anim { 
                0% { top:0px; } 
                25% { top:2px; } 
                50% { top:4px; } 
                75% { top:2px; } 
                100% { top:0px; } 
            }