/* styles.css */
  
  .tag-filters {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-bottom: 20px;
  }
  
  .tag-btn {
    padding: 10px 20px;
    border: none;
    cursor: pointer;
    background-color: #007bff;
    color: white;
    border-radius: 5px;
    flex: 1;
  }
  
  .tag-btn:hover {
    background-color: #0056b3;
  }
  
  .articles {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  
  .article {
    padding: 20px;
    border: 2px solid #ccc;
    border-radius: 5px;
    background: rgb(255, 255, 255, 0.5);
  }

/* Unique Background*/
.scrollcross {
    background-image: url(images/BlogBackground.png);
    background-size: 10%;  
    animation: scroll-zigzag 40s linear infinite, crosspan 4s linear infinite;
    width: 100.1vw;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    clip-path: polygon(100% 0,0 0,0 95%, 2.5% 90%, 5% 95%, 7.5% 90%, 10% 95%, 12.5% 90%, 15% 95%, 17.5% 90%, 20% 95%, 22.5% 90%, 25% 95%, 
                     27.5% 90%, 30% 95%, 32.5% 90%, 35% 95%, 37.5% 90%, 40% 95%, 42.5% 90%, 45% 95%, 47.5% 90%, 50% 95%, 52.5% 90%, 55% 95%, 
                     57.5% 90%, 60% 95%, 62.5% 90%, 65% 95%, 67.5% 90%, 70% 95%, 72.5% 90%, 75% 95%, 77.5% 90%, 80% 95%, 82.5% 90%, 85% 95%, 
                     87.5% 90%, 90% 95%, 92.5% 90%, 95% 95%, 97.5% 90%, 100% 95%);

}  

.scrollcrossoverlay {
    background: rgba(255, 145, 48, 0.7);
}

@keyframes crosspan {
    0% {
        background-position: 0 0;
        
    }
    100% {
        background-position: 188px 188px;
        
    }
}

/* Infinite scrolling animation */
@keyframes scroll-zigzag {
    0% {
        transform: translateX(-100%); /* Start position */
    }
    100% {
        transform: translateX(0%); /* Move by half of the container */
    }
}

.tamerverselogorepro{
    animation: tamloreproanim 3s linear infinite;
}

@keyframes tamloreproanim {
    0%{
        transform: scale(0.9);
    }
    50%{
        transform: scale(0.95);
    }
    100%{
        transform: scale(0.9);
    }
}