*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

body{
    background:#fff;
}

/*================== TOP HEADER ==================*/

.top-header{

    background:#2d225c;
    height:45px;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:0 8%;

    
}

.head{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: #fff;
}

.top-left{

    display:flex;
}

.top-left a{

    color:#fff;
    text-decoration:none;

    padding:13px 22px;

    border-right:1px solid rgba(255,255,255,.25);

    font-size:14px;
    font-weight:500;

    transition:.3s;
}

.top-left a:first-child{

    border-left:1px solid rgba(255,255,255,.25);

}

.top-left a i{

    color:#ff1f6b;
    margin-right:8px;

}

.top-left a:hover{

    background:#4b3b88;

}

.top-right{

    display:flex;
    gap:6px;

}

.top-right a{

    width:40px;
    height:40px;

    display:flex;
    justify-content:center;
    align-items:center;

    color:#fff;
    text-decoration:none;

    border-radius:3px;

    transition:.3s;

}

.top-right a:nth-child(1){

    background:#3b5998;

}

.top-right a:nth-child(2){

    background:#d62976;

}

.top-right a:nth-child(3){

    background:#ff0000;

}

.top-right a:nth-child(4){

    background:#000;

}

.top-right a:hover{

    transform:translateY(-3px);

}

/*================ NAVBAR =================*/

header{

    background:#fff;
    box-shadow:0 2px 15px rgba(0,0,0,.08);

}

.navbar{

    width:85%;
    margin:auto;

    display:flex;
    justify-content:space-between;
    align-items:center;

}

.logo img{

    height:90px;

}

nav ul{

    display:flex;
    list-style:none;

}

nav ul li{

    margin-left:40px;

}

nav ul li a{

    color:#0c2340;

    text-decoration:none;

    font-weight:700;

    font-size:17px;

    position:relative;

}

nav ul li a::after{

    content:"";

    position:absolute;

    width:0;

    height:3px;

    left:0;

    bottom:-8px;

    background:#ff1f6b;

    transition:.4s;

}

nav ul li a:hover::after{

    width:100%;

}