I'm using the ePhoto theme from ElegantThemes at http://sandbox.elitebodybronzing.com. The theme includes multiple style sheets, so I created style.css in my child theme as follows:
/*
Theme Name: ePhoto
Theme URI: http: //www.elegantthemes.com/
Description: Child theme for the ePhoto theme.
Author: Angell EYE
Author URI: http: //www.angelleye.com/
Template: ePhoto
Version: 0.1.0
*/
@import url("../ePhoto/style.css");
@import url("../ePhoto/style-Blue.css");
@import url("../ePhoto/style-Black.css");
@import url("../ePhoto/ie6style.css");
@import url("../ePhoto/ie8style.css");
@import url("../ePhoto/iestyle.css");
I'd like to adjust the top so that it doesn't have so much space. I see that in style-Black.css there is a .logowrap class that sets margin-top to 80px and causes this extra space. I'd like to change that to 20px instead. As such, I add my own .logowrap class into my child theme's style.css file, so it now looks like this:
/*
Theme Name: ePhoto
Theme URI: http: //www.elegantthemes.com/
Description: Child theme for the ePhoto theme.
Author: Angell EYE
Author URI: http: //www.angelleye.com/
Template: ePhoto
Version: 0.1.0
*/
@import url("../ePhoto/style.css");
@import url("../ePhoto/style-Blue.css");
@import url("../ePhoto/style-Black.css");
@import url("../ePhoto/ie6style.css");
@import url("../ePhoto/ie8style.css");
@import url("../ePhoto/iestyle.css");
.logowrap {
float: left;
margin-top: 20px;
width: 950px;
}
However, when I upload and refresh the site this doesn't take effect. FireBug shows it's still reading from style-Black.css.
I also tried to create my own style-Black.css in my child theme, then import only that one parent stylesheet into and add the rule here, but that's not working for me either.
I'm not sure what I'm missing. Any information on this would be greatly appreciated. Thanks!