MINI MINI MANI MO

Path : /home/phaetpan/domains/phaetpanya.com/public_html/css/imports/
File Upload :
Current File : /home/phaetpan/domains/phaetpanya.com/public_html/css/imports/blog.css

/* ----------------------------------------------------------------

	blog.css

-----------------------------------------------------------------*/


/* ----------------------------------------------------------------
	Blog
-----------------------------------------------------------------*/


#posts { position: relative; }

.entry {
	position: relative;
	margin: 0 0 50px;
	padding: 0 0 50px;
	border-bottom: 2px solid #F5F5F5;
}

.entry-image { margin-bottom: 30px; }

.entry-image,
.entry-image > a,
.entry-image .slide a,
.entry-image img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}

.entry-image iframe { display: block; }

.entry-image img { border-radius: 3px; }

.entry-title h2 {
	margin: 0;
	font-size: 24px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.entry-title h2 a { color: #333; }

.entry-title h2 a:hover { color: #1ABC9C; }

.entry-meta {
	margin: 10px -10px -15px 0;
	list-style: none;
}

.single-post .entry-meta { margin-bottom: 20px; }

.entry-meta li {
	float: left;
	font-size: 13px;
	line-height: 14px;
	margin: 0 10px 15px 0;
	color: #999;
	font-family: 'Crete Round', serif;
	font-style: italic;
}

.entry-meta li:before {
	content: '/';
	display: inline-block;
	margin-right: 10px;
	opacity: 0.5
}

.entry-meta li i {
	position: relative;
	top: 1px;
	font-size: 14px;
	margin-right: 3px;
}

.entry-meta li a { color: #999; }

.entry-meta li a:hover { color: #1ABC9C; }

.entry-meta li:first-child:before { display: none; }

.entry-meta li ins {
	font-weight: 600;
	text-decoration: none;
}

.entry-c {
	position: relative;
	overflow: hidden;
}

#posts .entry-content { margin-top: 30px; }

.single-post .entry-content .entry-image { max-width: 350px; }

.entry-content { position: relative; }

.entry-link {
	display: block;
	width: 100%;
	background-color: #F5F5F5;
	padding: 30px 0;
	text-align: center;
	color: #444;
	font-family: 'Raleway', sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 24px;
	font-weight: 700;
	border-radius: 3px;
}

body:not(.device-touch) .entry-link {
	-webkit-transition: background-color .3s ease-in-out;
	-o-transition: background-color .3s ease-in-out;
	transition: background-color .3s ease-in-out;
}

.entry-link:hover {
	color: #FFF;
	background-color: #1ABC9C;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.entry-link span {
	display: block;
	margin-top: 5px;
	font-family: 'Crete Round', serif;
	font-style: italic;
	font-weight: normal;
	text-transform: none;
	letter-spacing: 0;
	font-size: 14px;
	color: #AAA;
}

.entry-link:hover span { color: #EEE; }

.entry blockquote p {
	font-weight: 400;
	font-family: 'Crete Round', serif;
	font-style: italic;
}


/* Small Thumbs
-----------------------------------------------------------------*/

.small-thumbs .entry-image,
.ievent .entry-image {
	float: left;
	width: 300px;
	margin: 0 30px 0 0;
}

.small-thumbs .entry-image img,
.ievent .entry-image img { border-radius: 0; }

.small-thumbs .entry-c .entry-image,
.ievent .entry-c .entry-image {
	float: none;
	width: 100%;
	margin: 0 0 20px 0;
}

.small-thumbs .entry-c .entry-image img,
.ievent .entry-c .entry-image img { border-radius: 5px; }

.small-thumbs .entry-title h2,
.ievent .entry-title h2 {
	font-size: 20px;
	font-weight: 600;
}


/* Small Thumbs - Right
-----------------------------------------------------------------*/

.small-thumbs.alt .entry-image {
	float: right;
	margin: 0 0 0 30px;
}

.small-thumbs.alt .entry-c .entry-image {
	float: none;
	margin: 0 0 20px 0;
}


/* Small Thumbs - Both Sidebar
-----------------------------------------------------------------*/

.bothsidebar .small-thumbs .entry-image {
	width: 200px;
	margin: 0 25px 0 0;
}

.bothsidebar .small-thumbs.alt .entry-image { margin: 0 0 0 25px; }

.bothsidebar .small-thumbs .entry-c .entry-image {
	width: 100%;
	margin: 0 0 20px 0;
}

.bothsidebar .small-thumbs .entry-title h2 { font-size: 18px; }


/* Blog - Grid
-----------------------------------------------------------------*/

.post-grid { margin-right: -28px; }

.post-grid .entry {
	float: left;
	width: 264px;
	margin-right: 28px;
}

.post-grid .entry-image img { border-radius: 0; }

.post-grid .entry-title h2 {
	font-size: 17px;
	font-weight: 600;
}

.post-grid .entry-link { font-size: 24px; }

.post-grid .entry-link span { font-size: 13px; }


/* Blog - Grid - 3 Columns
-----------------------------------------------------------------*/

.post-grid.grid-3 { margin-right: -30px; }

.post-grid.grid-3 .entry {
	width: 360px;
	margin-right: 30px;
}

.post-grid.grid-3 .entry-title h2 { font-size: 18px; }


/* Blog - Grid - 3 Columns - Sidebar
-----------------------------------------------------------------*/

.postcontent .post-grid.grid-3 { margin-right: -25px; }

.postcontent .post-grid.grid-3 .entry {
	width: 270px;
	margin-right: 25px;
}

.postcontent .post-grid.grid-3 .entry-title h2 { font-size: 16px; }


/* Blog - Grid - 2 Columns
-----------------------------------------------------------------*/

.post-grid.grid-2 { margin-right: -40px; }

.post-grid.grid-2 .entry {
	width: 550px;
	margin-right: 40px;
}

.post-grid.grid-2 .entry-title h2 { font-size: 20px; }


/* Blog - Grid - 2 Columns - Sidebar
-----------------------------------------------------------------*/

.postcontent .post-grid.grid-2 .entry { width: 410px; }

.postcontent .post-grid.grid-2 .entry-title h2 { font-size: 18px; }


/* Blog - Grid - 2 Columns - Both Sidebar
-----------------------------------------------------------------*/

.bothsidebar .post-grid.grid-2 .entry { width: 270px; }

.bothsidebar .post-grid.grid-2 .entry-title h2 { font-size: 16px; }


/* Blog - Masonry
-----------------------------------------------------------------*/

.post-masonry .entry-image,
.post-masonry .entry-image img { height: auto !important; }


/* Blog - Masonry Full
-----------------------------------------------------------------*/

.post-masonry-full { margin: -80px 0 -80px -1px !important; }

.post-masonry-full .entry {
	width: 24.9% !important;
	margin: 0 !important;
	padding: 40px 30px;
	border-bottom: 1px dashed;
	border-left: 1px dashed;
	border-color: #E5E5E5;
}

.post-masonry-full.grid-3 .entry { width: 33.30% !important; }


/* Blog - Timeline
-----------------------------------------------------------------*/

.timeline-border {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -71px;
	width: 0;
	border-left: 1px dashed #CCC;
	height: 100%;
}

.post-timeline { margin-right: -140px !important; }

.post-timeline .entry {
	width: 500px !important;
	margin-right: 140px !important;
}

.entry.entry-date-section {
	width: 100% !important;
	margin: 50px -70px 80px;
	padding: 0;
	border: 0;
	text-align: center;
}

.entry.entry-date-section span {
	display: inline-block;
	padding: 10px 15px;
	background-color: #FFF;
	border: 2px solid #EEE;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: 'Raleway', sans-serif;
}

.post-timeline .entry-timeline {
	display: none;
	position: absolute;
	border: 2px solid #CCC;
	background-color: #FFF;
	padding-top: 0;
	text-indent: -9999px;
	top: 40px;
	left: auto;
	right: -76px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	font-size: 26px;
	font-weight: bold;
	color: #AAA;
	text-align: center;
	line-height: 1;
	-webkit-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.entry.entry-date-section + .entry .entry-timeline { top: 70px; }

.post-timeline .entry-timeline div.timeline-divider {
	position: absolute;
	top: 4px;
	left: -58px;
	width: 50px;
	height: 0;
	border-top: 1px dashed #CCC;
	-webkit-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.post-timeline .alt .entry-timeline {
	right: auto;
	left: -77px;
}

.post-timeline .alt .entry-timeline div.timeline-divider {
	left: auto;
	right: -58px;
}

.post-timeline .entry-timeline span {
	display: block;
	margin-top: 3px;
	font-size: 13px;
	font-weight: normal;
}

.post-timeline .entry:hover .entry-timeline,
.post-timeline .entry:hover .timeline-divider {
	border-color: #1ABC9C;
	color: #1ABC9C;
}


/* Blog - Timeline - Sidebar
-----------------------------------------------------------------*/

.postcontent .timeline-border {
	left: 32px;
	margin-left: 0;
}

.postcontent .post-timeline {
	padding-left: 100px;
	margin-right: 0 !important;
}

.postcontent .post-timeline .entry {
	width: 100% !important;
	margin-right: 140px !important;
}

.postcontent .post-timeline .entry-timeline {
	display: block;
	border: 3px solid #CCC;
	background-color: #FFF;
	padding-top: 10px;
	text-indent: 0;
	top: 20px;
	left: -100px;
	right: auto;
	width: 64px;
	height: 64px;
	font-size: 24px;
}

.postcontent .post-timeline .entry-timeline div.timeline-divider {
	top: 29px;
	left: 64px;
	width: 32px;
}


/* Individual Post
-----------------------------------------------------------------*/

.ipost .entry-image img { border-radius: 0; }

.ipost .entry-title h3,
.ipost .entry-title h4 {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
}

.ipost .entry-title h4 { font-size: 15px; }

.ipost .entry-title h3 a,
.ipost .entry-title h4 a { color: #333; }

.ipost .entry-title h3 a:hover,
.ipost .entry-title h4 a:hover { color: #1ABC9C; }

.ipost .entry-meta { margin-right: -10px; }

.ipost .entry-meta li {
	font-size: 13px;
	margin-right: 10px;
}

.ipost .entry-content { margin-top: 20px; }

.ipost .entry-content p { margin-bottom: 0; }


.more-link {
	display: inline-block;
	border-bottom: 1px solid #1ABC9C;
	padding: 0 2px;
	font-family: 'Crete Round', serif;
	font-style: italic;
}

.more-link:hover { border-bottom-color: #555; }


/* Related Posts
-----------------------------------------------------------------*/

.overlay-icon {
	position: absolute;
	left: auto;
	right: 0;
	top: auto;
	bottom: 0;
	width: 48px;
	height: 48px;
	background-color: rgba(0,0,0,0.2);
	text-align: center;
}

.overlay-icon i {
	line-height: 48px;
	font-size: 28px;
	color: #FFF;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}


/* Small Post
-----------------------------------------------------------------*/

.spost,
.mpost {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px dashed #E5E5E5;
}

.mpost {
	margin-top: 25px;
	padding-top: 25px;
}

.spost:first-child,
.mpost:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.spost .entry-image,
.mpost .entry-image {
	float: left;
	margin: 0 15px 0 0;
	text-align: center;
}

.spost .entry-image,
.spost .entry-image a,
.spost .entry-image img,
.spost .entry-image i {
	width: 48px;
	height: 48px;
}

.spost .entry-image a i,
.mpost .entry-image a i {
	font-size: 28px;
	line-height: 48px;
	color: #666;
	background-color: #EEE;
}

.spost .entry-title h4,
.mpost .entry-title h4 {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
}

.spost .entry-title h4 a,
.mpost .entry-title h4 a { color: #333; }

.spost .entry-title h4 a:hover,
.mpost .entry-title h4 a:hover { color: #1ABC9C; }

.spost .entry-meta { margin: 8px -10px 0 0; }

.spost .entry-meta li,
.mpost .entry-meta li {
	font-size: 13px;
	margin: 0 10px 0 0;
}


/* Medium Post
-----------------------------------------------------------------*/

.mpost .entry-image { margin-right: 20px; }

.mpost .entry-image,
.mpost .entry-image a,
.mpost .entry-image img,
.mpost .entry-image i {
	width: 170px;
	height: 128px;
}

.mpost .entry-image a,
.mpost .entry-image img { border-radius: 2px; }

.mpost .entry-image a i {
	font-size: 42px;
	line-height: 128px;
}

.mpost .entry-title h4 {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
}

.mpost .entry-meta { margin-top: 5px; }

.mpost .entry-meta li i { margin-right: 2px; }

.mpost .entry-content { margin-top: 15px; }

.post-navigation + .line { margin: 40px 0 50px; }


/* ----------------------------------------------------------------
	Blog - Author
-----------------------------------------------------------------*/

.author-image {
	float: left;
	width: 84px;
	height: 84px;
	margin-right: 15px;
}

.author-image img {
	width: 84px;
	height: 84px;
}


/* ----------------------------------------------------------------
	Comments List
-----------------------------------------------------------------*/


#comments {
	position: relative;
	margin-top: 50px;
	padding-top: 50px;
	border-top: 1px solid #EEE;
}

.commentlist {
	list-style: none;
	padding-bottom: 50px;
	margin: 0 0 50px;
	border-bottom: 1px solid #EEE;
}

#reviews .commentlist {
	padding-bottom: 30px;
	margin: 0 0 20px;
}

.commentlist ul { list-style: none; }

.commentlist li,
.commentlist li ul,
.commentlist li ul li { margin: 30px 0 0 0; }

.commentlist ul:first-child { margin-top: 0; }

.commentlist li {
	position: relative;
	margin: 30px 0 0 30px;
}

#reviews .commentlist li { margin-top: 20px; }

.comment-wrap {
	position: relative;
	border: 1px solid #E5E5E5;
	border-radius: 5px;
	padding: 20px 20px 20px 35px;
}

.commentlist ul .comment-wrap {
	margin-left: 25px;
	padding-left: 20px;
}

#reviews .comment-wrap {
	border: 0;
	padding: 10px 0 0 35px;
}

.commentlist > li:first-child,
#reviews .commentlist > li:first-child {
	padding-top: 0;
	margin-top: 0;
}

.commentlist li .children { margin-top: 0; }

.commentlist li li .children { margin-left: 30px; }

.commentlist li .comment-content,
.pingback {
	position: relative;
	overflow: hidden;
}

.commentlist li .comment-content p,
.pingback p { margin: 20px 0 0 0; }

.commentlist li .comment-content { padding: 0 0 0 15px; }

.commentlist li .comment-meta {
	float: left;
	margin-right: 0;
	line-height: 1;
}

.comment-avatar {
	position: absolute;
	top: 15px;
	left: -35px;
	padding: 4px;
	background: #FFF;
	border: 1px solid #E5E5E5;
	border-radius: 50%;
}

.comment-avatar img {
	display: block;
	border-radius: 50%;
}

.commentlist li .children .comment-avatar { left: -25px; }

.comment-content .comment-author {
	margin-bottom: -10px;
	font-size: 16px;
	font-weight: bold;
	color: #555;
}

.comment-content .comment-author a {
	border: none;
	color: #333;
}

.comment-content .comment-author a:hover { color: #1ABC9C; }

.comment-content .comment-author span { display: block; }

.comment-content .comment-author span,
.comment-content .comment-author span a {
	font-size: 12px;
	font-weight: normal;
	font-family: 'Crete Round', serif;
	font-style: italic;
	color: #AAA;
}

.comment-content .comment-author span a:hover { color: #888; }

.comment-reply-link,
.review-comment-ratings {
	display: block;
	position: absolute;
	top: 4px;
	left: auto;
	text-align: center;
	right: 0px;
	width: 14px;
	height: 14px;
	color: #CCC;
	font-size: 14px;
	line-height: 1;
}

.review-comment-ratings {
	width: auto;
	color: #333;
}

.comment-reply-link:hover { color: #888; }


/* ----------------------------------------------------------------
	Comment Form
-----------------------------------------------------------------*/


#respond,
#respond form { margin-bottom: 0; }

.commentlist li #respond { margin: 30px 0 0; }

.commentlist li li #respond { margin-left: 30px; }

#respond p { margin: 10px 0 0 0; }

#respond p:first-child { margin-top: 0; }

#respond label small {
	color: #999;
	font-weight: normal;
}

#respond input[type="text"],
#respond textarea { margin-bottom: 0; }

#respond .col_one_third,
#respond .col_full { margin-bottom: 20px; }

.fb-comments,
.fb_iframe_widget,
.fb-comments > span,
.fb_iframe_widget > span,
.fb-comments > span > iframe,
.fb_iframe_widget > span > iframe {
	display: block !important;
	width: 100% !important;
	margin: 0;
}


/* Post Elements
-----------------------------------------------------------------*/

img.alignleft,
div.alignleft {
	float: left;
	margin: 5px 20px 13px 0;
	max-width: 100%;
}

div.alignleft > img,
div.alignnone > img,
div.aligncenter > img,
div.alignright > img {
	display: block;
	float: none;
}

img.alignnone,
img.aligncenter,
div.alignnone,
div.aligncenter {
	display: block;
	margin: 10px 0;
	float: none;
}

img.aligncenter,
div.aligncenter,
div.aligncenter img {
	margin-left: auto;
	margin-right: auto;
	clear: both;
}

img.alignright,
div.alignright {
	float: right;
	margin: 5px 0 13px 20px;
}

.wp-caption {
	text-align: center;
	margin: 10px 20px 13px 20px;
	font-family: 'Lato', Georgia, "Times New Roman", Times, serif;
	font-style: italic;
}

.wp-caption img,
.wp-caption img a {
	display: block;
	margin: 0;
}

p.wp-caption-text {
	display: inline-block;
	margin: 10px 0 0 0;
	padding: 5px 10px;
	background-color: #EEE;
	border-radius: 50px;
}

.wp-smiley {
	max-height: 13px;
	margin: 0 !important;
}

OHA YOOOO