design CSS modifications

Hi,

I want to modify my design a little further:
I used "purple" as my base design.
a.) I want to remove the empty space above my logo so that it starts right at the top of the page.
b.) I also want to modify the space in between the pods.

Can you point me to the correct way to achieve this. I know my way around a stylesheet but wanted to get advice before I start tinkering.

Also, I was wondering if there was a way to change the layout of the pods in a selected design. For example, I have selected the Purple design. However I would prefer the pods on the home page to look like the Blue default design (The Blue default design shows the three smaller pods right in a row: Featured Product, About Our store, and Most Popular)

Thanks for your help!
Danielle

for the logo, edit the webassist/themes/Purple/css/purple_styles.css file:

#header {
    padding: 30px 0 0;
}

to:

#header {
    padding: 0;
}

I'm not quite sure what you mean by:
b.) I also want to modify the space in between the pods.

Please prove some more specific details.

changing the layout of the pods for a specific design will not be an easy task, you would be better off using the default layout that has the pods placed the way you want them, then using the design editor to change the look of the design to use the colors from the purple layout.

Regarding b.)

For example:
If you look at the default layout there are three pods right in a row (Featured Product, About Our store, and Most Popular).
I would like to create more white space between and above the pods.

Thanks,
Danielle

in the webassist/themes/Purple/css/purple_styles.css you can add more bottom padding by editing:

#main .content .ps_pod2, #main .content .infoWrapper, #main .content .productWrapper {
margin: 0 0 20px 0;
overflow: hidden;
}


to:
#main .content .ps_pod2, #main .content .infoWrapper, #main .content .productWrapper {
margin: 0 0 40px 0;
overflow: hidden;
}