header texten are showing itself at the point 752px while it has to bee hidden?

Hello,
I have this mediia query code in my style.css:

@media (max-width: 575.98px) { 

 .site-header-section2 {
	display: none;
}	
	.site-header-section3 {
	display:none;
}	

}

@media (min-width: 576px) and (max-width: 767.98px) { 
.site-header-section2 {
	display: none;
}	
	.site-header-section3 {
	display:none;
}	

}

now my queston is when I open inspect elements in firefox to inspect my website header break points if it is woking right.
I see in the header that site-header section 2 (text) and ste-heade-secton 3 (text) in the header is showing itsel at the breakpoint 752px while it has to be headen untill break point 767.98px.
to get the idea what I mean:
this is my url: [ redundant link removed, again please use the link field ]
you can see here when you open inspect elements and go untlll the beak point that 2 header section text disapear.
what can be the poblem or how I can solve this problem. I am working with bootstrap grid and media query system.
thanks
johan

• This topic was modified 5 years, 3 months ago by Jan Dembowski.
• This topic was modified 5 years, 3 months ago by Jan Dembowski.

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