* { box-sizing: border-box; }

body {
    font-family: "Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif; font-weight:normal;font-style:normal;
    font-size: 1.1em;
    color: #555; line-height: 1.4; position: relative;
    margin-left: 1em;
}

h1, h2 { font-family: 'Karla Regular'; }
h1, h2, h3, h4 { color: #222; line-height: 1.1; margin-bottom: 14px; margin-top: 14px; }
h1 {font-size:44px} h2{font-size:37px} h3{font-size:27px} h4{font-size:23px}

.pageitems { display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px; }
.item { width: 100%; }

nav ul li {
    list-style-type: "+";
    line-height: 1.5;
    font-size: 120%;
    margin-left: 3em;
    padding: 5px;
}

.imgbox { width: 380px; height:270px; }
img.contain { height: 100% ; width: 100%; object-fit: scale-down;}

footer {
    border-top: 1px solid #358bd8;
    margin-top: 1em;
    margin-bottom: 3em;
}

/* Desktop */
@media screen and (min-width: 70em) and (orientation: landscape) {
    body {
        margin: 0 auto 0 8em;
        font-size:1em;
    }
    div.item {
        width: 25%;
    }
}

/* ... other ... */
@media screen and (min-width: 110em) and (orientation: landscape) {
    body {
        margin: 0 auto 0 8em;
        font-size:1.1em;
    }
}