@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
    font-family: "gudetama";
    src: url("../fonts/gudetama.ttf") format("truetype");
    font-weight: normal;
}

body {
    background: #F9980D;
    color: #fff;
    font-family: "gudetama";
    overflow-x: hidden;
}
.btn-primary {
    padding: .375rem .75rem;
    background: #fff;
    box-shadow: 4px 4px 0 #E27F0E;
    color: #F9980D;
    line-height: 1;
    font-size: 1.75rem;
    border-radius: .5rem;
    transition: all ease .2s;
}
.btn-primary:active {
    transform: scale(.97);
    opacity: .85;
    transition: all ease .2s;
}
.large-shadow {
    text-shadow: 6px 6px 0 #E27F0E;
}
.medium-shadow {
    box-shadow: 4px 4px 0 #E27F0E;
}
::-webkit-scrollbar {
    width: 8px;
}
.floating-sm {
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, -0px); }
}
html {
    scroll-behavior: smooth;
}