Can I make a page lanscape within a document that is mainly portrait. I have the following relevant css which I want for most of the content:
@page{size:A4;margin: 20mm 20mm 20mm 20mm;}

and I tried to make a class to set a particular page to landscape by
.land{@page {size: A4 landscape;margin: 20mm 20mm 20mm 20mm;}}

but it does not seem to work.

Try using named pages:

@page land {
    size: A4 landscape;
    margin: 20mm
}

.land { page: land }