Kód:
<center><link href='http://fonts.googleapis.com/css?family=Playfair+Display|Droid+Sans' rel='stylesheet' type='text/css'>
<style type="text/css">
::-webkit-scrollbar { height: 12px; width: 5px; background-color: transparent;}
::-webkit-scrollbar-thumb { background: #595B2F; }
::-webkit-scrollbar-corner { background:#C2C58C; }
::-webkit-scrollbar-track { background: transparent; }
#stuscontainer { width: 500px; height: 500px; position: relative; background-color: #C2C58C; }
#stumenu li { display: inline; cursor:pointer; position: absolute; top: 200px; width: 75px; text-align: center; left: 100px; background-color: #595B2F; color: #EEEDDD; padding-top: 10px; padding-bottom: 10px; font-size: 11px; font-family: calibri, sans serif; }
#stumenu li:hover { background-color: #C44D33; }
#stumenu li > div { width: 260px; height: 160px; overflow: auto; position: absolute; z-index: 20; display: inline; left: 0px; padding: 20px; visibility:hidden; opacity: 0; margin-bottom: 10px; background: #EEEDDD; color: #000000; text-align: justify; font-size:1em; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
#stumenu li:hover > div { visibility:visible; opacity: 1; margin-top: 30px; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
#stuscontainer img { position: absolute; z-index: 10; top: 240px; left: 100px; height: 200px; width: 300px; border-bottom: 10px solid #C44D33; }
#stuscontainer h1 { position: absolute; top: 110px; left: 100px; width: 300px; text-align: center; font-family: playfair display; font-size: 70px; color: #EEEDDD; font-style: italic; font-weight: inherit; }
#stuscontainer h2 { font-family: times; font-size: 7px; letter-spacing: 2px; position: absolute; top: 90px; left: 100px; width: 300px; line-height: 9px; text-align: center; text-transform: uppercase; color: rgba(238,237,221,0.8); font-weight: inherit; padding-top: 8px; padding-bottom: 8px; border-top: 1px solid rgba(238,237,221,0.5); border-bottom: 1px solid rgba(238,237,221,0.5); }
</style>
<center>
<div id="stuscontainer">
<img src="//jegvirag.gportal.hu/portal/jegvirag/image/gallery/1491895065_29.jpg">
<h2>JÉGVIRÁG DESIGN</h2>
<h1>JEGVIRAG</h1>
<ul id="stumenu">
<li>
I
<div>
1. <p style="text-align: center;">
<span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">Portálépítés és portáldíszítés kezdoknek és haladóknak!Rengetek leírás, scriptek , CSS ,HTML kódok!Nézz be te is! 2005.04.12.-én indult az oldal azóta várom a segítségre szoruló G-portálos.Ha bármi észrevételed van írhatsz e-mailt </span><a href="mailto:virag-78@gportal.hu" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">virag-78@gportal.hu </a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">vagy írhatsz a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36430159" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">vendégkönyv</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;"> be,meg a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36628088" style="color: rgb(0, 0, 0); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: Stalemate; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">chat</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">-be is.TANULJ,SZÉPÍTSD az oldaladat de a legfontosabb hogy közbe jól érezd magad!</span></p>
</div>
</li>
<li style="margin-left: 75px;">
II
<div style="margin-left: -75px;">
2. <p style="text-align: center;">
<span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">Portálépítés és portáldíszítés kezdoknek és haladóknak!Rengetek leírás, scriptek , CSS ,HTML kódok!Nézz be te is! 2005.04.12.-én indult az oldal azóta várom a segítségre szoruló G-portálos.Ha bármi észrevételed van írhatsz e-mailt </span><a href="mailto:virag-78@gportal.hu" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">virag-78@gportal.hu </a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">vagy írhatsz a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36430159" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">vendégkönyv</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;"> be,meg a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36628088" style="color: rgb(0, 0, 0); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: Stalemate; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">chat</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">-be is.TANULJ,SZÉPÍTSD az oldaladat de a legfontosabb hogy közbe jól érezd magad!</span></p>
</div>
</li>
<li style="margin-left: 150px;">
III
<div style="margin-left: -150px;">
3. <p style="text-align: center;">
<span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">Portálépítés és portáldíszítés kezdoknek és haladóknak!Rengetek leírás, scriptek , CSS ,HTML kódok!Nézz be te is! 2005.04.12.-én indult az oldal azóta várom a segítségre szoruló G-portálos.Ha bármi észrevételed van írhatsz e-mailt </span><a href="mailto:virag-78@gportal.hu" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">virag-78@gportal.hu </a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">vagy írhatsz a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36430159" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">vendégkönyv</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;"> be,meg a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36628088" style="color: rgb(0, 0, 0); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: Stalemate; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">chat</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">-be is.TANULJ,SZÉPÍTSD az oldaladat de a legfontosabb hogy közbe jól érezd magad!</span></p>
</div>
</li>
<li style="margin-left: 225px;">
IV
<div style="margin-left: -225px;">
4. <p style="text-align: center;">
<span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">Portálépítés és portáldíszítés kezdoknek és haladóknak!Rengetek leírás, scriptek , CSS ,HTML kódok!Nézz be te is! 2005.04.12.-én indult az oldal azóta várom a segítségre szoruló G-portálos.Ha bármi észrevételed van írhatsz e-mailt </span><a href="mailto:virag-78@gportal.hu" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">virag-78@gportal.hu </a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">vagy írhatsz a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36430159" style="color: rgb(255, 102, 102); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: "Century Gothic"; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">vendégkönyv</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;"> be,meg a </span><a href="//jegvirag.gportal.hu/gindex.php?pg=36628088" style="color: rgb(0, 0, 0); transition: all 0.5s linear; text-decoration: none; font-size: 15px; font-family: Stalemate; text-shadow: rgb(0, 0, 0) 0px 0px 0px; padding: 0px; text-align: -webkit-center;">chat</a><span style="font-family: Tahoma; font-size: 13px; text-align: -webkit-center;">-be is.TANULJ,SZÉPÍTSD az oldaladat de a legfontosabb hogy közbe jól érezd magad!</span></p>
</div>
</li>
</ul>
</div></center>