/*
Theme Name: Art Blogazine
Description: Simple and minimalist theme with HTML5 markup. You can create unique post like a magazine style, this theme also responsive design.
Theme URI: http://amdhas.tk/project/artblogazine.html
Author: Hendro Prayitno
Author URI: http://amdhas.tk
Version: 1.0.1
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, one-column, flexible-width, threaded-comments, custom-menu, custom-background, theme-options, translation-ready
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td 
{
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
}
body:before,body:after{ content:""; display:table}
body:after{ clear:both}
img,
object,
embed{max-width:100%}
img{height:auto}
#container{
width:100%;
margin:0;
overflow:hidden
}
body{
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Arial, sans-serif;
width:100%;
}
/* =================================================
 Need Style for table layout
================================================= */
table th {color: #222;}
table td, 
table th {
	padding: 3px 6px;
	font-size: 12px;
}
table
{
	border-collapse: collapse;
	border-spacing: 0;
	margin-bottom: 10px;
	border: 1px solid #333;
}
/* =================================================
 CSS font face
================================================= */
@font-face {
	font-family: 'Chunkfive';
	src: url('font/Chunkfive.eot');
	src: local('☺'), url('font/Chunkfive.woff') format('woff'), 
        url('font/Chunkfive.ttf') format('truetype'), 
        url('font/Chunkfive.svg#webfontB9LMdHvb') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* =================================================
 Global settings
================================================= */
#s{width:65%;}
#searchform{margin-bottom:20px;}
.submit {width:23%;}
#searchsubmit{
cursor:pointer;
color:#222;

}
#searchsubmit:hover{background:#ccf111;}
ol{margin-left:20px}
ul{margin-left:10px}
ol,ul{margin-bottom:7px;}
dl {margin: 0 1.625em;}
dt {font-weight: bold;}
dd {margin-bottom: 1.625em;}
strong {font-weight: bold;}
cite, 
em, 
i {font-style: italic;}
blockquote {font-family: Georgia, "Bitstream Charter", serif;font-style: italic;
font-weight: normal;margin: 2em 2.2em;line-height:1.4em;}
blockquote em, 
blockquote i, 
blockquote cite {font-style: normal;}
blockquote cite {
color: #666;font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight: 300;letter-spacing: 0.05em;text-transform: uppercase;}
pre {background:#ffffe0;
font: 13px "Courier 10 Pitch", Courier, monospace;line-height: 1.5;margin-bottom: 1.625em;overflow: auto;padding: 0.75em 1.625em;border-left:5px solid #298cba;}
code, 
kbd {font: 13px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;}
abbr, 
acronym, 
dfn {border-bottom: 1px dotted #666;cursor: help;}
address {display: block;margin: 0 0 1.625em;}
ins {background: #fff9c0;text-decoration: none;}
sup,
sub {font-size: 10px;height: 0;line-height: 1;position: relative;vertical-align: baseline;}
sup {bottom: 1ex;}
sub {top: .5ex;}
.alignleft {display: inline;float: left;margin-right: 1.625em;}
.alignright {display: inline;float: right;margin-left: 1.625em;}
.aligncenter {clear: both;display:inline-block;margin-left: auto;
margin-right: auto;
margin-bottom:0;
}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before,
q:before{content:'"';font-size:4em;float:left;text-align:right;}
blockquote, q {quotes: "" "";}
a img {border: 0;}
article, 
aside, 
details, 
figcaption, 
figure,
footer, 
header, 
hgroup, 
menu, 
nav, 
section {display: block;}
.sumary ol,
.sumary ul{margin-left:1.0888em}
p{
margin-bottom:15px;
}
a{
color:#a00;
text-decoration:none}
a:visited{color:#456;text-decoration:none}
a:hover{text-decoration:none;color:#f00}
.info-blog{text-align:left;
background:rgba(82%,82%,82%,.4);
padding:5px;
}
.ekserp{color:#333;border-top:2px solid #999;
padding-top:8px;
margin-top:4px;
font-size:82%;
}
.content-post{
color:#222;
font-size:82%;
}
.content-post ul, .content-post ol{margin-left:30px;}
.sumary{line-height:1.3em;
width:65%;
padding-left:20px;
padding-right:20px;
margin-top:20px;
float:left;
display:inline;
}
.home-content{line-height:1.3em;
width:78%;
padding-left:20px;
padding-right:20px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
}
.sticky{ color:red;}
.form-allowed-tags{font-size:70%;}
.tag-links{margin-bottom:10px;font-size:90%;}
.tagged{overflow:auto;
padding:10px;}
/* =================================================
 Need Style for widget calendar 
================================================= */
#calendar_wrap {background: #f6f6f6;
color:black;padding:10px;border-radius:5px;}
#wp-calendar{width:100%;
clear:both;}
#wp-calendar a {}
#wp-calendar #today {}
#wp-calendar #prev {}
#wp-calendar #next {}
#wp-calendar #next a {}
#wp-calendar #prev a {}
#wp-calendar {}
#wp-calendar caption{text-align:left;
font-size:1.3em;font-weight:bold;
margin-left:5px;}
#wp-calendar td,
#wp-calendar th {text-align: center;}
#wp-calendar caption {
font-size: 11px;font-weight: 500;
padding: 5px 0 3px 0;
text-transform: uppercase;
}
#wp-calendar th {
background: #f4f4f4;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;font-weight: bold;
}
#wp-calendar td {
background: #f4f4f4;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

/* =================================================
 Navigation top menu or primary menu
================================================= */
#navmenu{font-family: 'Chunkfive';
	background:#FFBE5D;
	
	-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	-moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
	clear: both;
	display: block;
	float: left;
	margin: 0 auto;
	width: 100%;
}
#navmenu ul {
	font-size: 13px;
	list-style: none;
	margin: 0 0 0 -0.8125em;
	padding-left: 0;
}
#navmenu li {
	float: left;
	position: relative;
}
#navmenu a {
        border-right:1px solid #999;
        text-transform:uppercase;
	color: #777;
	display: block;
	line-height: 3.333em;
	padding: 0 1.4125em;
	text-decoration: none;
}
#navmenu ul ul {
	-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	display:none;
	float: left;
	margin: 0;
	position: absolute;
	top: 3.333em;
	left: 0;
	width: 188px;
	z-index: 99999;
}
#navmenu ul ul ul {
	left: 100%;
	top: 0;
}
#navmenu ul ul a {border-right:none;
	background: #f9f9f9;
	border-bottom: 1px dotted #ddd;
	color: #999;
	font-size: 13px;
	font-weight: normal;
	height: auto;
	line-height: 1.4em;
	padding: 10px 15px;
	width: 168px;
}
#navmenu li:hover > a,
#navmenu ul ul :hover > a,
#navmenua:focus {
	background: #efefef;
}
#navmenu li:hover > a,
#navmenu a:focus {
	background: #f9f9f9;
	background: -moz-linear-gradient(#f9f9f9, #e5e5e5);
	background: -o-linear-gradient(#f9f9f9, #e5e5e5);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */
	background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
	color: #373737;
}
#navmenu ul li:hover > ul {
	display: block;
}
#navmenu.current_page_item > a,
#navmenu.current_page_ancestor > a {
	font-weight: bold;
}


/* =================================================
 Author setting
================================================= */
#authorarea{display:inline;float:left;
width:29%;
background: #f0f0f0;
padding: 10px;
overflow:hidden;
color: #333;
margin-bottom:15px;
box-shadow:1px 1px 3px #999;}
#authorarea h3{font-size: 18px;color:#333;margin:0;padding:10px 10px 5px 15px;}
#authorarea h3 a{text-decoration:none;color: #333;font-weight: bold;}
#authorarea img{margin-top:12px;padding:10px;float:left;border: 1px solid #ddd;width: 100px;height: 100px;max-width:100%;}
#authorarea p{font-size:82%;color:#333;margin:0;padding:0px 10px 10px 15px;word-wrap:break-word}
#authorarea p a:link{color:#f00;}
#authorarea p a:hover{color:#900;}
.authorinfo{padding-left:120px;}
/* =================================================
 Caption and image
================================================= */
.wp-caption {margin-top: 0.4em;}
.wp-caption {
	background: #f4f4f4;
	margin-bottom: 1.625em;
	max-width: 96%;
	padding: 9px;
}
.wp-caption img {
	display: block;
	margin: 0 auto;
	max-width: 98%;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	color: #666;
	font-family: Georgia, serif;
	font-size: 12px;
}
.wp-caption .wp-caption-text {
	margin-bottom: 0.6em;
	padding: 10px 0 5px 0;
	position: relative;
}
.wp-caption .wp-caption-text:before {
	color: #666;
	content: '';
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	margin-right: 5px;
	position: absolute;
	
}
.format-gallery .gallery-thumb {float: left;display: block;margin: .375em 1.625em 0 0;}
.gallery { margin: 0 auto 18px; }
.gallery .gallery-item {float: left;margin-top: 0;text-align: center;width: 33%;}
.gallery-columns-2 .gallery-item { width: 50%; }
.gallery-columns-4 .gallery-item { width: 25%; }
.gallery img {box-shadow: 0px 0px 4px #999;border: 1px solid white;padding: 8px;background: #f2f2f2;
}
.gallery img:hover {background: white;}
.gallery-columns-2 .attachment-medium {max-width: 92%;height: auto;}
.gallery-columns-4 .attachment-thumbnail {max-width: 84%;height: auto;}
.gallery .gallery-caption {color: #888;font-size: 12px;margin: 0 0 12px;}
.gallery dl, .gallery dt { margin: 0; }
.gallery br+br { display: none; }

/* =================================================
 Comment settings
================================================= */
#comm{width:100%;background:#f9f9f9;}
.komentar{ color: #222;
padding-bottom:15px;
*width:68%;
width:98%;
margin-left:auto;
margin-right:auto;
padding-top:15px;
}
#respond{width:62%;
margin-left:auto;
margin-right:auto;}
#respond input[type=text] {float: left;margin-right:10px;}
#respond .comment-form-comment {margin: 0;}
input,
select,
textarea {font-size: 100%;margin: 0;vertical-align: baseline; 
*vertical-align: middle;background: #f3f3f3;border: 1px solid #dcdcdc;
box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);-webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);padding:6px;
}
input:focus,
select:focus,
textarea:focus {background:#fff;}
button,
input {line-height: normal;*overflow: visible;}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
border: 1px solid #ccc;border-color: #ccc #ccc #bbb #ccc;border-radius: 3px;
        background: #fafafa;
        background: -moz-linear-gradient(top,  #fafafa 60%, #e6e6e6 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(60%,#fafafa), color-stop(100%,#e6e6e6));
	background: -webkit-linear-gradient(top,  #fafafa 60%,#e6e6e6 100%);
	background: -o-linear-gradient(top,  #fafafa 60%,#e6e6e6 100%);
	background: -ms-linear-gradient(top,  #fafafa 60%,#e6e6e6 100%);
	background: linear-gradient(top,  #fafafa 60%,#e6e6e6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#e6e6e6',GradientType=0 );box-shadow: inset 0 2px 1px #fff;color: rgba(0,0,0,.8);cursor: pointer;-webkit-appearance: button;font-size:1em;line-height:2;padding:5px;text-shadow: 0 1px 0 rgba(255,255,255,.5);
}
button:hover,
html input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {background: #f5f5f5;background: -moz-linear-gradient(top,  #f5f5f5 60%, #dcdcdc 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(60%,#f5f5f5), color-stop(100%,#dcdcdc));background: -webkit-linear-gradient(top,  #f5f5f5 60%,#dcdcdc 100%);background: -o-linear-gradient(top,  #f5f5f5 60%,#dcdcdc 100%);background: -ms-linear-gradient(top,  #f5f5f5 60%,#dcdcdc 100%);background: linear-gradient(top,  #f5f5f5 60%,#dcdcdc 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#dcdcdc',GradientType=0 );border-color: #bbb #bbb #aaa #bbb;
}
button:focus,
html input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
html input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {border-color: #aaa #bbb #bbb #bbb;box-shadow: inset 0 2px 3px rgba(0,0,0,.15);box-shadow: inset 0 2px 2px rgba(0,0,0,.15);
}
input[type="checkbox"],
input[type="radio"] {box-sizing: border-box;padding: 0;
}
input[type="search"] {-webkit-appearance: textfield;-moz-box-sizing: content-box;-webkit-box-sizing: content-box;box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner { border: 0;padding: 0;
}
input[type=text],
textarea {color: #666;border: 1px solid #ccc;border-radius: 3px;
}
input[type=text]:focus,
textarea:focus {color: #111;
}
input[type=text] {padding: 3px;
}
textarea {overflow: auto;padding-left: 3px;vertical-align: top; width: 95%;
}
.comments {padding: 0;}
.comments .respond {padding: 30px;}
.comments h3 {
margin-top: 30px;
margin-right:30px;
margin-bottom: 15px;
margin-left:15px; color: #b80f07; font: normal 1.571em/1em "Georgia",sans-serif; text-transform: uppercase;}
.commentlist > li.bypostauthor .comment-meta {}
.commentlist > li.bypostauthor .comment-meta a:focus,
.commentlist > li.bypostauthor .comment-meta a:active,
.commentlist > li.bypostauthor .comment-meta a:hover {}
.commentlist > li.bypostauthor:before {}
.commentlist .children > li.bypostauthor {background:;}
.commentlist {list-style: none; margin: 0;}
.commentlist>li {overflow: hidden; margin: 0; 
padding-top: 30px;
padding-right: 30px;
padding-left:15px; 
border-bottom: 1px solid #e5e5e5; }
.commentlist>li img.avatar {float: left; margin-right: 30px; border: none;}
.commentlist>li .comment-author cite {font-style: normal; font-size: 1.286em;}
.commentlist>li .says {color: #444; font-style: italic;}
.commentlist>li .comment-meta { font-size: 0.714em; font-family: "Georgia",sans-serif;}
.commentlist>li .comment-meta a {font-family: "Georgia",sans-serif;}
.commentlist>li p {
margin-top: 1em;
margin-right: 0;
margin-bottom: 1em;
margin-left: 60px; 
font-size: 0.929em; font-family: Arial,sans-serif;}
.commentlist>li ul.children {clear: both; margin-left: 60px; padding: 0;}
.commentlist>li ul.children li {overflow: hidden; 
margin: 0 0 -1px; 
padding-top: 30px;
padding-right:30px;
padding-bottom: 15px;
padding-left:15px; border: 1px solid #e5e5e5;}
.reply {float: right;clear:both;margin-bottom:.98em;}
.reply a {font-size: 0.714em; 
font-family: "Georgia",sans-serif;padding:5px;
border: 1px solid #e5e5e5;

}

li.pingback, li.trackback {
position:relative; 
border-left:1px solid #aaa; 
margin:.75em 0 3.5em 7.5em; 
padding-left:1.25em; 
min-height:3.75em;
list-style:none;
}
.nocomments{text-align:center;font-style:italic;font-size:1.5em;padding-top:15px}
/* =================================================
 Navigation page
================================================= */
.navigation{
overflow:hidden;
width:100%;
margin-bottom:-2px;
border-top:solid 2px #ddd;
border-bottom:2px solid #ddd;
margin:0;
padding:0;
}
.navigation a{
padding-top:10px;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
color:#777;
display:inline-block;
text-decoration:none;}
.navigation a:hover{color:#f00;}
#nav-below{margin-top:0;}
.nav-previous{
font-size:1.1em;
float:left;
margin-right:20px;
border-right:2px solid #ddd;}
.nav-next{font-size:1.1em;
float:right;border-left:2px solid #ddd;}
.meta-prev{font-size:.80em;float:left;
margin-right:20px;
border-right:2px solid #ddd;
}
.meta-next{font-size:.80em;float:right;border-left:2px solid #ddd;}
/* =================================================
 Header settings and Title
================================================= */
h1 { font: 170% sans-serif}
h2 { font: 140% sans-serif}
h3 { font: 120% sans-serif}
h4 { font: bold 100% sans-serif}
h5 { font: italic 100% sans-serif}
h6 { font: small-caps 100% sans-serif}
.header{
padding-top:15px;
margin:0;
border-bottom: 1px solid #ddd;
}

.title-blog h1{
padding-left:15px;
font-size:2.5em;
font-family: 'Chunkfive';
text-transform:uppercase;
color:#888;
}
.title-blog-single h2{
padding-right:15px;
margin:0;
font-size:1em;
font-family: 'Chunkfive';
text-transform:uppercase;
color:#999;
float:right;
display:inline;
}
.header a:hover{color:#f00;}
.description{
font-size:14px;
padding-left:15px;
margin-top:-5px;
color:;}
.eror{text-align:center;margin-top:5%;padding-bottom:15px;font-family: 'Chunkfive';}
.eror h1{color:#000;font-size:36px;}
.eror h2{color:#000;font-size:21px;}
.title-post a{
color:#999;
font-family: 'Chunkfive';
margin:0;
font-size:1.3em;
text-transform:uppercase;
float:left;
display:inline;
padding-left:15px;}
.title-post a:hover {color:#ffbe5d;}
.font-small{font-size:11px;margin-bottom:0;
margin-left:auto;
margin-right:auto;
height:30px;
overflow:auto;
width:60.25%
}
.post-info{font-size:11px;margin:0;}
.post-info-single{font-size:11px;margin:0;
padding-left:15px;}
.title a{color:#999;
font-size:1.1em;
text-transform:uppercase;font-family: 'Chunkfive';}
.title a:hover {color:#900;}
.published{font-size:10px;}
h1.page-title{font-size:3em;font-style:italic;}
/* =================================================
 Clear your grid element
================================================= */
.clear{
clear:both;
display:block;
overflow:hidden;
margin-bottom:20px;
}
.clearfix{
clear:both;
display:block;
overflow:hidden;

}
/* =================================================
 Footer and sidebar settings
================================================= */
.side-footer{
display:inline; 
float:left; 
margin:0 1.0416666666666665%;
width:31.25%}
.footer{
text-align:right;
font-size:12px;
color:#fff;
padding:18px 20px 15px 8px;margin:0;
}
.footer a{color:#fff}
.sidebar ul{margin-bottom:10px;}
.sidebar ul li{
padding-left:10px;
padding-bottom:5px;
padding-top:5px;
list-style:none;
font-size:1em;
border-bottom-style:solid;
border-bottom-width:1px;
border-bottom-color:#c0c0c0;}
.sidebar ul li:hover{color:#fff}
.sidebar ul li p{font-size:0.8em;}
.sidebar ul li a{font-size:0.8em;color:#999}
.sidebar ul li a:hover{color:#f4f4f4;
text-decoration:none;
}
.sidebar ul:last-child{border-style:none}
.sidebar h3{
font-family: 'Chunkfive';
margin-top:15px;
color:#ffbe5d;
font-size:130%;
text-transform:uppercase;padding:8px 0 8px 10px;
}
.below{padding-top:15px;
padding-bottom:15px;
        background: #234;
}
.social{
        padding-top:10px;
        background: #234;
        border-top:solid 1px #c0c0c0;
}
.icons {
	list-style:none;
	line-height:normal;
	margin:12px 0 12px 15px;
	text-align:left;

}

.twitter,
.youtube,  
.facebook, 
.linkedin,
.rss,
.google,
.stumble,
.blogger,
.deviantart,
.delicious {
	display: inline;
	float:left;
	margin: 2px;
	padding-left: 3px;
	
}
/* =================================================
 CSS media query on 767px
================================================= */
@media screen and (max-width:767px)
{ 
body{background:white;color:black}
#authorarea,
.side-footer, 
.sumary, 
.title-blog,
.form-comment,
.home-content
{ 
display:inline; 
float:left; 
width:97.91666666666666%; 
margin:0 auto; 
}
.commentlist>li ul.children {clear: both; margin-left: 0px; padding: 0;}
.commentlist>li ul.children li {
overflow: hidden; margin: 0 0 -1px; 
padding: 0px 0px 0px; 
border: 1px solid #e5e5e5;}
.commentlist>li {overflow: hidden; margin: 0; 
padding: 0px 0px 0px; border-bottom: 1px solid #e5e5e5; }
.commentlist>li img.avatar{display:none;}
.ekserp{
padding-left:1em;
padding-right:1em;
padding-top:8px;
}
.title-blog h1{
padding-left:0;text-align:center;
font-size:2em;
word-wrap:break-word;}
.description{padding-left:5px;text-align:center;}
.sumary{padding-left:0;
padding-right:0;}
.title a, 
.header h1 a{font-size:1.1em;margin-bottom:5px;
text-align:center}
.header{position:relative;border-bottom:none;
box-shadow:none;}
}