Main navigation formatting

I am developing a site for a customer using CityLogic. I have made a header and I want the main navigation to sit at the bottom of the header image. I have achieved this on the home page by adding css to the ‘addtional css’ section of the theme customizer. HOWEVER the css has applied only to the home page and not to all the other pages.

I don’t understand why the css has not applied to all pages or, more importantly, how to fix it. If anyone is able to help I would be very grateful.

My header is not the standard one from the customizer but built by adding images to the header template and then css to ‘additional css’. So my additional css is:

.custom-logo-link img {
/* display: inline-block; */
max-height: 100px;
position: top
/* width: auto; */
}

.site-content {
margin-top: -25px;
}

.boxed {
border: 3px solid navy;
padding: 5px;
margin: 5px;
}

.image_1 {
position: relative;
top: 0px;
left: 0px;
/* display: inline-block; */
max-height: 350px;
/* width: auto; */
}
.image_2 {
position: absolute;
top: 30px;
left: 1100px;
text-align: right;
/* display: inline-block; */
max-height: 250px;
/* width: auto; */
}

.image_3 {
position: absolute;
top: 15px;
left: 150px;
text-align: left;
/* display: inline-block; */
max-height: 50px;
/* width: auto; */
}

.main-navigation {
top: 250px;
}

The page I need help with: [log in to see the link]