@import "tailwindcss";

@font-face {
    font-family: "Regular";
    src: url("../../fonts/Kanit/Kanit-Regular.ttf");
}

@font-face {
    font-family: "Light";
    src: url("../../fonts/Kanit/Kanit-Light.ttf");
}

@font-face {
    font-family: "Medium";
    src: url("../../fonts/Kanit/Kanit-Medium.ttf");
}

@font-face {
    font-family: "SemiBold";
    src: url("../../fonts/Kanit/Kanit-SemiBold.ttf");
}


@layer theme {
    :root{
        --banner-desktop-height: calc(100vw * 0.42) ;
        --banner-mobile-height: 760px;
        
        --font-regular: "Regular", "sans-serif";
        --font-light: "Light", "sans-serif";
        --font-medium : "Medium", "sans-serif";
        --font-semibold : "SemiBold", "sans-serif";

        --color-primary : #2FCAD3;
        --color-primary-dark : #10949C;
    }
}

.logo-navigation{
    height: 40px;
}

.font-regular {
    font-family: var(--font-regular);
}

.font-light {
    font-family: var(--font-light);
}

.font-medium{
    font-family: var(--font-medium);
}

.font-semibold{
    font-family: var(--font-semibold);
}