.basic-grid {

    display: grid;
    gap: 20px ;
    
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));

}

body, html{

    height: 100vh;
    overflow-y: flex;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    background: lavender;
}

.card {

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: rgb(128, 128, 128);
    font-size: 30px;
    color: lavender;
    box-shadow: 6px 12px rgb(51, 51, 51);
    height: 100%;
    transition: all 500ms;
    

    background-size: cover;
    background-position: center;
    background-repeat: repeat;
}

.card:hover{
    box-shadow: 3px 6px rgb(92, 92, 92);
    transform: translate(-3px) scale(1.05);
    
}

.nonrepeating {	
    background-image:
            linear-gradient(90deg,
                transparent 27%, 
                rgba(255, 255, 255, 0.3) 27%  29%, 
                transparent 29%  31%, 
                rgba(255, 255, 255, 0.2) 31%  54%, 
                transparent 54%),
            linear-gradient(90deg,
                transparent 11%, 
                rgba(255, 255, 255, 0.2) 11%  17%, 
                transparent 17%  57%, 
                rgba(255, 255, 255, 0.35) 57%  63%, 
                transparent 63%),
            linear-gradient(90deg,  
                transparent 4%,
                rgba(255, 255, 255, 0.15) 4%  9%, 
                transparent 9%  51%, 
                rgba(255, 255, 255, 0.25) 51%  52%, 
                transparent 52% 68%, 
                rgba(255, 255, 255, 0.35) 68%  75%, 
                transparent 75%),
            linear-gradient(90deg, 
                transparent 1%, 
                rgba(255, 255, 255, 0.2) 2%  27%, 
                transparent 27%  64%, 
                rgba(255, 255, 255, 0.5) 64%  95%, 
                transparent 95%),
            linear-gradient(-70deg,
                rgba(78, 55, 128, 1) 0%, 
                rgba(96, 78, 227, 0.5) 100%);	
    
    background-size: 100px 100%, 127px 100%, 159px 100%, 181px 100%, 100% 100%;
        
}	