adjust hight of the slider | navigation bar |

To reduce Slider height, try:

#customizr-slider.carousel .item {
height:         224px;
min-height:     224px;
line-height:    224px;
}

changing 224px to your required size.
Credit: @acub

Reduce space between links:

.navbar .nav > li > a, .navbar .nav > li > a:first-letter,
.navbar .nav > li.current-menu-item > a,
.navbar .nav > li.current-menu-ancestor > a {
padding:        5px 20px 5px 20px;
}

changing the 20px (order is top-right-bottom-left)
Snippet here

Adjust the Grey Bar:
Snippet here

Please note that the solution provided above does not play well on very narrow screens. I haven’t had time to research a better solution but, theoretically, you need to reduce the font size and line height using media queries for narrower screens, so the text doesn’t go out of the slider in those cases. Alternatively, you could just impose an overflow:hidden on #customizr-slider in your custom CSS:

#customizr-slider{ overflow:hidden;}

with the risk of your texts not being fully shown if they take up more space than the slider area. You actually need to decide what is the preferred solution when there’s too much text to fit inside the slider area: you’d rather have it cut off or you’d rather have it displayed and create a bit of space above and below the slider.