body {
	font-size: 90%;
	font-family:  Arial, Helvetica, sans-serif;
	background-color: #ffffff; background-image:url(images/bk.jpg); background-repeat:repeat-x;
	margin: 0;
	padding: 0;
	color: #303030;
}
/* ~~ Element/tag selectors ~~ */
ul, ol, dl { 
	padding: 0;
	margin: 0; line-height: 15px;
}
ul.nobullet {
list-style: none;
}
strong {
	color: #000000;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing block. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the blocks, instead of the block elements themselves, gets rid of any box model math. A nested block with side padding can also be used as an alternate method. */
}
p {
	line-height: 18px;
}
h1, h2.entry-title {
	background-color: #eeeeee; padding: 8px;margin-left: 15px; color: #663399; border: 1px solid #adadad;
}
a img {
	border: none;
}

a:link {
	color: #663399;
	text-decoration: none; 
}
a:visited {
	color: #663399;
}
a:hover, a:active, a:focus { 
color: #000000;
	text-decoration: none;
}
/* ~~ This fixed width container surrounds all other blocks ~~ */
.container {
	width: 960px;
	background-color: transparent;
	margin: 0 auto; 
}

#header {
	background-color: transparent;height: 180px; width: 960px; margin: 0 auto 0; 
}
#logo {
	float: left; display:block; width: 143px; height: 138px; background-image: url(images/logo.jpg); background-repeat: no-repeat;
}
#logo a {
	display:block; width: 143px; height: 138px;
}
#tagline { 
color: #797979; padding: 50px 150px 40px 0px; font-size: 130%; text-align: center;
}
#socialMedia {
	float:right; background-image:url(images/socialmedia.gif); background-repeat:no-repeat; background-position: right 10px; width: 107px; height: 31px;padding-top: 10px;padding-left: 68px;
}
#socialMedia a {
	display: block; width: 23px; height: 25px; float:left; margin-right: 2px;
}
.headerNav { 
float:right;  clear:right;
}
#footerlinks .headerNav {
	float:none;
}
#footerlinks ul {
	list-style: none;
}
.headerNav li {
	display:inline; padding: 3px 15px 3px 5px; background-image: url(images/bullet.gif); background-position: right center; background-repeat:no-repeat; 
}
.headerNav li.search {
	background-image: url(/images/search_black.png);  padding-right:15px;
}
.headerNav a {
	color: #6C419C;
	font-weight: bold; font-size: 110%;
}
.headerNav a:hover {
	color: #000000;
}.headerNav, .headerNav ul { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 1; 
	
}


.headerNav li { /* all list items */
	float: left;  margin: 0px;display:block;padding: 3px 15px 3px 5px; background-image: url(images/bullet.gif); background-position: right center; background-repeat:no-repeat;  
	 /* width needed or else Opera goes nuts */ line-height: 18px;
	}
#footerlinks .headerNav li {
	background-image: none;
}
.headerNav li ul { /* second-level lists */
	position: absolute; border: 1px solid #adadad;
	background: #f8f8f8;z-index: 99;
	clear:left; font-size: 90%; 
	margin-top: 2px; 
	width: 180px; 
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#footerlinks .headerNav li ul {
	border: none; left: 0px; position: relative;
}
.headerNav li:hover ul, .headerNav li.sfhover ul { /* lists nested under hovered list items */
	left: auto;
}
.headerNav li ul li {
	background-image: none;border-bottom: 1px dotted #cccccc; width: 160px;padding: 5px 10px 5px 10px;
}
#footerlinks .headerNav li ul li {
	border-bottom: none;float: left; 
}
.headerNav li ul li a {
	display: block; font-weight: normal;
}
#footerlinks .headerNav li ul li a {
	display: inline;
}

#newsHeader {
	clear: both; padding: 10px 5px 10px; font-size: 90%; color: #646472; letter-spacing: .7px; text-align: center;
}
.content {
	padding: 10px 0 0; 
	font-size: 90%;
	margin: 0 0px 0 190px; max-width: 750px;
}
#indexHome h1 {
	display:block; float:left; font-size: 130%; margin: 0px; padding: 0 0 0 20px;
}
.content section {
	border-left: 5px solid #efefef; padding-left: 10px;
}
section.bottom {
	border-left: none; margin: 20px; padding: 20px 0px 20px;
	border-top: 1px solid #cccccc; 
}
/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol {
	padding: 0 15px 15px 40px; 
}
#sideNav {
	float: left; /*margin-left: -965px;*/
	width: 180px;
	padding-bottom: 10px;
}
#sideNav ul {
	list-style: none; 
	margin:  8px 0px 15px 5px; 
}
#sideNav ul li {
	background-image: url(images/bullet.gif); background-position:  0px 10px; Background-repeat: no-repeat;font-weight: bold;  
}
#sideNav a, #sideNav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
	padding: 7px 5px 7px 15px; 
	display: block; 
	width: 160px;  
	text-decoration: none; color: #868686;	
}
#sideNav a:hover,#sideNav a:active,#sideNav a:focus { 	
	color: #663399;
}
#sideNav ul li ul {
	margin-left: 30px;
}
#sideNav ul li ul li {
	background-image: none;  font-size: 100%; 
}
#sideNav ul li ul li a {
	padding-left: 0px;
}
#sideHeaderNav {
	display: none;
}
#newsletter {
display: block; background-image: url(images/newsletter.gif); width: 159px; height: 52px; background-repeat:no-repeat; padding: 25px 0px 0px 5px; font-size: 75%;	text-align:right;
}
#newsletter a, #newsletter a:visited {
margin: 0px;padding: 2px 0px; display: block; 
}
.mc-field-group label {
	float: left; clear: left;
}

#testimonials, #news, #portfolio {
border: 1px solid #cccccc; display: block;	height: 490px;  margin: 30px 0px 10px; font-size: 90%;
overflow: hidden; 
}

#testimonials h4, #news h4, #portfolio h4 {
	margin: 8px 0px 8px 10px; background-color: #ffffff; padding: 0px; width: 125px;  font-size: 120%
}
#testimonials h4 {
width: 88px;	font-size: 120%
}
#portfolio h4 {
	width: 100%;
}
#testimonials {
float: left; width: 240px; margin-right: 30px; 	
}

#news { 
width: 305px; float: left;  
}
.read-more {
	font-style: italic;
}
.blogTitle {
	font-weight: bold; margin-bottom: 5px; padding-left: 10px; display: block; color: #663399;
}
.blogDate {
	text-align: right; font-size: 90%;
}
#portfolio {
float:right; width: 350px;	 
}
.h4link {
	font-size: 90%; float: right; font-weight: normal;
}
a.more {
	float:right; font-size: 90%; margin-right: 10px;
}
.clearBoth {clear: both; }
.hidden {
	display: none;
}
/* ~~ The footer ~~ */
footer {
	padding: 20px 0; text-align: center; border-top: 1px solid #cccccc;
	font-size: 80%; background-color: #f8f8f8;
	position: relative;/* this gives IE6 hasLayout to properly clear */
	clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
}
#footerNav {
z-index:4;	
}
#footerNav ul {
	list-style:none; margin: 0px 0px 10px 0px; padding: 0px;
}
#footerNav li {
	display: inline; padding: 0px 10px 0px; margin: 0px;
}

/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */
header, section, footer, aside, article, figure {
	display: block;
}
#mission ul {
	margin-left: 15px;
}
#mission li {
	line-height: 30px;
}
.email {
	border: none; background-color: transparent; width: 115px;float: left;
}
.button  {
	color: transparent; border: none; background-color: transparent;display:block; width: 32px; height: 23px; cursor: pointer;
}
.submitButton, input#searchsubmit  {
	background-color: #663399; color: #ffffff; border: 1px solid #000000; float: right; margin: 5px;
}

.comments {
	padding-top: 220px;
}
.floatLeft {
	float: left; margin: 0px 10px 10px 0px;
}
.floatRight {
	float: right; margin: 0px 0px 10px 10px;
}
.center {
	text-align: center;
}
.normal {
	font-weight:normal;
}
  .next {
  	float:right; padding: 3px; font-size: 90%; cursor: pointer; clear: right;
  }
  .prev {
  	float:left;padding: 3px; font-size: 90%; cursor: pointer;
  }
  .cycle-slideshow {
	display:block; height: 500px; width: 333px; overflow:hidden; float:right;
}
/*home page divs */
.homediv {
  padding: 8px; margin: 0px 0px 10px 15px;  border: 1px solid #cccccc; background-image: url(images/swoosh.gif); background-position: bottom right; background-repeat: no-repeat; line-height: 17px;
}
#homedivHeader h2 {
margin: 12px; text-align: center; font-size:130%;	
}

.homedivTitle {
	margin: 0px 0px 5px 0px; padding: 0px; font-weight: bold; color: #663399; font-size: 120%;
}
.homediv a {
	
}

/*home page circle */
#home {
	background-image: url(images/bigcircle.jpg); background-repeat: no-repeat; height: 425px; width: 425px; margin: 0px auto 0px; display: block; z-index: 100;
	}
#home ul {
	margin: 0px; padding: 0px; list-style:none;height: 425px; width: 425px;
}

#home ul li  {
	height: 116px; width: 116px;  background-repeat: no-repeat; display: block; text-align: center;  color: #663399; font-size: 120%; font-weight: bold; z-index: 1; 
}
#home a {
		padding-top: 50px; height: 66px; width: 116px; display: block;
	}
#home ul li ul li {
	background-image: none; font-size: 90%; width: 205px; height: 215px; color: #434343; margin: 0px; display: block; padding-top: 40px; font-weight: normal;
}	

#home li ul   {
	position: absolute; background-image: url(images/hoverbk.png); background-repeat: no-repeat; z-index: 100; width: 227px; height: 227px; left: -999px; margin-right: 125px;  text-align:center;  font-weight: normal; 
}
#home li:hover ul {
	left: 650px;   top: 415px; position: absolute;
}
#home li a:hover {
	height: 66px; width: 116px; background-image: url(images/smallcircle_rim.png); display:block;  background-repeat: no-repeat;
}
#home li.plan   {
	margin: 60px 0px 0px 160px;  background-image: url(images/smallcircle.png);
}
	
#home li:hover ul li {
	 background-image: none; padding: 10px;   
}
#home li.function  {
	float: right; margin: -170px 30px 0 0px; background-image: url(images/smallcircle.png);
}
#home li.design  {
	clear:right; float: right; margin: -155px 0px 0px 0px; background-image: url(images/smallcircle.png);
}
#home li.contenthome  {
	  margin: -170px 85px 0px 0px;  background-image: url(images/smallcircle.png);clear:right; float:right;
}
li.support  {
	margin: -515px 0 0 35px; background-image: url(images/smallcircle.png);
}
li.maintain  {
	margin: 12px 0 0 3px;background-image: url(images/smallcircle.png);
}
li.market  {
	margin: -130px 0 0 90px; background-image: url(images/smallcircle.png);
}

form.formLeft {
	margin-left: 20px; border-top: 1px solid #cccccc; padding-top: 20px;
}
.formLeft label {
	display: block; width: 100px; text-align:right;float: left; clear:left; margin-right: 5px; 
}
.formLeft input {
	float:left;
}
.formLeft .submitButton {
	float: left; clear:both; margin-left: 105px; 
}
.entry-content ol, ul {
	margin-left: 35px;
}
label.left {
	float:left; width: 300px; clear:left; background-color: #eaeaea; min-height: 16px; padding: 2px; margin-bottom: 1px; margin-right: 2px;
color: #000000; font-weight: bold;}
.right {
	margin: 2px;
}
label.left .red {
	color: red;
}
.formSection {
	display:block; clear:left;
}
.g-recaptcha {
	margin-left: 300px;
}
textarea {
	width: 100%; height: 50px;
}
#logoSamples ul {
	list-style: none;
}
#logoSamples li {
	display: inline; padding: 10px;
}
.noShow {
	display: none;
}
@media screen and (max-width: 960px) { 
img {
	max-width: 95%; height: auto;
}
.g-recaptcha {
	margin-left: 5px;
}
.formLeft input {
	float:none;
}
.clear {
	clear: left;
}
.content {
	margin :0px; width: auto;  clear: both;
}
.container {
	width: auto;
}
#newsletter {
display: none;
 height: 52px; background-repeat:no-repeat; padding: 25px 0px 0px 5px; font-size: 75%;	  background-color: #ffffff; text-align: left;
}

#newHeader {
	font-size: 90%;
}
h1 {
	clear: both;margin-top: 10px; font-size: 130%;
}
h1, h2, h3, h4, h5, h6, p {
	padding: 5px; margin: 0 5px;	
}
h1#indexHome {
	margin: 0px;
}
#socialMedia {
	display: none;
}
.headerNav {
	display: none;
}
#tagline { 
color: #797979; padding: 0px; font-size: 110%; text-align: center; clear:both;
width: auto;
}
body {
	background-image:none;
}

.content section {
	padding: 0px; margin: 0px 3px; border: none;
}
#header  {
	width: auto; height: auto;
}
#logo {
	background-image: url(images/logo_hor.gif); background-position: center;
	display:block; height: 90px;  margin: 10px auto 10px; float: none; width: auto; border-bottom: 1px solid #663399; padding-bottom: 10px;
}
#logo a {
display: block; width:227px; height:90px;	
}
#testimonials {
width: auto; float: none;	
}
#portfolio {
width: auto; float: none;
	 background-image: url(images/portfolio/filet_mignon.jpg); background-repeat: no-repeat; background-position: right 50px;
}
#news { 
width: auto; float: none;  
}
.homediv {
 margin: 0px; width: 100%; 
}
#testimonials, #news, #portfolio {
border: 1px solid #cccccc; display: block;	height: auto;  margin: 10px 5px 5px; font-size: 90%;
}
.siteNav  ul.nav li {
	 padding-bottom: 5px; text-align: center;  font-weight: bold;
}
.siteNav ul.nav li li {
	 width: auto; font-weight: normal;
}
h2.entry-title {
	margin-left: 0px; font-size: 120%;
}
.red {
	color: red; font-size: 120%; float: left;
}
}