hmm i've been playing around with it and i don't think that can be done, because is outside of , and any divs you create go inside . this hover effect can only be used on divs "lower" in the hierarchy so to speak, not higher. you will have to use a div you make on your own, like you have it set up now.
you've also got some extraneous reset code going on. i tidied things up so hopefully this is cleaner to work with if you need to change other things.
code
<style>
, -ban, -ban-main, -lrc, -rrc, , , -right, , , , .bookmark, , , .prototip, , h2, .hustler, , , , , .pet_name, .pet_age_info_date, .pet_wco_info_date, .owner img {display: none}
, {background: transparent}
html {overflow: hidden}
{
position: absolute;
left: 30px; top: 240px;
width: 255px; height: 200px;
padding: 0; opacity: 0.8;
background-color: }
:hover {opacity: 1}
.main {
position: absolute;
left: 320px; top: 240px;
width: 200px; height: 200px;
overflow: auto}
.test {
position: absolute;
left: 560px; top: 240px;
width: 200px; height: 200px}
.main:hover + .test {visibility: hidden}
</style>
title
bold |
italic |
underline
Lorem ipsum dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.