@font-face {
    font-family: "RacingSansOne";
    src: url('../assets/RacingSansOne.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html,body{
    overflow-x:hidden;
}

.font-racing {
    font-family: "RacingSansOne", sans-serif;
}

.text-stroke-standard {
    -webkit-text-stroke-width: 10px;
    -webkit-text-stroke-color: #2E2D2B; /* Stroke color */
    text-stroke-width: 10px;
    text-stroke-color: #2E2D2B;
    paint-order: stroke fill;
}

.text-stroke-mini {
    -webkit-text-stroke-width: 6px;
    -webkit-text-stroke-color: #2E2D2B; /* Stroke color */
    text-stroke-width: 6px;
    text-stroke-color: #2E2D2B;
    paint-order: stroke fill;
}

.comic-shadow {
    box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
    -webkit-box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
    -moz-box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
}

.hover-comic-shadow {
    box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
    -webkit-box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
    -moz-box-shadow: 12px 25px 0px 5px rgba(46,45,43,1);
    transition: box-shadow 0.2s ease-in-out;
}

.hover-comic-shadow:hover {
    box-shadow: 18px 30px 0px 5px rgba(46,45,43,1);
    -webkit-box-shadow: 18px 30px 0px 5px rgba(46,45,43,1);
    -moz-box-shadow: 18px 30px 0px 5px rgba(46,45,43,1);
    transition: box-shadow 0.2s ease-in-out;
}

.bg-main {
    background-image: url('/assets/bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.bg-main::before {
    content: "";
    position: absolute;
    inset: 0;
    background: #006E7C;
    opacity: 0.6; /* adjust strength of overlay */
    z-index: 1;
}

.bg-main > * {
    position: relative;
    z-index: 2;
}