layout - Best way to structure a CSS stylesheet -

i relatively new css , yet seem have got language reasonably newbie. however, whilst many of tutorials have read warn "organising , structuring stylesheet properly" (and can see why have created rather long stylesheets myself) cant life of me find info standardised format styleheet or logical pattern layout makes later human reading easy.

for example, create comment-bracketed section each "geographical" section of page (header, row1, row2, article1 etc) , keep styles section within comment borders? problem seems when have styles re-used in other sections - , putting them under section page-wide styles negates purpose of grouping them section @ all. likewise, structuring stylesheet grouping based on text styles, layout styles etc seems more confusing.

is there "good practice"? know sounds dumb seems no matter html , css ready tell wrong, bad practice or unsemantic , i'm left confused. want code example of work in case employer wants check in future.

i've never been taught, can let know how organise css documents. say, divide "geographical" areas... i.e. rules apply header, side bars, main content, footer, etc. , then, below these add specific rules, if need style form or table on particular page. add "general gubbins" section @ bottom when add generic rules may apply across board.

oh yes, add designer's palette top quick reference.

for example...

/* palette: dark grey : #555555; pink      : #d93575; */  /* header */ #header {...} #header ul {...}  /* side bar */ #side {...} #side ul {....}  /* content */ #content{...} #content p {....}  /* footer */ #footer{...} #footer div {....}  /* forms */ form {...} input {...}  /* general gubbins */ .center {...} strong {...} floatleft {...}