/* GENERAL
--------------------------------------------------------------------*/ 
* {border:0; margin:0; padding:0;}
html, body {background-color:#E1DDD3; font-family:'Helvetica','Arial'; font-size:12px; color:#816F5F; line-height:16px; background:url(../images2/repeat-bg.jpg) repeat 0 100%; height:100%; font-size: 15px;}
a {color:#2D0C05; text-decoration:none;}
a:hover {text-decoration:underline;}
h3 {text-transform:uppercase; font-weight:normal;}

/* LAYOUT
--------------------------------------------------------------------*/ 
#outer-container {min-height:100%; position:relative;} /* for footer */
#header-bg {position:relative; background:transparent url(../images2/repeat-tear-green.png) repeat-x 0 100%; height:924px; overflow:visible;}
.wrapper {width:960px; margin: auto auto; min-height:100%}
#header {position:relative; background:url(../images2/header-blue.jpg) no-repeat; height:479px; width:1315px; margin-left:-287px; margin-right:-68px; overflow:					visible;}

/* NAV
--------------------------------------------------------------------*/
#menu{list-style:none; float:right; padding-right:50px;}
#menu li {float:left; text-align:right; height:46px; width:112px;}
#menu span {display:none;}	
#menu a#home {float:left; background:url(../images2/menu-b-home-off.jpg) no-repeat; height:46px; width:112px;}
#menu a#portfolio {float:left; background:url(../images2/menu-b-portfolio-off.jpg); height:46px; width:112px;}
#menu a#about {float:left; background:url(../images2/menu-b-about-off.jpg); height:46px; width:112px;}
#menu a#contact {float:left; background:url(../images2/menu-b-contact-off.jpg); height:46px; width:112px;}
#menu a#home:hover {background:url(../images2/menu-b-home-on.jpg) no-repeat;}
#menu a#portfolio:hover {background:url(../images2/menu-b-portfolio-on.jpg) no-repeat;}
#menu a#about:hover {background:url(../images2/menu-b-about-on.jpg) no-repeat;}
#menu a#contact:hover {background:url(../images2/menu-b-contact-on.jpg) no-repeat;}

/* content */
#header-copy {font-size:15px; color:#97AAEA; float:left; margin-left:778px; margin-top:170px; width:470px; line-height:18px;}
#header-copy a {text-decoration: none; border-bottom: 1px dashed; color:#7990E4;}
#header-copy a:hover {text-decoration: none; border-bottom: 1px dashed; color:#4E64E4;}


/* PAGE BACKGROUND
--------------------------------------------------------------------*/
#wrapper-page {margin:0 auto; width:1036px; margin-top:-400px; background-image:url(../images2/page-middle.png); background-repeat:repeat-y; background-position:center;}
#page-container {width:1036px; position:relative; padding-left:0px;}
#pfoot-wrapper {margin: 0 auto; width: 1036px; text-align: left;}
#pfoot {background: url(../images2/page-bottom3.png) bottom left no-repeat; width: 1036px; height:21px;}

/* FOOTER
--------------------------------------------------------------------*/
#footerpush {padding-bottom:50px;}
#footer {position:relative; bottom:0; height:190px;/* Height of the footer */ background:#6cf; background: url(../images2/footer-blue.png) bottom center no-repeat; width: 1045px; margin-left:-40px; margin-top:-50px;}

#form-position {margin-top:-5px; margin-left: 50px;}
#footer-title {width: 94px; height: 19px; background-image: url(../images2/contactme.png);}
#footer-title span {display: none;}
#form-position form {margin:0 0 0 0; padding:0 0 0 0;}
#form-position #fname {height: 24px; width: 270px; margin-bottom: -3px; font-size:12px; color:#371006; margin-top:0px; background: transparent url(../images2/input-name.jpg); background-repeat:no-repeat; clear:left; padding-left:10px; padding-top:3px;}
#form-position #femail {height: 23px; width: 274px; margin-bottom: -3px; font-size:12px; color:#371006; margin-top:0px; background: transparent url(../images2/input-email.jpg); background-repeat:no-repeat; clear:left; padding-left:10px; padding-top:3px; clear:left;}
#form-position #fcomments {font-family: Arial, sans-serif; height: 81px; width: 266px; font-size:12px; color:#371006; margin-top:0px; background: transparent url(../images2/input-comments.jpg); background-repeat:no-repeat; padding-left:10px; padding-top:3px; padding-bottom: 12px; overflow:auto; display : block;}
#submit {margin-top:-10px;}

#links {float:right; margin-top:15px; line-height:23px; width:630px; clear:both;} 
#links a {color:#54492C; text-decoration:none; font-weight:bold; letter-spacing:2px; font-size:11px;}
#links a:hover {text-decoration: none; border-bottom: 1px dashed;}

#leftcol {float:left; width: 120px;}
.rightcol {float:left; width: 120px;}

#copyright {float:left; line-height: 23px; font-style:italic; clear:left; font-size:12px; width:500px;}
#copyright .validate {background-image:url(../images2/check.jpg); background-repeat:no-repeat; width: 100px; height: 30px; padding-left: 28px; text-decoration: underline; border-bottom: 0px; font-style:italic; font-size:12px; padding-bottom:10px;color:#816F5F; padding-top:4px;}
#copyright .validate:hover { border-bottom: 0px; text-decoration: none; background-image:url(../images2/check-on.jpg)}

/* BODY
--------------------------------------------------------------------*/
p {margin-bottom: 10px;}
p a {text-decoration: none; border-bottom: 1px dashed; color:#816F5F;}
p a:hover {text-decoration: none; border-bottom: 1px dashed; color:#371006;}
h1 {Arial, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
text-transform:capitalize;
letter-spacing: 3px;
color:#492C24;
margin-bottom:4px;
margin-top:15px;}

#body-wrap {width:990px; overflow:visible; position:relative; text-align:left; padding-left:30px; margin-left:25px; margin-top:30px;}

#container-4 {
/*so I could get the subnav bg on this div, rather than body-wrap, i had to adjust margin and padding*/
	background: url(../images2/subnav-bg.jpg); background-repeat:no-repeat;
	margin-left: -30px;
	padding-left: 30px;
	}
	
	
/*SUB-NAV CSS */
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

/* Skin */
.tabs-nav {
    list-style: none;
    margin: 0 0 0 8px;
    padding: 0 0 0 0;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 0px;
    height: 75px;
    min-width: 142px; /* be nice to Opera */
}
.tabs-nav a, .tabs-nav a span {
    display: block;
    padding: 0 0px;
	width: 142px;
	height: 75px;
    background: url(../images2/subnav-off2.jpg);
	background-repeat: no-repeat;
}
/*text within nav items */
.tabs-nav a {
    position: relative;
	height: 75px;
    z-index: 2;
	font-family:Geneva, Arial, sans-serif;
    color: #492C24;
    font-size: 17px;
    line-height: 1.2;
	letter-spacing:2px;
    text-align: left;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
}
.tabs-nav .tabs-selected a {
    color: #ADC4F6;
}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
    /* background-position: 100% -150px; */
	background: url(../images2/subnav-on.jpg);
	background-repeat: no-repeat;
    outline: 0; /* prevent dotted border in Firefox */
}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
    background-position: 100%;
}
.tabs-nav a span {
    width: 142px; /* IE 6 treats width as min-width */
    min-width: 142px;
    height: 55px; /* IE 6 treats height as min-height */
    min-height: 65px;
	padding: 16px 0 0 17px;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
/*text within nav items */
.tabs-nav .tabs-selected a span {

}
.tabs-nav a:hover span {
    background: url(../images2/subnav-hover4.jpg);
	background-repeat: no-repeat;
}
.tabs-nav .tabs-selected a span, .tabs-nav a:active span, .tabs-disabled a:hover span {
    background: url(../images2/subnav-on.jpg);
	background-repeat: no-repeat;
}
.tabs-nav a span, .tabs-nav, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span, .tabs-nav a:focus span {
    /*background-position: 0 0;*/
	background: url(../images2/subnav-off2.jpg);
	background-repeat: no-repeat;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
#subtext-1{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}
#subtext-2{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}
#subtext-3{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}
#subtext-4{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}
#subtext-5{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}
#subtext-6{background:none; padding: 0; font-size:10px; letter-spacing:0px; line-height: 1.2;}

.tabs-container {
	position:relative;
    padding: 1em 8px;
	width: 950px;
    /*background: #fff;  declare background color for container to avoid distorted fonts in IE while fading */
}

	
/* PAGES - About
--------------------------------------------------------------------*/
#about-1 {
	background: url(../images2/subtitle-about.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 20px;
}
#about-1 span {display:none;}
#about-right {float:right; width:245px; height:780px; margin-right:0px; margin-top:-50px; margin-left: 20px;}

/* contact */
.contact-column {background-image:url(../images2/contact-column-bg.jpg); background-repeat:no-repeat; width:245px; height:200px; position:relative;  margin-left:0px;padding-top:65px;} 
.contact-text {width:182px; position:relative; text-align:center; letter-spacing:1px; margin-left:37px; color:#9C8A7A; font-size: 15px; line-height:24px;}
.contact-text a {color:#9C8A7A; text-decoration: none; border-bottom: 1px dashed;}
.contact-text a:hover {text-decoration: none; border-bottom: 0px;}
.contact-text2 {font-size:11px; font-style:italic; color:#776C4F; margin-left:25px; line-height: 14px; width:200px; padding-top:6px; text-align:center;}
a.contactcol-btn {background-image:url(../images2/contactcol-btn.jpg); background-repeat:no-repeat; background-position:center; width:73px; height:30px; display:block; margin: 0 auto; }
a.contactcol-btn span {display:none;}
.cntct-name {font-family:'Verdana','Arial'; font-size:17px; font-weight:normal; letter-spacing:1px; margin-bottom:0px; padding-bottom:0px; color:#80664C;}


a.linkedin {background-image:url(../images2/linkedin-ico.jpg); background-repeat:no-repeat; width: 100px; height: 25px; padding-left: 25px; text-decoration: underline; border-bottom: 0px; font-style:italic; font-size:11px; padding-bottom:8px; padding-top:2px;color:#9C8A7A; letter-spacing:1px;}
a.linkedin:hover {text-decoration: none; background-image:url(../images2/linkedin-ico-on.jpg)}
.space {margin-top: 1px;}
a#skype {background-image:url(../images2/skype-ico.jpg); background-repeat:no-repeat; width: 100px; height: 25px; padding-left: 25px; text-decoration: underline; border-bottom: 0px; font-style:italic; font-size:11px; padding-bottom:8px; padding-top:2px;color:#9C8A7A; letter-spacing:1px;}
a#skype:hover {text-decoration: none; background-image:url(../images2/skype-ico-on.jpg)}

/* bookmark icons */
#bookmarkme {background-image:url(../images2/bookmarkme.png); width: 120px; height: 16px; margin-top:10px;}

#bookmarklinks {background-image:url(../images2/bookmark-bg.jpg); background-repeat:no-repeat; width: 247px; height: 43px; margin-top:5px; padding-top:10px; padding-left:20px;}
a#delish {float:left; background-image:url(../images2/delish-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#delish:hover {background-image:url(../images2/delish-ico-on.jpg);}	
a#mag {float:left; background-image:url(../images2/mag-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#mag:hover {background-image:url(../images2/mag-ico-on.jpg);}	
a#tech {float:left; background-image:url(../images2/tech-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#tech:hover {background-image:url(../images2/tech-ico-on.jpg);}	
a#stumble {float:left; background-image:url(../images2/stumble-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#stumble:hover {background-image:url(../images2/stumble-ico-on.jpg);}
a#digg {float:left; background-image:url(../images2/digg-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#digg:hover {background-image:url(../images2/digg-ico-on.jpg);}	
a#news {float:left; background-image:url(../images2/news-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#news:hover {background-image:url(../images2/news-ico-on.jpg);}	
a#diigo {float:left; background-image:url(../images2/diigo-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#diigo:hover {background-image:url(../images2/diigo-ico-on.jpg);}	
a#mixx {float:left; background-image:url(../images2/mixx-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#mixx:hover {background-image:url(../images2/mixx-ico-on.jpg);}	
a#df {float:left; background-image:url(../images2/df-ico.jpg); background-repeat:no-repeat; width: 21px; height: 25px; padding-right:5px;}
a#df:hover {background-image:url(../images2/df-ico-on.jpg);}	

/* quote */
#quote {background-image:url(../images2/quote1.jpg); background-repeat:no-repeat; width: 245px; height: 334px;}

/* PAGES - Process
--------------------------------------------------------------------*/
#about-2 { 
	background: url(../images2/subtitle-process.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 20px;
}
#process-right {float:right; width:245px; margin-right:0px; margin-top:-50px; margin-left: 20px; height: 600px;}
#about-2 h2 {font-size: 13px; font-weight:bold;font-family:'Verdana','Arial';}
#about-2 .contact-column .cntct-name {font-family:'Verdana','Arial'; font-size:17px; font-weight:normal; letter-spacing:1px; margin-bottom:0px; padding-bottom:0px; color:#80664C;}
#about-2 ol li {margin-left: 20px; list-style-type: lower-roman; margin-bottom: 10px;}
#about-2 ol li a {text-decoration: none; border-bottom: 1px dashed; color:#816F5F;}
#about-2 ol li a:hover {text-decoration: none; border-bottom: 1px dashed; color:#371006;}

/* discovery questionnaire */
a#discovery {display:block; background-image:url(../images2/discovery.jpg); background-repeat:no-repeat; width: 245px; height: 146px;}

/* PAGES - Client List
--------------------------------------------------------------------*/

#about-3 { 
	background: url(../images2/subtitle-client.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 20px;
	width:700px;
}

#about-3 ul li {margin-left: 20px; padding-left: 2px; list-style-image:url(../images2/bullet.jpg);}

.obo {font-size:11px; font-style:italic;}

/* PAGES - Services
--------------------------------------------------------------------*/
#about-4 { 
	background: url(../images2/subtitle-services.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 18px;
}
#services-right {float:right; width:245px; height:580px; margin-right:0px; margin-top:-50px; margin-left: 20px;}
#about-4 ul li {margin-left: 20px; padding-left: 2px; list-style-image:url(../images2/bullet.jpg); list-style-position: outside; margin-bottom: 7px;}
#about-4 h2 {font-size: 13px;font-family:'Verdana','Arial';}
#about-4 .contact-column .cntct-name {font-family:'Verdana','Arial'; font-size:17px; font-weight:normal; letter-spacing:1px; margin-bottom:0px; padding-bottom:0px; color:#80664C;}

/* PAGES - Contact 
--------------------------------------------------------------------*/
#about-5 { 
	background: url(../images2/subtitle-contact.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 18px;
	position:relative;}
#about-5 form {margin:0 0 0 0; padding:0 0 0 0;position:relative; width: 500px;}
#about-5 label span {position: relative; float: left; height: 20px; padding-top: 5px; clear:both;}
#about-5 #name, #about-5 #company, #about-5 #phone, #about-5 #email2 {position:relative; float:left; height: 24px; width: 339px; margin-bottom: -3px; font-size:15px; color:#371006; margin-top:0px; background: transparent url(../images2/formfield-bg1.jpg); background-repeat:no-repeat; padding-left:10px; padding-top:6px; clear:both;}
#about-5 #comments2 {font-family: Arial, sans-serif; height:180px; width: 377px; font-size:15px; color:#371006; margin-top:0px; background: transparent url(../images2/formfield-bg2.jpg); background-repeat:no-repeat; padding-left:10px; padding-top:13px; margin-bottom:5px; overflow:auto; display:block; clear:both; position:relative; float:left;}
#submit2 {clear:both; position:relative; float:left;}
#contact-right {float:right; width:245px; height:380px; margin-right:0px; margin-top:-50px; margin-left: 20px;}



/* PAGES - Feedback
--------------------------------------------------------------------*/
#about-6 { 
	background: url(../images2/subtitle-feedback.jpg);
	background-repeat: no-repeat;
	padding-top: 55px;
	font-size: 15px;
	line-height: 18px;
	position:relative;}
#about-6 form {margin:0 0 0 0; padding:0 0 0 0;position:relative; width: 500px;}
#about-6 label span {position: relative; float: left; height: 20px; padding-top: 5px; clear:both;}
#about-6 #fbname, #about-6 #fbcompany, #about-6 #fbemail, #about-6 #fbproject {position:relative; float:left; height: 24px; width: 339px; margin-bottom: -3px; font-size:15px; color:#371006; margin-top:0px; background: transparent url(../images2/formfield-bg1.jpg); background-repeat:no-repeat; padding-left:10px; padding-top:6px; clear:both;}
#about-6 label .fbproject {float: left;  width: 500px; height: 20px; padding-top: 5px;}

#about-6 label .fbcomments {float: left;  width: 500px; height: 20px; padding-top: 5px;}
#about-6 #fbcomments {font-family: Arial, sans-serif; height:180px; width: 377px; font-size:15px; color:#371006; margin-top:0px; background: transparent url(../images2/formfield-bg2.jpg); background-repeat:no-repeat; padding-left:10px; padding-top:13px; margin-bottom:5px; overflow:auto; display:block; clear:both; position:relative; float:left;}
#about-6 .fbcomments-txt {font-family: Arial, sans-serif; font-size:15px; margin-left:0px; display:block; position:relative; float:left; clear:both; width: 500px;}
#about-6 #radiolist {float: left;  width: 500px; height: 20px; padding-top: 10px;}
#submit3 {float:left; clear:left; padding-top: 8px; }
#feedback-right {float:right; width:245px; height:580px; margin-right:0px; margin-top:-50px; margin-left: 20px;}

/* for process.asp
--------------------------------------------------------------------*/
#push-right {float:right; width:290px; margin-right:0px; margin-top:-100px; margin-left: 0px; height: 400px;}
.contact-column2 {background-image:url(../images2/contact-column-bg.png); background-repeat:no-repeat; width:245px; height:200px; position:relative; padding-top:55px; margin-top:40px;} 
.contact-column2 h2 {font-family:'Verdana','Arial'; font-size:17px; font-weight:normal; letter-spacing:1px; margin-bottom:0px; padding-bottom:0px; color:#80664C;}