crazymotion procssdesign

Tuttocss

css1

Copiate i codici del template che preferite! Per vedere l'anteprima del design cliccare su ANTEPRIMA
Andate sul sito
it.gg-->la tua scatola delle costruzioni-->impostare design-->selezionare CSS-Design
impostazioni avanzate-->incollare i codici dove richiesto dopo di che cliccare su salva!

ANTEPRIMA
Testo sopra il design

<!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" dir="ltr" lang="en-US"> 
<head profile="http://gmpg.org/xfn/11"> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Live Demo Theme  </title> 
<meta name="generator" content="WordPress 2.7.1" /> <!-- leave this for stats --> 
<link rel="stylesheet" href="http://www.isoftwarereviews.com/theme-demo/wp-content/themes/glossy-light/style.css" type="text/css" media="screen" /> 
<link rel="stylesheet" type="text/css" href="http://www.isoftwarereviews.com/theme-demo/wp-content/themes/glossy-light/style.css" media="screen" title="style" /> 
<link rel="alternate" type="application/rss+xml" title="Live Demo Theme RSS Feed" href="http://www.isoftwarereviews.com/theme-demo/feed/" /> 
<link rel="pingback" href="http://www.isoftwarereviews.com/theme-demo/xmlrpc.php" /> 
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.isoftwarereviews.com/theme-demo/xmlrpc.php?rsd" /> 
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://www.isoftwarereviews.com/theme-demo/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 2.7.1" /> 

<script type="text/javascript" src="http://www.isoftwarereviews.com/theme-demo/wp-content/themes/glossy-light/j-script/jquery-1.1.3.1.min.js"></script> 
<script type="text/javascript" src="http://www.isoftwarereviews.com/theme-demo/wp-content/themes/glossy-light/j-script/jquery.easing.min.js"></script> 
<script type="text/javascript" src="http://www.isoftwarereviews.com/theme-demo/wp-content/themes/glossy-light/j-script/jquery.lavalamp.min.js"></script> 
<script type="text/javascript"> 
$(function() { 
$("#nav").lavaLamp({ 
fx: "backout", 
speed: 700,click: function(event, menuItem) { 
return menuItem; 

}); 
}); 
</script> 
</head> 

<body> 
<div id="header-bg"> 
<div id="top-header"> 
<div id="header"> 
<div id="headerimg"> 
<div id="title"><a href="http://www.isoftwarereviews.com/theme-demo/">Live Demo Theme</a></div> 

<div class="description">Just another WordPress weblog <form method="get" id="searchform" action="http://www.isoftwarereviews.com/theme-demo/"> 
<div><input type="text" value="Type and hit enter to search" name="s" id="s" onfocus="if (this.value == 'Type and hit enter to search') {this.value = ''; this.style.color='#333';}" onblur="if (this.value == '') {this.value = 'Type and hit enter to search'; this.style.color='#b0b0b0';}" /> 
<input type="hidden" id="searchsubmit" value="Search" /> 
</div> 
</form> 
</div> 
</div> 

<div id="menu"><a href="http://www.isoftwarereviews.com/theme-demo/feed/" title="Subscribe To RSS!" class="rss">RSS<span></span></a></div> 
<ul id="nav"><li class="current_page_item"><a href="http://www.isoftwarereviews.com/theme-demo" title="Home">Home</a></li><li class="page_item page-item-11"><a href="http://www.isoftwarereviews.com/theme-demo/my-portfolio/" title="My Portfolio">My Portfolio</a></li> 
<li class="page_item page-item-2"><a href="http://www.isoftwarereviews.com/theme-demo/about/" title="About Me">About Me</a></li> 
<li class="page_item page-item-9"><a href="http://www.isoftwarereviews.com/theme-demo/contact-me/" title="Contact Me">Contact Me</a></li> 

<li class="page_item page-item-14"><a href="http://www.isoftwarereviews.com/theme-demo/resources/" title="Resources">Resources</a></li> 
</ul> 
</div> 
<div id="footer-bottom"> 
<div id="footer-bg"> 
<div id="page"> 
<hr /> 
   <div id="content" class="narrowcolumn">


Testo sotto il design

Niente!


Css-code

lli.nav_element{display: none;} 
li.nav_element a{display: none;} 
h1#title{display: none;} 
h2#title span {display: none;} 
div.header{display: none;} 
li.nav_element{list-style-type: none;} 
li.nav_element{display: none;} 


/*  
Adaptacion by mmstt.es.tl 

Author URI: http://www.isoftwarereviews.com/ 
*/ 


/* Begin Typography & Colors */ 
body { 
   font-size: 62.5%; /* Resets 1em to 10px */ 
   font-family: Helvetica, Arial, Sans-Serif; 
   background: #070a0a url('http://i42.tinypic.com/vi31h4.jpg') repeat-y center; 
   color: #333; 
   text-align:left; 
   } 

ul li{ 
   list-style: url('http://i39.tinypic.com/33uzfax.gif'); 
   } 

#footer-bottom { 
   background: url('http://i43.tinypic.com/14y4x0k.jpg') repeat-x bottom; 
   } 

#top-header{ 
   background: url('http://i42.tinypic.com/2rdhgso.jpg') no-repeat top center; 
   } 

#header-bg{ 
   background: url('http://i44.tinypic.com/s151cy.png') repeat-x; 
   } 

#footer-bg{ 
   background: url('http://i42.tinypic.com/2a9blw4.jpg') no-repeat bottom center; 
   } 

#header { 
   background:none; 
   } 
    
#page { 
   background: none; 
   text-align: left; 
   } 

#content { 
   font-size: 13px; 
   } 

.narrowcolumn .postmetadata { 
   text-align: center; 
   } 
.entry { 
   font-family: Helvetica, Arial, Sans-Serif; 
   padding: 10px 0px 5px; 
   clear: both; 
   font-size: 13px; 
   line-height: 1.6em; 
   } 

.entry ul li { 
   line-height: 1.5em; 
   font-size: 12px; 
   } 

.alt { 
   border-bottom: 1px solid #ddd; 
   border-top: 1px solid #ddd; 
   } 

small { 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 0.9em; 
   line-height: 1.5em; 
   } 

.pagetitle  { 
   font-size: 1.8em; 
   text-align: left; 
   font-family: 'Trebuchet MS', 'Lucida Grande',Arial, Sans-Serif; 
   font-weight: bold; 
   color: #dc3400; 
   } 

.posttitle  { 
   font-size: 1.1em; 
   text-align: left; 
   font-family: 'Trebuchet MS', 'Lucida Grande',Arial, Sans-Serif; 
   font-weight: bold; 
   color: #dc3400; 
    } 

.posttitle a { 
   font-family: 'Trebuchet MS', 'Lucida Grande',Arial, Sans-Serif; 
   font-weight: bold; 
   color: #dc3400; 
   text-decoration: none; 
   } 

.posttitle a:hover { 
   font-family: 'Trebuchet MS', 'Lucida Grande',Arial, Sans-Serif; 
   font-weight: bold; 
   color: #356569; 
   text-decoration: none; 
   } 

h1, h1 a { 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 1.5em; 
   text-align: left; 
   font-weight: bold; 
   color: #333; 
   } 

h1 a:hover{ 
   color: #ff6c00; 
   text-decoration: none; 
   } 
    
#title { 
   font-family: 'Trebuchet MS', 'Lucida Grande', Arial, Sans-Serif; 
   font-weight: bold; 
   font-size: 2.8em; 
   text-align: left; 
   padding:130px 0 0 40px; 
   } 

#title a{ 
   color: #ccc; 
   text-decoration: none; 
   } 

#headerimg .description { 
   font-size: 1.2em; 
   text-align: left; 
   padding-left:40px; 
   text-decoration: none; 
   color: #ccc; 
   } 

h2 { 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 1.3em; 
   } 

h3{ 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 1.1em; 
   } 

h4{ 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 1em; 
   font-weight: bold; 
   } 

h5{ 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 0.9em; 
   font-weight: bold; 
   } 

h6{ 
   font-family: Arial, Helvetica, Sans-Serif; 
   font-size: 0.9em; 
   font-weight: bold; 
   } 

#sidebar h2 { 
   font-size: 1.2em; 
   } 
#sidebar h2, #wp-calendar caption, cite { 
   text-decoration: none; 
   } 

.entry p a:visited { 
   color: #b85b5a; 
   } 

.commentlist li, #commentform input, #commentform textarea { 
   font: 12px Arial, Helvetica, Sans-Serif; 
   clear: both; 
   } 

.commentlist cite, .commentlist cite a { 
   font-weight: bold; 
   font-style: normal; 
   font-size: 13px; 
   width: 160px; 
   } 

.commentlist p { 
   font-weight: normal; 
   line-height: 1.5em; 
   text-transform: none; 
   margin-left: 180px; 
   } 

#commentform p { 
   font-family: Arial, Helvetica, Sans-Serif; 
   } 

.commentmetadata a, .commentmetadata a:hover{ 
   font-weight: normal; 
   color: #999; 
   } 

#sidebar { 
   font: 1em 'Lucida Grande', Verdana, Arial, Sans-Serif; 
   } 

small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike { 
   color: #777; 
   } 

code { 
   font: 1.1em 'Courier New', Courier, Fixed; 
   } 

acronym, abbr, span.caps { 
   font-size: 0.9em; 
   letter-spacing: .07em; 
   } 

a { 
   color: #0066CC; 
   text-decoration: none; 
   outline:none; 
   } 

a:hover { 
   color: #0066FF; 
   text-decoration: underline; 
   } 

#wp-calendar #prev a, #wp-calendar #next a { 
   font-size: 9pt; 
   } 

#wp-calendar a { 
   text-decoration: none; 
   } 

#wp-calendar caption { 
   font:120%/100% Arial, Helvetica, sans-serif; 
   text-align: center; 
   text-transform:uppercase; 
   } 

#wp-calendar th { 
   font-style: normal; 
   text-transform: capitalize; 
   } 

.post { 
   clear:both; 
   padding-top: 15px; 
   } 

.post h2 a{ 
   color:#356569; 
   } 

.post h2 a:hover{ 
   color:#dc3400; 
   text-decoration:none; 
   } 

.footercr{ 
   padding-bottom:39px; 
   margin-right:15px; 
   clear:both; 
   } 
.copyright{ 
   float:left; 
   color:#92a591; 
   font-size:11px; 
   margin-left:20px; 
   } 
.xhtml, .css{ 
   margin-left:8px; 
   float:right; 
   } 
.xhtml a{ 
   background:url(http://i40.tinypic.com/2dgkjvd.gif) no-repeat left center; 
   padding:5px 0 5px 18px; 
   color:#ef2983; 
   text-decoration:none; 
   } 
.xhtml a:hover, .css a:hover{ 
   color:#92a591; 
   text-decoration:underline; 
   } 
.css a{ 
   background:url(http://i43.tinypic.com/dqgpvp.gif) no-repeat left center; 
   padding:5px 0 5px 18px; 
   color:#71da51; 
   text-decoration:none; 
   } 

.credits{ 
   margin-left:8px; 
   float:right; 
   color:#CCC; 
   } 
    
.credits  a{ 
   color:#00ccff; 
   text-decoration:underline; 
   } 

.credits  a:hover{ 
   color:#92a591; 
   text-decoration:underline; 
   } 

#menu{ 
   list-style:none; 
   position:relative; 
   } 
    
#menu span{ 
   display:none; 
   position:absolute; 
   } 
    
#menu a{ 
   display:block; 
   text-indent:-900%; 
   position:absolute; 
   } 
    
#menu a:hover{ 
   background-position:left bottom; 
   } 
    
#menu a:hover span{ 
   display:block; 
   } 
    
#menu .rss{ 
   width:120px;height:35px; 
   background:url('http://i39.tinypic.com/10dvzb8.png') no-repeat; 
   left:792px; 
   top:-50px; 
   } 

/* End Typography & Colors */ 

/* Begin Structure */ 
body { 
   margin: 0 0 0 0; 
   } 

#page { 
   margin: 0px auto; 
   width: 930px; 
   } 

#header { 
   height: 230px; 
   margin: 0px auto; 
   width: 930px; 
   } 

#headerimg { 
   margin: 0px auto; 
   width: 930px; 
   height:230px; 
   } 

.pagecolumn { 
   float: left; 
   padding: 25px 0 20px 40px; 
   margin: 0px 0 0; 
   width: 535px; 
   } 

.narrowcolumn { 
   float: left; 
   padding: 15px 0 20px 40px; 
   margin: 0px 0 0; 
   width: 535px; 
   } 

.narrowcolumn .postmetadata { 
   padding-top: 5px; 
   } 

.postmetadata { 
   clear: left; 
   } 

#footer{ 
   height:290px; 
   width:930px; 
   clear:both; 
   } 

.categorytitle{ 
   font-family:Arial, Helvetica, sans-serif; 
   font-size:16px; 
   font-weight:bold; 
   color:#7ea604; 
   width:540px; 
   text-align:left; 
   margin-left:35px; 
   border-bottom:1px solid #999; 
   } 
#scategory{ 
   float:left; 
   width:600px; 
   margin-left:-5px; 
   } 
#scategory ul li{ 
   list-style: none; 
   float:left; 
   width:170px; 
   font-size:12px; 
   line-height:1.4em; 
   margin-right:10px; 
   } 
#scategory a{ 
   padding:5px; 
   display:block; 
   color:#CCC; 
   border-bottom:1px dotted #091011; 
   text-decoration:none; 
   } 
    
#scategory a:hover{ 
   color:#FFF; 
   background:#091011; 
   } 

.about-me{ 
   margin-top:-15px; 
   float:right; 
   text-align:left; 
   width:270px; 
   font:bold 14px Arial; 
   color:#d4d4d4; 
   padding-bottom:10px; 
   border-bottom:1px solid #999; 
   margin-right:23px; 
   } 
.about-me-text{ 
   margin-right:23px; 
   width:270px; 
   height:200px; 
   padding-top:15px; 
   font-size:12px; 
   color:#a0a0a0; 
   float:right; 
   text-align:left; 
   } 
.about-me-text img{ 
   float:left; 
   margin:2px 10px 2px 0; 
   border:1px solid #333; 
   padding:3px; 
   } 

.about-me-text a{ 
   text-decoration:underline; 
   font-weight:bold; 
   } 

#nav{ 
   position:relative; 
   height:35px; 
   margin:-173px 0 0 15px; 
   padding:0px; 
   overflow:hidden; 
   } 

#nav li{ 
   float:left; 
   list-style:none; 
   } 

#nav li.back{ 
   position:absolute; 
   background:url("http://i40.tinypic.com/1491kb4.png") repeat-x; 
   height:35px; 
   z-index:8; 
   } 

#nav li a{ 
   font:bold 11px Arial, Helvetica, sans-serif; 
   text-transform:uppercase; 
   color:#595a37; 
   top:11px; 
   display:block; 
   float:left; 
   height:35px; 
   position:relative; 
   overflow:hidden; 
   padding:0px 15px 0px 15px; 
   text-decoration:none; 
   z-index:10; 
   } 

#nav .current_page_item a, #nav .current_page_item a:visited, #nav .page_item a:hover{ 
   color:#fff; 
   } 
#nav .page_item a{ 
   color:#333; 
   } 

/* End Structure */ 

/*   Begin Headers */ 
h1 { 
   padding-top: 5px; 
   margin: 0; 
   } 

h2 { 
   margin: 30px 0 0; 
   } 

h2.pagetitle { 
   margin-top: 30px; 
   text-align: center; 
   } 

#sidebar h2 { 
   margin: 5px 0 0; 
   padding: 0; 
   } 

/* End Headers */ 

/* Begin Images */ 
p img { 
   padding:0; 
   max-width: 100%; 
   } 

/*   Using 'class="alignright"' on an image will (who would've 

   thought?!) align the image to the right. And using 'class="centered', 
   will of course center the image. This is much better than using 
   align="center", being much more futureproof (and valid) */ 

img.centered, .aligncenter{ 
   display: block; 
   margin-left: auto; 
   margin-right: auto; 
   } 

img.alignright { 
   padding: 4px; 
   margin: 0 0 2px 7px; 
   display: inline; 
   } 

img.alignleft { 
   padding: 4px; 
   margin: 0 7px 2px 0; 
   display: inline; 
   } 

.alignright { 
   float: right; 
   } 

.alignleft { 
   float: left; 
   } 

/* End Images */ 

/* Begin Lists 

   Special stylized non-IE bullets 
   Do not work in Internet Explorer, which merely default to normal bullets. */ 

.postmetadata ul, .postmetadata li { 
   display: inline; 
   list-style-type: none; 
   list-style-image: none; 
   } 

#sidebar ul, #sidebar ul ol { 
   margin: 0; 
   padding: 0; 
   } 

#sidebar ul li { 
   list-style-type: none; 
   list-style-image: none; 
   margin-bottom: 15px; 
   } 

#sidebar ul p, #sidebar ul select { 
   margin: 5px 0 8px; 
   } 

#sidebar ul ul, #sidebar ul ol { 
   margin: 5px 0 0 10px; 
   } 

#sidebar ul ul ul, #sidebar ul ol { 
   margin: 0 0 0 10px; 
   } 

#sidebar ul ol li { 
   list-style: decimal outside; 
   } 

#sidebar ul ul li, #sidebar ul ol li { 
   margin: 3px 0 0; 
   padding: 0; 
   } 
/* End Entry Lists */ 

/* Begin Form Elements */ 
#searchform { 
   text-align: center; 
   margin: -70px 0 0 560px; 
   height: 43px; 
   } 

#searchform #s { 
   border:1px solid #203346; 
   width: 265px; 
   height: 20px; 
   background: #fff; 
   padding:4px 5px 0 5px; 
   margin: 7px 2px; 
   font-weight: normal; 
   color:#b0b0b0; 

.entry form { /* This is mainly for password protected posts, makes them look better. */ 
   text-align:center; 
   } 

select { 
   width: 130px; 
   } 

#commentform input { 
   width: 170px; 
   padding: 2px; 
   margin: 5px 5px 1px 0; 
   } 

#commentform textarea { 
   width: 99%; 
   padding: 2px; 
   } 

#commentform #submit { 
   margin:0 -2px 50px 0; 
   background: url('http://i42.tinypic.com/2wfnzh0.gif') no-repeat; 
   font: bold 12px Arial, Helvetica, sans-serif; 
   color: #fff; 
   border: none; 
   float:right; 
   width: 143px; 
   height: 27px; 
   cursor: pointer; 
   } 
/* End Form Elements */ 

/* Begin Comments*/ 
.alt { 
   margin: 0 0 0 0px; 
   padding: 10px 10px 10px 10px; 
   } 
.commentlist { 
   margin: 0 0 0 0px; 
   padding: 0px; 
   text-align: justify; 
   list-style: none; 
   } 

.commentlist li{ 
   margin: 0; 
   padding: 10px 10px 10px 10px; 
   } 

#commentform p { 
   margin: 5px 0; 
   } 

.nocomments { 
   text-align: center; 
   margin: 0; 
   padding: 0; 
   } 

/* End Comments */ 


/* Begin Mini Icons */ 

.postdata { 
   font-size: 12px; 
   color: #999999; 
   padding: 5px 0 5px 0; 
   line-height: 1.3em; 
   } 

.postdata a, .postdata a:visited { 
   color: #999999; 
   text-decoration: none; 
   } 

.postdata a:hover { 
   color: #06c; 
   text-decoration: none; 
   } 

.postdata .category{ 
   background: url('http://i43.tinypic.com/2iuuwep.gif') no-repeat; 
   padding-left: 18px; 
   float: left; 
   } 

.postdata .comments{ 
   background: url('http://i39.tinypic.com/mmwt2b.gif') no-repeat; 
   padding-left: 18px; 
   float: right; 
   } 

.postdata .add-comment{ 
   background: url('http://i44.tinypic.com/302awt3.gif') no-repeat; 
   padding-left: 18px; 
   float: right; 
   } 

.postdata .minidate{ 
   background: url('http://i42.tinypic.com/2v3q6hy.gif') no-repeat; 
   padding-left: 18px; 
   float: left; 
   } 
/* End Mini Icons */ 

/* Begin Sidebar */ 
#sidebar{ 
   font-family: Arial; 
   padding: 20px 0 10px 0; 
   width: 270px; 
   float: left; 
   overflow: hidden; 
   margin-left: 60px; 
   } 

#sidebar form { 
   margin: 0; 
   } 

#sidebar h2 { 
   height: 19px; 
   padding: 4px 5px 4px 5px; 
   font:125%/100% Arial, Helvetica, sans-serif; 
   color: #000; 
   text-align: left; 
    border-bottom: 1px solid #999; 
   text-transform:uppercase; 
   } 

#sidebar ul ul{ 
   padding: 5px; 
   margin: 0px; 
   text-align:left; 
   } 

#sidebar ul li ul li{ 
   padding: 5px 0 5px 0px; 
   border-bottom: 1px dotted #e1e3e3; 
   font-size: 12px; 
   } 

#sidebar .sidebarrecentpost{ 
   padding: 5px 0px 5px 0px; 
   border-bottom: 1px dotted #e1e3e3; 
   font-size: 12px; 
   } 
/* End Sidebar */ 

/* Begin Calendar */ 
#wp-calendar { 
   empty-cells: show; 
   margin: 10px auto 0; 
   width: 175px; 
   border: 1px solid #999999; 
   } 

#wp-calendar #next a { 
   padding-right: 10px; 
   text-align: right; 
   } 

#wp-calendar #prev a { 
   padding-left: 10px; 
   text-align: left; 
   } 

#wp-calendar a { 
   display: block; 
   } 

#wp-calendar caption { 
   text-align: center; 
   width: 100%; 
   } 

#wp-calendar td { 
   padding: 3px 0; 
   text-align: center; 
   } 

#wp-calendar td.pad:hover { /* Doesn't work in IE */ 
   background-color: #fff; 
   } 
/* End Calendar */ 



/* Begin Various Tags & Classes */ 
acronym, abbr, span.caps { 
   cursor: help; 
   } 
acronym, abbr { 
   border-bottom: 1px dashed #999; 
   } 

blockquote { 
   margin: 15px 30px 0 10px; 
   padding-left: 20px; 
   border-left: 5px solid #ddd; 
   } 

blockquote cite { 
   margin: 5px 0 0; 
   display: block; 
   } 

.center { 
   text-align: center; 
   } 

hr { 
   display: none; 
   } 

a img { 
   border: none; 
   } 

.navigation { 
   display: block; 
   text-align: center; 
   margin-top: 10px; 
   margin-bottom: 60px; 
   } 

#previous-entries a{ 
   background: url('http://i44.tinypic.com/etw7c2.gif') no-repeat; 
   padding-left: 18px; 
   float: left; 
   } 

#next-entries a{ 
   background: url('http://i39.tinypic.com/20ibnq.gif') no-repeat right; 
   padding-right: 18px; 
   float: right; 
   } 

pre { 
   border:1px #ddd dotted; 
   background:#f7f7f7; 
   padding:0 15px 0 10px; 
   font-family: "Consolas", "Lucida Console", "Courier New", monospace; 
   float:left; 
   margin-bottom: 15px; 
   overflow: auto; 
   width: 520px; 
   } 
/* End Various Tags & Classes*/ 

/* Gravatars Style*/ 
   .gravs { 
   margin-top:20px; 
   } 
   .avatar { 
   float:left; 
   margin-right:5px; 
   margin-bottom:5px; 
   padding:3px; 
   border:1px solid #999; 
   } 

/* End Gravatars Style*/  




Testo sopra il design:

<body> 
   <div id="header"> 
      <div id="logo"> 
         <h1><a href="#">blue brush  </a></h1> 

         <p> design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a></p> 
      </div> 
      <div id="search"> 
         <form method="get" action=""> 
            <fieldset> 
            <input id="search-text" type="text" name="s" value="Search" size="15" /> 
            <input type="submit" id="search-submit" value="Search" /> 

            </fieldset> 
         </form> 
      </div> 
      <!-- end #search --> 
   </div> 
   <!-- end #header --> 
<div id="wrapper"> 
<div id="wrapper2"> 
   <div id="menu"> 
      <ul> 

         <li><a href="#">Home</a></li> 
         <li><a href="#">Blog</a></li> 
         <li><a href="#">Photo galleries </a></li> 
         <li><a href="#">About us </a></li> 
         <li><a href="#">Links</a></li> 
         <li><a href="#">Contact us </a></li> 

      </ul> 
   </div> 
   <!-- end #menu --> 
   <div id="page"> 
      <div id="content"> 
</body> 
</html>

Testo sotto il design:

<div class="topimg"><img src="" alt="" /></div> 
         <div class="post"> 
            <h1 class="title"><a href="#"></a></h1> 

            <p class="meta"></p> 
            <div class="entry"> 
               <p></p> 

               <p></p> 
            </div> 
         </div> 
         <div class="post"> 
            <h2 class="title"><a href="#"></a></h2> 
            <p class="meta"></p> 

            <div class="entry"> 
               <p></p> 
               <p></p> 
            </div> 
         </div> 
      </div> 
      <!-- end #content --> 

      <div id="sidebar"> 
         <ul> 
            <li> 
               <h2>Aliquam tempus</h2> 
               <p>Mauris vitae nisl nec metus placerat perdiet est. Phasellus dapibus semper urna ornare, orci in consectetuer hendrerit.</p> 
            </li> 
            <li> 
               <h2>Categories</h2> 

               <ul> 
                  <li><a href="#">Uncategorized</a> (3) </li> 
                  <li><a href="#">Lorem Ipsum</a> (42) </li> 
                  <li><a href="#">Urna Congue Rutrum</a> (28) </li> 

                  <li><a href="#">Augue Praesent</a> (55) </li> 
                  <li><a href="#">Vivamus Fermentum</a> (13) </li> 
               </ul> 
            </li> 
            <li> 
               <h2>Blogroll</h2> 

               <ul> 
                  <li><a href="#">Uncategorized</a> (3) </li> 
                  <li><a href="#">Lorem Ipsum</a> (42) </li> 
                  <li><a href="#">Urna Congue Rutrum</a> (28) </li> 

                  <li><a href="#">Augue Praesent</a> (55) </li> 
                  <li><a href="#">Vivamus Fermentum</a> (13) </li> 
               </ul> 
            </li> 
            <li> 
               <h2>Archives</h2> 

               <ul> 
                  <li><a href="#">December 2007</a> (29)</li> 
                  <li><a href="#">November 2007</a> (30)</li> 
                  <li><a href="#">October 2007</a> (31)</li> 
                  <li><a href="#">September 2007</a> (30)</li> 

               </ul> 
            </li> 
         </ul> 
      </div> 
      <!-- end #sidebar --> 
      <div style="clear: both;"> </div> 
   </div> 
   <!-- end #page --> 
</div> 

</div> 
<div id="footer"> 
   <p>Copyright (c) 2008  Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>&nbsp; Adaptacion By <a href="http://mmstt.es.tl">Mmstt</a> 
</div> 
<!-- end #footer --> 

Css-code:

lli.nav_element{display: none;} 
li.nav_element a{display: none;} 
h1#title{display: none;} 
h2#title span {display: none;} 
div.header{display: none;} 
li.nav_element{list-style-type: none;} 
li.nav_element{display: none;} 

/* 
Adaptacion By Mmstt.es.tl =) 
http://www.freecsstemplates.org 

*/ 

body { 
   margin: 0; 
   background: #FFFFFF; 
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
   font-size: 13px; 
   color: #333333; 


h1, h2, h3 { 
   margin: 0; 
   font-family: Georgia, "Times New Roman", Times, serif; 
   font-weight: normal; 
   color: #06AEF1; 


h1 { 
   font-size: 2em; 


h2 { 
   font-size: 1.8em; 


h3 { 
   font-size: 1.6em; 


p, ul, ol { 
   margin-top: 0; 
   line-height: 180%; 


ul, ol { 


a { 
   text-decoration: none; 
   border-bottom: 1px dotted #999999; 
   color: #000000; 


a:hover { 
   background: none; 


#wrapper { 
   width: 100%; 
   margin: 0 auto; 
   padding: 0; 
   background: #FFFFFF url(http://i40.tinypic.com/2jfkhtt.jpg) repeat-x left top; 


#wrapper2 { 
   margin: 0; 
   padding-top: 30px; 


/* Header */ 

#header { 
   width: 910px; 
   height: 60px; 
   margin: 0 auto; 
   padding-top: 10px; 


.topimg img { 
   margin: 0; 
   padding: 0 0 20px 0; 
   border: none; 
    


/* Logo */ 

#logo { 
   float: left; 
   width: 640px; 
   color: #333333; 


#logo h1, #logo p { 
   text-transform: lowercase; 
   font-family: Georgia, "Times New Roman", Times, serif; 


#logo h1 { 
   float: left; 
   letter-spacing: -1px; 
   font-size: 2.6em; 


#logo p { 
   float: left; 
   margin: 0; 
   padding: 10px 0 0 5px; 
   font-size: 16px; 


#logo a { 
   border: none; 
   background: none; 
   text-decoration: none; 
   color: #06AEF1; 


/* Search */ 

#search { 
   float: right; 
   width: 230px; 
   padding-top: 16px; 


#search form { 
   height: 41px; 
   margin: 0; 


#search fieldset { 
   margin: 0; 
   padding: 0; 
   border: none; 


#search-text { 
   width: 200px; 
   border: none; 
   text-transform: lowercase; 
   border: 1px #BDB0ED dotted; 
   font: bold 1.2em Arial, Helvetica, sans-serif; 
   color: #FFFFFF; 


#search-submit { 
   display: none; 


/* Menu */ 

#menu { 
   width: 910px; 
   height: 60px; 
   margin: 0 auto; 
   padding: 0; 


#menu ul { 
   margin: 0; 
   padding: 0; 
   list-style: none; 
   line-height: normal; 


#menu li { 
   float: left; 


#menu a { 
   display: block; 
   margin-left: 10px; 
   padding: 10px 20px 0 20px; 
   height: 31px; 
   background: url(http://i40.tinypic.com/33emm8g.jpg) repeat-x left top; 
   text-transform: lowercase; 
   text-decoration: none; 
   font-family: Georgia, "Times New Roman", Times, serif; 
   font-size: 18px; 
   font-weight: normal; 
   border: none; 
   color: #FFFFFF; 


#menu a:hover, #menu .current_page_item a { 


#menu a:hover { 
   text-decoration: underline; 


/* Page */ 

#page { 
   width: 910px; 
   margin: 0 auto; 
   padding: 0; 
   border: 15px #FFFFFF solid; 
   background: url(http://i44.tinypic.com/2w52h77.jpg) repeat-x left top; 


/* Content */ 

#content { 
   float: left; 
   width: 600px; 
   padding: 20px 0 0 20px; 


.post { 


.post .title { 
   color: #06AEF1; 


.post .title a { 
   background: none; 
   color: #06AEF1; 
   border: none; 


.post .title a:hover { 
   text-decoration: underline; 


.post .meta { 
   padding-bottom: 10px; 
   background: url(http://i43.tinypic.com/1zdr790.gif) repeat-x left bottom; 
   text-transform: uppercase; 
   text-align: left; 
   font-family: Arial, Helvetica, sans-serif; 
   font-size: 9px; 


.post .comments { 


.post .entry { 
   padding: 10px 0 20px 0; 
   text-align: justify; 


/* Sidebar */ 

#sidebar { 
   float: right; 
   width: 220px; 
   padding: 40px 20px 0 0; 
   color: #333333; 


#sidebar ul { 
   margin: 0; 
   padding: 0; 
   list-style: none; 


#sidebar li { 


#sidebar li p { 
   padding-left: 15px; 


#sidebar li ul { 
   padding-bottom: 30px; 


#sidebar li li { 
   margin-left: 15px; 
   padding-left: 10px; 
   line-height: 35px; 
   border-bottom: 1px dotted #D7D0F4; 
   background: url(http://i42.tinypic.com/9u94ef.jpg) no-repeat left 50%; 


#sidebar h2 { 
   letter-spacing: -.5px; 
   padding-bottom: 10px; 
   color: #06AEF1; 
   background: url(http://i43.tinypic.com/2n1f7n5.jpg) repeat-x left bottom; 


#sidebar p { 
   padding-bottom: 20px; 
   text-align: justify; 


#sidebar a { 
   color: #000000; 
   border: none; 


#sidebar a:hover { 
   text-decoration: underline; 
   color: #000000; 


/* Calendar */ 

#calendar { 


#calendar_wrap { 
   padding: 20px; 


#calendar table { 
   width: 100%; 


#calendar tbody td { 
   text-align: center; 


#calendar #next { 
   text-align: right; 


/* Footer */ 

#footer { 
   width: 910px; 
   height: 0px; 
   margin: 0 auto; 
   padding: 40px 0; 
   background: url(http://i43.tinypic.com/1zdr790.jpg) repeat-x left top; 
   font-family: Arial, Helvetica, sans-serif; 
   color: #B2B2B2; 


#footer p { 
   margin: 0; 
   line-height: normal; 
   font-size: 9px; 
   text-transform: uppercase; 
   text-align: center; 


#footer a { 
   color: #999999; 
}

 


Testo sopra il design:

<body> 
<div id="header-wrapper"> 
   <div id="header"> 
      <div id="menu"> 

         <ul> 
            <li class="current_page_item"><a href="#">Home</a></li> 
            <li><a href="#">Blog</a></li> 
            <li><a href="#">Photos</a></li> 
            <li><a href="#">About</a></li> 
            <li><a href="#">Links</a></li> 

            <li><a href="#">Contact</a></li> 
         </ul> 
      </div> 
      <!-- end #menu --> 
      <div id="search"> 
         <form method="get" action=""> 
            <fieldset> 
            <input type="text" name="s" id="search-text" size="15" /> 

            <input type="submit" id="search-submit" value="Search" /> 
            </fieldset> 
         </form> 
      </div> 
      <!-- end #search --> 
   </div> 
   <!-- end #header --> 
</div> 
<!-- end #header-wrapper --> 
<div id="page"> 

   <div id="logo"> 
      <h1><a href="#">Orange <span class="text1">And Black</span></a></h1> 
      <p><em>{ by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a> }</em></p> 
   </div> 
   <hr /> 
   <!-- end #logo --> 



          
</body> 
</html> 

Testo sotto il design:

 <div id="content"> 
      <div class="post"> 
          
         <div class="entry"> 
            <p></p> 

            <p></p> 
             
         </div> 
      </div> 
      <div class="post"> 
          

          
         <div class="entry"> 
            <p></p> 
            <p></p> 
             

         </div> 
      </div> 
   </div> 
   <!-- end #content --> 
   <div id="sidebar"> 
      <ul> 
         <li> 
            <h2>Aliquam tempus</h2> 

            <p>Mauris vitae nisl nec metus placerat perdiet est. Phasellus dapibus semper urna. Pellentesque ornare, orci in consectetuer hendrerit, volutpat.</p> 
         </li> 


<li id="calendar"> 
            <h2>Calendar</h2> 

            <div id="calendar_wrap"> 
               <table summary="Calendar"> 
                  <caption> 
                  February 2009 
                  </caption> 

                  <thead> 
                     <tr> 
                        <th abbr="Monday" scope="col" title="Monday">M</th> 
                        <th abbr="Tuesday" scope="col" title="Tuesday">T</th> 
                        <th abbr="Wednesday" scope="col" title="Wednesday">W</th> 
                        <th abbr="Thursday" scope="col" title="Thursday">T</th> 
                        <th abbr="Friday" scope="col" title="Friday">F</th> 

                        <th abbr="Saturday" scope="col" title="Saturday">S</th> 
                        <th abbr="Sunday" scope="col" title="Sunday">S</th> 
                     </tr> 
                  </thead> 
                  <tfoot> 
                     <tr> 
                        <td abbr="February" colspan="3" id="prev"><a href="#" title="">« Feb</a></td> 

                        <td class="pad"> </td> 
                        <td abbr="April" colspan="3" id="next"><a href="#" title="">Apr »</a></td> 
                     </tr> 
                  </tfoot> 
                  <tbody> 
                     <tr> 
                        <td colspan="5" class="pad"> </td> 
                        <td>1</td> 

                        <td>2</td> 
                     </tr> 
                     <tr> 
                        <td>3</td> 
                        <td>4</td> 
                        <td>5</td> 
                        <td>6</td> 

                        <td>7</td> 
                        <td>8</td> 
                        <td>9</td> 
                     </tr> 
                     <tr> 
                        <td>10</td> 
                        <td id="today">11</td> 

                        <td>12</td> 
                        <td>13</td> 
                        <td>14</td> 
                        <td>15</td> 
                        <td>16</td> 
                     </tr> 

                     <tr> 
                        <td>17</td> 
                        <td>18</td> 
                        <td>19</td> 
                        <td>20</td> 
                        <td>21</td> 

                        <td>22</td> 
                        <td>23</td> 
                     </tr> 
                     <tr> 
                        <td>24</td> 
                        <td>25</td> 
                        <td>26</td> 

                        <td>27</td> 
                        <td>28</td> 
                        <td>29</td> 
                        <td>30</td> 
                     </tr> 
                     <tr> 
                        <td>31</td> 

                        <td class="pad" colspan="6"> </td> 
                     </tr> 
                  </tbody> 
               </table> 
            </div> 
         </li> 
         <li> 
            <h2>Turpis nulla</h2> 

            <ul>         <li><a href="#">Nec metus sed donec</a></li> 
         <li><a href="#">Magna lacus bibendum mauris</a></li> 
         <li><a href="#">Velit semper nisi molestie</a></li> 
         <li><a href="#">Eget tempor eget nonummy</a></li> 
         <li><a href="#">Nec metus sed donec</a></li> 
         <li><a href="#">Magna lacus bibendum mauris</a></li> 

         <li><a href="#">Velit semper nisi molestie</a></li> 
</ul> 
             
         </li> 
      </ul> 
   </div> 

   <!-- end #sidebar --> 
   <div style="clear: both;"> </div> 
</div> 
<!-- end #page --> 


<div id="footer"> 
   <p>Copyright (c) 2008 Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>  Adaptacion By   <a href="http://mmstt.es.tl/">MmStT</a> 
</div> 
<!-- end #footer --> 

Css-code:

lli.nav_element{display: none;} 
li.nav_element a{display: none;} 
h1#title{display: none;} 
h2#title span {display: none;} 
div.header{display: none;} 
li.nav_element{list-style-type: none;} 
li.nav_element{display: none;} 


/* 
Design by Free CSS Templates 
Adaptacion by mmstt NO BORRES LOS CREDITOS ¬¬ 
*/ 

body { 
   margin: 0; 
   padding: 0; 
   background: #000000 url(http://i39.tinypic.com/27zahp5.jpg) repeat left top; 
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
   font-size: 13px; 
   color: #837669; 


h1, h2, h3 { 
   margin: 0; 
   font-family: Georgia, "Times New Roman", Times, serif; 
   font-weight: normal; 
   color: #D53707; 


h1 { font-size: 44px; } 

h2 { font-size: 20px; } 

h3 { } 

p, ul, ol { 
   margin-top: 0; 
   line-height: 240%; 
   text-align: justify; 
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
   font-size: 11px; 


ul, ol { } 

blockquote { } 

a { color: #D53707; } 

a:hover { text-decoration: none; } 

a img { 
   border: none; 


img.left { 
   float: left; 
   margin: 7px 30px 0 0; 


img.right { 
   float: right; 
   margin: 7px 0 0 30px; 


hr { display: none; } 

.text1 { 
   padding: 5px 10px 5px 10px; 
   background: #FF6600; 
   color: #000000; 


/* Header */ 

#header-wrapper { 


#header { 
   height: 80px; 
   margin: 0 auto; 
   padding: 0 20px; 
   background: url(http://i40.tinypic.com/28wjbjn.jpg) repeat; 
   border-bottom: 4px solid #910000; 


/* Menu */ 

#menu { 
   float: left; 
   width: 680px; 
   height: 40px; 


#menu ul { 
   margin: 0; 
   padding: 25px 0 0 20px; 
   list-style: none; 
   line-height: normal; 


#menu li { 
   display: block; 
   float: left; 


#menu a { 
   display: block; 
   float: left; 
   margin-right: 17px; 
   padding: 5px 12px; 
   text-decoration: none; 
   font: 14px Georgia, "Times New Roman", Times, serif; 
   color: #FFFFFF; 


#menu a:hover { 
   text-decoration: underline; 
   background: #C03511; 

 } 

#menu .current_page_item a { 
   background: #910000; 
   color: #FFFFFF; 


/* Search */ 

#search { 
   float: right; 
   width: 305px; 
   height: 40px; 


#search form { 
   float: right; 
   margin: 0; 
   padding: 28px 20px 0 0; 


#search fieldset { 
   margin: 0; 
   padding: 0; 
   border: none; 


#search input { 
   float: left; 
   font: 12px Georgia, "Times New Roman", Times, serif; 
   border: none; 


#search-text { 
   width: 135px; 
   height: 18px; 
   padding: 3px 0 0 5px; 
   background: #ECF9E4; 
   color: #658453; 


#search-submit { 
   height: 21px; 
   margin-left: 12px; 
   color: #39561D; 


/* Page */ 

#page { 
   margin: 0 auto; 
   padding: 0 40px; 


/** LOGO */ 

#logo { 
   height: 148px; 


#logo h1, #logo p { 
   float: left; 
   margin: 0; 
   padding: 0; 
   line-height: normal; 


#logo h1 { padding-top: 45px;} 

#logo h1 a { 
   padding: 5px 0 5px 10px; 
   text-decoration: none; 
   background: #000000; 
   color: #E46115; 


#logo h1 a:hover { text-decoration: none; } 

#logo p { 
   padding: 65px 0 0 15px; 
   font: italic 13px Georgia, "Times New Roman", Times, serif; 
   color: #B6ACA2; 


#logo p a { 
   text-decoration: none; 
   color: #B6ACA2; 


#logo p a:hover { text-decoration: underline; } 

/* Content */ 

#content { 
   float: left; 
   width: 75%; 


/* Post */ 

.post { 
   margin-bottom: 25px; 


.post .title { 
   margin-bottom: 3px; 
   padding: 2px 0px 2px 15px; 
   background: url(http://i42.tinypic.com/r8tutz.jpg) repeat left top; 


.post .meta { 
   margin: 0 0 3px 0; 
   padding: 2px 30px 2px 15px; 
   font: italic 10px Georgia, "Times New Roman", Times, serif; 
   color: #B6ACA2; 


.post .meta a { color: #B6ACA2; } 

.post .entry { 
   padding: 25px 15px; 


.post .links { 
   margin: 0 250px 0 0; 
   padding: 0 0 0 0px; 


.post .links .comments { 


.post .links .permalink { 
   padding-left: 17px; 


/* Sidebar */ 

#sidebar { 
   float: right; 
   width: 20%; 
   margin-top: -100px; 
   padding-left: 30px; 


#sidebar ul { 
   margin: 0; 
   padding: 0; 
   list-style: none; 
   line-height: normal; 


#sidebar li { 
   margin-bottom: 30px; 
   padding: 0 0 20px 0px; 


#sidebar li ul { 
   line-height: 200%; 


#sidebar li li { 
   margin: 0; 
   padding: 0 0 0 15px; 


#sidebar p { 
   padding: 0 15px; 


#sidebar h2 { 
   margin: 0 0 20px 0px; 
   padding: 6px 0 6px 15px; 
   background: url(http://i42.tinypic.com/r8tutz.jpg) repeat left top; 
   font-size: 18px; 



#sidebar p { 
   line-height: 200%; 


/* Calendar */ 

#calendar { 


#calendar caption { 
   padding-bottom: 5px; 
   font-weight: bold; 


#calendar table { 
   width: 100%; 
   border-collapse: collapse; 
   border: 1px solid #0F0E0E; 


#calendar thead th { 
   padding: 5px 0; 
   text-align: center; 
   border-top: 1px solid #0F0E0E; 
   border-left: 1px solid #0F0E0E; 
   background: #0F0E0E; 


#calendar tbody td { 
   padding: 5px 0; 
   text-align: center; 


#calendar tfoot td { 
   padding: 5px; 


#calendar tfoot #next { 
   text-align: right; 


#calendar #today { 
   background: #0F0E0E; 


/* Footer */ 

#footer { 
   margin: 0 auto; 
   padding: 0; 
   background: url(http://i40.tinypic.com/28wjbjn.jpg) repeat; 
   border-top: 4px solid #910000; 


#footer p { 
   margin: 0; 
   padding: 20px 0; 
   text-align: center; 
   line-height: normal; 
   color: #FFFFFF; 


#footer a { 
   color: #FFFFFF; 

 


Testo sopra il design:

<html> 
<head> 
<title>Black-Orange-V.2009</title> 
</head> 
<body> 
<div id="header"> 
   <h1>Tu Web</h1> 
   <h2>Menu</h2> 
   <ul> 
      <li class="first"><a href="#">Home</a></li> 
      <li><a href="#">link</a></li> 
      <li><a href="#">link</a></li> 
      <li><a href="#">link</a></li> 
      <li><a href="#">link</a></li> 
   </ul> 
</div> 
   <div id="colOne"> 
      <h3>Titulo del Box1</h3> 
      <ul class="list"> 
         <li class="first"><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
      </ul> 
      <p>&nbsp;</p> 
<h3>Titulo del box2</h3> 
      <ul class="list"> 
         <li class="first"><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
      </ul> 
      <p>&nbsp;</p> 
      <h3>Titulo del box3</h3> 
<ul class="list"> 
         <li class="first"><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
         <li><a href="#">link</a></li> 
      </div> 
   <div id="colTwo"> 
      <h2>Bienvenidos</h2> 
      </div> 

Testo sotto il design:

<div id="footer"> 
   <p>Copyright (c) 2009. Todos los derechos Reservados. Diseñado por <a href="http://web-etas.es.tl/">AlejoteRios</a>.</p> 
</div> 
</body> 
</html> 

Css-code:

lli.nav_element { 
display : none; 

li.nav_element a { 
display : none; 

h1#title { 
display : none; 

h2#title span { 
display : none; 

div.header { 
display : none; 

li.nav_element { 
list-style-type : none; 

li.nav_element { 
display : none; 

body { 
   background: #000000; 
   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
   font-size: 11px; 
   color: #E7E7E7; 


h1, h2, h3 { 
   margin: 0; 
   padding: 0; 
   font-family: Georgia, "Times New Roman", Times, serif; 
   color: #FFFFFF; 


h1 { font-size: 34px; } 

h2 { 
   margin-bottom: 10px; 
   padding: 0 0 22px 0; 
   font-size: 24px; 
   background: #000000 none repeat-x left bottom; 


h3 { 
   padding: 0 0 22px 0; 
   font-size: 13px; 
   background: #000000 url(https://img.webme.com/pic/w/web-etas/img0003.gif) repeat-x left bottom; 


p { 
   margin-top: 0; 
   text-align: justify; 
   line-height: 160%; 


a { 
   color: #FE4E00; 


a:hover { 
   text-decoration: none; 


.list { 
   margin: 0; 
   padding: 0; 
   list-style: none; 


.list li { 
   padding: 5px 0; 
   background: url(https://img.webme.com/pic/w/web-etas/img0005.gif) repeat-x; 


.list li.first { 
   background: none; 


/* Header */ 

#header { 
   width: 100%; 
   margin: 0 auto; 
   padding: 40px 0 0 13px; 
   height: 90px; 
   background: url(https://img.webme.com/pic/w/web-etas/img0001.gif) repeat-x left bottom; 


#header h1 { 
   float: left; 


#header h2 { 
   display: none; 


#header ul { 
   float: right; 
   margin: 0; 
   padding: 15px 0 0 0; 
   list-style: none; 


#header li { 
   display: inline; 


#header a { 
   display: block; 
   float: left; 
   padding: 0 14px 0 20px; 
   background: url(https://img.webme.com/pic/w/web-etas/img0002.gif) no-repeat left center; 
   text-decoration: none; 
   font: bold 12px Georgia, "Times New Roman", Times, serif; 
   color: #FFFFFF; 


#header a:hover { 
   text-decoration: underline; 


#header .first a { 
   background: none; 



#colOne { 
   float: left; 
   width: 179px; 
   padding: 0 0 0 21px; 


#colOne h3 { 
   margin-top: 14px; 


#colTwo { 
   float: right; 
   width: 394px; 
   padding: 0 29px 0 0; 


/* Footer */ 

#footer { 
   clear: both; 
   width: 100%; 
   margin: 0 auto; 
   padding: 30px 0 0 0; 


#footer p { 
   padding: 20px 0 0 0; 
   background: url(https://img.webme.com/pic/w/web-etas/img0004.gif) repeat-x; 
   text-align: center; 
   color: #8A8A8A; 

 

 


Testo sopra il design:

<div id="header"> 
  <div class="center_wrapper"> 
    <div id="toplinks"> 
      <div id="toplinks_inner"> <a href="#">Name</a> | <a href="#">Name</a> | <a href="#">Name</a> </div> 
    </div> 
    <div class="clearer"> </div> 
    <div id="site_title"> 
      <h1><a href="http://www.templates-pwg.es.tl/">Templates-PwG<span></span></a></h1> 
      <p>Los Revolucionarios De PwG</p> 
    </div> 
  </div> 
</div> 
<div id="navigation"> 
  <div class="center_wrapper"> 
    <ul> 
      <li class="current_page_item"><a href="#">Name</a></li> 
      <li><a href="#">Name</a></li> 
      <li><a href="#">Name</a></li> 
      <li><a href="#">Name</a></li> 
      <li><a href="#">Name</a></li> 
    </ul> 
    <div class="clearer"> </div> 
  </div> 
</div> 
<div id="main_wrapper_outer"> 
  <div id="main_wrapper_inner"> 
    <div class="center_wrapper"> 
      <div class="left" id="main">

Testo sotto il design:

<div id="main_content"> 
          <div class="post"> 
            <div class="post_title"> 
              <h2><a href="http://www.templates-pwg.es.tl/"Templates-PwG</a></h2> 
            </div> 
            <div class="post_date"> <a href=""></a></div> 
            <div class="post_body"> 
            </div> 
          </div> 
          <div class="post"> 
            <div class="post_title"> 
            </div> 
            <div class="post_date"><a href=""></a></div> 
            <div class="post_body"> 
              <p></p> 
            </div> 
          </div> 
        </div> 
      </div> 
      <div class="right" id="sidebar"> 
        <div id="sidebar_content"> 
          <div class="box"> 
            <div class="box_title">Titulo</div> 
            <div class="box_content"></div> 
            <p>Texto Aqui.</p> 
          </div> 
          <div class="box"> 
            <div class="box_title">Titulo</div> 
            <div class="box_content"> 
              <ul> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
              </ul> 
            </div> 
          </div> 
          <div class="box"> 
            <div class="box_title">Titulo</div> 
            <div class="box_content"> 
              <ul> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
                <li><a href="#">Name</a></li> 
              </ul> 
            </div> 
          </div> 
          <div class="box"> 
            <div class="box_title">Titulo</div> 
            <div class="box_content"> 
              <div class="thumbnails"> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> <a href="#" class="thumb"><img src="http://i42.tinypic.com/zivr4p.jpg" width="75" height="75" alt="" /></a> 
                <div class="clearer"> </div> 
              </div> 
            </div> 
          </div> 
        </div> 
      </div> 
      <div class="clearer"> </div> 
    </div> 
  </div> 
</div> 
<div id="dashboard"> 
  <div id="dashboard_content"> 
    <div class="center_wrapper"> 
      <div class="col3 left"> 
        <div class="col3_content"> 
          <h4>Titulo</h4> 
          <ul> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
          </ul> 
        </div> 
      </div> 
      <div class="col3mid left"> 
        <div class="col3_content"> 
          <h4>Titulo</h4> 
          <ul> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
          </ul> 
        </div> 
      </div> 
      <div class="col3 right"> 
        <div class="col3_content"> 
          <h4>Titulo</h4> 
          <ul> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
            <li><a href="#">Name</a></li> 
          </ul> 
        </div> 
      </div> 
      <div class="clearer"> </div> 
    </div> 
  </div> 
</div> 
<div id="footer"> 
<div class="center_wrapper"> 
    <div class="left">Copyright © 2009 Todos Los Derechos Reservados. <a href="#">Tu Web</a></div> 
    <div class="right"> <a href=""></a>Design Adaptado by: <a href="http://www.templates-pwg.es.tl/">Templates-PwG</a></div> 
    <div class="clearer"> </div> 
  </div> 
</div>

Css-code:

lli.nav_element{display: none;} 
li.nav_element a{display: none;} 
h1#title{display: none;} 
h2#title span {display: none;} 
div.header{display: none;} 
li.nav_element{list-style-type: none;} 
li.nav_element{display: none;} 

/*  
Template name: Emplode 
Release date: 2009 Mayo 26 
Description: A clean and simple two-column template. 
Author: Viktor Persson 
Adaptacion a Paginawebgratis.es: WwW.Templates-PwG.Es.Tl 

This template is licensed under a Creative Commons Attribution 2.5 License: 
http://templates.arcsin.se/license/ 
*/ 


/* 
   Reset (http://meyerweb.com/eric/tools/css/reset/) 
------------------------------------------------------------------- */ 

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, 
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, 
img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, 
center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, 
tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; 
font-size: 100%; vertical-align: baseline; background: transparent; } body { 
line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } 
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: 
none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; } 
table { border-collapse: collapse; border-spacing: 0; } 


/* 
   General 
------------------------------------------------------------------- */ 

html { 
   font-size: 62.5%; /* reset 1em to 10px */ 
   height: 100%; 


body { 
   background: #353530; 
   color: #5A5A50; 
   font: normal 1.3em Georgia,sans-serif; 
   height: 100%; 
   padding-bottom: 1px; /* force scrollbars */ 



/* 
   Typography 
------------------------------------------------------------------- */ 

p { 
   line-height: 1.4em; 
   padding: 0.2em 0 1.2em; 


h1 {font: normal 3em Georgia,sans-serif;} 
h2 {font: normal 2.2em Georgia,sans-serif;} 
h3 {font: normal 2em Georgia,sans-serif;} 
h4 {font: normal 1.8em Georgia,sans-serif;} 
h5 {font: normal 1.6em Georgia,sans-serif;} 
h6 {font: bold 1.2em Georgia,sans-serif;} 

h1,h2,h3,h4,h5,h6 {margin-bottom: 0.2em;} 

blockquote { 
   background: #F6F6F2 url('http://i44.tinypic.com/23kbsp0.gif') no-repeat 0 -414px; 
   border-bottom: 1px solid #E0E0D4; 
   border-top: 1px solid #E0E0D4; 
   color: #332; 
   display: block; 
   margin: 0.6em 0 1.6em; 
   padding: 0.8em 1em 0.2em 46px; 



/* 
   Tables 
------------------------------------------------------------------- */ 

table.data_table { 
   border: 1px solid #CCB; 
   margin-bottom: 2em; 
   width: 100%; 

table.data_table th { 
   background: url('http://i39.tinypic.com/kd4cht.jpg'); 
   border: 1px solid #CCB; 
   color: #555; 
   text-align: left; 

table.data_table tr {border-bottom: 1px solid #DDD;} 
table.data_table td, table th {padding: 10px;} 
table.data_table td { 
   background: url('http://i44.tinypic.com/2ikbk3t.jpg'); 
   border: 1px solid #DDC; 



/* 
   Lists 
------------------------------------------------------------------- */ 

dl {margin-bottom: 2em;} 
dt,dd {padding: 8px 10px;} 
dt { 
   background: url('http://i39.tinypic.com/kd4cht.jpg'); 
   border-bottom: 1px solid #CCB; 
   color: #555; 
   font-weight: bold; 

dd { 
   background: url('http://i44.tinypic.com/2ikbk3t.jpg'); 
   border-bottom: 1px solid #DDC; 
   padding-left: 16px; 



/* 
   Links 
------------------------------------------------------------------- */ 

a {color: #543;} 
a:hover { 
   color: #C40; 
   text-decoration: underline; 



/* 
   Forms 
------------------------------------------------------------------- */ 

fieldset { 
   border-left: 1px solid #CCB; 
   border-right: 1px solid #CCB; 
   margin: 1em 0 1.2em; 


input, textarea, select { 
   background-color: #FFF; 
   border-color: #777 #CCC #CCC #777; 
   border-style: solid; 
   border-width: 1px; 
   font: normal 1em Verdana,sans-serif; 
   padding: 4px; 


input.button { 
   background: #E9E8E8 url('http://i44.tinypic.com/23kbsp0.jpg') repeat-x 0 -366px; 
   border: 1px solid #888; 
   border-color: #BBB #888 #888 #CCC;       
   color: #444; 
   cursor: pointer; 
   font: normal 1em Verdana,sans-serif; 
   margin-top: 5px; 
   padding: 6px; 
   width: auto; 

input:focus,input:active,textarea:focus,textarea:active,select:focus,select:active,input.button:hover,input.button:focus {background: #FFFFF5;} 
input.button:hover, input.button:focus { 
   color: #123; 
   cursor: pointer; 


textarea {overflow: auto;} 

input.image { 
   border: 0; 
   padding: 0; 


/* Specific */ 

.form_row { 
   background: url('http://i44.tinypic.com/2ikbk3t.gif'); 
   border-bottom: 1px solid #E1E1D5; 
   padding: 10px 0; 

.form_required {font-weight: bold;} 
.form_row_submit, .legend { 
   background: url('http://i39.tinypic.com/kd4cht.jpg'); 
   border-bottom: 1px solid #CCB; 
   border-top: 1px solid #CCB; 
   padding: 4px 0 8px; 

.legend {padding: 8px 18px 6px;} 
.form_property, .form_value {float: left;} 
.form_property { 
   font-size: 1.1em; 
   text-align: right; 
   width: 110px; 

.form_value {padding-left: 24px;} 
.form_row_submit .form_value {padding-left: 132px;} 


/* 
   Images 
------------------------------------------------------------------- */ 

img.bordered { 
   background-color: #FFF; 
   border: 1px solid #DDD; 
   padding: 3px; 


img.left {margin: 0 15px 12px 0;} 
img.right {margin: 0 0 15px 12px;} 


/* 
   Floats 
------------------------------------------------------------------- */ 

.left {float: left;} 
.right {float: right;} 

.clear,.clearer {clear: both;} 
.clearer { 
   display: block; 
   font-size: 0; 
   line-height: 0;    



/* 
   Misc 
------------------------------------------------------------------- */ 

.content_separator, .archive_separator { 
   background: #D6D6C6; 
   clear: both; 
   color: #FFE; 
   display: block; 
   font-size: 0; 
   height: 1px; 
   line-height: 0; 
   margin: 12px 0 24px; 

.archive_separator {margin: 0 0 12px;} 


/* 
   Layout 
------------------------------------------------------------------- */ 

/* General */ 
.center_wrapper { 
   margin: 0 auto; 
   width: 855px; 


#header { 
   background: #35322B url('http://i44.tinypic.com/23kbsp0.jpg') repeat-x 0 0; 
   padding-top: 8px; 



/* Toplinks */ 
#toplinks { 
   background: #353530 url('http://i44.tinypic.com/hwd36f.gif') no-repeat left top; 
   color: #554; 
   float: right; 
   font-size: 0.9em; 
   height: 27px; 
   width: 230px; 

#toplinks_inner { 
   padding-top: 3px; 
   text-align: center; 

#toplinks a {color: #887;} 
#toplinks a:hover {color: #DDC;} 

/* Site title */ 
#site_title { 
   color: #998; 
   padding: 0 0 16px; 

#site_title a { 
   color: #FFF; 
   text-decoration: none; 

#site_title a:hover {color: #FFB;} 
#site_title h1 span {color: #CCB;} 


/* Navigation */ 
#navigation ul, #navigation li {display: inline;} 
#navigation li {display: inline;} 
#navigation, #navigation a {background: #958573 url('http://i44.tinypic.com/23kbsp0.jpg') repeat-x 0 -222px;} 
#navigation a { 
   border-right: 1px solid #AFA69C; 
   color: #654; 
   float: left; 
   font: bold 1em Georgia,Tahoma,sans-serif; 
   margin-right: 1px; 
   padding: 10px 12px; 
   text-align: center; 
   text-decoration: none; 

#navigation li:first-child a {border-left: 1px solid #AFA69C;} 
#navigation a:hover,#navigation li.current_page_item a { 
   background-position: 0 -294px; 
   color: #543; 



/* Main */ 
#main_wrapper_outer {background: url('http://i41.tinypic.com/23ur4b8.gif');} 
#main_wrapper_inner { 
   background: url('http://i39.tinypic.com/flvmzq.gif') repeat-x left top; 
   line-height: 1.4em; 
   padding: 24px 0; 

#main { 
   font: normal 0.9em Verdana,sans-serif; 
   width: 540px; 


#main ol, #main ul {margin: 0 0 1.2em 1.6em;} 
#main ul li {list-style: disc;} 
#main ol li {list-style: decimal;} 
#main li {padding: 2px 0;} 


/* Sidebar */ 
#sidebar { 
   color: #665; 
   width: 286px; 
   border-left: 1px solid #CCB; 

#sidebar_content {padding-left: 25px;} 
#sidebar a {color: #665;} 
#sidebar a:hover {color: #C40;} 


/* Dashboard */ 
#dashboard { 
   background: #DDD url('http://i39.tinypic.com/kd4cht.jpg'); 
   border-top: 1px dashed #C0C0B0; 

#dashboard_content {padding: 16px 0 22px;} 

#dashboard .col3 {width: 255px;} 
#dashboard .col3mid {width: 337px;} 
#dashboard .col3mid .col3_content { 
   border-left: 1px solid #CCB; 
   border-right: 1px solid #CCB; 
   padding: 0 20px; 
   margin: 0 20px; 


#dashboard li { 
   color: #887; 
   padding: 5px 0; 

#dashboard li {border-top: 1px dashed #C6C6B6;} 
#dashboard li a { 
   color: #606050; 
   text-decoration: none; 

#dashboard li a:hover { 
   color: #332; 
   text-decoration: underline; 



/* Footer links */ 
#footer { 
   color: #AA9; 
   padding: 12px 0; 

#footer a {color: #BBA;} 
#footer .right, #footer .right a { 
   color: #777; 
   text-decoration: none; 

#footer a:hover {color: #CCB;} 


/* 
   Posts 
------------------------------------------------------------------- */ 

.post {margin-bottom: 24px;} 

.post_title a,.post_date a {text-decoration: none;} 
.post_date a:hover,.post_meta a:hover {text-decoration: underline;} 

.post_date { 
   color: #777; 
   margin-bottom: 14px; 

.post_date a {color: #444;} 

.post_meta { 
   background: url('http://i44.tinypic.com/2ikbk3t.jpg'); 
   border: 1px solid #E5E5D5; 
   color: #776; 
   font-size: 0.9em; 
   padding: 8px 10px; 

.post_meta a {color: #665;} 
.post_meta a:hover {color: #001;} 

/* Archives */ 
.archive_pagination {margin-bottom: 1.6em;} 
.archive_post {margin-bottom: 1em;} 
.archive_post_date { 
   background: url('http://i44.tinypic.com/2ikbk3t.jpg'); 
   border-bottom: 1px solid #C5C5B5; 
   border-right: 1px solid #CFCFBF; 
   float: left; 
   margin-right: 12px; 
   padding: 3px 0 5px; 
   text-align: center; 
   width: 44px; 

.archive_post_day {font: normal 1.8em Georgia,serif;} 


/* 
   Thumbnails 
------------------------------------------------------------------- */ 

.thumbnails {margin: 0 -0 2em -8px;} 
.thumbnails a.thumb {    
   background: url('http://i39.tinypic.com/kd4cht.gif'); 
   display: block; 
   float: left; 
   margin: 0 0 8px 8px; 
   padding: 3px; 

.thumbnails a.thumb:hover {background: #C6C6BA;} 
.thumbnails .thumb img {display: block;} 


/* 
   Box 
------------------------------------------------------------------- */ 

.box {margin-bottom: 1.5em;} 
.box_title { 
   background: url('http://i39.tinypic.com/kd4cht.jpg'); 
   color: #665; 
   font-weight: bold; 
   padding: 5px 8px; 

.box_content {padding: 8px 0 8px;} 
.box li { 
   border-top: 1px solid #DDC; 
   padding: 4px 6px; 

.box li:first-child {border-top: none;} 


/* 
   Comments 
------------------------------------------------------------------- */ 

div.comment_list { 
   border-top: 1px solid #D6D6C6; 
   margin: 1em 0 2em; 


.comment { 
   border-bottom: 1px solid #D6D6C6; 
   padding-top: 10px; 

.comment_date { 
   font-size: 0.9em; 
   padding-top: 4px; 

.comment_date a { 
   color: #665; 
   text-decoration: none; 

.comment_date a:hover { 
   color: #001; 
   text-decoration: underline; 

.comment_body {padding-top: 4px;} 

.comment_gravatar {width: 48px;} 
.comment_gravatar img { 
   background: #FFF; 
   border: 1px solid #DDD; 
   padding: 2px; 

.comment_author {padding-top: 3px;} 


/* 
   IE float/background fixes 
------------------------------------------------------------------- */ 

.legend, blockquote, #sidebar {min-height: 0.01%;}

 


Testo sopra il design:

<style type="text/css" media="screen"> <!-- body { font-family: Arial; font-size: 00px; overflow: auto; padding: 10px; margin: 0px; } ul, li { list-style-type: none; padding: 0px; margin: 0px; } li a { padding-right: 20px;padding-top: 5px; } div.menu { position: absolute; z-index: 3; top: 262px; left: 43%; margin-left:-185px; width: 600px; } .menu li { width: 120px; float: left; } .menu a { border: 0px solid #xxxxxx; background-color: #xxxxxx; background-image: none; text-decoration: none; text-align: center; font-weight: bold; cursor: pointer; margin: 0px; display: block; height:21px; color: #ffffff; } .menu a:hover { background-color: #transparent; background-image: none; color: #cccccc;} #smenu1, #smenu2, #smenu3, #smenu4, #smenu5 { font-size: 15px; display: none; width: 70px; float: left; } #smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a { font-weight: bold; padding-top: 5px; border-top: 0px; cursor: pointer; color: #FFFFFF; } //--> </style> <script type="text/javascript"> <!-- function montre(id) { with (document) { if (getElementById) getElementById(id).style.display = 'block'; else if (all) all[id].style.display = 'block'; else layers[id].display = 'block'; } } function cache(id) { with (document) { if (getElementById) getElementById(id).style.display = 'none'; else if (all) all[id].style.display = 'none'; else layers[id].display = 'none'; } } //--> </script> <div class="menu"> <li><a href="LINK" _fcksavedurl="LINK">LINK</a> </li> <li><a href="LINK" _fcksavedurl="LINK">LINK</a> </li> <li><a href="LINK" _fcksavedurl="LINK">LINK</a> </li> <li><a href="LINK" _fcksavedurl="LINK">LINK</a> </li>  </div> <div id="Designmystic"> <div id="text"><h1></h1> </div> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> 

Testo sotto il design:

NIENTE!

Css-code:

lli.nav_element{display: none;} li.nav_element a{display: none;} h1#title{display: none;} h2#title span {display: none;} #text{ color: ffffff; position: absolute; top: 100px; margin-left:-300px; left: 50%; } body { background-image:url(fondo );background-color:#ffffff;} *{ padding: 0; margin: 0; } #Designmystic { margin: 0 auto; width: 800px; height:800px; background-image:url(http://img37.imageshack.us/img37/8435/disexsada.png);} #content { position: absolute; left: 51%; top: 350px; margin-left:-322px; width: 320px; height: 381px; padding:10px; color: #transparent; font-size:13px; background-color:#transparent; background-image: none; border: 0px solid #FFFFFF; overflow:auto;} #Uebersicht{ position: absolute; left: 50%; top: 204px; margin-left:-440px; font-color:#cccccc;} a{ color:#ffffff; text-decoration: none; font-size:13px;} a:hover { color: #4A9AF6; font-size: 13px; text-decoration: none;} a:link { color: #000000; font-size: 13px; text-decoration: none;} a:active { color: #000000; font-size: 13px; text-decoration: none;} a:visited { color: #000000; font-size: 13px; text-decoration: none;} div.lux { position: absolute; z-index: 3; top: 172px; left: 52%; margin-left:-185px; width: 647px; } .lux a { border: 0px solid #xxxxxx; background-color: #xxxxxx; background-image: none; text-decoration: none; text-align: center; font-weight: bold; cursor: pointer; margin: 0px; display: block; height:21px; color: #ffffff; font-size: 24px; }



Oggi ci sono stati già 1 visitatori (7 hits) qui!
=> Vuoi anche tu una pagina web gratis? Clicca qui! <=