underline

asd

HTML

<html>
    <head>  
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="css/home.css">
    </head>
    <body>
        <div class="div1">
            <header>
                <img src="images/viennalogo.png" class="logo1">
                <a href="#" class="htext"><p>HOME</p></a>
                <a href="#" class="htext"><p>BRANDS WE WORK WITH</p></a>
                <a href="#" class="htext"><p>BRAND GALLERY</p></a>
                <a href="#" class="htext"><p>NEWS</p></a>
                <a href="#" class="htext"><p>ABOUT US</p></a>
                <a href="#" class="htext"><p>CONTACT</p></a>
                <a href="#" class="logo2"><img src="images/Facebook.png"></a>
                <a href="#" class="logo2"><img src="images/Instagram.png"></a>
                <a href="#" class="logo2"><img src="images/Twitter.png"></a>
            </header>
            </div>
        </body>
    </body>
</html>

CSS

body{
    background: rgb(14, 13, 13);
    color: white;
    width: 100%;
}
header{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    background: linear-gradient(to top, rgba(0, 0, 0, 0), rgb(0, 0, 0, 0.8));
}

a {
    text-decoration: none;
    color: inherit;
}
p{
    color: white;
}



.div1{
    background-image: url(../images/Group\ 10.png);
}
.htext{
    margin-right: 3%;
    font-size: 0.75vw;
    transition: text-decoration 0.3s;
}
.htext:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #54B3A1;
    transform-origin: center;
    transition: transform 0.25s ease-out;
    margin-bottom: -20px;
  }
.htext:after:hover {
    transform: scaleX(1);
    transform-origin: center;
}

.logo1{
    margin-right: 10%;
    height: 7%;
    width: 8%;
}

.logo2{
    margin-right: 1.5%;
}