@import url('https://fonts.cdnfonts.com/css/svn-gilroy?styles=55332,55331');
/* @import url('https://db.onlinewebfonts.com/c/88b96d4bbbd5526e485ca727c48da139?family=Arame'); */
@import url('../font/Arame-Mono.otf');
@import url('../font/AGENCYB.TTF');
@import url('../font/PuristaTRIAL-BoldItalic.otf');

*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    height: 100vh;
    overflow: hidden;
    font-family: var(--ff-header);
    user-select: none;
    color: var(--color-white);
}

.dev-mode {
    background: url(../img/main/_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100vh;
}

#root {
    height: 100%;
}

input {
    border: none;
    outline: none;
    background-color: transparent;
}

@font-face {
    font-family: 'Purista Bold';
    src: url('../font/Purista/Purista-Bold.otf') format('opentype');
    font-weight: 700;
}

@font-face {
    font-family: 'Purista SemiBold';
    src: url('../font/Purista/Purista-SemiBold.ttf');
}

@font-face {
    font-family: 'Purista Medium';
    src: url('../font/Purista/Purista-Medium.ttf');
    font-weight: 500;
}

@font-face {
    font-family: 'Chat';
    src: url('https://ingame.corleonecity.de/utils/corleone/fonts/chalet.otf');
}

@font-face {
    font-family: 'Arame-Mono';
    /* Name muss mit der Variable übereinstimmen */
    src: url('../font/Arame-Mono.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Arame Mono';
    src:
        local('Arame Mono Bold'),
        local('ArameMono-Bold'),
        url('../font/ArameMono/ArameMono-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Arame Mono';
    src:
        local('Arame Mono Stencil'),
        local('ArameMono-Stencil'),
        url('../font/ArameMono/ArameMono-Stencil.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Arame Mono';
    src:
        local('Arame Mono'),
        local('ArameMono'),
        url('../font/ArameMono/ArameMono.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Arame Mono';
    src:
        local('Arame Mono Thin'),
        local('ArameMono-Thin'),
        url('../font/ArameMono/ArameMono-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'AgencyFB';
    /* Name muss mit der Variable übereinstimmen */
    src: url('../font/AGENCYB.TTF') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Purista';
    /* Name muss mit der Variable übereinstimmen */
    src: url('../font/PuristaTRIAL-BoldItalic.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

:root {
    --ff-header: 'SVN-Gilroy', sans-serif;
    --ff-highlight: 'Arame Mono', monospace;
    /* Name muss mit @font-face übereinstimmen */
    --ff-rageui: 'Chat';
    --ff-agency: 'AgencyFB', sans-serif;
    --ff-purista: 'Purista', sans-serif;
    --color-white: #ffffff;
    --text-stroke: #fff 0.015vh;
    --text-stroke-gray: rgba(255, 255, 255, 0.55) 0.015vh;
}

.mt-1 {
    margin-top: 1vh;
}

.react-draggable {
    cursor: grab !important;
}

.react-draggable-dragging {
    cursor: grabbing !important;
}