1.visibility:hidden and 2.display:none sounds quite same yet with a huge designing difference.
visibility:hidden causes only the element not to be displayed but the place for that element will remain blank i.e. unoccupied
display:none causes not only the element not to be displayed but also appear s.t. the element doesn’t even exist i.e. no place will remain blank for the element.