@font-face {
    font-family: 'gothamextra_light_italic';
    src: url(assets/fonts/78123b0660819373.woff2) format('woff2'),
         url(assets/fonts/3390e2b1e2a10ad8.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamextra_light';
    src: url(assets/fonts/2271bba7dd1ae350.woff2) format('woff2'),
         url(assets/fonts/b8100ac104da3037.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamultra_italic';
    src: url(assets/fonts/ac7a3085a60c3552.woff2) format('woff2'),
         url(assets/fonts/f5e6d3815d674197.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamultra';
    src: url(assets/fonts/cc9e5b10b38eac05.woff2) format('woff2'),
         url(assets/fonts/39cdf2a09bb18f0a.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothammedium_italic';
    src: url(assets/fonts/167fd764bc5a014e.woff2) format('woff2'),
         url(assets/fonts/550a74eb435f8914.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothammedium';
    src: url(assets/fonts/ec8475db48b67c1c.woff2) format('woff2'),
         url(assets/fonts/95ecaa9b12a5aed9.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamlight_italic';
    src: url(assets/fonts/ac3b48ae39ff5fdb.woff2) format('woff2'),
         url(assets/fonts/e90a7e07b6ea1d26.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamlight';
    src: url(assets/fonts/3d7b2676ed367fb0.woff2) format('woff2'),
         url(assets/fonts/4893fa28705a6c6a.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothambook_italic';
    src: url(assets/fonts/1a747035a684270a.woff2) format('woff2'),
         url(assets/fonts/c5d84ccdecac5144.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothambook';
    src: url(assets/fonts/105821d2d4eeb6e9.woff2) format('woff2'),
         url(assets/fonts/a816f7157752c015.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamblack_italic';
    src: url(assets/fonts/bb3f150123961ad8.woff2) format('woff2'),
         url(assets/fonts/a7f6574b4f9031ba.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gothamblack';
    src: url(assets/fonts/aaf9cd502f87dc23.woff2) format('woff2'),
         url(assets/fonts/b3241cf498944817.woff) format('woff');
    font-weight: normal;
    font-style: normal;

}

html{
    cursor: none;
}


body{
    background-color: #252830;
    margin: 0;
    height: 100%; 
    width: 100%;
    overflow: hidden;

}

body :-webkit-scrollbar {
    display: none;
  }

.webgl{
    width: auto;
    height: auto;
}

.loader{
    /* display: none; */
    user-select: none;
    display: flex;
    flex-direction: row;
    row-gap: 1em;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 999;
    background-color: black;
    text-align: center;
    
}

.loader-text{
    margin-right: 1em;
    font-family: 'gothamlight', Arial, sans-serif;
    font-size: 1.5em;
    color:white;
}

.ks-text{
    font-family: 'gothammedium', Arial, sans-serif;
    color: #ed2424;
}

.load-bar{
    
    width:31em;
    height: 1.3%;
    border-width: 0.1em;
    border-top-style: solid;
    border-top-color: #ed2424;
    background-color: transparent;
    margin-top: 0.5%;
    animation: loadbar 4s cubic-bezier(0.68, 0.16, 0.44, 0.93) forwards;
    transform-origin: 0% 50%;
    
}

.controls{
    flex-direction: row;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-top: 1.5em;
    width: 100%;
    height: 1.5em;
    color: white;
    font-family: 'gothamblack';
    font-size: 1em;
    position: absolute;
    display: flex;
    z-index: 100;
    
}
.controls-icon{
    flex-direction: row;
    text-align: center;
    justify-content: center;
    align-items: center;
    width: 1.5em;
    height: 1.5em;
    border-style: solid;
    border-radius: 2px;
    border-width: 2px;
    border-color: #ed2424;
    margin: 5px;
}
.controls-text{
    font-family: 'gothamlight';
}
.assemble{
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
}
.assemble-icon{
    display: flex;
    flex-direction: row;
    text-align: center;
    justify-content: center;
    align-items: center;
    width: 1.5em;
    height: 1.5em;
    border-style: solid;
    border-radius: 2px;
    border-width: 2px;
    border-color: #ed2424;
    margin-left: 1em;
    margin-right: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.assemble-text{
    display: flex;
    flex-direction: row;
    text-align: center;
    align-items: center; 
    justify-content: center;
    font-family: 'gothamlight';
}




.button-loadDiv{
    opacity: 0;
    animation: button 1s forwards ; 
    animation-delay: 4.1s;
}
.button-load{
    
    margin-left: 1.5em;
    cursor: none;
    width: 8em;
    height: 3em;
    font-size: 1em;
    border-radius: 999px;
    font-family: 'gothamblack', Arial, sans-serif;
    color: white;
    background-color: transparent;
    outline: #ed2424;
    outline-style: solid;
    outline-offset: -3px;
    outline-width: 2px;
}
.button-load:hover{
    font-family: 'gothamultra', Arial, sans-serif;
    transform: translateY(-2px);
    background-color: #ed2424;

}

@keyframes button {
    0%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}

@keyframes loadbar {
    0% {
        transform:scaleX(0);
        /* transform:scaleY(1) */
    }

    100% {
        transform:scaleX(1);
        /* transform:scaleY(1) */
    }
}

.dotSpan{
    color: white;
    /* animation: hide 1s forwards; */
    animation-delay: 4.9s;
}
.dot1 {
    opacity: 0;
    -webkit-animation: dot 1.3s infinite;
    -webkit-animation-delay: 0.0s;
    animation: dot 1.3s infinite;
    animation-delay: 0.0s;
}

.dot2 {
    opacity: 0;
    -webkit-animation: dot 1.3s infinite;
    -webkit-animation-delay: 0.2s;
    animation: dot 1.3s infinite;
    animation-delay: 0.2s;
}

.dot3 {
    opacity: 0;
    -webkit-animation: dot 1.3s infinite;
    -webkit-animation-delay: 0.3s;
    animation: dot 1.3s infinite;
    animation-delay: 0.3s;
}
@keyframes hide {
   0%{opacity: 1} 

   100%{
    opacity: 0;
    } 
}


@-webkit-keyframes dot {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes dot {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}








.buttons{
    display: none;
    background-color: white;
    position: absolute;
}

.button{
    margin:1%;
    padding-left: 10px;
    padding-right: 10px;
    font-family: 'Helvetica', 'Arial', sans-serif;
    white-space: nowrap;
    font-weight:700;
    color:rgba(255, 255, 255, 0.858);
    width: auto;
    height: 30px;
    background-color: rgb(116, 122, 133);
    z-index: 9;
    border-radius: 2px;
    border-width: 0px;
    transition: box-shadow 0.15s ease-in-out 50ms;
    
}

.button:hover {
    cursor: pointer;
    box-shadow: 1px 1px 3px rgba(81, 87, 97, 0.858);
}

.cursorDivClass{
    /* display: none; */
    border-width: 2px;
    border-style: solid;
    border-color: white;
    user-select: none;
    pointer-events: none;
    cursor: pointer;
    border-radius: 888px;
    overflow: hidden;
    position: absolute;
    width: 15px;
    height: 15px;
    background-color: transparent;
    z-index: 5000;
}

.toolTip{
    position: absolute;
    visibility: hidden;
    z-index: 10;
    width: 180px;
    height: 200px;
    border-radius: 3px;
    backdrop-filter: blur(10px);
    background-color: #41455189;
    color: white;
    font-family: Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    animation: show;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-delay: 2s;
}
@keyframes show {
    from {visibility: hidden;}
    to {visibility: visible;}
}
.toolTipHidden{
    backdrop-filter: blur(10px);
    position: absolute;
    visibility: hidden !important;
    z-index: 10;
    width: 180px;
    height: 200px;
    border-radius: 3px;
    background-color: #41455189;
    color: white;
    font-family: Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
}


.font{
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    color: #4b92f9;
    font-size: 12px;
    user-select: none;
}
.font1{
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    color: #4b92f9;
    font-size: 12px;
    user-select: none;
}
.font2{
    font-family: Helvetica, sans-serif;
    font-weight: normal;
    color: #e36464;
    font-size: 10px;
    user-select: none;
}
.font3{
    font-family: Helvetica, sans-serif;
    font-weight: normal;
    color: #71e958;
    font-size: 10px; 
    user-select: none;
}

.lottie{
    position: absolute;
    z-index: 15;
    margin-left: -180px;
    pointer-events: none;
    width: auto;
    height: auto;
    background-color: transparent;
}

.txtDiv{
    user-select: none;
    display: flex;
    flex-direction: column;
    background-color: transparent;
    font-family: 'gothambold', sans-serif;
    word-wrap: break-word;
    font-weight: bold;
    font-size: 3vw;
    top: 25%;
    left:60vw;
    color: white;
    width: 25vw;
    height: auto;
    z-index: 50;
    position: absolute;
}
.desDiv{
    white-space: pre-wrap;
    user-select: none;
    font-family: 'gothamregular', sans-serif;
    margin-top: 0.9vw;
    position: relative;
    color: white;
    width: auto;
    height: auto;
    font-size: 1vw;
    font-weight:100;
    line-height: 1.5vw;
    z-index: 55;
    text-align: justify;
    display: flex;
    flex-direction: column;
}
.but1Div{
    position: relative;
    margin-top: 1.4vw;
    width: 9vw;
    height: 2.7vw;
    left: 0%;
    z-index: 60;
    color: white;
    font-family: 'gothambold', sans-serif;
    font-size: 0.9vw;
    font-weight: bold;
    border-radius: 500px;
    border-width: 2px;
    border-style: solid;
    border-color: #ed2424;
    background-color: transparent;
}
.but1Div:hover{
    font-family: 'gothamblack', sans-serif;
    color: white;
    background-color: #ed2424;
    border-width: 2px;
    z-index: 65;
    cursor: none;
    transform: translateY(-2px);
}
.inputDiv{
    display: none;
    background-color: transparent;
    position: absolute;
    width: auto;
    height: auto;
    top: 150px;
    left: 50px;
    z-index: 70;

}
.inputX{
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    color: white;
    text-indent: 6px;
    outline: none;
    border:none;
    border-radius: 2px;
    align-items:center;
    position: relative;
    display: flex;
    justify-content: center;
    width: 50px;
    height: 25px;
    background-color: #252830;
}
.inputY{
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    color: white;
    text-indent: 6px;
    border-radius: 2px;
    align-items:center;
    position: relative;
    display: flex;
    border:none;
    outline: none;
    justify-content: center;
    width: 50px;
    height: 25px;
    margin-bottom: 5px; 
    margin-top: 5px;
    background-color: #252830;
}
.inputZ{
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    color: white;
    text-indent: 6px;
    border:none;
    outline: none;
    border-radius: 2px;
    align-items:center;
    position: relative;
    display: flex;
    justify-content: center;
    width: 50px;
    height: 25px;
    background-color: #252830;
}



/*# sourceMappingURL=main.css.map*/