
/* The Header */
.header {border-bottom: 2px solid #980000;}
.header-box {height: 88px;}
.menu_sticky { position: sticky; top: 0; z-index: 999;}
#sticky-header { position: sticky; top: 0;z-index: 999; height: 70px; min-height: 70px; will-change: transform;}
.header-menu li .sub-menu { display: none; }
.header-menu li a {display: block;padding: 14px 10px;position: relative;text-align: center;text-transform: uppercase;color: #ffffff;font-weight: 700;font-size: 16px;}
.header-menu li:after { 
    border: 1px solid #a9a9a9; 
    height: 10px; 
    position: absolute; 
    right: -5px; 
    top: 50%; 
    /* Modernized: removed vendor prefixes, CSS transforms are fully supported */
    transform: translate(-50%, -50%); 
}
.header-menu li:last-child:after { border: none; }
.header-menu ul { display: flex; }
.header-center {width: 444px;}
.header-search-button {flex: 0 0 80px;}
.mobile-header-box {height: 70px;}
.progress-container { width: 100%; height: 0px; background: #ccc; position: fixed; top: 0; left: 0; z-index: 9999; }
.progress-bar {height: 5px;width: 0%;background: linear-gradient(to right, black 0%, #570000 16.66%, #940202 33.33%, #b10101 50%, #cc0000 66.66%, #db0202 83.33%, #e40d0d 100%);}
.breadcrumbs { border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
/* Mobile Header */
.mheader-sticky { position: sticky; top: 0; z-index: 9999; transition: top 0.3s; animation: slideDown 0.3s forwards; }
@keyframes slideDown { 0% { top: -100px; } 100% { top: 0; } }
.menu-overlay-open {background-color: #000000bd;height: 100vh;left: 0;position: absolute;top: 0;width: 100%;z-index: 999;}
.mobile-menu-open {height: 100vh;top: 0;left: 0;position: absolute;width: 300px;z-index: 999; border-top-right-radius: 20px; border-bottom-right-radius: 20px; overflow: hidden;} 
.header-menu, .mobile-menu-scroll { scrollbar-width: none;}
.menu-item {position: relative;white-space: nowrap;width: 100%;}
.mobile_menu_container li a {border-bottom: 1px solid #56565633;display: block;padding: 8px 20px;text-transform: uppercase;font-weight: 700;font-size: 20px;}
.mobile_menu_container li:before {bottom: 0;content: '';left: 0px;margin: 6px 0;position: absolute;top: 0;width: 6px;background: #000000;border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.mobile_menu_container li a:after {background-image: url(../images/web-icons/arrow-next.svg);background-position: right;background-repeat: no-repeat;background-size: 14px;content: "";width: 20px;height: 20px;position: absolute;right: 0;top: 50%;transform: translate(-50%, -50%);}
.mobile-search.show-mobile-search {display: block;position: fixed;top: 70px;left: 0;right: 0;bottom: 0;background: #ffffff;z-index: 9999;}
.body-menu-open, .body-search-open { overflow: hidden; }
.mobile-search { display: none; }
.mobile-menu-none { display: none; }
.emty-space { height: 300px;}

/* Mobile Home */
.mobile-posts-list-img {flex: 0 0 100px;flex-shrink: 0;margin-right: 5px;overflow: hidden;position: relative;height: 80px;}
.img-cover { width: 100%; height: 100%; object-fit: cover; }
.mobile-posts-list-title { width: 100%;}

/* The Home Categories */
.crumbs a, .current {font-weight: 200;}
.cat-home-name:before {bottom: 0;content: '';left: 0px;margin: 8px 0;position: absolute;top: 0;width: 8px;border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.category-name-box .view-all { padding: 8px 20px; border: 1px solid #000000; font-size: 12px;}  
.category-name-box:hover .view-all {background: #000000;color: #ffffff;}
.mobile-view-all { padding: 8px 16px; border: 1px solid #000000; font-size: 10px;}
.category-one:before,.mobile_menu_container li:nth-child(1):before {background: #f00606;}
.category-two:before,.mobile_menu_container li:nth-child(2):before {background: #1aa1ea;}
.category-three:before,.mobile_menu_container li:nth-child(3):before { background: #ff982e; }
.category-four:before,.mobile_menu_container li:nth-child(4):before {background: #ff1a67;}
.category-five:before,.mobile_menu_container li:nth-child(5):before {background: #2dc2a8;}
.category-six:before,.mobile_menu_container li:nth-child(6):before {background: #7B1FA2;}
.category-seven:before,.mobile_menu_container li:nth-child(7):before {background: #188f1d;}
.category-eighth:before,.mobile_menu_container li:nth-child(8):before {background: #1aa1ea;}
.category-nine:before,.mobile_menu_container li:nth-child(9):before {background: #f95015;}
.home-grid-post-img {height: 222px;overflow: hidden;}
.grid-post-img {height: 222px;overflow: hidden;}
.content {width: 960px;flex: 0 0 auto;flex-shrink: 0;}
.single-post-img {height: 510px;overflow: hidden;}
.sidebar {flex-basis: 320px;width: 320px;flex-shrink: 0;margin-left: 20px;}
.sidebar-sticky { position: sticky; top: 10px; }
.relatet-text-name:before {bottom: 0;content: '';left: 0px;margin: 10px 0;position: absolute;top: 0;width: 8px;background-color: #e40d0d;border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.mobile-relatet-text-name:before {bottom: 0;content: '';left: 0px;margin: 10px 0;position: absolute;top: 0;width: 6px;background-color: #e40d0d;border-top-right-radius: 10px;border-bottom-right-radius: 10px;}
.relatet-text-name {letter-spacing: 1px;text-transform: uppercase;}
.relatet-text .view-all {padding: 8px 20px;}
.relatet-text:hover .view-all a {    background: #000000;    color: #ffffff;}
.related-post-img {height: 222px;overflow: hidden;}
.col-left { flex: 0 0 750px; margin-right: 10px; flex-shrink: 0; }
.single-img { width: 100%; }
.single-img:hover { opacity: 0.8;}
.popular-small-ititle { line-height: 1.6;}
.col-right { flex: 0 0 520px; flex-shrink: 0; }
.popular-small:last-child { margin-bottom: 0px; border-bottom: 0; padding-bottom: 0px; }
.popular-small { margin-bottom: 5px; border-bottom: 1px solid #e9e9e9; padding-bottom: 5px; }
.popular-small-img {width: 150px;height: 88px;flex: 0 0 150px;flex-shrink: 0;overflow: hidden;margin-right: 10px;}
.popular-small-right { width: 100%; }
.posts-content-img {height: 222px;overflow: hidden;}
.posts-content-descripition {width: 100%;display: grid;align-content: space-between;}
.posts-list-img { flex: 0 0 auto; width: 330px; height: 200px; margin-right: 10px;}

/* Slider Home */
.mobile-popular-slider { position: relative; overflow: hidden; }
.popular-posts-slide { display: none; }
.popular-posts-slide.active { display: block; }
.popular-slider-nav {position: absolute;top: 80px;left: 0;right: 0;display: flex;justify-content: space-between;}
.hero-prev, .hero-next {opacity: 0.5;height: 60px;width: 60px;}
.hero-prev:hover, .hero-next:hover {opacity: 1;}
.slider-dots {display: flex;justify-content: center;margin-top: 10px;margin-bottom: 10px;}
.slider-dot {width: auto;height: 8px;background-color: #bababa;margin: 0 4px;cursor: pointer;display: block;flex-shrink: 0;padding: 0;flex-grow: 1;}
.slider-dot.active {background-color: #bd0101;}
.mobile-slider-warpper { position: relative; }
.story-slider-warpper { width: 300px; margin: 0 auto; height: 533px; background: black; }
.story-title { display: block; margin-bottom: 10px;  text-transform: uppercase; padding: 0 25px; color: white; }
.story-post-title { color: white; font-size: 20px; text-transform: uppercase; padding: 0 15px; display: block; }
.story-web-link { display: block; color: white; }
.story-slider-screenshot, .screenshot-download {background: black;padding: 10px;display: block;width: 200px;margin: 10px auto;}
.sub-cat-header .cat-item a {padding: 12px 20px;display: block;color: #ffffff;border-right: 1px solid #f0f3f5;text-transform: uppercase; white-space: nowrap;}
.cat-item { position: relative; }
.cat-item:hover a:after { color: white; border-bottom: 4px solid #ca0000; content: ''; display: block; width: 100%; position: absolute; bottom: 0; left: 0; }
.archive-crumbs { letter-spacing: 1px; text-transform: uppercase; }
.archive-posts-count { white-space: nowrap;}
.author-posts-content-img {    width: 333px;    flex: 0 0 auto;}
.author-posts-content-descripition {    width: 100%;}
.button-primary { border-radius: 4px; display: inline-block; padding: 15px 30px; font-weight: 700; color: white; border: 2px solid #950000; background-color: #d32323; background-image: linear-gradient(to top, #a70707, #ca0101); }
.button-primary:hover { background-color: #d32323; background-image: linear-gradient(to top, #870000, #d60000);}
.content-text img { width: 100%; }
.content-text p iframe, .content-text iframe { width: 100%; }
.content-text, .content-text p {font-size: 22px;font-family: "Mulish", sans-serif;word-spacing: 1px;line-height: 1.6;font-weight: 500;}
.content-text p br { content: ""; display: block; margin-bottom: 15px; }
.content-text ul, .content-text ol {margin-left: 30px;}
.content-text ul li {font: 18px Helmet, Freesans, Helvetica, Arial, sans-serif;list-style: disc;line-height: 1.5;margin-bottom: 10px;}
.content-text ol li {font: 18px Helmet, Freesans, Helvetica, Arial, sans-serif;list-style: number;line-height: 1.5;margin-bottom: 10px;}
.source-link {font-weight: 700;text-align: right;display: block;font-size: 16px;}
.tags-single {display: flex;flex-direction: row;flex-wrap: wrap;/* -webkit-transform: skew(-14deg, 0deg); *//* transform: skew(-14deg, 0deg); */}
.tags-single a:before {
    bottom: 0;
    content: '';
    left: 0px;
    position: absolute;
    top: 0;
    width: 6px;
    background-color: #e40d0d;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}
.tags-single a {display: inline-block;padding: 2px 10px;margin: 4px;border-top: 1px solid #000000;border-bottom: 1px solid #000000;border-right: 1px solid #000000;color: #000000;text-decoration: none;font-size: 14px;position: relative;}
.tags-single a:hover { background: #ebebeb; color: #333;}
.tags-single a:hover::before {  background-color: #e40d0d;}
.mobile-single-header { position: absolute; left: 0; top: 0; right: 0; }
.history-butons a { padding: 10px 20px; font-size: 36px; display: block; color: #ffffff; }
.mobile-sub-cat-header .cat-item a {background: #000000;color: #ffffff;padding: 10px;white-space: nowrap;display: block;margin-right: 1px;}
.mobile-sub-cat-header {
    /* Modernized: overflow: overlay is deprecated, replaced with overflow: auto */
    overflow: auto;
    overflow-x: scroll;
}
.footer-menu li a { padding: 10px; }
.footer-menu-float li a { padding: 5px; display: block; }
.footer-menu-float li a:after, .author-list-li a:after {background-image: url(../images/web-icons/arrow-next.svg);background-position: right;background-repeat: no-repeat;background-size: 10px;content: "";width: 20px;height: 20px;position: absolute;right: 0;top: 50%;transform: translate(-50%, -50%);}

/* Share Overly */
.share-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); display: none; justify-content: center; align-items: center; z-index: 2000; }
.share-overlay-active { display: flex; }
.share-modal {padding: 10px;border-radius: 6px;position: relative;max-width: 400px;width: 100%;animation: modalSlide 0.3s ease-out;margin: 20px;}
.share-close-btn {position: absolute;top: 0px;right: 10px;background: none;font-size: 34px;cursor: pointer;color: #676767;padding: 5px;}
.close-btn:hover { color: #333; }
.share-show { overflow: hidden;}
.facebook { background: #3b5998; }
.twitter { background: #1da1f2; }
.linkedin { background: #0077b5; }
.whatsapp { background: #25d366; }
.share-btn-email { background: #ea4335; }
.share-btn-link { background: #9b59b6; border: none; cursor: pointer; font: inherit; width: 100%; }
.link-copied { background: #722b8f; }   
@keyframes modalSlide { from { transform: translateY(-50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.home-blocks {display: none;opacity: 0;transition: opacity 0.5s ease-in-out;}
.home-blocks.visible { display: block; opacity: 1; }
.related-blocks { display: none; opacity: 0; transition: opacity 0.5s ease-in-out; min-height: 200px; }
.related-blocks.visible { display: block; opacity: 1; }
#backToTopBtn { display: none; position: fixed; bottom: 40px; right: 40px; z-index: 999; padding: 14px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); transition: background-color 0.3s;  }
#backToTopBtn:hover { background-color: #555; } 
.images-copyright { border-top-right-radius: 5px;}

.live-indicator {
  position: relative;
  width: 24px;
  height: 24px;
}

/* PIKA NE QENDER */
.live-dot {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  background: #e10600; /* red live */
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 8px rgba(225, 6, 0, 0.8);
}

/* HARKU QE LEVIZ */
.live-arc {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid transparent;
  border-top-color: #e10600;
  border-radius: 50%;
  animation: live-spin 1.2s linear infinite;
}

/* ANIMATION */
@keyframes live-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.live-arc {
  border: 2px solid transparent;
  border-top-color: rgba(225, 6, 0, 0.9);
  border-right-color: rgba(225, 6, 0, 0.3);
}

.live-dot {
  animation: pulse 1.5s infinite;
}

@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(225,6,0,0.7); }
  70% { box-shadow: 0 0 0 6px rgba(225,6,0,0); }
  100% { box-shadow: 0 0 0 0 rgba(225,6,0,0); }
}

.pagination .current {
    padding: 5px;
    font-size: 26px;
    font-weight: 700;
    text-align: center;
}