/*
Theme Name: Nyeo WordPress Theme
Theme URI: http://indthemes.com/theme/nyeo
Description: Description: Nyeo WordPress theme by INDThemes. Increase your Google Adsense earnings with premium theme, <a href="http://indthemes.com/" target="_blank">click here</a>.
Author: Bambang Tri Utomo
Author URI: http://indthemes.com/
Version: 2.1-discover-pro
*/

/* ------------------------------------------- START Reset CSS ------------------------------------------- */

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 {
	border: 0;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
html {
	font-size: 62.5%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	background: #fff;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
	display: block;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a:focus {
	outline: thin dotted;
}
a:hover,
a:active {
	outline: 0;
}
a img {
	border: 0;
}
.clearfix {
	clear:both
}

/* ------------------------------------------- START GLOBAL CSS ------------------------------------------- */

a { text-decoration: none; }
a:link { text-decoration: none; }
a:visited {}
a:hover { text-decoration: underline; }
a:focus { outline: none; }
h1 { font-size: 18px; }
h2 { font-size: 16px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; }
h6 { font-size: 12px; }
p { margin:10px 0; }
p img { padding: 0; max-width: 100%; }
.container { width: 900px; margin: 0 auto; }
.alignleft { float: left; }
.alignright { float: right; }
.aligncenter, div.aligncenter { display: block; margin: 0 auto; text-align: center; }
img.alignleft { margin: 5px 15px 10px 0; }
img.alignright { margin: 5px 0 10px 10px; }
img.aligncenter { margin: 10px auto; }
.wp-caption { text-align: center; border-bottom: 1px solid #DADADA; background-color: #fff; padding-top: 5px; margin-bottom: 10px !important; max-width: 100%; }
.wp-caption img { max-width: 100%; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 18px; padding: 0 4px 5px; margin: 0; }

/* ------------------------------------------- START Layout CSS ------------------------------------------- */

body { background: #22b4d8; font: 13px Arial,Helvetica,sans-serif; color: #474747; }
#wrap { width: 900px; margin: 0 auto; background: #fff; }
#main { float: left; width: 880px; padding: 10px; }
#content { float: left; width: 570px; margin-right: 10px; }
#sidebar { float: right; width: 300px; }

/* ------------------------------------------- START POST CSS ------------------------------------------- */

.post { border-bottom: 1px solid #efefef; padding: 10px 0; overflow: hidden; }
.post h2{ font-size: 15px; line-height: 20px; margin-bottom: 10px; }
.post h2 a:hover { text-decoration: none; }
.post:first-child { border-top: 1px solid #efefef; }
.post .thumb { float: left; width: 100px; height: 80px; display: block; margin-right: 15px; }
.post p { margin: 0; line-height: 18px; }

/* ------------------------------------------- START Entry CSS ------------------------------------------- */

.entry {}
.entry img { max-width: 570px; }
.entry p { line-height: 20px; }
.entry blockquote { margin: 20px 20px; padding: 0 30px 0 20px; overflow: hidden; border-left: 10px solid #F7F7F7; }
.entry ul, .entry ol { margin: 0 0 5px 3em; }
.entry ol { list-style-type: decimal; }
.entry ul { list-style-type: square; }
.entry ul ul, .entry ul ol, .entry ol ol, .entry ol ul { margin: 0 0 0 20px; }
h1.stitle { color: #4b7eaf; font-size: 16px; line-height: 18px; margin: 10px 0; }
.entry h2, .entry h3, .entry h4 { font-size: 13px; margin: 5px 0; }
.entry table { width: 100%; border: 1px solid #e9e9e9; margin: 1.0em 0; border-collapse: collapse; border-spacing: 0; }
.entry table th { padding: 6px 3px; background: #eee; border: 1px solid #e9e9e9; text-shadow: 1px 1px #fff; }
.entry table td { padding: 6px 10px 3px 10px; border: 1px solid #e9e9e9; }

/* ------------------------------------------- START Share CSS ------------------------------------------- */

.social-container { margin: 15px 0; width: 100%; }
.SocialCustomMenu { margin: 0; }
.SocialCustomMenu span { display: inline; padding: 5px; text-decoration: none; font-size: 0.95em; }
.SocialCustomMenu a, .SocialCustomMenu a:visited { display: inline; padding: 5px; color: white!important; text-decoration: none; font-size: 0.95em; }
.social-container .twitter { background-color: #00a0d1; }
.social-container .facebook { background-color: #3b5998; }
.social-container .googleplus { background-color: #db4a39; }
.social-container .sharetext { background: #efefef; color:#333 !important; }

/* ------------------------------------------- START Related CSS ------------------------------------------- */

.related_posts { width: 100%; margin-top: 15px; }
.related_posts .thumb { float: left; width: 70px; height: 60px; margin-right: 10px; overflow: hidden; }
.related_posts h3 { background: #efefef; font-size: 13px; padding: 4px 10px;}
.related_posts ul { margin: 10px 0; }
.related_posts ul li { padding: 1%; width: 98%; display: inline-block; overflow: hidden; margin-bottom: 5px; border: 1px solid #efefef; }
.related_posts h4 { font-size: 13px; line-height: 18px; margin-bottom: 5px; }
.related_posts p { margin: 0; }
.related_posts .relatedcontent { float: left; overflow: hidden; }

/* ------------------------------------------- START Sidebar CSS ------------------------------------------- */

#sidebar h3.title  { height: 26px; border-bottom: 3px solid #dfdfdf; line-height: 26px; font-size: 12px; text-transform: uppercase; }
#sidebar h3.title span  { line-height: 26px; padding: 0px 10px; color: #ffffff; }
#sidebar .widget { margin-bottom: 15px; }
#sidebar .widget .inner{}
#sidebar .widget ul {padding: 5px 0 0 0;}
#sidebar .widget ul li { background: url(img/list.png) no-repeat scroll 5px 10px transparent; padding: 4px 4px 4px 15px; border-bottom: 1px solid #efefef; }
#sidebar table { width: 100%; font-size: 90%; border: 1px solid #efefef; border-bottom: none; border-right: none; }
#sidebar table td { padding: 2px 3px; border-right: 1px solid #efefef; border-bottom: 1px solid #efefef; }
#sidebar .widget_ads { margin: 5px 0; }

/* ------------------------------------------- START Footer CSS ------------------------------------------- */

#footer { width: 100%; background: #F2F2F2; border-top: 1px solid #e2e2e2; font-size: 12px; }
#footer .inner { float: left; padding: 10px 15px; }
#footer .copyright { float: left; color: #666; width: 440px; }
#footer .copyright a { color: #666; }
#footer .menu { float: right; width: 430px; }
#footer .menu ul li { float: right; border-left: 1px solid #ccc; padding: 0 10px; }
#footer .menu ul li:last-child { border: none; }
#footer .menu ul li a { line-height: 15px; font-weight: bold; text-transform: capitalize; color: #666; }
#footer .menu ul li a:hover { text-decoration: none; color: #666; }

/* ------------------------------------------- START Menu CSS ------------------------------------------- */

nav select { display: none; border: 1px solid #dfdfdf; padding: 3px; }
#main-menu { width: 100%; height: 35px; border-top: 3px solid #dfdfdf; border-bottom: 3px solid #dfdfdf; font-size: 12px; font-weight: bold; text-align: center; overflow: hidden; }
#main-menu .ihome { float:left; margin: 5px 10px; display: inline; } 
#main-menu .main-menu { padding: 9px 0; text-align: left; }
#main-menu .main-menu ul { width: 100%; }
#main-menu .main-menu li { float: left; border-right: 1px solid #ffffff; }
#main-menu .main-menu li a { color: #ffffff; padding: 0 12px; font-weight: bold; text-transform: uppercase; display: inline-block; }
#main-menu .main-menu li a:hover { text-decoration: none; color: #ccc; }
#main-menu .main-menu li li a, #main-menu .main-menu li li a:link, #main-menu .main-menu li li a:visited { background: #dfdfdf; color: #000; position: relative; text-transform: uppercase; width: 138px; line-height: 32px; padding: 0px 10px; border-bottom: 1px solid #bbbbbb; }
#main-menu .main-menu li li a:hover, #main-menu .main-menu li li a:active { }
#main-menu .main-menu li li:first-child { border: none; }
#main-menu .main-menu li li { border: none; }
#main-menu .main-menu li ul{ height: auto; left: -9999px; position: absolute; width: 160px; z-index: 9999; margin: 0; padding-top: 14px; }
#main-menu .main-menu li ul a { width: 140px; }
#main-menu .main-menu li ul ul { margin: -33px 0 0 159px; }
#main-menu .main-menu li:hover>ul { left: auto; }
#main-menu .main-menu li.current-menu-item a, #main-menu .main-menu li.current-post-parent a { color: #ccc; }

/* ------------------------------------------- START Pagenavi CSS ------------------------------------------- */

.Nav { font-size: 12px; width: 100%; margin: 20px 0; }
.Nav a { border: 1px solid #ddd; color: #000 !important; background: #f9f9f9; padding: 6px; }
.Nav a:visited { border: 1px solid #ccc; background: #f9f9f9; }
.Nav a:hover { background: #dfdfdf; text-decoration: none; }
.Nav span { background: #f9f9f9; border: 1px solid #ccc; margin-right: 3px; padding: 6px 5px; }
.Nav .on { background: #dfdfdf; border: 1px solid #ccc; padding: 6px; }

/* ------------------------------------------- START Other CSS ------------------------------------------- */

h3.reply-title { background: #efefef; font-size: 13px; padding: 5px 10px; }
.breadcrumbs { background: #ECEEF5; width: 550px; font-size: 11px; padding: 2px 10px; text-transform: capitalize; font-weight: normal; }

/* ------------------------------------------- START Responsive CSS ------------------------------------------- */

@media only screen and ( max-width: 769px ) {
img,video,object {
  max-width: 100%;
  height: auto;
}
#wrap { width: 96%; }
#main { padding: 0; }
#main { width: 96%; padding: 2%; }
#mainmenu, #footer { width: 100%; }
#content { margin: 0; }
#content { width: 60%; margin-right: 2%; }
#content img { max-width: 100%; }
#sidebar { width: 38%; }
.breadcrumbs, .wp-caption { width: 95%; }
}

@media only screen and ( max-width: 600px ) {
#wrap, #main { width: 100%; }
#main { padding: 0; }
#mainmenu, .entry, .wp-caption, #footer .copyright, #footer .menu { width: 100%; }
#footer .menu ul li { float: left; border-right: 1px solid #ccc; border-left: none; }
#footer .menu ul li:first-child { float: left; border-right: 1px solid #ccc; border-left: none; padding-left: 0; }
#sidebar, #content, #footer, .breadcrumbs { width: 96%; padding: 0 2%; margin: 0; }
.breadcrumbs { margin-top: 10px; }
.related_posts ul li { width: 96%; padding: 2%; }
nav ul { display: none; }
nav select { display: inline-block; width: 300px; height: 25px; margin: 5px 0; overflow: hidden; background: #EFEFEF; float: none; font-size: 13px; }
#fb-comments  { display: none; }
}
/* Google Discover-friendly featured image */
.nyeo-featured-image {
    margin: 0 0 20px;
}
.nyeo-featured-image img,
.nyeo-featured-image .discover-image {
    display: block;
    width: 100%;
    height: auto;
}

/* ------------------------------------------- Discover Pro Upgrade ------------------------------------------- */
.nyeo-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    align-items: center;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
    margin: -4px 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #efefef;
}
.nyeo-article-meta a { color: inherit; font-weight: bold; }
.nyeo-article-meta span:not(:last-child)::after {
    content: "";
}
.nyeo-featured-image {
    margin: 0 0 20px;
    background: #f5f5f5;
    overflow: hidden;
}
.nyeo-featured-image img,
.nyeo-featured-image .discover-image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}
.entry img {
    height: auto;
}
.entry a {
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.entry h2,
.entry h3 {
    color: #222;
}
.entry blockquote {
    background: #fafafa;
    border-left: 4px solid #ddd;
    padding: 12px 18px;
    margin: 22px 0;
}
.page-links,
.nyeo-post-tags {
    clear: both;
    margin: 18px 0;
    font-size: 14px;
}
.nyeo-post-tags span {
    font-weight: bold;
}
.nyeo-post-tags a {
    display: inline-block;
    margin: 3px 4px 3px 0;
    padding: 5px 9px;
    background: #f3f4f6;
    border-radius: 999px;
    color: #333 !important;
}
.nyeo-author-box {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 18px;
    margin: 22px 0;
    border: 1px solid #e8e8e8;
    background: #fafafa;
    border-radius: 10px;
}
.nyeo-author-avatar img {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: block;
}
.nyeo-author-info { flex: 1; min-width: 0; }
.nyeo-author-label {
    display: block;
    color: #777;
    font-size: 12px;
    margin-bottom: 2px;
}
.nyeo-author-info h3 {
    font-size: 18px;
    line-height: 1.3;
    margin: 0 0 6px;
}
.nyeo-author-info p {
    margin: 0;
    line-height: 1.65;
    color: #444;
}
.related_posts {
    clear: both;
    margin: 24px 0 10px;
}
.related_posts h3 {
    background: transparent;
    border-bottom: 2px solid #eee;
    font-size: 18px;
    padding: 0 0 8px;
    margin: 0 0 14px;
}
.nyeo-related-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.nyeo-related-card {
    border: 1px solid #ececec;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}
.nyeo-related-thumb {
    display: block;
    background: #f4f4f4;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}
.nyeo-related-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.nyeo-related-placeholder {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    font-size: 42px;
    font-weight: bold;
    color: #aaa;
}
.nyeo-related-card h4 {
    font-size: 15px;
    line-height: 1.35;
    margin: 10px 10px 6px;
}
.nyeo-related-card p {
    margin: 0 10px 12px;
    line-height: 1.55;
    color: #555;
}
@media only screen and (max-width: 769px) {
    #wrap { max-width: 100%; }
    .nyeo-article-meta { font-size: 12px; }
    .nyeo-author-box { padding: 14px; }
}
@media only screen and (max-width: 600px) {
    .entry { padding-top: 4px; }
    .nyeo-related-grid { grid-template-columns: 1fr; }
    .nyeo-author-box { flex-direction: row; gap: 12px; }
    .nyeo-author-avatar img { width: 58px; height: 58px; }
    .nyeo-author-info h3 { font-size: 16px; }
}