html{
    background-image: linear-gradient(to top right, #120f1a 0%, #13215d 50%, #1f52b1 100%);
} 
body{
    background-image: none;
    background-color: transparent !important; 
}
#join-container{
    margin-top: 20px;
    display: flex;
    justify-content: center;
}
.tab-content{
    min-width: 283px;
    width: 380px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid #fff;
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(230, 226, 226, 0.4);
}
.tab-link{
    color: #fff;
    border-radius:8px 8px 0 0;
}
.tab-link:hover{
    color: #fff;
}
.nav-tabs{
    border:none;
}
.nav-item{
    text-align: center;
    min-width: 140px;
}
.nav-link{
    color: #fff;
    text-decoration: none;
}
.nav-link.active{
    background-color: transparent !important;
    color: #fff !important;
    cursor: default;
    border:none;
}
.nav-link:not(.active){
    background-color: #fff !important;
    color: #13215d !important;
}
.nav-link:not(.active):hover{
    color: #fff !important;
    text-decoration: none;
    background-color: rgb(7, 63, 175) !important;
}
#connect-tabs{
    color:#fff;
    padding: 25px;
}
.tab-connect.active{
    display: block;
}
.tab-connect:not(.active){
    display: none;
}
.btn-primary{
    margin-top: 10px;
    width: 100%;
    background-color: rgb(7, 63, 175);
    border:1px solid rgb(7, 63, 175);
}
.btn-primary:hover{
    border:1px solid #fff;
}