@font-face {
    font-family: 'Averta-Regular';
    src: url("../font/Averta/Averta-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Averta-Light';
    src: url("../font/Averta/Averta-Light.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Averta-Semibold';
    src: url("../font/Averta/Averta-Semibold.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}

body {
    display: flex;
    justify-content: center;
    height: 100vh;
    font-family: "Averta-Regular";
    background-color: #2F2B3F;

}

.container {
    background-color: #2F2B3F;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    position: relative;
    overflow: hidden;
}

button:focus {
    outline: none !important;
}

.color-white {
    color: white !important;
}

.color-red {
    color: #eb4034 !important;
}

.color-green {
    color: #2ecc71 !important;
}

.color-black {
    color: #17202a !important;
}

.color-orange {
    color: #E59866 !important;
}

.color-purple {
    color: #E8DAEF !important;
}

.color-blue {
    color: #36b2eb !important;
}

.color-yellow {
    color: #e8e816 !important;
}

.color-pink {
    color: #D76C82 !important;
}

.color-gray-light {
    color: #E4E0E1 !important;
}
.color-gray-neutral{
    color: #B4B4B8 !important;
}
.color-brown {
    color: #F1948A !important;
}
.color-gray {
    color: #ABB2B9 !important;
}










.bg-green {
    /* available: #36e804; */
    background-color: #2ecc71;
}

.bg-orange {
    background-color: #E59866;
}

.bg-gray {
    background-color: #ABB2B9;
}

.bg-red { 
    /* process: #eb4034 */
    background-color: #eb4034; 
}

.bg-yellow {
    background-color: #f1c40f;
}

.bg-black {
    background-color: #17202a;
}

.bg-pink {
    background-color: #D76C82;
}

.bg-blue {
    background-color: #3498db;
}

.bg-purple {
    background-color: #E8DAEF;
}

.bg-brown {
    background-color: #F1948A;
}


.cursor-default {
    cursor: default;
}