/*
Theme Name: Fotofolio
Theme URI: http://pupungbp.erastica.com/
Description: Wordpress Theme for Photography lovers, Graphic Designers, of even a Drawer. By: Pupung Budi Purnama.
Version: 1.0.6
Author: Pupung Budi Purnama
Tags: White, Gray, 2 Column
/*
/* GLOBAL CSS */
.fbLikeContainer{
	margin-top:15px;
}
* {
	margin: 0;
	padding: 0;
}
#icotw{
	width:26px;
	height:26px;
	background:url(images/icotw.gif) no-repeat;
	float:left
}
body {
	text-align: center;
	background: url(images/bg.jpg) center top repeat-x #fff;
	height:100%;
	color: #505050;
	font-family: Arial, helvetica;
	font-size: 62.5%;
	padding: 0px;
}
#homelink{
	background:url(images/header.jpg) no-repeat 0 1px;
	font:italic 12px Arial, Helvetica;
	color:#99b;
	height:100px;
	display:block;
}
#homelink p{
	padding-top:30px;
	padding-left:550px;
	padding-right:10px;
	display:block;
	text-align:right;
}
h1, h2, h3, h4 {
	font-size: 1.6em;
}
.ffix {
	clear: both;
}
a {
	color: #505050;
	text-decoration: none;
}
img {
	border: none;
}

/* SOCIAL */
#translation_bar #transl_sign a{color:#acf; font:9px tahoma; float:left;text-transform:lowercase;}
#transl_sign{
	display:inline;
}


#translation_bar{background:#597889; padding:3px; text-align:right;}
#translation_bar a {margin-left:3px;}
.resume div{border:none; width:40px; height:40px;float:left; margin:3px;}
.social-rss{background:url(images/social.jpg) -80px top no-repeat;}
.social-twitter{background:url(images/social.jpg) left top no-repeat;}
.social-facebook{background:url(images/social.jpg) -40px top no-repeat;}
.social-linkedin{background:url(images/social.jpg) -120px top no-repeat;}
.social-firefox{background:url(images/social.jpg) -160px top no-repeat;}
/* TYPOGRAPHY */
ul.twitterList{
	width:100% !important;
	background:none !important;
	border:none !important;
}
ul.twitterList li{
	font-size:11px;
	padding:5px 0px 10px 20px !important;
	background:url(images/twitter.jpg) no-repeat top left;
}

	
#header h1 {
	font-size: 1.4em;
	font-weight: normal;
	font-style: italic;
	line-height: 4.4em;
}
.legend h2, .legend h3, #data h2, .news h2 {
	font: bold 1.2em Helvetica, Arial, sans-serif;
	letter-spacing: 0.3em;
	text-transform: uppercase;
}
.legend h3, .legendpage h3,  .legendpage h2, .desthome h3 {
	font-size: 20px;
	color:#fff;
	letter-spacing: -1px;
	background:url(images/h3.jpg) no-repeat left center #557384;
	padding:3px;
	padding-left:15px;
	text-transform:lowercase;
	text-shadow:0 -1px 0 #000;
}
.notes a, ul.twitterList a{
	color:#000;
	padding:2px;
	text-decoration:none;
	-moz-border-radius:4px 4px 4px 4px;
}

.notes a:hover, ul.twitterList a:hover{
	background:#abc;
}
.notes blockquote{
	padding-bottom:20px;
	border-bottom:1px solid #ccd;
}
#homenews blockquote strong, .notes blockquote .strong{display:block; font-size:15px; font-style:bold; margin-bottom:6px; margin-top:10px; background:url(images/date.jpg) no-repeat center left; color:#79a; padding:3px;padding-left:22px; -moz-border-radius: 4px 4px 4px 4px;}
#homenews blockquote {font-size:11px;}

.author {
	font-size: 11px;
	font-style:italic;
	text-align:right;
	margin-top: 5px;
}
.author a{
	background: #ccc;
	padding: 4px;
	-moz-border-radius: 4px 4px 4px 4px;
	text-shadow: 0 1px 0 #fff;
}
.author strong {
	font-family: Helvetica, Arial, sans-serif;
}
.notes {
	font-size: 1.3em;
}
.page .notes {
	width: 500px;
}
.notes p {
	padding-top:10px;
}

#data ul li, #data .resume p {
	color: #fff;
}
#footer {
	font:9px Arial, Helvetica;
	color:#779;
	text-transform: uppercase;
    padding-top:10px;
	padding-bottom:5px;
	background:#333;
}
#footer a{color:#557;}
#footer a:hover{background:#113;}

/* LAYOUT */
#container {
	width: 820px;
	margin: 0 auto;
	text-align: left;
}
#header {
	height:100px;
	border-right:1px solid #557384;
	border-left:1px solid #557384;
}
#header h1 a {
	display: block;
	/*background: url(images/logo.png) no-repeat top left;
	width: 128px;
	height: 62px; */
	float: left;
	/*text-indent: -7777px;*/
}
.featured {
	padding-top: 15px;
	width: 820px;
	min-height: 300px;
}
.featured img {
	padding: 5px;
	background: #fff;
	border:1px solid #aaa;
}
.photo {
	float: left;
}
.shadow-left {
	background: url(images/shadow-left.png) no-repeat left bottom;
}
.shadow-right {
	background: url(images/shadow-right.png) no-repeat right bottom;
	padding: 10px;
}
ul#photos {
	list-style: none;
	width: 820px;
	height: 300px !important;
}
.legend {
	float: right;
	text-align: left;
	width: 330px;
	padding-top: 15px;
}
.desthome{
	
}
.legendpage{
	float:left;
	padding-top: 15px;
}
.legend h2 {
	padding-bottom: 10px;
}
.news h2 {
	padding-top: 15px;
}

#data {
	background: url(images/data.jpg) top left repeat-x #333;
	text-align: center;
    margin-top:20px;
}
#data .container {
	text-align: left;
	margin: 0 auto;
	width: 820px;
}
#data .container .top {
	height: 5px;
	clear: both;
}
#data .container .bottom {
	height: 5px;
	clear: both;
}
#data .about {
}
#data .about, #data .category {
	float: left;
	padding-left: 5px;
	padding-right:20px;
	margin-top:25px;
	margin-right:10px;
	border-right:1px dotted #999;
}
#data .about li {
	clear: both;
}
#data .about h2, #data .category h2, #data .resume h2{
	color:#999;
	text-shadow:0 -1px 0 #000;
}
#data .category {
}
#data .category li, .page li {
	font:11px arial, helvetica;
	text-shadow:0 -1px 0 #000;
}
.headermenu .page ul{
	list-style:none;
}
.headermenu .page li{
	color:#fff;
	text-shadow:none;
	display:inline;
}
#data ul {
	list-style: none;
	padding-top: 10px;
}
#data ul li {
	
}
#data ul li a {
	padding:3px;
	color:  #fff;
	display: inline-block;
	margin: 2px;
	-moz-border-radius:5px 5px 5px 5px;
}
#data ul li a:hover{
	background: #222;
}
.current-cat, .active, .current_page_item {
	/*background: url(images/current.png) no-repeat left center;*/
	-moz-border-radius:5px 5px 5px 5px;
	background: #111;
}
#data .resume {
	float: right;
	padding-top: 25px;
	padding-bottom: 25px;
}
#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;
}

#data .resume a {
	border-bottom: 1px dotted #efefef;
}

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: 2px;
	margin-left: 2px;
	margin-bottom: 8px;
}
.pic a img {
	border: 1px solid #aaa;
}
.pic a:hover img {
	background: #666;
}
div.news .pic {
	width: 75px;
	height: 75px;
}

/*paging*/
.navigation {
	clear: both;
	font: bold 1em Arial, Helvetica, Verdana, Sans-Serif;
	text-transform: uppercase;
	letter-spacing: -1px;
	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: 470px;
	padding: 0 10px;
}

/* CSS: (StyleSheet) */

#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;
}

/* Comments */
div.comments {
	padding-top: 30px;
}
#respond {
	width: 310px;
	float: right;
	padding: 10px;
	background: #efefef;
	-moz-border-radius: 4px;
}
.commentlist {
	width: 330px;
	float: left;
}
.comments p{ font-size:11px;}
.comments .navigation {
	width: 450px;
	padding: 10px;
}
textarea#comment {
	width: 290px;
	padding: 10px;
	border: none;
	font-family: Arial, Helvetica, Sans-Serif;
	font-size: 11px;
}
.navigation-comment {
	width: 400px;
	float: left;
}
.comment-box {
	width: 500px;
	float: left;
}
h3#comments, div#respond h3 {
	font-size: 11px;
	font-family: Arial, Helvetica, Sans-Serif;
	text-transform: uppercase;
	background:#8aa;
	text-shadow:0 -1px 0 #155;
}
ol.commentlist {
	list-style: none;
}
ol.commentlist li {
	padding: 15px;
	font-size: 1.3em;
}
ol.commentlist li .avatar {
	margin: 5px 8px 5px 0;
}

cite.fn {
	font-weight: bold;
	display:inline-block;
}
.comment-meta {
	font: italic 9px Arial, Helvetica, Sans-Serif;
}

form#commentform p {
	font: italic 11px Arial, Helvetica, Sans-Serif;
	padding: 5px 0;
}
form input, form textarea{
	border: 1px solid #ddd;
	font-size:14px;
	font-family: Arial, helvetica, Sans-serif;
	letter-spacing:-1px;
	padding: 5px;
}
form input#submit {
	background: #ccc;
	font-weight: bold;
}