/**
*	Clay Ant Creative Style Sheet
*/

/**
* Defaults
******************************************************************************************/
* { margin: 0px; padding: 0px; }

body {
	background: #333;
	color: #444;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	line-height: 24px;
}

a {
	color: #333333;
	outline: none;
	text-decoration: none;
} /*8E9D98*/
a:hover {
	color: #990000;
	text-decoration: none;
}

a.tt { color: #a7481a; border-bottom: dotted 1px #a7481a; text-decoration: none; }
a:hover.tt { color: #a7481a; border-bottom: solid 1px #a7481a; text-decoration: none; }
a img { border: none; }
b { font-weight: normal; }

input.txt {
	border: solid 1px #8E9D98;
	width: 254px;
	padding: 3px;
}



textarea {
	border: solid 1px #8E9D98;
	height: 100px;
	padding: 3px;
	width: 254px;
}





.trans {}

/**
* Classes
******************************************************************************************/
div.clear { clear: both; height: 0px; }
.play { background: url(../images/common/play.gif) no-repeat 0% 50%; padding-left: 25px; line-height: 20px; display: block; }
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
.quote {
	font-size: 12px;
	color: #333;
	font-weight: normal;
	line-height: 20px;
	font-family: Arial, Helvetica, sans-serif;
}
.quote-bold-12 { font-size: 12px; color: #333; font-weight: bold; line-height: 20px; }



.border {border:1px solid #000000}

.codeFrame {
	border: solid 2px #da6228;
}

/**
* Header
******************************************************************************************/
#header-wrapper {
	border-bottom: solid 3px #8E9D98;
	height: 100px;
	width: 100%;
	background-image: url(../images/template/menu1.jpg);
}
#header {
	height: 100px;
	position: relative;
	text-align: left;
	_margin-left:10px;
	_width: 950px;
	width: 920px !important; 
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(../images/template/menu.jpg);
	background-repeat: no-repeat;
	background-position: 0% 0%;
}
#header #navigation { background: transparent; color: #fff; float: right; height: 35px; line-height: 35px; margin-top: 65px; width: 740px; }
#header #navigation li { /*border-left: solid 2px #333;*/ margin-left: 2px; float: right; list-style-type: none; white-space: nowrap; }
#header #navigation li a { background: #56626E; color: #fff; display: block; font-size: 12px; font-weight: bold; padding: 0px 15px; text-decoration: none; }
#header #navigation a:hover { background: #da6228; color: #fff; text-decoration: none; }
#header #navigation .selected { background: #8E9D98; color: #fff; text-decoration: none; }
#header #navigation li.home { border-left: none; }

/**
* Content
******************************************************************************************/
#content-wrapper {
	text-align: center;
	width: 100%;
	/*background: #212221 url(../images/template/background.jpg) repeat-x 0% 0%;*/
	background: #212221 url(../images/template/tile.jpg) repeat 0% 0%;
}

#content {
	margin: 0px auto;
	position: relative;
	text-align: left;
	width: 1000px;
}

#banner {
	/*background: url(../images/banners/home.jpg) no-repeat 0% 0%;*/
	height: 120px;
	width: 800px;
}

#banner div {
	float: left;
	color: #fff;
	font-size: 11px;
	width: 800px;
	margin-top: 50px;
	margin-right: 10px;
	margin-bottom: 0;
	margin-left:40px !important ;  
	margin-left:20px;
}


.banner-home {
	background-repeat: no-repeat;
	background-position: 0% 0%;
}


#banner-sub {
	/*background: url(../images/banners/home.jpg) no-repeat 0% 0%;*/
	height: 120px;
	width: 1000px;
}

#banner-line {
	height: 6px;
	line-height: 12px;
	width: 1000px;
}

#wrapper {
	background: url(../images/template/slice.gif) repeat-y 0% 0%;
	width: 1000px;
	overflow:auto;
}

body.home #wrapper {
	background: url(../images/template/slice.gif) repeat-y 0% 0%;
	width: 1000px;
}

body.marketing #wrapper {
	background: url(../images/template/slice2.gif) repeat-y 0% 0%;
	width: 1000px;
}

#page { float: right; padding-bottom: 15px; width: 700px; }
#page ul { margin: 5px 10px 5px 15px; }
#page li { padding-bottom: 5px; }
#page p {
	line-height: 24px;
	padding: 5px 0px;
}
#page .breadcrumb { font-size: 11px; line-height: 15px; padding: 15px 0px 10px 0px; }
#page span { font-style: normal; font-weight: bold; font-size: 12px; }
#page span.bold-gray { color: #333; }
#page span.bold-blue { color: #8E9D98; }
#page span.bold-orange { color: #da6228; }
#page span.larger{ font-size: 14px; font-weight: bold; color: #da6228; }
#page h1 { color: #56626E; font-size: 24px; font-weight: bold; }
#page h1 span { font-size: 24px; color: #db5c2d; font-style: normal; }

#page h1 span.alt { font-size: 24px; color: #333; font-weight: bold; }

#page h2 { color: #56626E; font-size: 16px; font-weight: bold; }
#page h3 { color: #999; font-size: 18px; font-weight: bold; }
#page .legend { color: #ccc; font-size: 11px; padding: 5px 0px 0px 20px; }
#page .green { background: url(../images/common/green-circle.gif) no-repeat 0% 50%; }
#page .orange { background: url(../images/common/orange-circle.gif) no-repeat 0% 50%; }
#page .semi { background: url(../images/common/semi-circle.gif) no-repeat 0% 50%; }

#page .box { float: left; width: 206px; }
#page .box h3 { padding: 10px 20px 5px 0px; }
#page .box p { padding: 5px 20px 5px 0px; }

#page #column-400 { float: left; width: 400px; }
#page #column-400 h1 { padding: 15px 0px 10px 80px; }
#page #column-400 p { padding: 5px 0px 5px 80px; }
#page #column-400 p.overflow { padding: 5px 0px; }

#page #column-260 { float: right; width: 260px; }
#page #column-260 h2 { padding: 15px 0px 10px 0px; }
#page #column-260 p { padding: 5px 0px; }
#page #column-260 p.showcase { border-bottom: solid 1px #ccc; padding: 5px 0px 0px 0px; }
#page #column-260 p.play { float: left; line-height: 20px; padding: 5px 0px 0px 0px; text-align: left; width: 50%; }
#page #column-260 p.view { float: right; line-height: 20px; padding: 5px 0px; text-align: right; width: 40%; }

#page .block-620 {
	/*background: url(../images/template/dots.gif) repeat-x 0% 100%;*/
	float: left;
	padding-bottom: 10px;
	width: 620px;
}

#page .block-work {
	background: url(../images/template/dots.gif) repeat-x 0% 100%;
	float: right;
	padding-bottom: 10px;
	margin-bottom: 20px;
	width: 620px;
}




#sidebar {
	float: left;
	margin-left: 40px !important ;  
	margin-left: 20px;
	width: 220px;
}

#sidebar h1 {
	background: #56626E;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	padding: 10px;
}

#sidebar span { color: #da6228; font-size: 14px; font-weight: bold; }

#sidebar p { line-height: 17px; padding: 5px 15px; }

#sidebar p.small {
	line-height: 20px;
	padding: 5px 20px;
	font-size: 11px;
}

#sidebar p.contactdetails {
	background:#d0dbdd;
	font-size: 10px;
	line-height: 17px;
	padding: 10px 15px;
}

#sidebar p.contactdetails span{
	color: #333;
	font-size: 11px;
	font-weight: bold;
}

#sidebar ul {
	margin: 0px;
	list-style: none;
}

#sidebar li {
	background: #c6cecb url(../images/template/dots.gif) repeat-x 0% 100%;
	/*padding: 7px 10px 8px 10px;*/
}

#sidebar li a { color: #56626E; text-decoration: underline; display: block; padding: 0px; padding: 7px 10px 8px 10px;}


#sidebar li a:hover, #sidebar .selected { padding: 7px 10px 8px 10px; color: #db5c2d; text-decoration: none; background: #fff url(../images/template/dots.gif) repeat-x 0% 100%; }

#teasers {
	background: #fff url(../images/template/dots.gif) repeat-x 0% 0%;
	clear: both;
	margin: 0px 40px;
	padding-top: 1px;
	width: 920px;
}
#teasers1 {
	background: #fff url(../images/template/dots.gif) repeat-x 0% 0%;
	clear: both;
	margin: 0px 40px;
	width: 920px;
}
#teasers2 {
	background: #fff url(../images/template/dots.gif) repeat-x 0% 0%;
	clear: both;
	margin: 0px 40px;
	width: 920px;
}

#teasers ul { list-style: none; margin: 0px 10px; }

#teasers li {
	background: #fff;
	color: #666;
	float: left;
	display: block;
	height: 100px;
	width: 600px;
}

#teasers img { float: left; margin: 0px 10px 10px 0px; }

#teasers h1 {
	color: #8E9D98;
	font-size: 12px;
	font-weight: bold;
	padding: 10px 10px 5px 0px;
}

#teasers p { font-size: 11px; line-height: 15px; padding: 5px 0px 5px 0px; }

/*********/

#sidebar #teasers-side {
	width: 220px;
}

#sidebar #teasers-side ul { list-style: none; margin: 0px; }

#sidebar #teasers-side li {
	color: #666;
	float: left;
	display: block;
	/*height: 100px;*/
	margin: 5px 0px 5px 0px;
	padding: 0px;
	width: 220px;
	background: none;
}

#sidebar #teasers-side img { float: left; margin: 0px 5px 40px 0px; }

#sidebar #teasers-side h2 {
	color: #8E9D98;
	font-size: 12px;
	font-weight: bold;
	padding: 10px 10px 5px 0px;
}

#sidebar #teasers-side p { font-size: 11px; line-height: 15px; padding: 5px 10px 5px 0px; }

#sidebar #teasers-side a { padding: 0px; color: #8e9d98; text-decoration: underline; background: none;}
#sidebar #teasers-side a:hover { color: #8e9d98; text-decoration: none; }



/**
* Footer
******************************************************************************************/
#footer {
	background: #333 url(../images/template/footer-sb.jpg) no-repeat 0% 0%;
	clear: both;
	color: #999;
	font-size: 10px;
	position: relative;
	text-align: left;
	width: 920px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 30px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
}

/* Used for home page footer where sidebar doesn’t extend over into the footer */
.home #footer, .marketing #footer { background-image: url(../images/template/footer.jpg); }

#footer span { padding-right: 5px; }
#footer a { color: #999; padding: 0px 5px; text-decoration: none; }
#footer a:hover { color: #ccc; text-decoration: underline; }
#footer .foot-left {
	float: left;
	padding-left: 10px;
	width: 600px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 24px;
	color: #999999;
}
#footer .foot-right { float: right; padding-right: 10px; text-align: right; width: 200px; }




/***/


#page .team {
	border-collapse: collapse;
	font-size: 12px;
	margin: 20px 0;
	width: 620px;
}




#tooltip h3, #tooltip div { margin: 0; padding: 0;}
.red {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #CC0000;
}
.red1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 10px;
	color: #CC0000;
}
* {margin:0; padding:0}

#text {margin:50px auto; width:500px}
.hotspot {
	color:#CC6600;
	padding-bottom:1px;
	border-bottom:1px dotted #900;
	cursor:pointer
}

#tt {position:absolute; display:block; background:url(images/tt_left.gif) top left no-repeat}
#tttop {display:block; height:5px; margin-left:5px; background:url(images/tt_top.gif) top right no-repeat; overflow:hidden}
#ttcont {
	display:block;
	padding:2px 12px 3px 7px;
	margin-left:5px;
	background:#666;
	color:#FFF;
	font-size: 14px;
	font-weight: bold;
}
#ttbot {display:block; height:5px; margin-left:5px; background:url(images/tt_bottom.gif) top right no-repeat; overflow:hidden}
.bai {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: normal;
	font-weight: bold;
	color: #FFFFFF;
}