*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial;
    }
    
    body{
    background:#f5f5f5;
    }
    
    /* Navbar */
    
    .navbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:15px 60px;
    background:#111;
    color:white;
    }
    
    /* Logo */
    
    .logo{
    font-size:24px;
    font-weight:bold;
    cursor:pointer;
    transition:0.3s;
    }
    
    .logo:hover{
    color:#00c3ff;
    transform:scale(1.1);
    }
    
    /* Links */
    
    .nav-links{
    list-style:none;
    display:flex;
    gap:30px;
    }
    
    .nav-links a{
    text-decoration:none;
    color:white;
    font-size:16px;
    position:relative;
    transition:0.3s;
    }
    
    /* Hover Animation */
    
    .nav-links a::after{
    content:'';
    position:absolute;
    width:0%;
    height:2px;
    left:0;
    bottom:-5px;
    background:#00c3ff;
    transition:0.3s;
    }
    
    .nav-links a:hover::after{
    width:100%;
    }
    
    /* Buttons */
    
    .buttons button{
    padding:8px 18px;
    margin-left:10px;
    border:none;
    cursor:pointer;
    border-radius:5px;
    transition:0.3s;
    }
    
    /* Login Button */
    
    .login{
    background:transparent;
    color:white;
    border:1px solid #00c3ff;
    }
    
    .login:hover{
    background:#00c3ff;
    color:black;
    transform:translateY(-2px);
    }
    
    /* Signup Button */
    
    .signup{
    background:#00c3ff;
    color:black;
    }
    
    .signup:hover{
    background:#0099cc;
    transform:translateY(-2px);
    }