How can I organise my CSS files?

you should use css comments like this:

/* PADDING */
.somestyle {
     padding: 30px;
}

All browsers will ignore the content inside of the /* */ characters.

Check out these presentations from Natbat:

• CSS Systems
• Practical, Maintainable CSS

Take-away points:

• Think in terms of components not pages
• Think about types of thing, not individual things
• Prefer classes to IDs
• Create compoundable classes
• Use descendent selectors to avoid redundant classes
• Keep your selectors as short as possible
• Order your CSS rules loosely by specificity
• Prefer %s for internal layout dimensions

I wrote more on CSS in an answer to What is your preferred style of class & ID naming? here on Doctype

Finally my preferred style is (all in one stylesheet, separate stylesheets for print and IE only):

Stylesheet header (so the next person knows who to contact)

 /* Site and Client name
by: Author name http://author-site.com/
created: 2009-07-31
changed: 2009-08-07
version: 0.5
*/

Basic info/cheatsheet after header (for the next person/you in 6 months)

/* Color scheme:
#50ad6f logo green (base color)
…
Layout:
# Em-based liquid layout:
* 960px base; at 15px = 64em wide
* 60px columns (12px margin + 48px content); 0.8em + 3.2em = 4em
…
Baseline grid:
→baseline of 15px/24px (1em/1.6)
For 1em type:
12px = 0.8em (0.5)
24px = 1.6em (line height)
…
Default font sizes and line-heights:
15px/24px = 1em/1.6em
12px/24px = 0.8em/2
13px/18px = 0.8667em/1.3846 (matches every 4th line)
…
*/

Style grouping titles (general to specific)

/* @group Reset styles */
#Reset .styles .here {…}
/* @end Reset styles */
/* @group Links */
#Link .styles .here {…}
/* @end Links */
/* @group Layout */
#You .get .the .idea {}
/* @end Layout */
Components, Forms, Tools…

Commenting per rule

/* Layout grid (via grid-switcher.js) ← rule/subsection title (if necessary) */
.grid-on #content .wrapper {
    margin-top: 0;
    padding-top: 3.2em;
    background: url(../images/faux-liquid-transparent.png) repeat-y 72.1875% 48px; /* FF ← specific rule notes inline */
    background: url(../images/960grid.png) repeat 0 0, url(../images/faux-liquid-transparent.png) repeat-y 72.1875% 48px; /* Safari */
}  /* todo: remove ← addenda after rule (if necessary) */

If you use multiple files, also add comments like “(→set in 01standard.css)” as necessary.

HTH

I don't see how padding could be a single section, since you will have a lot element with different paddings, so rather organize by the sections (#header, #body, #footer) on the web page (my personal opinion..) Tho having the padding/margin/display properties on top of each block, makes everything a lot easier to read.

Check out w3schools, they explain it all about the css syntax: http://www.w3schools.com/Css/css_syntax.asp