Previzualizare: http://frannnta-design.online-talk.net/page_html?mode=preview
Autor: MDesign
Inspirata: CounterStrike - ReddEffects
Dificultate: 6/6
Cod:
Autor: MDesign
Inspirata: CounterStrike - ReddEffects
Dificultate: 6/6
Cod:
- Cod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CTZ TEMPLATE </title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="http://www.extreme-play.ro/ctz/nusterge.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://extreme-play.ro/ctz/js/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="http://extreme-play.ro/ctz/js/jquery.easing.min.js"></script>
<script type="text/javascript" src="http://extreme-play.ro/ctz/js/jquery.menu.min.js"></script>
<script type="text/javascript" src="http://extreme-play.ro/ctz/js/function.js"></script>
<script type="text/javascript" src="http://extreme-play.ro/ctz/js/easySlider1.7.js"></script>
</head>
<body>
<div id="wrapper-blank"><div id="wrapper">
<div id="logo">
<a href="#"><img src="http://www.extreme-play.ro/images/71oay0h7rbqvjr660i.png" alt="logo" /></a>
</div>
<!-- menu start -->
<div id="menu">
<ul class="menu" id="mymenu">
<li><a href="#">Descriere</a></li>
<li><a href="#">Site</a></li>
<li><a href="#">Forum</a></li>
</ul>
</div>
<!-- menu end -->
<!-- header start -->
<div id="header"></div>
<!-- header end -->
<!-- content start -->
<div id="container">
<!-- rounded rectangle start -->
<div id="container-top"></div>
<div id="container-middle">
<!-- content for rounded rectangle start -->
<div id="slider">
SCRIE AICI CE VREI TEXTUL TAU AICI !
WWW.CRAZYART.LFORUM.BIZ
WWW.CRAZYART.LFORUM.BIZ
WWW.CRAZYART.LFORUM.BIZ
WWW.CRAZYART.LFORUM.BIZ
pastreaza copright daca nul pastrezi forumu tau va fi sters ! bucurate de template
</ul>
</div>
<!-- content for rounded rectangle end -->
</div>
<div id="container-bottom"></div>
<!-- rounded rectangle end -->
</div>
<!-- content start -->
<div id="container">
<!-- rounded rectangle start -->
<div id="container-top"></div>
<div id="container-middle">
<!-- content for rounded rectangle start -->
<div align="center"><h1>Copyright © 2011 - 2012 - CrazyART - Design and Coding by Mendark</h1>
</div>
<!-- content for rounded rectangle end -->
</div>
<div id="container-bottom"></div>
<!-- rounded rectangle end -->
</div>
<!-- content end -->
<div align="center">
</div>
</div>
<div style="clear:both;"></div>
</div>
<!-- footer end -->
</div>
<!-- social button start --><div class="panel">
<h3>TEXTUL TAU AICI</h3>
<p>TEXTUL TAU AICI</p>
<p>Copyright © 2011 - 2012 - CrazyART - Design and Coding by Mendark</p>
<h3>BANERUL TAU</h3>
<p>
<!-- [+]Partener CrazyART™ --><a href="http://crazyart.lforum.biz" target="_blank"><img src="http://www.extreme-play.ro/images/iqsb71vtkonl8csmhy6j.png" border="0" alt="Crazy ART merita vizualizat"></a><!-- [-]Partener CrazyART™ -->
</p>
</div>
<div style="clear:both;"></div>
</div>
<a class="trigger" href="#"></a>
<!-- social button end -->
<style type="text/css">
/* general */
body {
font: 11px Arial, sans-serif!important;
background-image:url(http://www.extreme-play.ro/images/i6f48e7jt4vgkvnkgz29.gif);
background-color:#393939;
color:#c8c8c8;
}
img {
padding:5px;
margin:0 10px 0px 0px;
float:left;
}
#wrapper {
margin: 0 auto;
background:transparent url(http://www.extreme-play.ro/images/g2jlrn4hvlt6nhozw819.png) no-repeat center top;
height:300px;
}
#wrapper-blank {
margin: 0 auto;
}
#logo {
margin: 0 auto;
height: 211px;
width:436px;
padding-top:40px;
}
#menu {
margin: 30px auto;
background-image:url(http://www.extreme-play.ro/images/5gaq74p3ntuvt28k329a.jpg);
width:950px;
height:47px;
}
.menu {
position: relative;
height: 29px;
width: 950px;
padding: 7px 5px 5px 33px;
margin: 10px 0;
overflow: hidden;
}
.menu li {
float: left;
list-style: none;
}
.menu li.back {
background: url(http://www.extreme-play.ro/images/hq7hmndoyw7g3o91nmb1.png) no-repeat right -30px;
width: 12px; height: 30px;
z-index: 8;
position: absolute;
}
.menu li.back .left {
background: url(http://www.extreme-play.ro/images/hq7hmndoyw7g3o91nmb1.png) no-repeat top left;
height: 30px;
margin-right: 9px;
}
.menu li a {
font: bold 14px arial;
text-decoration: none;
color: #4f4f4f;
outline: none;
text-align: center;
top: 7px;
text-transform: uppercase;
letter-spacing: 0;
z-index: 10;
display: block;
float: left;
height: 30px;
position: relative;
overflow: hidden;
margin: auto 40px;
}
.menu li a:visited {
border: none;
}
.menu li a:active, .menu li a:hover {
border: none;
color:#c8c8c8;
}
#header {
background:url() no-repeat;
margin:-30px auto;
height:110px;
width:851px;
}
#container {
width:950px;
margin:-20px auto;
position:relative;
}
#container-top {
background-image:url(http://www.extreme-play.ro/images/ro0mhhedk7lzq619pjf.jpg);
width:950px;
height:30px;
}
#container-middle {
background-image:url(http://www.extreme-play.ro/images/sqgni6o5q5qqyu8vvrxd.jpg);
width:950px;
height:50px;
height:auto;
overflow:hidden;
}
#container-middle p{
padding:0 30px 0 40px;
color:#c8c8c8;
line-height:1.5em;
font-size:1.2em;
}
#container-middle h1 {
font-size:1.8em;
margin-bottom:0.5em;
padding-left: 55px;
}
#container-middle h2 {
font-size:1.6em;
margin-bottom:0.5em;
padding-left: 35px;
}
#container-middle h3 {
font-size:1.4em;
margin-bottom:0.5em;
padding-left: 15px;
}
#container-middle h4 {
font-size:1.2em!important;
margin-bottom:0.5em;
padding-left: 0px;
padding-bottom:5px;
border-bottom: 1px solid #333!important;
width:80%;
}
#container-middle ul {
list-style-image:none;
margin:10px 0 10px 40px;
padding:0;
}
#container-middle li {
list-style:square;
list-style-position:outside;
}
#container-middle a, #container-middle a:link, #container-middle a:visited {
text-decoration:none;
color:#666;
}
#container-middle a:hover {
text-decoration:underline;
color:#fff;
}
#slider {
width:890px;
margin-left:30px!important;
}
img {
border:none;
}
.man {
background-image:url();
width:47px;
height:50px;
margin:200px auto;
display:block;
position:absolute;
margin-left:410px;
}
#slider ul, #slider li,
#slider2 ul, #slider2 li{
padding:0!important;
list-style:none;
margin:0;
}
#slider2{margin-top:1em;}
#slider li, #slider2 li{
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
width:890px;
height:403px;
overflow:hidden;
z-index:10;
}
#prevBtn, #nextBtn,
#slider1next, #slider1prev{
display:block;
width:65px;
height:90px;
position:absolute;
left:-37px;
top:71px;
z-index:1000;
}
#nextBtn, #slider1next{
left:922px;
}
#prevBtn a, #nextBtn a,
#slider1next a, #slider1prev a{
display:block;
position:relative;
width:65px;
height:90px;
background:url(http://www.extreme-play.ro/images/2sx9gshzioks9ktdt96o.jpg) no-repeat 0 0;
}
#nextBtn a, #slider1next a{
background:url(http://www.extreme-play.ro/images/zxiquic572ya51pz8aw4.jpg) no-repeat 0 0;
}
/* image replacement */
.graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
margin:0;
padding:0;
display:block;
overflow:hidden;
text-indent:-8000px;
}
/* // image replacement */
#container-bottom {
background-image:url(http://www.extreme-play.ro/images/21gfkzzsmqaszrudzvw7.jpg);
width:950px;
height:30px;
}
#bottom {
margin:40px auto;
width:900px;
overflow:hidden;
}
#bottom ul {
border-bottom:1px solid #282828;
border-top:1px solid #000;
}
.bottom-col1, .bottom-col2, .bottom-col3 {
width:275px;
float:left;
margin-left:20px;
}
.bottom-col1 p, .bottom-col2 p, .bottom-col3 p {
line-height:1.3em;
margin-bottom:1em;
color:#666666;
}
.describe {
margin-bottom:0!important;
}
.describe-italic {
margin-bottom:4px!important;
font-style: italic;
}
.bottom-col1 li, .bottom-col2 li, .bottom-col3 li {
border-bottom:1px solid #000;
border-top:1px solid #282828;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
padding:10px 0 10px 24px;
}
.bottom-col1 li a:link, .bottom-col1 li a:hover, .bottom-col1 li a:visited,
.bottom-col2 li a:link, .bottom-col2 li a:hover, .bottom-col2 li a:visited,
.bottom-col3 li a:link, .bottom-col3 li a:hover, .bottom-col3 li a:visited
{color:#c8c8c8; text-decoration:none;}
#bottom h1 {
font-size:1.8em;
margin-bottom:0.5em;
padding-left: 75px;
margin-bottom:-20px!important;
}
.bottom-col1 h1 {
background:url(http://www.extreme-play.ro/images/wzlumbogo2mu7stuipp.jpg) no-repeat left top;
height:66px;
padding-top:15px;
}
.bottom-col2 h1 {
background:url(http://www.extreme-play.ro/images/kuoqfpsvn4o0a8iipsxk.jpg) no-repeat left top;
height:66px;
padding-top:15px;
}
.bottom-col3 h1 {
background:url(http://www.extreme-play.ro/images/393w4jvsyedjquqc5a.jpg) no-repeat left top;
height:66px;
padding-top:15px;
}
#footer {
background:url(http://www.extreme-play.ro/images/o0jdvnklox6fmefu9wr3.jpg) no-repeat;
width:647px;
height:82px;
color:#666;
font-size:90%;
margin:25px auto;
padding-top:15px;
overflow:hidden;
}
.copyright {
width:380px;
margin:3px auto;
}
.validator2 {
float:left;
padding-left:20px;
width:190px;
}
.validator {
float:right;
width:130px;
padding-right:20px;
}
.validator a:link, .validator a:visited {color:#fff; text-decoration:none;}
.validator a:hover {color:#666; text-decoration:underline;}
.validator2 a:link, .validator a:visited {color:#fff; text-decoration:none;}
.validator2 a:hover {color:#666; text-decoration:underline;}
/* about us */
.col1 {
width:600px;
float:left;
overflow:hidden;
}
.col2 {
width:310px;
float:right;
overflow:hidden;
margin-right:25px;
}
.col1 img, .col2 img {
border: 1px solid #21211f;
}
.sidebar-top {
background:url(http://www.extreme-play.ro/images/bk2e4n8ulctobi0ntafe.jpg) no-repeat;
width:304px;
height:27px;
}
.sidebar-content {
background:url(http://www.extreme-play.ro/images/6hou0xp8s42fd0mhd.gif);
height:auto;
width:301px;
overflow:hidden;
}
.sidebar-content p{
padding:0 10px 0 10px;
}
.sidebar-content ul {
padding:0 25px 0 25px;
margin:0 25px 0 25px!important;
}
.sidebar-content li {
list-style-type:none!important;
}
.sidebar-content a:link, .sidebar-content a:visited {
color:#c8c8c8;
text-decoration:none;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
padding:10px 0 10px 24px;
background-color:#0f0f0f;
margin-bottom:5px;
border-bottom:1px solid #333;
border-top:1px solid #000;
font-size:1.5em;
display:block;
}
.sidebar-content a:hover {
color:#191919!important;
text-decoration:none!important;
background-color:#DADADA;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
padding:10px 0 10px 24px;
margin-bottom:5px;
font-size:1.5em;
display:block;
}
.sidebar-bottom {
background:url(http://www.extreme-play.ro/images/rx6qgxplv045un1zzn6p.jpg) no-repeat;
width:304px;
height:27px;
}
/* price list */
.col1b {
width:600px;
float:right;
overflow:hidden;
}
.col2b {
width:310px;
float:left;
overflow:hidden;
margin-left:35px;
}
.col1b img, .col2b img {
border: 1px solid #21211f;
}
#table {
margin:25px auto;
width:900px;
overflow:hidden;
}
#prices {
font-size: 14px;
width: 900px;
text-align: left;
border-collapse: collapse;
}
#prices thead th.table-right {
background: #000 url(http://www.extreme-play.ro/images/eylmr5qwox9e1yof8mmx.png) left -1px no-repeat;
font-weight:bold;
}
#prices thead th.table-left {
background: #000 url(http://www.extreme-play.ro/images/z19kz2foyp1y3crb4q7.png) right -1px no-repeat;
font-weight:bold;
}
#prices th {
padding: 8px 8px 8px 50px;
font-weight: bold;
font-size: 13px;
color: #c8c8c8;
background: #000;
}
#prices td {
padding: 8px 8px 8px 50px;
background: #191919;
border-top: 1px solid #333;
border-bottom: 1px solid #000;
color: #666;
}
#prices tfoot td.table-foot-left {
background: #070707 url(http://www.extreme-play.ro/images/x3kp6zg5sg89g17esrve.png) left bottom no-repeat;
border:none;
font-size:x-small;
}
#prices tfoot td.table-foot-right {
background: #070707 url(http://www.extreme-play.ro/images/py654rl3xt2m2xsf69p8.png) right bottom no-repeat;
border:none;
}
#prices tbody tr:hover td {
background: #DADADA;
color:#000;
}
.table-hd {
font-weight: bold;
}
/* portfolio */
#portfolio_container {
margin:0 auto;
width:890px;
overflow:hidden;
padding:25px 0 0 5px;
}
#portfolio_container h3 {
padding:5px 0 5px 15px;
font-size:1.2em;
display:block;
background-color:#171717;
text-transform:uppercase;
border-top:1px solid #070707;
border-bottom:1px solid #1f1f1f;
}
#portfolio_container p {
padding:5px 0 5px 15px;
font-size:1.2em;
font-weight:normal;
color:#666;
}
#portfolio_container a, #portfolio_container a:link, #portfolio_container a:visited {
color:#fff;
text-decoration:none;
}
#portfolio_container a:hover {
text-decoration:underline;
}
.boxgrid {
width: 255px;
height: 200px;
margin: 0px 0px 28px 28px;
float:left;
border: 1px solid #21211f;
overflow: hidden;
position: relative;
}
.boxgrid img {
position: absolute;
border: none;
padding:10px;
margin:0;
}
.boxgrid p {
padding: 0 10px;
color:#afafaf;
font-weight:bold;
}
.boxcaption{
float: left;
position: absolute;
background: #000;
height: 100px;
width: 100%;
}
.captionfull .boxcaption {
top: 150px;
left: 0;
}
.caption .boxcaption {
top: 290px;
left: 0;
}
/* services */
blockquote {
margin:5px 0 10px 25px!important;
border-left:1px solid #666;
font-style:italic;
line-height:inherit;margin:0 0 1.5em 0;
padding:0 0 0 15px;
}
.col1-egal {
float:left;
margin-left:35px!important;
}
.col2-egal {
float:right;
margin-right:15px;
}
.col1-egal, .col2-egal {
width:440px;
}
.col1-egal img, .col2-egal img {
border: 1px solid #21211f;
}
.col1-egal p, .col2-egal p {
padding:10px 10px 10px 0px!important;
}
/* contact */
#google {
border: 2px solid #333;
width:425px;
}
#contactForm {
width:420px;
background-color:#070707;
border: 2px solid #191919;
overflow:hidden;
height:auto;
}
#contactForm img {
border: 1px solid #21211f;
}
#contactForm form {
padding:20px;
border:none;
}
#contactForm label {
display:block;
color:#c8c8c8;
}
#contactForm input[type=text] {
display:block;
border:solid 1px #fff;
width:100%;
margin-bottom:10px;
height:24px;
}
#contactForm textarea {
display:block;
border:solid 1px #000;
width:100%;
margin-bottom:10px;
}
#contactForm input[type=submit] {
background-color:#171717;
border:solid 1px #000;
color:#c8c8c8;
padding:5px;
}
#messageSent {
color:#fff;
display:none;
}
.error {
font-family: Tahoma;
font-size: 8pt;
color: red;
margin-left: 50px;
display:none;
}
.sent {
text-align:center;
margin:0!important;
}
.sent h1 {
margin:0!important;
padding:0!important;
}
/* social */
.panel {
position: fixed;
top: 83px;
left: 0;
display: none;
background: #000000;
border:1px solid #111111;
width: 275px;
height: auto;
padding: 30px 30px 30px 100px;
z-index:1001;
}
.panel p{
margin: 0 0 15px 0;
padding: 0;
color: #666;
font: 11px Arial, sans-serif!important;
line-height:1.3em;
z-index:1003;
}
.panel a, .panel a:visited{
margin: 0;
padding: 0;
color: #fff;
text-decoration: none;
border-bottom: 1px solid #666;
}
.panel a:hover, .panel a:visited:hover{
margin: 0;
padding: 0;
color: #666;
text-decoration: none;
border-bottom: 1px solid #ffffff;
}
.trigger {z-index:1002;}
a.trigger{
position: fixed;
text-decoration: none;
top: 80px; left: 0;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding: 0;
font-weight: 700;
background:url(http://www.extreme-play.ro/images/ha4kd4pgdpzlh8lnqnx.png) no-repeat;
width:75px;
height:70px;
display: block;
}
a.trigger:hover{
position: fixed;
text-decoration: none;
top: 80px; left: 0;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding:0;
font-weight: 700;
background:url(http://www.extreme-play.ro/images/g5um5bg9inpgdvaqkynu.png) no-repeat;
width:75px;
height:70px;
display: block;
}
a.active.trigger {
background:url(http://www.extreme-play.ro/images/qms5njt0abi038uz49f.png) no-repeat;
width:75px;
height:70px;
}
.columns{
clear: both;
width: 330px;
padding: 0 0 20px 0;
line-height: 22px;
}
.colleft{
float: left;
width: 130px;
line-height: 22px;
}
.colright{
float: right;
width: 130px;
line-height: 22px;
}
</style>