.assortedgrid {
    display: grid;
    grid-template-rows: (1fr);
    grid-template-columns: 0.5fr, 1.5fr;

}
.assortedgrid1 {
    grid-area: 1 / 1 / 2 / 2;
}
.assortedgrid2 {
    grid-area: 1 / 2 / 2 / 3;
}



.setgrid {
    display: grid;
    grid-template-rows: (1fr);
    grid-template-columns: 1.5fr, 0.5fr;
}
.setgrid1 {
    grid-area: 1 / 2 / 2 / 3;
}
.setgrid2 {
    grid-area: 1 / 1 / 2 / 2;
}



.persongrid {
    display: grid;
    grid-template-rows: (1fr);
    grid-template-columns: 0.5fr, 1.5fr;
}
.persongrid1 {
    grid-area: 1 / 1 / 2 / 2;
}
.persongrid2 {
    grid-area: 1 / 2 / 2 / 3;
}

img {
    max-height: 300px;
}

@media all and (max-width: 768px) {
    
    .assortedgrid {
        display: grid;
        grid-template-rows: (1fr, 1fr);
        grid-template-columns: (1fr);
    
    }
    .assortedgrid1 {
        grid-area: 1 / 1 / 2 / 2;
    }
    .assortedgrid2 {
        grid-area: 2 / 1 / 3 / 2;
    }
    
    
    
    .setgrid {
        display: grid;
        grid-template-rows: (1fr, 1fr);
        grid-template-columns: (1fr);
    }
    .setgrid1 {
        grid-area: 1 / 1 / 2 / 2;
    }
    .setgrid2 {
        grid-area: 2 / 1 / 3 / 2;
    }
    
    
    
    .persongrid {
        display: grid;
        grid-template-rows: (1fr, 1fr);
        grid-template-columns: (1fr);
    }
    .persongrid1 {
        grid-area: 1 / 1 / 2 / 2;
    }
    .persongrid2 {
        grid-area: 2 / 1 / 3 / 2;
    }

    img {
        max-width: 200px;
    }





    
}