/*
Theme Name: Bin Subtlety
Theme URI: http://andisaleh.com
Description: Base for WordPress Bin Themes.
Version: 1.0
Author: Andi Saleh
Author URI: http://andisaleh.com
*/

/* Import styles */
@import url('library/styles/reset.css');
@import url('library/styles/bin-base.css');
@import url('library/styles/960_static.css');
@import url('library/styles/plugins.css');

body {
	background:url('images/body-bg.jpg');
	font-family:'Segoe UI',Segoe,Tahoma,Geneva,'Helvetica Neue',Arial,Helvetica,sans-serif;
	font-size:small;
	width:100%;
}
a {
	color:#069;
	text-decoration:underline;
}
a:visited {
	color:#59b;
}
a:hover {
	color:#069;
}
input, textarea {
	font-family:'Segoe UI',Segoe,Tahoma,Geneva,'Helvetica Neue',Arial,Helvetica,sans-serif;
	font-size:small;
}

/* Header */
#headerWrapper {
	display:block;
	position:fixed;
	z-index:1000;
	height:37px;
	width:100%;
	background:url('images/headerWrapper-bg.png') top repeat-x;
	top:0;
	font-family:'Segoe UI',Segoe,Tahoma,Geneva,'Helvetica Neue',Arial,Helvetica,sans-serif !important;
	font-size:small;
}
#header {
	position:relative;
}
#logo {
	display:block;
	width:72px;
	height:37px;
	background:transparent url('images/logo-bg.png') center top no-repeat;
	position:absolute;
}
#logo h1 {
	margin:0;
}
a.logo {
	height:25px;
	width:34px;
	background-image:url('images/logo.png');
	background-position:center 0;
	position:absolute;
	top:4px;
	left:20px;
}
a.logo:hover {
	background-position:center -25px;
}

#mainNav {
	float:right;
	margin-top:3px;
}
#mainNav ul {
	list-style:none;
	margin:0;
	padding:0;
}
#mainNav li {
	float:left;
	margin-right:10px;
}
#headerWrapper #header #mainNav a {
	height:18px;
	width:1px;
	display:block;
	overflow:hidden;
	background-position:left 5px;
	padding-left:25px;
	background-repeat:no-repeat;
	text-transform:uppercase;
	font-size:.8em;
	color:#000;
	text-decoration:none;
}

#pageNav {
	float:right;
	margin-top:8px;
}
#pageNav ul {
	list-style:none;
	margin:0;
	padding:0;
}
#pageNav li {
	float:left;
	margin-left:15px;
}
#pageNav li, #pageNav a {
	height:10px;
	width:10px;
	display:block;
}
.menuprev, .menunext {
	background-position:center 0;
}
.menuprev-off, .menunext-off {
	background-position:center -10px;
}

.menuprev, .menuprev-off { background-image:url('images/menu-prev.gif'); }
.menunext, .menunext-off { background-image:url('images/menu-next.gif'); }

.menuPort { background-image:url('images/menu-portofolio.gif'); }
.menuBlog { background-image:url('images/menu-blog.gif'); }
.menuProfil { background-image:url('images/menu-profil.gif'); }
.menuKontak { background-image:url('images/menu-kontak.gif'); }
.menuSearch { background-image:url('images/menu-search.gif'); }

/* Home */
.home #mainContent a {
	color:#333;
	text-decoration:none;
	border-bottom:1px dotted #ccc;
}
.home #mainContent a:hover {
	color:#069;
	border-bottom:1px solid #069;
}

#teaserHome {
	padding-top:120px;
	float:left;
	margin-bottom:70px;
}
#teaserHome h2 {
	background-image:url('images/teaserHome-h2.png');
	width:603px;
	height:39px;
	margin-bottom:10px;
}
#teaserHome h3 {
	background-image:url('images/teaserHome-h3.png');
	width:568px;
	height:45px;
}

.home #mainContent h3 {
	margin-bottom:0;
}
.homeSectionTitle {
	margin:50px 0 0;
	border-bottom:none !important;
}
.homeSectionList {
	list-style:none;
	margin:0;
}
.homeSectionList li {
	display:inline;
}

#portfolioThumbHome {
	float:left;
}
#portfolioThumbHome a {
	border-bottom:none !important;
}
#portfolioThumbHome img {
	box-shadow:0 1px 3px #ccc;
	-moz-box-shadow:0 1px 3px #ccc;
	-webkit-box-shadow:0 1px 3px #ccc;
	padding:5px;
	background:#fff;
	margin:20px 20px 0 0;
}
#portfolioCopyHome {
	margin-left:170px;
}
#portfolioCopyHome .homeSectionTitle {
	width:86px;
	height:30px;
	background-image:url('images/portofolioHomeTitle.png');
}
#portfolioCopyHome .homeSectionList {
	margin-bottom:10px;
}
.home #requestQuoteHome {
	display:none;
}
#requestQuoteHome {
	position:relative;
	left:-9px;
}
#requestQuoteHome a {
	width:138px;
	height:26px;
	background-image:url('images/requestQuote.png');
	background-position:left 0;
	border-bottom:none !important;
}
#requestQuoteHome a:hover {
	background-position:left -26px;
	border-bottom:none !important;
}
#requestQuoteHome a:active {
	background-position:center -52px;
}

#blogCopyHome {
	float:left;
	margin-right:20px;
}
#blogCopyHome .homeSectionTitle {
	width:45px;
	height:30px;
	background-image:url('images/blogHomeTitle.png');
}
#blogRecentHome {
	min-height:150px;
	background:url('images/whitePixel.gif') left top repeat-y;
	padding-left:20px;
	overflow:auto;
	line-height:1.4em;
}
#blogRecentHome ul {
	list-style:none;
	margin:0;
}
#blogRecentHome li {
	margin:5px 0;
}
#blogRecentHome small {
	color:#999;
}

#connectWrapperHome .homeSectionTitle {
	width:84px;
	height:21px;
	background-image:url('images/connectHomeTitle.png');
	margin-bottom:5px;
}
#connectWrapperHome .homeSectionList li {
	float:left;
	margin-right:15px;
}
#connectWrapperHome .homeSectionList a {
	height:30px;
	background-position:center -30px;
	border-bottom:none;
}
#connectWrapperHome .homeSectionList a:hover {
	height:30px;
	background-position:center 0;
	border-bottom:none;
}
.cfb {
	background-image:url('images/connect-fb.png');
	width:77px;
}
.ctw {
	background-image:url('images/connect-twitter.png');
	width:74px;
}
.cli {
	background-image:url('images/connect-linkedin.png');
	width:77px;
}
.cpl {
	background-image:url('images/connect-plurk.png');
	width:59px;
}
.cbl {
	background-image:url('images/connect-mybloglog.png');
	width:76px;
}
.csu {
	background-image:url('images/connect-su.png');
	width:23px;
}
.cym {
	background-image:url('images/connect-ym.png');
	width:135px;
}

/* Auxbar */
#auxbarWrapper {
	background:url('images/auxSubtleShadow.png') center top repeat-x;
	padding:30px 0;
}
.homePhoto {
	padding:3px;
	background:#fff;
	float:right;
	margin:20px 0 10px 10px;
	box-shadow:0 1px 3px #aaa;
	-moz-box-shadow:0 1px 3px #aaa;
	-webkit-box-shadow:0 1px 3px #aaa;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}
#auxbarWrapper .homeSectionList a {
	height:46px;
	background-position:center -46px;
	float:left;
	margin-right:15px;
}
#auxbarWrapper .homeSectionList a:hover {
	background-position:center 0;
}
.aff-difu {
	background-image:url('images/aff-difu.png');
	width:100px;
}
.aff-jafiscpr {
	background-image:url('images/aff-jafiscpr.png');
	width:60px;
}
#testimonial {
	background:url('images/blueQuote.png') left top no-repeat;
	padding-left:30px;
	font-style:italic;
}
#testimonial span {
	font-size:.75em;
	font-weight:bold;
	text-transform:uppercase;
	display:block;
	font-style:normal;
}
#testimonial span a {
	color:#333;
	text-decoration:none;
	border-bottom:1px dotted #ccc;
	font-style:normal;
}
#testimonial span a:hover {
	color:#069;
	border-bottom:1px solid #069;
}
#testimonial p a {
	font-style:normal;
}
#affHome {
	margin-left:30px;
}

/* Articles */
.home #mainContentWrapper {
	padding-bottom:80px;
}
#mainContentWrapper {
	position:relative;
	background:url('images/bottomSubtleShadow.png') center bottom no-repeat;
	border-bottom:1px solid #eef3f7;
	padding-bottom:50px;
}
#homeBackground {
	background:url('images/contentWrapperHome-bg.png') center top no-repeat;
	position:absolute;
	height:625px;
	width:100%;
}
#bigLogo {
	background:url('images/bigLogo.png') 350px -40px no-repeat;
	height:625px;
	width:100%;
	position:absolute;
}
#mainContent {
	position:relative;
}

/* Footer */
#footerWrapper {
	background:url('images/footerShadow.png') center top repeat-x;
	padding-top:4px;
	font-family:'Segoe UI',Segoe,Tahoma,Geneva,'Helvetica Neue',Arial,Helvetica,sans-serif !important;
	font-size:small;
}
#footerBack {
	background:#222;
	padding:5px 0;
}
#footer {
	color:#fff;
	text-transform:uppercase;
	font-size:.85em;
}
#footerWrapper #footer a {
	color:#ccc !important;
	text-decoration:none;
}
#footerWrapper #footer a:hover {
	color:#fff !important;
	text-decoration:underline;
}
#footerLink {
	float:right;
}

/* Singles */
.single #mainContent,
.page #mainContent,
.archive #mainContent,
.category #mainContent,
.search #mainContent,
.error404 #mainContent {
	padding-top:80px;
}
.single .post h2,
.page .page h2,
.archive #mainContent h2,
.category #mainContent h2,
.search #mainContent h2,
.error404 #mainContent h2 {
	font-size:3.2em;
	font-weight:normal;
	letter-spacing:-0.05em;
	line-height:1em;
	margin-right:0.5em;
	font-family:'Segoe UI','Helvetica Neue',Arial,Helvetica,sans-serif;
	color:#069;
	text-shadow:0 0 1px #069;
}

/* Comments */
#comments, #pings, #respond h3 {
	background:#069;
	padding:.65em .85em .85em;
	margin:0 0 15px 0;
	box-shadow:0 1px 2px #ccc;
	-moz-box-shadow:0 1px 2px #ccc;
	-webkit-box-shadow:0 1px 2px #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	position:relative;
	color:#fff;
	text-shadow:0 0px 3px #0a384f;
	font-size:1.2em;
}
#comment-Commenttype, #comment-Pingtype, #respond {
	position:relative;
}
.comment-type {
	list-style:none;
	margin:0 0 20px;
	padding:0;
}
.comment-author-avatar {
	float:left;
	margin-right:15px;
	margin-top:4px;
}
.children .comment-author-avatar img {
	width:40px;
	height:40px;
}
.commentContent {
	overflow:auto;
}
.comment-author-cite {
	text-transform:uppercase;
	font-weight:bold;
}
.comment-author-cite a {
	text-decoration:none;
}
.comment-author-cite a:hover {
	text-decoration:underline;
}
.commentBody > p:last-child {
	margin-bottom:0;
}
.comment-meta {
	font-size:.8em;
	text-transform:uppercase;
}
.comment-meta a {
	text-decoration:none;
}
.comment-meta a:hover {
	text-decoration:underline;
}
.comment {
	background:#fff;
	padding:10px 14px;
	margin-bottom:1px;
	box-shadow:0 1px 2px #ccc;
	-moz-box-shadow:0 1px 2px #ccc;
	-webkit-box-shadow:0 1px 2px #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.reply a {
	color:#900 !important;
}
#cancel-comment-reply-link {
	position:absolute;
	top:1.2em;
	left:120px;
	color:#fff;
}
.children {
	list-style:none;
	margin:0 0 0 65px;
	padding:0;
}
.children .comment {
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	padding:10px 0 0;
	margin:10px 0 0;
	border-top:1px dotted #ccc;
}
.ping-type {
	background:#fff;
	padding:1em 3em 1.5em;
	margin:0 0 20px 0;
	box-shadow:0 1px 2px #ccc;
	-moz-box-shadow:0 1px 2px #ccc;
	-webkit-box-shadow:0 1px 2px #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
#commentform {
	background:#fff;
	padding:1.5em ;
	margin:0 0 20px 0;
	box-shadow:0 1px 2px #ccc;
	-moz-box-shadow:0 1px 2px #ccc;
	-webkit-box-shadow:0 1px 2px #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.comment #respond {
	margin-top:15px;
}
.comment #commentform {
	padding:15px 0 0;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
}
#commentform input, #commentform textarea {
	font-family:'Segoe UI',Tahoma,Geneva,'Helvetica Neue',Arial,Helvetica,sans-serif;
}
#commentform label {
	text-transform:uppercase;
	margin-left:5px;
}
textarea#comment {
	width:100%;
}
.downArrow {
	display:block;
	width:32px;
	height:15px;
	position:absolute;
	background:url('images/downArrow.png') center top no-repeat;
	bottom:-15px;
	left:23px;
}
.commentActions {
	position:absolute;
	top:1.2em;
	right:15px;
}
.commentActions a {
	color:#fff !important;
	margin-left:10px;
}
.addComment {
	background:url('images/comment.gif') left 3px no-repeat;
	padding-left:15px;
}
.addTrackback {
	background:url('images/trackback.gif') left 3px no-repeat;
	padding-left:16px;
}
.subscribeComment a {
	background:url('images/feed.gif') left 2px no-repeat;
	padding-left:14px;
}
.awaitModeration {
	color:#900;
	font-size:.85em;
	font-weight:bold;
	text-transform:uppercase;
}
.postmetaItem {
	padding-left:20px;
	margin-bottom:30px;
}
.postmetaItem h4 {
	font-size:1em;
	font-weight:bold;
	display:block;
	margin-bottom:5px;
}
.postmetaItem ul {
	margin:0 0 0 17px;
	padding:0;
}
.postmetaItem li {
	margin-bottom:5px;
	padding-left:3px;
}
#postmetaShare ul {
	list-style:none;
	margin:4px 15px 0 0;
}
#postmetaShare li {
	float:right;
	display:block;
	clear:both;
	margin-bottom:10px;
}
#postmetaData ul {
	list-style:none;
	margin-left:0;
}
#postmetaData li {
	padding-left:20px;
	background-repeat:no-repeat;
}
#postmetaSubscribe ul {
	list-style:none;
	margin-left:0;
}
#postmetaSubscribe li {
	display:inline;
	margin-right:10px;
	padding-left:15px;
	background:url('images/feed.gif') left 5px no-repeat;
}
.postmetaDate {
	background-image:url('images/meta.gif');
	background-position:0 2px;
}
.postmetaCategory {
	background-image:url('images/meta.gif');
	background-position:0 -14px;
}
.postmetaComment {
	background-image:url('images/meta.gif');
	background-position:0 -30px;
}
.postmetaTrackback {
	background-image:url('images/meta.gif');
	background-position:0 -46px;
}
.postmetaPrint {
	background-image:url('images/meta.gif');
	background-position:0 -62px;
}

/* Sidebar */
.half {
	width:50%;
	float:left;
}
.half li {
	padding-right:10px;
}
#sidebarWrapper {
	margin-bottom:-4px;
	padding:15px 0 25px;
	background:#cbddea;
	background:rgba(0, 102, 153, 0.15);
	border-top:1px solid #fff;
	border-top:5px solid rgba(255, 255, 255, 0.25);
}
#sidebar a {
	color:#333;
	border-bottom:1px dotted #8bf;
	text-decoration:none;
}
#sidebar a:hover {
	color:#069;
	border-bottom:1px solid #069;
}

#sidebar h4 {
	font-size:1em;
	font-weight:bold;
	display:block;
	margin-bottom:5px;
}
#sidebar li {
	margin-bottom:5px;
}

.sidebarSplash a, .sidebarContact a {
	color:#069 !important;
}
#sidebar_right .sidebarItem {
	padding-left:20px;
}
.sidebarFollow ul {
	list-style:none;
	margin:0;
	padding-left:0;
}
.sidebarFollow li {
	display:block;
	margin-right:10px;
	padding-left:20px;
	font-size:.8em;
	text-transform:uppercase;
	float:left;
}
.flwTwitter {
	background:url('images/twitter.png') left top no-repeat;
}
.flwFacebook {
	background:url('images/facebook.png') left top no-repeat;
}
.sidebarCategory  ul {
	list-style:none;
	margin:0;
	padding:0;
}
.sidebarPopular ul {
	list-style:disc;
	margin:0 0 0 17px;
}
.sidebarPopular li {
	padding-left:3px;
}

/* Testimonial */
.testimonial_item img.avatar {
	box-shadow:0 1px 1px #ccc;
	-moz-box-shadow:0 1px 1px #ccc;
	-webkit-box-shadow:0 1px 1px #ccc;
	background:#fff;
	float:left;
	margin:2px 10px 0 0;
	padding:3px;
}
.testimonial_item {
	margin-bottom:25px;
}
.testimonial_author {
	font-weight:bold;
}
.testimonial_author small {
	text-transform:uppercase;
}
.testimonial_author a {
	text-decoration:none;
	border-bottom:1px dotted #069;
}

/* 404 */
.error404 #mainContentWrapper {
	background:url('images/404bg.jpg') right -25px no-repeat;
	height:500px;
	min-height:500px;
}
.error404 #homeBackground {
	background:none;
}

/* Form */
#search404Query {
	padding:5px;
	margin-bottom:1.5em;
}

/* Archive */
.postThumb img {
	box-shadow:0 1px 3px #ccc;
	-moz-box-shadow:0 1px 3px #ccc;
	-webkit-box-shadow:0 1px 3px #ccc;
	padding:5px;
	background:#fff;
	float:left;
	margin-right:10px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.archive #mainContent .post,
.archive #mainContent .page,
.search #mainContent .post,
.search #mainContent .page {
	margin-bottom:20px;
}
.archive #mainContent .post h3,
.archive #mainContent .page h3,
.search #mainContent .post h3,
.search #mainContent .page h3 {
	font-size:1.3em;
}
.archive #mainContent .post h3 span,
.search #mainContent .post h3 span {
	font-size:.65em;
}
.archive #mainContent .page h3 span,
.search #mainContent .page h3 span {
	display:none;
}

.smallThumb img {
	box-shadow:0 1px 1px #ccc;
	-moz-box-shadow:0 1px 1px #ccc;
	-webkit-box-shadow:0 1px 1px #ccc;
	padding:1px;
	background:#fff;
	float:left;
	margin-right:8px;
}
.largeThumb img {
	box-shadow:0 1px 1px #ccc;
	-moz-box-shadow:0 1px 1px #ccc;
	-webkit-box-shadow:0 1px 1px #ccc;
	background:#fff;
	float:left;
	margin-right:8px;
}

.inline_icon a {
	background-repeat:no-repeat;
	padding-left:16px;
}
.inline_icon .rss {
	background-image:url('images/feed.gif');
	background-position:2px 5px;
}
.inline_icon .email {
	background-image:url('images/meta.gif');
	background-position:0 -78px;
}
.inline_icon .category {
	background-image:url('images/meta.gif');
	background-position:-2px -14px;
}

.subtitle {
	font-size:1.6em !important;
	text-shadow:none !important;
}
.recent_blog_entries ul {
	list-style:none;
	margin:1.5em 0 0;
	padding:0;
}
.recent_blog_entries h2 {
	display:inline;
	margin-right:0 !important;
}
.recent_blog_entries .inline_icon .rss {
	background-position:3px 5px;
}