<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/>
<title>Virtual-Zone</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="js/script.js"></script>
</head>
<body>
<div id="wrapper">
<h1>Bun venit pe<small>Virtual-Zone</small></h1>
<h2><a href="http://virtualzone.catsboard.com/" title="Vitual-Zone">Virtual-Zone</a></h2>
<div id="content">
<div id="menu">
<ul>
<li><a href="/forum" title="Acasa">Acasa</a></li>
<li><a href="/register" title="Inregistrare">Inregistrare</a></li>
<li><a href="/login" title="Register">Conectare</a></li>
</ul>
</div>
<div id="main">
<h3>Contact</h3>
<b><center><p>Bine ati venit pe Virtual-Zone!<br>Sper sa va distrati si sa invatati multe lucruri noi.<br>Cu stima MetriXBBoy.</p>
<p>Pentru informatii dati add la :<br>demon_angel_astral@yahoo.com <br> sau <br>metrix_badboy@yahoo.com</p></center></b>
</div>
</div>
</div>
<script>/*
* Author: MetriXBBoy (http://virtualzone.catsboard.com/)
*/
google.load("jquery", "1.3.1");
google.setOnLoadCallback(function()
{
// Just for demonstration purposes, change the contents/active state using jQuery
$("#menu ul li a").click(function(e) {
e.preventDefault();
$("#menu ul li a").each(function() {
$(this).removeClass("active");
});
$(this).addClass("active");
$("h3").html($(this).attr("title"));
});
});</script><style>/*
_____________________________________________
| MetriXBBoy |
|_____________________________________________|
*/
/* BASIC RESET */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0; padding:0;}
/* HTML ELEMENTS */
body { background-image:url("http://img189.imageshack.us/img189/3332/woodbg.jpg"); font: 14px Georgia, serif; }
h1 { font: bold 65px/60px Helvetica, Arial, Sans-serif; text-align: center; color: #eee; text-shadow: 0px 2px 6px #333; }
h1 small{ font-size: 20px; text-transform:uppercase; letter-spacing: 14px; display: block; color: #ccc; }
h2 a { display: block; text-decoration: none; margin: 0 0 30px 0; font: italic 45px Georgia, Times, Serif; text-align: center; color: #bfe1f1; text-shadow: 0px 2px 6px #333; }
h2 a:hover { color: #90bcd0; }
a { outline:none; }
/* COMMON CLASSES */
.break { clear:both; }
/* WRAPPER */
#wrapper { width:800px; margin:40px auto; }
/* CONTENT */
#content { }
#content p { margin:20px; }
/* MENU */
#menu { margin:40px 0 0 150px; }
#menu ul { list-style:none; }
#menu ul li { display:inline; float:left; margin-bottom:20px; }
/* :first-child pseudo selector with rounded top left corner */
#menu ul li:first-child a { -moz-border-radius-topleft: 12px; -webkit-border-top-left-radius:12px; }
/* :last-child pseudo selector with rounded top right corner */
#menu ul li:last-child a { -moz-border-radius-topright: 12px; -webkit-border-top-right-radius:12px; }
/* background color set to RGBA, with opacity on 0.3 and also using text-shadow */
#menu ul li a { padding:20px; background: rgba(255,138,30,0.3); text-decoration: none; font: bold 14px Helvetica, Sans-Serif; letter-spacing: -1px; color: #402e16;
text-shadow: #eee 0px 0px 2px; }
/* hover state shows a linear gradient and opacity it brought down to 0.9 and also shows a very slight grey gradient on top */
#menu ul li a:hover { -moz-box-shadow: 0 -5px 10px #777; -webkit-box-shadow: 0 -5px 10px #777;
background: -webkit-gradient(
linear, right bottom, left top, color-stop(0, rgb(237,227,112)), color-stop(0.72, rgb(255,173,10))) !important;
background: -moz-linear-gradient(
right bottom, rgb(237,227,112) 0%, rgb(255,173,10) 72%) !important;
background-color:rgb(255,173,10) !important;
-moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; }
/* another RGBA background, now with an opacity of 0.8 */
#menu ul li a.active { background: rgba(255,138,30,0.8) !important; }
/* main contents with RGBA background (same colour as active tab) and three rounded corners */
#main { clear:both; background: rgba(255,138,30,0.8); width:500px; margin-left:150px;
-moz-border-radius-topright: 12px; -moz-border-radius-bottomright: 12px; -moz-border-radius-bottomleft: 12px;
-webkit-border-top-right-radius:12px; -webkit-border-bottom-right-radius:12px; -webkit-border-bottom-left-radius:12px;}
/* header with a text-shadow */
#main h3 { text-transform:uppercase; padding:20px 0 0 20px; color:#eee; text-shadow: #000 0px 0px 2px; }
#main p { padding-bottom:20px; color:#ddd; }</style>
</body>
</html>
Subiect: Cool CSS3 Template 
