body {background-color:#f6f7e6;font-family:verdana,arial;font-size:.78em;margin:0;padding:0;line-height:1.5em;}

#page_container    {margin:auto;width:898px;padding:0;background: url("img_vivacity_bg_nav.gif");background-repeat:repeat-y;background-color:#fff;}
#page_container_hp {margin:auto;width:898px;padding:0;background-color:#fff;}
#content           {padding:0 18px 0 0;margin:0 0 0 210px;}
#content_360       {
	padding:0;
	margin:0 0 0 240px;
}
#content_360_main {
	float:left;
	width: 450px;
	padding-left: 20px;
}
#content #indent {
	padding-left:33px;
}
#content_hp        {padding:0 0 0 0;margin:0;background-color:#fff;}

/*global styles*/
h1        {color:#580f8b;font-size:135%;margin:30px 0 20px 0;}
h2        {
	color:#6093bb;
	font-size:110%;
	font-weight:bold;
}
h3        {color:#666;font-weight:bold;font-size:100%;}
h4        {color:#000;font-weight:bold;font-size:90%;margin-top:0px;}
a img     {border:0;}
ul strong {color:#580f8b;}
ul li     {margin:15px 0 15px 15px;padding:0;}

/* header styles*/
#header             {background-color:#fff;border-bottom:5px solid #c3ce59;margin:0;padding:0;line-height:0;}
#header_hp          {background-color:#fff;margin:0;padding:0;border-bottom:5px solid #c3ce59;line-height:0;}
#logo               {margin:0;padding:0;background-color:#fff;}
#top_share     		{ float: right; width:300px;line-height:1.2; margin-top:5px; margin-bottom:10px; margin-right: 10px; text-align:right;}
.top				{font-size:90%; }
#header_graphic     {margin:0;padding:0;}
#header_graphic_hp  {margin:0;padding:0;}
#header img         {margin:0;padding:0;border:0;}

/* navigation styles */
#leftnav                        {float:left;display:block;width:184px; margin:0; padding: 0; font-size:90%;}
#leftnav ul                     {margin:12px 0 0 0;padding:0;list-style-type:none;}
#leftnav li                     {margin:0;padding:0;border-bottom:1px solid #fff;}
#leftnav li a                   {width:100%;margin:0;display:block;color:#000;text-decoration:none;font-weight:bold;padding:15px  0px 10px 0px;text-indent:15px;}
#leftnav li a.highlight         {color: #fff;background-color:#c0b9a7;}
#leftnav li a.highlight:hover   {text-decoration:none;}
html>body #leftnav li a         {width:auto;}
#leftnav li a:hover             {text-decoration:none;color:#fff;background-color:#c0b9a7;}
/*#leftnav li a.highlighted:hover { background-color: #017cc0; color: #000; }*/ /* delete this style if want highlighted buttons to allow hover color */

/*top nav*/
#topnav {
	float: right;
	width: 450px;
}
/*homepage styles*/
#hp_columns              {
	width: 65%;
}

/**BEGIN HOME PAGE STYLES**/

.content_hp #container {
	width: 100%;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left; /* this overrides the text-align: center on the body element. */
}
.content_hp #sidebar {
	float: right; /* since this element is floated, a width must be given */
	width: 215px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 20px 10px;

}
.content_hp #mainContent {
	margin: 20px 20px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
} 
.content_hp #mainContent #column1 {
	background-image: url(/vivacity/groups/public/documents/associatedfiles/img_vivacity_columnBack.jpg);
	background-repeat: no-repeat;
	width: 289px;
	float:left;
	margin-right: 20px;
	height: 151px;
	padding: 20px 0 0 5px;
}
.content_hp #mainContent #column1 p {
	margin-top: 10px;
}

.content_hp #mainContent #column2 {
	background-image: url(/vivacity/groups/public/documents/associatedfiles/img_vivacity_columnBack.jpg);
	background-repeat: no-repeat;
	padding: 20px 0 0 5px;
	width: 289px;
	float:left;
	height: 151px;
}
.content_hp #mainContent #column2 p {
	margin-top: 10px;
}
.content_hp #mainContent #column3 {
	background-repeat: no-repeat;
	width: 610px;
	height: 151px;
	margin-top: 20px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 0;
}
.content_hp #mainContent #column3 h1 {
	margin-top: 0px;
}

.content_hp #sidebar #feature1{
	background-image: url(/vivacity/groups/public/documents/associatedfiles/img_vivacity_contact.png);
	background-repeat: no-repeat;
	height:52px;
	margin-bottom: 10px;
	margin-top: 0px;
}

.content_hp #sidebar #feature2{
	background-image: url(/vivacity/groups/public/documents/associatedfiles/img_vivacity_calendar.png);
	background-repeat: no-repeat;
	height:52px;
	margin-bottom: 10px;
}
#page_container_hp .content_hp #container #sidebar h2 {
	color: #947db2;
	padding-left: 50px;
	font-size: 120%;
	padding-top: 10px;
}

.content_hp #sidebar #feature3{
	background-image: url(img_vivacity_newsletter.png);
	background-repeat: no-repeat;
	height:75px;
}
.content_hp #sidebar a{ text-decoration:none;	color: #947db2;
}
.content_hp #sidebar a:hover{ text-decoration:underline;	color: #947db2;
}
.content_hp #sidebar a:visited{ text-decoration:none;	color: #947db2;
}

.content_hp #container h1 {margin-top: 0; margin-bottom: 10px;}
.content_hp #container h2 {margin-top: 0; margin-bottom: 10px;}
/**END HOME PAGE STYLES**/

/**HOME PAGE COLUMNS**/

.hp_column               {width:180px;float:left;clear:right;}

.hp_column_last          {width:178px;float:left;}
.hp_column .title        {border-right:1px solid #fff;background-color:#c3ce59;font-weight:bold;padding:10px;font-size:90%;}
.hp_column_last .title   {background-color:#c3ce59;font-weight:bold;padding:10px;font-size:90%;}
.hp_column .content      {border-right:1px solid #c0b9a7;padding:10px;height:400px;}
.hp_column_last .content {padding:10px;height:400px;}
#hp_columns .content a   {font-weight:bold;color:#c3ce59;text-decoration:none;}
.hp_column .highlight    {background-color:red;}
/** END HOME PAGE COLUMNS**/

/* footer styles */
#footer             {clear:left;text-align:center;font-size:90%;color:#6c6c6c;width:100%;margin:auto;padding:50px 0 0 0;}
#footer ul          {margin:10px 0 0 0;padding:0; text-align: center;}
#footer ul li.first {border-left:0;}
#footer ul li       {display:inline;border-left:1px solid #ccc;height:15px;padding:0 3px 0 5px; margin:0px;}
#footer a           {color:purple;text-decoration:none;}
#footer p           {margin:0;padding-bottom:30px;}
.photo      {
	float:left;
	margin:5px 15px 5px 0;
	border: 1px solid #c0b9a7;
}
.disclaimer {font-size:90%;padding:30px;}
hr          {width:85%;height:1px;border:1px solid #eaeaea;}
h3.name     {margin-bottom:0px;}

#contact_box {float:right;width:150px;background-color:#f2f2f2;border:1px solid #ccc;padding:10px;margin-left:10px;}

/* MailChimp Styles */
#mc_embed_signup {
	width: 350px;
}
#mc_embed_signup fieldset {
	width: 300px;
	position: relative;
	padding-top:10px;
	border:none;
}
#mc_embed_signup legend {position: absolute; top: -2em; left: .2em;}
.mc-field-group {overflow:visible;}
#mc_embed_signup h2 {padding-bottom:10px;}

.input-group li {list-style:none;}
.note-required {
	font-size:90%;
	text-align: right;
}
.table_border {
	border: 1px solid #abba21;
	background-color: #e8eeb2;
	padding: 5px;
}
#form_container {width: 100%;}
#form1 {
	float: left;
	width: 45%;
}
#form2 {
	float: left;
	padding-left: 5px;
	padding-top: 25px;
}
.text-caps {text-transform: uppercase;}

.text_small {
	font-size: 85%;
}
.text_large {
	font-size: 120%;
	color: #636162;
	font-weight: bold;
}
.text_large_purple {
	font-size: 120%;
	color: #542480;
	font-weight: bold;
	padding-bottom: -10px;
	margin-bottom: -10px;
}
.border_green {
	border-bottom: solid 1px #c3ce59;
	padding-bottom: 10px;
}
/******TOP NAVIGATION TABS*******/

.ddcolortabs{
	padding: 0;
	width: 100%;
	overflow: hidden;
	background: transparent;
}

.ddcolortabs ul{
	font: 12px Verdana, Arial, sans-serif;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ddcolortabs li{
	display: inline;
	margin: 0 2px 0 0;
	padding: 0;
	float: right;
}


.ddcolortabs a{
float: left;
color: white;
background: #c3ce59 url(img_vivacity_roundleft.gif) no-repeat left top; /*default background color of tabs, left corner image*/
margin: 0 2px 0 0;
padding: 0 0 1px 3px;
text-decoration: none;
letter-spacing: 1px;
}

.ddcolortabs a span{
float: left;
display: block;
background: transparent url(img_vivacity_roundright.gif) no-repeat right top; /*right corner image*/
padding: 7px 9px 3px 6px;
cursor: pointer;
}

.ddcolortabs a span{
float: none;
}


.ddcolortabs a:hover, .ubercolortabs li.selected a{
background-color: #c0b9a7; /*background color of tabs onMouseover*/
color: white;
}

.ddcolortabs a:hover span{
background-color: transparent;
}


/**********END TOP NAVIGATION TABS*************/

/**********BEGIN TOGGLE*************/
#content_360_sidebar {
	float: right; /* since this element is floated, a width must be given */
	width: 215px;
	margin-top: 30px;
	padding-bottom: 20px;
	padding-left: 10px;
	margin-right: 0px;
}

h2.trigger {
	background: url(/vivacity/groups/public/documents/associatedfiles/img_h2_trigger_a.jpg) no-repeat;
	height: 45px;
	line-height: 45px;
	font-size: 12px;
	font-weight: bold;
	float: right;
	width: 215px;
}
h2.trigger a {
	color: #fff;
	text-decoration: none;
	display: block;
	padding-left: 45px;
}
h2.trigger a:hover {
	color: #4d0c80;
}
h2.active {background-position: left bottom;} /*--When toggle is triggered, it will shift the image to the bottom to show its "opened" state--*/
.toggle_container {
	overflow: hidden;
	border-top: 1px solid #b9a7cb;
	font-size: 1em;
	width: 215px;
	background: #f0f0f0 url(/vivacity/groups/public/documents/associatedfiles/img_toggle_block_stretch.jpg) repeat-y left top;
	clear: both;
	margin-top: 0px;
}
.toggle_container .block {
	background: url(/vivacity/groups/public/documents/associatedfiles/img_toggle_block_btm.jpg) no-repeat left bottom; /*--Bottom rounded corners--*/
	padding: 0 10px;
}
.toggle_container .block p {
	padding: 5px 0;
	margin: 0;
}
.toggle_container h3 {
	font: 2.5em normal Georgia, "Times New Roman", Times, serif;
	margin: 0 0 10px;
	padding: 0 0 5px 0;
	border-bottom: 1px dashed #ccc;
}
.toggle_container img {
	float: left;
	margin: 10px 15px 15px 0;
	padding: 5px;
	background: #ddd;
	border: 1px solid #ccc;
}

/**********END TOGGLE*************/