/*   
Theme Name: zcliu
Description: Customization of the Frog Log theme (A clear and simple green, orange, white theme, easy to customize by Marcin Teodorczyk)
Author: ZC Liu
Author URI: http://www.zcliu.org
Tags: white, green, orange, two-columns
Version: 0.9.6
*/

/*
 * Copyright (C) 2009 Marcin Teodorczyk <marcin@teodorczyk.info>
 *
 * This file is part of Frog Log WordPress Theme.
 * 
 * Frog Log is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 * 
 * Frog Log is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 * 
 * You should have received a copy of the GNU General Public License
 * along with Foobar.  If not, see <http://www.gnu.org/licenses/>.
 * 
 */

/* global */

body {
        margin: 0 0 0 0;
        /* margin:     0 0%  6% 0% ;   0px 40px 80px 40px */ 
	font-size:      9.5pt;
	line-height:    1.5;
	background: #FBFBFB;
	color:    #000000;      /*#262626;*/
	font-family:    /*arial, helvetica,sans-serif */ Verdana, Helvetica, sans-serif;
}
blockquote {
    margin:         1em 0 1em 1em;
    padding:        0;
	font-size:      9pt;
    font-style:     italic;
    color:          #555;
}
blockquote p {
	padding: 0px;
	margin: 0px;
}
pre {
    font-family:'Courier New', Courier, Monospace, Fixed;
	line-height: normal;
    overflow: auto;
	padding-bottom: 2em;
	margin: 0px;
	background-image:url('images/bg_pre_dots.png');
	background-repeat: repeat-x;
	background-position: bottom left;
}
cite {
	font-style:     italic;
    color:          #555;
}
img {padding: 0; margin: 0;}
a {text-decoration: none; color: #000;}
a:hover {color: #fd8008;}
h1, h2, h3 {font-size: 100%;}
h2, h3, h4, h5, h6 {color: #888;}
dl, dd, dt {margin: 0px;}

.clear {
	clear:both;
	height:1px;
}

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

.alignleft {
   float: left;
}

.alignright {
   float: right;
}
#wrapper {
	width: 100%;
	text-align:left;
        margin-top: 0;
        padding-top:0;
}



/* header */
#search {
    float: right;
    display: inline;
    font-weight: bold;
    color: #222;
    font-size:      8pt;
    clear:both;  
    margin-bottom:  1em;

}





#hd {
    margin:   0  0 3.5em 0  /* 20px 45px 3.5em 45px */;
    padding: 1.6% 3.5% 0 3.5%;
    background: #74B624;
    /*width: 85% ;*/
    /*background:     url('images/seal6.png') left bottom no-repeat;*/
    /*border:  1px solid #000;*/
}

div#hd div#hline {
    height:         1px;
    width:          90%;
    border-bottom:  0px solid #ddd;
    position:       absolute;
    top:            65px;
    right:          50;
    z-index:        -1;
}

.sitemeta {
    position:       absolute;
    left:          6.8% /*originally 9.8%*/;
    font-size:  9pt;
    width:       11%   /*   155px*/;
    text-align:     left;
    color: #6B6B6B;
    background: #FBFBFB;
    top: 240px; /* fix its top to not sink below when displaying dynamic contents in single posts*/
    float:left;
}


.sitemeta ul {
	list-style:     none outside;
	margin:         0px;
	padding:        0px;
}

.sitemeta ul li {
        display: block;
	margin-bottom:         1.4em;
        text-decoration: none; color: #888;
}

.sitemeta ul li  a {text-decoration: none; color: #888;}
.sitemeta ul li a:hover {color: #fd8008;}

#blogtitle {background:  url('images/seal6.png') left top no-repeat; height: 64px; padding-left: 40px; 	vertical-align: top;  margin-top: -1em;}
#blogtitle h1 {display: inline;}
#blogtitle h1 a {
	color:  #fff;    /* #fd8008;         orange */
	font-size:      13pt;
    padding:        0 1em;
    margin-left:    -1em;
}
#blogdescription {
	color:   #E5FFE5;       /*#666;*/
	/*margin-top: 0.5em;*/
	font-size:      9.5pt;
}

#titlewrapper hr {
        margin-bottom:  3em;
}

#menu {
        clear: left;
        float: right;
	margin-top:     1.1em;
        margin-bottom:  5px;
	display:        inline;
}
#menu ul {
	list-style:     none outside;
	margin:         0px;
	padding:        0px;
}
#menu ul li {
	float:          left;
}
#menu ul li a {
	font-size:      11pt;
        font-weight: bold;
	margin-right:   1em;
	margin-left:    1em;
	color:        #eee;   /*#999;*/
}
#menu ul li a:hover {
	color:       #ffff52; /*  #74B624;      green */
}


.current_page_item a {color: #ffff80 !important;} /* orange */


/* sidebar */

#sidebar {	
    font-size:      9pt;
    background:     #FBFBFB;
	position:       absolute;
    /*width:      20%;
    left:          71%;*/
    padding:        0 0 2em 1em;
	color:          #6B6B6B;
    text-align:     left;
    border-left:    1px solid #ddd;
}
#sidebar ul {
	list-style:     none outside;
	margin:         0px;
	padding:        0px;
}
#sidebar ul li {display: block; margin-bottom:0.4em; }
#sidebar ul li ul {
	list-style:     none outside;
	margin-top:     0.4em;
	margin-bottom:  1em;
}
li.vategories ul {
	list-style:     none outside;
	margin-top:     1em;
	margin-bottom:  1em;
}
#sidebar ul li ul li {
	margin-top:     0.4em;
	display:        block;
}
#sidebar a {
	color:          #bbb;
}
#sidebar a:hover {
	color:          #000;
}
#sidebar h2 {
    color:          #bbb;
	font-size:      8pt;
	font-weight:    bold;
	display:        inline;
}
#sidebar input {border: 1px solid #ddd;}
input#searchsubmit {
    background:     #fff;
    color:          #bbb;
}


div#main { margin: 0 0 0 30px; } 
/* content */
.content, .searchresults {
        background: #FBFBFB;
        padding:    0 0 0 0;
	margin:   0 9.3% 0  20% /*0  3.5% 0  6.8%, 0 45px 0 125px*/;
	float:      left;
	/*width:      61%;*/
	text-align: left;
}

.content, .page, .categories, .archives, .linkspage, .main {
        background: #FBFBFB;
	padding:    0 0 0 0;
	margin:  0 9.3% 0  20% /* 0 55px 0 23% */;
	float:      left;
	/*width:      61%;*/
	text-align: left;
}
.content a {
	color: #000;
	text-decoration: underline;
}
.content a:hover {
	 color: #fd8008;     /* orange */
}
.content h1, .post-wrap h1, h2.post-title {
	display: inline;
	font-size: 10pt;
	text-decoration: none;
	color: #67A220; /* #74B624;     green */
}
.content h1 a, .post-wrap h1 a, h2.post-title a {
	color: #444;
	text-decoration: none;
	color: #67A220; /* #74B624;     green */
}

.content h2 {
	display: inline;
	text-decoration: none;
}
.content h2 a {
	color: #444;
	font-size: 14pt;
}


div#inlineImg img {
    border : 0;
    margin : 0;
    width : 1em;
}

.content img {
    border:     0px solid #999;
    margin:     0em 2em 0 0;
}

.content table, .content table tr, .content table tr td, .content table thead th {
    border:     0px solid #000;
    margin:     1em 3% 1em 3%; 
    padding:    0;
    font-weight: normal;
    padding-right: 0em;
}

.post-content {
	clear:      both;
	padding:    10px 0;
	margin:     0;
}
#content ul, #content ol {
    list-style-position: inside;
    margin:     1em 0 1em 1em; 
    padding:    0;
}
.post {clear: both;}
.post-date {
	width:      50px;
	height:     50px;
	float:      left;
}

#excerpt {
        line-height:    1.25;
}

.thumbnailwrap {
	margin-left:   100px;
	padding-bottom: 1em;
	margin-bottom:  2em;
        padding-right:2em;
}

.thumbnail {
	width:      75px;
	float:      left;
        margin-left: 5px;
}

.post-month {
	font-size:  8pt;
	color:      #fff;
	text-align: center;
	display:    block;
	padding:    2px;
	background: #87d744;        /* green */
	text-transform: uppercase;
}
.post-day {
	font-size:      8pt;
	color:          #555;
	text-align:     center;
	display:        block;
	background:     #fff;
	border-bottom:  1px solid #87d744;
	border-right:   1px solid #87d744;
	border-left:    1px solid #87d744;
	padding:        2px;
	line-height:    8pt;
	text-transform: uppercase;
}
.post-meta {
    font-size:      8pt;
    color:          #505050;
}
.post-meta p {margin: 0;}
.post-wrap {
	margin-left:    80px;
          margin-bottom:  2em;
	padding-bottom: 1em;	
}


/* for static pages */


.aboutself {
    position:       absolute;
    left:          6.8% /*originally 9.8%*/;
    font-size:  9pt;
    width:       13%   /*   155px*/;
    text-align:     left;
    color: #6B6B6B;
    background: #FBFBFB;
    top: 240px; /* fix its top to not sink below when displaying dynamic contents in single posts*/
    float:left;
}

.aboutself ul {
	list-style:     none outside;
	margin:         10px;
	padding:        0px;
}

.aboutself ul li {
        display: block;
	margin-bottom:         1.4em;
        text-decoration: none; color: #888;
}

.aboutself ul li  a {text-decoration: none; color: #888;}
.aboutself ul li a:hover {color: #fd8008;}



.story-content h2{
        /*display: inline;*/
	font-size: 10pt;
	text-decoration: none;
	color: #67A220; /* #74B624;     green */
        padding-top: 20px;
}

.story-content a {
	color: #000;
	text-decoration: underline;
}
.story-content a:hover {
	 color: #fd8008;     /* orange */
}

.cv_body {
	float:left;
	clear:left;
	width: 500px;
        font-size: 9pt;	
}

.cv_margin {
	margin-left: 560px;
	text-align: right;
	font-size: 9pt;	
}



/* comments */

#commentwrap h3 {
    font-size:  9pt;
    color:      #666;
}
#commentwrap ol li {
    margin:     3em 0;
}
#commentwrap input, #commentwrap textarea {
    border:     1px solid #999;
    padding:    0.2em 0.4em;
}
#commentwrap .url {
    font-weight:    normal;
}
#commentwrap {margin-left: 70px;}
#respond {padding-top: 1em;}
.comment-meta {font-size: 8pt; margin: 0;}
#commentwrap ol {
    list-style-type: none;
    margin: 0; padding: 0;
}
#commentwrap ol.commentlist li { border:1px solid #D9D9D9; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; margin:0 0 10px; padding:5px 7px 5px 14px; position:relative;}
#commentwrap ol.commentlist li div.vcard { font-size: 11px; line-height: 20px; }
#commentwrap ol.commentlist li div.vcard cite.fn { font-style:normal; font-size: 12px; }
#commentwrap ol.commentlist li div.vcard cite.fn a.url { color:#74B624; font-weight:bold; text-decoration:none; }
#commentwrap ol.commentlist li div.vcard cite.fn a.url:hover { color:#000; }
#commentwrap ol.commentlist li div.comment-meta { font-size: 10px; line-height: 16px; font-family: helvetica,arial,sans-serif; position:absolute; right:10px; text-align:right; top:5px; }
#commentwrap ol.commentlist li div.comment-meta a { color:#555; text-decoration:none; }
#commentwrap ol.commentlist li p { font-weight:normal; font-size: 12px; line-height: 16px; margin:5px 0 12px; }
#commentwrap ol.commentlist li ul { font-weight:normal; font-size: 12px; line-height: 16px; list-style:square; margin:0 0 12px; padding:0; }
#commentwrap ol.commentlist li div.reply { background:#999; border:1px solid #666; border-radius:2px; -moz-border-radius:2px; -webkit-border-radius:2px; color:#fff; font:bold 9px/1 helvetica,arial,sans-serif; padding:6px 5px 4px;  text-align:center; width:36px;}
#commentwrap ol.commentlist li div.reply:hover { background:#74B624; border:1px solid #74B624; }
#commentwrap ol.commentlist li div.reply a { color:#fff; text-decoration:none; text-transform:uppercase; }
#commentwrap ol.commentlist li ul.children { list-style:none; margin:15px 0 0; text-indent:0; }
#commentwrap ol.commentlist li ul.children li.depth-2 { margin:0 0 6px; }
#commentwrap ol.commentlist li ul.children li.depth-3 { margin:0 0 6px; }
#commentwrap ol.commentlist li ul.children li.depth-4 { margin:0 0 6px; }
#commentwrap ol.commentlist li ul.children li.depth-5 { margin:0 0 6px; }
#commentwrap ol.commentlist ul.children li.odd { background:#fff; }
#commentwrap ol.commentlist ul.children li.even { background:#f6f6f6; }
#commentwrap ol.commentlist li.pingback div.vcard { padding:0 170px 0 0; }

#commentwrap input#submit {
    color:      #505050;
    border:     1px solid #999;
    background: #fff;
}
.searchresults ul, .categories ul, .archives ul, .linkspage ul, .archives ul {
	list-style: none;
    margin: 0;
    padding: 0;
}

/* nav */
.nav {margin-left: 70px;}
.previous, .next {display: inline;}
.previous {padding-right: 1em; float:left;}
.next {padding-left: 1em; float:right;}

/* footer */
#footnote {
    clear: both;
    font-size:  8pt;
    color:      #ddd;
    text-align: center;
    margin: 3em 0 0 0;
    padding:     0 45px 0 45px;
    background: #74B624;
}
#footnote a {color: #ddd;}
#footnote a:hover {color: #fff;}
#footnote ul {list-style-type: none; float: right;}

#footnote ul li {
        display: inline;
	position: relative;

}


/* wordpress */
.imgl {
border:0;
float:left;
margin:0;
padding:0;
}
.imgr {
border:0;
float:right;
margin:0;
padding:0;
}
.wp-caption {
font-size: 8pt;
margin-top: 1em;
}
.wp-caption p {
margin: 0.2em 0 0 0;
}

/* The slideshow CSS. Customize to meet your taste. */
.slideshow {
	font-family:Arial, Helvetica, sans-serif;
	width:336px;
	height:375px;
	overflow:hidden;
	background-color:#000000;
	color:#FFFFFF;
	border:5px solid #99CC00;
}
.slideshow > ul {
	margin: 0;
	padding: 0;
}
.slideshow > ul > li {
	display:inline;
	margin:0px;
	padding:0px;
	font-size:1px;
	margin-right: -1px;
}
.slideshow > ul > li > div {
  display: none;
  text-decoration: none;
  float:left;
}
.slideshow > ul > li > div > p {
  font-size:11px;
  text-align:center;
  padding:10px 0px 0px 0px;
  margin:0px;
  color:#FFFFFF;
}
.slideshow > ul > li > div > a > img {
	border:2px solid #FFFFFF;
	width:332px;
}
.slideshow  > ul > li > img {
	border:2px solid #FFFFFF;
	margin:0px;
	padding:0px;
	width:80px;
	height:60px;
}
/* Shows slides when mouse pointer is over a thumbnail image */
.slideshow > ul > li:hover > div {
	display: block;
}
/* Highlights the thumbnail image when mouse pointer is over it */
.slideshow > ul > li:hover > img {
	border-color:#FF6600;
}