/* NAVBAR */

.navbar{

    width:100%;

    height:75px;

    background:white;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 40px;

    position:fixed;

    top:0;

    left:0;

    box-shadow:0 5px 15px rgba(0,0,0,.08);

}

/* LOGO AREA */

.logo-area{

    display:flex;

    align-items:center;

    gap:15px;

}

/* LOGO */

.logo{

    width:55px;

    height:55px;

    background:#166534;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:26px;

    color:white;

}

/* WEBSITE NAME */

.title h2{

    color:#166534;

    font-family:'Poppins',sans-serif;

}

.title p{

    color:gray;

    font-size:13px;

}

/* SEARCH */

.search-box{

    width:40%;

}

.search-box input{

    width:100%;

    padding:12px;

    border-radius:30px;

    border:2px solid #DCFCE7;

    outline:none;

}

/* RIGHT SIDE */

.nav-right{

    display:flex;

    align-items:center;

    gap:20px;

}

/* BUTTON */

.theme-btn{

    width:45px;

    height:45px;

    border:none;

    border-radius:50%;

    background:#DCFCE7;

    font-size:18px;

    cursor:pointer;

}

/* PROGRESS */

.progress{

    width:50px;

    height:50px;

    background:#166534;

    color:white;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-weight:bold;

}