html, body, form, fieldset, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, div, img, a {
  margin: 0;
  padding: 0;  
}

* {
  margin: 0;
  padding: 0;  
}

img {
border: 0;
}

body {
  background: #000 url('../images/browser_bg.jpg') no-repeat top center;

  text-align: center; 
  min-width: 860px;
  /* font: 62.5%/1.6 Geneva, Helvetica, sans-serif; */
  /* font-family:"Lucida Grande","Lucida Sans Unicode",arial,sans-serif; */
  /* font-family:Palatino,"Palatino Linotype",Georgia,"Times New Roman",serif; */
  /* font-family:Baskerville,Georgia,Cambria,Times,Times New Roman,serif; */
  /* font-family:"Lucida Sans Unicode","Lucida Grande","Lucida Sans",Verdana,Arial,sans-serif; */
  /* font-family:"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,arial,sans-serif; */

/*******************************************
 Sitepoint 8 Font Stacks  
*******************************************/

  /*** A Modern Georgia-based serif stack ***/
  /* font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif; */

  /*** A more traditional Garamond-based serif stack ***/
  /* font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif; */

  /*** The Helvetica/Arial-based sans serif stack ***/
  font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;

  /*** The heavier “Impact” sans serif stack ***/
  font-family: Impact, Haettenschweiler, ‘Franklin Gothic Bold’, Charcoal, ‘Helvetica Inserat’, ‘Bitstream Vera Sans Bold’, ‘Arial Black’, sans-serif;

  /*** The Monospace stack ***/ 
  font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;

  /*** The Times New Roman-based serif stack ***/ 
  font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;

  /*** The Trebuchet-based sans serif stack ***/
  font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitsream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;

  /*** The Verdana-based sans serif stack ***/
  font-family: Corbel, "Lucida Grande", "Lucida Sans Unicode", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", Verdana, "Verdana Ref", sans-serif;

  /* font-size: 0.8em; */
  /* font-size: 0.9em; */
  font-size: 1.0em; 
  margin-top: 10px;
  line-height: 1.2em;
}

#header, .banner {
width: 850px;
}

div.center {
  margin-left: auto;
  margin-right: auto;
}

#leftnav, .leftnav {
  float: left;
  background-image: url('../images/web_left_nav_01.gif');
  background-repeat: no-repeat;
  background-color: #a8b8ae;   
  width: 330px;
  /* height: 418px; */
  margin:0;
  padding:0;
/* Min height hack next 3 lines */
  min-height:418px;
  height:auto !important;
  height:418px;
}

.leftnav#home {
  background-image: url('../images/web_left_nav_01_heather.gif');
}

.leftnav#center {
  background-image: url('../images/web_left_nav_01_center.gif');
}

#essentials {
	margin-top: 360px;
	margin-bottom: 60px;
	font-weight: bold;
  	color:#8b5c29;
	line-height: 14px;
	width: 330px;
}

.photoRight {
padding:0;
margin: 10px 0px 10px 15px;
float: right;
}

.photoRightCaptioned {
padding:0;
margin: 5px 0px 5px 15px;
float: right;
line-height: 1.0em;
}

.photoRightCaptioned p {
width: 100%;
margin: 0;
padding: 5px 0;
font-size: 0.6em;
color: #8b5c29;
text-align: center;
}

.photoRightCaptioned img {
margin: 0;
padding: 0;
display: block;
}

.photoLeft {
padding:0;
margin: 10px 15px 10px 0px;
float: left;
}

.photoLeftCaptioned {
padding:0;
margin: 5px 15px 5px 0px;
float: left;
line-height: 1.0em;
}

.photoLeftCaptioned p {
width: 100%;
margin: 0;
padding: 5px 0;
font-size: 0.6em;
color: #8b5c29;
text-align: center;
}

.photoLeftCaptioned img {
margin: 0;
padding: 0;
display: block;
}


#content {
  float: left;
  text-align: left;
  background-image: url('../images/web_content_01.gif');
  background-repeat: no-repeat;
  background-color: #ffffff;   
  width: 850px;
  margin: 0;
  padding: 0;
/* Min height hack next 3 lines */
  min-height:418px;
  height:auto !important;
  height:418px;
}

#content #text {
  text-align: left;
  width: 800px;
  margin: 25px 25px 20px 25px;
  padding: 0;
}

#content #text a:link, #content #text a:visited {
  color:#8b5c29;
}

#content #text a:hover {
  color:#cc0000;
}

#std {
margin-left: 10px;
color:#cc0000;
}

#std li{
margin: 10px;
padding-left: 5px;
display: list-item;
margin: 5px;
}

#right_of_content {
  float: left;
  background-image: url('../images/web_content_02.gif');
  width: 63px;
  height: 418px;
  margin:0;
  padding:0;
}

#left_of_footer {
  float: left;
  background-image: url('../images/web_footer_01.gif');
  width: 330px;
  height: 61px;
  margin:0;
  padding:0;
}

#footer {

  float: left;
  background-color: #a8b8ae;   
  width: 850px;
  height: 30px;
  margin:0;
  padding: 10px 0;
  border-top: 1px solid #364655; 
  vertical-align: middle;
}

#footer #copyright {
margin-left: 15px;
float: left;
line-height: 30px;
font-size: 0.8em;
}

#footer #validator, #footer #sactop10, #footer #designfirms,#footer #drupaldeveloper {
margin: -4px 15px 0 0;
float: right;
}

#footer #sactop10 {
margin: -4px 15px 0 0;
float: right;
}

#footer #validator img, #footer #designfirms img {
border: 0;
margin-top: 4px;
}


#line1, #line2 {
margin:0;
padding:0;
margin-top:5px;
}


#footer #line1 li {
  list-style-type: none;
  float: left;
  padding: 0;
  margin: 0;
}

#footer #line1 li a, #footer #line2 li {
  font-size: 8pt;
  border-right: 1px solid #000000;
  list-style-type: none;
  float: left;
  padding: 0;
  margin: 0;
  padding-right: 5px;
  margin-right: 5px;
}

#footer #line2 li a {
  font-size: 8pt;
}

#footer #line2 .rightmost, #footer #line1 .rightmost a {
  border-right: none;
}

#wrapper {
  border: 1px solid #000000;
  margin: 0 auto; 
  /* background-image: url('../images/bg_slice.gif'); */
  background-repeat: repeat-y;
  background-color: #ffffff;   
  width: 850px;
  /* margin: 0 0 0 0; */
}

#sitetitle {
  padding: 20px 0px;
}

#sitetitle a:link,#sitetitle a:visited {
  font-size: 18pt;
}

/* MENU SECTION */
#mainmenu {
  margin: 0;
  padding: 0;
  height: 31px;
  width: 850px;
}

/* clearfix for menu */
#mainmenu:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#mainmenu {display:inline;}
/* Hide from IE Mac \*/
#mainmenu {display:block;}
/* End hide from IE Mac */
/* end clearfix */


ul.level1 {
  display:inline;
  height:31px;
  float: left;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  clear: both;
}

.level1 ul {
margin: 0;
padding: 0;
}

.level1 li {
  background: #cccccc;
  display: block;
  list-style-type: none;
  float: left;
  padding: 0;
  margin: 0;
  height: 31px;
}

.level1 .selected {
  background: #FFFFCC;
}

.level1 li img {
  display:block; 
  border: none;
  margin: 0;
  padding: 0;
}

/* Next section for "intentio cum prudentia" rollover */

li.image_one a {
	display:block; 
	width:290px; 
	height:31px; 
	position:relative;
}	

.the-one {
	float:left;
	display:block; 
	width:281px; 
	height:58px; 
	position:relative;
}	

li.image_one a .rollover {
	display:block; 
	visibility: hidden;
	position:absolute; 
	top:0; 
	left:0; 
	width:290px; 
	height:31px; 
	background: url('../images/designed-with-foresight.jpg');
}

.the-one .rollover2 {
	display:block; 
	visibility: hidden;
	position:absolute; 
	top:0; 
	left:0; 
	width:281px; 
	height:58px; 
	background: url('../images/fs_05-over.jpg');
}



img#about, img#portfolio, img#services, img#contact {
  width: 140px; 
  height: 31px; 
}

/* Fixes IE6 whitespace issue */
.level1 a {
height: 1%;
}

.level2 {
  float: left;
  clear: both;
  border-top: solid black;
  margin-top: 5px;
  width: 750px;
}

.level2 li {
  background: #FFFFCC;
  display: block;
  list-style-type: none;
  width: 110px;
  float: left;
  padding: 5px;
  height: 60px;
  margin-right: 5px;
  margin-top: 5px;
  overflow: hidden;

}

.level2 .selected {
  background: #CCCC99;
}

.level3 {
  float: left;
  clear: both;
  border-top: solid black;
  margin-top: 5px;
  width: 750px;
}

.level3 li {
  background: #CCCC99;
  display: block;
  list-style-type: none;
  width: 110px;
  float: left;
  padding: 5px;
  height: 60px;
  margin-right: 5px;
  margin-top: 5px;
  overflow: hidden;

}

.level3 .selected {
  background: #FFFFFF;
}

.level4{
  background: #FFFFFF;
}

#concept_banner_1_01 {
width: 280px;
height: 169px;
display: block;
float: left;
border: none;
}

#concept_banner_1_02 {
width: 280px;
height: 169px;
display: block;
float: left;
border: none;
}

#concept_banner_1_03 {
width: 290px;
height: 169px;
display: block;
float: left;
border: none;
}

#fs_01 {
width: 171px;
height: 111px;
display: block;
float: left;
border: none;
}

#fs_02 {
width: 281px;
height: 111px;
display: block;
float: left;
border: none;
}

#fs_03 {
width: 398px;
height: 111px;
display: block;
float: left;
border: none;
}

#fs_04 {
width: 171px;
height: 58px;
display: block;
float: left;
border: none;
}

#fs_05 {
width: 281px;
height: 58px;
display: block;
float: left;
border: none;
}

#fs_06 {
width: 398px;
height: 58px;
display: block;
float: left;
border: none;
}

#fs_home {
width: 96px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_aboutus {
width: 120px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_portfolio {
width: 129px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_services {
width: 114px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_testimonials {
width: 154px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_contactus {
width: 145px;
height: 31px;
display: block;
float: left;
border: none;
}

#fs_blog {
width: 91px;
height: 31px;
display: block;
float: left;
border: none;
}



/* END MENU SECTION */

/* HOMEPAGE TOP LINKS */
#toplinks {
  margin: 0 auto;
}
#toplinks ul {
  float: right;
  margin: 20px;
}
#toplinks li {
  list-style-type: none;
  margin-bottom: 5px;
}

/* END HOMEPAGE TOP LINKS */
p {
  margin-bottom: 10px;  
}

h1 {
  font-size: 1.6em;
  font-weight: bold;
  color: #364655; 
  margin-bottom: 15px;
}

h2 {
  font-size: 1.4em;
  font-weight: bold;
  color: #364655; 
  margin-top: 15px;
  margin-bottom: 5px;
}

h3 {
  font-size: 1.2em;
  font-weight: bold;
  color: #364655; 
  margin-bottom: 10px;
}

h4 {
  font-size: 1.1em;
  font-weight: bold;
  color: #364655; 
  margin-bottom: 10px;
}

a:link {
 color:#990099;
}

a:visited {
  color:#990099;
}

.plain {
  margin-bottom: 10px;
}

.plain li {
list-style-type: none;
}

table.resources {
/* background-color: #dbe2da; */
/* border-top: 1px solid #73847c; */
/* border-right: 2px solid #73847c; */
/* border-bottom: 2px solid #73847c; */
/* border-left: 1px solid #73847c; */
}

td.mylink {
text-align: left;
width: 200px;
padding: 10px;
vertical-align: top;
}

td.desc {
color:#000000;
text-align: left;
font-weight: bold;
padding: 10px;
vertical-align: top;
}

.plaintable {
  border: 0;
}
.plaintable td, .plaintable th {
  bordeR: 0;
  padding: 5px;
}

.bttLink {
  display:block;
  margin-bottom: 25px;
}

#content ul {
  margin-bottom: 10px;
  list-style-position: outside;
}

#content li {
  margin-left: 25px;
}

#content ol {
  margin-bottom: 10px;
}

#content ol ol li {
  list-style-type: lower-alpha;
}

#content blockquote {
  font-style: italic;
}


/* LINKS ON BOTTOM OF HOMEPAGE */
#bottomlinks {
  margin-top: 50px;
}
#bottomlinks li {
  list-style-type: none;
  margin-bottom: 5px;
}
/* END LINKS ON BOTTOM OF HOMEPAGE */


/* Styles for menus  */ 

#menu1 {
position: absolute;
left: 400px;
top: 50px;
}

#cssdropdown, #cssdropdown ul {
text-align: left;
padding: 0;
margin: 0;
list-style: none;
}

#cssdropdown li {
float: left;
position: relative;
}

.mainitems{
border: 1px solid black;
background-color: #FFEEC6;
}

.mainitems a{
margin-left: 6px;
margin-right: 8px;
text-decoration: none;
}

.subuls{
display: none;
width: 10em;
position: absolute;
top: 1.2em; 
left: 0;
background-color: lightyellow;
border: 1px solid black;
}

.subuls li{
width: 100%;
}

.subuls li a{
text-decoration: underline;
}

#cssdropdown li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
top: auto;
left: auto;
}

#cssdropdown li:hover ul, li.over ul { /* lists nested under hovered list items */
display: block;
}

#restofcontent { /*wrap rest of content of the page inside this div*/
clear: left;
}

.project {
display: block;
margin: 25px;
padding: 0;
width: 100%;
float: left;
clear: both;
}

.imgdiv {
width: 250px;
float: left;
}

.descdiv {
width: 450px;
margin-left: 15px;
float: left;
}

.photomargin {
	border: 1px solid #999999;
	margin-top: 5px;
	margin-right: 12px;
	margin-bottom: 30px;
	margin-left: 0px;
	padding: 5px;
}

.imgdiv .photomargin {
	border: none;
	margin-top: 0px;
	margin-right: 12px;
	margin-bottom: 30px;
	margin-left: 0px;
	padding: 5px;
}



.photomarginRight {

	border: 1px solid #999999;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 8px;
	margin-left: 8px;
	padding: 5px;
}

#contactus-img {
float: right;
width: 350px;
height: 278px;
margin: 10px 0 10px 25px;
}

#staff-img {
float: right;
width: 350px;
height: 233px;
margin: 10px 0 10px 25px;
}

#flow-img {
float: right;
width: 350px;
height: 270px;
margin: 10px 0 10px 25px;
}

#design-timeline {
width: 750px;
height: 110px;
margin: 15px 0 20px 0px;
}

#proj-img {
float: right;
width: 350px;
height: 337px;
margin: 10px 0 10px 25px;
}

#sid-img {
float: right;
width: 235px;
height: 316px;
margin: 0 0 10px 25px;
}

.footnote {
font-size: 0.8em;
}

#me-me {
position: relative;
top: 50px;
left: 100px;
font-size: 1.2em;
}

.testimonial {
margin: 10px 25px 20px 25px;
font-style: italic;
}

#drupaldev-div {
margin: 10px 25px 10px 25px;
float: right;
}

