WordPressのデフォルトテーマ、「Twenty Fourteen」は高機能なテーマなのですが、一歩カスタマイズをしようと思うと、色を変えるだけでも骨が折れます。

カスタマイズしたい場合に使用できるCSSセレクタを紹介しますので、試してみてください。「英字が勝手に大文字になる」や「サイドバーの幅、せまっ」と思った場合にも役立ちますよ。
※IE8以下での表示には対応していません。XPは積極的サポート外です^_^;

• メインカラー
• アクセントカラー（通常時）
• アクセントカラー（マウスオーバー時）
• リンクカラー（通常時）
• リンクカラー（マウスオーバー時）
• メインサイドバー幅
• コンテンツサイドバー幅
• 記事エリア幅
• Alignコンテンツの飛び出し量
• 英字大文字化解除

メインカラー

メインメニューや左サイドバーの背景の色です。デフォルトでは「#000（黒）」になっています。

/* メインカラー */
.site-header,
.menu-toggle,
.hentry .mejs-mediaelement,
.hentry .mejs-container .mejs-controls,
.page-links a,
#secondary,
.content-sidebar .widget_twentyfourteen_ephemera .widget-title:before,
.site-footer,
.featured-content,
.featured-content .entry-header,
.slider-control-paging,
.slider-direction-nav a {
	background-color: #000;/* #000 */
}
.page-links a,
.paging-navigation,
#secondary,
.content-sidebar .widget .widget-title {
	border-color: #000;/* #000 */
}
@media screen and (min-width: 673px) {
	.grid .featured-content .entry-header {
		border-color: #000;/* #000 */
	}
}
@media screen and (min-width: 1008px) {
	.site:before {
		background-color:  #000;/* #000 */
	}
}

アクセントカラー（通常時）

メインメニューの右端にある検索ボタンの背景の色です。デフォルトでは「#24890d（緑）」です。

/* アクセントカラー（通常時） */
button,
.button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.search-toggle,
.hentry .mejs-controls .mejs-time-rail .mejs-time-current,
.hentry .mejs-overlay:hover .mejs-overlay-button,
.widget button,
.widget .button,
.widget input[type="button"],
.widget input[type="reset"],
.widget input[type="submit"],
.widget_calendar tbody a,
.content-sidebar .widget input[type="button"],
.content-sidebar .widget input[type="reset"],
.content-sidebar .widget input[type="submit"],
.slider-control-paging .slider-active:before,
.slider-control-paging .slider-active:hover:before,
.slider-direction-nav a:hover {
	background-color: #24890d;/* #24890d */
}
.paging-navigation .page-numbers.current {
	border-color: #24890d;/* #24890d */
}
@media screen and (min-width: 783px) {
	.primary-navigation ul ul,
	.primary-navigation li:hover > a,
	.primary-navigation li.focus > a {
		background-color: #24890d;/* #24890d */
	}
}
@media screen and (min-width: 1008px) {
	.secondary-navigation ul ul,
	.secondary-navigation li:hover > a,
	.secondary-navigation li.focus > a {
		background-color: #24890d;/* #24890d */
	}
}

アクセントカラー（マウスオーバー時）

メインメニューの右側にある検索ボタンにマウスオーバーした時の色です。デフォルトは「#41a62a（少し明るい緑）」です。

/* アクセントカラー（マウスオーバー時） */
button:hover,
button:focus,
.button:hover,
.button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
.search-toggle:hover,
.search-toggle.active,
.search-box,
.entry-meta .tag-links a:hover,
.entry-meta .tag-links a:hover:before,
.page-links a:hover,
.widget input[type="button"]:hover,
.widget input[type="button"]:focus,
.widget input[type="reset"]:hover,
.widget input[type="reset"]:focus,
.widget input[type="submit"]:hover,
.widget input[type="submit"]:focus,
.widget_calendar tbody a:hover,
.content-sidebar .widget input[type="button"]:hover,
.content-sidebar .widget input[type="button"]:focus,
.content-sidebar .widget input[type="reset"]:hover,
.content-sidebar .widget input[type="reset"]:focus,
.content-sidebar .widget input[type="submit"]:hover,
.content-sidebar .widget input[type="submit"]:focus,
.slider-control-paging a:hover:before {
	background-color: #41a62a;/* #41a62a */
}
.entry-meta .tag-links a:hover:before,
.entry-meta .tag-links a:focus:before,
.entry-meta .tag-links a:hover:before,
.page-links a:hover,
.paging-navigation a:hover {
	border-color: #41a62a;/* #41a62a */
}
@media screen and (min-width: 783px) {
	.primary-navigation ul ul a:hover,
	.primary-navigation ul ul li.focus > a {
		background-color: #41a62a;/* #41a62a */
	}
}
@media screen and (min-width: 1008px) {
	.secondary-navigation ul ul a:hover,
	.secondary-navigation ul ul li.focus > a {
		background-color: #41a62a;/* #41a62a */
	}
}

リンクカラー（通常時）

リンク文字の色です。デフォルトでは「#24890d（緑）」です。

/* リンクカラー（通常時） */
a,
.content-sidebar .widget a {
	color: #24890d;/* #24890d */
}

リンクカラー（マウスオーバー時）

リンク文字にマウスオーバーした時の色です。デフォルトでは「#41a62a（少し明るい緑）」です。

/* リンクカラー（マウスオーバー時） */
a:active,
a:hover,
.site-navigation a:hover,
.entry-title a:hover,
.entry-meta a:hover,
.cat-links a:hover,
.entry-content .edit-link a:hover,
.hentry .mejs-controls .mejs-button button:hover,
.post-navigation a:hover,
.image-navigation a:hover,
.comment-author a:hover,
.comment-list .pingback a:hover,
.comment-list .trackback a:hover,
.comment-metadata a:hover,
.comment-reply-title small a:hover,
.widget a:hover,
.widget-title a:hover,
.widget_twentyfourteen_ephemera .entry-meta a:hover,
.content-sidebar .widget a:hover,
.content-sidebar .widget .widget-title a:hover,
.content-sidebar .widget_twentyfourteen_ephemera .entry-meta a:hover,
.site-info a:hover,
.featured-content a:hover {
	color: #41a62a;/* #41a62a */
}

メインサイドバー幅（左サイドバー）

メインサイドバーの幅です。デフォルトではウィンドウ幅1008px以上の時「122px」、ウィンドウ幅1080px以上の時「162px」となっています。またpaddingが左右に30px設定されています。

いくつかのプロパティの値設定では、左右padding分の60pxを足した値を指定しないといけない箇所がありますので、paddingも変更したい場合にはそれも考慮に入れて値を設定してください。

/* メインサイドバー幅 */
@media screen and (min-width: 673px) {
	#secondary,
	#supplementary {
		padding: 0 30px;/* 0 30px */
	}
	.site-info {
		padding: 15px 30px;/* 15px 30px */
	}
}
@media screen and (min-width: 1008px) {
	.secondary-navigation {
		margin: 0 -30px 48px;/* 0 -30px 48px */
	}
	.secondary-navigation a {
		padding: 10px 30px;/* 10px 30px */
	}

	#secondary {
		width: 122px;/* 122px */
	}
	.site:before,
	.secondary-navigation,
	.secondary-navigation ul ul {
		width: 182px;/* 182px */
	}
	.search-box-wrapper,
	.featured-content {
		padding-left: 182px;/* 182px */
	}
	.site-content {
		margin-left: 182px;/* 182px */
	}
}
@media screen and (min-width: 1080px) {
	#secondary {
		width: 162px;/* 162px */
	}
	.site:before,
	.secondary-navigation,
	.secondary-navigation ul ul {
		width: 222px;/* 222px */
	}
	.site-content,
	.site-main .widecolumn {
		margin-left: 222px;/* 222px */
	}
	.search-box-wrapper,
	.featured-content {
		padding-left: 222px;/* 222px */
	}
}

コンテンツサイドバー幅（右サイドバー）

コンテンツサイドバーの幅です。デフォルトではウィンドウ幅673px以上の時「33.33333333%」、ウィンドウ幅1080px以上の時「29.04761904%」となっています。

paddingも左右に30px設定されているのですが、コンテンツサイドバーのdivはbox-sizingでborder-boxが設定されているので、この33.33333333%には左右のpadding分も含まれます。なので実際に利用できる幅は、（29.04761904% – 60px）となっています。

box-sizing:border-boxとネガティブマージンの設定でこんな配置ができるなんて初めて知りました。

/* コンテンツサイドバー幅 */
@media screen and (min-width: 673px) {
	.site-content {
		margin-right: 33.33333333%;/* 33.33333333% */
	}
	.content-sidebar {
		margin-left: -33.33333333%;/* -33.33333333% */
		width: 33.33333333%;/* 33.33333333% */
	}
}
@media screen and (min-width: 1008px) {
	.site-content {
		margin-right: 29.04761904%;/* 29.04761904% */
	}
	.content-sidebar {
		margin-left: -29.04761904%;/* -29.04761904% */
		width: 29.04761904%;/* 29.04761904% */
	}
}

記事エリア幅

記事タイトルや本文エリアの幅です。コンテンツサイドバーを利用せず左右の余白が大きすぎて気になる場合や、メインサイドバーもしくはコンテンツサイドバーの幅を調整した場合に再設定してください。

デフォルトではウィンドウ幅が小さい場合を基準に、だいぶ小さな値「474px」が設定されています。レスポンシブっぽくするなら「90%」などのパーセント指定をするといいかと思います。

実際の幅はpadding分が追加されるので、あまり100%に近い値を設定せず、90%以下がおすすめです。もしくはメディアクエリを使いましょう。

またメインサイドバーやコンテンツサイドバーを広くした場合には、474pxより小さな値を指定する必要があるかもしれません。

/* 記事エリア幅 */
.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content ,
.post-navigation,
.image-navigation,
.archive-header,
.page-header,
.contributor-info,
.comments-area,
.site-main .mu_register,
.widecolumn > h2,
.widecolumn > form {
	max-width: 474px;/* 474px */
}

Alignコンテンツの飛び出し量

記事内で画像などに左寄せや右寄せを設定した場合、条件によっては画像が記事エリアから飛び出すデザインになっています。

上記の「メインサイドバー幅」や「コンテンツサイドバー幅」、「記事エリア幅」をカスタマイズした場合、このAlignコンテンツの飛び出し量とつじつまが合わなくなり、コンテンツがサイドバーに干渉してしまうことがあります。

ですので、もし各種幅を調整した場合には、このAlignコンテンツの飛び出し量も適宜変更してください。（0を設定すれば無難と言えば無難）

/* Alignコンテンツの飛び出し量（コンテンツサイドバーなし） */
@media screen and (min-width: 810px) {
	.full-width .site-content blockquote.alignleft,
	.full-width .site-content img.size-full.alignleft,
	.full-width .site-content img.size-large.alignleft,
	.full-width .site-content img.size-medium.alignleft,
	.full-width .site-content .wp-caption.alignleft {
		margin-left: -168px;/* -168px */
	}
	.full-width .site-content blockquote.alignright,
	.full-width .site-content img.size-full.alignright,
	.full-width .site-content img.size-large.alignright,
	.full-width .site-content img.size-medium.alignright,
	.full-width .site-content .wp-caption.alignright {
		margin-right: -168px;/* -168px */
	}
}

/* Alignコンテンツの飛び出し量（コンテンツサイドバーあり） */
@media screen and (min-width: 1260px) {
	.site-content blockquote.alignleft {
		margin-left: -18%;/* -18% */
	}
	.site-content blockquote.alignright {
		margin-right: -18%;/* -18% */
	}
}

英字大文字化解除

タイトルやメニュー内の英字がすべて大文字になっている部分です。
text-transformが「uppercase」になっているので、「none」を指定してあげてください。

/* 英字大文字化設定 */
button,
.button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.site-navigation a,
.entry-title,
.entry-meta,
.cat-links,
.entry-meta .tag-links a,
.entry-content th,
.comment-content th,
.entry-content .edit-link,
.page-links,
.post-navigation .meta-nav,
.paging-navigation .page-numbers,
.comment-reply-title,
.comments-title,
.comment-list .reply,
.comment-metadata,
.no-comments,
.comment-navigation,
.widget .widget-title,
.widget_calendar caption,
.widget_twentyfourteen_ephemera .post-format-archive-link,
.content-sidebar .widget .widget-title,
.featured-content .entry-title {
	text-transform: uppercase;/* uppercase */
}
@media screen and (min-width: 783px) {
	.primary-navigation {
		text-transform: uppercase;/* uppercase */
	}
}

以上です。

 

不具合などがありましたら、コメント欄から連絡もらえると助かります。