body {
    margin: 0;
    padding: 0;
    background: linear-gradient(lightblue);
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.bala {
    border-top-left-radius: 1cm;
    border-top-right-radius: 1cm;
    margin: 20px 10px 0 10px;
    padding: 10px;
    background: lightcoral;
    font-size:x-large;
    text-align: center;
}

.vasat {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
    margin: 0 10px 0 10px;
    padding: 20px;
    background: lightgreen;
}

.vasat img {
    max-width: 80%;
    border-radius:15px;
}

.card {
    text-align: center;
    transition:.3s;
}

.card:hover{
transform:translateY(-15px);
}

.python img, .html img, .hoosh img{
    max-width: 60%;
}

.payin {
    border-bottom-left-radius: 1cm;
    border-bottom-right-radius: 1cm;
    margin: 0 10px 20px 10px;
    padding: 1px;
    background: rgb(238, 240, 239);
    text-align: center;
    font-size: small;
}

@media (max-width:600px){
.vasat{
grid-template-columns:repeat(2,1fr);
gap:10px;
padding:10px;
}
}