I am looking to adjust the colors for the following items:

Guest area: "Join us now, it's free!" button and the "Login" button.

Top header menu/user area: "Login" button and the "Create an Account" button.

I thought I had identified the line for the "Join us now, it's free!" button in the ../templates/socialize/css/template.css line 476 but that only changed half the button and only when I hovered. Clearly I am somewhat clueless.

Thanks in advance for your help!

Hi Amber.

Let me pass this thread to our awesome template developer Asraf, I'm sure he'll be able to help you on this problem.

Hi! Just wanted to let you know I am anxiously awaiting a quick update here. I've been reading through the T3 documentation, but didn't find anything there either. Perhaps I missed it? Thanks in advance.

Hi Amber,
I have added "custom.css" file under
"root/templates/socialize/css" directory and placed below css code.
It will override existing style. So if you need to change the color of that button
then please modify the color code as you expected.
After necessary changes you can replace the code at the above location.

.btn-primary, #community-wrap .btn-primary {
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #2a435d;
	background-image: -moz-linear-gradient(top,#2c3e50,#264b6f);
	background-image: -webkit-gradient(linear,0 0,0 100%,from(#2c3e50),to(#264b6f));
	background-image: -webkit-linear-gradient(top,#2c3e50,#264b6f);
	background-image: -o-linear-gradient(top,#2c3e50,#264b6f);
	background-image: linear-gradient(to bottom,#2c3e50,#264b6f);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2c3e50', endColorstr='#ff264a6f', GradientType=0);
	border-color: #264b6f #264b6f #132536;
	border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled], #community-wrap .btn-primary:hover, #community-wrap .btn-primary:focus, #community-wrap .btn-primary:active, #community-wrap .btn-primary.active, #community-wrap .btn-primary.disabled, #community-wrap .btn-primary[disabled] {
color: #fff;
	background-color: #264b6f;
}

Just a quick followup question--

Based on reading I was doing on your sample site, the CSS you've provided, that will actually change the appearance of that button (type/class) across my entire site, yes?

And thanks for including the CSS below. I had to restore my website yesterday and lost your changes.

Hi Amber,
I have updated the above css code again at "root/templates/socialize/css/custom.css"
Thanks