/*
Theme Name: Minimalizine
Theme URI: http://hirizh.name/minimalizine-wordpress-theme/
Author: Rizqy Hidayat
Author URI: http://hirizh.name/
Version: 0.4
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Description: Simple and responsive WordPress theme. Clean blogging theme, good for you who wants focused on the content. It supports 3 widget areas above the footer, and 11 social media buttons widget. Also translation ready.
Tags: gray, light, two-columns, custom-menu, featured-images, fixed-width, custom-background, theme-options, threaded-comments, translation-ready
*/

/* ==========================================================
Web symbols regular webfont - OFL, http://www.justbenicestudio.com/studio/websymbols/
============================================================= */
@font-face {
    font-family: 'WebSymbolsRegular';
    src: url('fonts/websymbols-regular-webfont.eot');
    src: url('fonts/websymbols-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/websymbols-regular-webfont.woff') format('woff'),
         url('fonts/websymbols-regular-webfont.ttf') format('truetype'),
         url('fonts/websymbols-regular-webfont.svg#WebSymbolsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ==========================================================
Normalize.css and other global style
============================================================= */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }



/* Text elements */

h3 {
	font-size: 1.3em;
	margin: 2em 0 0.5em;
}
h3:first-child {
	margin-top: 0;
}
h4 {
	margin: 1em 0 0.5em;
}
hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 15px;
}
p {
	margin-bottom: 10px;
}
ul, ol {
	margin-bottom: 20px;
}
ul {
	list-style: disc;
}
ol {
	list-style: decimal;
}
ul ul, ol ol, ul ol, ol ul {
	margin:0;
}
dfn, cite, em, i {
	font-style: italic;
}
blockquote {
	margin: 0 20px 20px;
}
address {
	margin: 0 0 20px;
}
pre {
	background: #f6f6f6;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 85%;
	line-height: 1.5;
	margin-top: 20px;
	margin-bottom: 20px;
	padding: 20px;
	overflow: auto;
	max-width: 100%;
	width: 600px;
	color: #444;
	border-bottom: 1px solid #eee;
}
code {
	font-size: 1.1em;
}
abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}
dl {
	margin: 0 20px;
}
dt {
  font-weight: bold;
}
dd {
  margin-bottom: 10px;
}
input[type=text],
input[type=email],
input[type=password],
textarea {
	padding: 10px 9px;
	background: #fff;
	color: #888;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
textarea:focus {
	color: #111;
}
textarea {
	overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
	padding-left: 3px;
	vertical-align: top; /* Improves readability and alignment in all browsers */
	width: 98%;
}


/* Links */
a {
	color: #0092bf;
	text-decoration: none;
}
a:visited {
	color: #0092bf;
	text-decoration: none;
}
a:hover, a:focus, a:active {
	outline: none;
	text-decoration: underline;
}


/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin: 20px 20px 20px 0;
}
.alignright {
	display: inline;
	float: right;
	margin: 20px 0 20px 20px;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 20px auto ;
}

/* Text meant only for screen readers */
.assistive-text {
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}

/* Media */
img.size-full,
img.size-large,
.header-image img,
img.wp-post-image,
.entry-content img,
.entry-summary img,
.comment-content img,
.widget img {
	max-width: 640px;
}
.widget img,
.widget .wp-caption img {
	max-width: 95.6%;
}
img.size-full,
img.size-large,
.header-image img,
.comment-content img,
img.wp-post-image,
img[class*="align"],
img[class*="wp-image-"],
img[class*="attachment-"] {
	height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
img.size-large {
	margin: 0 -20px;
	max-width: 680px;
}
.post-thumbnail img {
	max-width: 97.6%;
	height: auto;
}
.entry-content img.wp-smiley,
.comment-content img.wp-smiley,
.widget img.wp-smiley {
	background: transparent;
	border: none;
	display: inline-block;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
}
.wp-caption {
	max-width: 100%;
	padding: 20px 0 10px;
}
.wp-caption.aligncenter,
.wp-caption.alignleft,
.wp-caption.alignright {
	margin-top: 20px;
	margin-bottom: 20px;
}
.wp-caption img {
	display: block;
	margin: 0;
	border-bottom: 4px solid #0092bf;
	position: relative;
}
.wp-caption-text {
	font-style: italic;
	font-size: 0.85em;
	text-align: left;
}
.wp-caption .wp-caption-text::before {
	content: '';
    display: block;
    border-top: 8px solid #0092bf;
    border-left: 8px solid rgba(0,0,0,0);
    border-right: 8px solid rgba(0,0,0,0);
    width: 0;
    margin: -10px 10px 10px;
   }
.wp-caption .wp-caption-text {
	margin: 10px 0;
}

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}

/* 	GALLERY
	----------------- */
.gallery, .tiled-gallery {
	margin-bottom: 1.8em;
}
.gallery .gallery-item {
	margin:0
}
.gallery-caption {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	clear: both;
	font-size: 12px;
	display: block;
	margin: 20px 0;
	padding: 5px 0;
	text-align: center;
	width: 100%;
}
.gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.gallery-columns-4 a img {
	max-width: 84%;
}
.gallery-columns-5 a img {
	max-width: 82%;
}
.gallery-columns-6 a img {
	max-width: 78%;
}
.gallery-columns-7 a img {
	max-width: 76%;
}
.gallery-columns-8 a img {
	max-width: 74%;
}
.gallery-columns-9 a img {
	max-width: 72%;
}
.gallery-columns-4 .gallery-item {
}
.gallery-columns-4 .gallery-item img {
}

/* ==========================================================
Main theme style
============================================================= */

#primary {
	padding-bottom: 40px
} 
.side {
	position: absolute;
	width: 180px;
	box-sizing: border-box;
}
.wide {
	margin-left: 220px;
	box-sizing: border-box;
}



/* The posts
------------------------------------------------------------- */
.hentry {
	position: relative;
	margin: 0 0 40px;
}
.hentry:before,
.hentry:after {
	content: "";
	display: table;
}
.hentry:after {
	clear: both;
}
.entry-meta {
	font-size: 0.75em;
	background: #eee;
	padding: 6px 10px;
}
.entry-meta::before {
	position: absolute;
	display: block;
	content: '';
	top: 20px;
	right: -16px;
	border: 16px solid rgba(0,0,0,0);
	border-right: none;
	border-left: 16px solid #eee;
}
.entry-meta span {
	display: block;
	margin-top: 8px;
	margin-bottom: 8px;
}
.entry-meta span:before {
	margin-right:5px;
	display: inline-block;
	width: 20px;
	font-family: 'WebSymbolsRegular', cursive;
	color: #aaa;
	text-align: right;
}
.entry-meta .posted-on:before {
	content:'P';
}
.entry-meta .comments-link:before {
	content:'e';
}
.entry-meta .cat-links:before {
	content:'F';
}
.entry-meta .tags-links:before {
	content:',';
}
.entry-meta .edit-link:before {
	content:'J';
}
.entry-meta .download-link:before {
	content:'I';
}
.entry-meta .gallery-link:before {
	content:'¹';
}
.entry-title {
	font-size: 2.6em;
}
.entry-title a {
}
.entry-thumbnail {
	height: 300px;
	background-position: center center;
	background-size: cover;
	border-bottom: 16px solid #fff;
}
.entry-header {
	background: #fff;
	padding: 20px 20px 10px;
}
.entry-content, .entry-summary {
	background: #fff;
	line-height:1.7em;
	font-size: 0.8em;
	padding: 0 20px 10px;
}
.format-image .entry-content {
	position: relative;
}
.format-image .entry-content::before {
	position: absolute;
	content: '';
	display: 'block';
	top: -32px;
	left: 16px;
	border: 20px #fff solid;
	border-top: none;
	border-left: 20px solid rgba(0,0,0,0);
	border-right: 20px solid rgba(0,0,0,0);
}

.entry-thumbnail a:hover {
	box-shadow: 0 0 5px #333
}
.hentry table {
	font-size: 0.9em;
	margin: 1.5em 0 2em;
}


/* Page navigation
------------------------------------------------------- */
#page-nav {
	margin-bottom: 20px;
}
#page-nav ul {
	margin:0;
	list-style-type:none;
	padding: 10px 0;
}
#page-nav li {
	display:inline;
	font-size: 0.8em;
}
#page-nav li a {
	padding:5px 10px;
	background:#fff;
}
#page-nav li .dots {
	padding:5px 10px;
}
#page-nav li a:hover, #page-nav li .current {
	padding:5px 10px;
	background:#0092bf;
	color:#fff;
	text-shadow:none;
	text-decoration: none;	
}
.single #page-nav {
	overflow:hidden;
	padding: 10px 0;
}
.single #page-nav span {
	width:250px;
	max-width: 50%;
	line-height:1.5em
}
.single #page-nav .next-post {
	float:left
}
.single #page-nav .prev-post {
	float:right;
	text-align:right
}
#post-pages {
	margin:20px 0 0;
	padding: 10px 0;
	border-top:1px solid #ddd;
	text-align:center
}
#post-pages a {
	margin:0 5px
}
#attachment-nav {
	clear:both
}
#attachment-nav a {
	display: inline-block;
	margin: 0 10px 10px 0;
}
#attachment-nav img {
	max-width: 94.6px;
	padding:0;
	border:none;
	background:none
}
#attachment-nav a:nth-of-type(5n) {
	margin: 0 0 10px 0;
}

/* =Post Formats
----------------------------------------------- */

.entry-meta .post-format {
	text-transform: capitalize;
}
.format-aside .entry-meta .post-format:before {
	content:'d';
}
.format-image .entry-meta .post-format:before {
	content:'I';
}
.format-video .entry-meta .post-format:before {
	content:'M';
}
.format-quote .entry-meta .post-format:before {
	content:'\201C';
	font-family: Times, "Times New Roman", sans-serif;
	font-size: 28px;
	line-height: 1;
}
.format-quote .entry-content blockquote {
	font-size: 20px;
	line-height:1.8em
}
.format-link .entry-content {
	margin-top: 0;
}
.format-link .entry-meta .post-format:before {
	content:'K';
}
.format-link .entry-title,
.format-link .cat-links {
	display: none !important;
}

.format-aside .entry-title {
	font-size: 2em;
}
.format-aside .entry-content {
	-moz-column-count: 2;
	-moz-column-gap: 16px;
	-webkit-column-count: 2;
	-webkit-column-gap: 16px;
	column-count: 2;
	column-gap: 16px;
	
	font-size: 0.75em;
	line-height: 165%;
}

	
/* Comments
------------------------------------------------------- */
#comments {
	overflow:hidden;
	margin: 20px 0;
}
#comments .comments-title {
	display: none;
}
#comments .comments-title span {
	color:#0092bf
}
.nopassword, .nocomments {
	margin: 26px 0;
}
.commentlist {
	list-style: none;
	margin-top: 20px;
	padding:0
}
.commentlist > li.comment {
	position:relative;
	overflow:hidden;
}
.commentlist article {
	overflow: hidden;
	position: relative;
	margin:0 0 20px;
	padding:0 0 20px;
}
.commentlist .pingback {
	margin: 0 0 20px;
	padding:0 0 20px;
}
.commentlist .pingback p {
	margin:0
}
.commentlist .children {
	list-style: none;
	padding:0;
	margin:20px 0 0 60px;
}

.comment-avatar {
	position: absolute;
	top: 0;
	left: 0;
	width:50px;
}
.comment-block {
	position: relative;
	padding: 20px;
	background: #fff;
	font-size: 0.8em;
	margin-left: 80px;
}
.comment-block::before {
	display: block;
	content: '';
	position: absolute;
	top: 12px;
	left: -16px;
	border: 16px solid rgba(0,0,0,0);
	border-left: none;
	border-right: 16px solid #fff;
}
.depth-2 .comment-block {
	width:400px
}
.depth-3 .comment-block {
	width:340px
}
.depth-4 .comment-block {
	width:280px
}
.depth-4 .comment-block {
	width:220px
}
.comment-meta {
	margin:0 0 15px;
}
.comment-author {
	color:#444;
	font-weight:bold
}
.comment-author a {
	color:#444
}
.comment-date, .comment-edit-link {
}
.comment .comment-content {
	line-height:1.7em
}
/* Post author highlighting */
.commentlist > li.bypostauthor {

}
.commentlist > li.bypostauthor .comment-header {

}

/* Comment nav */
#comments-nav {
	overflow:hidden;
	padding: 10px 0;
	margin-bottom:20px;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}
#comments-nav span {
	width:200px;
	line-height:1.5em
}
#comments-nav .prev-comment {
	float:left;
}
#comments-nav .next-comment {
	float:right;
	text-align:right
}

/* Comment Form */
#respond {
	position: relative;
}
#respond #reply-title {
	display: none;
	margin:0;
	position:absolute;
	left: 0px;
	top:0;
	width:160px;
	padding-top:25px;
	background:url(images/line-pattern.png) repeat-x
}
#respond .comment-form {
	box-sizing: border-box;
	margin-left: 220px;
	
	background: #eee;
	padding: 20px 20px 10px 20px;
}

#respond input[type="text"], #respond textarea {
	border: none;
	padding: 10px;
	font-size:13px;
	color:#666
}
#respond input[type="text"]:focus, #respond textarea:focus {
	border-color:#0092bf
}
#respond textarea {
	width: 100%;
	resize: vertical;
}
#respond input[type=text] {
	display: block;
	width: 60%;
}
#respond input#submit {
	background: #0092bf;
	border: none;
	color: #fff;
	cursor: pointer;
	font-size: 13px;
	padding: 8px 22px;
	margin-top: 6px;
}
#respond input#submit:active {
	background: #444;
}
#respond label {
	position:absolute;
	left:60%;
	top:10px;
	text-indent: 10px;
}
#respond label[for=comment], #respond .required {
	display:none
}

#respond .comment-notes, #respond .logged-in-as {
	font-size: 13px;
	margin-bottom: 20px;
}
#respond p {
	margin:0 0 10px;
	position:relative
}
#respond #cancel-comment-reply-link {
	position:absolute;
	right:0;
	top:0;
	text-decoration: none;
	color: #888;
	display: block;
	font-size: 10px;
	font-weight: normal;
	line-height: 2.2em;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

#respond .logged-in-as a:hover, #respond #cancel-comment-reply-link:hover {
	text-decoration: underline;
}
.commentlist #respond {
	margin: 20px 0 20px 60px;
}
.commentlist #respond #reply-title {
	position:relative;
	left:0;
	top:0;
	width:auto;
	padding-top:0;
	margin:0 0 10px;
	background:none;
	display: none;
}
#respond p {
	font-size: 12px;
}
p.comment-form-comment {
	margin: 0;
}
.form-allowed-tags {
	display: none;
}

/* Footer sidebar
------------------------------------------------------------- */
#sidebar {
	overflow:hidden;
	margin:30px 0;
}
.widget-left, .widget-middle, .widget-right {
	width:220px;
	margin-right:30px;
	float:left
}
.widget-right {
	margin-right:0
}
.widget {
	margin-bottom:40px;
}
.widget-title {
	margin:0 0 20px;
	font-size:16px;
}
.widget ul {
	margin:0;
	padding:0;
	list-style-type:none;
}
.widget ul ul {
	padding-top: 10px;
	padding-left: 20px;
}
.widget ul li {
	padding-top: 15px;
	padding-bottom: 15px;
	border-top: 1px solid #ddd;
}
.widget ul li:last-of-type {
	padding-bottom: 0;
}
.widget #wp-calendar {
	width: 100%;
}
.widget #wp-calendar caption {
	margin: 0;
	text-transform: uppercase;
}
.widget #wp-calendar th {
	padding: 5px 10px 5px 0;
	color: #0092bf;
	text-transform: uppercase;
	text-align: center;
}
.widget #wp-calendar td {
	border-top: 1px solid #ddd;
	padding: 5px 10px 5px 0;
	text-align: center;
}
.widget #wp-calendar td#prev {
	text-align: left;
}
.widget #wp-calendar td#next {
	text-align: right;
}

/* Search form
------------------------------------------------------------- */
#searchform #s {
	width: 130px;
	padding: 9px;
	border: 1px solid #eee;
	background: #fff;
	color: #888;
	font-style: italic;
}
#searchform #s:focus {
	border-color: #ccc;
	color: #444;
}
#searchform #submit {
	background: #0092bf;
	border: none;
	color: #fff;
	padding: 9px;
}
#searchform #submit:focus {
	background: #666;
}

/* Social button
------------------------------------------------------------- */
#social-button {
	margin:0;
	padding:0;
	list-style-type:none;
	overflow:hidden
}
#social-button li {
	padding:0;
	border:none
}
#button-twitter, #button-fb, #button-gplus, #button-flickr, #button-linkedin, #button-pinterest, #button-dribbble, #button-github, #button-vimeo, #button-forrst, #button-zerply {
	width:32px;
	height:32px;
	margin:0 5px 5px 0;
	float:left;
}
#button-twitter {
	background:url(images/icons/twitter.png)
}
#button-fb {
	background:url(images/icons/facebook.png)
}
#button-gplus {
	background:url(images/icons/g+.png)
}
#button-flickr {
	background:url(images/icons/flickr.png)
}
#button-linkedin {
	background:url(images/icons/linkedin.png)
}
#button-pinterest {
	background:url(images/icons/pinterest.png)
}
#button-dribbble {
	background:url(images/icons/dribbble.png)
}
#button-github {
	background:url(images/icons/github.png)
}
#button-vimeo {
	background:url(images/icons/vimeo.png)
}
#button-forrst {
	background:url(images/icons/forrst.png)
}
#button-zerply {
	background:url(images/icons/zerply.png)
}

/* Footer
------------------------------------------------------------- */
#colophon {
	overflow:hidden;
	border-top:2px solid #ddd;
	line-height:1.5em
}
#colophon .site-info {
	width:330px;
	float:left
}
#colophon .credits {
	width:330px;
	float:right;
	text-align:right
}


/* ==========================================================
Usefull CSS helper
============================================================= */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* ==========================================================
Responsive-ness
============================================================= */
/* Mobile (landscape)
   Note: Design for a width of 480px
------------------------------------------------------------- */


@media (max-width: 680px) {
	.hentry {
		padding-bottom: 30px;
	}
	
	.side {
		position: absolute;
		bottom: 0;
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	.side span {
		display: inline-block;
		margin: 0 8px 0px 0;
	}
	.side span.comments-link {
		display: none;
	}
	
	.wide {
		margin: 0;
	}

	.entry-meta {
		padding: 10px;
		z-index: 1;
	}

	.entry-thumbnail {
		height: 180px;
	}

	.format-aside .entry-content {
		-moz-column-count: 1;
		-webkit-column-count: 1;
		column-count: 1;
	}

	#respond .comment-form {
		margin-left: 0;
	}
}

@media (max-width: 432px) {
	.entry-thumbnail {
		height: 150px;
	}
}


.alignnone {
	margin: 10px 0;
}