Visual Studio 2017 Community webBrowser only applying CSS on the landing page

I am using a webBrowser-Object in my project and got the following problem:

(1) if I navigate via webBrowser1.Navigate() the HTML pages are displayed with including the stylesheets. (2) but if I navigate via the HTML pages (for example i click on a -element with a href the CSS on the following page isn't fully used. It loads the background image, the correct locations, but not the background colors of the frames This image shows how the menu is displayed in the webBrowser-element and this is how it looks in Microsoft Edge

EDIT:

span {
	color:white !important;
}

body {
	animation-name: FadeInRight;
	animation-duration: 1s;
	background: url(background.png);
	background-attachment: fixed;  
}

h3 {
	color:#0BA1E2 !important;
	padding-bottom: 60px;
	
}

h1 {
	color:#0BA1E2 !important;
	margin-top: 20%;
}

h4 {
	color:#0BA1E2 !important;
	margin-top: 20%;
	margin-bottom: 20%;
}

strong {
	color:white !important;
}

p {
	color:white !important;
}


.image1 {
	margin-top: 10%;
	width: 30%;
	height: auto;

}

.image1:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	
}

.image2 {
	margin-top: 10%;
	width: 30%;
	height: auto;

}

.image2:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	
}

.image3 {
	margin-top: 10%;
	width: 30%;
	height: auto;

}

.image3:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	
}

.image4 {
	width: 30%;
	height: auto;

}

.image4:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	
}

.image5 {
	width: 30%;
	height: auto;
	
}

.image5:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	position: static;
	
}

.image6 {
	width: 30%;
	height: auto;

}

.image6:hover {
	width: 33%;
	transition-duration: 0.5s;
	src: url("a_bilder/Grundlagen2.png");
	
}

.frame {
	margin-top: 2%; !important;
	height: 6%; !important;
	width: 60%; !important;
	margin-left: 20%; !important;
	margin-right: 20%; !important;
	background-color: rgb(227, 227, 227); !important;
	color: #0BA1E2; !important;
	text-align: center; !important;
	font-size: 15px; !important;
	
}

.frame:hover {
	width: 50%; !important;
	margin-left: 25%; !important;
	transition-duration: 0.1s; !important;
	

}

.about {
	margin-top: 30%; !important;
	height: 30%; !important;
	width: 60%; !important;
	margin-left: 20%; !important;
	margin-right: 20%; !important;
	background-color: rgb(227, 227, 227); !important;
	color: #0BA1E2; !important;
	text-align: center; !important;
	font-size: 15px; !important;
}