/* MAIN STYLES FOR NTSO DESIGN SITE */

/*
green: #2D8C3C
dark grey: #333
dark green with opacity(0.8): #006600
*/

body {
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	}

p { 
	font-size:12px;
	line-height:1.5em;
	margin:15px 0;
	word-spacing:1px;
	}
p strong { font-weight:bold; color:#2D8C3C;}
p span.title { display:block; font-weight:bold;}

h1, h2, h3, h4, h5, h6 { color:#2D8C3C ; font-weight:bold;}

h1 { font-size:1.8em;}
h2 { font-size:1.6em;}
h3 { font-size:1.4em; line-height:1.4em;}
h4 { font-size:1.2em;}
h5 { font-size:1em;}
h6 { font-size:.9em; font-weight:bold; }


a { color:#1E6229; text-decoration:underline; outline-style:none;}
a:visited { color:#1E6229;}
a:hover { text-decoration:underline; color:#8A8C8A;}

ul { margin:0; padding-left:27px; font-size:1em;}

img {border:0;}

.clearfix {width:950px;} /* Fixes position of bottom tabs in IE - TN */

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
	}

.alignright {float:right; margin-left:10px;}

table.middlenow td { vertical-align: middle; padding:7px; }
table.businesstable td { vertical-align: top; padding:8px;}
.horizontal_dotted_line { border-bottom: 1px dotted #80c080; width: 740px; color:#478C55; margin:10px 0px; height: 1px;}
.boldit-text { font-weight:bold;}
.whiteback { padding: 5px;}
.grayback { background-color: #D4D9D2; padding: 5px;}
.greenback { background-color: #C6DDA9; padding: 5px;}
.grayback2 { background-color: #D4D9D2; padding: 5px;}

	
.bold { font-weight:bold;}
.small {font-size:0.8em;}

.spacer { width:100%; height:5px; background-color:#2D8C3C; margin:5px 0; clear:both; }
.spacer-grey { width:100%; height:5px; background-color:#333333; margin:5px 0; clear:both;}

#wrapper { width:950px; margin:0 auto;}

/********** HEADER **********/

#header { width:950px; height:120px;}
img#logo { border-bottom:none; margin:20px 0 20px; float:left;}
#header #contact { float:right; margin:20px 0 0; }
#smoothmenu1 { position:relative; width:950px; z-index:200; clear:both;}

/********** BODY **********/
#body { padding:10px 0;}
#body ul { 
	line-height:1.4em; 
	list-style-image: url(../images/bullet-arrow.gif); 
	list-style-position:outside;
	font-size:1em;
	}
	
#slideboxes { height:277px; position:relative; z-index:2;}

#bottomcontent { width:950px; height: 345px; padding: 20px 0; clear:both;}
#bottomcontent img { width:170; height:170px; overflow:hidden; background-color:#666666; margin:10px 0;}
#bottomcontent #col-1 { width:400px; float:left; margin-right:10px;}
#bottomcontent #col-1 h1 { font-size:4.1em; color:#666666; font-weight:bold;}
#bottomcontent #col-1 p { font-size:1.6em; line-height:1.5em; margin-top:20px;}
#bottomcontent #col-1 img#flash { width:170px; height:170px; margin:20px 20px 0 0; float:left;}
#bottomcontent .col { width:170px; float:left; margin-right:15px;}
#bottomcontent .col h2 { color:#666666; font-size:17px; font-weight:bold; margin-top:10px;}
#bottomcontent .col p { line-height:1.6em; font-size:.9em; margin:0;}
#bottomcontent .col.two {}
#bottomcontent .col.three {}
#bottomcontent .col.four { margin-right:0;}

/******2-columns-right-body******/
#column-left { width:759px; float:left; /*min-height:400px;*/ padding-bottom:20px;}
#column-right { width:183px; min-height:400px; /*margin-left:767px;*/ float:left; margin-left:8px;}

#column-left img.main { width:759px; height:130px; margin-bottom:5px; border-bottom:1px solid #333333;}
#column-left #breadcrumb { margin:5px 0 10px; font-size:.9em;}
#column-left h2 { padding:10px 0 10px 10px;  font-size:1.2em; background-color: #2D8C3C; color:#FFFFFF; font-weight:bold; margin-bottom:20px; clear:both;}
#column-left p { margin-right:20px;}

#column-right img.main { width:183px; height:130px; margin-bottom:31px; border-bottom:1px solid #333333;}
#column-right #separator { background-color: #2D8C3C; height:34px; margin-bottom:6px; }
#column-right #separator a { 
	font-size:1.2em; 
	font-weight:bold; 
	color:#FFFFFF; 
	display:inline-block; 
	padding:10px 40px 10px 10px; 
	text-decoration:none;
	background:url(../images/request-arrow.png) right no-repeat;
	}
/*#column-right h2 { padding:10px 0 10px 10px;  font-size:1.2em; background-color: #2D8C3C; color:#FFFFFF; font-weight:bold;}*/
#column-right h4 { padding:15px 0 10px 5px;;}
#column-right p { margin-left:5px;}
#column-right ul { /*margin-left:27px;*/ font-size:.9em;}

/******1-columns******/
#one-column { width:950px; float:left; min-height:400px;}
#one-column img.main { width:950px; height:130px; margin-bottom:5px; border-bottom:1px solid #333333;}
#one-column #breadcrumb { margin:5px 0 10px; font-size:.9em;}
#one-column h2 { padding:10px 0 10px 10px;  font-size:1.2em; background-color: #2D8C3C; color:#FFFFFF; font-weight:bold; margin-bottom:20px;}
#one-column p { margin-right:20px;}

/********** Design Services Page ************/

#services { padding-top:20px; }
#services ul { width:759px; list-style:none; padding:0;}
#services li { float:left; padding:0 21px 0 0; width:174px;}
#services li.last { padding:0; }
#services img { padding:0; margin:0;}
#services h4.title { 
		display:block;
		font-size:12px;
		font-weight:bold;
		line-height:16px;
		min-height:15px;
		padding:10px 0 0px;
		margin:0;
		}
#services p.summary {
		font-size:11px;
		line-height:15px;
		min-height:20px;
		margin:5px 0 0;
		}
/********** Portfolio Page ************/
#column-left h1 {
	font-size:2em;
	color:#666666;
	font-weight:bold;
	padding:15px 0 5px;
	letter-spacing:-1px;
	}

#one-column .top { width:950px; padding-top:20px; }
#one-column .col { width:280px; margin:0 52px 20px 2px; float:left;}
#one-column .col.one {}
#one-column .col.two {}
.col.two img {padding-right:30px;}
#one-column .col.three {margin:0 0 20px 0;}
#one-column .col img { }
#one-column .col h3 { font-weight:bold; padding:10px 0 0; color:#666666;}
#one-column .col p { margin:5px 0 10px;}
#one-column .bottom { min-height:500px; margin:20px 0;}

ul#portfolio { float: left; list-style: none; margin-left:85px; width: /*950px;*/880px; padding:20px 0; }
ul#portfolio li { 
	float: left; 
	margin: 0 19px 14px 0; 
	width: /*170px;*/ 250px;
	height:/*160px;*/280px;
	background-color:#EAEAEA;
	font-size:.8em;
	line-height:1.4em;
	}
ul#portfolio li:hover { background-color:#BCBCBC}
ul#portfolio a { display: block; width: 100%; color:#000000; }
ul#portfolio a:hover { text-decoration: none; }
ul#portfolio img {}
ul#portfolio a span { display:block; margin:0; padding: 0 0 0 7px; color:#666666;}
ul#portfolio a span.name { padding:5px 0 1px 7px; font-weight:bold; border-top: 3px solid #FFFFFF; color:#000000;  }
ul#portfolio a span.title { }
ul#portfolio a span.service { /*font-style:italic;*/}

/********** Project Page **********/

#proj .col { float:left;}
#proj .col.one { width:595px; margin: 0 20px 0 2px; padding: 0 3px;}
#proj .col.two { width:320px; margin: 0; padding: 0 3px;}
#proj .col p { }
#proj .col p span {display:block; font-weight:bold; font-size:1.1em;}
#proj .col h3 { font-weight:bold; padding:10px 0 0; color:#666666;}

#proj #view { margin: 0; padding:10px 0 0 3px; width:370px;}
#proj #view a img { margin:10px 0;}

#proj #servprov { margin: 15px 0 0 0; padding:10px 0 0 3px; border-top: 4px solid #333333; width:320px;}
#proj #servprov a { display:block;}
#proj #servprov h4 {  padding:10px 0 5px; font-size:.9em;}
#proj #servprov ul { list-style-type:none; list-style-image:none; width:320px; font-size:.8em;}
#proj #servprov { width:320px; }

/********** Contact Us Page **********/
#one-column #column-left { width:560px; float:left; min-height:400px;}
#one-column #column-right { width:350px; min-height:400px; float:right; /*margin-left:589px;*/}
#one-column #column-right h1 { color:#666666; font-size:2em; margin-top:32px; }
#flash-map { margin:32px 0 10px 0;}
form#contact-us { margin:5px 0 20px;}
#contact-us p { font-size:.9em; line-height:1.2em; margin:3px 0;} 
#contact-us input { width:560px; padding:5px; border:0; background-color:#CCC}
#contact-us textarea { width:560px; height:116px; padding:5px; border:0; background-color:#CCC}
#contact-us p input#submit { padding:2px 15px; color:#FFFFFF; background-color:#333333; border:0; margin-top:3px; font-size:.9em; width:100px;}
ul#contact-info { margin:10px 0; font-size:1em;}
ul#contact-info strong {font-weight:bold;}

/* Process Pages */
#process { padding-bottom:20px;}
#process ul { list-style:none; padding:0; margin:0;}
#process li { border-bottom:1px dotted #999999; min-height:200px; display:block;}
#process li:hover { background-color:#333333; color:#FFFFFF; cursor:pointer;}
#process li.last { border:0; }
#process .number { float:left; padding:47px 0 0 10px;}
#process .info { float:left; width:620px;}
#process h4 { padding:20px 20px 0;}
#process p { margin:0; padding:10px 20px 20px; }

/* Design Team */
#team { padding-bottom:20px;}
#team ul { list-style:none; padding:0; margin:0;}
#team li { min-height:160px; display:block;}
#team li.last { border:0; }
#team .graphic { float:left; padding:35px 0 0 10px;}
#team .info { float:left; width:620px;}
#team h4 { padding:20px 20px 0;}
#team p { margin:0; padding:10px 20px 20px; }

/* FAQs */
#faqs { margin:30px 0 20px 4px;}
#faqs ul { margin: 0 0 30px 0; list-style-type:none; list-style-image:none; line-height:1.5em;}
#faqs dl {}
#faqs dt { margin-bottom:5px; font-size:1.1em; font-weight:bold;}
#faqs dd { margin-bottom:30px; line-height:1.4em;}

/* Ecommerce Pages */
table#features { margin:0 0 20px 4px; width:747px; border: 1px solid #999999;}
table#features tr#v5 {background-color:#2d8c3c; color:#FFFFFF;}
table#features td { padding: 10px 0 10px 10px; border-bottom:1px solid #999999;}
table#features td img { margin:0 0 0 13px;}
table#features tr.highlight { background-color:#2d8c3c; color:#FFFFFF; font-weight: bold;}
table#features tr.plain { background-color:#FFFFFF; color:#000000;}
table#features td.last { border-bottom:0;}
table#features tr.title {background-color:#333333; color:#FFFFFF; font-weight:bold;}
table#features tr.title td { padding:10px 10px;}

/* Hosting Services Page */
.hostserv { min-height:200px; margin-bottom:40px;}
.hostserv.top { margin:0}
/*.hostserv .col { float:left;}*/
/*.hostserv .col.one { width: 230px; padding:20px 0 0}*/
/*.hostserv .col.two { width:525px;}*/
.hostserv h1 {margin-bottom:0.5em;}
.hostserv img.left-align {float:left;}
.hostserv p {padding-top:0; margin-top:0;}
.hostserv ul { margin-left:12%;}
.hostserv ul li { display:inline; list-style-image:none; margin-right:4px; padding-right:5px;  border-right:1px solid #999999;}
.hostserv ul li.last { border-right:0;}

/* 4-Column */
/*#four-col { width:950px; margin-top:30px;}*/
#four-col td { width:200px; /*float:left;*/ padding:10px 42px 30px 4px; vertical-align:top;}
/*#four-col .col.float { position:relative; top:-80px;}*/ /*Moves Marketing and Ecommerce links up*/
#four-col td.last { margin:0 0 20px 0;}
#four-col /*.col*/ h4 { color:#000000; margin-bottom:5px;}
#four-col /*.col*/ ul { list-style-image:none; list-style-type:none; line-height:1.5em; font-size:1em;}

/*** Expandable/Info Boxes ***/
#info-list {margin:0; padding-top:22px;}
#info-list p {margin-top:0; padding-top:0;}
#info-list h4 {border-bottom:solid 1px #2d8c3c; margin-bottom:4px;}
#info-list table {background-color:#CCCCCC; line-height:2em;}

#more-info {margin:0 100px 0 0;}
#more-info h2 {margin-bottom:10px; background-color:#666666;}
#more-info h2:hover {background-color:#414141;}
#more-info a:hover {color:#FFFFFF;}

h2.expand_heading {padding: 0; margin: 0;}

h2.expand_heading a {color: #ffffff; text-decoration: none; /*display: block;*/}
h2.expand_heading a:hover {color: #cccccc;}

.expand_heading:after {content:'+ / -'; float:right; font-size:0.75em; margin-right:1em; margin-left:100px;}

h2.active {background-position: left bottom;}

.toggle_container {margin: 0 0 25px 0; padding: 0; border-top: 1px solid #d6d6d6; background: #f0f0f0; overflow: hidden; font-size: 1.2em; clear: both; }
.toggle_container .mbox {padding:8px 20px; margin:0;}
#more-info .toggle_container .mbox a:hover {color:#8A8C8A;}
.toggle_container .mbox p {padding: 5px; margin: 0;}
.toggle_container h3 {font: 2.0em normal Georgia, "Times New Roman", Times, serif; margin: 0; padding: 0; color:#000000; border-bottom: 1px dotted #ccc;}

/*** Lightbox Gallery ***/
.lightbox-gallery ul li {list-style:none; display:inline;}

/*** Services Chart ***/
#services-chart img {margin-right:10px;}
#services-chart a {font-size:1.25em; font-weight:bold;}
#services-chart .box_bg {border:1px solid #666666; height:90px; margin:5px; padding:5px;}

/*** Marketing ***/
#marketing {margin-bottom:2em;}
img.clear {margin:0 0 0 10px; padding:0 0 10px 0;}

/********* Hover Popup ************/
.popup {position:relative; z-index:10; outline:none;}
.popup span {display:none; position:absolute; top:-10px; left:10px; border:1px solid #AAA; padding:10px; width:200px; background-color:#c4ffc4; text-align:left;}
.popup:hover {background-color:#E8EDFF; text-decoration:none; cursor:default;}
.popup:hover span {display:block;}

/********* CAPTCHA Error ************/
#captchaError {text-align:center; margin:1em; color:#F00; padding: 0; font-size:2em;}