@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;1,300&family=Open+Sans:wght@800&family=Work+Sans:wght@400;500;600;700;800&display=swap');

*{
    box-sizing: border-box;
}
.body{
    font-family: 'Lato', sans-serif;

}
.navbar{
    background-color:#9376e0;
}
.nav-container{
    min-height: 50px;
    max-width: 1400px;
    margin:0 auto;
    min-height: 50px;
    display: flex;
    align-items: center;

}

.nav-items-container{
 display: flex;
 align-items: center;
 justify-content:space-between;
 gap: 5px;
 width: 50%;


}
.nav-items-container a {
    text-decoration: none;
    font-size: 25px;
    color: white;

}
.logo-container{
 display: flex;
 width: 50%;
}
.logo-image{
width:50px;
object-fit: cover;
margin-right: 20px;
}
.logo-title{
font-size:30px;
width: 200px;
}
.hive-section{
    color:chocolate
}
.nav-items-container .login-btn{
    background-color: chocolate;
    color: black;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 700px;
    font-size: 20px;
}


/* banner section */
.banner-section{
  border: 1px solid red ;
    margin: 50px auto 0 ;
    max-width:1400px;
    margin: 0 auto;
    display: flex;

}
.banner-text{
width: 50%;
}
.banner-title{
  background-image: linear-gradient(to bottom ,#9376e0,#e893cf);
  color: transparent;
  -webkit-background-clip: text;
  font-size: 50px;

}
.banner-des{
    font-size: 45px;
    font-style: italic;

}
.banner-img{
width: 50%;
}
.banner-img img {
    width: 100%;
    height: auto;
}



@media screen and (max-width:576px)
 {
    .nav-container ,.nav-items-container{
        flex-direction: column;
    }
    .nav-items-container{
        margin-top: 20px;
        width: 100%;
    }
    
    .nav-items-container .login-btn{
        width:100%;
        text-align: center;
        margin-bottom: 10px;
    }
}