.icon:before {
   display: inline-block;
   background-size: 3rem 3rem;
   content: "";
   width: 3rem;
   height: 3rem;
   vertical-align: middle;
}
.big.icon:before {
   background-size: 5rem 5rem;
   width: 5rem;
   height: 5rem;
}
button.icon:before,
var.icon:before {
   width: 2rem;
   height: 2rem;
   background-size:2rem 2rem;
   background-position: 50%;
   background-repeat: no-repeat;
}
var.icon:before {
   background-color: #606060;
}
var.icon.lite:before {
   background-color: transparent;
}
span.icon:before {
   position:relative;
   top:1rem;
   background-size:2rem 2rem;
   width: 2rem;
   margin-top:-50%;
   background-position: 50%;
   background-repeat: no-repeat;
}

input.on_off {
   color: transparent;
   height: 40px;
   width: 40px;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   background-image: url(images/icons/switch_off.svg);
}
input.on_off[data-state="on"],
input.on_off[value="on"] {
   background-image: url(images/icons/switch_on.svg);
}

.icon.add:before { background-image: url(images/icons/add.png); }
.icon.agenda:before { background-image: url(images/icons/agenda.png); }
.icon.alarm_stop:before { background-image: url(images/icons/alarm_stop.png); }
.icon.back:before { background-image: url(images/icons/back.svg); }
.icon.bell:before { background-image: url(images/icons/bell.png); }
.icon.bluetooth:before { background-image: url(images/icons/bluetooth.png); }
.icon.bluetooth_off:before { background-image: url(images/icons/bluetooth_off.png); }
.icon.bluetooth_on:before { background-image: url(images/icons/bluetooth_on.png); }
.icon.bluetooth_xfer:before { background-image: url(images/icons/bluetooth_xfer.png); }
.icon.broken:before { background-image: url(images/icons/broken.svg); }
.icon.broom:before { background-image: url(images/icons/broom.png); }
.icon.camera:before { background-image: url(images/icons/camera.svg); }
.icon.camera_off:before { background-image: url(images/icons/camera_off.svg); }
.icon.cancel:before { background-image: url(images/icons/cancel.png); }
.icon.check:before { background-image: url(images/icons/check.svg); }
.icon.check_off:before { background-image: url(images/icons/check_off.png); }
.icon.check_on:before { background-image: url(images/icons/check_on.png); }
.icon.check_dis:before { background-image: url(images/icons/check_dis.png); }
.icon.circle:before { background-image: url(images/icons/circle.svg); }
.icon.clap:before { background-image: url(images/icons/clap.svg); }
.icon.clap2:before { background-image: url(images/icons/clap2.svg); }
.icon.coins:before { background-image: url(images/icons/coins.png); }
.icon.compile:before { background-image: url(images/icons/compile.png); }
.icon.compose:before { background-image: url(images/icons/compose.png); }
.icon.contacts:before { background-image: url(images/icons/contacts.png); }
.icon.copy:before { background-image: url(images/icons/copy.png); }
.icon.cursorMinus:before { background-image: url(images/icons/cursorMinus.svg); }
.icon.cursorPlus:before { background-image: url(images/icons/cursorPlus.svg); }
.icon.cut:before { background-image: url(images/icons/cut.png); }
.icon.data_2G:before { background-image: url(images/icons/data_2G.png); }
.icon.data_3G:before { background-image: url(images/icons/data_3G.png); }
.icon.data_4G:before { background-image: url(images/icons/data_4G.png); }
.icon.data_E:before { background-image: url(images/icons/data_E.png); }
.icon.data_H:before { background-image: url(images/icons/data_H.png); }
.icon.data_Hp:before { background-image: url(images/icons/data_Hp.png); }
.icon.data_O:before { background-image: url(images/icons/data_O.png); }
.icon.day:before { background-image: url(images/icons/day.png); }
.icon.delete:before { background-image: url(images/icons/delete.png); }
.icon.diary:before { background-image: url(images/icons/calendar.svg); }
.icon.diaryTime:before { background-image: url(images/icons/calendarTime.svg); }
.icon.done:before { background-image: url(images/icons/done.png); }
.icon.doneChk:before { background-image: url(images/icons/doneChk.png); }
.icon.down:before { background-image: url(images/icons/down.png); }
.icon.download:before { background-image: url(images/icons/download.svg); }
.icon.download_off:before { background-image: url(images/icons/download_off.png); }
.icon.earth:before { background-image: url(images/icons/earth.png); }
.icon.edit_contact:before { background-image: url(images/icons/edit_contact.png); }
.icon.edit_list:before { background-image: url(images/icons/edit_list.png); }
.icon.edit_picture:before { background-image: url(images/icons/edit_picture.png); }
.icon.export:before { background-image: url(images/icons/export.svg); }
.icon.flag:before { background-image: url(images/icons/flag.png); }
.icon.forward:before { background-image: url(images/icons/forward.png); }
.icon.graph:before { background-image: url(images/icons/graph.svg); }
.icon.growlet:before { background-image: url(images/icons/growlet.svg); }
.icon.hide:before { background-image: url(images/icons/hide.png); }
.icon.import:before { background-image: url(images/icons/import.svg); }
.icon.in_flight_off:before { background-image: url(images/icons/in_flight_off.png); }
.icon.in_flight_on:before { background-image: url(images/icons/in_flight_on.png); }
.icon.keybd_off:before { background-image: url(images/icons/keybd_off.png); }
.icon.lighting:before { background-image: url(images/icons/lighting.svg); }
.icon.lights:before { background-image: url(images/icons/lights.svg); }
.icon.lock:before { background-image: url(images/icons/lock.png); }
.icon.lozenge:before { background-image: url(images/icons/lozenge.svg); }
.icon.mail:before { background-image: url(images/icons/mail.png); }
.icon.mail_forward:before { background-image: url(images/icons/mail_forward.png); }
.icon.mail_reply:before { background-image: url(images/icons/mail_reply.png); }
.icon.mail_send:before { background-image: url(images/icons/mail_send.png); }
.icon.menu:before { background-image: url(images/icons/menu.png); }
.icon.month:before { background-image: url(images/icons/month.svg); }
.icon.moon1:before { background-image: url(images/icons/moon1.svg); }
.icon.moon2:before { background-image: url(images/icons/moon2.svg); }
.icon.moon3:before { background-image: url(images/icons/moon3.svg); }
.icon.moon4:before { background-image: url(images/icons/moon4.svg); }
.icon.moon5:before { background-image: url(images/icons/moon5.svg); }
.icon.moon6:before { background-image: url(images/icons/moon6.svg); }
.icon.moon7:before { background-image: url(images/icons/moon7.svg); }
.icon.moon8:before { background-image: url(images/icons/moon8.svg); }
.icon.move_file:before { background-image: url(images/icons/move_file.png); }
.icon.move_layout:before { background-image: url(images/icons/move_layout.png); }
.icon.next:before { background-image: url(images/icons/next.png); }
.icon.paste:before { background-image: url(images/icons/paste.png); }
.icon.phone:before { background-image: url(images/icons/phone.png); }
.icon.place:before { background-image: url(images/icons/place.png); }
.icon.previous:before { background-image: url(images/icons/previous.png); }
.icon.radio_off:before { background-image: url(images/icons/radio_off.png); }
.icon.radio_on:before { background-image: url(images/icons/radio_on.png); }
.icon.reboot:before { background-image: url(images/icons/reboot.svg); }
.icon.reload:before { background-image: url(images/icons/reload.svg); }
.icon.remove:before { background-image: url(images/icons/remove.png); }
.icon.reply:before { background-image: url(images/icons/reply.png); }
.icon.reply_all:before { background-image: url(images/icons/reply_all.png); }
.icon.roll_back:before { background-image: url(images/icons/roll_back.png); }
.icon.sampling:before { background-image: url(images/icons/sampling.svg); }
.icon.save:before { background-image: url(images/icons/save.svg); }
.icon.search:before { background-image: url(images/icons/search.png); }
.icon.select_all:before { background-image: url(images/icons/select_all.png); }
.icon.send:before { background-image: url(images/icons/send.png); }
.icon.settings:before { background-image: url(images/icons/settings.svg); }
.icon.settings_on:before { background-image: url(images/icons/settings_on.png); }
.icon.share:before { background-image: url(images/icons/share.png); }
.icon.sms:before { background-image: url(images/icons/sms.png); }
.icon.snooze:before { background-image: url(images/icons/snooze.png); }
.icon.spanner:before { background-image: url(images/icons/spanner.png); }
.icon.square:before { background-image: url(images/icons/square.svg); }
.icon.star_off:before { background-image: url(images/icons/star_off.png); }
.icon.star_on:before { background-image: url(images/icons/star_on.png); }
.icon.switch[data-state="on"]:before { background-image: url(images/icons/switch_on.svg); }
.icon.switch:before { background-image: url(images/icons/switch_off.svg); }
.icon.switch_off:before { background-image: url(images/icons/switch_off.svg); }
.icon.switch_on:before { background-image: url(images/icons/switch_on.svg); }
.icon.sync:before { background-image: url(images/icons/sync.png); }
.icon.today:before { background-image: url(images/icons/today.png); }
.icon.tools:before { background-image: url(images/icons/tools.svg); }
.icon.triangleUp:before { background-image: url(images/icons/triangleUp.svg); }
.icon.triangleDown:before { background-image: url(images/icons/triangleDown.svg); }
.icon.unlock:before { background-image: url(images/icons/unlock.png); }
.icon.up:before { background-image: url(images/icons/up.png); }
.icon.user:before { background-image: url(images/icons/user.png); }
.icon.video:before { background-image: url(images/icons/video.svg); }
.icon.week:before { background-image: url(images/icons/week.png); }
.icon.wifi_off:before { background-image: url(images/icons/wifi_off.png); }
.icon.wifi_on:before { background-image: url(images/icons/wifi_on.png); }
.icon.wiring:before { background-image: url(images/icons/wiring.svg); }