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

/* =============================================================================
   Services Information lists
   ========================================================================== */
#infoList {
	display: inline-block;
	width: 90%;
}

[class^="infoListItem"] {
	display: inline-block;
 	width: 100%;
	margin-top: 0.5rem;
}

[class^="infobutton infoText_"] {
	float: left;
	width: 1.5rem;
	height: 1.5rem;
	margin-top: 0.6%;
	margin-right: 0.5rem;
	background: url(../images/services/infoButton.png) center center no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
}

[id^="infoText_"] {
	position: absolute;
	display: none;
	max-width: 100%;
	height: auto;
	border: 0.375rem outset #006a00;
	-moz-border-radius: 1rem;
	-webkit-border-radius: 1rem;
	border-radius: 1rem;
	margin: 1.5rem 0 0 1.625rem;
	padding: 0.5rem;
	color: #ffffff;
	font-style: italic;
	font-weight: bold;
	font-size: small;
	z-index: 200;
	background: url(../images/services/overlayJade.png) center top no-repeat;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
}

.infobutton:hover + [id^="infoText_"] {
	display: block;
	max-width: 15.2rem;
}

[class^="infoListItem"] > span {
	float: left;
	max-width: 84%;
}

/* =================    Services Slideshows     =================== */

[id$="_Services"] {
	clear: both;
	display: block;
	max-width: 100%;
}	

[id$="_Services"] div {
	display: block;
	float: left;
}

[id$="_smSlider"] {
	position: relative;
	max-width: 13rem !important;
	height: auto;
	margin: 1.5rem 1rem 0 0;
}

[id$="_smSlider"] > div.cycle-slideshow {
	background: none;
}

[id$="_Desc"] {
	display: block;
	vertical-align: top;
}

[id$="_Desc"] span {
	display: inline-block;
	margin-top: 1rem;
}

/*  *********  Begin Services Standard Operating Procedures Header  *********  */

span.sophdr1, span.sophdr2, span.sophdr3 {
	display: inline-block;
	height: 2rem;
	margin: 0;
	padding: 0;
}

.sophdr1 { width: 9.125rem; }
.sophdr2 { width: 9.75rem; }
.sophdr3 { width: 11.125rem; }

.sophdr1, .sophdr2, .sophdr3 {
	max-width: 100%;
	height: 0;
	background: url(../images/sprites/hdrSOP.png) left top no-repeat;
}

.sophdr1 {
	padding-bottom: 21.9178%;	
	-webkit-background-size: 328.7671% auto;
	-moz-background-size: 328.7671% auto;
	-o-background-size: 328.7671% auto;
	background-size: 328.7671% auto;
}

.sophdr2 {
	padding-bottom: 20.5128%;	
	-webkit-background-size: 307.6923% auto;
	-moz-background-size: 307.6923% auto;
	-o-background-size: 307.6923% auto;
	background-size: 307.6923% auto;
}
.sophdr3 {
	padding-bottom: 17.9775%;	
	-webkit-background-size: 269.6629% auto;
	-moz-background-size: 269.6629% auto;
	-o-background-size: 269.6629% auto;
	background-size: 269.6629% auto;
}

.sophdr1 { background-position: 0 0; } 
.sophdr2 { background-position: 46% 0; }
.sophdr3 { background-position: 100% 0;	}

/*  *********  End Services Standard Operating Procedures Header  *********  */

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

.graphicArt2x		{ width: 18rem; }								/*  tile width:  288px (18rem)		tile height:  32px (2rem)  */
.busAdvert2x		{ width: 27.375rem; }							/*  tile width:  438px (27.375rem)		tile height:  32px (2rem)  */
.specPub2x		{ width: 20.125rem; }							/*  tile width:  322px (20.125rem)		tile height:  32px (2rem)  */
.mktgTool2x		{ width: 15.125rem; }							/*  tile width:  242px (15.125rem)		tile height:  32px (2rem)  */
.signage2x		{ width: 17.875rem; }							/*  tile width:  286px (17.875rem)		tile height:  32px (2rem)  */
.webDev2x			{ width: 16.125rem; }							/*  tile width:  258px (16.125rem)		tile height:  32px (2rem)  */
.photography2x		{ width: 11.875rem; }							/*  tile width:  190px (11.875rem)		tile height:  32px (2rem)  */
.formStationery2x	{ width: 18rem; }								/*  tile width:  288px (18rem)		tile height:  32px (2rem)  */
.archive2x		{ width: 22.5rem; }								/*  tile width:  360px (22.5rem)		tile height:  32px (2rem)  */
.computerService2x	{ width: 16.5rem; }								/*  tile width:  264px (16.5rem)		tile height:  32px (2rem)  */

.graphicArt15x		{ width: 13.5rem; }					/*  2x  X  75%		    tile width:  216px (13.5rem)		tile height:  24px (1.5rem)  */
.busAdvert15x		{ width: 20.25rem; }				/*  2x  X  75%		    tile width:  328.5px (20.5313rem)	tile height:  24px (1.5rem)  */
.specPub15x		{ width: 15.094rem; }				/*  2x  X  75%		    tile width:  241.5px (15.094rem)	tile height:  24px (1.5rem)  */
.mktgTool15x		{ width: 11.3438rem; }				/*  2x  X  75%		    tile width:  181.5px (11.3438rem)	tile height:  24px (1.5rem)  */
.signage15x		{ width: 13.4063rem; }				/*  2x  X  75%		    tile width:  214.5px (13.4063rem)	tile height:  24px (1.5rem)  */
.webDev15x		{ width: 12.0938rem; }				/*  2x  X  75%		    tile width:  193.5px (12.0938rem)	tile height:  24px (1.5rem)  */
.photography15x	{ width: 8.9063rem; }				/*  2x  X  75%		    tile width:  142.5px (8.9063rem)	tile height:  24px (1.5rem)  */
.formStationery15x	{ width: 13.5rem; }					/*  2x  X  75%		    tile width:  216px (13.5rem)		tile height:  24px (1.5rem)  */
.archive15x		{ width: 16.875rem; }				/*  2x  X  75%		    tile width:  270px (16.875rem)		tile height:  24px (1.5rem)  */
.computerService15x	{ width: 12.375rem; }				/*  2x  X  75%		    tile width:  198px (12.375rem)		tile height:  24px (1.5rem)  */

.graphicArt, .busAdvert, .specPub, .mktgTool, .signage, .webDev, .photography, .formStationery, .archive, .computerService {
	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)  */

.graphicArt {
	padding-bottom: 11.1111%;												/*  tile height (32px)  ÷  tile width (288px)  X  100  */
	-webkit-background-size: 622.2222% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 622.2222% auto;
	-o-background-size: 622.2222% auto;
	background-size: 622.2222% auto;
}

.busAdvert {
	padding-bottom: 7.3059%;													/*  tile height (32px)  ÷  tile width (438px)  X  100  */
	-webkit-background-size: 409.1324% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 409.1324% auto;
	-o-background-size: 409.1324% auto;
	background-size: 409.1324% auto;
}

.specPub {
	padding-bottom: 9.9379%;													/*  tile height (32px)  ÷  tile width (322px)  X  100  */
	-webkit-background-size: 556.5217% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 556.5217% auto;
	-o-background-size: 556.5217% auto;
	background-size: 556.5217% auto;
}

.mktgTool {
	padding-bottom: 13.2231%;												/*  tile height (32px)  ÷  tile width (242px)  X  100  */
	-webkit-background-size: 740.4959% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 740.4959% auto;
	-o-background-size: 740.4959% auto;
	background-size: 740.4959% auto;
}

.signage {
	padding-bottom: 11.1888%;												/*  tile height (32px)  ÷  tile width (286px)  X  100  */
	-webkit-background-size: 626.5734% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 626.5734% auto;
	-o-background-size: 626.5734% auto;
	background-size: 626.5734% auto;
}

.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;
}

.photography {
	padding-bottom: 16.5%;													/*  tile height (32px)  ÷  tile width (190px)  X  100  */
	-webkit-background-size: 943.1579% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 943.1579% auto;
	-o-background-size: 943.1579% auto;
	background-size: 943.1579% auto;
}

.formStationery {
	padding-bottom: 11.1111%;												/*  tile height (32px)  ÷  tile width (288px)  X  100  */
	-webkit-background-size: 622.2222% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 622.2222% auto;
	-o-background-size: 622.2222% auto;
	background-size: 622.2222% auto;
}

.archive {
	padding-bottom: 8.7%;													/*  tile height (32px)  ÷  tile width (360px)  X  100  */
	-webkit-background-size: 497.7778% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 497.7778% auto;
	-o-background-size: 497.7778% auto;
	background-size: 497.7778% auto;
}

.computerService {
	padding-bottom: 12.1212%;												/*  tile height (32px)  ÷  tile width (264px)  X  100  */
	-webkit-background-size: 678.7879% auto;									/*  sprite width (1792px)  ÷  tile width  X  100  */
	-moz-background-size: 678.7879% auto;
	-o-background-size: 678.7879% auto;
	background-size: 678.7879% 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)  */
.graphicArt			{ background-position: 0 0; }								/*  0,   0		tile width:  288px  */
.busAdvert			{ background-position: 0 11.1111%; }						/*  0,  32		tile width:  438px  */
.specPub				{ background-position: 0 22.2222%; }						/*  0,  64		tile width:  322px  */
.mktgTool				{ background-position: 0 33.3333%; }						/*  0,  96		tile width:  242px  */
.signage				{ background-position: 0 44.4444%; }						/*  0, 128		tile width:  286px  */
.webDev				{ background-position: 0 55.5555%; }						/*  0, 160		tile width:  258px  */
.photography			{ background-position: 0 66.6667%; }						/*  0, 192		tile width:  190px  */
.formStationery		{ background-position: 0 77.7778%; }						/*  0, 224		tile width:  288px  */
.archive				{ background-position: 0 88.8889%; }						/*  0, 256		tile width:  360px  */
.computerService		{ background-position: 0 100%; }							/*  0, 288		tile width:  264px  */

.graphicArt:visited		{ background-position: 29.7872% 0; }						/*  448,   0  */
.busAdvert:visited		{ background-position: 33.0871% 11.1111%; }					/*  448,  32  */
.specPub:visited		{ background-position: 30.4762% 22.2222%; }					/*  448,  64  */
.mktgTool:visited		{ background-position: 28.9032% 33.3333%; }					/*  448,  96  */
.signage:visited		{ background-position: 29.7477% 44.4444%; }					/*  448, 128  */
.webDev:visited		{ background-position: 29.2047% 55.5555%; }					/*  448, 160  */
.photography:visited	{ background-position: 27.965% 66.6667%; }					/*  448, 192  */
.formStationery:visited	{ background-position: 29.7872% 77.7778%; }					/*  448, 224  */
.archive:visited		{ background-position: 31.2849% 88.8889%; }					/*  448, 256  */
.computerService:visited	{ background-position: 29.3194% 100%; }						/*  448, 288  */

.graphicArt:hover		{ background-position: 59.5745% 0; }						/*  896,   0  */
.busAdvert:hover		{ background-position: 66.1743% 11.1111%; }					/*  896,  32  */
.specPub:hover			{ background-position: 60.9524% 22.2222%; }					/*  896,  64  */
.mktgTool:hover		{ background-position: 57.8065% 33.3333%; }					/*  896,  96  */
.signage:hover			{ background-position: 59.4954% 44.4444%; }					/*  896, 128  */
.webDev:hover			{ background-position: 58.4094% 55.5555%; }					/*  896, 160  */
.photography:hover		{ background-position: 55.93% 66.6667%; }					/*  896, 192  */
.formStationery:hover	{ background-position: 59.5745% 77.7778%; }					/*  896, 224  */
.archive:hover			{ background-position: 62.5698% 88.8889%; }					/*  896, 256  */
.computerService:hover	{ background-position: 58.6387% 100%; }						/*  896, 288  */

.graphicArt:active		{ background-position: 89.3617% 0; }						/*  1344,   0  */
.busAdvert:active		{ background-position: 99.2614% 11.1111%; }					/*  1344,  32  */
.specPub:active		{ background-position: 91.4286% 22.2222%; }					/*  1344,  64  */
.mktgTool:active		{ background-position: 86.7097% 33.3333%; }					/*  1344,  96  */
.signage:active		{ background-position: 89.243% 44.4444%; }					/*  1344, 128  */
.webDev:active			{ background-position: 87.6141% 55.5555%; }					/*  1344, 160  */
.photography:active		{ background-position: 83.8951% 66.6667%; }					/*  1344, 192  */
.formStationery:active	{ background-position: 89.3617% 77.7778%; }					/*  1344, 224  */
.archive:active		{ background-position: 93.8547% 88.8889%; }					/*  1344, 256  */
.computerService:active	{ background-position: 87.9581% 100%; }						/*  1344, 288  */

i.graphicArt			{ background-position: 89.3617% 0; }						/*  1344,   0  */
i.busAdvert			{ background-position: 99.2614% 11.1111%; }					/*  1344,  32  */
i.specPub				{ background-position: 91.4286% 22.2222%; }					/*  1344,  64  */
i.mktgTool			{ background-position: 86.7097% 33.3333%; }					/*  1344,  96  */
i.signage				{ background-position: 89.243% 44.4444%; }					/*  1344, 128  */
i.webDev				{ background-position: 97.5327% 55.5555%; }					/*  1344, 160  */
i.photography			{ background-position: 83.8951% 66.6667%; }					/*  1344, 192  */
i.formStationery		{ background-position: 89.3617% 77.7778%; }					/*  1344, 224  */
i.archive				{ background-position: 93.8547% 88.8889%; }					/*  1344, 256  */
i.computerService		{ background-position: 87.9581% 100%; }						/*  1344, 288  */

i.graphicArt:hover		{ background-position: 89.3617% 0; }						/*  1344,   0  */
i.busAdvert:hover		{ background-position: 99.2614% 11.1111%; }					/*  1344,  32  */
i.specPub:hover		{ background-position: 91.4286% 22.2222%; }					/*  1344,  64  */
i.mktgTool:hover		{ background-position: 86.7097% 33.3333%; }					/*  1344,  96  */
i.signage:hover		{ background-position: 89.243% 44.4444%; }					/*  1344, 128  */
i.webDev:hover			{ background-position: 97.5327% 55.5555%; }					/*  1344, 160  */
i.photography:hover		{ background-position: 83.8951% 66.6667%; }					/*  1344, 192  */
i.formStationery:hover	{ background-position: 89.3617% 77.7778%; }					/*  1344, 224  */
i.archive:hover		{ background-position: 93.8547% 88.8889%; }					/*  1344, 256  */
i.computerService:hover	{ background-position: 87.9581% 100%; }						/*  1344, 288  */

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