@charset "utf-8";
/* CSS Document */

/*  **********  Begin Header Navigation Links - Services Page  *********  */

.webDev2x { width: 16.125rem; }												/*  tile width:  258px (16.125rem)		tile height:  32px (2rem)  */

.webDev {
	display: block;
	max-width: 100%;
	height: 0;
	background: url(../../images/sprites/portfolio/navsPortfolio.png) left top no-repeat;/*  Text Left, 10 rows (40 tiles), 4 columns  */
}																		/*  sprite width: 1792px (112rem)  sprite height: 320px (20rem)  */

.webDev {
	padding-bottom: 12.4031%;												/*  tile height (32px)  ÷  tile width (258px)  X  100  */
	-webkit-background-size: 694.5736% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 694.5736% auto;
	-o-background-size: 694.5736% auto;
	background-size: 694.5736% auto;
}																		/*  x-pos = 100 X tile left  ÷  abs(tile width - sprite width)  */
																		/*  y-pos = 100 X tile top  ÷  abs(tile height - sprite height [288])  */
																		/*  tile position (left, top) (x,y)  */
i.webDev				{ background-position: 87.6141% 55.5555%; }					/*  1344, 160  */
i.webDev:hover			{ background-position: 87.6141% 55.5555%; }					/*  1344, 160  */

/*  **********  End Headers & Inline Text Navigation Links - Services & Portfolio Pages  *********  */

/*  **********  Begin Headers & Inline Text Navigation Links - Portfolio Web Development Page  *********  */

.webdesign2x			{ width: 13.625rem; }									/*  tile width:  218px (13.625rem)		tile height:  32px (2rem)  */
.webhosting2x			{ width: 21.75rem; }									/*  tile width:  348px (21.75rem)		tile height:  32px (2rem)  */
.webmaintain2x			{ width: 19.25rem; }									/*  tile width:  308px (19.25rem)		tile height:  32px (2rem)  */
.socialnetwork2x		{ width: 23.75rem; }									/*  tile width:  380px (23.75rem)		tile height:  32px (2rem)  */

.webdesign15x			{ width: 10.2188rem; }				/*  2x X 75%			    tile width:  163.5px (10.2188rem)		tile height:  24px (1.5rem)  */
.webhosting15x			{ width: 16.3125rem; }				/*  2x X 75%			    tile width:  261px (16.3125rem)		tile height:  24px (1.5rem)  */
.webmaintain15x		{ width: 14.4375rem; }				/*  2x X 75%			    tile width:  231px (14.4375rem)		tile height:  24px (1.5rem)  */
.socialnetwork15x		{ width: 17.8125rem; }				/*  2x X 75%			    tile width:  285px (17.8125rem)		tile height:  24px (1.5rem)  */

.webdesign, .webhosting, .webmaintain, .socialnetwork {
	display: block;
	max-width: 100%;
	height: 0;
	background: url(../../images/sprites/portfolio/navsfWebDev.png) left top no-repeat;	/*  Text Left, 4 rows (16 tiles), 4 columns  */
}																		/*  sprite width: 1520px (95rem)  sprite height: 128px (8rem)  */

.webdesign {
	padding-bottom: 14.6789%;												/*  tile height (32px)  ÷  tile width (218px)  X  100  */
	-webkit-background-size: 697.2477% auto;									/*  sprite width (1520px)  ÷  tile width  X  100  */									
	-moz-background-size: 697.2477% auto;
	-o-background-size: 697.2477% auto;
	background-size: 697.2477% auto;
}

.webhosting {
	padding-bottom: 9.1954%;													/*  tile height (32px)  ÷  tile width (348px)  X  100  */
	-webkit-background-size: 436.7816% auto;									/*  sprite width (1520px)  ÷  tile width  X  100  */									
	-moz-background-size: 436.7816% auto;
	-o-background-size: 436.7816% auto;
	background-size: 436.7816% auto;
}

.webmaintain {
	padding-bottom: 10.3896%;												/*  tile height (32px)  ÷  tile width (308px)  X  100  */
	-webkit-background-size: 493.5065% auto;									/*  sprite width (1520px)  ÷  tile width  X  100  */									
	-moz-background-size: 493.5065% auto;
	-o-background-size: 493.5065% auto;
	background-size: 493.5065% auto;
}

.socialnetwork {
	padding-bottom: 8.4211%;													/*  tile height (32px)  ÷  tile width (380px)  X  100  */
	-webkit-background-size: 400% auto;										/*  sprite width (1520px)  ÷  tile width  X  100  */									
	-moz-background-size: 400% auto;
	-o-background-size: 400% auto;
	background-size: 400% auto;
}
																		/*  x-pos = 100 X tile left  ÷  abs(tile width - sprite width)  */
																		/*  y-pos = 100 X tile top  ÷  abs(tile height - sprite height [96])  */
																		/*  tile position (left, top) (x,y)  */
.webdesign			{ background-position: 0 0; }								/*  0,  0  		tile width:  218px  */
.webhosting			{ background-position: 0 33.3333%; }						/*  0, 32  		tile width:  348px  */
.webmaintain			{ background-position: 0 66.6667%; }						/*  0, 64  		tile width:  308px  */
.socialnetwork			{ background-position: 0 100%; }							/*  0, 96  		tile width:  380px  */

.webdesign:visited		{ background-position: 29.1859% 0; }						/*  380,  0  */
.webhosting:visited		{ background-position: 32.4232% 33.3333%; }					/*  380, 32  */
.webmaintain:visited	{ background-position: 31.3531% 66.6667%; }					/*  380, 64  */
.socialnetwork:visited	{ background-position: 33.3333% 100%; }						/*  380, 96  */

.webdesign:hover		{ background-position: 58.3717% 0; }						/*  760,  0  */
.webhosting:hover		{ background-position: 64.8464% 33.3333%; }					/*  760, 32  */
.webmaintain:hover		{ background-position: 62.7063% 66.6667%; }					/*  760, 64  */
.socialnetwork:hover	{ background-position: 66.6667% 100%; }						/*  760, 96  */

.webdesign:active		{ background-position: 87.5576% 0; }						/*  1140,  0  */
.webhosting:active		{ background-position: 97.2696% 33.3333%; }					/*  1140, 32  */
.webmaintain:active		{ background-position: 94.0594% 66.6667%; }					/*  1140, 64  */
.socialnetwork:active	{ background-position: 100% 100%; }						/*  1140, 96  */

/*  SAME AS :ACTIVE  */

i.webdesign			{ background-position: 87.5576% 0; }						/*  1140,  0  */
i.webhosting			{ background-position: 97.2696% 33.3333%; }					/*  1140, 32  */
i.webmaintain			{ background-position: 94.0594% 66.6667%; }					/*  1140, 64  */
i.socialnetwork		{ background-position: 100% 100%; }						/*  1140, 96  */

i.webdesign:hover		{ background-position: 87.5576% 0; }						/*  1140,  0  */
i.webhosting:hover		{ background-position: 97.2696% 33.3333%; }					/*  1140, 32  */
i.webmaintain:hover		{ background-position: 94.0594% 66.6667%; }					/*  1140, 64  */
i.socialnetwork:hover	{ background-position: 100% 100%; }						/*  1140, 96  */

/*  **********  End Headers & Inline Text Navigation Links - Portfolio Web Development Page  *********  */