Free kids template

 To change your blogspot template 

1. Copy the code below in column  

2. Log into your blog  
3. Select Layout  
4. Select Edit HTML  
5. Check the radio button  
6. Replace your whole page and paste the HTML code that you copied earlier  
7. Click the preview if you want to see results before publicizing  
8. Save your template  
9. You can see the results  
10. Do not forget Buck up your template before changing, so that if something happens you can put your old  template again 

Good luck



Cat


<?xml ver
sion="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[
/* --- * Blogger Template Style---- * Name: Cartoon 220----- *Designer: J.aghili ----- * URL: www.finalsense.com ------ * Date: 2007 September ----- */
/* Variable definitions
====================
<Variable name="textcolor" description="Text Color"
type="color" default="#369">

<Variable name="PageBgColor" description="Main Background Color"
type="color" default="#f5e1c8">

<Variable name="pagetitlecolor" description="Page Header Color"
type="color" default="#f90">

<Variable name="datecolor" description="Date Header Color"
type="color" default="#ccc">

<Variable name="titlecolor" description="Post Title Color"
type="color" default="#f90">

<Variable name="titlehovercolor" description="Post Title Hover Color"
type="color" default="#369">

<Variable name="footercolor" description="Post Footer Color"
type="color" default="#099">

<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#f66">

<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#f90">

<Variable name="sidebarlink" description="Sidebar Link Color"
type="color" default="#f66">

<Variable name="sidebarhover" description="Sidebar Hover Color"
type="color" default="#555">

<Variable name="linkcolor" description="Link Color"
type="color" default="#099">

<Variable name="linkhover" description="Link Hover Color"
type="color" default="#f90">

<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#099">

<Variable name="descriptioncolor" description="Description Color"
type="color" default="#f90">

<Variable name="Commentscolor" description="Comments Text Color"
type="color" default="#808080">

<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 80% Verdana, sans-serif">

<Variable name="pagetitlefont" description="Page Header Font"
type="font" default="normal bold 200% 'Georgia','Times New Roman'">

<Variable name="titlefont" description="Post Title Font"
type="font" default="normal bold 110% 'Georgia','Times New Roman'">

<Variable name="sidebarheaderfont" description="Sidebar Title Font"
type="font" default="normal bold 105% 'Georgia','Times New Roman'">

<Variable name="descriptionfont" description="Description Font"
type="font" default="normal normal 80% 'Verdana','Arial'">
*/
/* ---( page defaults )--- */
body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background:#f5e1c8 url('http://lh6.google.com/jvdmds/RvMd8KZyoxI/AAAAAAAAAoY/yMlPzw39lCA/cartoon003.jpg') no-repeat fixed top left;}
blockquote { margin: 0 0 0 30px; padding: 10px 0 0 20px; line-height: 1.5em; }
blockquote p { margin-top: 0; }
abbr, acronym { cursor: help; font-style: normal; }
code { color: #f63; }
hr { display: none; }
img { border: none; }

/* unordered list style */
ul { list-style: none; margin-left: 7px; padding: 0; }
li { list-style: none; padding-left: 9px; margin-bottom: 3px; }

/* links */
a:link { color: $linkcolor; text-decoration: none; }
a:visited { color: $visitedlinkcolor; }
a:hover { color: $linkhover; }
a:active { color: $visitedlinkcolor; }

/* ---( layout structure )---*/
#outer-wrapper { width: 990px; margin: 0px; padding: 0px; text-align: justify; }
#content-wrapper { margin: 0px; padding: 0px; }
#main { float:left; width: 430px; margin: 0px; padding: 0px; word-wrap: break-word; }
#sidebar {float:right; width: 180px; padding: 5px; color: $sidebartextcolor; border: 0px solid #f90; line-height: 1.4em; word-wrap: break-word; }
#center { overflow: scroll; width: 640px; height: 270px; background:#ffffff; margin: 170px 0px 0px 150px; border: 0px solid #000;
scrollbar-face-color: #fff;
scrollbar-highlight-color: #fff;
scrollbar-shadow-color: #fff;
scrollbar-3dlight-color: #fff;
scrollbar-arrow-color: #ccc;
scrollbar-track-color: #fff;
scrollbar-darkshadow-color: #666;}


/* ---( header and site name )--- */
#header-wrapper { margin: 0; }
#header {height:100px; overflow: hidden; margin: 0; width:600; color: $pagetitlecolor; }
#header h1 { width: 400px; font: $pagetitlefont; margin-left: 400px; padding: 5px 5px 5px 5px; filter: glow(color:000000, Strength=5); text-align: right;}
#header h1 a { text-decoration: none; color: $pagetitlecolor; }
#header h1 a:hover { color: #ffffff; }
#header .description { margin:-27px 0px 0px 440px; text-align:right; padding:0px; width:360px; font: $descriptionfont; color: $descriptioncolor; }

/* ---( main column )--- */
h2.date-header { margin-top: 0; text-align:center; font-size: 90%; color: $datecolor; }
.post h3 { margin-top: 0; font: $titlefont; color: $titlecolor; border-top: 1px solid #ff9900; border-bottom: 1px solid #ff9900; }
.post { margin:0px; padding:5px; }
.post h3 a {text-decoration: none; color: $titlecolor;}
.post h3 a:hover { color: $titlehovercolor; text-decoration: none; }
.post-footer { margin: 0; padding: 0px; font-size: 88%; color:$footercolor; text-align: right; }
.post img { padding: 6px; border-top: 1px solid #ccc; border-left: 1px solid #cccccc; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; }
.feed-links { clear: both; line-height: 2.5em; color:$footercolor;}
.blog-feeds { text-align: right; color:$footercolor; border-top: 1px solid #ff9900;}
#blog-pager-newer-link { float: left; }
#blog-pager-older-link { float: right; }
#blog-pager { text-align: center; }

/* comment styles */
#comments { padding-top: 10px; font-size: 85%; line-height: 1.5em; color: $Commentscolor; }
#comments h4 { margin: 20px 0 15px 0; padding: 8px 0 0 40px; font-family: "Lucida Grande", "Trebuchet MS"; font-size: 110%; color: $Commentscolor; height: 30px !important; /* for most browsers */ height /**/:37px; /* for IE5/Win */ }
#comments ul { margin-left: 0; }
#comments li { background: none; padding-left: 0; }
.comment-body { padding: 0 10px 0 25px; }
.comment-body p { margin-bottom: 0; }
.comment-author { margin: 4px 0 0 0; padding: 0 10px 0 60px; }
.comment-footer { border-bottom: 1px solid #ddd; padding-bottom: 1em;}
.deleted-comment { font-style:italic; color:gray; }

/* ---( sidebar )--- */
.sidebar h2 { margin:0px; padding: 10px 0 0 0px; font: $sidebarheaderfont; color: $sidebarcolor; height: 32px !important; /* for most browsers */ height /**/:57px; /* for IE5/Win */ }
.sidebar .widget { margin: 0; padding: 0 0 5px 10px;}
.sidebar a {color: $sidebarlink; text-decoration: none;}
.sidebar a:hover {color: $sidebarhover; }
.sidebar li { padding-left: 5px; }
.profile-textblock { margin:.5em 0 .5em; }
.profile-img { float: left; margin: 0 5px 5px 0; border: 1px solid #ddd; padding: 4px;}

/* ---( footer )--- */
.clear { /* to fix IE6 padding-top issue */ clear: both; }
#footer-wrapper { padding:20px 0px 0px 280px; font-size: 70%; clear: both;}
#footer {width: 650px; text-align:center; color: #999; }
#footer-wrapper a { color: #999; text-decoration: none;}
#footer-wrapper a:hover{ color: #f90; text-decoration: none;}

/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper,
body#layout #main,
body#layout #sidebar { padding-top: 0; margin-top: 0;}
body#layout #outer-wrapper,body#layout #content-wrapper { width: 100%;}
body#layout #sidebar { margin-right: 0; margin-bottom: 1em; }
body#layout #header,body#layout #footer,
body#layout #main { padding: 0; }
body#layout #content-wrapper {margin: 0px; }
#navbar-iframe {height:0px; visibility: hidden; display:none}

]]></b:skin>
</head>

<body>
<div id='outer-wrapper'><div id='wrap2'>

<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Free Blogger Templates (Header)' type='Header'/>
</b:section>
</div>
<div id='center'>
<div id='content-wrapper'>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
</div>

<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>

</div> <!-- end content-wrapper -->
</div> <!--end center-->
<div class='footer section' id='footer'><div id="footer-wrapper">
Design by: <a title="Blogger Templates" href="http://www.finalsense.com/services/blog_templates/" shape="rect">FinalSense</a>
</div>
</div>

</div></div> <!-- end outer-wrapper -->
</body>
</html>


Chayote


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[
/* --- * Blogger Template Style---- * Name: a coyote chase---- *Designer: J.Aghili----------- * URL: www.finalsense.com ------ * Date: December 2007 ----- */
/* Variable definitions
====================

<Variable name="textcolor" description="Text Color"
  type="color" default="#369">

<Variable name="PageBgColor" description="Page Background Color"
  type="color" default="#F4BC6C">

<Variable name="pagetitlecolor" description="Page Header Color"
  type="color" default="#f90">

<Variable name="datecolor" description="Date Header Color"
  type="color" default="#f90">

<Variable name="titlecolor" description="Post Title Color"
  type="color" default="#f90">

<Variable name="titlehovercolor" description="Post Title Hover Color"
  type="color" default="#c11717">

<Variable name="footercolor" description="Post Footer Color"
  type="color" default="#999">

<Variable name="sidebartextcolor" description="Sidebar Text Color"
  type="color" default="#f90">

<Variable name="sidebarcolor" description="Sidebar Title Color"
  type="color" default="#eddeb5">

<Variable name="sidebarlink" description="Sidebar Link Color"
  type="color" default="#f93">

<Variable name="sidebarhover" description="Sidebar Hover Color"
  type="color" default="#069">

<Variable name="linkcolor" description="Link Color"
  type="color" default="#c11717">

<Variable name="linkhover" description="Link Hover Color"
  type="color" default="#369">

<Variable name="visitedlinkcolor" description="Visited Link Color"
  type="color" default="#c11717">

<Variable name="descriptioncolor" description="Description Color"
  type="color" default="#fff">

<Variable name="Commentscolor" description="Comments Text Color"
  type="color" default="#555">

<Variable name="bodyfont" description="Text Font"
  type="font" default="normal normal 82% Verdana, sans-serif">

<Variable name="pagetitlefont" description="Page Header Font"
  type="font" default="normal bold 330% 'Times New Roman','Georgia'">

<Variable name="titlefont" description="Post Title Font"
  type="font" default="normal bold 100% 'Times New Roman','Georgia'">

<Variable name="sidebarheaderfont" description="Sidebar Title Font"
  type="font" default="normal bold 140% 'Times New Roman','Georgia'">

<Variable name="sidebarfont" description="Sidebar Text Font"
  type="font" default="normal normal 91% 'Verdana','Arial'">

<Variable name="descriptionfont" description="Description Font"
  type="font" default="normal normal 85% 'Verdana','Arial'">
*/
/* ---( page defaults )--- */
body { margin: 0px;  padding: 0px;  text-align: left;  font:$bodyfont; color:$textcolor; background:$PageBgColor; }
blockquote {  margin: 0 0 0 30px;  padding: 0px 0 0 20px;  font-size: 88%;  line-height: 1.5em; }
blockquote p {  margin-top: 0;  }
abbr, acronym {  cursor: help;  font-style: normal;  }
code {  color: #f63;  }
hr {  display: none;  }
img {  border: none;  }

/* unordered list style */
ul {list-style: none;  margin-left: 7px;  padding: 0;}
li {list-style: none;  padding-left: 8px;  margin-bottom: 3px;}

/* links */
a:link {color: $linkcolor; text-decoration: none;}
a:visited {color: $visitedlinkcolor; text-decoration: none;}
a:hover {  color: $linkhover; text-decoration: none;}
a:active { color: $visitedlinkcolor; text-decoration: none;}

/* ---( layout structure )---*/
#outer-wrapper {width:847px; margin: 0px auto;  text-align: justify; }
#content-wrapper { margin: 0px; /* to avoid the border image */  width: 100%;}
#main { float:right;  width:520px;  margin: 0px; padding-right:45px;  line-height: 1.2em;  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */  }
#sidebar { float:left; width:215px;  padding-left:30px; font: $sidebarfont; color: $sidebartextcolor; line-height: 1.4em;  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */  }
#center {background:#fff url('http://lh4.google.com/jvdmds/R19kR7oNgQI/AAAAAAAABAc/5wMC5V3VXY8/a-coyote-chase-2.jpg') repeat-y top left;}

/* ---( header and site name )--- */
#header-wrapper { margin: 0px; padding: 0px}
#header {height:396px; overflow: hidden; width:847px; color: $pagetitlecolor;   background: url('http://lh5.google.com/jvdmds/R19jcLoNgII/AAAAAAAAA_E/Tbdv9QXI4pY/a-coyote-chase-1.jpg') no-repeat top left;  }
#header h1 {width:370px; font: $pagetitlefont; margin:80px 20px 5px 440px; padding:5px; filter: glow(color=#000000,Strength=5); text-align:left; }
#header h1 a {text-decoration: none;  color: $pagetitlecolor;}
#header h1 a:hover {color: $descriptioncolor;}
#header .description {margin:-10px 20px 5px 440px; text-align:left;  width:370px; font: $descriptionfont;  color: $descriptioncolor; }

/* ---( main column )--- */
h2.date-header {font-size: 73%; color: $datecolor; margin:0px; text-align: left; }
.post h3 { text-align: left; font: $titlefont;  color: $titlecolor; border-top: 1px solid #f90; border-bottom: 1px solid #f90; }
.post {padding:0px;}
.post h3 a {color: $titlecolor; text-decoration: none;}
.post h3 a:hover {color: $titlehovercolor;  text-decoration: none; }
.post-footer {height:30px;  margin:0px; text-align: right;  font-size: 88%;  color:$footercolor; }
.post img {padding: 6px;  border-top: 1px solid #ddd;  border-left: 1px solid #ccc;  border-bottom: 1px solid #c0c0c0;  border-right: 1px solid #c0c0c0;  }
.feed-links {clear: both;  line-height: 2.5em; color:$footercolor; border-top: 1px solid #f90; }
.blog-feeds {text-align: right; color:$footercolor;}
#blog-pager-newer-link {float: left; }
#blog-pager-older-link {float: right; }
#blog-pager {text-align: center;}

/* comment styles */
#comments {  padding-top: 10px;  font-size: 88%;  line-height: 1.5em;  color: $Commentscolor;}
#comments h4 {  margin: 20px 0 15px 0;  padding: 8px 0 0 40px;  font-family: "Lucida Grande", "Trebuchet MS";  font-size: 105%;  color: $Commentscolor;  height: 29px !important; /* for most browsers */  height /**/:37px; /* for IE5/Win */  }
#comments ul {  margin-left: 0;  }
#comments li {  background: none;  padding-left: 0;  }
.comment-body {  padding: 0 10px 0 25px;  }
.comment-body p {  margin-bottom: 0;  }
.comment-author {  margin: 4px 0 0 0;  padding: 0 10px 0 60px;  color: #999;    }
.comment-footer {  border-bottom: 1px solid #ddd;  padding-bottom: 1em;}
.deleted-comment {  font-style:italic;  color:gray;  }

/* ---( sidebar )--- */
.sidebar h2 { margin: 0 0 0 0;  padding: 10px 0 0 0px; font: $sidebarheaderfont;  color: $sidebarcolor;  height: 32px;  height: 32px !important; /* for most browsers */  height /**/:57px; /* for IE5/Win */  }
.sidebar .widget { margin: 0;  padding: 0 0 10px 10px; }
.sidebar a {color: $sidebarlink; text-decoration: none;}
.sidebar a:hover {color: $sidebarhover;}
.sidebar li { }
.profile-textblock { margin: 0.5em 0;  line-height: 1.6em;}
.profile-img {float: right;  margin:3px;  border: 1px solid #ddd;  padding: 3px;}

/* ---( footer )--- */
.clear { /* to fix IE6 padding-top issue */  clear: both;  }
#footer {margin: 0; width:847px; height:224px; background: url('http://lh4.google.com/jvdmds/R19jc7oNgJI/AAAAAAAAA_M/NcQzHGwsDN0/a-coyote-chase-3.jpg') no-repeat top left; text-align:center; color: #c11817; }
#footer-wrapper {margin: 0; font-size: 75%; clear: both; }
#footer-wrapper a { color: #c11817; text-decoration: none; line-height:224px;}
#footer-wrapper a:hover{  color: #369;  text-decoration: none;}

/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper,
body#layout #main,
body#layout #sidebar {padding-top: 0;  margin-top: 0;}
body#layout #outer-wrapper,body#layout #content-wrapper {padding-top: 0}
body#layout #sidebar {margin-right: 0;}
body#layout #header,body#layout #footer,
body#layout #main {padding: 0;}
body#layout #content-wrapper {margin: 0px;}
#navbar-iframe {height:0px; visibility:hidden; display:none}

]]></b:skin>
</head>

<body>
<div id='outer-wrapper'><div id='wrap2'>

<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Free Blogger Templates (Header)' type='Header'/>
</b:section>
</div>
<div id='center'>
<div id='content-wrapper'>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
</div>

<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>

</div> <!-- end content-wrapper -->
</div> <!--end center-->
<div class='footer section' id='footer'><div id="footer-wrapper">
Design by:  <a title="Blogger Templates" href="http://www.finalsense.com/services/blog_templates/" shape="rect">FinalSense</a>
</div>
</div>

</div></div> <!-- end outer-wrapper -->
</body>
</html>


Hellokitty


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[
/* --- * Blogger Template Style---- * Name: Hello Kitty----- *Designer: J.aghili ----- * URL: www.finalsense.com ------ * Date: 2007 July ----- */
/* Variable definitions
====================

<Variable name="textcolor" description="Text Color"
type="color" default="#555" value="#555555">

<Variable name="PageBgColor" description="Page Background Color"
type="color" default="#fff" value="#ffffff">

<Variable name="pagetitlecolor" description="Page Header Color"
type="color" default="#f5519d" value="#f5519d">

<Variable name="datecolor" description="Date Header Color"
type="color" default="#EDDEB5" value="#EDDEB5">

<Variable name="titlecolor" description="Post Title Color"
type="color" default="#fcf" value="#ffccff">

<Variable name="titlehovercolor" description="Post Title Hover Color"
type="color" default="#008000" value="#008000">

<Variable name="footercolor" description="Post Footer Color"
type="color" default="#a7d455" value="#a7d455">

<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#ffc000" value="#ffc000">

<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#fcf" value="#ffccff">

<Variable name="sidebarlink" description="Sidebar Link Color"
type="color" default="#ffc000" value="#ffc000">

<Variable name="sidebarhover" description="Sidebar Hover Color"
type="color" default="#a7d455" value="#a7d455">

<Variable name="linkcolor" description="Link Color"
type="color" default="#369" value="#336699">

<Variable name="linkhover" description="Link Hover Color"
type="color" default="#f63" value="#ff6633">

<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#369" value="#336699">

<Variable name="descriptioncolor" description="Description Color"
type="color" default="#008000" value="#008000">

<Variable name="Commentscolor" description="Comments Text Color"
type="color" default="#666" value="#666666">

<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 85% Verdana, sans-serif" value="normal normal 85% Verdana, sans-serif">

<Variable name="pagetitlefont" description="Page Header Font"
type="font" default="normal normal 270% 'Georgia','Times New Roman'" value="normal bold 270% 'Georgia','Times New Roman'">

<Variable name="titlefont" description="Post Title Font"
type="font" default="normal bold 100% 'Georgia','Times New Roman'" value="normal bold 100% 'Georgia','Times New Roman'">

<Variable name="sidebarheaderfont" description="Sidebar Title Font"
type="font" default="normal bold 110% 'Georgia','Times New Roman'" value="normal bold 110% 'Georgia','Times New Roman'">

<Variable name="sidebarfont" description="Sidebar Text Font"
type="font" default="normal normal 80% 'Verdana','Arial'" value="normal normal 100% 'arial','tahoma'">

<Variable name="descriptionfont" description="Description Font"
type="font" default="normal normal 80% 'Verdana','Arial'" value="normal normal 95% 'Verdana','Arial'">
*/
/* ---( page defaults )--- */
body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background: #fff url('http://lh3.google.com/jvdmds/RoIBAQl7FtI/AAAAAAAAAWQ/IxbtuB7W7fI/hello-kitty-bg.jpg'); }
blockquote { margin: 0 0 0 30px; padding: 0px 0 0 20px; font-size: 88%; line-height: 1.5em; }
blockquote p { margin-top: 0; }
abbr, acronym { cursor: help; font-style: normal; }
code { color: #f63; }
hr { display: none; }
img { border: none; }

/* unordered list style */
ul { list-style: none; margin-left: 7px; padding: 0; }
li { list-style: none; padding-left: 8px; margin-bottom: 3px; }

/* links */
a:link { color: $linkcolor; text-decoration: none; }
a:visited { color: $visitedlinkcolor; text-decoration: none; }
a:hover { color: $linkhover; text-decoration: none; }
a:active { color: $visitedlinkcolor; text-decoration: none; }

/* ---( layout structure )---*/
#outer-wrapper { width: 909px; margin: 0px auto 0; text-align: justify; font: normal normal 100% Verdana, sans-serif; }
#content-wrapper { margin-left: 0px; /* to avoid the border image */ width: 100%; }
#main { float: right; width: 510px; margin: 0px; padding-right:55px; line-height: 1.5em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
#sidebar { float: left; width: 272px; padding-left: 33px; font: $sidebarfont; color: $sidebartextcolor; line-height: 1.4em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
#center {background: url('http://lh3.google.com/jvdmds/RoIBAQl7FsI/AAAAAAAAAWI/VVk4UznM4lI/hello-kitty2.jpg') repeat-y top left;}

/* ---( header and site name )--- */
#header-wrapper { margin: 0; padding: 0px}
#header { height:396px; width:909; color: $pagetitlecolor; background: url('http://lh6.google.com/jvdmds/RoIAzAl7FrI/AAAAAAAAAWA/yklvRHJwTFU/hello-kitty1.jpg') no-repeat top left; }
#header h1 { width: 330px; font: $pagetitlefont; padding: 160px 0px 0px 30px; filter: glow(color=#000000,Strength=5); text-align: left; }
#header h1 a { text-decoration: none; color: $pagetitlecolor; }
#header h1 a:hover { color: #fff; }
#header .description { margin:0px 0px 0px 30px; text-align: left; padding:0px; width:340px; font: $descriptionfont; color: $descriptioncolor; }

/* ---( main column )--- */
h2.date-header { margin: 0; padding-left: 10px; font-size: 70%; color: $datecolor;}
.post h3 { margin: 0; font: $titlefont; color: $titlecolor; border-bottom: 1px solid #fcf; border-top: 1px solid #fcf;}
.post { margin-left:0; margin-right:0; margin-top:0; margin-bottom:1em; padding-left:10px; padding-right:0; padding-top:0; padding-bottom:1em }
.post h3 a {color: $titlecolor; text-decoration: none;}
.post h3 a:hover { color: $titlehovercolor; text-decoration: none; }
.post-footer { margin: 0; padding: 0px; font-size: 88%; color:$footercolor;}
.post img { padding: 6px; border-top: 1px solid #ddd; border-left: 1px solid #cccccc; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; }
.feed-links { clear: both; line-height: 2.5em;}
.blog-feeds { text-align: right;}
#blog-pager-newer-link { float: right; }
#blog-pager-older-link { float: left; }
#blog-pager { text-align: center; }

/* comment styles */
#comments { padding-top: 10px; font-size: 85%; line-height: 1.5em; color: $Commentscolor;}
#comments h4 { margin: 20px 0 15px 0; padding: 8px 0 0 40px; font-family: "Lucida Grande", "Trebuchet MS"; font-size: 105%; color: $Commentscolor; height: 29px !important; /* for most browsers */ height /**/:37px; /* for IE5/Win */ }
#comments ul { margin-left: 0; }
#comments li { background: none; padding-left: 0; }
.comment-body { padding: 0 10px 0 25px; }
.comment-body p { margin-bottom: 0; }
.comment-author { margin: 4px 0 0 0; padding: 0 10px 0 60px; color: #999; }
.comment-footer { border-bottom: 1px solid #ddd; padding-bottom: 1em;}
.deleted-comment { font-style:italic; color:gray; }

/* ---( sidebar )--- */
.sidebar h2 { margin: 0 0 0 0; padding: 10px 0 0 0px; font: $sidebarheaderfont; color: $sidebarcolor; height: 32px; height: 32px !important; /* for most browsers */ height /**/:57px; /* for IE5/Win */ }
.sidebar .widget { margin: 0; padding: 0 0 10px 10px; }
.sidebar a {color: $sidebarlink; text-decoration: none;}
.sidebar a:hover {color: $sidebarhover; }
.sidebar li { padding-left: 5px; }
.profile-textblock { margin:.5em 0 .5em; }
.profile-img { float: left; margin: 0 5px 5px 0; border: 1px solid #ddd; padding: 4px;}

/* ---( footer )--- */
.clear { /* to fix IE6 padding-top issue */ clear: both; }
#footer-wrapper { margin: 0; padding: 0 0 0 0; font-size: 85%; }
#footer { margin: 0; width: 909px; height:122px; padding: 0px; background: url('http://lh5.google.com/jvdmds/RoIBLwl7FwI/AAAAAAAAAWo/H4BRY-khdc0/hello-kitty3.jpg') no-repeat top left; }


/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper,
body#layout #main,
body#layout #sidebar { padding-top: 0; margin-top: 0;}
body#layout #outer-wrapper,body#layout #content-wrapper { width: 100%;}
body#layout #sidebar { margin-right: 0; margin-bottom: 1em; }
body#layout #header,body#layout #footer,
body#layout #main { padding: 0; }
body#layout #content-wrapper { margin: 0px; }
#navbar-iframe { height:0px; visibility:hidden; display:none }


]]></b:skin>
</head>
<body>
<div id='outer-wrapper'><div id='wrap2'>

<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Free Blogger Templates (Header)' type='Header'/>
</b:section>
</div>
<div id='center'>
<div id='content-wrapper'>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='Feed1' locked='false' title='Technology Headlines' type='Feed'/>
<b:widget id='HTML1' locked='false' title='Provider' type='HTML'/>
</b:section>
</div>

<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>

</div> <!-- end content-wrapper -->
</div> <!--end center-->
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

</div></div> <!-- end outer-wrapper -->
</body>
</html>


Spongsbob



<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[
/* --- * Blogger Template Style---- * Name: Sponge Bob----- *Designer: J.Aghili ----- * URL: www.finalsense.com ------ * Date: 2007 October ----- */
/* Variable definitions
====================

<Variable name="textcolor" description="Text Color"
type="color" default="#666">

<Variable name="PageBgColor" description="Page Background Color"
type="color" default="#256299">

<Variable name="pagetitlecolor" description="Page Header Color"
type="color" default="#369">

<Variable name="datecolor" description="Date Header Color"
type="color" default="#999">

<Variable name="titlecolor" description="Post Title Color"
type="color" default="#FCD699">

<Variable name="titlehovercolor" description="Post Title Hover Color"
type="color" default="#f93">

<Variable name="footercolor" description="Post Footer Color"
type="color" default="#7ca7d1">

<Variable name="sidebartextcolor" description="Sidebar Text Color"
type="color" default="#369">

<Variable name="sidebarcolor" description="Sidebar Title Color"
type="color" default="#f0a8ac">

<Variable name="sidebarlink" description="Sidebar Link Color"
type="color" default="#369">

<Variable name="sidebarhover" description="Sidebar Hover Color"
type="color" default="#f90">

<Variable name="linkcolor" description="Link Color"
type="color" default="#369">

<Variable name="linkhover" description="Link Hover Color"
type="color" default="#f93">

<Variable name="visitedlinkcolor" description="Visited Link Color"
type="color" default="#369">

<Variable name="descriptioncolor" description="Description Color"
type="color" default="#666">

<Variable name="Commentscolor" description="Comments Text Color"
type="color" default="#666">

<Variable name="bodyfont" description="Text Font"
type="font" default="normal normal 82% Verdana, sans-serif">

<Variable name="pagetitlefont" description="Page Header Font"
type="font" default="normal bold 310% 'Georgia','Times New Roman'">

<Variable name="titlefont" description="Post Title Font"
type="font" default="normal bold 100% 'Georgia','Times New Roman'">

<Variable name="sidebarheaderfont" description="Sidebar Title Font"
type="font" default="normal bold 105% 'Georgia','Times New Roman'">

<Variable name="sidebarfont" description="Sidebar Text Font"
type="font" default="normal normal 90% 'Verdana','Arial'">

<Variable name="descriptionfont" description="Description Font"
type="font" default="normal normal 82% 'Verdana','Arial'">
*/
/* ---( page defaults )--- */
body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background:$PageBgColor; }
blockquote { margin: 0 0 0 30px; padding: 0px 0 0 20px; font-size: 88%; line-height: 1.5em; }
blockquote p { margin-top: 0; }
abbr, acronym { cursor: help; font-style: normal; }
code { color: #f63; }
hr { display: none; }
img { border: none; }

/* unordered list style */
ul { list-style: none; margin-left: 7px; padding: 0; }
li { list-style: none; padding-left: 8px; margin-bottom: 3px; }

/* links */
a:link { color: $linkcolor; text-decoration: none; }
a:visited { color: $visitedlinkcolor; text-decoration: none; }
a:hover { color: $linkhover; text-decoration: none; }
a:active { color: $visitedlinkcolor; text-decoration: none; }

/* ---( layout structure )---*/
#outer-wrapper {width: 830px; margin: 0px auto; text-align: justify; }
#content-wrapper { margin: 0px; /* to avoid the border image */ width: 100%; }
#main { float: right; width: 520px; margin: 0px; padding-right:35px; line-height: 1.2em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
#sidebar { float: left; width: 225px; padding-left:25px; font: $sidebarfont; color: $sidebartextcolor; line-height: 1.4em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
#center {background:#fff url('http://lh3.google.com/jvdmds/RwSTQKZypUI/AAAAAAAAAuk/OwIO5mvk-LA/spb-2.jpg') repeat-y top left;}

/* ---( header and site name )--- */
#header-wrapper { margin: 0px; padding: 0px}
#header { height:274px; overflow: hidden; width:830px; color: $pagetitlecolor; background:#dde3c7 url('http://lh5.google.com/jvdmds/RwSJ0qZypGI/AAAAAAAAAsc/-bH54GsTtIc/spongebob-1.jpg') no-repeat top left; }
#header h1 { width: 760px; font: $pagetitlefont; margin:190px 15px 0px 40px; padding: 5px; filter: glow(color=#ffffff,Strength=7); text-align:left; }
#header h1 a { text-decoration: none; color: $pagetitlecolor; }
#header h1 a:hover { color: $descriptioncolor;}
#header .description {margin:-5px 15px 5px 40px; text-align:left; width:760px; font: $descriptionfont; color: $descriptioncolor; }

/* ---( main column )--- */
h2.date-header {font-size: 70%; color: $datecolor; margin:0px; text-align: left; }
.post h3 { text-align: left; font: $titlefont; color: $titlecolor; border-top: 1px solid #FCD699; border-bottom: 1px solid #FCD699;}
.post {padding:0px;}
.post h3 a {color: $titlecolor; text-decoration: none;}
.post h3 a:hover { color: $titlehovercolor; text-decoration: none; }
.post-footer {height:57px; margin:0px; text-align: right; font-size: 88%; color:$footercolor; }
.post img { padding: 6px; border-top: 1px solid #ddd; border-left: 1px solid #ccc; border-bottom: 1px solid #c0c0c0; border-right: 1px solid #c0c0c0; }
.feed-links { clear: both; line-height: 2.5em; color:$footercolor;border-top: 1px solid #FCD699; }
.blog-feeds { text-align: right; color:$footercolor;}
#blog-pager-newer-link { float: left; }
#blog-pager-older-link { float: right; }
#blog-pager { text-align: center; }

/* comment styles */
#comments { padding-top: 10px; font-size: 85%; line-height: 1.5em; color: $Commentscolor;}
#comments h4 { margin: 20px 0 15px 0; padding: 8px 0 0 40px; font-family: "Lucida Grande", "Trebuchet MS"; font-size: 105%; color: $Commentscolor; height: 29px !important; /* for most browsers */ height /**/:37px; /* for IE5/Win */ }
#comments ul { margin-left: 0; }
#comments li { background: none; padding-left: 0; }
.comment-body { padding: 0 10px 0 25px; }
.comment-body p { margin-bottom: 0; }
.comment-author { margin: 4px 0 0 0; padding: 0 10px 0 60px; color: #999; }
.comment-footer { border-bottom: 1px solid #ddd; padding-bottom: 1em;}
.deleted-comment { font-style:italic; color:gray; }

/* ---( sidebar )--- */
.sidebar h2 { margin: 0 0 0 0; padding: 10px 0 0 0px; font: $sidebarheaderfont; color: $sidebarcolor; height: 32px; height: 32px !important; /* for most browsers */ height /**/:57px; /* for IE5/Win */ }
.sidebar .widget { margin: 0; padding: 0 0 10px 10px; }
.sidebar a {color: $sidebarlink; text-decoration: none;}
.sidebar a:hover {color: $sidebarhover; }
.sidebar li { }
.profile-textblock { margin:.5em 0 .5em; }
.profile-img { float: left; margin: 0 5px 5px 0; border: 1px solid #ddd; padding: 4px;}

/* ---( footer )--- */
.clear { /* to fix IE6 padding-top issue */ clear: both; }
#footer-wrapper {margin: 0px; padding:0px; font-size: 73%; clear: both; }
#footer {margin: 0; width:830px; height:124px; background: url('http://lh3.google.com/jvdmds/RwSJ1KZypHI/AAAAAAAAAsk/sCYx6zS8ewo/spongebob-3.jpg') no-repeat top left; text-align:center; color: #bbb; }
#footer-wrapper a { color: #bbb; text-decoration: none; line-height:124px;}
#footer-wrapper a:hover{ color: #ffc; text-decoration: none;}

/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper,
body#layout #main,
body#layout #sidebar { padding-top: 0; margin-top: 0;}
body#layout #outer-wrapper,body#layout #content-wrapper {padding-top: 0;}
body#layout #sidebar { margin-right: 0; margin-bottom: 1em; }
body#layout #header,body#layout #footer,
body#layout #main { padding: 0; }
body#layout #content-wrapper { margin: 0px; }
#navbar-iframe { height:0px; visibility:hidden; display:none }




]]></b:skin>
</head>

<body>
<div id='outer-wrapper'><div id='wrap2'>

<!-- skip links for text browsers -->
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='center'>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Free Blogger Templates (Header)' type='Header'/>
</b:section>
</div>

<div id='content-wrapper'>

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
</div>

<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>

</div> <!-- end content-wrapper -->

<div class='footer section' id='footer'><div id="footer-wrapper">
Design by: <a title="Blogger Templates" href="http://www.finalsense.com/services/blog_templates/" shape="rect">FinalSense</a>
</div>
</div>
</div> <!--end center-->
</div></div> <!-- end outer-wrapper -->
</body>
</html>

0 komentar:

Post a Comment