/* Velolaikas 2026-11-11: pages up to 1440px wide on large screens; the product description runs under the photos. */

/* 1440px page, 1400px of content (the gutter is 20px from 1200px up). Was 1200px and 1160px. */
@media(min-width:1200px){
 .container,#header .header-nav>.container,#header .header-top>.container,#wrapper>.container,#footer .footer-container>.container{max-width:1440px}
 :root{--vl-inset:max(var(--vl-gutter),calc((100% - 1400px)/2))}
}

/* Five products and subcategories per row once the wider page has room for them. */
@media(min-width:1400px){
 #subcategories ul.subcategories-list,#products .products,.featured-products .products,.product-accessories .products{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* Description and attachments: the full page width, under the photos and the buy box. */
body#product .vl-product-wide{grid-column:1/-1;min-width:0;font-size:17px}
/* Out of the right column it loses that column's text styles, so they are set here: a large section title,
   smaller group titles, and bulleted grey lists as before. */
#main .vl-product-wide .vl-product-description h2{font-size:32px;margin:0 0 20px}
#main .vl-product-wide .product-description h3{font-size:22px;margin:28px 0 10px}
#main .vl-product-wide .product-description h3:first-child{margin-top:0}
#main .vl-product-wide .product-description ul,#main .vl-product-wide .product-description ol{padding-left:.75rem;list-style-position:inside;margin:0 0 12px}
#main .vl-product-wide .product-description ul{list-style-type:disc}
#main .vl-product-wide .product-description li{font-size:.9375rem;color:inherit;line-height:1.9}
#main .vl-product-wide .product-description img{max-width:100%;height:auto}
#main .page-content.page-cms p,#main .page-content.page-cms ul,#main .page-content.page-cms ol,#main .page-content.page-cms li{color:inherit}
