smarttouch : Effect 2 « Templates « HTML / CSS






smarttouch

  

<!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">
<head profile="http://gmpg.org/xfn/11">
<title>SmartTouch - About Us</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type='text/css'>
/*
Theme Name: Smart Touch
Theme URI: http://freethemelayouts.com/
Description: Designed by <a href="http://freethemelayouts.com">FreeThemeLayouts</a>.<br /> This work is licensed <a href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-Share Alike 3.0 License.</a> This means you may use it and make any changes you like. However, credit links must remain on footer for legal use.
Version: 1
Author: FreeThemeLayout/DreamTemplate
Author URI: http://www.freethemelayouts.com/
*/

body { background: #f4fafd url(smarttouch-images/bg.jpg) repeat-x top; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 12px; padding: 0px; margin: 0px; color:#35383d;}

html { padding: 0; margin: 0;}

a:link { text-decoration: none; color : #2a688c; border: 0px;}
a:active { text-decoration: underline; color : #2a688c; border: 0px;}
a:visited { text-decoration: none; color : #2a688c; border: 0px;}
a:hover  { text-decoration: underline; color : #2a688c; border: 0px;} 
a:focus { outline: none;}

.clr { clear:both;}

h1, h2, h3, h4 {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;}

img { padding: 0px; margin: 0px; border: none; text-align: center;}
hr { border-left:0px solid #abb0b5; border-right:0px solid #abb0b5; border-top:1px dotted #abb0b5; border-bottom:0px solid #abb0b5; height : 1px;  }

form { padding: 0px; margin: 0px;}
input { font-family: 'Verdana'; color: #282b31; font-size: 11px;}
textarea { font-family: 'Verdana'; color: #282b31; font-size: 11px;}
select { font-family: 'Verdana'; color: #282b31; font-size: 11px;}

/* Header +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#bgcontainer { width: 1039px; margin: 0 auto;}

/**/ * html .Header { height: 238px;} /* */ 

.Syn { height:56px; background: url(smarttouch-images/ht.jpg) no-repeat right;}
.Syn ul { margin: 0px; padding: 17px 0px 0px 0px; float: right;}
.Syn li { background: url(smarttouch-images/SynIco.png) no-repeat left center; margin: 0px 5px 0px 0px; padding: 3px 0px 3px 15px; list-style-type: none; font-size: 12px; color:#FFFFFF; display: inline; font-weight: normal;}
.Syn li a {color:#fff; }
.Syn li a:visited {color:#fff; }
.Syn li a:hover {color:#fff; }

.Header { width: 1039px; margin: 0 auto; position:relative; min-height: 238px; background: #fcfdfe url(smarttouch-images/hi.jpg) no-repeat 0 56px;}

.Logo { float: left;}

.Header .LogoText h1 { font-size: 32px; line-height: 55px; letter-spacing: -1px; padding: 0px; margin: 0px; font-weight: normal; font-family: Arial, Helvetica, sans-serif;position: absolute; top: 105px; width: 300px; left: 70px;}
.Header .LogoText a { color:#5c9dc1; text-decoration: none; }
.Header .LogoText a:visited { color:#5c9dc1; text-decoration: none; }
.Header .LogoText a:hover { color:#5c9dc1; text-decoration: none; }

.Header .Desc { position: absolute; top: 155px; color:#494d50; font-size: 12px; line-height: 14px; font-weight: normal; font-family: "Trebuchet MS"; padding: 0px; margin: 0px; text-indent: 80px; }


/* Menu +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Menu { padding: 0px 0px 0px 580px; float: left; position: absolute;  top: 128px; }
.Menu em { display: none}
.Menu ul { list-style: none; margin: 0px; padding: 0px;}
.Menu ul li { padding: 0px; margin: 0px; display: inline; font-size: 14px; line-height: 14px; font-weight: normal; font-family: "Trebuchet MS"; }

.Menu ul li a { padding: 5px 10px; float: left; color: #5c9dc1; text-decoration:underline;}
.Menu ul li a:hover { color:#5c9dc1; text-decoration: none;}

.Menu ul li ul { display: none;}

/* Search ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/**/ * html .Search  { } /**/ 
.Search {  right: 0px; padding: 73px 20px 20px 870px;  }
.Search form { padding: 0px; margin: 0px; }
.Search input { color: #FFFFFF; font-size: 11px;}
.Search  input.keyword { background: url(smarttouch-images/search_box.gif) no-repeat; border: none; padding: 1px 0px 7px 7px; width: 122px; height: 22px; } 
.Search  input.search { width: 25px; height: 22px; background: url(smarttouch-images/search_butt.gif) no-repeat;}
.Search .bt { padding: 0px; margin: 129px 0px 0px 0px !important; margin: 130px 0px 0px 0px; top: 0; background: none; position: absolute; right: 20px; }

/* Container +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.CON { width: 1039px; float: left; background: #fff url(smarttouch-images/line.gif) no-repeat bottom; padding:0 0 20px 0; }

.SCS { width: 435px; float: left; padding: 0px 15px 0px 15px;}

/* Side Central +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.SC { width: 492px; float: left; padding: 0 0 0 24px;}
.pagetitle { font-size: 18px; line-height: 18px; font-weight: normal; border-bottom: solid 1px #d0c1c1;padding: 15px 0px; margin-top: 0px; color:#000066;}

/* Post +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Post {  padding: 15px 0px; position: relative; clear: left;}

.PostHead { border:0; border-bottom:3px solid #e0e0e0; }
.PostHead h2 { font-size: 18px; line-height: 24px; letter-spacing: -1px; font-weight: normal; padding: 0px 0px 1px 0px; margin: 0px; color:#225d7e;}
.PostHead h2 a { color: #225d7e; text-decoration: none;}
.PostHead h2 a:visited { color: #225d7e; text-decoration: none;}
.PostHead h2 a:hover { color:#225d7e; text-decoration: underline;}

.PostHead h3 { font-size: 14px; line-height: 14px; font-weight: bold; padding: 0px; margin: 0px; color:#000033;}


/**/ * html .PostTime { } /**/ 
.PostTime { padding: 6px 0px; margin: 0px; background: url(smarttouch-images/box.gif) no-repeat; width: 71px; text-align: center; color:#fff; }
.PostTime strong { font-family: Tahoma, Arial; font-weight: normal; font-size: 11px;}
.PostTime .day { }
.PostTime .month { }
.PostTime .year { }

.PostHead small {padding: 0px; margin: 0px; font-size: 11px; line-height: 14px; font-weight: normal;}

.PostAuthor { color:#999; }

.PostCat { color:#999; }
.PostCat a { color:#ffb30f; text-decoration: none; }
.PostCat a:visited { color:#ffb30f; text-decoration: none; }
.PostCat a:hover { color:#999; text-decoration: underline; }

.PostContent { padding: 10px 0px 0px 0px; font-size: 11px; line-height: 1.4em ; color:#575757; font-family:Verdana, Arial, Helvetica, sans-serif;}
.PostContent p { font-size: 13px; line-height: 1.4em; color:#63565f;}
.PostContent p strong {}
.PostContent img {}
.PostContent ol { padding: 10px 0px 10px 25px; margin: 0px; }
.PostContent ol li { padding: 2px 0px 2px 0px; font-size: 12px; line-height: 15px; color:#63565f; }
.PostContent ul { padding: 5px 0px; margin: 0px; }
.PostContent ul li { padding: 2px 0px 2px 15px; list-style-type: none; background: url(smarttouch-images/PostContentLiIco.png) no-repeat left top; font-size: 12px; line-height: 15px; color:#63565f; }
.PostContent blockquote { padding: 10px; margin: 0px; color:#993366; background: #eaf7ff;}
.PostContent blockquote p { font-size: 12px; padding: 0px; margin: 0px; line-height: 15px;}
.PostContent blockquote li { padding: 2px 0px 2px 15px; list-style-type: none; font-size: 12px; line-height: 15px;}
.PostContent blockquote a { color:#2a688c;}
.PostContent blockquote a:visited { color:#2a688c;}
.PostContent blockquote a:hover { color:#2a688c; text-decoration:underline;}

/**/ * html .PostContent p img {} /* */ 
.PostContent p img { max-width: 420px;}

.PostContent img { margin: 0px 10px 10px 0px; float: left; border:solid 1px #495b6b;}


.PostCom { padding-top: 10px; background: url(smarttouch-images/ico.gif) no-repeat left;}
.PostCom ul { padding: 0px; margin: 0px;}
.PostCom li { padding: 5px 0px 5px 35px; margin: 0px 5px 0px 0px; list-style-type: none; display: inline; color:#2a688c; font-size: 14px; } 
.PostCom li a { font-weight: normal; text-decoration: underline; color:#2a688c;} 
.PostCom li a:visited { font-weight: normal; text-decoration: underline; color:#2a688c;}
.PostCom li a:hover { font-weight: normal; text-decoration: none; color:#2a688c;}

.PostCom .Com { background: url(smarttouch-images/PostCom.png) no-repeat left center; }
.PostCom .Tags { padding-left: 0px;}


/* Note ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.Note { padding: 0px; margin: 0px;}
.Note li { padding: 3px 0px 3px 15px; margin: 0px; list-style-type: none; font-size: 12px;}
.NoteRss { background: url(smarttouch-images/NoteRss.png) no-repeat left top;}
.NoteTrackBack { }

/* TrackbackList ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.TrackList { background: #f4ebef url(smarttouch-images/TrackListBottom.gif) no-repeat bottom; padding: 15px; margin-top: 20px; position:relative;}
.TrackListTop { background: #f4ebef url(smarttouch-images/TrackListTop.gif) no-repeat top; position: absolute; top: 0px; left: 0px; width: 455px; height:10px; }
.TrackList h3 { font-size: 14px; font-weight: bold; margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; color:#333366; letter-spacing: -1px; border-bottom: dashed 1px #beb4c1;}
.TrackList ul { padding: 0px; margin: 0px;}
.TrackList li { padding: 0px 0px 0px 10px; margin: 0px; list-style-type: none; font-size: 11px; background:url(smarttouch-images/TrackListIco.gif) no-repeat left top;}
.TrackList li a { color:#cc3366; }

/* Navigation - PlugIn +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Nav { font-size: 11px; padding: 10px 0px; color:#666; font-family: 'Verdana';}
.Nav a { padding: 1px 6px 1px 4px; border-right: solid 1px #666; font-size: 11px;}
.Nav a:visited { padding: 1px 6px 1px 4px; border-right: solid 1px #666;}
.Nav a:hover { padding: 1px 6px 1px 4px; border-right: solid 1px #666; text-decoration: none;}
.Nav span { padding: 1px 6px 1px 4px; color:#666; border-right: solid 1px #666; }
.Nav .on { padding: 1px 6px 1px 4px; border-right: solid 1px #666; font-size: 11px; color:#003366;}

/* Comments ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Comments { margin: 20px 0px 0px 0px; position: relative;}
.Comments h3 { font-size: 16px; letter-spacing: -1px; margin: 0px 0px 5px 0px; padding: 10px 0px; color:#4c809e; border-bottom: solid 2px #15567b;}

/* Comments List  ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.List ol { padding: 0px; margin: 0px;}
.List li { position: relative; padding: 5px 0px; margin: 10px 0px; list-style-type: none;}

/**/ * html .List .LGrav { right: 30px;} /* */ 
.List .LGrav { position: absolute; right: 0px; top: 10px;}
.List .LGrav img { border: solid 1px #ccc; padding: 2px; background: #fff;}

.List .LUsr { margin: 0px; padding: 0px; font-size: 11px; line-height: 12px; color:#4c809e;}
.List .LUsr a { color:#999; text-decoration: none;}
.List .LUsr strong { font: bold 16px "Trebuchet MS", sans-serif; letter-spacing: -1px; color:#666;}
.List .LUsr strong a { color:#4c809e; text-decoration: none;}

.List .LCon { margin: 10px 0px 0px 0px; padding: 0px; font-size: 12px; line-height: 16px; border-top: solid 1px #ccc;}
.List .LCon p { margin: 0px; padding: 5px 0px; font-size: 12px; line-height: 16px;}

.List .Author { background:#fff; }



/* Comments Form ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Form .Email { }

.Form {  padding: 0px 0px 10px 0px; position: relative; margin: 0px; font-family: 'Verdana';}
.Form form { margin: 0px; padding: 0px;}
.Form a { text-decoration: underline;}
.Form p { padding: 0px 0px 2px 0px; margin: 0px; color:#666; }
.Form p small strong { font-weight: bold; color:#4c809e;}
.Form p small { font-size: 11px; display: block; padding: 6px 0px; color:#000;}
.Form .TextField { color:#225d7e; background: #e9f8ff; border: solid 1px #d5e7f0; padding: 6px 6px 6px 30px; font-size: 12px; display: block;}
.Form .TextArea { color:#225d7e; background: #e9f8ff; border: solid 1px #d5e7f0; padding: 6px; font-size: 12px;}
.Form input.SubmitComment { }
.Form input.SubmitComment:hover { }
.Form input.SubmitCommentIE { }


/* Side Right +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.SR { width: 523px; float: right; position: relative; padding: 0px;}


/* Side Right Left +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.SRL { width: 149px; float: left; position: relative; padding: 14px 0 0 45px;}
.SRL .banner h2 { color:#225d7e; font-size: 18px; padding: 0px 0px 5px 0px; margin: 0px;}
.SRL .banner img { padding:10px 0 5px 0;}
.SRL .widget h2 { color:#225d7e; font-size: 14px; border-bottom: solid 1px #ffe0bf; padding: 0px 0px 5px 0px; margin: 0px;}
.SRL .widget ul { margin: 0px; padding: 0px;}
.SRL .widget li { margin: 0px; padding: 0px; list-style-type: none; }
.SRL .widget a { color:#cc0000;}
.SRL .widget a:visited { color:#cc0000;}
.SRL .widget a:hover { color:#ff6600; text-decoration: none;}

.SRL .widget_tag_cloud { font-family: "Trebuchet MS"; line-height: 22px;}

.SRL .widget_calendar table { width: 100%;}
.SRL .widget_calendar table td { text-align: center; padding: 3px; }
.SRL .widget_calendar caption { background: #ffe0bf; padding: 5px 0px;}
.SRL .widget_calendar #today { background: #ffe0bf;}

.SRL .widget_search #s { width: 160px; border: solid 1px #cebea9; padding: 3px; margin-bottom: 5px;}

.SRL .widget_flickrrss { height: auto; float: left; width: 300px; border-bottom: 10px solid #fff;}
.SRL .widget_flickrrss h2 { margin-bottom: 10px;}
.SRL .widget_flickrrss ul { padding: 0px; margin: 0px; clear: left;}
.SRL .widget_flickrrss li { background: url(smarttouch-images/SRL-widgetflickrbkg.gif) no-repeat left top; list-style-type: none; display: inline; padding: 7px; float: left;}
.SRL .widget_flickrrss li a img { background: #fff; padding: 3px; border: solid 1px #cebea9; width: 48px; height: 48px;}
.SRL .widget_flickrrss li a:visited img { background: #fff; padding: 3px; border: solid 1px #cebea9; width: 48px; height: 48px;}
.SRL .widget_flickrrss li a:hover img { background: #660000; padding: 3px; border: solid 1px #660000;}

/* About Blog ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.About { background: #ff6600 url(smarttouch-images/AboutBkg.gif) no-repeat left bottom; padding: 0px 20px 10px 20px; color:#fff;}
.About h2 { padding: 0px; margin: 0px; font-size: 18px; font-weight: normal;}
.About p { padding: 5px 0px; margin: 0px; font-size: 13px; line-height: 16px;}

/* About Articles/Comments ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.Recent { background: #062a3f url(smarttouch-images/fbb.jpg) repeat-x left top; width: 1009px; margin: 0 auto; padding: 10px 0px 10px 31px;}

.TabContent { padding: 10px; float:left; width:30%;}
.TabContent h2 { font: normal 20px Arial, Helvetica, sans-serif; color: #FFFFFF; padding:0 0 10px 0; margin:0 0 10px 0; border-bottom:5px solid #0b4263;}
.TabContent ul { padding: 0px 0 0 15px; margin: 0px; font:normal 11px Tahoma, Arial; color:#FFFFFF;}
.TabContent li { padding: 1px 0px 1px 0px; margin: 0px;}
.TabContent li a { color:#FFFFFF; text-decoration: underline;}
.TabContent li a:visited { color:#FFFFFF; text-decoration: none;}
.TabContent li a:hover { color:#4477aa; text-decoration: none;}

.Recent .widget_flickrrss { padding: 10px; float:left; width:30%;}
.Recent .widget_flickrrss h2 { font: normal 20px Arial, Helvetica, sans-serif; color: #FFFFFF; padding:0 0 10px 0; margin:0 0 10px 0; border-bottom:5px solid #0b4263;}
.Recent .widget_flickrrss ul { padding: 0px 0 0 15px; margin: 0px; font:normal 11px Tahoma, Arial; color:#FFFFFF; list-style:none;}
.Recent .widget_flickrrss li { padding: 1px 1px 1px 1px; margin: 0px; float: left;}
.Recent .widget_flickrrss li a img { background: #fff; padding: 2px; border: solid 1px #cebea9; width: 48px; height: 48px;}
.Recent .widget_flickrrss li a:visited img { background: #fff; padding: 2px; border: solid 1px #cebea9; width: 48px; height: 48px;}
.Recent .widget_flickrrss li a:hover img { background: #660000; padding: 2px; border: solid 1px #660000;}

/* Side Right Right +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.SRR { width: 281px; float: right; margin: 14px 24px 0px 24px !important; margin: 14px 12px 0px 12px; background:#3f81a8 url(smarttouch-images/nb.jpg) repeat-x top left;}
.SRR h2 { letter-spacing: 1px; border-bottom:1px dotted #215275; padding: 15px 0px 15px 25px; margin:0 15px 0 15px; font:normal 18px Tahoma, Arial; color:#FFFFFF; background: url(smarttouch-images/tnb.gif) no-repeat left;}
.SRR ul { margin: 0px; padding: 0px 0 0 20px;}
.SRR li { margin: 0px; padding: 0px; list-style-type: none; }
.SRR a { color:#FFFFFF;}
.SRR a:visited { color:#FFFFFF;}
.SRR a:hover { color:#FFFFFF; text-decoration: underline;}

/* Categories +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.SRR .widget { margin: 0px 0px 10px 0px; padding: 0px;}
.SRR .widget ul { margin: 0px;  padding: 0px 0 0 20px;}
.SRR .widget li { margin: 0px; padding: 1px 0px 1px 0px; list-style-type: none; font-size: 12px; color:#999;}
.SRR .widget li a { color:#FFFFFF;}
.SRR .widget li a:visited { color:#FFFFFF;}
.SRR .widget li a:hover { color:#FFFFFF; text-decoration: none;}

.SRR .widget_categories ul { margin: 0px;  padding: 0px 0 0 20px;}
.SRR .widget_categories ul li { margin: 0px; padding: 1px 0px 1px 0px; list-style-type: none; font-size: 12px; color:#999; font-weight: bold;}
.SRR .widget_categories ul li a { color:#FFFFFF;}
.SRR .widget_categories ul li a:visited { color:#FFFFFF;}
.SRR .widget_categories ul li a:hover { color:#FFFFFF; text-decoration: underline;}
.SRR .widget_categories ul ul { margin: 2px 0px 0px 0px; padding: 0px; list-style-type: none; background: none; border-bottom: none;}
.SRR .widget_categories ul li li { margin: 0px; padding: 1px 0px; list-style-type: none; background: none; border-bottom: none; font-size: 12px; font-weight: normal;}

.SRR .widget_tag_cloud { font-family: "Trebuchet MS"; line-height: 22px;}

.SRR .widget_calendar table { width: 100%;}
.SRR .widget_calendar table td { text-align: center; padding: 3px; }
.SRR .widget_calendar caption { background: #fff3e2; padding: 5px 0px;}
.SRR .widget_calendar #today { background: #fff3e2;}

.SRR .widget_search #s { border: solid 1px #cebea9; padding: 3px; margin-bottom: 5px;}

/* Footer ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.FBG { width: 100%; float: left; padding: 0px; background:#164c6b url(smarttouch-images/bggg.gif) no-repeat top center;}
.Footer { color:#000000;background:url(smarttouch-images/fb.gif) repeat-x top; width: 1009px; margin: 0 auto; padding: 10px 0px 10px 30px;}
.Footer p { background: url(smarttouch-images/spq.gif) no-repeat right; font-size: 10px; line-height: 15px; color:#575757; padding: 10px 0px; margin:0 15px 0 0; font-family: 'Verdana'; }
.Footer a { color:#000000; text-decoration: underline;}

</style>


</head>
<body>
<div id="bgcontainer">
  <div class="Header">
    <div class="Syn">
      <ul>
        <li><a href="http://www.free-css.com/">Entries</a> (RSS)</li>
        <li><a href="http://www.free-css.com/">Comments</a> (RSS)</li>
      </ul>
    </div>
    <div class="Logo">
      <div class="LogoText">
        <h1><a href="http://www.free-css.com/">SmartTouch</a></h1>
      </div>
      <p class="Desc"></p>
    </div>
    <div class="Menu">
      <ul>
        <li><a href="http://www.free-css.com/"><span>Home</span></a></li>
        <li class="current_page_item"><a href="about-us.html"><span>About</span></a></li>
        <li><a href="contact-us.html"><span>Contact</span></a></li>
        <li><a href="extras.html"><span>Extras</span></a></li>
      </ul>
    </div>
    <div class="Search">
      <form href="http://www.free-css.com/" method="post">
        <input type="text" name="s" class="keyword" />
        <div class="bt">
          <input name="submit" type="image" class="search" title="Search" src="smarttouch-images/search_butt.gif" alt="Search" />
        </div>
      </form>
    </div>
    <div class="clr"></div>
  </div>
  <div class="CON">
    <div class="SCS">
      <div class="Post" id="post-2">
        <h2 class="pagetitle">About</h2>
        <p>Praesent aliquet pellentesque orci. Quisque leo neque, viverra et, blandit et, dapibus id, odio. Morbi sit amet augue non massa mattis tempor.</p>
        <div id="lipsum">
          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras pellentesque consectetuer tortor. In hac habitasse platea dictumst. Suspendisse tempus, arcu at ultricies pretium, tellus velit congue lorem, ac accumsan massa lacus sit amet orci. Nulla risus sapien, varius et, lacinia quis, porta egestas, lorem. Praesent pretium libero et risus. Aliquam erat volutpat. Ut convallis, erat vitae ultrices lobortis, quam erat ornare enim, in auctor sem leo eu arcu. Etiam eget diam. Proin et nibh. Vivamus in quam. Nulla sed lectus nec tortor ultricies bibendum. Quisque urna pede, porttitor at, ultricies in, rhoncus at, mauris. Integer risus tortor, tincidunt ut, dictum vel, posuere in, felis. Pellentesque hendrerit dapibus elit. Sed at eros ac lorem condimentum suscipit. Nulla facilisi. Pellentesque pellentesque. Integer ultrices lectus at tellus. Praesent leo erat, fringilla quis, consectetuer vitae, cursus vitae, lorem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
          <p>Duis tristique laoreet velit. Phasellus viverra ligula nec massa. Sed commodo, est eget posuere aliquet, diam orci ornare pede, eu rhoncus tortor diam non felis. Cras in odio vel orci porta luctus. Ut lorem. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi eu enim ornare pede egestas dapibus. Aliquam tortor lacus, semper vel, commodo non, aliquam sed, augue. Nam dignissim. Nunc mattis egestas lectus. Quisque suscipit convallis sem. Praesent id justo id arcu dapibus porta. Donec vestibulum. Pellentesque egestas dapibus magna. Phasellus sit amet metus nec sem hendrerit aliquam. Pellentesque sit amet tellus. Nulla porta ligula sit amet felis. Vivamus ornare, odio volutpat auctor tempus, leo metus cursus nisl, ac dignissim arcu neque in lacus.</p>
          <p>Aenean pede est, tempor id, pulvinar vitae, adipiscing a, orci. Suspendisse potenti. Phasellus pulvinar, orci vitae interdum vehicula, odio magna mollis turpis, eu rutrum felis erat eu quam. Mauris pede turpis, suscipit ut, venenatis sit amet, bibendum sit amet, quam. Nam porta, tellus in placerat adipiscing, neque libero pretium leo, at tincidunt quam dolor ac tellus. Praesent vestibulum, lacus ac interdum pretium, orci tortor hendrerit est, quis volutpat sapien magna eget mauris. Suspendisse viverra. Curabitur imperdiet orci et ligula. Vivamus rutrum velit id erat. Nam eu dui. In commodo leo quis lectus. Nunc tincidunt malesuada quam. Vivamus nisi sapien, condimentum vel, commodo eu, tempus luctus, pede. In ac massa. Sed metus dui, iaculis ac, feugiat at, pretium et, arcu. Donec augue. Vestibulum malesuada, magna quis consequat accumsan, arcu eros commodo tellus, vel tristique sem pede id turpis. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
          <p>Aliquam semper elit sit amet erat. Maecenas sed tortor. Curabitur hendrerit iaculis enim. Aliquam erat volutpat. Nulla turpis turpis, lobortis id, rhoncus eleifend, commodo non, velit. Ut vestibulum sapien et urna. Cras ipsum elit, fermentum sed, commodo eget, gravida vitae, enim. In tincidunt orci sed enim. Pellentesque dictum venenatis felis. Nulla suscipit aliquam orci. Aenean eros nisl, laoreet a, pellentesque a, lacinia a, dolor. Donec in nibh ultricies velit euismod congue. Quisque hendrerit, tortor in vestibulum pretium, ligula nunc ornare mauris, ut dictum leo nibh vitae nisi. Sed vulputate, nulla nec ultricies imperdiet, erat pede sagittis pede, a placerat pede libero at enim. Suspendisse potenti. Etiam ut tortor in lectus fringilla ultricies. In vehicula odio quis velit faucibus vulputate. Duis eget risus.</p>
          <p>Praesent aliquet pellentesque orci. Quisque leo neque, viverra et, blandit et, dapibus id, odio. Morbi sit amet augue non massa mattis tempor. Maecenas tincidunt aliquam lorem. Fusce sem. Phasellus nisi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Duis dictum. Etiam magna felis, tristique vel, ullamcorper eu, tristique ut, tortor. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin ultricies feugiat erat. Sed rutrum. Donec nisl lectus, pharetra eget, sagittis quis, venenatis hendrerit, ante. Donec purus nisi, semper sed, cursus ac, malesuada at, elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris vitae dui vel odio ornare bibendum. Phasellus dignissim. Nulla facilisi. Praesent adipiscing.</p>
        </div>
        <div id="related-posts">
          <h2>Related Posts</h2>
          <p>None</p>
        </div>
      </div>
      <div class="Comments">
        <div class="List"> </div>
        <h3 id="respond">Leave a reply</h3>
        <div class="Form">
          <div class="FormTop"></div>
          <form href="http://www.free-css.com/" method="post" id="commentform">
            <p>
              <label for="author"> <small>Name (<strong>*</strong>)</small>
              <input type="text" name="author" id="author" value="" tabindex="1" class="TextField Name" style="width: 384px; background: #e9f8ff url(smarttouch-images/FormName.png) no-repeat left top" />
              </label>
            </p>
            <p>
              <label for="email"> <small>E-mail (<strong>*</strong>)</small>
              <input type="text" name="email" id="email" value="" tabindex="2" class="TextField"  style="width: 384px; background: #e9f8ff url(smarttouch-images/FormEmail.png) no-repeat left top" />
              </label>
            </p>
            <p>
              <label for="url"> <small><abbr title="Uniform Resource Identifier">URI</abbr></small>
              <input type="text" name="url" id="url" value="" tabindex="3" class="TextField URI" style="width: 384px; background: #e9f8ff url(smarttouch-images/FormURI.png) no-repeat left top" />
              </label>
            </p>
            <p>
              <label><small>Message</small>
              <textarea name="comment" id="comment" rows="6" tabindex="4" class="TextArea" style="width: 409px;" cols="7"></textarea>
              </label>
            </p>
            <p>
              <input name="SubmitComment" type="submit" class="SubmitComment" onmouseover="javascript:changeSty('SubmitCommentIE');" onmouseout="javascript:changeSty('SubmitComment');"  title="Post Your Comment" alt="Post Your Comment" />
              <input type="hidden" name="comment_post_ID" value="2" />
            </p>
          </form>
        </div>
        <div class="FormBottom"></div>
      </div>
    </div>
    <div class="SR">
      <div class="SRL">
        <div class="banner">
          <h2>Sponsored</h2>
          <img src="smarttouch-images/ban125.gif" alt="" /> <img src="smarttouch-images/ban125.gif" alt=""  /> <img src="smarttouch-images/ban125.gif" alt=""  /> <img src="smarttouch-images/ban125.gif" alt=""  /> <br clear="all" />
        </div>
      </div>
      <div class="SRR">
        <div class="widget widget_categories">
          <h2>Categories</h2>
          <ul>
            <li><a href="http://www.free-css.com/">Business</a> (7) </li>
            <li><a href="http://www.free-css.com/">Entertainment</a> (1) </li>
            <li><a href="http://www.free-css.com/">Science</a> (6) </li>
            <li><a href="http://www.free-css.com/">Technology</a> (7) </li>
            <li><a href="http://www.free-css.com/">World News</a> (1) </li>
          </ul>
        </div>
        <div class="widget widget_archives">
          <h2>Archives</h2>
          <ul>
            <li><a href="http://www.free-css.com/">August 2008</a></li>
          </ul>
        </div>
        <div class="widget widget_links">
          <h2>Links</h2>
          <ul>
            <li><a href="http://www.free-css.com/">Documentation</a></li>
            <li><a href="http://www.free-css.com/">Development Blog</a></li>
            <li><a href="http://www.free-css.com/">Suggest Ideas</a></li>
            <li><a href="http://www.free-css.com/">Support Forum</a></li>
            <li><a href="http://www.free-css.com/">Plugins</a></li>
            <li><a href="http://www.free-css.com/">Themes</a></li>
          </ul>
        </div>
        <div class="widget widget_meta">
          <h2>Meta</h2>
          <ul>
            <li><a href="http://www.free-css.com/">Log in</a></li>
            <li><a href="http://validator.w3.org/check/referer">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
            <li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
          </ul>
        </div>
      </div>
    </div>
  </div>
</div>
<div class="FBG">
  <div class="Recent">
    <div class="TabContent">
      <h2 class="TabLink"><span>Recent Articles</span></h2>
      <ul>
        <li><a href="http://www.free-css.com/">Extras</a></li>
        <li><a href="http://www.free-css.com/">Contact</a></li>
        <li><a href="http://www.free-css.com/">Puppies mark birth of commercial pet cloning</a></li>
        <li><a href="http://www.free-css.com/">Ocean 'dead zones' becoming global problem</a></li>
        <li><a href="http://www.free-css.com/">Gulf 'dead zone' suffocating fish and livelihoods</a></li>
        <li><a href="http://www.free-css.com/">Study: Organic food not more nutritional</a></li>
        <li><a href="http://www.free-css.com/">Eco communities: Living the green life</a></li>
        <li><a href="http://www.free-css.com/">Arctic ice at second-lowest level ever</a></li>
        <li><a href="http://www.free-css.com/">Oil price up on Russia tensions</a></li>
        <li><a href="http://www.free-css.com/">Buffett: U.S. still in recession</a></li>
      </ul>
    </div>
    <div class="TabContent">
      <h2 class="TabLink"><span>Recent Comments</span></h2>
      <ul>
        <li>ozan sumer: <a href="http://www.free-css.com/">wonderfull theme thanks </a></li>
        <li>ildvr: <a href="http://www.free-css.com/">beautiful colors! very like it</a></li>
        <li>ildvr: <a href="http://www.free-css.com/">cooool design!!!</a></li>
        <li>Bebe Rebozo: <a href="http://www.free-css.com/">Testing, testing.</a></li>
        <li>Giancarlo: <a href="http://www.free-css.com/">Phasellus semper augue in augue.</a></li>
        <li>Brian: <a href="http://www.free-css.com/">Cras nisl. Pellentesque porta. Suspendisse</a></li>
        <li>Maxine: <a href="http://www.free-css.com/">Aliquam eget justo ac mauris</a></li>
        <li>Jennifer: <a href="http://www.free-css.com/">Nam sed urna a velit</a></li>
        <li>Kyle: <a href="http://www.free-css.com/">Lorem Ipsum Dolar Sit Amet</a></li>
        <li>Jos Alfonso Faz: <a href="http://www.free-css.com/">its a pity wath</a></li>
      </ul>
    </div>
    <div class="widget_flickrrss">
      <h2 class="TabLink">Flickr PhotoStream</h2>
      <ul>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3203/2956845335_104f1c1916_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3060/2957684202_df049881f0_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3183/2957686454_4212e9c404_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3199/2956839129_22c3da1008_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3167/2957680044_a852551661_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3173/2957677686_473e197eb5_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3042/2956585654_78c6b085c3_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3183/2956398512_6ae0394f32_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3186/2955526025_24b6951c41_t.jpg" alt="" /></a></li>
        <li><a href="http://www.free-css.com/"><img src="http://farm4.static.flickr.com/3287/2956391266_4a72ea194f_t.jpg" alt="" /></a></li>
      </ul>
    </div>
    <div class="clr"></div>
  </div>
  <div class="Footer"> <big><big><strong>&copy; 2008 My Web Blog</strong></big></big><br />
    <small><strong><a href="http://www.freethemelayouts.com/" style="color: #000000;text-decoration: none;">Wordpress Theme</a> designed by DT <a href="http://www.dreamtemplate.com" style="color: #000000;text-decoration: none;">Website Templates</a></strong></small> </div>
</div>
</body>
</html>

   
    
  








Related examples in the same category

1.bigpixels
2.binary-news
3.mosaic
4.perfection
5.plain1
6.plain2
7.plastic-surgery
8.plastics
9.overdose
10.outlined
11.optimism
12.optimistic
13.Modern_Theme
14.MultiStrangeColor
15.modern
16.minimalistic
17.primitive
18.sparkle
19.sparkling
20.spotlight
21.simplyfluid
22.slider
23.pragmatic
24.popular
25.primitif
26.pure-web-2.0
27.pure
28.reflection
29.reflections
30.royal-cyan
31.royal_policy
32.smalltown
33.smallwindow
34.smartdesign
35.splendid
36.workfire
37.webtile
38.Wide_Side
39.zionnarrow
40.zionnarrows
41.xtreme
42.ZEN
43.zenlike
44.wondrous
45.stonewalled
46.tattoopatt
47.tattoopattern
48.tastelessly
49.tasty
50.thebarn
51.tinfoil_helmet
52.tomato
53.metal-feel
54.metal
55.historical
56.historicpaper
57.historyofwar
58.lonelyness