/* Basic */

::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(150, 60, 210);
}

::-moz-scrollbar {
    width: 4px;
    height: 4px;
}

::-moz-scrollbar-thumb {
    background-color: rgba(150, 60, 210);
}

::-ms-scrollbar {
    width: 4px;
    height: 4px;
}

::-ms-scrollbar-thumb {
    background-color: rgba(150, 60, 210);
}

.theme-1-bg {
    background: #f7edf7;
}

.theme-2-bg {
    background: #c3b5cb;
}

.glass-1 {
    background: rgba(255, 255, 255, 0);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.box-shadow {
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.gradient-1 {
    background: rgb(2, 0, 36);
    background: -moz-linear-gradient(45deg, rgba(2, 0, 36, 1) 0%, rgba(22, 9, 121, 1) 35%, rgba(62, 26, 147, 1) 75%, rgba(37, 24, 87, 1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(2, 0, 36, 1) 0%, rgba(22, 9, 121, 1) 35%, rgba(62, 26, 147, 1) 75%, rgba(37, 24, 87, 1) 100%);
    background: linear-gradient(45deg, rgba(2, 0, 36, 1) 0%, rgba(22, 9, 121, 1) 35%, rgba(62, 26, 147, 1) 75%, rgba(37, 24, 87, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#020024", endColorstr="#251857", GradientType=1);
}

.btn {
    transition: 0.5s ease;
}

.button-1:hover {
    background-color: white;
    color: rgba(0, 0, 0, 0.9) !important;
}

.button-2 {
    background-color: rgba(150, 60, 210);
    color: white;
}


.button-2:hover {
    background-color: rgb(104, 32, 152);
    color: white;
}

.button-3 {
    border-color: rgb(104, 32, 152) !important;
    color: rgb(104, 32, 152) !important;
}

.button-3:hover {
    background-color: rgb(104, 32, 152);
    color: rgba(255, 255, 255, 0.9) !important;
}

.theme-1-text {
    color: rgb(104, 32, 152);
}

.theme-1-link {
    transition: 0.5s ease;
    color: rgb(104, 32, 152);
}

.theme-1-link:hover {
    color: rgb(51, 22, 71);
}

.theme-1-border-top {
    border-top: solid 5px rgb(104, 32, 152);
}

.theme-1-input {
    background-color: #f7edf7;
    border-radius: 0;
    border: none;
    border-bottom: solid 5px rgb(104, 32, 152);
}

.theme-1-input:focus {
    background-color: #eed7ee;
    border-bottom: solid 5px rgb(62, 22, 88);
    box-shadow: 0 4px 30px rgb(104, 32, 152, 0.1);
}

.varela-round-regular {
    font-family: "Varela Round", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.theme-1-success {
    padding: 10px;
    background-color: rgb(50, 184, 95);
    border-radius: 0;
    border-left: solid 10px rgb(0, 110, 68);
}

.theme-1-error {
    padding: 10px;
    background-color: rgb(184, 50, 50);
    border-radius: 0;
    border-left: solid 10px rgb(110, 0, 0);
}

@media (max-width: 768px) {
    .navbar-collapse {
        background: rgba(255, 255, 255, 0);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-radius: 16px;
    }
}

.social-link {
    color: rgba(150, 60, 210);
}

.social-link:hover {
    color: rgb(104, 32, 152);
}

/* Hero */

.hero {
    width: 100%;
    height: 100vh;
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    40% {
        opacity: 1;
    }

    60% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.input-cursor {
    width: 4px;
    height: 42px;
    animation: blink .6s linear infinite alternate;
}