RSS

Category Archives: HTML

BRICKWALL: ΤΟ ΠΡΩΤΟ TEMPLATE ΑΠΟ ΤΟ LOCUS BLOGUS

Και το όνομα αυτού BRICKWALL φίλες και φίλοι. Σας παρουσιάζω το πρώτο template του Locus Blogus. Όλος ο σχεδιασμός του template, καθώς και το background, έγινε εξ’ ολοκλήρου από το παρόν ιστολόγιο.
   Λίγα στοιχεία του παρακάτω template: Είναι τρίστηλο, η navbar έχει αφαιρεθεί για αποφυγή διάφορων επιτήδιων, έχει προεγκατεστημένο ένα κουμπί Bookmark, το οποίο θα εμφανίζεται κάτω από κάθε σας ανάρτηση, για να κάνετε προσθήκη των post σας εσείς ή οι αναγνώστες σας σε διάφορες υπηρεσίες όπως είναι το Twitter, Facebook, MySpace, Delicious και μια πληθώρα άλλων υπηρεσιών. Επίσης αν κάνετε κλικ πάνω στον τίτλο ενός post θα δείτε ότι στη συγκεκριμένη ανάρτηση εμφανίζεται και ένα κουμπί για την εκτύπωση αυτής. Δείτε ένα test blog για το πως θα φαίνεται κάνοντας κλικ εδώ.
   Παρακάτω είναι ο κώδικας στο scroll box τον οποίο μπορείτε να τον κάνετε copy – paste (αντιγραφή επικόλληση) στην επεξεργασία HTML για να εγκαταστήσετε το template. Εκεί θα πάτε μπαίνοντας στο λογαριασμό σας και από τον πανόπτη πάτε διάταξη και επεξεργασία HTML. Πριν κάνετε οτιδήποτε πάρτε ένα back up του ήδη υπάρχοντος template του ιστολογίου σας σε περίπτωση που θέλετε να το επαναεγκαταστήσετε στο μέλλον. Εφόσον βάλετε τον κώδικα πατήστε αποθήκευση (save) και τελειώσατε.
   Μετά τον κώδικα έχω βάλει δυο screenshots. Το πρώτο δείχνει πως είναι το template στην αρχική του σελίδα και το δεύτερο πως φαίνεται όταν επισκευτούμε ένα συγκεκριμένο post (σ’ αυτό θα δείτε και το εικονίδιο του εκτυπωτή πάνω από τον τίτλο της ανάρτησης το οποίο πατώντας το μπορεί ο αναγνώστης να την εκτυπώσει). Για μεγέθυνση αυτών κάντε κλικ πάνω στα screenshots.

<?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 expr:dir=’data:blog.languageDirection’ xmlns=’http://www.w3.org/1999/xhtml&#8217; xmlns:b=’http://www.google.com/2005/gml/b&#8217; xmlns:data=’http://www.google.com/2005/gml/data&#8217; xmlns:expr=’http://www.google.com/2005/gml/expr’&gt;
  <head>
    <b:include data=’blog’ name=’all-head-content’/>
    <meta content=’IE=EmulateIE7′ http-equiv=’X-UA-Compatible’/>
    <title><data:blog.pageTitle/></title>
    <b:skin><![CDATA[
    
/* begin Page */
      
        /* Created by hackaday, http://locusblogus.blogspot.com
*/
      
        body
        {
            margin: 0 auto;
            padding: 0;
            background-color: #C5C5AF;
            background-image: url(‘http://img208.imageshack.us/img208/6351/pagebgtexturet.jpg&#8217;);
            background-repeat: repeat;
            background-attachment: scroll;
            background-position: top left;
        }
      
        #art-main
        {
            position: relative;
            width: 100%;
            left: 0;
            top: 0;
        }
      
      
      
      
        #art-page-background-gradient
        {
            background-position: top left;
        }
      
      
        .cleared
        {
            float: none;
            clear: both;
            margin: 0;
            padding: 0;
            border: none;
            font-size:1px;
        }
      
      
        form
        {
            padding:0 !important;
            margin:0 !important;
        }
      
        table.position
        {
            position: relative;
            width: 100%;
            table-layout: fixed;
        }
      
      
      
      
        #navbar
        {
            position: relative;
            z-index:10;
        }
        #comments{
            padding:0 15px 15px 15px;
        }
      
        #ArchiveList ul li
        {
            text-indent: -10px !important;
            padding:0 0 0 15px;
        }
      
      
      
        .profile-datablock, .profile-textblock {
            margin:0 0 .75em;
            line-height:1.4em;
        }
        .profile-img {
            float: left;
            margin-top: 0;
            margin-right: 5px;
            margin-bottom: 5px;
            margin-left: 0;
            border: 5px solid #889977;
        }
        .profile-data {
            font-weight: bold;
        }
      
        .blog-pager{
            margin-left:15px;
        }
      
        .post-feeds{
            margin-left:15px;
        }
      
        .blog-feeds
        {
           margin-left:15px;
        }
      
        /* for Blogger Page Elements */
      
        body#layout div.art-Header{
          height: auto;
          width: 100%;
        }
        body#layout .art-contentLayout{
          margin-top: 18px;
          padding-top: 2px;
          width: 100%
        }
      
        body#layout .art-Sheet{
          width: 100%;
        }
      
        body#layout .art-Footer{
          width: 100%;
        }
      
        body#layout .art-sidebar1{
          width: 25%;
        }
      
        body#layout .art-sidebar2{
          width: 25%;
        }
      
        body#layout .art-content{
          width: 50%;
        }
      
        body#layout .art-Footer .art-Footer-text{
          height: 85px;
        }
      
        body#layout .art-BlockContent-body{
          padding: 0;
        }
      
        body#layout .art-Block-body{
            padding: 0;
        }
      
        body#layout .art-nav{
            height: auto;
        }
      
        /* search results  */
      
        #uds-searchControl .gsc-results, #uds-searchControl .gsc-tabhActive
        {
            background-color: transparent !important;
        }/* end Page */
      
        /* begin Box, Sheet */
        .art-Sheet
        {
            position:relative;
            z-index:0;
            margin:0 auto;
            width: 1000px;
            min-width:35px;
            min-height:35px;
        }
      
        .art-Sheet-body
        {
            position: relative;
            z-index: 1;
            padding: 3px;
        }
      
        .art-Sheet-tr, .art-Sheet-tl, .art-Sheet-br, .art-Sheet-bl, .art-Sheet-tc, .art-Sheet-bc,.art-Sheet-cr, .art-Sheet-cl
        {
            position:absolute;
            z-index:-1;
        }
      
        .art-Sheet-tr, .art-Sheet-tl, .art-Sheet-br, .art-Sheet-bl
        {
            width: 34px;
            height: 34px;
            background-image: url(‘http://img163.imageshack.us/img163/1989/sheetsyc.png&#8217;);
        }
      
        .art-Sheet-tl
        {
            top:0;
            left:0;
            clip: rect(auto, 17px, 17px, auto);
        }
      
        .art-Sheet-tr
        {
            top: 0;
            right: 0;
            clip: rect(auto, auto, 17px, 17px);
        }
      
        .art-Sheet-bl
        {
            bottom: 0;
            left: 0;
            clip: rect(17px, 17px, auto, auto);
        }
      
        .art-Sheet-br
        {
            bottom: 0;
            right: 0;
            clip: rect(17px, auto, auto, 17px);
        }
      
        .art-Sheet-tc, .art-Sheet-bc
        {
            left: 17px;
            right: 17px;
            height: 34px;
            background-image: url(‘http://img163.imageshack.us/img163/6388/sheethdc.png&#8217;);
        }
      
        .art-Sheet-tc
        {
            top: 0;
            clip: rect(auto, auto, 17px, auto);
        }
      
        .art-Sheet-bc
        {
            bottom: 0;
            clip: rect(17px, auto, auto, auto);
        }
      
        .art-Sheet-cr, .art-Sheet-cl
        {
            top: 17px;
            bottom: 17px;
            width: 34px;
            background-image: url(‘http://img163.imageshack.us/img163/5375/sheetvf.png&#8217;);
        }
      
        .art-Sheet-cr
        {
            right:0;
            clip: rect(auto, auto, auto, 17px);
        }
      
        .art-Sheet-cl
        {
            left:0;
            clip: rect(auto, 17px, auto, auto);
        }
      
        .art-Sheet-cc
        {
            position:absolute;
            z-index:-1;
            top: 17px;
            left: 17px;
            right: 17px;
            bottom: 17px;
            background-image: url(‘http://img163.imageshack.us/img163/7223/sheetcy.png&#8217;);
        }
      
      
        .art-Sheet
        {
            margin-top: 10px !important;
        }
      
        #art-page-background-simple-gradient, #art-page-background-gradient, #art-page-background-glare
        {
            min-width:1000px;
        }
      
        /* end Box, Sheet */
      
        /* begin Header */
        div.art-Header
        {
            margin: 0 auto;
            position: relative;
            z-index:0;
            width: 994px;
            height: 150px;
        }
      
        div.art-Header-png
        {
            position: absolute;
            z-index:-2;
            top: 0;
            left: 0;
            width: 994px;
            height: 150px;
            background-image: url(‘http://img163.imageshack.us/img163/8117/headerir.png&#8217;);
            background-repeat: no-repeat;
            background-position: left top;
        }
      
        div.art-Header-jpeg
        {
            position: absolute;
            z-index:-1;
            top: 0;
            left: 0;
            width: 994px;
            height: 150px;
            background-image: url(‘http://img62.imageshack.us/img62/7942/headerfx.jpg&#8217;);
            background-repeat: no-repeat;
            background-position: center center;
        }
        /* end Header */
      
        /* begin Logo */
        .art-Logo
        {
            display : block;
            position: absolute;
            left: 10px;
            top: 52px;
            width: 679px;
        }
      
        h1.art-Logo-name
        {
            display: block;
            text-align: center;
        }
      
        h1.art-Logo-name, h1.art-Logo-name a, h1.art-Logo-name a:link, h1.art-Logo-name a:visited, h1.art-Logo-name a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 28px;
        font-style: normal;
        font-weight: bold;
        text-decoration: none;
        letter-spacing: 2px;
        text-transform: uppercase;
            padding:0;
            margin:0;
            color: #F6F7E3 !important;
        }
      
        .art-Logo-text
        {
            display: block;
            text-align: center;
        }
      
        .art-Logo-text, .art-Logo-text a
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 14px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 1px;
        text-transform: uppercase;
            padding:0;
            margin:0;
            color: #0C0C03 !important;
        }
        /* end Logo */
      
        /* begin Menu */
        /* menu structure */
      
        .art-menu a, .art-menu a:link, .art-menu a:visited, .art-menu a:hover
        {
            text-align:left;
            text-decoration:none;
            outline:none;
            letter-spacing:normal;
            word-spacing:normal;
        }
      
        .art-menu, .art-menu ul
        {
            margin: 0;
            padding: 0;
            border: 0;
            list-style-type: none;
            display: block;
        }
      
        .art-menu li
        {
            margin: 0;
            padding: 0;
            border: 0;
            display: block;
            float: left;
            position: relative;
            z-index: 5;
            background:none;
        }
      
        .art-menu li:hover
        {
            z-index: 10000;
            white-space: normal;
        }
      
        .art-menu li li
        {
            float: none;
        }
      
        .art-menu ul
        {
            visibility: hidden;
            position: absolute;
            z-index: 10;
            left: 0;
            top: 0;
            background:none;
        }
      
        .art-menu li:hover>ul
        {
            visibility: visible;
            top: 100%;
        }
      
        .art-menu li li:hover>ul
        {
            top: 0;
            left: 100%;
        }
      
        .art-menu:after, .art-menu ul:after
        {
            content: «.»;
            height: 0;
            display: block;
            visibility: hidden;
            overflow: hidden;
            clear: both;
        }
        .art-menu, .art-menu ul
        {
            min-height: 0;
        }
      
        .art-menu ul
        {
            background-image: url(http://img62.imageshack.us/img62/6748/spacerv.gif);
            padding: 10px 30px 30px 30px;
            margin: -10px 0 0 -30px;
        }
      
        .art-menu ul ul
        {
            padding: 30px 30px 30px 10px;
            margin: -30px 0 0 -10px;
        }
      
      
      
      
      
        /* menu structure */
      
        .art-menu
        {
            padding: 2px 1px 0px 1px;
        }
      
        .art-nav
        {
            position: relative;
            height: 27px;
            z-index: 100;
        }
      
        .art-nav .l, .art-nav .r
        {
            position: absolute;
            z-index: -1;
            top: 0;
            height: 27px;
            background-image: url(‘http://img62.imageshack.us/img62/1677/navu.png&#8217;);
        }
      
        .art-nav .l
        {
            left: 0;
            right:0px;
        }
      
        .art-nav .r
        {
            right: 0;
            width: 994px;
            clip: rect(auto, auto, auto, 994px);
        }
      
      
        /* end Menu */
      
        /* begin MenuItem */
        .art-menu ul li
        {
            clear: both;
        }
      
        .art-menu a
        {
            position:relative;
            display: block;
            overflow:hidden;
            height: 25px;
            cursor: pointer;
            text-decoration: none;
            margin-right: 4px;
            margin-left: 4px;
        }
      
      
        .art-menu a .r, .art-menu a .l
        {
            position:absolute;
            display: block;
            top:0;
            z-index:-1;
            height: 75px;
            background-image: url(‘http://img62.imageshack.us/img62/1272/menuitemh.png&#8217;);
        }
      
        .art-menu a .l
        {
            left:0;
            right:3px;
        }
      
        .art-menu a .r
        {
            width:406px;
            right:0;
            clip: rect(auto, auto, auto, 403px);
        }
      
        .art-menu a .t
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 1px;
        text-transform: uppercase;
            color: #2B2C0C;
            padding: 0 6px;
            margin: 0 3px;
            line-height: 25px;
            text-align: center;
        }
      
        .art-menu a:hover .l, .art-menu a:hover .r
        {
            top:-25px;
        }
      
        .art-menu li:hover>a .l, .art-menu li:hover>a .r
        {
            top:-25px;
        }
      
        .art-menu li:hover a .l, .art-menu li:hover a .r
        {
            top:-25px;
        }
        .art-menu a:hover .t
        {
            color: #212118;
        }
      
        .art-menu li:hover a .t
        {
            color: #212118;
        }
      
        .art-menu li:hover>a .t
        {
            color: #212118;
        }
      
      
        .art-menu a.active .l, .art-menu a.active .r
        {
            top: -50px;
        }
      
        .art-menu a.active .t
        {
            color: #E7E7DE;
        }
      
      
        /* end MenuItem */
      
        /* begin MenuSubItem */
        .art-menu ul a
        {
            display:block;
            text-align: center;
            white-space: nowrap;
            height: 20px;
            width: 180px;
            overflow:hidden;
            line-height: 20px;
            margin-right: auto;
      
      
            background-image: url(‘http://img62.imageshack.us/img62/449/subitembgc.png&#8217;);
            background-position: left top;
            background-repeat: repeat-x;
            border-width: 0px;
            border-style: solid;
        }
      
        .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
        {
            display: inline;
            float: none;
            margin: inherit;
            padding: inherit;
            background-image: none;
            text-align: inherit;
            text-decoration: inherit;
        }
      
        .art-menu ul a, .art-menu ul a:link, .art-menu ul a:visited, .art-menu ul a:hover, .art-menu ul a:active, .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
        {
            text-align: left;
            text-indent: 12px;
            text-decoration: none;
            line-height: 20px;
            color: #595B1A;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        letter-spacing: 1px;
        }
      
        .art-menu ul ul a
        {
            margin-left: auto;
        }
      
        .art-menu ul li a:hover
        {
            color: #3B4616;
            background-position: 0 -20px;
        }
      
        .art-menu ul li:hover>a
        {
            color: #3B4616;
            background-position: 0 -20px;
        }
      
        .art-nav .art-menu ul li a:hover span, .art-nav .art-menu ul li a:hover span span
        {
            color: #3B4616;
        }
      
        .art-nav .art-menu ul li:hover>a span, .art-nav .art-menu ul li:hover>a span span
        {
            color: #3B4616;
        }
      
      
        /* end MenuSubItem */
      
        /* begin ContentLayout */
        .art-contentLayout
        {
            position: relative;
            margin-bottom: 1px;
            width: 994px;
        }
        /* end ContentLayout */
      
        /* begin Box, Block */
        .art-Block
        {
            position:relative;
            z-index:0;
            margin:0 auto;
            min-width:3px;
            min-height:3px;
        }
      
        .art-Block-body
        {
            position: relative;
            z-index: 1;
            padding: 7px;
        }
      
        .art-Block-tr, .art-Block-tl, .art-Block-br, .art-Block-bl, .art-Block-tc, .art-Block-bc,.art-Block-cr, .art-Block-cl
        {
            position:absolute;
            z-index:-1;
        }
      
        .art-Block-tr, .art-Block-tl, .art-Block-br, .art-Block-bl
        {
            width: 2px;
            height: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/3671/blocksd.png&#8217;);
        }
      
        .art-Block-tl
        {
            top:0;
            left:0;
            clip: rect(auto, 1px, 1px, auto);
        }
      
        .art-Block-tr
        {
            top: 0;
            right: 0;
            clip: rect(auto, auto, 1px, 1px);
        }
      
        .art-Block-bl
        {
            bottom: 0;
            left: 0;
            clip: rect(1px, 1px, auto, auto);
        }
      
        .art-Block-br
        {
            bottom: 0;
            right: 0;
            clip: rect(1px, auto, auto, 1px);
        }
      
        .art-Block-tc, .art-Block-bc
        {
            left: 1px;
            right: 1px;
            height: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/8848/blockhz.png&#8217;);
        }
      
        .art-Block-tc
        {
            top: 0;
            clip: rect(auto, auto, 1px, auto);
        }
      
        .art-Block-bc
        {
            bottom: 0;
            clip: rect(1px, auto, auto, auto);
        }
      
        .art-Block-cr, .art-Block-cl
        {
            top: 1px;
            bottom: 1px;
            width: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/2893/blockvn.png&#8217;);
        }
      
        .art-Block-cr
        {
            right:0;
            clip: rect(auto, auto, auto, 1px);
        }
      
        .art-Block-cl
        {
            left:0;
            clip: rect(auto, 1px, auto, auto);
        }
      
        .art-Block-cc
        {
            position:absolute;
            z-index:-1;
            top: 1px;
            left: 1px;
            right: 1px;
            bottom: 1px;
            background-color: #DBDBCD;
        }
      
      
        .art-Block
        {
            margin: 7px;
        }
      
        /* end Box, Block */
      
        /* begin BlockHeader */
        .art-BlockHeader
        {
            position:relative;
            z-index:0;
            height: 30px;
            padding: 0 8px;
            margin-bottom: 0px;
        }
      
        .art-BlockHeader .t
        {
            height: 30px;
            color: #000000;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 0px;
        text-transform: uppercase;
            white-space : nowrap;
            padding: 0 6px;
            line-height: 30px;  
        }
      
      
      
      
      
        .art-header-tag-icon
        {
            height: 30px;
            background-position:left top;
            background-image: url(‘http://img62.imageshack.us/img62/850/blockheadericonp.png&#8217;);
            padding:0 0 0 12px;
            background-repeat: no-repeat;
            min-height: 12px;
            margin: 0 0 0 5px;
        }
      
      
        /* end BlockHeader */
      
        /* begin Box, BlockContent */
        .art-BlockContent
        {
            position:relative;
            z-index:0;
            margin:0 auto;
            min-width:3px;
            min-height:3px;
        }
      
        .art-BlockContent-body
        {
            position: relative;
            z-index: 1;
            padding: 8px;
        }
      
        .art-BlockContent-tr, .art-BlockContent-tl, .art-BlockContent-br, .art-BlockContent-bl, .art-BlockContent-tc, .art-BlockContent-bc,.art-BlockContent-cr, .art-BlockContent-cl
        {
            position:absolute;
            z-index:-1;
        }
      
        .art-BlockContent-tr, .art-BlockContent-tl, .art-BlockContent-br, .art-BlockContent-bl
        {
            width: 2px;
            height: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/5586/blockcontentsom.png&#8217;);
        }
      
        .art-BlockContent-tl
        {
            top:0;
            left:0;
            clip: rect(auto, 1px, 1px, auto);
        }
      
        .art-BlockContent-tr
        {
            top: 0;
            right: 0;
            clip: rect(auto, auto, 1px, 1px);
        }
      
        .art-BlockContent-bl
        {
            bottom: 0;
            left: 0;
            clip: rect(1px, 1px, auto, auto);
        }
      
        .art-BlockContent-br
        {
            bottom: 0;
            right: 0;
            clip: rect(1px, auto, auto, 1px);
        }
      
        .art-BlockContent-tc, .art-BlockContent-bc
        {
            left: 1px;
            right: 1px;
            height: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/579/blockcontenthc.png&#8217;);
        }
      
        .art-BlockContent-tc
        {
            top: 0;
            clip: rect(auto, auto, 1px, auto);
        }
      
        .art-BlockContent-bc
        {
            bottom: 0;
            clip: rect(1px, auto, auto, auto);
        }
      
        .art-BlockContent-cr, .art-BlockContent-cl
        {
            top: 1px;
            bottom: 1px;
            width: 2px;
            background-image: url(‘http://img62.imageshack.us/img62/7117/blockcontentve.png&#8217;);
        }
      
        .art-BlockContent-cr
        {
            right:0;
            clip: rect(auto, auto, auto, 1px);
        }
      
        .art-BlockContent-cl
        {
            left:0;
            clip: rect(auto, 1px, auto, auto);
        }
      
        .art-BlockContent-cc
        {
            position:absolute;
            z-index:-1;
            top: 1px;
            left: 1px;
            right: 1px;
            bottom: 1px;
            background-color: #ECECE4;
        }
      
      
        .art-BlockContent-body
        {
            color:#68684B;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        }
      
        .art-BlockContent-body a:link
        {
            color: #787B23;
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        }
      
        .art-BlockContent-body a:visited, .art-BlockContent-body a.visited
        {
            color: #989871;
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        }
      
        .art-BlockContent-body a:hover, .art-BlockContent-body a.hover
        {
            color: #879F32;
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        }
      
        .art-BlockContent-body ul
        {
            list-style-type: none;
            color: #53533C;
            margin:0;
            padding:0;
        }
      
        .art-BlockContent-body ul li
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        margin-left: 12px;
        line-height: 125%;
          line-height: 1.25em;
          padding: 0px 0 0px 13px;
          background-image: url(‘http://img62.imageshack.us/img62/8021/blockcontentbulletsd.png&#8217;);
          background-repeat: no-repeat;
        }
      
      
      
        /* Variable definitions
           ====================
            <Variable name=»textcolor» description=»Block Text Color»
                     type=»color» default=»#68684B» value=»#68684B»>
          
            <Variable name=»linkcolor» description=»Block Link Color»
                     type=»color» default=»#787B23″ value=»#787B23″>
      
            <Variable name=»visitedlinkcolor» description=»Block Visited Link Color»
                     type=»color» default=»#989871″ value=»#989871″>
      
            <Variable name=»hoveredlinkcolor» description=»Block Hovered Link Color»
                     type=»color» default=»#879F32″ value=»#879F32″>
      
        */
      
        .art-BlockContent-body
        {
            color: $textcolor;
        }
      
        .art-BlockContent-body a:link
        {
            color: $linkcolor;
        }
      
        .art-BlockContent-body a:visited, .art-BlockContent-body a.visited
        {
            color: $visitedlinkcolor;
        }
      
        .art-BlockContent-body a:hover, .art-BlockContent-body a.hover
        {
            color: $hoveredlinkcolor;
        }
      
        .toggle span
        {
            color: $linkcolor;
        }
      
        .gsc-branding-text {
            color: $textcolor !important;
        }
      
        /* end Box, BlockContent */
      
        /* begin Box, Post */
        .art-Post
        {
            position:relative;
            z-index:0;
            margin:0 auto;
            min-width:1px;
            min-height:1px;
        }
      
        .art-Post-body
        {
            position: relative;
            z-index: 1;
            padding: 0px;
        }
      
      
      
        .art-Post
        {
            margin: 7px;
        }
      
        /* Start images */
        a img
        {
            border: 0;
        }
      
        .art-article img, img.art-article
        {
            border: solid 1px #C5C5AF;
            margin: 1em;
        }
      
        .art-metadata-icons img
        {
            border: none;
            vertical-align: middle;
            margin: 2px;
        }
        /* Finish images */
      
        /* Start tables */
      
        .art-article table, table.art-article
        {
            border-collapse: collapse;
            margin: 1px;
            width:auto;
        }
      
        .art-article table, table.art-article .art-article tr, .art-article th, .art-article td
        {
            background-color:Transparent;
        }
      
        .art-article th, .art-article td
        {
            padding: 2px;
            border: solid 1px #68684B;
            vertical-align: top;
            text-align:left;
        }
      
        .art-article th
        {
            text-align: center;
            vertical-align: middle;
            padding: 7px;
        }
      
        /* Finish tables */
      
        pre
        {
            overflow: auto;
            padding: 0.1em;
        }
      
      
      
        #uds-searchControl .gsc-results, #uds-searchControl .gsc-tabhActive
        {
            border-color: #68684B !important;
        }
        /* end Box, Post */
      
        /* begin PostMetadata */
        .art-PostMetadataHeader
        {
            padding:1px;
            background-color: #EBF2D4;
            border-color: #C5C5AF;
        border-style: solid;
        border-width: 1px;
        }
        /* end PostMetadata */
      
        /* begin PostHeaderIcon */
        .art-PostHeader
        {
            text-decoration:none;
            margin: 0.2em 0;
            padding: 0;
            font-weight:normal;
            font-style:normal;
            letter-spacing:normal;
            word-spacing:normal;
            font-variant:normal;
            text-decoration:none;
            font-variant:normal;
            text-transform:none;
            text-align:left;
            text-indent:0;
            line-height:inherit;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 20px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 2px;
        text-align: left;
        margin-top: 12px;
        margin-bottom: 8px;
            color: #424E18;
        }
      
        .art-PostHeader a, .art-PostHeader a:link, .art-PostHeader a:visited, .art-PostHeader a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 20px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 2px;
        text-align: left;
        margin-top: 12px;
        margin-bottom: 8px;
            margin:0;
            color: #424E18;
        }
      
        /* end PostHeaderIcon */
      
        /* begin PostHeader */
        .art-PostHeader a:link
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        text-align: left;
          color: #53611F;
        }
      
        .art-PostHeader a:visited, .art-PostHeader a.visited
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        text-align: left;
          color: #F4AD5D;
        }
      
        .art-PostHeader a:hover, .art-PostHeader a.hovered
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        text-align: left;
          color: #21270C;
        }
        /* end PostHeader */
      
        /* begin PostIcons */
        .art-PostHeaderIcons
        {
            padding:1px;
        }
      
        .art-PostHeaderIcons, .art-PostHeaderIcons a, .art-PostHeaderIcons a:link, .art-PostHeaderIcons a:visited, .art-PostHeaderIcons a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 11px;
        letter-spacing: 1px;
            color: #FFFFFF;
        }
      
        .art-PostHeaderIcons a, .art-PostHeaderIcons a:link, .art-PostHeaderIcons a:visited, .art-PostHeaderIcons a:hover
        {
            margin:0;
        }
      
        .art-PostHeaderIcons a:link
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-style: normal;
        font-weight: bold;
        text-decoration: none;
            color: #C7D987;
        }
      
        .art-PostHeaderIcons a:visited, .art-PostHeaderIcons a.visited
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        letter-spacing: 1px;
            color: #D9DC84;
        }
      
        .art-PostHeaderIcons a:hover, .art-PostHeaderIcons a.hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
            color: #27280B;
        }
        /* end PostIcons */
      
        /* begin PostContent */
        /* Content Text Font & Color (Default) */
        body
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        font-style: normal;
        font-weight: normal;
        letter-spacing: 1px;
          color: #F9F9F6;
        }
      
      
        .art-PostContent p
        {
            margin: 0.5em 0;
        }
      
        .art-PostContent, .art-PostContent p
        {
        font-family: Arial, Helvetica, Sans-Serif;
        letter-spacing: 1px;
          color: #F9F9F6;
        }
      
        .art-PostContent
        {
          margin:0;
        }
      
      
        /* Start Content link style */
        /*
        The right order of link pseudo-classes: Link-Visited-Hover-Focus-Active.
        http://www.w3schools.com/CSS/css_pseudo_classes.asp
        http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states/
        */
        a
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        letter-spacing: 1px;
          color: #D9DC84;
        }
      
        /* Adds special style to an unvisited link. */
        a:link
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        letter-spacing: 1px;
          color: #D9DC84;
        }
      
        /* Adds special style to a visited link. */
        a:visited, a.visited
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
          color: #F4AD5D;
        }
      
        /* :hover – adds special style to an element when you mouse over it. */
        a:hover, a.hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
          color: #21270C;
        }
      
        /* Finish Content link style */
      
        /* Resert some headings default style & links default style for links in headings*/
        h1, h2, h3, h4, h5, h6,
        h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
        h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
        h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited
        {
          font-weight: normal;
          font-style: normal;
          text-decoration: none;
        }
      
      
        /* Start Content headings Fonts & Colors  */
        h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 22px;
        letter-spacing: 3px;
        text-align: left;
          color: #FFFFFF;
        }
      
        h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 20px;
        letter-spacing: 2px;
        text-align: left;
          color: #BDBDA3;
        }
      
        h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 18px;
        letter-spacing: 2px;
        text-align: left;
          color: #BDBDA3;
        }
      
        h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 14px;
        letter-spacing: 2px;
        text-align: left;
          color: #F9F9F6;
        }
      
        h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        letter-spacing: 2px;
        text-align: left;
          color: #F9F9F6;
        }
      
        h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        letter-spacing: 2px;
        text-align: left;
          color: #F9F9F6;
        }
        /* Finish Content headings Fonts & Colors  */
      
      
        #uds-searchControl .gsc-results,
        #uds-searchControl .gsc-tabhActive
        {
        font-family: Arial, Helvetica, Sans-Serif;
        letter-spacing: 1px;
          color: #F9F9F6 !important;
        }
      
      
        #uds-searchControl a,
        #uds-searchControl .gs-result .gs-title *,
        #uds-searchControl .gs-visibleUrl ,
        #uds-searchControl .gsc-tabhInactive
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        letter-spacing: 1px;
          color: #D9DC84 !important;
        }/* end PostContent */
      
        /* begin PostBullets */
        /* Start Content list */
        ol, ul
        {
            color: #E9EBB7;
            margin:1em 0 1em 2em;
            padding:0;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        text-align: left;
        }
      
        li ol, li ul
        {
            margin:0.5em 0 0.5em 2em;
            padding:0;
        }
      
        li
        {
            margin:0.2em 0;
            padding:0;
        }
      
        ul
        {
            list-style-type: none;
        }
      
        ol
        {
            list-style-position:inside;
          
        }
      
      
      
        .art-Post li
        {
            padding:0px 0 0px 13px;
            line-height:1.2em;
        }
      
        .art-Post ol li, .art-Post ul ol li
        {
            background: none;
            padding-left:0;
        }
      
        .art-Post ul li, .art-Post ol ul li
        {
            background-image: url(‘http://img62.imageshack.us/img62/2372/postbulletsa.png&#8217;);
            background-repeat:no-repeat;
            padding-left:13px;
        }
      
      
        /* Finish Content list */
        /* end PostBullets */
      
        /* begin PostQuote */
        /* Start blockquote */
        blockquote,
        blockquote p,
        .art-PostContent blockquote p
        {
            color:#383829;
        font-family: Arial, Helvetica, Sans-Serif;
        font-style: italic;
        font-weight: normal;
        text-align: left;
        }
      
        blockquote,
        .art-PostContent blockquote
        {
                border:solid 1px #C5C5AF;
                margin:10px 10px 10px 50px;
            padding:5px 5px 5px 41px;
            background-color:#E1E1D6;
            background-image:url(‘http://img62.imageshack.us/img62/2425/postquotewb.png&#8217;);
            background-position:left top;
            background-repeat:no-repeat;
        }
      
      
        /* Finish blockuote */
        /* end PostQuote */
      
        /* begin PostMetadata */
        .art-PostMetadataFooter
        {
            padding:1px;
            background-color: #F2F2ED;
            border-color: #C5C5AF;
        border-style: solid;
        border-width: 1px;
        }
        /* end PostMetadata */
      
        /* begin PostIcons */
        .art-PostFooterIcons
        {
            padding:1px;
        }
      
        .art-PostFooterIcons, .art-PostFooterIcons a, .art-PostFooterIcons a:link, .art-PostFooterIcons a:visited, .art-PostFooterIcons a:hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 11px;
        text-decoration: none;
        letter-spacing: 1px;
            color: #595940;
        }
      
        .art-PostFooterIcons a, .art-PostFooterIcons a:link, .art-PostFooterIcons a:visited, .art-PostFooterIcons a:hover
        {
            margin:0;
        }
      
        .art-PostFooterIcons a:link
        {
        font-family: Arial, Helvetica, Sans-Serif;
        font-style: normal;
        font-weight: bold;
        text-decoration: none;
        letter-spacing: 1px;
            color: #6A7C27;
        }
      
        .art-PostFooterIcons a:visited, .art-PostFooterIcons a.visited
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        letter-spacing: 1px;
            color: #7C7F24;
        }
      
        .art-PostFooterIcons a:hover, .art-PostFooterIcons a.hover
        {
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        letter-spacing: 1px;
            color: #27280B;
        }
        /* end PostIcons */
      
        /* begin Button */
        .art-button-wrapper .art-button
        {
            display:inline-block;
            width: auto;
            outline:none;
            border:none;
            background:none;
            line-height:33px;
            margin:0 !important;
            padding:0 !important;
            overflow: visible;
            cursor: default;
            text-decoration: none !important;
            z-index:0;
            vertical-align: middle;
        }
      
        .art-button img, .art-button-wrapper img
        {
          margin: 0;
        }
      
        .art-button-wrapper
        {
            display:inline-block;
            vertical-align: middle;
            position:relative;
            height: 33px;
            overflow:hidden;
            white-space: nowrap;
            width: auto;
            z-index:0;
        }
      
        .firefox2 .art-button-wrapper
        {
            display:block;
            float:left;
        }
      
        .art-button-wrapper .art-button
        {
            display:block;
            height: 33px;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 1px;
            white-space: nowrap;
            text-align: left;
            padding: 0 21px !important;
            line-height: 33px;
            text-decoration: none !important;
            color: #000000 !important;
        }
      
        input, select
        {
          vertical-align: middle;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 12px;
        font-style: normal;
        font-weight: bold;
        letter-spacing: 1px;
        }
      
        .art-button-wrapper.hover .art-button, .art-button:hover
        {
            color: #000000 !important;
            text-decoration: none !important;
        }
      
        .art-button-wrapper.active .art-button
        {
            color: #F6F9EC !important;
        }
      
        .art-button-wrapper .l, .art-button-wrapper .r
        {
            display:block;
            position:absolute;
            z-index:-1;
            height: 99px;
            background-image: url(‘http://img62.imageshack.us/img62/3191/buttonyw.png&#8217;);
        }
      
        .art-button-wrapper .l
        {
            left:0;
            right:10px;
        }
      
        .art-button-wrapper .r
        {
            width:409px;
            right:0;
            clip: rect(auto, auto, auto, 399px);
        }
      
        .art-button-wrapper.hover .l, .art-button-wrapper.hover .r
        {
            top: -33px;
        }
      
        .art-button-wrapper.active .l, .art-button-wrapper.active .r
        {
            top: -66px;
        }
      
      
        /* end Button */
      
        /* begin Footer */
        .art-Footer
        {
            position:relative;
            z-index:0;
            overflow:hidden;
            width: 994px;
            margin: 5px auto 0px auto;
        }
      
        .art-Footer .art-Footer-inner
        {
            height:1%;
            position: relative;
            z-index: 0;
            padding: 8px;
            text-align: center;
        }
      
        .art-Footer .art-Footer-background
        {
            position:absolute;
            z-index:-1;
            background-repeat:no-repeat;
            background-image: url(‘http://img62.imageshack.us/img62/3746/footerzd.png&#8217;);
            width: 994px;
            height: 150px;
            bottom:0;
            left:0;
        }
      
      
        .art-rss-tag-icon
        {
            position: relative;
            display:block;
            float:left;
            background-image: url(‘http://img62.imageshack.us/img62/1695/rssiconxb.png&#8217;);
            background-position: center right;
            background-repeat: no-repeat;
            margin: 0 5px 0 0;
            height: 32px;
            width: 24px;
            cursor: default;
        }
      
      
      
      
        .art-Footer .art-Footer-text p
        {
            margin: 0;
        }
      
        .art-Footer .art-Footer-text
        {
            display:inline-block;
            color:#FFFFFF;
        font-family: Arial, Helvetica, Sans-Serif;
        font-size: 13px;
        letter-spacing: 1px;
        }
      
        .art-Footer .art-Footer-text a:link
        {
            text-decoration: none;
            color: #FFFFFF;
        font-family: Arial, Helvetica, Sans-Serif;
        font-style: normal;
        font-weight: bold;
        text-decoration: none;
        }
      
        .art-Footer .art-Footer-text a:visited
        {
            text-decoration: none;
            color: #94946B;
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: none;
        }
      
        .art-Footer .art-Footer-text a:hover
        {
            text-decoration: none;
            color: #94946B;
        font-family: Arial, Helvetica, Sans-Serif;
        text-decoration: underline;
        }
        /* end Footer */
      
        /* begin PageFooter */
        .art-page-footer, .art-page-footer a, .art-page-footer a:link, .art-page-footer a:visited, .art-page-footer a:hover
        {
            font-family:Arial;
            font-size:10px;
            letter-spacing:normal;
            word-spacing:normal;
            font-style:normal;
            font-weight:normal;
            text-decoration:underline;
            color:#9B9F2D;
        }
      
        .art-page-footer
        {
            margin:1em;
            text-align:center;
            text-decoration:none;
            color:#9A9A74;
        }
        /* end PageFooter */
      
        /* begin LayoutCell */
        .art-contentLayout .art-sidebar1
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 248px;
        }
        /* end LayoutCell */
      
        /* begin LayoutCell */
        .art-contentLayout .art-content
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 496px;
        }
        .art-contentLayout .art-content-sidebar1
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 744px;
        }
        .art-contentLayout .art-content-sidebar2
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 744px;
        }
        .art-contentLayout .art-content-wide
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 992px;
        }
        /* end LayoutCell */
      
        /* begin LayoutCell */
        .art-contentLayout .art-sidebar2
        {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            float: left;
            overflow: hidden;
            width: 248px;
        }
        /* end LayoutCell */
      
      
    
    ]]></b:skin>
  
    <!–[if IE 6]>
      <style type=»text/css»>
/* begin Page */
      
        /* Generated with Artisteer version 2.3.0.23326, file checksum is 0950A3F6. */
      
        img
        {
            filter:expression(fixPNG(this));
        }
        #ArchiveList ul li
        {
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»»);
        }
        #ArchiveList a.toggle, #ArchiveList a.toggle:link, #ArchiveList a.toggle:visited, #ArchiveList a.toggle:hover
        {
            color: expression(this.parentNode.currentStyle[«color»]);
        }
        /* end Page */
      
        /* begin Box, Sheet */
        .art-Sheet, .art-Sheet-body
        {
            zoom:1;
        }
      
        .art-Sheet-body
        {
            position:static;
        }
      
        .art-Sheet-tr, .art-Sheet-tl, .art-Sheet-br, .art-Sheet-bl, .art-Sheet-tc, .art-Sheet-bc,.art-Sheet-cr, .art-Sheet-cl
        {
            font-size: 1px;
            background: none;
        }
      
        .art-Sheet-tr, .art-Sheet-tl, .art-Sheet-br, .art-Sheet-bl
        {
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img163.imageshack.us/img163/1989/sheetsyc.png’,sizingMethod=’scale’)»);
        }
      
        .art-Sheet-tl
        {
            clip: rect(auto 17px 17px auto);
        }
      
        .art-Sheet-tr
        {
            left: expression(this.parentNode.offsetWidth-34+’px’);
            clip: rect(auto auto 17px 17px);
        }
      
        .art-Sheet-bl
        {
            top: expression(this.parentNode.offsetHeight-34+’px’);
            clip: rect(17px 17px auto auto);
        }
      
        .art-Sheet-br
        {
            top: expression(this.parentNode.offsetHeight-34+’px’);
            left: expression(this.parentNode.offsetWidth-34+’px’);
            clip: rect(17px auto auto 17px);
        }
      
        .art-Sheet-tc, .art-Sheet-bc
        {
            width: expression(this.parentNode.offsetWidth-34+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img163.imageshack.us/img163/6388/sheethdc.png’,sizingMethod=’scale’)»);
        }
      
        .art-Sheet-tc
        {
            clip: rect(auto auto 17px auto);
        }
      
        .art-Sheet-bc
        {
            top: expression(this.parentNode.offsetHeight-34+’px’);
            clip: rect(17px auto auto auto);
        }
      
        .art-Sheet-cr, .art-Sheet-cl
        {
            height: expression(this.parentNode.offsetHeight-34+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img163.imageshack.us/img163/5375/sheetvf.png’,sizingMethod=’scale’)»);
        }
      
        .art-Sheet-cr
        {
            left: expression(this.parentNode.offsetWidth-34+’px’);
            clip: rect(auto auto auto 17px);
        }
      
        .art-Sheet-cl
        {
            clip: rect(auto 17px auto auto);
        }
      
        .art-Sheet-cc
        {
            font-size: 1px;
            width: expression(this.parentNode.offsetWidth-34+’px’);
            height: expression(this.parentNode.offsetHeight-34+’px’);
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img163.imageshack.us/img163/7223/sheetcy.png’,sizingMethod=’scale’)»);
        }
        #art-page-background-simple-gradient, #art-page-background-gradient, #art-page-background-glare
        {
            width:expression(document.body.clientWidth > 1000 ? «100%» : «1000px»);
        }
        /* end Box, Sheet */
      
        /* begin Header */
        div.art-Header-png
        {
            font-size: 1px;
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img163.imageshack.us/img163/8117/headerir.png’,sizingMethod=’crop’)»);
        }
        /* end Header */
      
        /* begin Menu */
      
        .art-menu ul
        {
            height: 1%;
            width:1px;
        }
      
        .art-menu, .art-menu ul
        {
            height: 1%;
        }
      
        .art-menu li.art-menuhover
        {
            z-index: 10000;
        }
      
        .art-menu .art-menuhoverUL
        {
            visibility: visible;
        }
      
        .art-menu .art-menuhoverUL
        {
            top: 100%;
            left: 0;
        }
      
        .art-menu .art-menuhoverUL .art-menuhoverUL
        {
            top: 0;
            left: 100%;
        }
      
        .art-menu ul a
        {
            height: 1%;
        }
      
        .art-menu li li
        {
            float: left;
            width: 100%;
        }
      
        .art-menu .art-menuhoverUL .art-menuhoverUL
        {
            top: 5px;
            left: 100%;
        }
      
        .art-menu, .art-menu ul
        {
            height: 1%;
        }
      
        .art-menu li.art-menuhover
        {
            z-index: 10000;
        }
      
        .art-menu .art-menuhoverUL
        {
            visibility: visible;
        }
      
        .art-menu .art-menuhoverUL
        {
            top: 100%;
            left: 0;
        }
      
        .art-menu .art-menuhoverUL .art-menuhoverUL
        {
            top: 0;
            left: 100%;
        }
      
        .art-menu ul a
        {
            height: 1%;
        }
      
        .art-menu li li
        {
            float: left;
            width: 100%;
        }
      
        .art-nav
        {
            zoom: 1;
        }
      
        .art-nav .l, .art-nav .r
        {
            font-size: 1px;
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/1677/navu.png’,sizingMethod=’crop’)»);
        }
      
        .art-nav .l
        {
            width: expression(this.parentNode.offsetWidth-0+’px’);
        }
      
        .art-nav .r
        {
            left: expression(this.parentNode.offsetWidth-994+’px’);
            clip: rect(auto auto auto 994px);
        }
      
        /* end Menu */
      
        /* begin MenuItem */
        .art-menu a
        {
            float:left;
        }
      
        .art-menu a:hover
        {
            visibility:visible;
        }
      
        .art-menu a .r, .art-menu a .l
        {
            font-size:1px;
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/1272/menuitemh.png’,sizingMethod=’crop’)»);
        }
      
        .art-menu a .r
        {
            left: expression(this.parentNode.offsetWidth-406+’px’);
            clip: rect(auto auto auto 403px);
        }
      
        .art-menu a .l
        {
            width: expression(this.parentNode.offsetWidth-3+’px’);
        }
      
        .art-menuhover .art-menuhoverA .t
        {
            color: #212118;
        }
      
        .art-menuhover .art-menuhoverA .l, .art-menuhover .art-menuhoverA .r
        {
            top: -25px;
        }
        /* end MenuItem */
      
        /* begin MenuSubItem */
      
        .art-menu ul a
        {
            color: #595B1A !important;
        }
      
        .art-menu ul a:hover {
            color: #3B4616 !important;
        }  
      
        .art-menu ul .art-menuhover .art-menuhoverA
        {
            color: #3B4616 !important;
            background-position: 0 -20px;
        }
      
        .art-nav .art-menu ul a:hover span, .art-nav .art-menu ul a:hover span span
        {
            color: #3B4616 !important;
        }  
      
        .art-nav .art-menu ul .art-menuhover .art-menuhoverA span, .art-nav .art-menu ul .art-menuhover .art-menuhoverA span span
        {
            color: #3B4616 !important;
        }
      
        /* end MenuSubItem */
      
        /* begin Box, Block */
        .art-Block, .art-Block-body
        {
            zoom:1;
        }
      
        .art-Block-body
        {
            position:static;
        }
      
        .art-Block-tr, .art-Block-tl, .art-Block-br, .art-Block-bl, .art-Block-tc, .art-Block-bc,.art-Block-cr, .art-Block-cl
        {
            font-size: 1px;
            background: none;
        }
      
        .art-Block-tr, .art-Block-tl, .art-Block-br, .art-Block-bl
        {
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/3671/blocksd.png’,sizingMethod=’scale’)»);
        }
      
        .art-Block-tl
        {
            clip: rect(auto 1px 1px auto);
        }
      
        .art-Block-tr
        {
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(auto auto 1px 1px);
        }
      
        .art-Block-bl
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            clip: rect(1px 1px auto auto);
        }
      
        .art-Block-br
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(1px auto auto 1px);
        }
      
        .art-Block-tc, .art-Block-bc
        {
            width: expression(this.parentNode.offsetWidth-2+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/8848/blockhz.png’,sizingMethod=’scale’)»);
        }
      
        .art-Block-tc
        {
            clip: rect(auto auto 1px auto);
        }
      
        .art-Block-bc
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            clip: rect(1px auto auto auto);
        }
      
        .art-Block-cr, .art-Block-cl
        {
            height: expression(this.parentNode.offsetHeight-2+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/2893/blockvn.png’,sizingMethod=’scale’)»);
        }
      
        .art-Block-cr
        {
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(auto auto auto 1px);
        }
      
        .art-Block-cl
        {
            clip: rect(auto 1px auto auto);
        }
      
        .art-Block-cc
        {
            font-size: 1px;
            width: expression(this.parentNode.offsetWidth-2+’px’);
            height: expression(this.parentNode.offsetHeight-2+’px’);
            background-color: #DBDBCD;
        }
        /* end Box, Block */
      
        /* begin BlockHeader */
        .art-BlockHeader, .art-BlockHeader
        {
            font-size: 1px;
        }
      
        .art-header-tag-icon
        {
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/850/blockheadericonp.png’,sizingMethod=’crop’)»);
        }
      
        /* end BlockHeader */
      
        /* begin Box, BlockContent */
        .art-BlockContent, .art-BlockContent-body
        {
            zoom:1;
        }
      
        .art-BlockContent-body
        {
            position:static;
        }
      
        .art-BlockContent-tr, .art-BlockContent-tl, .art-BlockContent-br, .art-BlockContent-bl, .art-BlockContent-tc, .art-BlockContent-bc,.art-BlockContent-cr, .art-BlockContent-cl
        {
            font-size: 1px;
            background: none;
        }
      
        .art-BlockContent-tr, .art-BlockContent-tl, .art-BlockContent-br, .art-BlockContent-bl
        {
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/5586/blockcontentsom.png’,sizingMethod=’scale’)»);
        }
      
        .art-BlockContent-tl
        {
            clip: rect(auto 1px 1px auto);
        }
      
        .art-BlockContent-tr
        {
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(auto auto 1px 1px);
        }
      
        .art-BlockContent-bl
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            clip: rect(1px 1px auto auto);
        }
      
        .art-BlockContent-br
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(1px auto auto 1px);
        }
      
        .art-BlockContent-tc, .art-BlockContent-bc
        {
            width: expression(this.parentNode.offsetWidth-2+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/579/blockcontenthc.png’,sizingMethod=’scale’)»);
        }
      
        .art-BlockContent-tc
        {
            clip: rect(auto auto 1px auto);
        }
      
        .art-BlockContent-bc
        {
            top: expression(this.parentNode.offsetHeight-2+’px’);
            clip: rect(1px auto auto auto);
        }
      
        .art-BlockContent-cr, .art-BlockContent-cl
        {
            height: expression(this.parentNode.offsetHeight-2+’px’);
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/7117/blockcontentve.png’,sizingMethod=’scale’)»);
        }
      
        .art-BlockContent-cr
        {
            left: expression(this.parentNode.offsetWidth-2+’px’);
            clip: rect(auto auto auto 1px);
        }
      
        .art-BlockContent-cl
        {
            clip: rect(auto 1px auto auto);
        }
      
        .art-BlockContent-cc
        {
            font-size: 1px;
            width: expression(this.parentNode.offsetWidth-2+’px’);
            height: expression(this.parentNode.offsetHeight-2+’px’);
            background-color: #ECECE4;
        }
      
        .art-BlockContent-body ul li
        {
            height:1%;
            background:none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/8021/blockcontentbulletsd.png’,sizingMethod=’crop’)»);
        }
      
        /* end Box, BlockContent */
      
        /* begin Box, Post */
        .art-Post, .art-Post-body
        {
            zoom:1;
        }
      
        .art-Post-body
        {
            position:static;
        }
        /* end Box, Post */
      
        /* begin PostContent */
        h1
        {
          margin: 0.67em 0;
        }
      
        h2
        {
          margin: 0.8em 0;
        }
      
        h3
        {
          margin: 1em 0;
        }
      
        h4
        {
          margin: 1.25em 0;
        }
      
        h5
        {
          margin: 1.67em 0;
        }
      
        h6
        {
          margin: 2.33em 0;
        }
        /* end PostContent */
      
        /* begin PostBullets */
        .art-Post ul li, .art-Post ol ul li
        {
            height:1%;
            background:none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/2372/postbulletsa.png’,sizingMethod=’crop’)»);
        }
      
        .art-Post ul ol li
        {
            background:none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»»);
        }
        /* end PostBullets */
      
        /* begin PostQuote */
        blockquote,
        .art-PostContent blockquote
        {
            height:1%;
            background-image: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/2425/postquotewb.png’,sizingMethod=’crop’)»);
        }
        /* end PostQuote */
      
        /* begin Button */
        .art-button-wrapper, .art-button-wrapper .l, .art-button-wrapper .r
        {
            font-size: 1px;
        }
      
        .art-button-wrapper .art-button
        {
            float:left;
        }
      
        .art-button-wrapper .l, .art-button-wrapper .r
        {
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/3191/buttonyw.png’,sizingMethod=’crop’)»);
        }
      
        .art-button-wrapper .r
        {
            left: expression(this.parentNode.offsetWidth-409+’px’);
            clip: rect(auto auto auto 399px);
        }
      
        .art-button-wrapper .l
        {
            width: expression(this.parentNode.offsetWidth-10+’px’);
        }
      
        /* end Button */
      
        /* begin Footer */
        .art-Footer .art-Footer-background
        {
            top: expression(this.parentNode.offsetHeight-150+’px’);
            background: none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/3746/footerzd.png’,sizingMethod=’crop’)»);
            zoom: 1;
            font-size:1px;
        }
      
        .art-rss-tag-icon
        {
            zoom:1;
            font-size:1px;
            background:none;
            behavior: expression(this.runtimeStyle.filter?»:this.runtimeStyle.filter=»progid:DXImageTransform.Microsoft.AlphaImageLoader(src='» + GetStyleUrl()+»http://img62.imageshack.us/img62/1695/rssiconxb.png’,sizingMethod=’crop’)»);
        }
      
        /* end Footer */
      
      
      </style>
    <![endif]–>
    <!–[if IE 7]>
      <style type=»text/css»>
/* begin Box, Sheet */
        .art-Sheet-tl
        {
            clip: rect(auto 17px 17px auto);
        }
      
        .art-Sheet-tr
        {
            clip: rect(auto auto 17px 17px);
        }
      
        .art-Sheet-bl
        {
            clip: rect(17px 17px auto auto);
        }
      
        .art-Sheet-br
        {
            clip: rect(17px auto auto 17px);
        }
      
        .art-Sheet-tc
        {
            clip: rect(auto auto 17px auto);
        }
      
        .art-Sheet-bc
        {
            clip: rect(17px auto auto auto);
        }
      
        .art-Sheet-cr
        {
            clip: rect(auto auto auto 17px);
        }
      
        .art-Sheet-cl
        {
            clip: rect(auto 17px auto auto);
        }
      
        .art-Sheet-body
        {
            zoom: 1;
        }
        /* end Box, Sheet */
      
        /* begin Menu */
        .art-nav .r
        {
            clip: rect(auto auto auto 994px);
        }
        /* end Menu */
      
        /* begin MenuItem */
        .art-menu a .r
        {
            clip: rect(auto auto auto 403px);
        }
        /* end MenuItem */
      
        /* begin Box, Block */
        .art-Block-tl
        {
            clip: rect(auto 1px 1px auto);
        }
      
        .art-Block-tr
        {
            clip: rect(auto auto 1px 1px);
        }
      
        .art-Block-bl
        {
            clip: rect(1px 1px auto auto);
        }
      
        .art-Block-br
        {
            clip: rect(1px auto auto 1px);
        }
      
        .art-Block-tc
        {
            clip: rect(auto auto 1px auto);
        }
      
        .art-Block-bc
        {
            clip: rect(1px auto auto auto);
        }
      
        .art-Block-cr
        {
            clip: rect(auto auto auto 1px);
        }
      
        .art-Block-cl
        {
            clip: rect(auto 1px auto auto);
        }
      
        .art-Block-body
        {
            zoom: 1;
        }
        /* end Box, Block */
      
        /* begin Box, BlockContent */
        .art-BlockContent-tl
        {
            clip: rect(auto 1px 1px auto);
        }
      
        .art-BlockContent-tr
        {
            clip: rect(auto auto 1px 1px);
        }
      
        .art-BlockContent-bl
        {
            clip: rect(1px 1px auto auto);
        }
      
        .art-BlockContent-br
        {
            clip: rect(1px auto auto 1px);
        }
      
        .art-BlockContent-tc
        {
            clip: rect(auto auto 1px auto);
        }
      
        .art-BlockContent-bc
        {
            clip: rect(1px auto auto auto);
        }
      
        .art-BlockContent-cr
        {
            clip: rect(auto auto auto 1px);
        }
      
        .art-BlockContent-cl
        {
            clip: rect(auto 1px auto auto);
        }
      
        .art-BlockContent-body
        {
            zoom: 1;
        }
        /* end Box, BlockContent */
      
        /* begin Box, Post */
      
        .art-Post-body
        {
            zoom: 1;
        }
        /* end Box, Post */
      
        /* begin PostContent */
        .art-PostContent
        {
            height:1%;
        }
        /* end PostContent */
      
        /* begin Button */
        .art-button-wrapper .r
        {
            clip: rect(auto auto auto 399px);
        }
        /* end Button */
      
      
      </style>
    <![endif]–>

    <script type=’text/javascript’>
      /* begin Page */

/* Generated with Artisteer version 2.3.0.23326, file checksum is 5BBC8659. */

cssFix = function(){
var u = navigator.userAgent.toLowerCase(),
addClass = function(el, val){
    if(! el.className) {
        el.className = val;
    } else {
        var newCl = el.className;
        newCl+=(' '+val);
        el.className = newCl;
    }
},
is = function(t){return (u.indexOf(t)!=-1)};
addClass(document.getElementsByTagName('html')[0],[
(!(/opera|webtv/i.test(u))&amp;&amp;/msie (\d)/.test(u))?('ie ie'+RegExp.$1)
: is('firefox/2')?'gecko firefox2'
: is('firefox/3')?'gecko firefox3'
: is('gecko/')?'gecko'
: is('chrome/')?'chrome'
: is('opera/9')?'opera opera9':/opera (\d)/.test(u)?'opera opera'+RegExp.$1
: is('konqueror')?'konqueror'
: is('applewebkit/')?'webkit safari'
: is('mozilla/')?'gecko':'',
(is('x11')||is('linux'))?' linux'
: is('mac')?' mac'
: is('win')?' win':''
].join(' '));
}();

var artEventHelper = {
    'bind': function(obj, evt, fn) {
        if (obj.addEventListener)
            obj.addEventListener(evt, fn, false);
        else if (obj.attachEvent)
            obj.attachEvent('on' + evt, fn);
        else
            obj['on' + evt] = fn;
    }
};

var userAgent = navigator.userAgent.toLowerCase();
var browser = {
    version: (userAgent.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || [])[1],
    safari: /webkit/.test(userAgent) &amp;&amp; !/chrome/.test(userAgent),
    chrome: /chrome/.test(userAgent),
    opera: /opera/.test(userAgent),
    msie: /msie/.test(userAgent) &amp;&amp; !/opera/.test(userAgent),
    mozilla: /mozilla/.test(userAgent) &amp;&amp; !/(compatible|webkit)/.test(userAgent)
};

var artLoadEvent = (function() {
  

    var list = [];

    var done = false;
    var ready = function() {
        if (done) return;
        done = true;
        for (var i = 0; i &lt; list.length; i++)
            list[i]();
    };

    if (document.addEventListener &amp;&amp; !browser.opera)
        document.addEventListener('DOMContentLoaded', ready, false);

    if (browser.msie &amp;&amp; window == top) {
        (function() {
            try {
                document.documentElement.doScroll('left');
            } catch (e) {
                setTimeout(arguments.callee, 10);
                return;
            }
            ready();
        })();
    }

    if (browser.opera) {
        document.addEventListener('DOMContentLoaded', function() {
            for (var i = 0; i &lt; document.styleSheets.length; i++) {
                if (document.styleSheets[i].disabled) {
                    setTimeout(arguments.callee, 10);
                    return;
                }
            }
            ready();
        }, false);
    }

    if (browser.safari || browser.chrome) {
        var numStyles;
        (function() {
            if (document.readyState != 'loaded' &amp;&amp; document.readyState != 'complete') {
                setTimeout(arguments.callee, 10);
                return;
            }
            if ('undefined' == typeof numStyles) {
                numStyles = document.getElementsByTagName('style').length;
                var links = document.getElementsByTagName('link');
                for (var i = 0; i &lt; links.length; i++) {
                    numStyles += (links[i].getAttribute('rel') == 'stylesheet') ? 1 : 0;
                }
                if (document.styleSheets.length != numStyles) {
                    setTimeout(arguments.callee, 0);
                    return;
                }
            }
            ready();
        })();
    }
    artEventHelper.bind(window, 'load', ready);
    return ({
        add: function(f) {
            list.push(f);
        }
    })
})();

(function() {
    // fix ie blinking
    var m = document.uniqueID &amp;&amp; document.compatMode &amp;&amp; !window.XMLHttpRequest &amp;&amp; document.execCommand;
    try { if (!!m) { m('BackgroundImageCache', false, true); } }
    catch (oh) { };
})();

function xGetElementsByClassName(clsName, parentEle, tagName) {
    var elements = null;
    var found = [];
    var s = String.fromCharCode(92);
    var re = new RegExp('(?:^|' + s + 's+)' + clsName + '(?:$|' + s + 's+)');
    if (!parentEle) parentEle = document;
    if (!tagName) tagName = '*';
    elements = parentEle.getElementsByTagName(tagName);
    if (elements) {
        for (var i = 0; i &lt; elements.length; ++i) {
            if (elements[i].className.search(re) != -1) {
                found[found.length] = elements[i];
            }
        }
    }
    return found;
}

var styleUrlCached = null;
function GetStyleUrl() {
    if (null == styleUrlCached) {
        var ns;
        styleUrlCached = '';
        ns = document.getElementsByTagName('link');
        for (var i = 0; i &lt; ns.length; i++) {
            var l = ns[i];
            if (l.href &amp;&amp; /style\.ie6\.css(\?.*)?$/.test(l.href)) {
                return styleUrlCached = l.href.replace(/style\.ie6\.css(\?.*)?$/, '');
            }
        }

        ns = document.getElementsByTagName('style');
        for (var i = 0; i &lt; ns.length; i++) {
            var matches = new RegExp('import\\s+&quot;([^&quot;]+\\/)style\\.ie6\\.css&quot;').exec(ns[i].innerHTML);
            if (null != matches &amp;&amp; matches.length &gt; 0)
                return styleUrlCached = matches[1];
        }
    }
    return styleUrlCached;
}

function fixPNG(element) {
    if (/MSIE (5\.5|6).+Win/.test(navigator.userAgent)) {
        var src;
        if (element.tagName == 'IMG') {
            if (/\.png$/.test(element.src)) {
                src = element.src;
                element.src = GetStyleUrl() + 'http://img62.imageshack.us/img62/6748/spacerv.gif&#039;;
            }
        }
        else {
            src = element.currentStyle.backgroundImage.match(/url\(&quot;(.+\.png)&quot;\)/i);
            if (src) {
                src = src[1];
                element.runtimeStyle.backgroundImage = 'none';
            }
        }
        if (src) element.runtimeStyle.filter = &quot;progid:DXImageTransform.Microsoft.AlphaImageLoader(src='&quot; + src + &quot;')&quot;;
    }
}

function artHasClass(el, cls) {
    return (el &amp;&amp; el.className &amp;&amp; (' ' + el.className + ' ').indexOf(' ' + cls + ' ') != -1);
}

var block_header_exists = false;
/* end Page */

/* begin Menu */
function gTranslateFix() {
    var menus = xGetElementsByClassName(&quot;art-menu&quot;, document);
    for (var i = 0; i &lt; menus.length; i++) {
        var menu = menus[i];
        var childs = menu.childNodes;
        var listItems = [];
        for (var j = 0; j &lt; childs.length; j++) {
            var el = childs[j];
            if (String(el.tagName).toLowerCase() == &quot;li&quot;) listItems.push(el);
        }
        for (var j = 0; j &lt; listItems.length; j++) {
            var item = listItems[j];
            var a = null;
            var gspan = null;
            for (var p = 0; p &lt; item.childNodes.length; p++) {
                var l = item.childNodes[p];
                if (!(l &amp;&amp; l.tagName)) continue;
                if (String(l.tagName).toLowerCase() == &quot;a&quot;) a = l;
                if (String(l.tagName).toLowerCase() == &quot;span&quot;) gspan = l;
            }
            if (gspan &amp;&amp; a) {
                var t = null;
                for (var k = 0; k &lt; gspan.childNodes.length; k++) {
                    var e = gspan.childNodes[k];
                    if (!(e &amp;&amp; e.tagName)) continue;
                    if (String(e.tagName).toLowerCase() == &quot;a&quot; &amp;&amp; e.firstChild) e = e.firstChild;
                    if (e &amp;&amp; e.className &amp;&amp; e.className == 't') {
                        t = e;
                        if (t.firstChild &amp;&amp; t.firstChild.tagName &amp;&amp; String(t.firstChild.tagName).toLowerCase() == &quot;a&quot;) {
                            while (t.firstChild.firstChild) t.appendChild(t.firstChild.firstChild);
                            t.removeChild(t.firstChild);
                        }
                        a.appendChild(t);
                        break;
                    }
                }
                gspan.parentNode.removeChild(gspan);
            }
        }
    }
}
artLoadEvent.add(gTranslateFix);

function Insert_Separators() {
    var menus = xGetElementsByClassName(&quot;art-menu&quot;, document, &quot;ul&quot;);
    for (var i = 0; i &lt; menus.length; i++) {
        var menu = menus[i];
        var childs = menu.childNodes;
        var listItems = [];
        for (var j = 0; j &lt; childs.length; j++) {
            var el = childs[j];
            if (String(el.tagName).toLowerCase() == &quot;li&quot;) listItems.push(el);
        }
        for (var j = 0; j &lt; listItems.length – 1; j++) {
            var item = listItems[j];
            var span = document.createElement('span');
            span.className = 'art-menu-separator';
            var li = document.createElement('li');
            li.appendChild(span);
            item.parentNode.insertBefore(li, item.nextSibling);

        }
        if (browser.msie) menu.style.position = &quot;relative&quot;;
    }
  
}
artLoadEvent.add(Insert_Separators);

function Menu_IE6Setup() {
    var isIE6 = navigator.userAgent.toLowerCase().indexOf(&quot;msie&quot;) != -1
    &amp;&amp; navigator.userAgent.toLowerCase().indexOf(&quot;msie 7&quot;) == -1;
    if (!isIE6) return;
    var aTmp2, i, j, oLI, aUL, aA;
    var aTmp = xGetElementsByClassName(&quot;art-menu&quot;, document, &quot;ul&quot;);
    for (i = 0; i &lt; aTmp.length; i++) {
        aTmp2 = aTmp[i].getElementsByTagName(&quot;li&quot;);
        for (j = 0; j &lt; aTmp2.length; j++) {
            oLI = aTmp2[j];
            aUL = oLI.getElementsByTagName(&quot;ul&quot;);
            if (aUL &amp;&amp; aUL.length) {
                oLI.UL = aUL[0];
                aA = oLI.getElementsByTagName(&quot;a&quot;);
                if (aA &amp;&amp; aA.length)
                    oLI.A = aA[0];
                oLI.onmouseenter = function() {
                    this.className += &quot; art-menuhover&quot;;
                    this.UL.className += &quot; art-menuhoverUL&quot;;
                    if (this.A) this.A.className += &quot; art-menuhoverA&quot;;
                };
                oLI.onmouseleave = function() {
                    this.className = this.className.replace(/art-menuhover/, &quot;&quot;);
                    this.UL.className = this.UL.className.replace(/art-menuhoverUL/, &quot;&quot;);
                    if (this.A) this.A.className = this.A.className.replace(/art-menuhoverA/, &quot;&quot;);
                };
            }
        }
    }
}
artLoadEvent.add(Menu_IE6Setup);
/* end Menu */

/* begin BlockHeader */
block_header_exists = true;/* end BlockHeader */

/* begin Button */

function artButtonsSetupJsHover(className) {
    var tags = [&quot;input&quot;, &quot;a&quot;, &quot;button&quot;];
    for (var j = 0; j &lt; tags.length; j++){
        var buttons = xGetElementsByClassName(className, document, tags[j]);
        for (var i = 0; i &lt; buttons.length; i++) {
            var button = buttons[i];
            if (!button.tagName || !button.parentNode) return;
            if (!artHasClass(button.parentNode, 'art-button-wrapper')) {
                if (!artHasClass(button, 'art-button')) button.className += ' art-button';
                var wrapper = document.createElement('span');
                wrapper.className = &quot;art-button-wrapper&quot;;
                if (artHasClass(button, 'active')) wrapper.className += ' active';
                var spanL = document.createElement('span');
                spanL.className = &quot;l&quot;;
                spanL.innerHTML = &quot; &quot;;
                wrapper.appendChild(spanL);
                var spanR = document.createElement('span');
                spanR.className = &quot;r&quot;;
                spanR.innerHTML = &quot; &quot;;
                wrapper.appendChild(spanR);
                button.parentNode.insertBefore(wrapper, button);
                wrapper.appendChild(button);
            }
            artEventHelper.bind(button, 'mouseover', function(e) {
                e = e || window.event;
                wrapper = (e.target || e.srcElement).parentNode;
                wrapper.className += &quot; hover&quot;;
            });
            artEventHelper.bind(button, 'mouseout', function(e) {
                e = e || window.event;
                button = e.target || e.srcElement;
                wrapper = button.parentNode;
                wrapper.className = wrapper.className.replace(/hover/, &quot;&quot;);
                if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, &quot;&quot;);
            });
            artEventHelper.bind(button, 'mousedown', function(e) {
                e = e || window.event;
                button = e.target || e.srcElement;
                wrapper = button.parentNode;
                if (!artHasClass(button, 'active')) wrapper.className += &quot; active&quot;;
            });
            artEventHelper.bind(button, 'mouseup', function(e) {
                e = e || window.event;
                button = e.target || e.srcElement;
                wrapper = button.parentNode;
                if (!artHasClass(button, 'active')) wrapper.className = wrapper.className.replace(/active/, &quot;&quot;);
            });
        }
    }
}

artLoadEvent.add(function() { artButtonsSetupJsHover(&quot;art-button&quot;); });
/* end Button */

function artInsertSidebarBlocks(widgetClassName) {
    var widgets = xGetElementsByClassName(widgetClassName, document);
    for (var i = 0; i &lt; widgets.length; i++) {
        var widget = widgets[i];
        if (widget.id == 'LinkList99') continue;
        if (widget.id == 'LinkList98') continue;
        if (widget.id == 'Text99')     continue;
      
        var childs = widget.childNodes;
        var widgetTitle = widget.getElementsByTagName(&quot;h2&quot;);
        var widgetContent = widget.innerHTML;
        var widgetTitleText = '';
        if (widgetTitle.length != 0){
            widgetTitleText = widgetTitle[0].innerHTML;
        }

        var div1  = document.createElement('div'); div1.className  = 'art-Block';
      
                      
        var div2  = document.createElement('div'); div2.className  = 'art-Block-tl'; div1.appendChild(div2);
        var div3  = document.createElement('div'); div3.className  = 'art-Block-tr'; div1.appendChild(div3);
        var div4  = document.createElement('div'); div4.className  = 'art-Block-bl'; div1.appendChild(div4);
        var div5  = document.createElement('div'); div5.className  = 'art-Block-br'; div1.appendChild(div5);
        var div6  = document.createElement('div'); div6.className  = 'art-Block-tc'; div1.appendChild(div6);
        var div7  = document.createElement('div'); div7.className  = 'art-Block-bc'; div1.appendChild(div7);
        var div8  = document.createElement('div'); div8.className  = 'art-Block-cl'; div1.appendChild(div8);
      
                      
        var div9  = document.createElement('div'); div9.className  = 'art-Block-cr'; div1.appendChild(div9);
        var div10 = document.createElement('div'); div10.className = 'art-Block-cc'; div1.appendChild(div10);
      
                      
        var divBB   = document.createElement('div'); divBB.className = 'art-Block-body';  div1.appendChild(divBB);
        if (widgetTitleText &amp;&amp; block_header_exists){
            var divBH   = document.createElement('div'); divBH.className = 'art-BlockHeader'; divBB.appendChild(divBH);
                        var divBHl  = document.createElement('div'); divBHl.className = 'l'; divBH.appendChild(divBHl);
            var divBHr  = document.createElement('div'); divBHr.className = 'r'; divBH.appendChild(divBHr);
                        var divBHti = document.createElement('div'); divBHti.className = 'art-header-tag-icon'; divBH.appendChild(divBHti);
            var divBHt  = document.createElement('div'); divBHt.className = 't'; divBHti.appendChild(divBHt);
            divBHt.innerHTML = widgetTitleText;
        }

        var divBC   = document.createElement('div'); divBC.className = 'art-BlockContent'; divBB.appendChild(divBC);
      
                      
        var di2  = document.createElement('div'); di2.className  = 'art-BlockContent-tl'; divBC.appendChild(di2);
        var di3  = document.createElement('div'); di3.className  = 'art-BlockContent-tr'; divBC.appendChild(di3);
        var di4  = document.createElement('div'); di4.className  = 'art-BlockContent-bl'; divBC.appendChild(di4);
        var di5  = document.createElement('div'); di5.className  = 'art-BlockContent-br'; divBC.appendChild(di5);
        var di6  = document.createElement('div'); di6.className  = 'art-BlockContent-tc'; divBC.appendChild(di6);
        var di7  = document.createElement('div'); di7.className  = 'art-BlockContent-bc'; divBC.appendChild(di7);
        var di8  = document.createElement('div'); di8.className  = 'art-BlockContent-cl'; divBC.appendChild(di8);
      
                      
        var di9  = document.createElement('div'); di9.className  = 'art-BlockContent-cr'; divBC.appendChild(di9);
        var di10 = document.createElement('div'); di10.className = 'art-BlockContent-cc'; divBC.appendChild(di10);
      
                      
        var divBCb  = document.createElement('div'); divBCb.className = 'art-BlockContent-body'; divBC.appendChild(divBCb);
      
      
      
        if ( ((widgetClassName == 'widget Gadget') || (widgetClassName == 'widget Followers')) &amp;&amp; (widgetContent.indexOf(&quot;friendconnect.js&quot;) != -1)){
          
            if (browser.mozilla){
                if (widgetTitle.length != 0){
                    widgetTitle[0].parentNode.removeChild(widgetTitle[0]);
                }
                divBCb.innerHTML = widget.innerHTML;
                widget.innerHTML = &quot;&quot;;
                widget.appendChild(div1);
            }
            if (browser.msie){
                if (widgetTitle.length != 0){
                    widgetTitle[0].parentNode.removeChild(widgetTitle[0]);
                }
                var childsLength = childs.length;
                for (var j = 0; j &lt; childsLength; j++) {
                    divBCb.appendChild(childs[0]);
                }
                widget.appendChild(div1);
            }
          
        } else {
            if (widgetTitle.length != 0){
                widgetTitle[0].parentNode.removeChild(widgetTitle[0]);
            }
            var childsLength = childs.length;
            for (var j = 0; j &lt; childsLength; j++) {
                divBCb.appendChild(childs[0]);
            }
            widget.appendChild(div1);
        }
 
      
        if (widgetClassName == 'widget Subscribe') {
            widget.style.position = &quot;relative&quot;;
            widget.style.zIndex = &quot;2&quot;;
        }
      
    }
}

function artCheckNavBar(){
    var navbar = document.getElementById(&quot;navbar&quot;);
    if (navbar){
        if (false) {
            var el1 = document.getElementById(&quot;art-page-background-glare&quot;);
            if (el1) el1.style.top = &quot;30px&quot;;
            var el2 = document.getElementById(&quot;art-page-background-simple-gradient&quot;);
            if (el2) el2.style.top = &quot;30px&quot;;
            if (!el2) {
                var el3 = document.getElementById(&quot;art-page-background-gradient&quot;);
                if (el3) el3.style.top = &quot;30px&quot;;
            }
        } else {
            navbar.style.display = 'none';
        }
    }
}

function artFixFooterMenu(){
    var widgetLinks = document.getElementById(&quot;LinkList98&quot;);
    var widgetText  = document.getElementById(&quot;Text99&quot;);
    if (widgetLinks) {
        var widgetText = widgetLinks.innerHTML;
        widgetLinks.innerHTML = widgetText.replace(&quot;| |&quot;, &quot;&quot;);
    } else {
        if (widgetText){
            var els = xGetElementsByClassName(&quot;widget-content&quot;, widgetText);
            var el = els[0];
            if (el.innerHTML == '\n') {
                el.innerHTML = &quot;&lt;br /&gt;&lt;br /&gt;&quot;;
            } else {
                el.innerHTML += &quot;&lt;br /&gt;&quot;;
            }
        }
    }
}

function artFixPostHeaders(){
    var els = xGetElementsByClassName(&quot;art-PostMetadataHeader&quot;, document);
    for (var i = 0; i &lt; els.length; i++) {
        var el = els[i];
        if (el) {
            var elText = el.innerHTML;
            if ((el.getElementsByTagName(&quot;div&quot;).length == 0) &amp;&amp; (el.getElementsByTagName(&quot;h2&quot;).length == 0)) el.style.visibility = 'hidden';
        }
    }
}

artLoadEvent.add(function() { artFixPostHeaders(); });

function artFixPostFooters(){
    var els = xGetElementsByClassName(&quot;art-PostMetadataFooter&quot;, document);
    for (var i = 0; i &lt; els.length; i++) {
        var el = els[i];
        if (el) {
            var els2 = xGetElementsByClassName(&quot;art-PostFooterIcons&quot;, el);
            for (var j = 0; j &lt; els2.length; j++) {
                var el2 = els2[j];
                var elText = el2.innerHTML;
                if ((el.getElementsByTagName(&quot;img&quot;).length == 0) &amp;&amp; (el.getElementsByTagName(&quot;a&quot;).length == 0)) el.style.visibility = 'hidden';
            }
        }
    }
}

artLoadEvent.add(function() { artFixPostFooters(); });

function artFixTopMenu(){
    var topMenu = document.getElementById(&quot;LinkList99&quot;);
    if (!topMenu){
        var navSection = document.getElementById(&quot;navsection&quot;);
        if (navSection){
            if (showHomePage) {
                if (window.location == homePageLink)
                    var tmpstr = '&lt;a href=&quot;'+homePageLink+'&quot; class=&quot;active&quot;&gt;';
                else
                    var tmpstr = '&lt;a href=&quot;'+homePageLink+'&quot;&gt;';
                navSection.innerHTML = '&lt;div&gt;&lt;div class=&quot;l&quot;&gt;&lt;/div&gt;&lt;div class=&quot;r&quot;&gt;&lt;/div&gt;&lt;div class=&quot;art-nav-center&quot;&gt;&lt;ul class=&quot;art-menu&quot;&gt;&lt;li&gt;'+tmpstr+'&lt;span class=&quot;l&quot;&gt;&lt;/span&gt;&lt;span class=&quot;r&quot;&gt;&lt;/span&gt;&lt;span class=&quot;t&quot;&gt;'+homePageName+'&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;&lt;/div&gt;';
            } else {
                navSection.innerHTML = '&lt;div&gt;&lt;div class=&quot;l&quot;&gt;&lt;/div&gt;&lt;div class=&quot;r&quot;&gt;&lt;/div&gt;&lt;div class=&quot;art-nav-center&quot;&gt;&lt;/div&gt;&lt;/div&gt;';
            }
        }
    }
}
artLoadEvent.add(function() { artFixTopMenu(); });

function artDisplayTopMenu(menuitems){
    var i=0;
    var subList = false;
    var menu = new Array();
    for(i=0; i &lt; menuitems.length; i++){
      var item = menuitems[i];
      var itemname = item[0];
      var itemlink = item[1];
    
      if ( (itemname.indexOf(&quot;-&quot;) == 0) &amp;&amp; !subList) document.write(&quot;&lt;ul&gt;&quot;);
      else if ( (itemname.indexOf(&quot;-&quot;) != 0) &amp;&amp; subList) { document.write(&quot;&lt;/ul&gt;&lt;/li&gt;&quot;); subList = false; }
      else if (i != 0) document.write(&quot;&lt;/li&gt;&quot;);
    
      document.write(&quot;&lt;li&gt;&quot;);
    
      if (itemname.indexOf(&quot;-&quot;) != 0){
        if (window.location == itemlink)
            document.write('&lt;a href=&quot;'+itemlink+'&quot; class=&quot;active&quot;&gt;&lt;span class=&quot;l&quot;&gt;&lt;/span&gt;&lt;span class=&quot;r&quot;&gt;&lt;/span&gt;&lt;span class=&quot;t&quot;&gt;'+itemname+'&lt;/span&gt;&lt;/a&gt;');
        else if(itemlink == &quot;http://./&quot;)
            document.write('&lt;a href=&quot;#&quot;&gt;&lt;span class=&quot;l&quot;&gt;&lt;/span&gt;&lt;span class=&quot;r&quot;&gt;&lt;/span&gt;&lt;span class=&quot;t&quot;&gt;'+itemname+'&lt;/span&gt;&lt;/a&gt;');
        else
            document.write('&lt;a href=&quot;'+itemlink+'&quot;&gt;&lt;span class=&quot;l&quot;&gt;&lt;/span&gt;&lt;span class=&quot;r&quot;&gt;&lt;/span&gt;&lt;span class=&quot;t&quot;&gt;'+itemname+'&lt;/span&gt;&lt;/a&gt;');
      } else {
        document.write('&lt;a href=&quot;'+itemlink+'&quot;&gt;'+itemname.substr(1,itemname.length)+'&lt;/a&gt;');
        subList = true;
      }
      if (i==(menuitems.length-1)) document.write(&quot;&lt;/li&gt;&quot;);
    }
}
    </script>
<style media=’print’ type=’text/css’> #header-wrapper, #header, .header, #sidebar-wrapper, .sidebar, #footer-wrapper, #footer, .date-header, .post-meta-data, .comment-link, .comment-footer, #blog-pager, #backlinks-container, #navbar-section, .subscribe_notice, .noprint {display: none;} #main-wrapper {width: 95%} </style>
  </head>
  <body>
  <script type=’text/javascript’>
        artCheckNavBar();
    </script>
    <div id=’art-main’>
    <div class=’art-Sheet’>
        <div class=’art-Sheet-tl’/>
        <div class=’art-Sheet-tr’/>
        <div class=’art-Sheet-bl’/>
        <div class=’art-Sheet-br’/>
        <div class=’art-Sheet-tc’/>
        <div class=’art-Sheet-bc’/>
        <div class=’art-Sheet-cl’/>
        <div class=’art-Sheet-cr’/>
        <div class=’art-Sheet-cc’/>
        <div class=’art-Sheet-body’>
    <b:section class=’art-Header’ id=’header’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’true’ title=’BRICKWALL (Κεφαλίδα)’ type=’Header’>
<b:includable id=’title’>
                <a expr:href=’data:blog.homepageUrl’><data:title/></a>
            </b:includable>
<b:includable id=’description’>
                <data:description/>
            </b:includable>
<b:includable id=’main’>
                                <div class=’art-Header-png’/>
                                            <div class=’art-Header-jpeg’/>
                <div class=’art-Logo’>
        <h1 class=’art-Logo-name’ id=’name-text’>
            <b:include name=’title’/>
        </h1>
        <div class=’art-Logo-text’ id=’slogan-text’>
            <b:include name=’description’/>
        </div>
    </div>
  
            </b:includable>
</b:widget>
</b:section>
    <script type=’text/javascript’>
        var menuitems = new Array();
        var showHomePage = false;
        if (true) {
          showHomePage = true;
          var homePageName = 'Home';
          var homePageLink = '<data:blog.homepageUrl/>';
          menuitems.push(new Array('Home','<data:blog.homepageUrl/>'));
        }
    </script>         
    <b:section class=’art-nav’ id=’navsection’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’LinkList99′ locked=’true’ title=’Top Menu’ type=’LinkList’>
<b:includable id=’main’>
        <div class=’l’/>
        <div class=’r’/>
        <ul class=’art-menu’>
            <script type=’text/javascript’>
                <b:loop values=’data:links’ var=’link’>
                  menuitems.push(new Array('<data:link.name/>','<data:link.target/>'));
                </b:loop>
                artDisplayTopMenu(menuitems);
            </script>
        </ul>
    </b:includable>
</b:widget>
</b:section>
    <div id=’crosscol-wrapper’ style=’text-align:center’>
        <b:section class=’crosscol’ id=’crosscol’ showaddelement=’no’/>
    </div>
    <div class=’art-contentLayout’>
    <b:section class=’art-sidebar1′ id=’sidebar1′ preferred=’yes’>
<b:widget id=’Followers1′ locked=’false’ title=’Αναγνώστες’ type=’Followers’>
<b:includable id=’main’>
  <b:if cond=’data:title != &quot;&quot;’>
    <b:if cond=’data:codeSnippet != &quot;&quot;’>
      <h2 class=’title’><data:title/></h2>
    <b:else/>
      <b:if cond=’data:totalFollowerCount != &quot;&quot;’>
        <h2 class=’title’><data:title/> (<data:totalFollowerCount/>)</h2>
      </b:if>
    </b:if>
  </b:if>
  <div class=’widget-content’>
    <div expr:id=’data:widget.instanceId + &quot;-wrapper&quot;’>
      <b:if cond=’data:codeSnippet != &quot;&quot;’>
        <div style=’margin-right:2px;’>
          <data:codeSnippet/>
        </div>
      <b:else/>
        <b:if cond=’data:totalFollowerCount == &quot;&quot;’>
          <span class=’item-control following-not-admin’>
            <b><data:failureSnippet/></b>
          </span>
          <span class=’item-control blog-admin’>
            <b><data:adminFailureSnippet/></b>
          </span>
        <b:else/>
          <b:if cond=’data:followingLinkPresent’>
            <div class=’follow-this profile-link item-control following-follow-this’>
              <a expr:href=’&quot;javascript:_FollowersView._openPopup(\&quot;&quot; + data:followUri + &quot;\&quot;);&quot;’>
                <data:followThisMessage/>
              </a>
            </div>
            <div class=’follow-this profile-link item-control following-stop-following-this’>
              <a expr:href=’&quot;javascript:_FollowersView._openPopup(\&quot;&quot; + data:followUri + &quot;\&quot;);&quot;’>
                <data:stopFollowingMessage/>
              </a>
            </div>
          </b:if>
 
          <div class=’followers-grid’>
            <b:if cond=’data:totalFollowerCount == 0′>
              <div class=’profile-link item-control following-follow-this’>
                <data:emptyFollowersMessage/>
              </div>
            </b:if>
            <!–
            Relies on the js written out in navbar.gxp
            –>
            <b:loop values=’data:followers’ var=’follower’>
              <div class=’follower’>
                <a expr:href=’data:follower.profileUrl’ expr:title=’data:follower.displayName’ rel=’nofollow’>
                <img class=’follower-img’ expr:alt=’data:follower.displayName’ expr:height=’data:follower.imageHeight’ expr:onerror=’&quot;this.onerror=null;this.src=\&quot;&quot; + data:anonFollowerImageUrl + &quot;\&quot;;&quot;’ expr:onload=’&quot;setAttributeOnload(this, \&quot;src\&quot;, \&quot;&quot; + data:follower.imageUrl + &quot;\&quot;)&quot;’ expr:width=’data:follower.imageWidth’ src=’http://img1.blogblog.com/img/blank.gif’/&gt;
                </a>
              </div>
            </b:loop>
            <div class=’clear’/>
          </div>
 
          <div class=’followers-canvas profile-link’>
            <data:followersFooterMessage/>
            <span class=’item-control following-not-admin’>
              <a expr:href=’data:followersUri’>
                <data:viewAllMessage/>
              </a>
            </span>
            <span class=’item-control blog-admin’>
              <a expr:href=’data:manageFollowersUri’>
                <data:manageFollowersMessage/>
              </a>
            </span>
          </div>
          </b:if>
      </b:if>
    </div>
    <b:include name=’quickedit’/>
  </div>
</b:includable>
</b:widget>
<b:widget id=’Profile1′ locked=’false’ title=’Για Μένα’ type=’Profile’>
<b:includable id=’main’>
    <b:if cond=’data:title != &quot;&quot;’>
      <h2><data:title/></h2>
    </b:if>
    <div class=’widget-content’>
    <b:if cond=’data:team == &quot;true&quot;’> <!– team blog profile –>
      <ul>
        <b:loop values=’data:authors’ var=’i’>
          <li><a expr:href=’data:i.userUrl’><data:i.display-name/></a></li>
        </b:loop>
      </ul>

      <b:else/> <!– normal blog profile –>

      <b:if cond=’data:photo.url != &quot;&quot;’>
        <a expr:href=’data:userUrl’><img class=’profile-img’ expr:alt=’data:photo.alt’ expr:height=’data:photo.height’ expr:src=’data:photo.url’ expr:width=’data:photo.width’/></a>
      </b:if>

      <dl class=’profile-datablock’>
        <dt class=’profile-data’><data:displayname/></dt>

        <b:if cond=’data:showlocation == &quot;true&quot;’>
          <dd class=’profile-data’><data:location/></dd>
        </b:if>

        <b:if cond=’data:aboutme != &quot;&quot;’><dd class=’profile-textblock’><data:aboutme/></dd></b:if>
      </dl>
      <a class=’profile-link’ expr:href=’data:userUrl’><data:viewProfileMsg/></a>
    </b:if>

     <b:include name=’quickedit’/>
    </div>
  </b:includable>
</b:widget>
</b:section>
          <b:section class=’art-content’ id=’main’ showaddelement=’no’>
<b:widget id=’Blog1′ locked=’true’ title=’Αναρτήσεις ιστολογίου’ type=’Blog’>
<b:includable id=’nextprev’>
              <div class=’blog-pager’ id=’blog-pager’>
                <b:if cond=’data:newerPageUrl’>
                  <span id=’blog-pager-newer-link’>
                    <a class=’blog-pager-newer-link’ expr:href=’data:newerPageUrl’ expr:id=’data:widget.instanceId + &quot;_blog-pager-newer-link&quot;’ expr:title=’data:newerPageTitle’><data:newerPageTitle/></a>
                  </span>
                </b:if>
  
                <b:if cond=’data:olderPageUrl’>
                  <span id=’blog-pager-older-link’>
                    <a class=’blog-pager-older-link’ expr:href=’data:olderPageUrl’ expr:id=’data:widget.instanceId + &quot;_blog-pager-older-link&quot;’ expr:title=’data:olderPageTitle’><data:olderPageTitle/></a>
                  </span>
                </b:if>
  
                <b:if cond=’data:blog.homepageUrl != data:blog.url’>
                  <a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
                <b:else/>
                  <b:if cond=’data:newerPageUrl’>
                    <a class=’home-link’ expr:href=’data:blog.homepageUrl’><data:homeMsg/></a>
                  </b:if>
                </b:if>
  
              </div>
              <div class=’clear’/>
            </b:includable>
<b:includable id=’backlinks’ var=’post’>
              <a name=’links’/>
              <h4><data:post.backlinksLabel/></h4>
              <b:if cond=’data:post.numBacklinks != 0′>
                <dl class=’comments-block’ id=’comments-block’>
                  <b:loop values=’data:post.backlinks’ var=’backlink’>
                    <div class=’collapsed-backlink backlink-control’>
                      <dt class=’comment-title’>
                        <span class=’backlink-toggle-zippy’> </span>
                        <a expr:href=’data:backlink.url’ rel=’nofollow’><data:backlink.title/></a>
                        <b:include data=’backlink’ name=’backlinkDeleteIcon’/>
                      </dt>
                      <dd class=’comment-body collapseable’>
                        <data:backlink.snippet/>
                      </dd>
                      <dd class=’comment-footer collapseable’>
                        <span class=’comment-author’><data:post.authorLabel/> <data:backlink.author/></span>
                        <span class=’comment-timestamp’><data:post.timestampLabel/> <data:backlink.timestamp/></span>
                      </dd>
                    </div>
                  </b:loop>
                </dl>
              </b:if>
              <p class=’comment-footer’>
                <a class=’comment-link’ expr:href=’data:post.createLinkUrl’ expr:id=’data:widget.instanceId + &quot;_backlinks-create-link&quot;’ target=’_blank’><data:post.createLinkLabel/></a>
              </p>
            </b:includable>
<b:includable id=’post’ var=’post’>
              <div class=’art-Post-tl’/>
              <div class=’art-Post-tr’/>
              <div class=’art-Post-bl’/>
              <div class=’art-Post-br’/>
              <div class=’art-Post-tc’/>
              <div class=’art-Post-bc’/>
              <div class=’art-Post-cl’/>
              <div class=’art-Post-cr’/>
              <div class=’art-Post-cc’/>
              <div class=’art-Post-body’>
                <div class=’art-Post-inner art-article’>
<b:if cond=’data:blog.pageType == &quot;item&quot;’> <span style=’background: url(http://bloggerbuster.com/images/print.gif) left no-repeat; padding-left: 20px;’><a href=’javascript:window.print()’>Print this post</a></span> </b:if>
                  <a expr:name=’data:post.id’/>
                  <b:if cond=’data:post.dateHeader’>
                    <div class=’date-header’><data:post.dateHeader/></div>
                  </b:if>
          <div class=’art-PostMetadataHeader’>
    <b:if cond=’data:post.title’>
        <h2 class=’art-PostHeader’>
      
            <b:if cond=’data:post.link’>
              <a expr:href=’data:post.link’><data:post.title/></a>
            <b:else/>
              <b:if cond=’data:post.url’>
                <a expr:href=’data:post.url’><data:post.title/></a>
              <b:else/>
                <data:post.title/>
              </b:if>
            </b:if>
        </h2>
    </b:if>
  
    </div>
    <div class=’art-PostHeaderIcons art-metadata-icons’>
    <img alt=» class=’art-metadata-icon’ height=’18’ src=’http://img62.imageshack.us/img62/2059/postdateicon.png&#8217; width=’18’/>
    <data:post.timestamp/> | <img alt=» class=’art-metadata-icon’ height=’18’ src=’http://img62.imageshack.us/img62/2217/postauthoricon.png&#8217; width=’18’/>
    <data:authorLabel/> <data:post.author/><b:if cond=’data:post.editUrl’><span expr:class=’&quot;item-control &quot; + data:post.adminClass’> | </span></b:if>
            <b:if cond=’data:post.editUrl’><span expr:class=’&quot;item-control &quot; + data:post.adminClass’>
          <img alt=» class=’art-metadata-icon’ height=’19’ src=’http://img62.imageshack.us/img62/9931/postediticonc.png&#8217; width=’20’/>
  
            <a class=’post-edit-link’ expr:href=’data:post.editUrl’ expr:title=’data:top.editPostMsg’>
              <data:top.editPostMsg/>
            </a>
  
            </span></b:if>
        
    </div>
    <div class=’art-PostContent’>
    <data:post.body/>
    </div>
    <div class=’cleared’/>
  
    <b:if cond=’data:post.hasJumpLink’>
        <div class=’jump-link’>
            <a expr:href=’data:post.url + &quot;#more&quot;’><data:post.jumpText/></a>
        </div>
    </b:if>
    <div class=’art-PostMetadataFooter’>
    <div class=’art-PostFooterIcons art-metadata-icons’>
  
            <b:if cond=’data:post.labels’>
          <img alt=» class=’art-metadata-icon’ height=’18’ src=’http://img62.imageshack.us/img62/1103/posttagicon.png&#8217; width=’18’/>
  
            <data:postLabelsLabel/>
            <b:loop values=’data:post.labels’ var=’label’>
              <a expr:href=’data:label.url’ rel=’tag’><data:label.name/></a><b:if cond=’data:label.isLast != &quot;true&quot;’>,</b:if>
            </b:loop>
  
            </b:if>
          <b:if cond=’data:post.labels’><b:if cond=’data:blog.pageType != &quot;item&quot;’><b:if cond=’data:post.allowComments’> | </b:if></b:if></b:if>
            <b:if cond=’data:blog.pageType != &quot;item&quot;’><b:if cond=’data:post.allowComments’>
          <img alt=» class=’art-metadata-icon’ height=’18’ src=’http://img62.imageshack.us/img62/7756/postcommentsiconq.png&#8217; width=’18’/>
    <a class=’comment-link’ expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><b:if cond=’data:post.numComments == 1′>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
  
            </b:if></b:if>
        
    </div>
  
    </div>
  
                
                  <div class=’post-footer’>
<!– AddThis Button BEGIN –>
<div><a class=’addthis_button’ expr:addthis:title=’data:post.title’ expr:addthis:url=’data:post.url’><img alt=’Bookmark and Share’ height=’16’ src=’http://s7.addthis.com/static/btn/v2/lg-share-en.gif&#8217; style=’border:0′ width=’125’/></a>
<script src=’http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4b64d7091be383d8&#8242; type=’text/javascript’/></div>
<!– AddThis Button END –>

                    <div class=’post-footer-line post-footer-line-1′>
                    
                      <span class=’reaction-buttons’>
                        <b:if cond=’data:top.showReactions’>
                          <table border=’0′ cellpadding=’0′ cellspacing=’0′ width=’100%’><tr>
                            <td class=’reactions-label-cell’ nowrap=’nowrap’ valign=’top’ width=’1%’>
                              <span class=’reactions-label’>
                              <data:top.reactionsLabel/></span> </td>
                            <td><iframe allowtransparency=’true’ class=’reactions-iframe’ expr:src=’data:post.reactionsUrl’ frameborder=’0′ name=’reactions’ scrolling=’no’/></td>
                           </tr></table>
                        </b:if>
                      </span>
  
                      <span class=’star-ratings’>
                        <b:if cond=’data:top.showStars’>
                           <div expr:g:background-color=’data:backgroundColor’ expr:g:text-color=’data:textColor’ expr:g:url=’data:post.absoluteUrl’ g:height=’42’ g:type=’RatingPanel’ g:width=’280’/>
                        </b:if>
                      </span>
  
                      <!– backlinks –>
                      <span class=’post-backlinks post-comment-link’>
                        <b:if cond=’data:blog.pageType != &quot;item&quot;’>
                          <b:if cond=’data:post.showBacklinks’>
                            <a class=’comment-link’ expr:href=’data:post.url + &quot;#links&quot;’><data:top.backlinkLabel/></a>
                          </b:if>
                        </b:if>
                      </span>
  
                      <span class=’post-icons’>
                        <!– email post links –>
                        <b:if cond=’data:post.emailPostUrl’>
                          <span class=’item-action’>
                          <a expr:href=’data:post.emailPostUrl’ expr:title=’data:top.emailPostMsg’>
                              <img alt=» class=’icon-action’ height=’13’ src=’http://www.blogger.com/img/icon18_email.gif&#8217; width=’18’/>
                          </a>
                          </span>
                        </b:if>
  
                      </span>
                    </div>
  
                    <div class=’post-footer-line post-footer-line-3′>
                      <span class=’post-location’>
                        <b:if cond=’data:top.showLocation’>
                          <b:if cond=’data:post.location’>
                            <data:postLocationLabel/>
                            <a expr:href=’data:post.location.mapsUrl’ target=’_blank’><data:post.location.name/></a>
                          </b:if>
                        </b:if>
                      </span>
                    </div>
                  </div>
                </div>
              </div>
            </b:includable>
<b:includable id=’commentDeleteIcon’ var=’comment’>
              <span expr:class=’&quot;item-control &quot; + data:comment.adminClass’>
                <a expr:href=’data:comment.deleteUrl’ expr:title=’data:top.deleteCommentMsg’>
                  <img src=’http://www.blogger.com/img/icon_delete13.gif’/&gt;
                </a>
              </span>
            </b:includable>
<b:includable id=’status-message’>
              <b:if cond=’data:navMessage’>
                <div class=’status-msg-wrap’>
                  <div class=’status-msg-body’>
                    <data:navMessage/>
                  </div>
                  <div class=’status-msg-border’>
                    <div class=’status-msg-bg’>
                      <div class=’status-msg-hidden’><data:navMessage/></div>
                    </div>
                  </div>
                </div>
                <div style=’clear: both;’/>
              </b:if>
            </b:includable>
<b:includable id=’feedLinks’>
              <b:if cond=’data:blog.pageType != &quot;item&quot;’> <!– Blog feed links –>
                <b:if cond=’data:feedLinks’>
                  <div class=’blog-feeds’>
                    <b:include data=’feedLinks’ name=’feedLinksBody’/>
                  </div>
                </b:if>
              <b:else/> <!–Post feed links –>
                <div class=’post-feeds’>
                  <b:loop values=’data:posts’ var=’post’>
                    <b:if cond=’data:post.allowComments’>
                      <b:if cond=’data:post.feedLinks’>
                        <b:include data=’post.feedLinks’ name=’feedLinksBody’/>
                      </b:if>
                    </b:if>
                  </b:loop>
                </div>
              </b:if>
            </b:includable>
<b:includable id=’comment-form’ var=’post’>
              <div class=’comment-form’>
                <a name=’comment-form’/>
                <h4 id=’comment-post-message’><data:postCommentMsg/></h4>
                <p><data:blogCommentMessage/></p>
                <data:blogTeamBlogMessage/>
                <a expr:href=’data:post.commentFormIframeSrc’ id=’comment-editor-src’/>
                <iframe allowtransparency=’true’ class=’blogger-iframe-colorize blogger-comment-from-post’ frameborder=’0′ height=’410′ id=’comment-editor’ name=’comment-editor’ scrolling=’no’ src=» width=’100%’/>
                <data:post.friendConnectJs/>
                <data:post.cmtfpIframe/>
                <script type=’text/javascript’>
                  BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
                </script>
              </div>
            </b:includable>
<b:includable id=’backlinkDeleteIcon’ var=’backlink’>
              <span expr:class=’&quot;item-control &quot; + data:backlink.adminClass’>
                <a expr:href=’data:backlink.deleteUrl’ expr:title=’data:top.deleteBacklinkMsg’>
                  <img src=’http://www.blogger.com/img/icon_delete13.gif’/&gt;
                </a>
              </span>
            </b:includable>
<b:includable id=’feedLinksBody’ var=’links’>
              <div class=’feed-links’>
                <data:feedLinksMsg/>
                <b:loop values=’data:links’ var=’f’>
                  <a class=’feed-link’ expr:href=’data:f.url’ expr:type=’data:f.mimeType’ target=’_blank’><data:f.name/> (<data:f.feedType/>)</a>
                </b:loop>
              </div>
            </b:includable>
<b:includable id=’postQuickEdit’ var=’post’>
  <b:if cond=’data:post.editUrl’>
    <span expr:class=’&quot;item-control &quot; + data:post.adminClass’>
      <a expr:href=’data:post.editUrl’ expr:title=’data:top.editPostMsg’>
        <img alt=» class=’icon-action’ height=’18’ src=’http://www.blogger.com/img/icon18_edit_allbkg.gif&#8217; width=’18’/>
      </a>
    </span>
  </b:if>
</b:includable>
<b:includable id=’comments’ var=’post’>
              <div class=’comments’ id=’comments’>
                <a name=’comments’/>
                <b:if cond=’data:post.allowComments’>
                  <h4>
                    <b:if cond=’data:post.numComments == 1′>
                      1 <data:commentLabel/>:
                    <b:else/>
                      <data:post.numComments/> <data:commentLabelPlural/>:
                    </b:if>
                  </h4>
  
                  <b:if cond=’data:post.commentPagingRequired’>
                    <span class=’paging-control-container’>
                      <a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.oldestLinkUrl’><data:post.oldestLinkText/></a>
                       
                      <a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.olderLinkUrl’><data:post.olderLinkText/></a>
                       
                      <data:post.commentRangeText/>
                       
                      <a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newerLinkUrl’><data:post.newerLinkText/></a>
                       
                      <a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newestLinkUrl’><data:post.newestLinkText/></a>
                    </span>
                  </b:if>
  
                  <dl id=’comments-block’>
                    <b:loop values=’data:post.comments’ var=’comment’>
                      <dt expr:class=’&quot;comment-author &quot; + data:comment.authorClass’ expr:id=’data:comment.anchorName’>
                        <b:if cond=’data:comment.favicon’>
                          <img expr:src=’data:comment.favicon’ height=’16px’ style=’margin-bottom:-2px;’ width=’16px’/>
                        </b:if>
                        <a expr:name=’data:comment.anchorName’/>
                        <b:if cond=’data:comment.authorUrl’>
                          <a expr:href=’data:comment.authorUrl’ rel=’nofollow’><data:comment.author/></a>
                        <b:else/>
                          <data:comment.author/>
                        </b:if>
                        <data:commentPostedByMsg/>
                      </dt>
                      <dd class=’comment-body’>
                        <b:if cond=’data:comment.isDeleted’>
                          <span class=’deleted-comment’><data:comment.body/></span>
                        <b:else/>
                          <p><data:comment.body/></p>
                        </b:if>
                      </dd>
                      <dd class=’comment-footer’>
                        <span class=’comment-timestamp’>
                          <a expr:href=’data:comment.url’ title=’comment permalink’>
                            <data:comment.timestamp/>
                          </a>
                          <b:include data=’comment’ name=’commentDeleteIcon’/>
                        </span>
                      </dd>
                    </b:loop>
                  </dl>
  
                  <b:if cond=’data:post.commentPagingRequired’>
                    <span class=’paging-control-container’>
                      <a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.oldestLinkUrl’>
                        <data:post.oldestLinkText/>
                      </a>
                      <a expr:class=’data:post.oldLinkClass’ expr:href=’data:post.olderLinkUrl’>
                        <data:post.olderLinkText/>
                      </a>
                       
                      <data:post.commentRangeText/>
                       
                      <a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newerLinkUrl’>
                        <data:post.newerLinkText/>
                      </a>
                      <a expr:class=’data:post.newLinkClass’ expr:href=’data:post.newestLinkUrl’>
                        <data:post.newestLinkText/>
                      </a>
                    </span>
                  </b:if>
  
                  <p class=’comment-footer’>
                    <b:if cond=’data:post.embedCommentForm’>
                      <b:if cond=’data:post.allowNewComments’>
                        <b:include data=’post’ name=’comment-form’/>
                      <b:else/>
                        <data:post.noNewCommentsText/>
                      </b:if>
                    <b:else/>
                      <b:if cond=’data:post.allowComments’>
                        <a expr:href=’data:post.addCommentUrl’ expr:onclick=’data:post.addCommentOnclick’><data:postCommentMsg/></a>
                      </b:if>
                    </b:if>
                  </p>
                </b:if>
  
                <div id=’backlinks-container’>
                  <div expr:id=’data:widget.instanceId + &quot;_backlinks-container&quot;’>
                    <b:if cond=’data:post.showBacklinks’>
                      <b:include data=’post’ name=’backlinks’/>
                    </b:if>
                  </div>
                </div>
              </div>
            </b:includable>
<b:includable id=’main’ var=’top’>
              <!– posts –>
                <b:include data=’top’ name=’status-message’/>
  
                <data:adStart/>
                <b:loop values=’data:posts’ var=’post’>
                  <div class=’art-Post’>
                    <b:include data=’post’ name=’post’/>
                    <b:if cond=’data:blog.pageType == &quot;item&quot;’>
                      <b:include data=’post’ name=’comments’/>
                    </b:if>
                    <b:if cond=’data:post.includeAd’>
                      <data:adEnd/>
                      <data:adCode/>
                      <data:adStart/>
                    </b:if>
                    <b:if cond=’data:post.trackLatency’>
                      <data:post.latencyJs/>
                    </b:if>
                  </div>
                </b:loop>
                <data:adEnd/>
  
              <!– navigation –>
              <b:include name=’nextprev’/>
  
              <!– feed links –>
              <b:include name=’feedLinks’/>
            
              <b:if cond=’data:top.showStars’>
                <script src=’http://www.google.com/jsapi&#8217; type=’text/javascript’/>
                <script type=’text/javascript’>
                  google.load(&quot;annotations&quot;, &quot;1&quot;, {&quot;locale&quot;: &quot;<data:top.languageCode/>&quot;});
                  function initialize() {
                    google.annotations.setApplicationId(<data:top.blogspotReviews/>);
                    google.annotations.createAll();
                    google.annotations.fetch();
                  }
                  google.setOnLoadCallback(initialize);
                </script>
              </b:if>
            </b:includable>
</b:widget>
</b:section>
          <b:section class=’art-sidebar2′ id=’sidebar2′ preferred=’yes’>
<b:widget id=’BlogArchive1′ locked=’false’ title=’Αρχειοθήκη ιστολογίου’ type=’BlogArchive’>
<b:includable id=’main’>
  <b:if cond=’data:title’>
    <h2><data:title/></h2>
  </b:if>
  <div class=’widget-content’>
  <div id=’ArchiveList’>
  <div expr:id=’data:widget.instanceId + &quot;_ArchiveList&quot;’>
    <b:if cond=’data:style == &quot;HIERARCHY&quot;’>
     <b:include data=’data’ name=’interval’/>
    </b:if>
    <b:if cond=’data:style == &quot;FLAT&quot;’>
      <b:include data=’data’ name=’flat’/>
    </b:if>
    <b:if cond=’data:style == &quot;MENU&quot;’>
      <b:include data=’data’ name=’menu’/>
    </b:if>
  </div>
  </div>
  <b:include name=’quickedit’/>
  </div>
</b:includable>
<b:includable id=’flat’ var=’data’>
  <ul>
    <b:loop values=’data:data’ var=’i’>
      <li class=’archivedate’>
        <a expr:href=’data:i.url’><data:i.name/></a> (<data:i.post-count/>)
      </li>
    </b:loop>
  </ul>
</b:includable>
<b:includable id=’menu’ var=’data’>
  <select expr:id=’data:widget.instanceId + &quot;_ArchiveMenu&quot;’>
    <option value=»><data:title/></option>
    <b:loop values=’data:data’ var=’i’>
      <option expr:value=’data:i.url’><data:i.name/> (<data:i.post-count/>)</option>
    </b:loop>
  </select>
</b:includable>
<b:includable id=’interval’ var=’intervalData’>
  <b:loop values=’data:intervalData’ var=’i’>
      <ul>
        <li expr:class=’&quot;archivedate &quot; + data:i.expclass’>
          <b:include data=’i’ name=’toggle’/>
          <a class=’post-count-link’ expr:href=’data:i.url’><data:i.name/></a>
            <span class=’post-count’ dir=’ltr’>(<data:i.post-count/>)</span>
          <b:if cond=’data:i.data’>
            <b:include data=’i.data’ name=’interval’/>
          </b:if>
          <b:if cond=’data:i.posts’>
            <b:include data=’i.posts’ name=’posts’/>
          </b:if>
        </li>
      </ul>
  </b:loop>
</b:includable>
<b:includable id=’toggle’ var=’interval’>
  <b:if cond=’data:interval.toggleId’>
  <b:if cond=’data:interval.expclass == &quot;expanded&quot;’>
    <a class=’toggle’ href=’javascript:void(0)’>
      <span class=’zippy toggle-open’>▼ </span>
    </a>
  <b:else/>
    <a class=’toggle’ href=’javascript:void(0)’>
      <span class=’zippy’>
        <b:if cond=’data:blog.languageDirection == &quot;rtl&quot;’>
          ◄ 
        <b:else/>
          ► 
        </b:if>
      </span>
    </a>
  </b:if>
 </b:if>
</b:includable>
<b:includable id=’posts’ var=’posts’>
  <ul class=’posts’>
    <b:loop values=’data:posts’ var=’i’>
      <li><a expr:href=’data:i.url’><data:i.title/></a></li>
    </b:loop>
  </ul>
</b:includable>
</b:widget>
</b:section>
        
    </div>
    <div class=’cleared’/>
    <div id=’footer-wrapper’>
        <b:section class=’footer’ id=’footer’/>
    </div>
    <div class=’art-Footer’><p align=’center’><a href=’http://locusblogus.blogspot.com’>Created by hackaday 2010</a></p>
        <div class=’art-Footer-inner’>
            <a class=’art-rss-tag-icon’ href=’/feeds/posts/default’ title=’RSS’/>
            <div class=’art-Footer-text’>
    <b:section class=’art-footer-nav’ id=’footersection’ maxwidgets=’2′ showaddelement=’no’>
<b:widget id=’LinkList98′ locked=’true’ title=’Footer Links’ type=’LinkList’>
<b:includable id=’main’>
                <b:loop values=’data:links’ var=’link’><a expr:href=’data:link.target’><data:link.name/></a> | </b:loop>|
            </b:includable>
</b:widget>
<b:widget id=’Text99′ locked=’true’ title=’Copyright Text’ type=’Text’>
<b:includable id=’main’>
              <div class=’widget-content’>
                <data:content/>
              </div>
            </b:includable>
</b:widget>
</b:section>
  
            </div>
            <script type=’text/javascript’>
                artFixFooterMenu();
                artInsertSidebarBlocks(&quot;widget Gadget&quot;);
                artInsertSidebarBlocks(&quot;widget Label&quot;);
                artInsertSidebarBlocks(&quot;widget Profile&quot;);
                artInsertSidebarBlocks(&quot;widget Followers&quot;);
                artInsertSidebarBlocks(&quot;widget CustomSearch&quot;);
                artInsertSidebarBlocks(&quot;widget HTML&quot;);
                artInsertSidebarBlocks(&quot;widget Text&quot;);
                artInsertSidebarBlocks(&quot;widget AdSense&quot;);
                artInsertSidebarBlocks(&quot;widget Image&quot;);
                artInsertSidebarBlocks(&quot;widget Slideshow&quot;);
                artInsertSidebarBlocks(&quot;widget VideoBar&quot;);
                artInsertSidebarBlocks(&quot;widget Poll&quot;);
                artInsertSidebarBlocks(&quot;widget BlogList&quot;);
                artInsertSidebarBlocks(&quot;widget LinkList&quot;);
                artInsertSidebarBlocks(&quot;widget TextList&quot;);
                artInsertSidebarBlocks(&quot;widget Feed&quot;);
                artInsertSidebarBlocks(&quot;widget NewsBar&quot;);
                artInsertSidebarBlocks(&quot;widget Subscribe&quot;);
                artInsertSidebarBlocks(&quot;widget BloggerButton&quot;);
                artInsertSidebarBlocks(&quot;widget BlogArchive&quot;);
            </script>
        </div>
        <div class=’art-Footer-background’/>
    </div>
  
        </div>
    </div>
    <div class=’cleared’/>
    <p class=’art-page-footer’/>
    </div>
  
  </body>
</html>
               
               

Advertisements
 
12 Σχόλια

Posted by στο Ιανουαρίου 31, 2010 in CODE, HTML, LAYER, TEMPLATE

 

ΠΡΟΣΘΗΚΗ ΣΤΟΙΧΕΙΟΥ GADGET ΠΑΝΩ ΑΠΟ ΤΗΝ ΑΝΑΡΤΗΣΗ

Καλησπέρα σε όλους και όλες. Σήμερα θα δούμε πως μπορούμε να βάλουμε ένα στοιχείο προσθήκης gadget πάνω από την ανάρτηση σας. Μόλις γίνει αυτό θα μπορούμε να βάλουμε φωτογραφίες, κώδικα, διαφημιστικά banners, κείμενο κλπ. Η διαδικασία είναι πολύ απλή. Πρώτα απ’ όλα πρέπει να πάρουμε back up του template μας για να είμαστε ασφαλείς.
Μπαίνουμε στο λογαριασμό που έχουμε του blogspot και από τον πανόπτη πάμε διάταξη και επεξεργασία HTML. Πατάμε control και F (Ctrl+F) για να ανοίξει στο κάτω μέρος της οθόνης μας το ψαχτήρι και πληκτρολογούμε:
<div id=’main-wrapper’>
και αυτόματα θα το δούμε τονισμένο με χρώμα στον κώδικα μας. Ακριβώς από κάτω έχει μια σειρά κώδικα που είναι ως εξής:
<b:section class=’main’ id=’main’ showaddelement=’no‘>
Το σημείο του κώδικα που είναι με κόκκινο χρώμα το αλλάζετε από no σε yes. Μετά πατάτε αποθήκευση (save) και τελειώσατε. Αν πάτε στη διάταξη θα δείτε ότι πάνω από το πλαίσιο ανναρτήσεις ιστολογίου μπορείτε να προσθέσετε ότι θέλετε ως gadget. Για να καταλάβετε τι εννοώ δείτε τα παρακάτω screenshots. Το πρώτο είναι πριν πειράξουμε τον κώδικα και το δεύτερο είναι το τελικό αποτέλεσμα. Ελπίζω να σας αρέσει και να το βρείτε χρήσιμο. Καλή επιτυχία.



 
17 Σχόλια

Posted by στο Ιανουαρίου 27, 2010 in GADGET, HTML, TUTORIAL, WIDGET

 

ΠΡΟΣΘΗΚΗ ΣΤΟΙΧΕΙΩΝ GADGET

Καλησπέρα σε όλους και καλή εβδομάδα. Σήμερα θα δούμε πως μπορούμε να τοποθετήσουμε τρεις στήλες στο κάτω μέρος του blog μας, η μία δίπλα στην άλλη και στις οποίες μπορούμε να βάλουμε κώδικα (widgets), κείμενα, φωτογραφίες ή ότι άλλο θέλουμε. Να ζητήσω συγνώμη από το φίλο που ζήτησε το σχετικό θέμα για τη μικρή καθυστέρηση της ανάρτησης.
Μπαίνουμε στο λογαριασμό μας στο blogspot και από τον πανόπτη πάμε διάταξη και επεξεργασία HTML. Πριν κάνουμε οτιδήποτε παίρνουμε ένα αντίγραφο ασφαλείας (back up) του template μας. Μετά πατάμε Control και F (Ctrl+F) για να ανοίξει το ψαχτήρι στο κάτω μέρος του browser. Ψάχνουμε να βρούμε το κομμάτι του κώδικα :

<div id=’footer-wrapper’> <b:section class=’footer’ id=’footer’/> </div>

Μπορεί και να το βρούμε (συνήθως στα minima templates) και ως:

<div id=’footer-wrapper’> <b:section class=’footer’ id=’footer’> <b:widget id=’HTML1′ locked=’false’ title=» type=’HTML’/> </b:section> </div>

Τα παραπάνω μέρη του κώδικα τα βρίσκουμε βάζοντας στο ψαχτήρι που ανοίξαμε προηγουμένως:

<div id=’footer-wrapper’>

Αυτό που είναι με κόκκινο χρώμα το αντικαθιστούμε με τον παρακάτω κώδικα:

<div id=’footer-column-container’>
<div id=’footer2′ style=’width: 30%; float: left; margin:0; text-align: left;’>
<b:section class=’footer-column’ id=’col1′ preferred=’yes’ style=’float:left;’/>
</div>
<div id=’footer3′ style=’width: 40%; float: left; margin:0; text-align: left;’>
<b:section class=’footer-column’ id=’col2′ preferred=’yes’ style=’float:left;’/>
</div>
<div id=’footer4′ style=’width: 30%; float: right; margin:0; text-align: left;’>
<b:section class=’footer-column’ id=’col3′ preferred=’yes’ style=’float:right;’/>
</div>
<div style=’clear:both;’/>
<div id=’footer-bottom’ style=’text-align: center; padding: 10px; text-transform: lowercase;’>
<b:section class=’footer’ id=’col-bottom’ preferred=’yes’>
<b:widget id=’Text2′ locked=’false’ title=» type=’Text’/>
</b:section>
</div>
<div style=’clear:both;’/>
</div>

Πατάμε προεπισκόπηση και αν δε βγει κανένα μύνημα λάθους πατάμε αποθήκευση (save). Μετά πάμε να βρούμε με το ψαχτήρι μας το κομμάτι του κώδικα:

]]></b:skin>

Αμέσως πριν από αυτό και από πάνω του προσθέτουμε το παρακάτω κομμάτι κώδικα:

#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}

Πατήστε αποθήκευση (save). Πάτε τώρα στη διάταξη και θα δείτε αυτό που δείχνει και το παρακάτω screenshot (κλικ στην εικόνα για μεγέθυνση).

Όπως ανέφερα και στην αρχή αυτής της ανάρτησης μπορείτε να βάλετε ότι θέλετε. Διαφημίσεις, λίστα πρόσφατων σχολίων, λίστα δημοφιλέστερων αναρτήσεων κ.α. Καλή επιτυχία.

 
21 Σχόλια

Posted by στο Ιουνίου 21, 2009 in CODE, EDITING, GADGET, HTML, WIDGET

 

ΠΡΟΣΘΗΚΗ ADMIN CONTROL PANEL ΣΤΟ TEMPLATE

Καλό μήνα σε όλους και σε όλες. Πως θα σας φαινόταν αν είχατε ένα control panel στο blog σας το οποίο θα είναι ορατό μόνο σε εσάς όταν κάνετε login και όταν κάνετε logout αυτό να είναι αόρατο; Ποια η χρησιμότητα του; Μα φυσικά να έχετε τον έλεγχο του blog σας πιο άμεσα και να ολοκληρώνετε τις δουλειές σας γρηγορότερα. Με ένα κλικ θα μπορείτε να γράφετε ανάρτηση, να πειράζετε τον κώδικα και ότι άλλο θέλετε. Το admin control panel θα εμφανίζεται στο blog σας πάνω δεξιά μόνο όταν έχετε μπει στο λογαριασμό σας.
Πάμε πανόπτης, διάταξη και επεξεργασία HTML. Παίρνουμε ένα αντίγραφο ασφαλείας (back up) και με το Ctrl+F βρίσκουμε το παρακάτω κομμάτι κώδικα:

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

Ακριβώς πάνω από αυτή τη γραμμή κώδικα κάνουμε αντιγραφή – επικόλληση (copy – paste) τον παρακάτω κώδικα:

<span class=’item-control blog-admin’> <h2>Admin Control Panel</h2> <a href=’http://www.blogger.com/post-create.g?blogID=BlogIdNumber’>New Post</a> | <a href=’http://draft.blogger.com/blog-options-basic.g?blogID=BlogIdNumber’>Settings</a&gt; | <a href=’http://www.blogger.com/rearrange?blogID=BlogIdNumber’>Change Layout</a> | <a href=’http://www.blogger.com/html?blogID=BlogIdNumber’>Edit HTML</a> | <a href=’http://www.blogger.com/moderate-comment.g?blogID=BlogIdNumber’>Moderate Comments</a> | <a href=’http://www.blogger.com/logout.g’>Sign Out</a> </span>

Στον κώδικα που μόλις κάναμε επικόλληση πρέπει να αντικαταστήσουμε όπου λέει BlogIdNumber με τον μοναδικό αριθμό του blog σας ο οποίος ονομάζεται BlogID και τον βρίσκουμε πολύ εύκολα αρκεί να είμαστε μέσα στον blogspot λογαριασμό μας (δηλαδή να έχουμε κάνει login) και να δούμε τη μπάρα διευθύνσεων. Έιναι ο αριθμός μετά το blogID=. Δείτε το παρακάτω screenshot:

Μόλις τελειώσετε με την τοποθέτηση του blogID πατήστε αποθήκευση (save). Το admin control panel δεν είναι ορατό στην προεπισκόπηση. Μπήτε μέσα στο blog σας χωρίς να αποσυνδεθείτε από το blogspot και θα δείτε πάνω δεξιά το admin control panel που θα μοιάζει σαν το παρακάτω screenshot:

Αν αποσυνδεθείτε από τον λογαριασμό σας και ξαναπάτε στο blog σας θα δείτε ότι το admin control panel δεν εμφανίζεται. Με λίγα λόγια πρόσβαση σ’ αυτό έχει μόνο ο ιδιοκτήτης του blog όταν έχει κάνει login. Καλή επιτυχία.

 
6 Σχόλια

Posted by στο Φεβρουαρίου 2, 2009 in ADMIN, CONTROL, HTML, PANEL, TEMPLATE

 

ΠΡΟΣΘΗΚΗ ANIMATED TAG CLOUD

Μια αναγνώστρια του blog μου ζήτησε να κάνω ανάρτηση για το πως μπορούμε να βάλουμε ένα animated tag cloud όπως αυτό που έχω στο blog. Η αλήθεια είναι ότι δε μπαίνει σαν widget αλλά πρέπει να πειράξουμε τον κώδικα. Η διαδικασία είναι πολύ απλή.
Μπαίνουμε στο λογαριασμό μας, πάμε πανόπτης, διάταξη και επεξεργασία HTML. Παίρνουμε πρώτα ένα back up του κώδικα μας για λόγους ασφαλείας και συνεχίζουμε. Πατάμε Ctrl+F και κάτω ανοίγει ένα ψαχτήρι. Μέσα στο πλαίσιο βάζουμε το παρακάτω κομμάτι του κώδικα:

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

Μόλις το βρούμε αμέσως κάτω απ’ αυτή τη γραμμή κάνουμε αντιγραφή – επικόλληση (copy – paste) τον παρακάτω κώδικα:

<b:widget id=’Label99′ locked=’false’ title=’Labels’ type=’Label’> <b:includable id=’main’> <b:if cond=’data:title’> <h2><data:title/></h2> </b:if> <div class=’widget-content’> <script src=’http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js&#8217; type=’text/javascript’/> <div id=’flashcontent’>Blogumulus by <a href=’http://www.roytanck.com/’>Roy Tanck</a> and <a href=’http://locusblogus.blogspot.com’>hackaday</a></div&gt; <script type=’text/javascript’> var so = new SWFObject(«http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf», «tagcloud», «240», «300», «7», «#ffffff»); // uncomment next line to enable transparency //so.addParam(«wmode», «transparent»); so.addVariable(«tcolor», «0x333333»); so.addVariable(«mode», «tags»); so.addVariable(«distr», «true»); so.addVariable(«tspeed», «100»); so.addVariable(«tagcloud», «<tags><b:loop values=’data:labels’ var=’label’><a expr:href=’data:label.url’ style=’12’><data:label.name/></a></b:loop></tags>»); so.addParam(«allowScriptAccess», «always»); so.write(«flashcontent»); </script> <b:include name=’quickedit’/> </div> </b:includable> </b:widget>

Πατήστε προεπισκόπηση για να δείτε το tag cloud που προσθέσατε και μετά αποθήκευση (save).
Το tag cloud είναι προρυθμισμένο ως:
Πλάτος: 240px (pixels)
Ύψος: 300px
Χρώμα φόντου: άσπρο
Χρώμα γραμματοσειράς: γκρι
Μέγεθος γραμματοσειράς: 12

Επειδή όμως θέλουμε να φαίνεται το tag cloud σαν να αιωρείται και να είναι πιο καλαίσθητο καλό θα ήταν να το φέρουμε στα μέτρα μας και να έχει το ίδιο χρώμα με αυτό του template μας. Πάμε να δούμε πως θα κάνουμε παραμετροποίηση. Αν θέλουμε να αλλάξουμε πλάτος, ύψος και χρώμμα του φόντου πρέπει να βρούμε το παρακάτω κομμάτι κώδικα σε αυτό που προσθέσαμε προηγουμένως:

var so = new SWFObject(«http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf», «tagcloud», «240«, «300«, «7», «#ffffff»);

Όπου 240 το πλάτος, 300 το ύψος και #ffffff το χρώμα. Για να αλλάξουμε το ύψος και το πλάτος και να μεγαλώσουμε το tag cloud βάζουμε μεγαλύτερες τιμές. Για να το μικρύνουμε κάνουμε το αντίθετο.
Για να αλλάξουμε χρώμα στο φόντο του tag cloud πρέπει να αλλάξουμε την παράμετρο #ffffff. Πώς όμως; Πρέπει να ανοίξουμε άλλο ένα παράθυρο εργασίας στον browser και να μπούμε πάλι στο λογαριασμό μας και από εκεί πάμε πανόπτης, διάταξη και γραμματοσειρές και χρώματα. Εκεί μπορούμε να δούμε τον κωδικό των χρωμάτων φόντου και γαμματοσειρών. Δείτε την παρακάτω φωτογραφία (κλικ για μεγέθυνση): Στα δεξιά βλέπετε τον κωδικό χρώματος που στην προκειμένη περίπτωση είναι το άσπρο. Εσείς στον κώδικα πρέπει να βάλετε τον κωδικό του χρώματος του template σας.


Με τον ίδιο τρόπο μπορείτε να αλλάξετε και το χρώμα της γραμματοσειράς του tag cloud. Αρκεί να βρείτε το κομμάτι του κώδικα (στον κώδικα του tag cloud):
so.addVariable(«tcolor», «0x333333«);

Διαλέξτε τον κωδικό του χρώματος που θέλετε και αντικαταστήστε με αυτόν που προϋπήρχε (default – αυτό που έχω κοκκινίσει στον κώδικα είναι το γκρι χρώμα, δηλαδή το 333333).
Άλλη μια τροποποίηση που μπορούμε να κάνουμε είναι το μέγεθος της γραμματοσειράς του tag cloud. Αρκεί να βρούμε στον κώδικα του tag cloud το παρακάτω κομμάτι:

so.addVariable(«tagcloud», «<tags><b:loop values=’data:labels’ var=’label’><a expr:href=’data:label.url’ style=’12‘><data:label.name/></a></b:loop></tags>»);

Το 12 που είναι με κόκκινο χρώμα είναι το μέγεθος της γραμματοσειράς. Αν θέλουμε να τη μεγαλώσουμε βάζουμε έναν αριθμό μεγαλύτερο από το 12. Αν θέλουμε να τη μικρύνουμε κάνουμε το αντίθετο (δηλαδή βάζουμε μια τιμή μικρότερη του 12).
Πριν κάνετε αποθήκευση (save) σε οτιδήποτε αλλαγές του κώδικα καλό θα ήταν να κάνετε προεπισκόπηση για να δείτε αν τα αποτελέσματα των ενεργειών σας θα σας αφήσουν ευχαριστημένους. Αν όχι πειραματιστείτε μέχρι να φτάσετε στο επιθυμητό αποτέλεσμα. Αν ναι, πατήστε αποθήκευση και τέλος. Καλή επιτυχία.

 
19 Σχόλια

Posted by στο Ιανουαρίου 23, 2009 in ANIMATION, HACKS, HTML, TAG CLOUD, TAGS

 

ΤΡΙΣΤΗΛΑ TEMPLATES… ΑΒΑΔΙΣΤΑ ΚΑΙ ΑΒΑΣΑΝΙΣΤΑ

Σήμερα θα σας δείξω πως μπορείτε να μετατρέψετε το template του blog σας σε τρίστηλο (αρκεί να ανήκετε στην πλατφόρμα του blogspot). Καλό είναι να κάνεται ένα back up τον κώδικα σας για λόγους ασφαλείας πριν ξεκινήσετε οτιδήποτε.
Πάμε στον πανόπτη, από εκεί διάταξη και από εκεί επεξεργασία HTML. Το κουτάκι που λέει επέκταση γραφικών στοιχείων το αφήνουμε έτσι όπως είναι και δεν το πειράζουμε (ατσεκάριστο).
Βρίσκουμε το κομμάτι του κώδικα που λέει:

#sidebar-wrapper { width: 220px; float: right; 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 */ }

Το αντιγράφουμε έτσι όπως είναι (copy – paste) ακριβώς από κάτω και έτσι το έχουμε δυο φορές. Στο πρώτο εκεί που λέει float βάζουμε right και σβήνουμε αυτό που έχει, συνήθως λέει $startSide (φαίνεται πάνω η αλλαγή). Τώρα αλλάζουμε σ’ αυτό που μόλις αντιγράψαμε (στο δεύτερο) αυτά που φαίνονται παρακάτω με κόκκινο χρώμα:

#left-sidebar-wrapper (αυτό δημιουργεί τη νέα στήλη) float: left; (αυτό θα κάνει την καινούρια στήλη να εμφανίζεται στα αριστερά της κεντρικής όπου εμφανίζονται τα post).

Με τις παραπάνω κινήσεις μόλις προσθέσαμε άλλη μια sidebar.
Στη συνέχεια κοιτάζουμε να βρούμε το μέρος του κώδικα που λέει:

<div id=’main-wrapper’>

Ακριβώς πριν από αυτόν αντιγράφουμε και κάνουμε επικόλληση (copy – paste) τον παρακάτω κώδικα:

<div id=’left-sidebar-wrapper’> <b:section class=’sidebar’ id=’left-sidebar’ preferred=’yes’/> </div>

Αυτό γίνεται (<div id=’main-wrapper’>) για να μπορέσει ο browser να καταλάβει ότι υπάρχει και άλλη μπάρα. Το άλλο κομμάτι του κώδικα (<b:section class=’sidebar’ id=’left-sidebar’ preferred=’yes’/> </div>) είναι για να καταλάβει ο browser τι είδους στοιχεία (widgets) υπάρχουν στην καινούρια μας στήλη. Το ID πρέπει να είναι left-sidebar για να μην έχουμε διενέξεις και προβλήματα και για να καθορίσουμε ότι η καινούρια μας στήλη θα βρίσκεται στην αριστερή πλευρά τoυ template μας. Τα παραπάνω, όμως είναι για εγκυκλοπαιδικούς λόγους. Ας συνεχίσουμε με πράξη.
Λογικά θα πρέπει να μεγαλώσουμε το template μας για να χωρέσουν όλα. Βρίσκουμε το κομμάτι του κώδικα που λέει:

/* Outer-Wrapper ———————————————– */ #outer-wrapper { width: 660px; margin:0 auto; padding:10px; text-align:left; font: $bodyfont; }

Και αντικαθιστούμε την τιμή 660 με 880. Για να είναι όμως πιο καλαίσθητο πρέπει να μεγαλώσουμε και και το μέρος που φιλοξενεί το logo μας. Πάμε και βρίσκουμε το κομμάτι του κώδικα που λέει:

#header-wrapper { width:880px; margin:0 auto 10px; border:1px solid $bordercolor; }

Και εδώ την τιμή την αλλάζουμε από 660 σε 880 (στο ακριβώς παραπάνω παράδειγμα η τιμή έχει ήδη αλλαχτεί).
Πατάμε αποθήκευση αν και δεν τελειώσαμε για να ελέγξουμε ότι όλα πάνε καλά. Εφόσον κάνουμε αποθήκευση (save) πάμε πανόπης, διάταξη και στοιχεία σελίδας και η εικόνα που πρέπει να αντικρίσετε είναι όπως η παρακάτω:


Όπως προανέφερα δεν τελειώσαμε. Η στήλη υπάρχει αλλά θα είναι ορατή στο blog μόνο όταν βάλετε κάποιο widget. Πρέπει να κάνουμε τα στοιχεία που θα βάζουμε στην καινούρια μπάρα μας να μην ξεπερνάνε τα όρια και μπαίνουν μέσα στα post μας (κάτι το οποίο είναι ενοχλητικό). Πάμε πάλι στη διάταξη, από εκεί επεξεργασία HTML και ψάχνουμε να βρούμε το κομμάτι του κώδικα:

#main-wrapper { width: 410px; float: left; 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 */ }

Και προσθέτουμε margin-left: 20px; εκεί που λέει float:left; Ο κώδικας πρέπει να δείχνει ακριβώς όπως παρακάτω:

#main-wrapper { width: 410px; float: left; margin-left: 20px; 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 */ }

Πατήστε αποθήκευση (save) και τελειώσατε. Για να βάλετε στήλη στα δεξιά ακολουθήστε την ίδια διαδικασία μόνο εκεί που λέει left; βάλτε right;

UPDATE: Η παραπάνω διαδικασία αφορά τo Minima
template (σαν το δικό μου δηλαδή) και τις παραλαγές
του. Για άλλα templates πρέπει να διαθέσετε λίγο χρόνο
για να πειραματιστείτε με τις τιμές των: Outer-Wrapper,
Header-Wrapper και margin. Αυτό γιατί άλλα templates
είναι πιο σύνθετα (περιέχουν σχέδια, footers, χρώματα κλπ.)

Πηγή: ΘΕΜΑ

 
9 Σχόλια

Posted by στο Ιανουαρίου 17, 2009 in BLOG, BLOGGER, BLOGSPOT, COLUMN, HTML, ΤΡΙΤΗ ΣΤΗΛΗ, TEMPLATE