@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@300;400;500;600&display=swap');



html,
body {
    margin: 0;
    padding: 0;
    font-family: 'Source Code Pro', monospace !important;

}

canvas {
    display: block;
}

#canvas,
div {
    overflow: hidden;

}

.card-side {
    position: fixed;
    z-index: 9999;
    bottom: 0rem;
    right: 0rem;
    top: auto;
    height: 100vh;
    width: 50vw;

    box-shadow: 20px 20px 20px rgba(0, 0, 0, 0.1) !important;

}

.card-end {
    position: fixed;
    z-index: 9999;
    bottom: 0rem;
    left: 0rem;
    top: auto;
    height: 100vh;
    width: 50vw;
    backdrop-filter: blur(20px);
    opacity: 0.82;

}

.card-suc {
    position: fixed;
    z-index: 9999;
    bottom: 0rem;
    left: 0rem;
    top: auto;
    height: 100vh;
    width: 50vw;
    backdrop-filter: blur(20px);
    opacity: 0.82;
}

.btn {
    box-shadow: none !important;
    border-radius: 50px !important;
    border: none !important;
}

.btn:hover {
    transform: scale(1.01);
}

.btn:focus {

    animation: 1s rubberBand linear;
}

.btnb:active {

    animation: 1s rubberBand linear;
}

.btn-primary {
    background-color: #E27396 !important;
    color: #ffffff !important;
}

.btn-secondary {
    background-color: #F9F6F2 !important;
    color: #E27396 !important;
}

h3 {
    font-weight: 300 !important;

}

.bb {
    font-weight: 500 !important;
    color: #E27396;
}

.go {
    padding-top: 20vw;

}

.goa {
    animation: 1s rubberBand linear;
}