Make sure you are using a child theme first.
In your style.css line 107 you have
#logo-area {
padding-bottom: 37px;
position: relative;
text-align: center;
}
p#slogan {
color: #9aa4a4;
font-family: 'Kreon',Arial,sans-serif;
font-size: 15px;
text-shadow: 1px 1px 1px #ffffff;
text-transform: uppercase;
}
changing the text-align:center to left is a good start, this puts the text on the hard left, so add to the p#slogan block:
width: 300px;
text-align: center;
The width is 300px because this is the width of the image.
Suggest that you install a browser inspector like firebug, it shows you how your html is formed and how your css is working. In this case it let me easily readoff theactive css.
Thank you so much. I’d like also to move the slogan a little bit upwards closer to the logo. I’m new to all this so I apperciate all help
Hey there,
The png image itself is pretty large and with lots of blank space, it’s that which is pushing the text down. It would be better to fix the image really.
Another option would be to set a negative margin on the top there, you could that with:
p#slogan {
margin-top:-45px;
}
Hope this helps.
Take care.