/*	Rendering Effects v2.0
	Author. Patty Rosol
	
	CONTENTS ----------
	
	   	1.BODY
	   	2.GENERAL
	   	3.TYPOGRAPHY
	   	4.TABLES
	   	5.FORMS
	   	6.LOGO
	   	7.NAVIGATION
	   	8.LAYOUT
	   	9.HOME
       	10.SERVICES
       	11.PORTFOLIO
       	12.ABOUT
		13.CONTACT
		14.FOOTER
		15.SITEMAP
	
    -------------------	*/
	
@import url(reset.css); /* RESET CSS */
@import url(advanced-styles.css); /* MODERN CSS */


/*  1.BODY (Used for general page styles)
==============================================================*/
html, body		{width:100%;}
body			{background:#18120b; color:#5e5855; font:normal 12px/21px Verdana, Arial, Helvetica, sans-serif;}

/*  2.GENERAL
==============================================================*/
.nomargin 		{margin-bottom:0px;}
.left 			{float:left; text-align:left; width:auto;}
.right 			{float:right; width:auto;}
.clearfix 		{clear:both;}
.last			{border-bottom:none!important; margin-bottom:0px!important; margin-right:0px;}
.check			{background:url(../images/check.gif) 0px 4px no-repeat;}
.arrow			{margin:0 0 20px 10px;}
.arrow li		{background:url(../images/arrow.gif) 0px 6px no-repeat; text-indent:15px; padding-bottom:5px;}
.button			{display:inline-block; margin:5px 0px 30px;}
.button a		{background:url(../images/tan_bg.png) repeat; border:1px solid #cfcdc1; color:#383330; font:normal bold 1em Arial, Helvetica, sans-serif; text-transform:uppercase; padding:5px 10px;}
.button a:hover	{border:1px solid #980000; color:#980000; text-decoration:none;}

/*  6.TYPOGRAPHY
==============================================================*/
h1, h2, h3, h4, h5, h6 	{color:#383330; font-family:Arial, Helvetica, sans-serif; margin-bottom:8px;}
h1 a, h2 a, h3 a, h4 a 	{color:#383330;}
h1 				{font-size:1.7em;}
h2 				{font-size:1.5em; font-weight:bold; text-transform:uppercase;}
h3 				{font-size:1.5em;}
h4 				{font-size:1.25em; text-transform:uppercase; font-weight:bold;}
h5 				{font-size:1em; text-transform:uppercase; font-weight:bold;}
h6 				{font-size:.917em;}
a 				{color:#980000; text-decoration:none;}
a:hover 		{color:#980000; text-decoration:underline;}
a.external		{background:url(../images/external.gif) no-repeat right; padding-right:12px;}
p, pre 			{margin-bottom:20px;}
strong 			{color:#383330; font-weight:bold;}
em, dfn 		{color:#383330; font:italic 1.2em "Trebuchet MS", Arial, Helvetica, sans-serif; text-transform:none;}
abbr,acronym 	{color:#353535; border-bottom:1px dashed #868585;}
dfn, dt 		{color:#353535;}
dd 				{margin:0px 0px 0px 10px;}
ol 				{list-style:none; margin:0px 0px 0px -20px;}
ol li			{margin:0 0 0 20px;}
ol li h4		{font-weight:normal; text-transform:none; margin: 0 0 5px 0;}
ol li p			{font:normal 12px/21px Verdana, Arial, Helvetica, sans-serif;}
blockquote span {color:#c2c0b4; font:normal bold 1.5em Georgia, "Times New Roman", Times, serif;}
blockquote p	{margin-bottom:8px;}
div.hr 			{height:20px; width:100%; clear:both;}

/*  4.TABLES
==============================================================*/
table 			{background:url(../images/tan_bg.png) repeat; border:1px solid #fff; color:#383330; margin:0px auto 30px; padding:10px;}
th 				{height:30px; font:normal bold 1.2em Arial, Helvetica, sans-serif; padding-bottom:10px; text-align:center; text-transform:uppercase; }
td 				{height:30px; line-height:30px; padding:4px 0 3px; text-align:center;}
tfoot td 		{border-bottom:none!important; height:30px; line-height:30px; padding-top:10px;}
#hostingtable td.item		{width:190px;}
#designtable td.item		{width:260px;}
#maintenancetable td.item	{width:130px;}
#printtable td.item			{width:130px;}
#pcrepairtable				{width:550px;}
#pcrepairtable td.price		{background:none; width:50px;}
td.info				{border-right:10px solid #e6e5d2; text-align:left;}
td.item 			{border-right:10px solid #e6e5d2; border-bottom:1px solid #e6e5d2; color:#1b1612; text-align:left; padding-right:5px; width:160px;}
td.standard 		{background:url(../images/white_bg.png) repeat; border-right:10px solid #e6e5d2; border-bottom:1px solid #e6e5d2; font:normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif; width:150px;}
td.commerce			{background:url(../images/white_bg.png) repeat; border-bottom:1px solid #e6e5d2; font:normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif; width:150px;}
td.price 			{background:url(../images/white_bg.png) repeat; border-bottom:1px solid #e6e5d2; font:normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif; width:120px;}

/*  5.FORMS
==============================================================*/
legend 					{background:#e5e2cf; border:1px solid #cfcdc1; color:#211d1b; font:normal bold 1.2em Arial, Helvetica, sans-serif; text-transform:uppercase; margin-bottom:10px; padding:5px 6px;}
label					{color:#4e443d; display:block; text-align:left; line-height:2.5em;}
fieldset				{border:1px solid #cfcdc1; margin:0 0 20px; padding:10px 0 10px 25px;}
#dropdowns .drop		{padding:3px;}
#dropdowns select		{width:150px; margin:0 0 15px;}
#dropdowns				{clear:both;}
#checkboxes input		{display:block; float:left; width:auto; margin:8px 0 0 0; padding:0;}
#checkboxes label		{display:block; float:left; width:50%; text-align:right; padding-right:10px;}
textarea				{border:1px solid #cfcdc1; height:150px; margin:0 0 5px; padding:5px; width:95%; overflow:auto;}
textarea:focus			{border:1px solid #18120b;}
input					{border:1px solid #cfcdc1; margin-bottom:5px; padding:5px; width:90%;}
input:focus				{border:1px solid #18120b;}	
input#button			{background:url(../images/submit.png) no-repeat; border:none; cursor:pointer; display:block; width:92px; height:77px; margin-top:20px; text-indent:-9999px;}
input#button:hover		{background-position:0 -77px;}
#prodqty, #photoqty		{overflow:hidden;}

/*-- search form ----------------------*/
.search-frame				{width:920px; padding:10px; overflow:hidden;}
.search						{display:block; position:absolute; right:6px; top:17px; width:250px;}
.search input,
.search textarea			{background:#181206; border:none; color:#e7e5d4; width:98%;}
.search input#button		{background:url(../images/go.png) no-repeat; cursor:pointer; display:block; position:absolute; top:-20px; right:-20px; width:95px; height:80px; margin-top:0px; text-indent:-9999px;}
.search input#button:hover	{background-position:0 -80px;}

/*  6.LOGO
==============================================================*/
#logo				{background:url(../images/logo.png) no-repeat; display:block; position:absolute; left:-80px; top:-5px; width:260px; height:260px; text-indent:-9999px;}
#logo h1			{position:absolute; left:175px; top:20px; height:26px; width:237px;}
#logo h1 a			{background:url(../images/rfx.png) no-repeat; height:26px; width:237px; display:block; text-indent:-9999px;}
#logo h1 a:hover	{background-position:0 -26px;}

/*  7.NAVIGATION (Menu)
==============================================================*/
#nav-wrapper	{width:100%; height:75px;}
#nav			{width:940px; height:75px; position:relative; list-style:none; margin:0 auto; z-index:0;}
#menu 			{position:absolute; right:0px; top:30px; overflow:hidden;}
#menu li 		{float:left; margin:0 0 0 15px; width:auto;}
#menu li a		{font:normal bold 1.25em Arial, Helvetica, sans-serif; text-transform:uppercase; text-decoration:none;}
.menu 			{position:relative; background:url(images/bg.gif) no-repeat; height:45px; width:auto;}
.menu ul 		{z-index:10; position:absolute; z-index:100; padding:10px 5px;}
.menu a, .menu a:active, .menu a:visited {color:#fff; padding:10px 5px;}
.menu a:hover 	{color:#980000;}
#slide 			{position:absolute; bottom:0; height:5px; background:#990000; z-index:10;}
	
/*  8.LAYOUT
==============================================================*/
#wrapper		{background:url(../images/content_bg.png) repeat; width:100%; min-width:1000px;}
#head			{width:940px; height:auto; position:relative; margin:0px auto 30px; padding-top:60px;}
#content		{width:940px; margin:0 auto;}
.wide 			{float:left; width:940px; margin:0px;}
.widebtm		{float:left; width:940px; margin:10px 0px 30px;}
.main 			{border-right:1px solid #cfcdc1; float:left; width:580px; margin:0px 0px 25px; padding-right:30px;}
.sidebar 		{float:right; width:300px; padding-bottom:10px;}
#sub-wrapper	{background:url(../images/sub_bg.jpg) repeat; border-top:#fff 1px solid; border-bottom:#990000 5px solid; width:100%; min-width:1000px;}
#sub			{width:940px; margin:0 auto; padding:20px 0;}
.intro			{color:#383330; font-size:1.45em; line-height:25px; margin-bottom:30px;}
.col33			{float:left; width:33%;}
.col50			{float:left; width:50%;}
.feature		{position:relative;}

/*  9.HOME
==============================================================*/
.featuregrid				{background:url(../images/tan_bg.png) repeat; border:1px solid #fff; float:left; height:209px; width:281px; margin:0 15px 30px 0; padding:10px; overflow:hidden; position:relative;}
.featuregrid.right			{margin:0px 0px 30px 0px;}
.featuregrid img			{position:absolute; top:10px; left:10px; border:0; }
.featuregrid h6				{margin-bottom:0px; padding:5px 12px 0px;} 
.featuregrid p 				{margin-bottom:0px; padding:0px 12px 0px;}			
.featurecaption				{background:#e4e1ce; float:left; position:absolute; height:100px; width:100%;}
.caption .featurecaption	{top:220px; left:0px; width:300px;}

.opportunity			{background:url(../images/opportunity.png) no-repeat; display:block; height:44px; margin:0 0 20px 15px; text-indent:-9999px;}
#partners li a			{cursor:pointer; display:block; height:40px; text-indent:-9999px;}
#partners li a:hover	{display:block;}
.magento				{background:url(../images/magento.png) no-repeat; float:left; width:97px; padding-right:25px;}
.jotform				{background:url(../images/jotform.png) no-repeat; float:left; width:85px; padding-right:25px;}
.wordpress				{background:url(../images/wordpress.png) no-repeat; float:left; width:135px; padding-right:25px;}
.google					{background:url(../images/google.png) no-repeat; float:left; width:61px; padding-right:25px;}
.westhost				{background:url(../images/westhost.png) no-repeat; float:left; width:98px;}

/*  10.SERVICES
==============================================================*/	
#servicesmenu			{color:#1b1612; font:normal 1.25em Arial, Helvetica, sans-serif;  margin-bottom:50px;}
#servicesmenu ul		{list-style:none;}
#servicesmenu li		{padding:3px 5px;}
#servicesmenu a			{border-bottom:1px solid #cfcdc1; color:#1b1612; display:block; padding:5px 0px; text-decoration:none;}
#servicesmenu a:hover	{background:url(../images/arrow.gif) 2px 8px no-repeat; border-bottom:1px solid #cfcdc1; color:#980000; text-indent:15px;}
#servicesmenu .active a	{background:url(../images/arrow.gif) 2px 8px no-repeat; border-bottom:5px solid #990000; color:#980000; text-indent:15px;}

.webdesign			{background:url(../images/webdesign.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}
.ecommerce			{background:url(../images/ecommerce.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}
.seo				{background:url(../images/seo.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}
.graphic			{background:url(../images/graphic.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}
.hosting			{background:url(../images/hosting.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}
.pcrepair			{background:url(../images/pcrepair.png) no-repeat; height:30px; line-height:30px; text-indent:35px;}

.services p			{margin-bottom:35px;}
.magfeatures-col1	{float:left; width:280px; padding-right:30px;}
.magfeatures-col2	{float:left; width:270px;}
.magdemo img		{border:1px solid #cfcdc1; margin:0 0 5px;}
.priceinfo			{margin:-25px 0 30px;}
.priceinfo p		{font:italic 1em "Trebuchet MS", Arial, Helvetica, sans-serif; margin:0px; text-align:center;}

/*  11.PORTFOLIO
==============================================================*/
.folio					{border-bottom:1px solid #cfcdc1; float:left; margin-bottom:20px; padding-bottom:20px; width:940px;}
.folio-info				{float:right; width:300px;}
.foliogrid				{background:url(../images/tan_bg.png) repeat; border:1px solid #fff; float:left; height:300px; width:580px; padding:10px; overflow:hidden; position:relative;}
.foliogrid p 			{color:#383330; padding:11px 15px 5px;}
.foliocaption			{background:#e4e1ce; float:left; position:absolute; height:60px; width:100%;}
.caption .foliocaption 	{top:310px; left:0px; width:600px;}

#slider ul, #slider2 ul, slider3 ul, #slider4 ul, #slider5 ul						
	{float:left; list-style:none; width:auto;}
#slider li, #slider2 li, #slider3 li, #slider4 li, #slider5 li						
	{float:left; width:580px; height:300px; overflow:hidden;}
#controls, #control2, #control3, #control4, #control5					
	{float:right; margin:15px 10px 0px; width:auto;}
#controls li, #control2 li, #control3 li, #control4 li, #control5 li			
	{display:block; float:left; height:22px; width:22px; margin:0 0 0 2px;}
#controls li a, #control2 li a, #control3 li a, #control4 li a, #control5 li a	
	{color:#5e5855; display:inline-block; font:italic 14px/18px "Trebuchet MS", Arial, Helvetica, sans-serif; padding:0 6px; text-decoration:none;}
#controls li.current a, #control2 li.current a, #control3 li.current a, #control4 li.current a, #control5 li.current a
	{color:#980000;}
#controls li.current, #control2 li.current, #control3 li.current, #control4 li.current, #control5 li.current
	{background:url(../images/circle.gif) 0 1px no-repeat; display:block; position:relative;}
#controls li a:focus, #control2 li a:focus, #control3 li a:focus, #control4 li a:focus, #control5 li a:focus
	{outline:none;}	

/*  12.ABOUT
==============================================================*/
.patty 					{clear:both; display:block; margin:-15px 0 30px;}
.eric					{clear:both; display:block;}
.patty h3, .eric h3		{background:url(../images/theteam-h3.png) no-repeat; color:#f0efe5; height:100px; font-weight:bold; margin-bottom:-78px; padding-top:43px; text-indent:46px;}
.patty em, .eric em		{padding:0 0 0 15px; font-size:1.3em;}
.patty img, .eric img	{border:2px solid #18120b; float:left; width:152px; height:190px; margin:0 20px 0 0;}

.social 			{background:url(../images/social_connect.gif) no-repeat top left; float:left; width:200px; height:20px; padding-left:100px; margin:-10px 0 0 0;}
.social .external	{background-image:none;}
.socialicon1 		{background:url(../images/socialmedia_sprite.gif) 0 0 no-repeat; float:left; height:20px; width:20px; margin:0 4px;}
.socialicon2 		{background:url(../images/socialmedia_sprite.gif) -20px 0 no-repeat; float:left; height:20px; width:20px; margin:0 4px;}
.socialicon3 		{background:url(../images/socialmedia_sprite.gif) -40px 0 no-repeat; float:left; height:20px; width:20px; margin:0 4px;}
.socialicon4 		{background:url(../images/socialmedia_sprite.gif) -60px 0 no-repeat; float:left; height:20px; width:20px; margin:0 4px;}

/*  13.CONTACT
==============================================================*/
.phone				{font-size:15px; font-style:italic; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;}
.required em		{color:#980000; font-size:13px;}

/*  13.FAQ
==============================================================*/
.faq 				{margin-top:1em; margin-bottom:2em; clear:left;}
.faq a 				{color:#7e0000; cursor:pointer; display:inline-block; padding:4px 4px 4px 0; width:auto;}
.faq a:hover		{color:#980000;}
.faq .external		{padding-right:12px;}
.faq p				{margin-bottom:15px;}
.faq p a			{padding:0px;}
.faq ul				{margin-bottom:15px;}
.faq div 			{background:url(../images/tan_bg.png) repeat; border:1px solid #fff; margin:5px 0px 20px; padding:10px;}

/*  14.FOOTER
==============================================================*/
#footer-wrapper		{color:#aeb3b6; padding:30px 0px 50px;}
#footer 			{color:#c2c0b4; width:940px; margin:0 auto; text-align:left; position:relative;}
#footer .main		{border-right:none;}
#footer	h4			{color:#fff; margin-bottom:10px;}
#footer a			{color:#c2c0b4;}
#footer a:hover		{color:#980000;}
#footer strong 		{color:#84888a;font-weight:normal;}
#footer .legal			{color:#514c48; display: inline-block; font-size:11px; margin-top:30px;}
#footer .legal a		{color:#645f5b;}
#footer .legal a:hover	{color:#adaba0; text-decoration:blink;}
.author, .date 			{font:normal 12px/21px Verdana, Arial, Helvetica, sans-serif; text-align:right;}
.author em, .date em 	{color:#514c48; font-weight:normal;}
/*-- scroll to top ----------------------*/
p#myAnchor 			{line-height:0%; padding:0; position:absolute; left:0; top:0; }
a.anchorLink 		{background:url(../images/to-top.png) no-repeat; float:right; display:block; position:absolute; right:-30px; top:-120px; width:230px; height:105px; text-indent:-9999px;}
a.anchorLink:hover 	{background-position:0 -105px; }
/*-- testimonial ------------------------*/
#slider-testimonial ul						
	{float:left; list-style:none; width:auto;}
#slider-testimonial li						
	{float:left; width:300px; height:190px; overflow:hidden;}	

/* 15.SITE MAP
==============================================================*/
ul#sitemap 			{list-style:none; margin:20px 0px;}
ul#sitemap li 		{margin:0;}

ul#sitemap li#services 						{float:left; margin:0 100px 30px 0; width:325px; }
ul#sitemap li#services ul 					{list-style:none;}
ul#sitemap li#services ul li a 				{border-bottom:1px solid #cfcdc1; color:#1b1612; display:block; font:normal bold 1em Arial, Helvetica, sans-serif; padding:10px; text-transform:uppercase;}
ul#sitemap li#services ul li a:hover		{border-bottom:1px solid #980000; color:#980000; text-decoration:none;}

ul#sitemap li#portfolio 					{float:left; margin-bottom:15px; position:relative; width:480px; }
ul#sitemap li#portfolio ul 					{list-style:none; margin:0;}
ul#sitemap li#portfolio ul li 				{float:left; height:75px; width:145px; margin:0 15px 15px 0;}
ul#sitemap li#portfolio ul li a 			{border:1px solid #cfcdc1; display:block; height:75px; width:145px;}
ul#sitemap li#portfolio ul li a:hover		{border-color:#980000;}
ul#sitemap li#portfolio ul li span 			{color:#980000; font:italic 1em "Trebuchet MS", Arial, Helvetica, sans-serif; position:absolute; top:0; right:15px; padding-right:2px;}
ul#sitemap li#portfolio p 					{width:350px; height:35px; position:absolute; right:15px; top:0; text-indent:-9999px;}

ul#sitemap li#about 						{clear:both; float:left; margin-right:100px; width:470px;}
ul#sitemap li#about img 					{border:1px solid #18120b; height:100px; width:80px;}
ul#sitemap li#about ul 						{list-style:none; width:80px; float:left; font:normal bold 1em Arial, Helvetica, sans-serif; text-transform:uppercase; margin-right:25px;}
ul#sitemap li#about p	 					{margin-top:18px;}
ul#sitemap li#about ul li a 				{text-decoration:none; color:#544f4c;}
ul#sitemap li#about ul li a:hover			{color:#980000;}

ul#sitemap li#contact 						{float:left; margin-top:-30px; width:350px; }
ul#sitemap li#contact li 					{margin-bottom:15px;}
ul#sitemap li#contact h4 					{margin-top:15px;}