16pxと24pxの2サイズ用意されています。
適用するclassによって、アイコンの色を切り替えることができます。
カラーミーキット（2カラム）では一部のアイコンCSSのみ実装しているので、使用するアイコンのCSSを以下より選んでテンプレートに追加してください。
<i class="icon-b icon-phone"></i> <!-- 16px 黒アイコンを表示 -->
<i class="icon-w icon-phone"></i> <!-- 16px 白アイコンを表示 -->
<i class="icon-lg-b icon-phone"></i> <!-- 24px 黒アイコンを表示 -->
<i class="icon-lg-w icon-phone"></i> <!-- 24px 白アイコンを表示 -->
カラーミーキットではアイコンに「Entypo」を採用しています。「Entypo」のアイコンはCC BY-SA 3.0のライセンスの基で使用されています。
Pictograms designed by
Daniel Bruce ― Twitter, Dribbble & e-mail
/* 16px black */
.icon-b.icon-note {
background-position: -80px -32px;
}
/* 16px white */
.icon-w.icon-note {
background-position: -80px -32px;
}
/* 24px black */
.icon-lg-b.icon-note {
background-position: -120px -48px;
}
/* 24px white */
.icon-lg-w.icon-note {
background-position: -120px -48px;
}
/* 16px black */
.icon-b.icon-beamed_note {
background-position: -96px -32px;
}
/* 16px white */
.icon-w.icon-beamed_note {
background-position: -96px -32px;
}
/* 24px black */
.icon-lg-b.icon-beamed_note {
background-position: -144px -48px;
}
/* 24px white */
.icon-lg-w.icon-beamed_note {
background-position: -144px -48px;
}
/* 16px black */
.icon-b.icon-new {
background-position: -112px -32px;
}
/* 16px white */
.icon-w.icon-new {
background-position: -112px -32px;
}
/* 24px black */
.icon-lg-b.icon-new {
background-position: -168px -48px;
}
/* 24px white */
.icon-lg-w.icon-new {
background-position: -168px -48px;
}
/* 16px black */
.icon-b.icon-graduation_cap {
background-position: -128px -32px;
}
/* 16px white */
.icon-w.icon-graduation_cap {
background-position: -128px -32px;
}
/* 24px black */
.icon-lg-b.icon-graduation_cap {
background-position: -192px -48px;
}
/* 24px white */
.icon-lg-w.icon-graduation_cap {
background-position: -192px -48px;
}
/* 16px black */
.icon-b.icon-book {
background-position: -144px -32px;
}
/* 16px white */
.icon-w.icon-book {
background-position: -144px -32px;
}
/* 24px black */
.icon-lg-b.icon-book {
background-position: -216px -48px;
}
/* 24px white */
.icon-lg-w.icon-book {
background-position: -216px -48px;
}
/* 16px black */
.icon-b.icon-newspaper {
background-position: -160px -32px;
}
/* 16px white */
.icon-w.icon-newspaper {
background-position: -160px -32px;
}
/* 24px black */
.icon-lg-b.icon-newspaper {
background-position: -240px -48px;
}
/* 24px white */
.icon-lg-w.icon-newspaper {
background-position: -240px -48px;
}
/* 16px black */
.icon-b.icon-bag {
background-position: -176px -32px;
}
/* 16px white */
.icon-w.icon-bag {
background-position: -176px -32px;
}
/* 24px black */
.icon-lg-b.icon-bag {
background-position: -264px -48px;
}
/* 24px white */
.icon-lg-w.icon-bag {
background-position: -264px -48px;
}
/* 16px black */
.icon-b.icon-airplane {
background-position: -192px -32px;
}
/* 16px white */
.icon-w.icon-airplane {
background-position: -192px -32px;
}
/* 24px black */
.icon-lg-b.icon-airplane {
background-position: -288px -48px;
}
/* 24px white */
.icon-lg-w.icon-airplane {
background-position: -288px -48px;
}
/* 16px black */
.icon-b.icon-lifebuoy {
background-position: -208px -32px;
}
/* 16px white */
.icon-w.icon-lifebuoy {
background-position: -208px -32px;
}
/* 24px black */
.icon-lg-b.icon-lifebuoy {
background-position: -312px -48px;
}
/* 24px white */
.icon-lg-w.icon-lifebuoy {
background-position: -312px -48px;
}
/* 16px black */
.icon-b.icon-eye {
background-position: -224px -32px;
}
/* 16px white */
.icon-w.icon-eye {
background-position: -224px -32px;
}
/* 24px black */
.icon-lg-b.icon-eye {
background-position: -336px -48px;
}
/* 24px white */
.icon-lg-w.icon-eye {
background-position: -336px -48px;
}
/* 16px black */
.icon-b.icon-clock {
background-position: -240px -32px;
}
/* 16px white */
.icon-w.icon-clock {
background-position: -240px -32px;
}
/* 24px black */
.icon-lg-b.icon-clock {
background-position: -360px -48px;
}
/* 24px white */
.icon-lg-w.icon-clock {
background-position: -360px -48px;
}
/* 16px black */
.icon-b.icon-mic {
background-position: -256px -32px;
}
/* 16px white */
.icon-w.icon-mic {
background-position: -256px -32px;
}
/* 24px black */
.icon-lg-b.icon-mic {
background-position: -384px -48px;
}
/* 24px white */
.icon-lg-w.icon-mic {
background-position: -384px -48px;
}
/* 16px black */
.icon-b.icon-calendar {
background-position: -272px -32px;
}
/* 16px white */
.icon-w.icon-calendar {
background-position: -272px -32px;
}
/* 24px black */
.icon-lg-b.icon-calendar {
background-position: -408px -48px;
}
/* 24px white */
.icon-lg-w.icon-calendar {
background-position: -408px -48px;
}
/* 16px black */
.icon-b.icon-bolt {
background-position: -288px -32px;
}
/* 16px white */
.icon-w.icon-bolt {
background-position: -288px -32px;
}
/* 24px black */
.icon-lg-b.icon-bolt {
background-position: -432px -48px;
}
/* 24px white */
.icon-lg-w.icon-bolt {
background-position: -432px -48px;
}
/* 16px black */
.icon-b.icon-thunder_cloud {
background-position: -304px -32px;
}
/* 16px white */
.icon-w.icon-thunder_cloud {
background-position: -304px -32px;
}
/* 24px black */
.icon-lg-b.icon-thunder_cloud {
background-position: -456px -48px;
}
/* 24px white */
.icon-lg-w.icon-thunder_cloud {
background-position: -456px -48px;
}
/* 16px black */
.icon-b.icon-droplet {
background-position: -320px -32px;
}
/* 16px white */
.icon-w.icon-droplet {
background-position: -320px -32px;
}
/* 24px black */
.icon-lg-b.icon-droplet {
background-position: -480px -48px;
}
/* 24px white */
.icon-lg-w.icon-droplet {
background-position: -480px -48px;
}
/* 16px black */
.icon-b.icon-cd {
background-position: -336px -32px;
}
/* 16px white */
.icon-w.icon-cd {
background-position: -336px -32px;
}
/* 24px black */
.icon-lg-b.icon-cd {
background-position: -504px -48px;
}
/* 24px white */
.icon-lg-w.icon-cd {
background-position: -504px -48px;
}
/* 16px black */
.icon-b.icon-briefcase {
background-position: -352px -32px;
}
/* 16px white */
.icon-w.icon-briefcase {
background-position: -352px -32px;
}
/* 24px black */
.icon-lg-b.icon-briefcase {
background-position: -528px -48px;
}
/* 24px white */
.icon-lg-w.icon-briefcase {
background-position: -528px -48px;
}
/* 16px black */
.icon-b.icon-air {
background-position: -0px -48px;
}
/* 16px white */
.icon-w.icon-air {
background-position: -0px -48px;
}
/* 24px black */
.icon-lg-b.icon-air {
background-position: -0px -72px;
}
/* 24px white */
.icon-lg-w.icon-air {
background-position: -0px -72px;
}
/* 16px black */
.icon-b.icon-hourglass {
background-position: -16px -48px;
}
/* 16px white */
.icon-w.icon-hourglass {
background-position: -16px -48px;
}
/* 24px black */
.icon-lg-b.icon-hourglass {
background-position: -24px -72px;
}
/* 24px white */
.icon-lg-w.icon-hourglass {
background-position: -24px -72px;
}
/* 16px black */
.icon-b.icon-gauge {
background-position: -32px -48px;
}
/* 16px white */
.icon-w.icon-gauge {
background-position: -32px -48px;
}
/* 24px black */
.icon-lg-b.icon-gauge {
background-position: -48px -72px;
}
/* 24px white */
.icon-lg-w.icon-gauge {
background-position: -48px -72px;
}
/* 16px black */
.icon-b.icon-language {
background-position: -48px -48px;
}
/* 16px white */
.icon-w.icon-language {
background-position: -48px -48px;
}
/* 24px black */
.icon-lg-b.icon-language {
background-position: -72px -72px;
}
/* 24px white */
.icon-lg-w.icon-language {
background-position: -72px -72px;
}
/* 16px black */
.icon-b.icon-network {
background-position: -64px -48px;
}
/* 16px white */
.icon-w.icon-network {
background-position: -64px -48px;
}
/* 24px black */
.icon-lg-b.icon-network {
background-position: -96px -72px;
}
/* 24px white */
.icon-lg-w.icon-network {
background-position: -96px -72px;
}
/* 16px black */
.icon-b.icon-key {
background-position: -80px -48px;
}
/* 16px white */
.icon-w.icon-key {
background-position: -80px -48px;
}
/* 24px black */
.icon-lg-b.icon-key {
background-position: -120px -72px;
}
/* 24px white */
.icon-lg-w.icon-key {
background-position: -120px -72px;
}
/* 16px black */
.icon-b.icon-battery {
background-position: -96px -48px;
}
/* 16px white */
.icon-w.icon-battery {
background-position: -96px -48px;
}
/* 24px black */
.icon-lg-b.icon-battery {
background-position: -144px -72px;
}
/* 24px white */
.icon-lg-w.icon-battery {
background-position: -144px -72px;
}
/* 16px black */
.icon-b.icon-bucket {
background-position: -112px -48px;
}
/* 16px white */
.icon-w.icon-bucket {
background-position: -112px -48px;
}
/* 24px black */
.icon-lg-b.icon-bucket {
background-position: -168px -72px;
}
/* 24px white */
.icon-lg-w.icon-bucket {
background-position: -168px -72px;
}
/* 16px black */
.icon-b.icon-magnet {
background-position: -128px -48px;
}
/* 16px white */
.icon-w.icon-magnet {
background-position: -128px -48px;
}
/* 24px black */
.icon-lg-b.icon-magnet {
background-position: -192px -72px;
}
/* 24px white */
.icon-lg-w.icon-magnet {
background-position: -192px -72px;
}
/* 16px black */
.icon-b.icon-drive {
background-position: -144px -48px;
}
/* 16px white */
.icon-w.icon-drive {
background-position: -144px -48px;
}
/* 24px black */
.icon-lg-b.icon-drive {
background-position: -216px -72px;
}
/* 24px white */
.icon-lg-w.icon-drive {
background-position: -216px -72px;
}
/* 16px black */
.icon-b.icon-cup {
background-position: -160px -48px;
}
/* 16px white */
.icon-w.icon-cup {
background-position: -160px -48px;
}
/* 24px black */
.icon-lg-b.icon-cup {
background-position: -240px -72px;
}
/* 24px white */
.icon-lg-w.icon-cup {
background-position: -240px -72px;
}
/* 16px black */
.icon-b.icon-rocket {
background-position: -176px -48px;
}
/* 16px white */
.icon-w.icon-rocket {
background-position: -176px -48px;
}
/* 24px black */
.icon-lg-b.icon-rocket {
background-position: -264px -72px;
}
/* 24px white */
.icon-lg-w.icon-rocket {
background-position: -264px -72px;
}
/* 16px black */
.icon-b.icon-brush {
background-position: -192px -48px;
}
/* 16px white */
.icon-w.icon-brush {
background-position: -192px -48px;
}
/* 24px black */
.icon-lg-b.icon-brush {
background-position: -288px -72px;
}
/* 24px white */
.icon-lg-w.icon-brush {
background-position: -288px -72px;
}
/* 16px black */
.icon-b.icon-suitcase {
background-position: -208px -48px;
}
/* 16px white */
.icon-w.icon-suitcase {
background-position: -208px -48px;
}
/* 24px black */
.icon-lg-b.icon-suitcase {
background-position: -312px -72px;
}
/* 24px white */
.icon-lg-w.icon-suitcase {
background-position: -312px -72px;
}
/* 16px black */
.icon-b.icon-traffic_cone {
background-position: -224px -48px;
}
/* 16px white */
.icon-w.icon-traffic_cone {
background-position: -224px -48px;
}
/* 24px black */
.icon-lg-b.icon-traffic_cone {
background-position: -336px -72px;
}
/* 24px white */
.icon-lg-w.icon-traffic_cone {
background-position: -336px -72px;
}
/* 16px black */
.icon-b.icon-globe {
background-position: -240px -48px;
}
/* 16px white */
.icon-w.icon-globe {
background-position: -240px -48px;
}
/* 24px black */
.icon-lg-b.icon-globe {
background-position: -360px -72px;
}
/* 24px white */
.icon-lg-w.icon-globe {
background-position: -360px -72px;
}
/* 16px black */
.icon-b.icon-keyboard {
background-position: -256px -48px;
}
/* 16px white */
.icon-w.icon-keyboard {
background-position: -256px -48px;
}
/* 24px black */
.icon-lg-b.icon-keyboard {
background-position: -384px -72px;
}
/* 24px white */
.icon-lg-w.icon-keyboard {
background-position: -384px -72px;
}
/* 16px black */
.icon-b.icon-browser {
background-position: -272px -48px;
}
/* 16px white */
.icon-w.icon-browser {
background-position: -272px -48px;
}
/* 24px black */
.icon-lg-b.icon-browser {
background-position: -408px -72px;
}
/* 24px white */
.icon-lg-w.icon-browser {
background-position: -408px -72px;
}
/* 16px black */
.icon-b.icon-publish {
background-position: -288px -48px;
}
/* 16px white */
.icon-w.icon-publish {
background-position: -288px -48px;
}
/* 24px black */
.icon-lg-b.icon-publish {
background-position: -432px -72px;
}
/* 24px white */
.icon-lg-w.icon-publish {
background-position: -432px -72px;
}
/* 16px black */
.icon-b.icon-progress_3 {
background-position: -304px -48px;
}
/* 16px white */
.icon-w.icon-progress_3 {
background-position: -304px -48px;
}
/* 24px black */
.icon-lg-b.icon-progress_3 {
background-position: -456px -72px;
}
/* 24px white */
.icon-lg-w.icon-progress_3 {
background-position: -456px -72px;
}
/* 16px black */
.icon-b.icon-progress_2 {
background-position: -320px -48px;
}
/* 16px white */
.icon-w.icon-progress_2 {
background-position: -320px -48px;
}
/* 24px black */
.icon-lg-b.icon-progress_2 {
background-position: -480px -72px;
}
/* 24px white */
.icon-lg-w.icon-progress_2 {
background-position: -480px -72px;
}
/* 16px black */
.icon-b.icon-progress_1 {
background-position: -336px -48px;
}
/* 16px white */
.icon-w.icon-progress_1 {
background-position: -336px -48px;
}
/* 24px black */
.icon-lg-b.icon-progress_1 {
background-position: -504px -72px;
}
/* 24px white */
.icon-lg-w.icon-progress_1 {
background-position: -504px -72px;
}
/* 16px black */
.icon-b.icon-progress_0 {
background-position: -352px -48px;
}
/* 16px white */
.icon-w.icon-progress_0 {
background-position: -352px -48px;
}
/* 24px black */
.icon-lg-b.icon-progress_0 {
background-position: -528px -72px;
}
/* 24px white */
.icon-lg-w.icon-progress_0 {
background-position: -528px -72px;
}
/* 16px black */
.icon-b.icon-light_down {
background-position: -0px -64px;
}
/* 16px white */
.icon-w.icon-light_down {
background-position: -0px -64px;
}
/* 24px black */
.icon-lg-b.icon-light_down {
background-position: -0px -96px;
}
/* 24px white */
.icon-lg-w.icon-light_down {
background-position: -0px -96px;
}
/* 16px black */
.icon-b.icon-light_up {
background-position: -16px -64px;
}
/* 16px white */
.icon-w.icon-light_up {
background-position: -16px -64px;
}
/* 24px black */
.icon-lg-b.icon-light_up {
background-position: -24px -96px;
}
/* 24px white */
.icon-lg-w.icon-light_up {
background-position: -24px -96px;
}
/* 16px black */
.icon-b.icon-adjust {
background-position: -32px -64px;
}
/* 16px white */
.icon-w.icon-adjust {
background-position: -32px -64px;
}
/* 24px black */
.icon-lg-b.icon-adjust {
background-position: -48px -96px;
}
/* 24px white */
.icon-lg-w.icon-adjust {
background-position: -48px -96px;
}
/* 16px black */
.icon-b.icon-code {
background-position: -48px -64px;
}
/* 16px white */
.icon-w.icon-code {
background-position: -48px -64px;
}
/* 24px black */
.icon-lg-b.icon-code {
background-position: -72px -96px;
}
/* 24px white */
.icon-lg-w.icon-code {
background-position: -72px -96px;
}
/* 16px black */
.icon-b.icon-monitor {
background-position: -64px -64px;
}
/* 16px white */
.icon-w.icon-monitor {
background-position: -64px -64px;
}
/* 24px black */
.icon-lg-b.icon-monitor {
background-position: -96px -96px;
}
/* 24px white */
.icon-lg-w.icon-monitor {
background-position: -96px -96px;
}
/* 16px black */
.icon-b.icon-infinity {
background-position: -80px -64px;
}
/* 16px white */
.icon-w.icon-infinity {
background-position: -80px -64px;
}
/* 24px black */
.icon-lg-b.icon-infinity {
background-position: -120px -96px;
}
/* 24px white */
.icon-lg-w.icon-infinity {
background-position: -120px -96px;
}
/* 16px black */
.icon-b.icon-light_bulb {
background-position: -96px -64px;
}
/* 16px white */
.icon-w.icon-light_bulb {
background-position: -96px -64px;
}
/* 24px black */
.icon-lg-b.icon-light_bulb {
background-position: -144px -96px;
}
/* 24px white */
.icon-lg-w.icon-light_bulb {
background-position: -144px -96px;
}
/* 16px black */
.icon-b.icon-credit_card {
background-position: -112px -64px;
}
/* 16px white */
.icon-w.icon-credit_card {
background-position: -112px -64px;
}
/* 24px black */
.icon-lg-b.icon-credit_card {
background-position: -168px -96px;
}
/* 24px white */
.icon-lg-w.icon-credit_card {
background-position: -168px -96px;
}
/* 16px black */
.icon-b.icon-database {
background-position: -128px -64px;
}
/* 16px white */
.icon-w.icon-database {
background-position: -128px -64px;
}
/* 24px black */
.icon-lg-b.icon-database {
background-position: -192px -96px;
}
/* 24px white */
.icon-lg-w.icon-database {
background-position: -192px -96px;
}
/* 16px black */
.icon-b.icon-voicemail {
background-position: -144px -64px;
}
/* 16px white */
.icon-w.icon-voicemail {
background-position: -144px -64px;
}
/* 24px black */
.icon-lg-b.icon-voicemail {
background-position: -216px -96px;
}
/* 24px white */
.icon-lg-w.icon-voicemail {
background-position: -216px -96px;
}
/* 16px black */
.icon-b.icon-clipboard {
background-position: -160px -64px;
}
/* 16px white */
.icon-w.icon-clipboard {
background-position: -160px -64px;
}
/* 24px black */
.icon-lg-b.icon-clipboard {
background-position: -240px -96px;
}
/* 24px white */
.icon-lg-w.icon-clipboard {
background-position: -240px -96px;
}
/* 16px black */
.icon-b.icon-cart {
background-position: -176px -64px;
}
/* 16px white */
.icon-w.icon-cart {
background-position: -176px -64px;
}
/* 24px black */
.icon-lg-b.icon-cart {
background-position: -264px -96px;
}
/* 24px white */
.icon-lg-w.icon-cart {
background-position: -264px -96px;
}
/* 16px black */
.icon-b.icon-box {
background-position: -192px -64px;
}
/* 16px white */
.icon-w.icon-box {
background-position: -192px -64px;
}
/* 24px black */
.icon-lg-b.icon-box {
background-position: -288px -96px;
}
/* 24px white */
.icon-lg-w.icon-box {
background-position: -288px -96px;
}
/* 16px black */
.icon-b.icon-ticket {
background-position: -208px -64px;
}
/* 16px white */
.icon-w.icon-ticket {
background-position: -208px -64px;
}
/* 24px black */
.icon-lg-b.icon-ticket {
background-position: -312px -96px;
}
/* 24px white */
.icon-lg-w.icon-ticket {
background-position: -312px -96px;
}
/* 16px black */
.icon-b.icon-rss {
background-position: -224px -64px;
}
/* 16px white */
.icon-w.icon-rss {
background-position: -224px -64px;
}
/* 24px black */
.icon-lg-b.icon-rss {
background-position: -336px -96px;
}
/* 24px white */
.icon-lg-w.icon-rss {
background-position: -336px -96px;
}
/* 16px black */
.icon-b.icon-signal {
background-position: -240px -64px;
}
/* 16px white */
.icon-w.icon-signal {
background-position: -240px -64px;
}
/* 24px black */
.icon-lg-b.icon-signal {
background-position: -360px -96px;
}
/* 24px white */
.icon-lg-w.icon-signal {
background-position: -360px -96px;
}
/* 16px black */
.icon-b.icon-thermometer {
background-position: -256px -64px;
}
/* 16px white */
.icon-w.icon-thermometer {
background-position: -256px -64px;
}
/* 24px black */
.icon-lg-b.icon-thermometer {
background-position: -384px -96px;
}
/* 24px white */
.icon-lg-w.icon-thermometer {
background-position: -384px -96px;
}
/* 16px black */
.icon-b.icon-water {
background-position: -272px -64px;
}
/* 16px white */
.icon-w.icon-water {
background-position: -272px -64px;
}
/* 24px black */
.icon-lg-b.icon-water {
background-position: -408px -96px;
}
/* 24px white */
.icon-lg-w.icon-water {
background-position: -408px -96px;
}
/* 16px black */
.icon-b.icon-scattergram {
background-position: -288px -64px;
}
/* 16px white */
.icon-w.icon-scattergram {
background-position: -288px -64px;
}
/* 24px black */
.icon-lg-b.icon-scattergram {
background-position: -432px -96px;
}
/* 24px white */
.icon-lg-w.icon-scattergram {
background-position: -432px -96px;
}
/* 16px black */
.icon-b.icon-line_graph {
background-position: -304px -64px;
}
/* 16px white */
.icon-w.icon-line_graph {
background-position: -304px -64px;
}
/* 24px black */
.icon-lg-b.icon-line_graph {
background-position: -456px -96px;
}
/* 24px white */
.icon-lg-w.icon-line_graph {
background-position: -456px -96px;
}
/* 16px black */
.icon-b.icon-pie_chart {
background-position: -320px -64px;
}
/* 16px white */
.icon-w.icon-pie_chart {
background-position: -320px -64px;
}
/* 24px black */
.icon-lg-b.icon-pie_chart {
background-position: -480px -96px;
}
/* 24px white */
.icon-lg-w.icon-pie_chart {
background-position: -480px -96px;
}
/* 16px black */
.icon-b.icon-bar_graph {
background-position: -336px -64px;
}
/* 16px white */
.icon-w.icon-bar_graph {
background-position: -336px -64px;
}
/* 24px black */
.icon-lg-b.icon-bar_graph {
background-position: -504px -96px;
}
/* 24px white */
.icon-lg-w.icon-bar_graph {
background-position: -504px -96px;
}
/* 16px black */
.icon-b.icon-area_graph {
background-position: -352px -64px;
}
/* 16px white */
.icon-w.icon-area_graph {
background-position: -352px -64px;
}
/* 24px black */
.icon-lg-b.icon-area_graph {
background-position: -528px -96px;
}
/* 24px white */
.icon-lg-w.icon-area_graph {
background-position: -528px -96px;
}
/* 16px black */
.icon-b.icon-lock {
background-position: -0px -80px;
}
/* 16px white */
.icon-w.icon-lock {
background-position: -0px -80px;
}
/* 24px black */
.icon-lg-b.icon-lock {
background-position: -0px -120px;
}
/* 24px white */
.icon-lg-w.icon-lock {
background-position: -0px -120px;
}
/* 16px black */
.icon-b.icon-lock_open {
background-position: -16px -80px;
}
/* 16px white */
.icon-w.icon-lock_open {
background-position: -16px -80px;
}
/* 24px black */
.icon-lg-b.icon-lock_open {
background-position: -24px -120px;
}
/* 24px white */
.icon-lg-w.icon-lock_open {
background-position: -24px -120px;
}