You need to make the below mentioned changes in your css.
1st: change the width in percentage(%) for each
.navbar li {
height: auto;
width: 15%;
float: left;
text-align: center;
list-style: none;
font: normal bold 12px/1.2em Arial, Verdana, Helvetica;
padding: 0;
margin: 0;
background-color: #366b82;
}
change the width of .wrapper2 in percentage(%)
.wrapper2 {
background: #fff;
min-width: 80%;
width: 80%;
margin: 0 auto;
min-height: 800px;
}
and then (the big problem) remove the position: absolute for .navbar
.navbar {
height: 50px;
padding: 15px;
margin: 0;
border-right: 1px solid #54879d;
margin-left: 55px;
padding-left:15px;
padding-bottom:15px;
padding-top:0px;
margin-left:25px;
}