body{font-family: sans-serif!important;}

header ul li.has-menu:after {background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="18" height="18" viewBox="0 0 24 24"%3E%3Cpath fill="none" stroke="lightgray" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m19 9l-7 6l-1.75-1.5M5 9l2.333 2"%2F%3E%3C%2Fsvg%3E');}

#yz-header {overflow:hidden;}
#yz-header:before {
    content: '';
    position: absolute;
    top: -60%;
    right: -60px;
    width: 150px;
    height: 150px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    animation: float 8s ease-in-out infinite;
    z-index: -1;
}
#yz-header:after {
    content: '';
    position: absolute;
    bottom: -10%;
    left: -50px;
    width: 100px;
    height: 100px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    animation: float 10s ease-in-out infinite reverse;
    z-index: -1;
}

.img-thumb { width: -webkit-fill-available; width: -moz-available; }

.inpage h1.post-title {margin-block-end: 2rem;}
.inpage #Blog1 .load-more-btn {padding: 8px 70px;}

.swipe::-webkit-scrollbar,
nav .LinkList ul::-webkit-scrollbar,
#subLabelcont::-webkit-scrollbar,
#popularLabel::-webkit-scrollbar
{width: 5px;height: 5px;opacity: 0;}

.swipe:hover::-webkit-scrollbar,
nav .LinkList ul:hover::-webkit-scrollbar,
#subLabelcont:hover::-webkit-scrollbar,
#popularLabel:hover::-webkit-scrollbar
{width: 5px;height: 5px;opacity: 1;}

.swipe:hover::-webkit-scrollbar-thumb,
nav .LinkList ul:hover::-webkit-scrollbar-thumb,
#subLabelcont:hover::-webkit-scrollbar-thumb,
#popularLabel:hover::-webkit-scrollbar-thumb
{background: #d3d3d3;border-radius: 10px;}

.swipe:hover::-webkit-scrollbar-track,
nav .LinkList ul:hover::-webkit-scrollbar-track,
#subLabelcont:hover::-webkit-scrollbar-track,
#popularLabel:hover::-webkit-scrollbar-track
{border-radius: 10px;background: 0 0;}

#headline-sec {max-width: 100%;margin: 0;}
header .trend-title {z-index: 0;}

#recHL {min-width: -webkit-fill-available; min-width: -moz-available; aspect-ratio: 16/9;}
#recHL .post-title {font-size: 2rem!important;}

#popularLabel .trend-title {background: var(--bg-color);}
#subLabelcont .trend-title {background: #161d24;}

.index .Blog .post-img a:after {top: 0;height: 124px;}

.inpost .inner-post {display: block!important;}
.inpost .post-labels {flex-wrap: wrap;gap: 0 1rem;}

body.dw header ul li.has-menu:hover .sub-menu, body.dw header ul li.has-menu.active ul.sub-menu {top: 2rem!important;}

[data-theme=dark] .dropdown-menu {
    background: var(--bg-color)!important;
}

footer {position:relative;overflow:hidden;}
footer#yz-footer:before {
    content: '';
    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1FXIitE0BIjbIvoOVgVcaksSYMcmdbEoTnh6FzQD8GiQYlmmromu1vWsQqYGFG7jr6t8nb41x1eNqPC1GY0XtrSDsZ7FNLPpOlPM3t_74ZFmFGm1_T7sg5YK3DxpQdBEaL27uSg1BrdgFFKCkRREQb9qzcdJI5Evt0m2rlPQD9lK0JHMDhxaDoyBX6t0/w640-h248/jakartacolor-removebg-preview.png);
    position: absolute;
    bottom: 0;
    width: 640px;
    height: 248px;
    z-index: -1;
    left: -75px;
    opacity: 0.35;
}


.swipe {
    user-select: none;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    display: flex;
    flex-wrap: nowrap!important;
    gap: 1rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
}
    .horizontal-scroll {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
    gap: 15px;
}
.horizontal-scroll .video-card {
    flex-shrink: 0;
    scroll-snap-align: start;
    border-radius: 10px;
    overflow: hidden;
    aspect-ratio: 9/16;
    position: relative;
    width: 150px;
}
.video-card img {
    margin: 0!important;
    padding: 0!important;
}
#close-viewer, .video-card-overlay {
    border: 0;
    cursor: pointer;
    text-align: center;
}
.video-card-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.1);
    font-size: 1.9em;
    opacity: 1;
    transition: opacity .3s;
    z-index: 10;
    height: 100%;
    width: 100%;
}
.vertical-scroll, .vertical-scroll .video-card {
    width: -webkit-fill-available;
    height: -webkit-fill-available;
}
.vertical-scroll {
    position: fixed;
    inset: 0;
    overflow-y: scroll;
    scroll-snap-type: y mandatory;
    background-color: #000;
    z-index: 1000;
}
#close-viewer {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1001;
    background: rgba(255,255,255,.2);
    color: #fff;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 1.2em;
    line-height: 40px;
    padding: 0;
}

/* ===== GALLERY ===== */
.lb-gallery {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.lb-gallery img {
width: calc(33.333% - 10px);
cursor: zoom-in;
object-fit: cover;
}

/* ===== LIGHTBOX ===== */
.lightbox {
position: fixed;
inset: 0;
background: rgba(0,0,0,.92);
display: none;
justify-content: center;
align-items: center;
z-index: 9999;
overscroll-behavior: contain; /* iOS fix */
}

.lightbox-inner {
text-align: center;
max-width: 100%;
}

#lightbox-img {
max-width: 92vw;
max-height: 80vh;
}

/* ===== CAPTION ===== */
.lightbox-caption {
color: #ddd;
font-size: 14px;
margin-top: 10px;
opacity: 0;
transform: translateY(6px);
transition: opacity .3s ease, transform .3s ease;
}

.lightbox.show-caption .lightbox-caption {
opacity: 1;
transform: translateY(0);
}

/* ===== INDICATOR ===== */
.lightbox-indicator {
color: #aaa;
font-size: 12px;
margin-top: 6px;
}

.small {font-size:small;}
.dimgray {color:dimgray;}

/* Laptop */
@media only screen and (max-width:1366px) {
}

/* Tablet */
@media only screen and (max-width:768px) {
	.ignielTopParallax .prlx2 {top: 0;transform: translate(-50%,0%);}
	.ignielParallax .prlx2 {top: 42%;}
	.index .Blog .post-img a:after {height: 90px;}
	.post-img a:after {content:none;}
	header ul li.has-menu {padding-inline-end: 2rem!important;}
	header ul li.has-menu:after,header .open ul li.has-menu:after {
		content: ''; background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="18" height="18" viewBox="0 0 24 24"%3E%3Cpath fill="none" stroke="lightgray" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m19 9l-7 6l-1.75-1.5M5 9l2.333 2"%2F%3E%3C%2Fsvg%3E');
	}
	header .open ul li.has-menu {
		padding-inline-end: 0!important;
	}
	
	.side-drawer.open ul li.has-menu.active ul.sub-menu {
		top: 2rem;
		position: absolute;
		padding: 1rem;
		background: #131313;
	}
	
	header ul li.has-menu:hover:after {
		-webkit-transform: scale(180deg);
		transform: unset;
	}
	header ul li.has-menu.active:after {
		-webkit-transform: scale(180deg);
		transform: rotate(180deg)!important;
	}
	
	header ul li.has-menu:hover .sub-menu 
	{display: none!important;}
	header ul li.has-menu.active ul.sub-menu 
	{display: grid!important;top: 5.75rem;}

	.lb-gallery img { width: calc(50% - 10px); }

}

/* Mobile */
@media only screen and (max-width:500px) {
  #recHL .post-title {font-size: 1.5rem!important;}

}

@keyframes float {
	0%, 100% { transform: translateY(0px); }
	50% { transform: translateY(20px); }
}
.post-desc {display:none;}