
/* MENIUL MARE. Grupele curg pe coloane, cate incap, si panoul nu depaseste
   niciodata ecranul. Vezi scripturi/latimi.js pentru masuratori. */
.hx-panel{box-sizing:border-box;align-items:flex-start;
 max-width:calc(100vw - 24px);max-height:calc(100vh - 84px);
 overflow-y:auto;overflow-x:hidden}
#hx-p-dau{width:min(1200px,calc(100vw - 24px))}
.hx-cols{flex:1 1 auto;min-width:0;columns:230px;column-gap:20px}
.hx-cols>.hx-grp{break-inside:avoid;-webkit-column-break-inside:avoid;
 display:block;min-width:0;margin:0 0 16px}
.hx-aside{flex:0 0 auto}
/* Panoul de Servicii are carduri de latime fixa, care la 920 px de ecran
   ieseau din panou. Trec pe randul urmator. */
.hx-scards{flex-wrap:wrap}
/* SERTARUL DE PE TELEFON. Numele daunatorului fugea la marginea din dreapta,
   departe de iconita lui, si se citea ca doua coloane fara legatura. Cauza:
   `.hx-drawer .hx-lnk{justify-content:space-between}`, scrisa pentru
   intrarile care au o explicatie in <em> impinsa la dreapta. Vine dupa
   regula corecta a legaturilor de daunator si, avand aceeasi greutate, i-a
   luat locul. Aici se pune la loc. */
.hx-drawer .hx-plnk{justify-content:flex-start;align-items:center}

/* POZELE DIN TEXT. Cel mult 600 lat si 440 inalt: o poza lata iese 600x401,
   una patrata 440x440. Nu se taie nimic, se micsoreaza pastrand proportia.
   Latimea se pune pe figura, nu pe poza: poza ramane pe width:100% ca sa-si
   rezerve locul inainte sa se incarce, altfel sare pagina sub ochii omului. */
.pfoto,.foto-real{max-width:600px}

/* === ADUSE LA ACEEASI LATIME, 26 august. Gabriel, cu doua capturi la 100%:
   "uite-le diferite... stanga-dreapta e mica" -- paginile de daunatori stau
   pe un container de 868 px, restul site-ului pe ~1160. Doua tipare, doua
   site-uri. Containerul se largeste la 1160; TEXTUL ramane la 820, ca un
   rand de text prea lung oboseste ochiul. Media respira pe toata latimea. */
article>.col{max-width:1160px}
article>.col>p,article>.col>ul,article>.col>ol,article>.col>h2,article>.col>h3,
article>.col>.lead-in,article>.col>.qa,article>.col>table{max-width:820px}

/* Pozele de enciclopedie (figure.pfig): pana azi n-avea nimeni o limita de
   inaltime, si o poza-portret umplea un ecran intreg. Latimea ramane a
   textului; inaltimea se opreste la 480, intreaga, fara taiere. */
figure.pfig{max-width:820px}
figure.pfig img{max-width:100%;width:auto;height:auto;max-height:480px;display:block}

/* Clipurile (figure.vidfig): masurat 762x1356 pe capuse -- un video vertical
   afisat cat doua ecrane. Latimea unui telefon tinut in mana: 480. */
figure.vidfig{max-width:480px}
figure.vidfig video{width:100%;height:auto;display:block}
/* Nu se taie nimic din poza: object-fit:contain o micsoreaza intreaga.
   La o poza de recunoastere a insectei conteaza sa se vada tot animalul. */
.pfoto img,.foto-real img{max-height:440px;object-fit:contain;
 object-position:left top;background:none}
/* Galeria de la dezinfectie auto e o grila: pozele umplu celula, nu se
   retrag in coltul ei. Acolo pagina isi pune singura aspect-ratio 4/3 si
   object-fit:cover; le punem inapoi, fiindca foaia noastra vine ultima in
   pagina si altfel i-ar fi luat locul. */
.foton .foto-real{max-width:none}
.foton .foto-real img{max-height:none;object-fit:cover;object-position:center}
