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

#container{

    width: 100%;
    margin: auto;

}
#logo{
    margin-right: 20px;
}
#sidebar{
    margin: 10px;
   
height:45px;
display: flex;


}


#sidebar div{
    text-align: center;
    vertical-align: middle;
/* border:1px solid black; */
margin-left: 20px;
}


.com{
   margin-left: 20px;
   text-align: center;
   line-height: 45px;
   vertical-align: middle;
}

#search{
    border-radius: 12px;
    width: 640px;

}

#unsplash-bar{

    height:530px;
    
    margin: auto;
    width: 90%;

    background-image: url(https://images.unsplash.com/photo-1646282014691-620f9af448a8?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1vZi10aGUtZGF5fHx8fGVufDB8fHx8&dpr=1&auto=format%2Ccompress&fit=crop&w=799&h=594);
    background-repeat:no-repeat;
    background-size: cover;
}
#unsplash-bar div{
    line-height: 500px;
    vertical-align:middle;
    text-align: left;
    color:white;
    font-size: 36px;
    margin-left: 170px;
}
#searchbar{
    line-height: 500px;
    vertical-align: middle;
}
#main{
    /* border:4px solid blue; */
display: grid;
grid-template-columns: repeat(3,30%);
gap:40px;


;
}
img:hover{
    opacity: 0.8;

    transition: opacity .75s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .55s ease-in-out;
  

}