Confirmation message overlapping with the form

I have a problem with styling of the forms.

I tried to style the forms according to this tutorial, and it worked, only the problem is that the confirmation message goes all the way up and starts with form, and is under the form, together with the print link of th wp-print plugin.

This is the structure of the outputted content are in the page:

<div class="entry-content">
	<div class="wpcf7" id="wpcf7-f3-p2274-o1">
		<form action="/contact_us/#wpcf7-f3-p2274-o1" method="post" class="wpcf7-form">
			<div style="display: none;">
				...
			</div>
			<ul id="contact">
				...
			</ul>
			<div class="wpcf7-response-output wpcf7-display-none">
			</div>
		</form>
	</div>
<a href="..." title="Print page" rel="nofollow"><img class="WP-PrintIcon" src="..." alt="Print page" title="Print page" style="border: 0px;" /></a>
</div>

I guess the z-index has something to do with it, at least the part of the message and the print link being under the form, but why are the form and the message in the same div?

Both the message and the print link should be below the form, now they’re in line with it, only under.