.navbar{

position:fixed;

top:20px;

left:50%;

transform:translateX(-50%);

width:80%;

display:flex;

justify-content:space-between;

align-items:center;

padding:18px 30px;

background:rgba(1, 6, 12, 0.55);

backdrop-filter:blur(15px);

border:1px solid rgba(13, 186, 229, 0.25);

border-radius:50px;

z-index:1000;

}

.navbar ul{

display:flex;

gap:35px;

list-style:none;

}

.navbar a{

color:white;

text-decoration:none;

transition:.3s;

}

.navbar a:hover{

color:#7EEFFF;

}

.button{

    display:inline-block;

    margin-top:20px;

    text-decoration:none;

    color:white;

    border:1px solid #7EEFFF;

    padding:12px 24px;

    border-radius:30px;

    transition:.3s;

}
.button:hover{

    background:#7EEFFF;

    color:black;

}

.logo {
    color: white;
}

.progress{

height:10px;

background:#333;

border-radius:20px;

overflow:hidden;

}

.fill{

width:70%;

height:100%;

background:#7EEFFF;

}




.button{

display:inline-block;

width:200px;

margin-left:35px;

text-align:center;

text-decoration:none;

color:white;

padding:14px;

border:1px solid #7EEFFF;

border-radius:40px;

transition:.3s;

}

.button:hover{

background:#7EEFFF;

color:#02111f;

transform:translateY(-3px);

box-shadow:0 0 20px #7EEFFF;

}