

/*------------------------------------*\
	RESET
\*------------------------------------*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{
	margin:0;
	padding:0;
}


table{
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img{
	border:0;
}
address,caption,cite,code,dfn,th,var{
	font-style:normal;
	font-weight:normal;
}
caption,th{
	text-align:left;
}
h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight:normal;
}
q:before,q:after{
	content:'';
}
abbr,acronym{
	border:0;
}

/*------------------------------------*\
CASCADING NAV
\*------------------------------------*/
div#masthead #mainnav{
	list-style:none;
	font-weight:bold;
	font: 14px 'Trebuchet MS';
	//margin-top:5px;
	margin-bottom:5px;
	//margin-bottom:10px;
	/* Clear floats */
	float:left;
	width:100%;
	/* Bring the nav above everything else--uncomment if needed.*/
	position:relative;
	z-index:1; // set the layer order

	
}
div#masthead #mainnav li{
	float:left;
	margin-right:5px;
	position:relative;
}


div#masthead #mainnav a{
	display:block;
	padding:5px;
	color:#fff; 
	background:#358CCD;
	text-decoration:none;
	border-top-left-radius: 3px 3px;
	border-top-right-radius: 3px 3px;
	border-bottom-left-radius: 3px 3px;
	border-bottom-right-radius: 3px 3px;
}




div#masthead #mainnav a:hover{
	color:#fff;
	background:#333;
	text-decoration:underline;
}

/*--- DROPDOWN ---*/
div#masthead #mainnav ul{
	background:#fff; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
	background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
	
}
div#masthead #mainnav ul li{
	padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	float:none;
}
div#masthead #mainnav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
div#masthead #mainnav li:hover ul{ /* Display the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
div#masthead #mainnav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#858788;
	text-decoration:underline;
}
div#masthead #mainnav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
	text-decoration:none;

}
div#masthead #mainnav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
	background:#333;
}

/*end cascading nav
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */


/***************************************************SURFWRITER MAIN NAV ***************************************************************/	


	
div#masthead ul#mainnav {
	float: left;
	margin-top: 10px;
	margin-left: 20px;
	font: bold 14px 'Trebuchet MS';
	}

/*	
div#masthead ul#mainnav li {
	float: left;
	background: white;
	text-align: center;
	}
	
div#masthead ul#mainnav li a {
	width: 85px;
	height: 19px;
	display: block;
	background: url('/img/mainnav.gif') no-repeat top left;
	padding-top: 5px;
	color: black;
	}

*/


body.home div#masthead ul#mainnav li.home a {
	background: #333;
	}

body.services div#masthead ul#mainnav li.services a {
	background: #333;
	}

body.products div#masthead ul#mainnav li.products a {
	background: #333;
	}

body.apps div#masthead ul#mainnav li.apps a {
	background: #333;
	}

body.contact div#masthead ul#mainnav li.contact a {
	background: #333;
	}

body.support div#masthead ul#mainnav li.support a {
	background: #333;
	}



/* 	Colors
	light grey: #C2C2C2
	light light grey (content bg); #F6F6F6;
	border grey: #D2D2D2;
	*/

/* requires /scripts/marquee.js */
#marqueecontainer{
position: relative;
width: 300px; /*marquee width */
height: 50px; /*marquee height */
background-color: white;
overflow: hidden;
//border: 3px solid orange;
padding: 2px;
padding-left: 4px;
}

	
#social-icons {position:relative; top:40px; left:625px;}

#call-surfwriter
{
position: absolute;
top: 0px;
left:0px;
}

#linkedin-share-button
{
position: absolute;
top: 25px;
left:0px;
z-index: 2; // set layer depth so links work
}

#facebook-send-button
{
position: absolute;
top: 25px;
left:67px;
z-index: 2; // set layer depth so links work
}

#twitter-share-button
{
position: absolute;
top: 25px;
left:127px;
z-index: 2; // set layer depth so links work
}
#twitter-follow-button
{
position: absolute;
top: 25px;
left:187px;
z-index: 2; // set layer depth so links work
}


#customer-endorsement
{
font-size:17px; 
margin-left:30px; 
margin-right:30px;
font-style:italic;
}

#customer-endorsement a
{
font-size:17px; 
font-style:italic;
}

#customer-attribution
{
font-size:16px; 
margin-left:60px;
font-style:normal;
}


a
{
color: #3B5998;
}

	
/* Compatibility fix, margin and padding clearer */

body, h1, h2, h3, h4, form, input, p, ul, li, a {
	padding: 0;
	margin: 0;
	border: 0;
	list-style-type: none;
	font-family: Arial;
	font-size: 12px;
	text-decoration: none;
	}

/* Wildcard clearer */
* {margin:0;padding:0}

	
body {
	/*background: url('/img/contentwrapperbg.gif') repeat-y center center;*/
	/* background: url('/img/bg_container_wide.gif') top center repeat-y; */
	background: url('/img/blue-gradient-bg.gif') top center repeat-x;
	// background: url('/img/salesforce-consulting-bg.gif') top center repeat-x;
	//background-color: #EEEEEE;
	background-color: #FFFFFF;
	}	

/*80 px high sub-page level header image*/
#crm-consultants  {
	position: relative;
	background: url('/img/salesforce-consulting-services-for-social-enterprise-3.0-980x80.png') no-repeat top left;
	height:80px;
	width:980px; 
	/*text-align:center;*/
	margin-left:10px;
	margin-right:10px;
	z-index: 0;   	
}

/*narrow sub-page level header text*/
#salesforce-consulting-partner h1 
{
position: absolute;
top: 20px;
//font-size: 30px;
font-weight: bold; 
// font-color:#0C71AF;
//font-color: #0C71AF;
color: #3B5998;
left:30px;
}

div#salesforce-consulting-partner h1{
color: #3B5998;
font-size: 25px;
}

a div#salesforce-consulting-partner h1{
color: #3B5998;
}

a:hover div#salesforce-consulting-partner h1{
color: #3B5998;
}

a div#crm-consultants {
color:#0C71AF;
}

a:hover div#crm-consultants{
color:#0C71AF;
}

#opportunity-splitting-revenuecloud
{
margin-left: 10px;
}

#commission-management-for-salesforce-cloudcomp-commission-anything
{
margin-left: 10px;
}


#table1 {text-align:center; 
margin-left:auto; 
margin-right:auto; 
//width:755px;
width:980px;
	border: 1px solid #CCCCCC; 
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	/*border-top: 1px solid #CCCCCC;*/
	border-bottom: 1px solid #CCCCCC;
	background-color: #FFFFFF;
	}
	tr,td {text-align:left;}

#table2 {text-align:center; 
margin-left:auto; 
margin-right:auto; 
//width:460px;
width:630px;
	border: 0px; 
	background-color: #FFFFFF;
	margin-left: 10px;
	padding-right: 10px;
	padding-bottom: 3px;
	}
	tr,td {text-align:left;}

#table3 {text-align:center; 
margin-left:auto; 
margin-right:auto; 
width:755px;
width:970px;
	border: 0px; 
	}
	tr,td {text-align:left;}
  




#headline {  font-family: Arial; 
		font-size: 14px; 
		font-weight: bold; 
		line-height: normal; 
		color: #333; 
		text-decoration: none;
		padding-left: 10px;
		padding-right: 5px;
		padding-bottom: 3px;
		}


#headline h1 {  font-family: Arial; 
		font-size: 14px; 
		font-weight: bold; 
		line-height: normal; 
		color: #333; 
		text-decoration: none;
		padding-left: 0px;
		padding-right: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		}

#headline h1 a {  font-family: Arial; 
		font-size: 14px; 
		font-weight: bold; 
		line-height: normal; 
		color: #333; 
		text-decoration: none;
		}

#headline_wht {  font-family: Arial; 
		font-size: 12px; 
		font-weight: bold; 
		line-height: normal; 
		color: #FFFFFF; 
		text-decoration: none;
		padding-left: 10px;
		padding-top: 3px;
		padding-bottom: 4px;
		padding-top: 5px;
		text-align:center;
		}

	
div#floatclearer {
	clear: both;
	height: 20px;
	color: white;
	}

div#contentwrapper {
background-color: #FFFFFF;
	}
	
div#contentwrapper a:hover {
	text-decoration: underline;
	}


	
/* font content formatting */

h1, h2, h3, h4 {
	font-family: 'Trebuchet MS', sans-serif;
	}
	
h1, h2 {
	font-size: 24px;
	}
	
h3 {
	font-size: 18px;
	color: #454545;
	font-weight: lighter;
	}
	
/* styling for anything in the masthead div */


/****************HEADER CONFIG*********************/
div#mastheadwrapper {
	/*background: black;*/
	/*background-color: #EEEEEE;*/
	
	//width: 785px;
     //more width provides space between main and sub-content
	width: 990px;
	margin: 0 auto;
	height: 240px;
	background-color: #FFFFFF;
	}
	

div#masthead {
	//width: 785px;
//more width provides space between main and sub-content
	width: 990px;
	}
	
div#masthead h1 {
	font-size: 32px;
	font-weight: lighter;
	padding-top: 10px;
	}
	
div#masthead ul#smallnav {
	float: right;
	margin-top: 5px;
	}
	
div#masthead ul#smallnav li {
	float: left;
	padding-left: 5px;
	color: #C2C2C2;
	}
	
div#masthead ul#smallnav li a {
	color: #C2C2C2;
	font-weight: bold;
	}
	
div#masthead ul#smallnav li a:hover {
	color: white;
	}
	
div#masthead p.slogan {
	float: right;
	clear: right;
	margin-top: 5px;
	font-weight: bold;
	}
	
div#masthead p.slogan a {
	color: white;
	}



	
div#masthead div#searchbar {
	float: right;
	clear: right;
	width: 196px;
	height: 28px;
	background: white url('/img/searchbar.gif') no-repeat top left;
	margin-top: 24px;
	}
/*	
div#masthead div#searchbar input {
	float: left;
	margin: 5px 0 0 10px;
	border: 1px solid #D2D2D2;
	}
*/

/*	
div#masthead div#searchbar input.button {
	float: right;
	margin: 3px 5px 0 0;
	width: 50px;
	height: 22px;
	border: 0;
	background: blue url('/img/searchbutton.gif') no-repeat top left;
	color: white;
	font-weight: bold;
	padding-bottom: 3px;
	}
*/
	
div#masthead h3 {
	color: #C2C2C2;
	}
	
/************************************************** main content formatting ***************************************************************/

#maincontent-split-col-left{
position: relative;
//position:left 25px;
//margin-right:10px;
margin-left:10px;
float: left;
width: 315px; /*column width*/
height: 235px; /*column height */
background-color: white;
//overflow: hidden;
//padding: 2px;
//padding-left: 50px;
//z-index: 2; // set layer depth 
}
#maincontent-split-col-right{
position: relative;
//position:left 25px;
//margin-right:10px;
margin-right:10px;
float: right;
width: 315px; /*column width*/
height: 235px; /*column height */
background-color: white;
//overflow: hidden;
//padding: 2px;
//padding-left: 50px;
//z-index: 2; // set layer depth 
}

div#contentwrapper {
	/* width: 755px;*/
	//width: 755px;
	width: 980px;
	margin: 0 auto;
	padding-top: 5px;
	}

div#maincontent {
	/*float: left;*/
	background: #F8F8F8 url('/img/maincontentbg_wht_650px.gif') repeat-y top left;
	/*width: 485px;*/
	//width: 485px;
	width: 650px;
	}

div#maincontent_left_wrapper {
	float: left;
	}

div#maincontent_rt_wrapper {
	float: right;
	}
	
div#maincontent .first {
	background: url('/img/maincontenttopbg_wht_650px.gif') no-repeat top left;
	}
	
div#maincontent .last {
	background: url('/img/maincontentbottombg_wht_650px.gif') no-repeat bottom left;
	}
	
div#contentwrapper p {
	line-height: 24px;
	}

div#maincontent form input {
	border: 1px solid #D2D2D2;
	}
/*	
div#maincontent form input.button {
	//border: 0;
	//background: url('/img/loginbutton.gif') no-repeat top left;
	//float: right;
	//margin-right: 5px;
	//padding-bottom: 3px;
	//height: 22px;
	//width: 59px;
	font-weight: bold;
	//color: white;
	}


*/ 


	input[type=submit] {
	cursor:pointer;
	background:#A0CF6F;
	//border:2px solid #333;
	//padding:5px 15px;
	//cursor:pointer;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	}

input #gobutton{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 25px; /*add some padding to the inside of the button*/
background:#A0CF6F; /*the colour of the button*/
//border:1px solid #33842a; /*required or the default border for the browser will appear*/
//border:2px solid #333;
/*give the button curved corners, alter the size as required*/
//-moz-border-radius: 10px;
//-webkit-border-radius: 10px;
//border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
box-shadow: 0 0 4px rgba(0,0,0, .75);
/*style the text*/
color:#f3f3f3;
font-size:1.1em;
}
/***NOW STYLE THE BUTTON'S HOVER AND FOCUS STATES***/
input#gobutton:hover, input#gobutton:focus{
background-color :#399630; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
box-shadow: 0 0 1px rgba(0,0,0, .75);
}


	
div#maincontent form p.login {
	width: 200px;
	padding-left: 30px;
	height: 30px;
	line-height: 15px;
	}
	
div#maincontent form p strong {
	float: left;
	clear: left;
	}
	
div#maincontent form p input {
	float: right;
	clear: right;
	}

	
/********************************************** subcontent formatting ***********************************************************************/

div#subcontent form, div#subcontent div#links {
	margin-bottom: 20px;
	//width: 252px;
	width: 310px;
	background: url('/img/subcontentbg_wht-310px.gif') repeat-y top left;
	}

div#subcontent_rt_wrapper {
	float: right;
	}

div#subcontent_left_wrapper {
	float: left;
	}
	
div#subcontent p {
	padding: 0;
	padding-left: 10px;
	clear: left;
	}


div#subcontent div#links a{
//color:black;
text-decoration: none;
}

div#subcontent div#links a:hover {
//color:red;
text-decoration: underline;
}

div#subcontent div#level_2_nav {
	margin-bottom: 20px;
	//width: 252px;
	width: 310px;
	background-color: #CCCCCC;
	background: url('/img/subcontentbg_wht-310px.gif') repeat-y top left;
	}

div#subcontent div#level_2_nav a{
color:black;
text-decoration: none;
}

div#subcontent div#level_2_nav a:hover {
color:red;
text-decoration: none;
}


	
div#subcontent form input {
	border: 1px solid #D2D2D2;
	}

/*	
div#subcontent form input.button {
	border: 0;
	background: url('/img/loginbutton.gif') no-repeat top left;
	float: right;
	margin-right: 5px;
	padding-bottom: 3px;
	height: 22px;
	width: 59px;
	font-weight: bold;
	color: white;
	}
*/
	
div#subcontent form p.login {
	width: 200px;
	padding-left: 30px;
	height: 30px;
	line-height: 15px;
	}
	
div#subcontent form p strong {
	float: left;
	clear: left;
	}
	
div#subcontent form p input {
	float: right;
	clear: right;
	}
	
div#subcontent h2 {
	padding-bottom: 10px;
	}

div#subcontent img {
	padding-left: 10px;
	}



	
div#subcontent h2.first, div#subcontent_top  {
	background: url('/img/subcontenttopbg_wht.gif') no-repeat top left;
	}

div#subcontent_top_red  {
	background: url('/img/subcontenttopbg_red.gif') no-repeat top left;
	}

div#subcontent_top_blk  {
	background: url('/img/subcontenttopbg_blk-310px.gif') no-repeat top left;
	}

div#subcontent_top_fb-blue  {
	//background: url('/img/subcontenttopbg_fb-blue-24x310px.gif') no-repeat top left;
	background: url('/img/subcontenttop-blue.gif') no-repeat top left;
	}

	
div#subcontent p.last {
	background: url('/img/subcontentbottombg_wht-310px.gif') no-repeat bottom left;
	}

div#subcontent p.level_2_nav_last {
	background: url('/img/subcontentbottombg.gif') no-repeat bottom left;
	}

	
div#subcontent p.forgotpass {
	float: left;
	}
	
div#subcontent ul li {
	list-style-image: url('/img/listdot.gif');
	margin-left: 50px;
	line-height: 12px;
	padding-bottom: 12px;
	padding-left: 5px;
	}

div#arrowlist ul li {
	list-style-image: url('/img/arrow_3.gif');
	margin-left: 50px;
	line-height: 12px;
	padding-bottom: 5px;
	padding-left: 5px;
	}

div#on {
/* background: url('/img/subcontentbg_wht.gif') repeat-y top left; */
/* background-color: #FFFFFF; */
font-size: 20px;
font-weight: bold; 
font-color: black;
}
	
div#subcontent p.last, div#subcontent div#links p.last {
	color: white;
	height: 10px;
	padding: 0;
	}
	
div#subcontent div#links p {
	padding: 10px 10px;
	}
	
	/* site wide content formatting */
	
h1, h2 {
	padding-top: 5px;
	padding-left: 10px;
	}
	
h3 {
	padding-left: 10px;
	}
	
p {
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 15px;
	padding-bottom: 10px;
	}
	
	
div#footer {
	clear: both;
	border-top: 1px solid #D2D2D2;
	}
	
div#footer p {
	float: left;
	}
	
div#footer p.nfx {
	float: right;
	}

/*get it now button*/
a.button-attention{color:#333;font-size:22px;font-weight:bold;text-decoration:none;}a.button-attention span{background:url("../img/button-sprite.png") no-repeat scroll 0 0 transparent;float:left;}a.button-attention span.lwrap{background-position:left -419px;padding-left:20px;}
a.button-attention span.rwrap{background-position:right -517px;padding-right:19px;}a.button-attention span.wrap{background-position:left -468px;background-repeat:repeat-x;height:44px;padding-right:0;}a.button-attention span.text{background:none repeat scroll 0 0 transparent;line-height:40px;margin:1px 0 0 0;white-space:nowrap;}
a.button-attention:hover{text-indent:0;}a.button-attention:hover span.lwrap{background-position:left -566px;}a.button-attention:hover span.rwrap{background-position:right -664px;}a.button-attention:hover span.wrap{background-position:left -615px;}div.actions{padding:5px 0 0 0;overflow:hidden;clear:both;font-family:Arial,Helvetica,sans-serif;}
	
	