/*
	Sprites
	========================================
*/

/* ICONS */

/*
	All icons receive the styles of the <i> tag with a base class
	of .i and are then given a unique class to add width, height,
	and background-position. Your resulting HTML will look like
	<i class="icon-inbox"></i>.

	For the white version of the icons, just add the .icon-white class:
	<i class="icon-inbox icon-white"></i>
*/

 [class^="icon-"],
 [class*=" icon-"] {
	 display: inline-block;
	 width: 14px;
	 height: 14px;
	 line-height: 14px;
	 vertical-align: text-top;
	 background-image: var(--icon-sprite-path);
	 background-position: 14px 14px;
	 background-repeat: no-repeat;
	 margin-top: 1px;
 }

 /* White icons with optional class, or on hover/focus/active states of certain elements */
 .icon-white,
 .nav-pills > .active > a > [class^="icon-"],
 .nav-pills > .active > a > [class*=" icon-"],
 .nav-list > .active > a > [class^="icon-"],
 .nav-list > .active > a > [class*=" icon-"],
 .navbar-inverse .nav > .active > a > [class^="icon-"],
 .navbar-inverse .nav > .active > a > [class*=" icon-"],
 .dropdown-menu > li > a:hover > [class^="icon-"],
 .dropdown-menu > li > a:focus > [class^="icon-"],
 .dropdown-menu > li > a:hover > [class*=" icon-"],
 .dropdown-menu > li > a:focus > [class*=" icon-"],
 .dropdown-menu > .active > a > [class^="icon-"],
 .dropdown-menu > .active > a > [class*=" icon-"],
 .dropdown-submenu:hover > a > [class^="icon-"],
 .dropdown-submenu:focus > a > [class^="icon-"],
 .dropdown-submenu:hover > a > [class*=" icon-"],
 .dropdown-submenu:focus > a > [class*=" icon-"] {
	 background-image: var(--icon-white-sprite-path);
 }

 .icon-glass              { background-position: 0      0; }
 .icon-music              { background-position: -24px  0; }
 .icon-search             { background-position: -48px  0; }
 .icon-envelope           { background-position: -72px  0; }
 .icon-heart              { background-position: -96px  0; }
 .icon-star               { background-position: -120px 0; }
 .icon-star-empty         { background-position: -144px 0; }
 .icon-user               { background-position: -168px 0; }
 .icon-film               { background-position: -192px 0; }
 .icon-th-large           { background-position: -216px 0; }
 .icon-th                 { background-position: -240px 0; }
 .icon-th-list            { background-position: -264px 0; }
 .icon-ok                 { background-position: -288px 0; }
 .icon-remove             { background-position: -312px 0; }
 .icon-zoom-in            { background-position: -336px 0; }
 .icon-zoom-out           { background-position: -360px 0; }
 .icon-off                { background-position: -384px 0; }
 .icon-signal             { background-position: -408px 0; }
 .icon-cog                { background-position: -432px 0; }
 .icon-trash              { background-position: -456px 0; }

 .icon-home               { background-position: 0      -24px; }
 .icon-file               { background-position: -24px  -24px; }
 .icon-time               { background-position: -48px  -24px; }
 .icon-road               { background-position: -72px  -24px; }
 .icon-download-alt       { background-position: -96px  -24px; }
 .icon-download           { background-position: -120px -24px; }
 .icon-upload             { background-position: -144px -24px; }
 .icon-inbox              { background-position: -168px -24px; }
 .icon-play-circle        { background-position: -192px -24px; }
 .icon-repeat             { background-position: -216px -24px; }
 .icon-refresh            { background-position: -240px -24px; }
 .icon-list-alt           { background-position: -264px -24px; }
 .icon-lock               { background-position: -287px -24px; } /* 1px off */
 .icon-flag               { background-position: -312px -24px; }
 .icon-headphones         { background-position: -336px -24px; }
 .icon-volume-off         { background-position: -360px -24px; }
 .icon-volume-down        { background-position: -384px -24px; }
 .icon-volume-up          { background-position: -408px -24px; }
 .icon-qrcode             { background-position: -432px -24px; }
 .icon-barcode            { background-position: -456px -24px; }

 .icon-tag                { background-position: 0      -48px; }
 .icon-tags               { background-position: -25px  -48px; } /* 1px off */
 .icon-book               { background-position: -48px  -48px; }
 .icon-bookmark           { background-position: -72px  -48px; }
 .icon-print              { background-position: -96px  -48px; }
 .icon-camera             { background-position: -120px -48px; }
 .icon-font               { background-position: -144px -48px; }
 .icon-bold               { background-position: -167px -48px; } /* 1px off */
 .icon-italic             { background-position: -192px -48px; }
 .icon-text-height        { background-position: -216px -48px; }
 .icon-text-width         { background-position: -240px -48px; }
 .icon-align-left         { background-position: -264px -48px; }
 .icon-align-center       { background-position: -288px -48px; }
 .icon-align-right        { background-position: -312px -48px; }
 .icon-align-justify      { background-position: -336px -48px; }
 .icon-list               { background-position: -360px -48px; }
 .icon-indent-left        { background-position: -384px -48px; }
 .icon-indent-right       { background-position: -408px -48px; }
 .icon-facetime-video     { background-position: -432px -48px; }
 .icon-picture            { background-position: -456px -48px; }

 /* Continue with all the other icons... */