/*
Theme Name: Fotofolio Modified
Theme URI: http://pupungbp.erastica.com/
Description: Wordpress Theme for Photography lovers, Graphic Designers, of even a Drawer. 
Version: 1.0.9
Author: Pupung Budi Purnama and Rita Krastoshevsky
Tags: White, Gray, 2 Column
*/

/******* GLOBAL ELEMENT *******/

* {
	margin: 0;
	padding: 0;
}

body {
	background: #fff url(images/bgr-folio.jpg) repeat scroll 0 0; /* old  */
	font-size: 62.5%;                           
        font-family: Georgia, "Times New Roman", Times, serif;  /* ch rk  */         
	color: #505050;
	overflow-x: hidden;
	margin: 0;
        padding: 20px 0;                                       /* old */
	text-align: center;                                    /* old */
}

h1, h2, h3, h4 {
	font-family: Helvetica;
      font-size: 1.6em;    /* rk */
}

.ffix {
        clear: both;
}

a {
	color: #505050;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
	}

img {
	border: none;
}


/* ul, li, ol {                new ver
	width: 100%;
	padding: 0px;
	margin: 3px;
	}                                           rk    */


/******* HEADER *******/
#header {
	display: block;
      padding: 0 0 30px 0;                         /* rk */	

}

#header h1{
	margin: 0;                                  /* new */
      display: block;                              
      float: left;                                
	font-size: 1.4em;                           /* old */
	font-weight: normal;                        /* old */
	font-style: italic;                         /* old */
	line-height: 4.4em;                         /* old */
}

#header .blog-desc {                        /* new  not needed by rk */
	margin-left: 5px;
	margin-top: 28px;
	float: left;
      font: italic 13px Georgia;
	padding: 0;
}


/* ******* TYPOGRAPHY - from old ver expt body,header  rk ******* */

.legend h2, .legend h3, #data h2, .news h2 {
	font: bold 1.2em 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;    
	letter-spacing: 0.3em;
	text-transform: uppercase;
}

.legend h3 {
	font-size: 2.4em;
	letter-spacing: 0;
}

.notes a {
	border-bottom: 1px dotted #333;
}

.author {
	font-size: 1.2em;
}

.author strong {
	font-family: Helvetica, Arial, sans-serif;
}

.notes {
	font-size: 1.6em;       /* was 1.5em rk */    
	line-height: 1.6em;
}

.page .notes {                 /* useless now ??? rk */
	width: 500px;
}

.notes p {
}

.page-content-old h3 {                    /* rk - needed??? */
	font: bold 2.4em 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;    
	text-transform: uppercase;
	letter-spacing: 0;
      margin-left: 10px;
}

.page-entry {                                 /* was 1.5em rk */
	font-size: 1.6em;          
	line-height: 1.6em;
}

.page-entry a {                               /* rk */
	border-bottom: 1px dotted #333;
}

#data h2 {
	color: #352511;
	padding-left: 15px;                
}

#data ul li, #data .resume p {
	font-size: 1.3em;
	color: #fff;
	line-height: 1.6em;
}
#footer {
	font-size: 0.9em;
	font-family: Helvetica, Arial, sans-serif;
	text-transform: uppercase;
}


/* ************ LAYOUT - from old ver rk *********** */

#container {
	width: 840px;                 /* was 820 rk */
	margin: 0 auto;
	text-align: left;
}

.featured {
	padding-top: 15px;
	width: 840px;                 /* was 820 rk */
	padding-bottom: 50px;
	min-height: 300px;
}

.featured img {
	padding: 5px;
	background: #ebebeb;
}

.photo {
	float: left;
}

.shadow-left {
	background: url(images/shadow-left.png) no-repeat left bottom;
      margin-left: 20px;                         /* rk */
}

.shadow-right {
	background: url(images/shadow-right.png) no-repeat right bottom;
	padding: 9px;                        
}

ul#photos {
	list-style: none;
	width: 490px;
	height: 285px;
}

.legend {
	float: left;
	text-align: left;
	width: 280px;               
	padding-top: 15px;    
      margin-left: 10px;                          
}

.legend h2 {
	padding-bottom: 20px;
}

.legend h3 {
	
}


.notes p {
	padding-top: 20px;
}


.page-content-old {                           /* rk */
	float: left;
	text-align: left;
	width: 750px;               
	padding-top: 15px;    
      margin-left: 10px;                          
}

.page-content-old h2 {                        /* rk */
	padding-bottom: 20px;
}

.page-entry p {                              /* rk */
	padding-top: 20px;
}

.news h2 {
	padding-top: 20px;
}

div.category-list {
	width: 400px;
	float: left;
	padding-top: 15px;
	padding-left: 30px;
}

div.category-list .pic, div.news .pic {
	width: 80px;
	height: 80px;
	background: #000;
	float: left;
	margin-right: 8px;
	margin-bottom: 8px;
}

.pic a img {
	border: 2px solid #fff;        
}

.pic a:hover img {
	background: #666;
}

div.news .pic {
	width: 60px;
	height: 60px;
}


/****** BOTTOM CONTAINER - from old ver rk *******/
#data {
	background: #a69785 url(images/top-bksm11.jpg) repeat scroll 0 0;
	text-align: center;

}
#data .container {
	text-align: left;
	margin: 0 auto;
	width: 820px;
	background: url(images/stripe.png) repeat-y 410px 0;
}
#data .container .top {
	background: url(images/arrow-top.png) no-repeat 402px 0;  
	height: 9px;
	clear: both;
}
#data .container .bottom {
	background: url(images/arrow-bottom.png) no-repeat 402px 0;
	height: 9px;
	clear: both;
}
#data .about {
	padding: 10px 0;                          
	width: 150px;
}

#data .about-ttl {                                         
      background: url(images/about.gif) no-repeat top left;
      width: 100px;
	height: 40px;
      margin: 0;
}

#data .about, #data .category {
	float: left;
	padding-left: 5px;
}
#data .about li {
	clear: both;
}
#data .category {
	padding: 10px 0;            
	width: 250px;
}

#data .category-ttl {                                         
      background: url(images/portfolio.gif) no-repeat top left;
      width: 115px;
	height: 40px;
      margin: 0;
}

#data .category li {
	width: 230px;              /* was 115 rk */           
}
#data ul {
	list-style: none;
	padding-top: 5px;          
}
#data ul li {
	float: left;
}
#data ul li a {
	padding-left: 15px;        
}
#data ul li a:hover, .current-cat, .active, .current_page_item {
	background: url(images/current.gif) no-repeat left center;
}
#data .resume {
	width: 380px;
	float: right;
	padding: 10px 0;            
}

#data .resume-ttl {                                         
      background: url(images/author.gif) no-repeat top left;
      width: 135px;
	height: 35px;
      margin: 0 0 0 55px;
	padding-bottom: 10px;
}

#data .resume img {
	padding: 3px;
	float: left;
	background: #7b6851;
	margin-top: 5px;
	margin-left: 8px;
}
#data .resume h2 {
	padding-bottom: 10px;
}
#data .resume p {
	float: right;
	width: 310px;
	margin-top: 8px;         
}
#data a {
	color: #fff;
}
#data .resume a {
	border-bottom: 1px dotted #efefef;
}




/* ******** Paging - from old ver rk ******* */
.navigation {
	clear: both;
	font-family: Georgia, "Times New Roman", Times, serif;  /* rk */
	font-size: 110%;                                         /* rk */
/*	font: bold 1em Arial, Helvetica, Verdana, Sans-Serif;      rk */
	text-transform: uppercase;
	letter-spacing: 0.1em;
	padding-right: 44px;
}
.alignleft {
	text-align: left;
}
.alignright {
	text-align: right;
}
.navigation .alignleft {
	width: 40%;
	float: left;
}
.navigation .alignright {
	width: 40%;
	float: right;
}
.single .navigation {
	width: 500px;
	padding: 0 10px;
}



/****** PAGE STYLE - new ver - see if needed ******/
.page-item {
	margin-left: 80px;
	padding: 15px;
      width: 80%;
      padding-bottom: 0px;
      }

.page-item h3 {
	margin: 0px;
	padding: 0px;
      }

.page-item p {
	margin-top: 15px;
	}

.page-content {
	font-size: 13px;
	border-top: 1px solid #999;
	margin-top: 5px;
	width: 100%;
	min-height: 250px;
      height: auto !important;
      height: 250px;
      }



/* *********** FOOTER - from old ver rk ********* */
#footer {
	padding: 15px;
}


/****** MAIN LAYOUT - new ver - see if needed ********/
/* featured & single renamed into featured1, single1 rk */

.featured1 {
	padding-right: 4%;
	min-height: 300px;
      height: auto !important;
      height: 300px;
	dispaly: inline;
	margin-left: 4%;
      }

.blog-index {
      float: left;
	display: inline;
      width: 58%;
      min-width: 300px;
      min-height: 250px;
      height: auto !important;
      height: 250px;
	margin-left: 45px;           /* was 75px rk*/
	margin-top: 5px;
	margin-right: 30px;
      padding-bottom: 40px;
      }

.single1 {
      padding-top: 10px;
      padding-bottom: 10px;
      padding-right: 7%;
      min-height: 300px;
      height: auto !important;
      height: 300px;
      display: inline;
      }

.imgborder img {
	padding: 5px;
	margin-right: 5px;
	background: #ebebeb;
      }

ul#photoslide {
	list-style: none;
	margin: 0px;
	padding: 0px;
	width: 490px;
	height: 285px;
	overflow: hidden;
      }

.archive-image {
	float: left;
	width: 40%;
	min-height: 200px;
	min-width: 200px;	
      height: auto !important;
      height: 200px;
	margin-top: 25px;
	margin-left: 25px;
	}

.archive-image .pic {
	float: left;
	}

/****** FRONT PAGE NEWS - new ver see if needed ******/

.news h3 {
	margin-bottom: 10px;
	letter-spacing: 3px;
	}



/****** COMMENT STYLE *******/
div.comments {                     /* old */
	padding-top: 30px;
}
#respond {                         /* old */
	width: 280px;
	float: right;
	padding: 10px;
	background: #efefef;
	-moz-border-radius: 4px;
}
.commentlist {                     /* old */
	width: 500px;
	float: left;
}

.comments .navigation {            /* old */
	width: 450px;
	padding: 10px;
}
textarea#comment {                 /* old */
	width: 250px;
	padding: 10px;
	border: none;
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 11px;
}
.navigation-comment {              /* old */
	width: 400px;
	float: left;
}
.comment-box {                     /* old */
	width: 500px;
	float: left;
}

h3#comments, div#respond h3 {      /* old */
	font-size: 11px;
	font-family: Arial, Helvetica, Sans-Serif;
	text-transform: uppercase;
}
ol.commentlist {                   /* old */
	list-style: none;
	line-height: 18px;
}
ol.commentlist li {                /* old */
	padding: 15px;
	font-size: 1.3em;
}
ol.commentlist li .avatar {        /* old */
	margin: 5px 8px 5px 0;
}

.children li {                     /* new */
	list-style: none;
	}

cite.fn {                          /* old */
	font-weight: bold;
}
	
.comment-body img {                /* new */
	float: left;
	}
.comment-body {                    /* new */
	margin-top: 0px;
	}
.comment-meta {                    /* old */ 
	font: italic 11px Arial, Helvetica, Sans-Serif;
}
.comment p {                       /* old */
	width: 420px;
	float: right;
}
form#commentform p {               /* old */
	font: italic 11px Arial, Helvetica, Sans-Serif;
	padding: 5px 0;
}
form input {                       /* old */
	border: none;
	padding: 5px;
}
form input#submit {                /* old */
	background: #ccc;
	font-weight: bold;
}



/****** Slide Comment Toggle - new ver see if needed *********/


.comment-slide-btn {
        background: #999;
        font: normal 10px Helvetica;
        padding-top: 3px;
        padding-bottom: 3px;
        width: 120px;
        text-align: center;
        margin: 25px 0 5px 0;
        color: #fff;
	
}

.comment-slide-btn:hover, .active {
        text-decoration: none;
        background: #aaa;
        }


#toggle-comment {
        float: left;
        color: #fff;
        font-weight: bold;
        }

#toggle-comment a {
        color: #fff;
        }

#comment-area {
	margin-left: 40px;
	}


/****** BLOG INDEX STYLE - new ver *******/

.blog-index li {
      list-style-type: none;
      margin-bottom: 40px;
      }

.blog-index h3 a {
	font: normal 16px 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                /* rk */
	letter-spacing: 0.3em;          /* rk */ 
	text-transform: uppercase;      /* rk */
/*	font-size: 16px;                   rk */
	color: #574733;
	margin: 0; 
	padding: 0;
	}

#blog-index-item {
      border-top: 2px dotted #999;     /* was 1px rk */
      border-bottom: 2px dotted #999;  /* rk */
	margin-top: 5px;
	margin-bottom: 20px;
	padding: 0;
      background-color: #f7f3f7;       /* rk */
      opacity: 0.6;                    /* rk */
        /* for IE */
      filter:alpha(opacity=60);       /* rk */
	}

#post-entry {
	margin-top: 10px;
	}
#post-entry a {
	color: #574733;
	font-weight: bold;
	}

#post-entry ul {
	padding: 0;
	margin: 5px 0 0 0;
	}

#post-entry li {
	list-style-type: none;
	margin-left: 0px;
        margin-bottom: 50px;
	padding-top: 5px;
	width: 100%;
	}

.post-entry-excerpt {
	font: normal 15px Georgia;   /* was 12 rk */
	padding-left: 15px;
	padding-right: 15px;
	margin-top: 10px;
	margin-bottom: 10px;
      color: #000000;
      opacity: 1.0;                     /* rk */
        /* for IE */
      filter:alpha(opacity=100);       /* rk */
	}


/****** BLOG POST STYLE - new ver + rk *******/

.blog-single {                        /* rk */
      float: left;
      display: inline;
      width: 60%;                  /* was 58% rk */
      min-width: 300px;
      min-height: 250px;
      height: auto !important;
/*    height: 250px;                          rk  */
      margin-left: 45px;           
      margin-top: 5px;
      margin-right: 30px;
      padding-bottom: 40px;
      }

.blog-single h2 {                      /* rk */
	color: #574733;
	padding-bottom: 20px;
	font: bold 1.2em 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;    
	letter-spacing: 0.2em;
	text-transform: uppercase;
	}

.blog-single h2 a {                      /* rk */
	color: #574733;
	}

.blog-single h3 {                      /* rk */
	font: normal 1.8em 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                
	letter-spacing: 0.2em;   
        line-height: 120%;       
	text-transform: uppercase;      
	color: #574733;
	margin: 0; 
	padding: 0 0 15px 0;
	}

.blog-single-post {                    /* rk */
	border-top: 2px dotted #999;     
        border-bottom: 2px dotted #999;  
	margin-top: 5px;
	margin-bottom: 20px;
        font-size: 16px;
        line-height:120%;
        color: #000000;
        padding: 10px;
        background-color: #f7f3f7;       
        opacity: 0.8;                    
        /* for IE */
        filter:alpha(opacity=80);       
	}

.blog-single-post h4 {                      /* rk */
	font: normal 16px 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                
	letter-spacing: 0;          
	color: #574733;
	padding: 20px 0 5px 10px;
        text-transform: uppercase;
	}

.blog-single-post p {                     /* rk */
      padding: 10px 0;
      }

.blog-single-post em {                    /* rk */
      font-style: italic;
      font-family: 'Lucida Grande', serif; 
      font-size: 17px;
      }

.blog-single-post img {                   /* rk */
      margin: 1px 10px 1px 0;
      padding: 2px;
      border: 1px solid #bdbebd;
      }

.blog-single-post ol {                    /* rk */
      padding: 10px 0 5px 65px;
      }

.blog-single-post ul {                    /* rk */
      padding: 10px 0 5px 65px;
      }

.blog-single-post li {                    /* rk */
      padding-bottom: 10px;
      }

.blog-single-post a {                     /* rk */
      text-decoration: underline;
      color: #505050;
      }



#blog-post {
	float: left;
	width: 60%;
	min-width: 300px;
	margin-top: 15px;
	padding-bottom: 10px;
	padding-left: 80px;
	}

#blog-post h2 {
	font-size: 16px;
	color: #574433;
	}

#blog-post h3 {
	color: #574433;
	}

#blog-content {
	border-top: 1px solid #999;
	font-size: 13px;
	margin-right: 5px;
	margin-top: 5px;
	line-height: 22px;
	}

#blog-content li {
	margin-left: 15px;
	}

#blog-content p {
	margin-top: 15px;
	}


#com-blog-content {
        font-size: 13px;
        line-height: 22px;
        }


/****** PAGE STYLE -  rk - like blog-single *******/

.page-single {                        
      float: left;
      display: inline;
      width: 60%;                  
      min-width: 300px;
      min-height: 250px;
      height: auto !important;
/*    height: 250px;                          rk  */
      margin-left: 45px;           
      margin-top: 5px;
      margin-right: 30px;
      padding-bottom: 40px;
      }

.page-single h3 {                      
	font: normal 1.8em 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                
	letter-spacing: 0.2em;   
        line-height: 120%;       
	text-transform: uppercase;      
	color: #574733;
	margin: 0; 
	padding: 0 0 15px 0;
	}

.page-single-entry {                    
	border-top: 2px dotted #999;     
        border-bottom: 2px dotted #999;  
	margin-top: 5px;
	margin-bottom: 20px;
        font-size: 16px;
        line-height:120%;
        color: #000000;
        padding: 10px;
        background-color: #f7f3f7;       
        opacity: 0.8;                    
        /* for IE */
        filter:alpha(opacity=80);       
	}

.page-single-entry h4 {                      
	font: normal 16px 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                
	letter-spacing: 0;          
	color: #574733;
	padding: 20px 0 5px 10px;
        text-transform: uppercase;
	}

.page-single-entry p {                     
      padding: 10px 0;
      }

.page-single-entry em {                    
      font-style: italic;
      font-family: 'Lucida Grande', serif; 
      font-size: 17px;
      }

.page-single-entry img {                   
      margin: 1px 10px 1px 0;
      padding: 2px;
      border: 1px solid #bdbebd;
      }

.page-single-entry ol {                    
      padding: 10px 0 5px 25px;   <!-- unlike blog rk -->
      }

.page-single-entry ul {                    
      padding: 10px 0 5px 25px;   <!-- unlike blog rk -->
      }

.page-single-entry li {                    
      padding-bottom: 10px;
      }

.page-single-entry a {         <!-- unlike blog rk -->            
      text-decoration: none;
      color: #000000;
      border-bottom: 1px dotted #505050;
      }

.page-single-entry a:hover {                     
      border-bottom: 1px solid #505050;
      text-decoration: none;
      }




/******* IMAGE PREVIEW STYLE - old ver *******/

#imgPreviewWithStyles {
    background: #666;
    padding: 5px;
    z-index: 999;
    border: none;
}

/* Text below image */
#imgPreviewWithStyles span {
    color: white;
    text-align: center;
    display: block;
    padding: 10px 0 3px 0;
}


/****** NAVIGATION - new ver - see if needed ******/

#single-navigation {
	clear: both;
	display: block;
      font: bold 9px arial, Verdana, Helvetica, Verdana, Sans-Serif;
      letter-spacing: 0.1em;
	padding-top: 15px;
	padding-left: 0px;
	padding-bottom: 5px;
      float:left; 
	width: 100%;
      }

#single-navigation a {
      color: #505050;
      }

.single-alignleft {
      float: left;
	padding-top: 5px;
      text-align: left;
      }
.single-alignright {
      float: right;
	margin-right: 0px;
	padding-top: 5px;
      text-align: right;
      }

#photo-navigation {
      font: bold 9px arial, Verdana, Helvetica, Verdana, Sans-Serif;
      letter-spacing: 0.1em;
      padding-left: 0px;
	padding-right: 30%;
      padding-bottom: 10px;
	padding-top: 15px;
      float:left;
	margin-left: 40px;
	display: inline;
}

#photo-navigation a {
        color: #505050;
}

.photo-alignleft {
        float: left;
        padding-top: 5px;
        text-align: left;
}
.photo-alignright {
        float: right;
        margin-right: 0px;
        padding-top: 5px;
        text-align: right;
}



/****** TAG STYLE - new ver - see if needed ******/


#tag-page ul {
        margin-top: 10px;
        margin-left: 10px;
        }

#tag-page a {
      color: #352511;
	font-weight: bold;
      border-bottom: 1px dotted #999;
}

#post-tags {
	font-size: 11px;
	margin-top: 5px;
	margin-bottom: 10px;
      padding: 0px;
      opacity: 1.0;                    /* rk */
        /* for IE */
      filter:alpha(opacity=100);       /* rk */
        }

#post-tags small {
	font-size: 12px;
	}

#post-tags a {
	font-weight: bold;
	color: #574733;
	}


/* ********** WIDGETS - new ver ********** */
/* Blog Widget */

#blog-widget {
      padding-left: 20px;
      min-width: 207px;  /* was 200px - to fit image rk */
      width: 20%;
      float: left;
	padding-bottom: 20px;
}

#blog-widget h2 {
	font: normal 15px 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;                                /* rk */
	letter-spacing: 0.2em;          /* rk */
	text-transform: uppercase;      /* rk */
/*	color: #574733;                    rk */
/*      background: url(images/sidebar.gif) no-repeat top left; */
/*      width: 207px;                      rk */ 
/*	height: 44px;                      rk */ 
	margin: 0px 0 10px 0;           /* was 5px-b rk */
	padding: 2px 0 2px 10px;        /* was 0 rk */
        background-color:#8c8273;       /* rk */
        color:#efebef;                  /*  was ffffff rk */
        border-bottom: 2px dotted #ffffff;  /* rk */
        border-top: 2px dotted #ffffff;     /* rk */
	}

#blog-widget a {
	font: normal 14px Georgia, serif;   /* rk */
	padding: 0;                 
	margin: 0px;
        }


#blog-widget ul {
	list-style-type: none;
	padding: 0px;
	margin: 0px;
        }


#blog-widget li {
	padding-bottom: 3px;
	margin-left: 0px;
	width: 100%;
        }

#blog-widget ul li {           /* rk */
        margin-bottom: 15px;
        background: url("images/bgr-folio-text.jpg") repeat scroll 0 0 transparent;
        border-bottom: 1px dotted #8C8273;
        }

#blog-widget ul li ul li {      /* rk */
        background: url(images/bullet.gif) no-repeat 0 6px transparent;
        margin: 0 0 0 10px;
        padding: 0 0 6px 15px;      /* was  0 0 4 7 */
        border: 0 none;
        } 

/* ******* Bottom Widget - new ver - see if needed ******** */

#bottom-widget-left ul, #bottom-widget-middle ul, #bottom-widget-right ul {
        padding: 0;
        margin-left: 5px;
}

#bottom-widget-left li, #bottom-widget-middle li, #bottom-widget-right li {
	margin: 0 0 0 5px;
	}
#bottom-widget-left h2, #bottom-widget-middle h2, #bottom-widget-right h2 {
	font-size: 13px;
      margin-top: 3px;
	text-transform: uppercase;
	letter-spacing: 0.3em;
}

#bottom-widget-left {
	float: left;
	}

#bottom-widget-middle {
	float: left;
}

#bottom-widget-right {
        float: left;
}


/* ********* Search Widget - new ver - see if needed ******** */
#s {
	margin-top: 5px;
	margin-bottom: 5px;
	height: 0.8em;
	border: 1px solid #999;
	}

#searchsubmit {
	display: none;
	}

.screen-reader-text {
	display: none;
} 

#sidebar-searchform {
	margin-left: 15px;
	padding: 0 0 5px;
	}
#ss {
	width: 150px ;
	height: 0.8em;
	border: 1px solid #999;
	}


/******* MISC ******/