/*==================================================
TOP BAR
==================================================*/

.topbar{

    width:100%;

    background:#111827;

    color:#fff;

    font-size:13px;

    height:42px;

    display:flex;

    align-items:center;

}

.topbar-content{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.topbar-left,
.topbar-center,
.topbar-right{

    display:flex;

    align-items:center;

    gap:25px;

}

.topbar-item{

    display:flex;

    align-items:center;

    gap:8px;

    color:#fff;

    transition:.3s;

}

.topbar-item i{

    color:var(--primary);

    font-size:14px;

}

.topbar-item:hover{

    opacity:.8;

}

.social-icons{

    display:flex;

    gap:12px;

}

.social-icons a{

    width:30px;

    height:30px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    transition:.3s;

}

.social-icons a:hover{

    background:var(--primary);

    transform:translateY(-2px);

}

.social-icons i{

    color:#fff;

}