/* CSS Document */
/*
	dialecticmedia.com
	v1.0
	
	dark blue #115073
	light blue #e5eff6
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: top;
}

body {
	margin: 0 auto;
	padding: 0;
	font: 0.85em/1.3 "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, sans-serif;
	color: #474747;
	background: #b1b7ba url(images/page_background3.gif) repeat-x top left;
}

#threeColLayout {
    background: #e5eff6;
    background:#E5ECF3 url(images/page_background3.gif) repeat-x top left;
}

#twoColLayout {
    background: #e5eff6;
	background:#E5ECF3 url(images/page_background3.gif) repeat-x top left;
}

#oneColLayout {
    background: #e5eff6;
	background:#E5ECF3 url(images/page_background3.gif) repeat-x top left;
}


a {
    /* color: #00487d; */
    color: #599ac6;
    text-decoration:none;
    font-weight: bold;
	-moz-outline-style: none;
	outline: none;
}

a:hover { 
	color: #00487d; text-decoration:underline; 
}

p { 
	padding: 2px 0px 2px 0;
}

small {
	font-size: 85%;
}

/* Header Styles */

h1, h2, h3, h4, h5, h6 { 
	font-weight: bold; 
	line-height: normal; 
	color:#00487d; 
}

h1 { font-size: 1.8em; }
h2 { font-size: 1.2em; }
h3 { font-size: 0.8em; }
h4 { font-size: 1.1em; }
h5 { font-size: 0.9em; }
h6 { font-size: 0.8em; }


.home #wrapper h2 {
	margin: 0 0px 3px 0px;
	padding: 2px;
	font-size: 1.1em;;
	color: #00487d;
	text-align: center;
}
	
.home #spotlight #description h2 {
	text-align: left;
	padding: 0px;
	font-size: 1.3em;;
	color: #006666;
}
	
.services h2  {
   margin: 10px 0px 7px 0px;
   padding: 2px;
   font-size: 1.7em;;
   color: #336666;
   text-align: center;
}  
.quote h2  {
   margin: 0px 0px 0px 5px;
   padding: 2px;
   font-size: 1.5em;;
   color: #336666;
   text-align: left;
}
 

.contact h2  {
   margin: 0px 0px 0px 5px;
   padding: 2px;
   font-size: 1.5em;;
   color: #336666;
   text-align: left;
}

.home #wrapper h3 {
	display: inline;
	font-size: 0.9em;
	margin: 5px 5px 0 10px;
	padding: 0px;
	color:#006666;
}

.home #spotlight #description h3 {
	text-align: left;
	margin: 0px 0px 0 0px;
	padding: 0px;
	font-size: 0.9em;;
	color: #006699;
}
.services h3 {
   	display: inline;
	font-size: 1.2em;
	margin: 5px 5px 5px 10px;
	padding: 0px;
	color: #115073;
}
.thankyou h3 {
   	display: inline;
	font-size: 1.3em;
	margin: 50px 5px 20px 0px;
	padding: 0px;
	color: #115073;
}

ul, ol { list-style-position: inside; }

.clearfloat { clear:both;height:0;font-size: 1px;line-height: 0px; }

/* ***************************************
    CONTENT WRAPPER
*************************************** */
#wrapper {
width:942px;
margin: 0 auto;
margin-top: 20px;
background-color: #E5ECF3;
}


/* ***************************************
    PAGE STRUCTURE
*************************************** */
#header {
   height:72px;
   padding:0;
   margin:0;
}
#header-inner {
    width:942px;
    margin:auto;
    text-align:left;
    padding:0;
}
#header-inner h1 {
    color:#fff;
    margin:0 0 0 0;
    padding:0;
    display:none;
}
#header-inner #logo {
    margin:0;
    padding:0;
    background: url(images/dialectic_logo.gif) no-repeat top left;
	border:none;
    width:500px;
    height:72px;
}

#spotlight {
	text-align:left;
	margin: 0px auto 0 auto;
	padding:5px 0 0 0; 
	min-height:100px;
	-webkit-border-radius: 12px; 
	-moz-border-radius: 12px;
}
#spotlight #description {
    width:350px;
    padding:10px 0 10px 15px;
    float:left;
}
#spotlight #slides {
    width:500px;
    float:right;
	padding:0px;
	margin-top: 0px;
}
#spotlight #introduction {
	padding:0 10px 10px 0;
}

/*#readmore { display:hidden; margin-top: 10px; }*/


/* ***************************************
    page contents styles
*************************************** */
/* now the three main columns, named in order of importance and display when styles switched off */

#primaryContent {
float:left;
width:942px;
display:inline;
margin: 0px 0px 0px 0px;
}

/* note here that specifying threeColLayout in the body will activate the following div instead of the default primaryContent */

#threeColLayout #primaryContent {
float:left;
width:304px;
margin: 0 0 0px 319px;
}

/* note here that specifying twoColLayout in the body will activate the following div instead of the default primaryContent */

#twoColLayout #primaryContent {
width:697px;
float:left;
margin: 0 0 20px 245px;
}

/* just incase twoColLayout is specified in body, and secondaryContent is left in, we turn it off - not ideal, but it works */
/*
#twoColLayout #secondaryContent {
display: none;
}
*/
#secondaryContent{
float:left;
width:304px;
margin: 0 0 0px 15px;
}

#sideContent{
float:left;
width:304px;
margin: 0 0 0px -942px;
}

#sideNav {
float:left;
width:304px;
margin: 20px 10px 20px 5px;
}
#sideNav h2 {
margin: 0px 70px 12px 10px;
}

/* just incase oneColLayout is specified in body, and these are left in, we turn them off - not ideal, but it works */

#oneColLayout #secondaryContent, #oneColLayout #sideContent {
display: none;
}

/* cbSide controls non-rounded boxes in the thinner left column, known as sideContent */

.cbSide {
width:160px;
margin: 5px 0 0 10px;
padding: 10px 0 5px 0;
background: #FFF;
}
.cbSide p {
margin: 0;
padding: 0 5px 2px 5px;
font-size: 90%;
color: #666;
}

/* box is the shaded area that holds a rounded corner box or flat box, fitting the given width of the column it is in. Usually combined with another class to control inner elements, eg box default */

.box {
clear:both;
margin: 15px 0px 0 0;
padding: 5px 0 5px 0;
}

/* Styling of the boxes if there is no JavaScript support */

.cbb {
margin: 0 10px 0 10px;
background: #FFF;
padding: 5px 0 5px 0;
line-height: 170%;
}

/* paragraph styles for any main boxes */
.cbb p, .cb p {
margin: 0;
padding: 5px 15px 5px 10px;
color: #333;
text-align:justify;
font-size: 1.0em;
}

/*home page box paragraphs*/

.home #wrapper p{
margin: 0;
padding: 5px 5px 5px 60px;
color: #333;
text-align:left;
font-size: 1.0em;
}

/* Insert the custom corners and borders for browsers with sufficient JavaScript support */

.cb {
float:left;
width:100%;
margin: 0 0 0 0px;
line-height: 150%;
}

/* Rules for the top corners and border */
.bt {
	background:url(images/box.gif) no-repeat 100% 0;
	margin:0 4px 0 18px;
	height:27px;
	}
.bt div {
	height:27px;
	width:18px;
	position:relative;
	left:-18px;
	background:url(images/box.gif) no-repeat 0 0;
	}

/* Rules for the bottom corners and border */
.bb {
	background:url(images/box.gif) no-repeat 100% 100%;
	margin:0 4px 15px 12px;
	height:14px;
	}
.bb div {
	height:14px;
	width:12px;
	position:relative;
	left:-12px;
	background:url(images/box.gif) no-repeat 0 100%;
	}

/* Insert the left border */
.i1 {
	margin-left: 0px;
	padding: 0 0px 0 7px;
	}
/* Insert the right border */
.i2 {
	padding: 0 12px 0 0;
	/*background:url(images/borders.gif) repeat-y 100% 0;*/
	}
/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 {
	background:#FFF;
    border: 1px solid #FFF;
	border-width: 1px 0;
	padding: 0 0px 0px 10px;
	}
/* CSS for the box ends here */



/* date and posted control the small text info in article blurbs */

.date {
font-size: 85%;
font-weight: bold;
color: #666;
}

.posted {
display: block;
margin: 3px 0 0px 10px;
padding: 0 0 0px 0px;
font-weight: bold;
color: #666;
}

.home .posted {
display: block;
margin: 3px 0 0px 10px;
padding: 0 0 0px 50px;
font-weight: bold;
color: #666;
}

.postedUnderline {
display: block;
margin: 0 5px 5px 50px;
padding: 0 0 5px 0;
font-weight: bold;
color: #666;
border-bottom: 1px solid #999;
}

address {
margin-left: 50px;
}


/* ***************************************
  tabbed menu
*************************************** */
#menu {
    padding:0;
    margin:0 auto;
    text-align:left;
    height:30px;
}
#menu-inner {
    width:940px;
    text-align:right;
    margin:0 auto;
    padding:0;
}
#menu-inner a span { cursor: pointer; }
#menu a:active { outline: none; }
#menu a:focus { -moz-outline-style: none; }
#menu a {
	float:right;
	margin:0;
	padding:0 0 0 10px;
	text-decoration:none;
	font-weight: bold;
	font-size: 100%;
}
#menu a span {
	float:left;
	display:block;
	padding:4px 14px 0px 3px;
	height:25px;
	margin:0;
	color:#ffffff;
}
#menu a.disabled span {
	color: #547faa;
}
#menu a.disabled {
	color: #547faa;
}
#menu a.disabled:hover {
	color: #547faa;
}
#menu a.disabled:hover span {
	color:#547faa;
}

/* IE 6 */
* html #menu a span  {
    height:22px;
}
#menu a:hover span {
	color:#00487d;
}
#menu a:hover {
	color: #547faa;
}
#menu a.selected {
	background:transparent url(images/tab_left_selected2.gif) no-repeat left top;
}
#menu a.selected span {
	background:transparent url(images/tab_right_selected2.gif) no-repeat right top;
	color:#00487d;
}

/* ***************************************
  footer styles
*************************************** */


#footer {
    text-align:center;
    height:80px;
    margin-top:40px;
	background: #00487d url(images/footerback3.png) repeat-x top left;
	border-top: 1px solid #e5eff6;
	color:#e5eff6;
	padding-top: 30px;
}

#footer a {
    /* color: #00487d; */
    color: #599ac6;
    text-decoration:none;
    font-weight: bold;
	-moz-outline-style: none;
	outline: none;
}

#footer a:hover { 
	color: #e5eff6; 
	text-decoration:underline; 
}

/* styles for contact form */
form {
  margin: 35px 50px 25px 150px;
  }
#name, #email {
  width: 200px;
  }
#firstName, #lastName {
  width: 200px;
}
#emailOne, #webSite {
  width: 275px;
}
#message {
  width: 600px;
  height: 150px;
}
#comments {
   width: 600px;
  height: 150px;
}
label, .warning {
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold;
  }
.warning {
  color:#F00;
  }


.home #wrapper img {
float: left;
margin: 5px 0 2px 5px;
border: none;
}

#spotlight #description img {
    padding: 0px 0 0px 0px;
    float:left;
	margin-left: -20px;
}


