index.css

body {
    margin: 0;
}
#navBar{
    display:flex;
    justify-content:center;
    align-items:center;
    border:1px solid #C6C6C6;
    height: 60px;
    font-size:18px;
}
#logo{
    display:flex;
    align-items:center;
    width: 20%;
    height: 50px;
    margin-left: 20px;

}
#logo img{
    width:50%;
    height:100%;
    margin-left:30px;
}
#center{
    width: 60%;
    border:1px solid #C6C6C6;
    margin: 0 10px;
}
#search {
    width:100%;
    height:60%;
}
#search input{
    width:92%;
    height:30px;
    border:none;
    border-right: 1px solid #C6C6C6;
    letter-spacing:1px;
    padding-left:10px;

}

#search span{
    width:10%;
    padding-left: 10px;
}
#end{
    width:20%;
    display:flex;
    justify-content:space-evenly;
    align-items:center;
}#videodiv{
    margin-top: 50px;
}.mons{
    width: 450px;
    height:  300px;
    margin: 20px;
}
@media screen and (max-width: 620px) {
   #end i,#logo i{
       display: none;
   }#end i:nth-child(5){
       display: block;
   }
   #logo img{
        width: 100%;
        margin: 0;
   }#center{
       margin-left: 30px;
   }#search input{
       width: 70%;
   }#navbar{
       border-right: none;
   }.mons{
       width: 310px;
       height: 200px;
   }
  }