*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: Arial;
}

/* .header{
/* width: 1080px; */
/* height: 25vh;
}*/

.top-nav{
width: 100%;
background-color:#000;
height:10%;
}
.top-nav p{
color: #fff;
text-align: center;
}
.navbar{
width: 100%;
 height: 20vh;
background-color:rgb(196, 62, 84);
display: flex;
justify-content: space-evenly;
align-items: center;
}
h2{
color: #fff;
}
.navbar a{
text-decoration: none;
color: #000;
}
.navbar button{
padding:  5px  15px;
border-radius: 25px;
border: none;
cursor: pointer;
}
#hero-section{
width: 100%;
height: 50vh;
}

.flex{
display: flex;
height: 100%;
}
.fourty{
background: url(../images/oladimeji-odunsi-e-TuK4z2LhY-unsplash.jpg);
background-size: cover;
flex-basis: 40%;
background-position: center;
}
.sixty{
flex-basis: 60%;
background: rgb(204, 151, 52);
}
.sixty h4{
text-align: center;
color:whitesmoke;
margin-top: 18%;
}
.sixty button{
display: block;
margin: 0 auto;
margin-top: 2%;
text-align: center;
border-radius: 10px;
background: black;
color: #fff;
border: none;
width: 180px;
height: 50px;
cursor: pointer;
}

#middle-section{
width: 100%;
height: 70vh;
}
.trader{
background: url(../images/joshua-hanson-I49bIyEHaIs-unsplash.jpg);
background-size: cover;
 background-position: center;
 height:100%;
 position: relative;
}
.absolute{
position: absolute;
left: 0;
top: 0;
height: 60%;
width: 40%;
background:rgb(196, 62, 84);
}

 .absolute h3{
color: #fff;
/* margin-right:5%; */
/* margin-left: 5%; */
text-align: center;
margin-top:10%;
line-height: 2;
 }

footer{
width: 100%;
height: 15vh;
background-color: rgb(204, 151, 52);
    /*margin-top: 360px;*/ /*Negative margin to overlap with the trader section */
}
.socials{
display: flex;
justify-content: center;
align-items: center;
}
.socials img, 
.socials .link{
display:  block;
margin-top: 3%;
margin-left: 50px;
}





@media(max-width:600px){
    #hero-section{
    height: 100vh;
    }
.flex{
display:flex;
flex-direction: column;
}

.socials img{
margin-top: 40px;
}
/* .socials img, .socials .link{
} */
.absolute h3{
margin: 0;
line-height: 1.5;
}

.sixty button{
margin-top: 7%;
}

}