/*  
Development Name: Arrow Business Solutions
Description: Website for the IT and business consulting firm Arrow Business Solutions.
Version: .9 
Author: Aaron Shupp
URL: http://www.aaronshupp.com ; http://www.arrow-business.com

RELEASE NOTES:

	.9  :	Complete build, prior to having dynamic components integrated
			for planned .net functions.




*/




/* SYSTEM  *********************************************************************************************************/


/* TRANSPARENT PNG & AUTO OVERFLOW Fix */
img, div { behavior: url(../style/iepngfix.htc) !important  }


/* REVIEW HIGHLIGHTS */
#review {	background-color:#FF9; } p.review {	background-color:#FF9;}



/* GLOBAL  *********************************************************************************************************/

body {
	background: url(../_layout/bg_master.jpg) top center repeat-x #BBDDE7;
	text-align: left;
	font-family: "Lucida Grande", "Arial", sans-serif;
	font-weight:normal;
	color: #333;
	min-width: 930px;
	margin: 0 0 30px 0;
}

a {	color: #1a539b; }

a:hover { color: #1a539b; }

img { border: 0px; }



/* WRAPPERS  ********************************************************************************************************/

div.login {
	width: 900px;
	height: 30px;
	z-index: 10;
	margin: 0 auto;
}

#loginWrapper {
	width:180px;
	float:right;
	display: inline;
	z-index: 10;
	position:relative;
}

.loginButton {	
	height: 30px;
	cursor: pointer;
	float: right;
	display: inline;
	z-index: 10;
}
	
.loginContent {	
	height: 80px;
	width: 100%;
	background: #eff7f9;
	display: none;
	float:inherit;
	z-index: 10;
}


div.header {
	background: url(../_layout/bg_header.png) top no-repeat;
	height: 125px;
	width: 900px;
	margin: 0 auto;
	display: block;
	z-index: 0;
}

div.inspiration {
	height: 135px;
	width: 900px;
	display: block;
	margin: 0 auto;
}

div.billboard {
	height: 350px;
	width: 900px;
	display:block;
	overflow:hidden;
	margin: 0 auto;
}

div.footer {
	height: 97px;
	width: 900px;
	display: block;
	margin:0 auto;
}


/* NAVIGATION  ******************************************************************************************************/

div.header_logoSpace {
	width: 300px;
	height: 125px;
	float: left;
	display: inline;
	margin: 0;
}

div.header_navSpace {
	z-index: 0;
	width: 598px; /* 600px */
	height: 125px;
	float: right;
	display: inline;
	margin: 0;
	position: absolute;
}


div.navigation {
	z-index: 0;
	width: 598px;
	height: 35px;
	float: right;
	margin-top: 86px;
	text-transform: uppercase;
	font-weight: bold;	
	font-size: 13px; color: #2c2b2b;
}

div.navigation ul {
	z-index: 0;
	float: right;
	margin: 0; padding: 0;
}

div.navigation li {
	list-style-type: none;
	display: inline;
	float: left;
	margin: 3px 0 0 3px;	
}

div.navigation li a {
	text-decoration: none;  
	display:block;
	background: url(../_nav/nav_buttonGrey.png) center repeat-x;
	background-position: 0px 0px;
	padding: 10px 10px 10px 12px;	
	color: #363636;
}

#navigationBlue a {
	color: #fff;
	background: url(../_nav/nav_buttonBlue.png) center repeat-x;
	background-position: 0px 0px;
}

div.navigation li a:hover { 
	background: url(../_nav/nav_buttonGreen.png) center repeat-x; 
	background-color: #999;
}

#navigationBlue a:hover {
	background: url(../_nav/nav_buttonBlue2.png) center repeat-x;
	background-position: 0px 0px;
}



/* BILLBOARD  ******************************************************************************************************/


.showcaseContainer {
	background:url(../_layout/billboard_BG.png) top center repeat-x;
	position:relative;
	width:900px;
	height:350px;
	overflow:hidden;
	margin: 0 auto;
}

.showcaseOverlay {
	background:url(../_layout/billboard_Overlay.png) top center no-repeat;
	position: absolute;
	width: 900px;
	height: 350px;
	z-index:10;
}

.showcaseOverlay_Controls {
	width: 900px;
	height: 40px;
	padding-top: 15px;
	text-align: right;
}

.showcase_buttons{
	padding:1px;
}

.showcase_buttons span{
	background:url(../_layout/showcaseButton_BG.jpg) top center repeat-x #eeeeee;
	border:#cfcfcf 1px solid;
	color:#000;
	padding:2px 10px;
	cursor:pointer;
	font-size:12px;
	font-weight:bold;
}

.showcase_buttons span.active, .showcase_buttons span:hover{
	background:#e1f0d5;
	border:#cfcfcf 1px solid;
	color:#006495;
	font-weight:bold;
}

#showcase {
	position:absolute;
	z-index: 1;
}

#showcase div {
	width:900px;
	height:350px;
	float:left;
	background:#eee;
	overflow:hidden;
}

#slider {
	width:900px;
	height:350px;
	float:left;
	background:#eee;
	overflow:hidden;
}

.scroll {
	width:900px;
	height:350px;
	float:left;
	background:#eee;
	overflow:hidden;
}

.scrollContainer div.panel {
	width:900px;
	height:350px;
	float:left;
	background:#eee;
	overflow:hidden;
}


/* BODY & CONTENT  ***************************************************************************************************/


#container {
	width: 899px;
	background: url(../_layout/body_bg_complete.png) bottom no-repeat #FFF;
	border-top: 6px solid #333;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 1px solid #cfcfcf;
	margin: 0 auto;
	overflow: hidden;
}

#frontpageContainer {
	width: 899px;
	background: url(../_layout/body_bg_complete.png) bottom no-repeat #FFF;
	border-top: 6px solid #333;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 2px solid #8b8b8b;
	margin: 0 auto;
	overflow: hidden;
}


div.heading {
	height: 60px;
	width: 900px;
	background: #FFF;
	border-bottom: 1px solid #cfcfcf;
}

div.heading h1 {
	font-size: 21px;
	line-height: 1px;
	margin: 0px 0px 25px 75px;
	padding-top: 30px;
}

#heading_Frontpage {
	margin: 0 0 25px 20px;
}


/* COLUMNS  *******************************************************************************************************/


div.col0 {
	width: 900px; 
	padding: 0; 
	background:#FFF;
	height: 100%;
	float: left;
	display: inline;
	margin: 0;
}

div.col1 {
	width: 598px; /* actual width 658 */
	padding: 30px 30px 0 30px;
	height: 100%;
	float: left;
	display: inline;
	margin: 0;
}


div.col2 {
	width: 225px; /* actual width 242px */
	height: 100%;
	float: right;
	padding: 0 0 0 16px; /* 0 0 0 17 original, started causing a page shift for some reason. Adjusted container to hide overflow */
	display: inline;
	margin: 0;
}

/* Website Design and Hosting Columns */

div.colWeb1 {
	width: 340px; /* actual width 400 */
	padding: 30px 30px 0 30px;
	height: 100%;
	float: left;
	display: inline;
	margin: 0;
}


div.colWeb2 {
	width: 480px; /* actual width 500px */
	height: 100%;
	float: right;
	padding: 0 0 0 16px; /* 0 0 0 17 original, started causing a page shift for some reason. Adjusted container to hide overflow */
	display: inline;
	margin: 0;
}

div.colWeb1 p {
	width: 380px;
	font-size: 12px;
	color: #2c2b2b;
	font-weight: normal;
	line-height: 19px;
}

div.colWeb1 h2 {
	width: 380px;
	font-size: 24px;
	color: #2c2b2b;
	font-weight: normal;
	line-height: 19px;
	margin: 25px 0 40px 0;
}


/* COLUMN 0 FRONTPAGE ITEMS */

div.frontpageService {
	width: 224px;
	height: 165px;
	border-right: 1px solid #cfcfcf;
	float: left;
	display: inline;
}

#frontpageService_last {
	border-right: 0px;
}

/* COLUMN 1 CONTENT ITEMS */

p.aboutUs {
	font-size: 13px;
	line-height: 19px;
}

div.service {
	border-bottom: 1px solid #cfcfcf;
	padding-bottom: 30px;
	width: 598px;
}

#serviceLast {
	border-bottom: none;
	margin-bottom: 35px;
}

div.service h1 {
	width: 425px;
	font-size: 15px;
	color: #2c2b2b;
	font-weight: bold;
	line-height: 18px;
	padding: 30px 0 0px 135px;
}

div.service p {
	width: 425px;
	font-size: 12px;
	color: #2c2b2b;
	font-weight: normal;
	line-height: 19px;
	padding: 0 0 0 135px;
}

#service_Microsoft_h1 {
	padding: 30px 0 0 40px;
}

#service_Microsoft_P {
	width: 530px;
	padding: 0 0 0 40px;
}

div.service ul {
	list-style:disc;
	padding: 0 0 0 190px;
}

div.service li {
	font-size: 12px;
	color: #2c2b2b;
	font-weight: normal;
	line-height: 20px;
}


#accordionWrapper {
	width: 250px;
	padding: 0 0 0 135px;
}

.accordionButton {	
	width: 425px;
	height: 30px;
	cursor: pointer;
}
	
.accordionContent {	
	width: 425px;
	display: none;
	font-size: 12px;
	color: #2c2b2b;
	font-weight: normal;
	line-height: 19px;
	margin-top: 30px;
}


/* COLUMN 2 SIDEBAR ITEMS */

div.col2 h1 {
	font-size: 14px;
	color: #898989;
	font-weight: normal;
	line-height: 18px;
	margin-bottom: 15px;
}


/* MODULES  *********************************************************************************************************/

div.mod {
	margin-top: 50px;
}
#mod-FIRST { margin-top: 40px; }
#mod-LAST { margin-bottom: 40px; }

div.mod-serviceFilter_button {
	background: url(../_layout/mod_serviceFilter_bg.png) no-repeat;
	width: 206px;
	height: 34px;
	margin-bottom: 10px;
	color: #555555;
	font-size: 15px;
	font-weight: normal;
	padding: 13px 0 0 10px;
}

p.mod-LearnMore {
	margin-left: 10px;
	font-size: 14px;
	line-height: 20px;
	color: #555;
}

div.mod-servicesList_button {
	height: 45px;
	width: 190px;
	font-size: 13px;
	color: #555;
	border-bottom: 1px solid #cfcfcf;
}

#mod-servicesList_buttonLast {
	border-bottom: none;
}

div.mod-ServiceYouNeed {
	background: url(../_layout/mod-ServiceYouNeed_bg.png) no-repeat;
	height: 76px;
	width: 190px;
}

div.mod-ServiceYouNeed h1 {
	font-size: 14px;
	color: #898989;
	font-weight: normal;
	line-height: 18px;
	padding-top: 40px;
	margin-bottom: 15px;
}


/* CONTACT US FORM CONTROLS  ***************************************************************************************************/

div.contact_textfield {
	width: 455px;
	height: 32px;
}

div.contact_textfield_title {
	width: 105px; /* 120px - 15px padding */
	height: 22px; /* 32px */
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	padding: 10px 15px 0 0;
	float: left;
	display: inline;
	border-right: 1px solid #cfcfcf;
	margin-bottom: 10px;
}

div.contact_textfield_input {
	width: 315px; /* 330px */
	height: 29px; /* 32px */
	padding: 3px 0 0 15px;
	float: right;
	display: inline;
}

.contact_textfield_input input, textarea {
	background:url(../_layout/contact/textfield_bg.png) repeat-x bottom;
	width: 255px;
	height: 22px;
	border: 1px solid #cfcfcf;
	font-size: 14px;
	font-weight: normal;
	color: #1a539b;
	padding: 5px 0 0 5px;
}

.contact_textfield_input1 {
	/*background:url(../_layout/contact/textfield_bg.png) repeat-x bottom;*/
	width: 255px;
	height: 22px;
	border: 1px solid #cfcfcf;
	font-size: 14px;
	font-weight: normal;
	color: #1a539b;
	padding: 5px 0 0 5px;
	margin-left:120px;
	border:0px;
}

div.contact_textArea {
	width: 575px;
	height: 225px;
}

div.contact_textArea_title {
	width: 105px; /* 120px - 15px padding */
	height: 215px; /* 225px */
	text-align: right;
	font-size: 12px;
	font-weight: bold;
	padding: 10px 15px 0 0;
	float: left;
	display: inline;
	border-right: 1px solid #cfcfcf;
	margin-bottom: 10px;
}

div.contact_textArea_input {
	width: 435px; /* 455px */
	height: 215px; /* 225px */
	padding: 3px 0 0 15px;
	float: right;
	display: inline;
}

.contact_textArea_input input, textarea {
	background:url(../_layout/contact/textArea_bg.png) repeat-x bottom;
	width: 430px;
	height: 210px;
	border: 1px solid #cfcfcf;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #1a539b;
	padding: 5px 0 0 5px;
}



/* CALLS TO ACTION  **************************************************************************************************/

#CTA {
	width: 900px;
	height: 250px;
	background: url(../_layout/CTA_bg.png) repeat-y top #FFF;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 1px solid #333;
	border-top: none;
	margin: 0 auto;
	overflow:auto;
}

#AboutUs_CTA {
	width: 900px;
	height: 250px;
	background: url(../_layout/CTA_bg.png) repeat-y top #FFF;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 1px solid #cfcfcf;
	border-top: none;
	margin: 0 auto;
	overflow:auto;
}

#AboutUs_serviceRecap {
	width: 900px;
	height: 224;
	margin: 0 auto;
	border-bottom: 1px solid #333;
	overflow:auto;
}

#WebDesign_Process {
	background:url(../_layout/webdesign_ourProcess.png) top repeat-x;
	width: 900px;
	height: 363px;
	margin: 0 auto;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 1px solid #cfcfcf;
	overflow:auto;
}

div.CTA_Message {
	width: 420px;
	float: left;
	display: inline;
	margin: 0;
	padding: 30px 0 0 30px;
}

div.CTA_Message p {
	width: 380px;
	font-size: 11px;
	line-height: 19px;
	color: #2c2b2b;
}


div.CTA_Testimonial {
	width: 450px;
	float: right;
	display: inline;
	margin: 0;
}

div.CTA_Testimonial h2 {
	padding-top: 50px;
	width: 390px;
	font-size: 20px;
	line-height: 28px;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #1a539b;
	font-weight: normal;
	font-style:italic;
	margin: 0 auto;
}

div.CTA_Testimonial h3 {
	padding: 0px 0 0 250px;
	font-size: 14px;
	line-height: 20px;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #1a539b;
	font-weight: normal;
	font-style:italic;
}


/* JQUERRY "WARM" IMAGE FADING  *******************************************************************************************/

.fade {
  position: absolute;
  top: 100px
  left: 100px
}

.fade div {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}


/* FOOTER  *************************************************************************************************************/

div.signoff {
	background:url(../_layout/footer_bg.png) top center repeat-x #ededed;
	width: 900px;
	height: 55px;
	display: block;
	border-top: 1px solid #cfcfcf;
	border-left: 1px solid #cfcfcf;
	border-right: 1px solid #cfcfcf;
	border-bottom: 2px solid #333;
}

div.footerObjects {
	width: 450px;
	float: left;
	display: inline;
}

div.footerShadow {
	background: url(../_layout/footer_shadow.png);
	width: 900px;
	height: 42px;
	overflow: hidden;
	display: block;
	margin:  0 auto;
}

div.copyright {
	width: 900px;
	text-align: right;
}

div.copyright h3 {
	margin: 15px 20px 0 0;
	font-size: 8px;
	font-weight: bold;
	text-transform: uppercase;
}

/* BODY SHADOW */

div.bodyShadow {
	background: url(../_layout/footer_shadow.png) top;
	width: 900px;
	height: 10px;
	overflow: hidden;
	display: block;
	margin: 0 auto;
}