/**
* Customer web site CSS
*
* Copyright (c)2008 44 Interactive. All Rights Reserved.
*
* SVN File: $Id: styles.css 217 2008-07-28 19:06:27Z Mike Neugebauer $
* @author $Author: Mike Neugebauer $
* @version $Revision: 217 $
* @lastrevision $Date: 2008-07-28 14:06:27 -0500 (Mon, 28 Jul 2008) $
* @modifiedby $LastChangedBy: Mike Neugebauer $
* @lastmodified $LastChangedDate: 2008-07-28 14:06:27 -0500 (Mon, 28 Jul 2008) $
* @filesource $URL: svn+ssh://miken@svnhost.44i-dev.com/svnhome/base/trunk/cust_skeleton/css/styles.css $
*/

* { 
	margin: 0;
	padding: 0;
	border: 0;
	outline:none;
}

html {
	font-size: 76%;
	height:100.2%;
	width:100%;
}

body {
	font-family:"Trebuchet MS", Verdana, sans-serif;
	background: #dfc69d url(/_cust/images/bgtile.jpg) repeat;
	color:#292828;
}

h1, h2, h3, h4, h5 {
	color:#01539f;
	font-weight:normal;
    font-family: Geneva, Tahoma, Verdana;
}

h1 {
	text-transform: uppercase;
    font-size: 33px;
    margin-bottom: 8px;
	letter-spacing: 1px;
}

h2 {
	text-transform: uppercase;
	font-size: 26px;
    margin-bottom: 6px;
    letter-spacing: 1px;
}

h3 {

	font-size: 22px;
	margin-bottom: 6px;
}

h4 {
	font-size: 15px;
	margin-bottom: 4px;
}

h5 {
	font-size: 1.3em;
}

a:link {
	color:#01539f;
	text-decoration: underline;
}

a:visited {
	color:#627cb9;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

a:active {
	color:#627cb9;
	text-decoration: none;
}

p {
	line-height:1.7em;
	margin-bottom:10px;
}

/*------------------------------------------------------------ MAIN BODY STYLES -------------------------------------------------------*/

#container {
	width: 945px;
	margin: 8px auto 0;
}

#content {
	float: right;
	width: 608px;
	margin-bottom: 50px;
}

#content p {
	text-align: justify;
}

#slideshow {
	background: #eab76f url(/_cust/images/slideshow_bg.jpg) no-repeat;
	position: relative;
	display: block;
	height: 362px;
	width: 608px;
	margin-bottom: 15px;
}

#slideshow img {
	background-color: #0a0909;
	display: block;
	position: absolute;
	margin: 8px 0 0 9px;
	width: 589px;
	height: 341px;	
}

#slideshow img {
	position: absolute;
	z-index: 8;
}

#slideshow img.active {
	z-index:10;
}

#slideshow img.last-active {
	z-index: 9;
}

#subnav {
	font-size: 15px;
	margin-bottom: 18px;
}

#subnav a {
	text-decoration: none;
	margin-left: 20px;
}

#subnav a.active {
	text-decoration: underline;
}





/*----------------------------------------------------------- HEADER STYLES -----------------------------------------------------------*/

#hwrap {
	background: #f8f5ed url(/_cust/images/htile.jpg) repeat-x 0 0;
	height:106px;
	width:100%;
}

#header {
	width:965px;
	margin:0 auto;
	height:106px;
}

#header .logo {
	background-color: #c7cee8;
	display: block;
	width: 267px;
	height: 47px;
	margin-top: 30px;
	float: left;
}

/*----------------------------------------------------------- NAVIGATION STYLES -----------------------------------------------------------*/

ul#nav {
	background-color: #ffffff;
	width:672px;
	height:40px;
	float:right;
	margin: 35px 0 0;
}

ul#nav li {
	list-style:none;
	float:left;
}

ul#nav li a {
	display:block;
	overflow:hidden;
	text-indent:-9000px;
	height:40px;
}

ul#nav li a.productsBtn, ul#nav li a.productsBtn:visited {
	width:166px;
	background:url(/_cust/images/productsBtn.jpg) top no-repeat;
}

ul#nav li a.casestudiesBtn, ul#nav li a.casestudiesBtn:visited {
	width:107px;
	background:url(/_cust/images/casestudiesBtn.jpg) top no-repeat;
}

ul#nav li a.galleryBtn, ul#nav li a.galleryBtn:visited {
	width:74px;
	background:url(/_cust/images/galleryBtn.jpg) top no-repeat;
}

ul#nav li a.aboutBtn, ul#nav li a.aboutBtn:visited {
	width:81px;
	background:url(/_cust/images/aboutBtn.jpg) top no-repeat;
}

ul#nav li a.faqsBtn, ul#nav li a.faqsBtn:visited {
	width:160px;
	background:url(/_cust/images/faqsBtn.jpg) top no-repeat;
}

ul#nav li a.contactBtn, ul#nav li a.contactBtn:visited {
	width:84px;
	background:url(/_cust/images/contactBtn.jpg) top no-repeat;
}

ul#nav li a.productsBtn:hover,
ul#nav li a.casestudiesBtn:hover,
ul#nav li a.galleryBtn:hover,
ul#nav li a.aboutBtn:hover,
ul#nav li a.faqsBtn:hover,
ul#nav li a.contactBtn:hover {
	background-position:center;
}

body#productsservice ul#nav li a.productsBtn,
body#caseStudiesPage ul#nav li a.casestudiesBtn,
body#casestudiesdetail ul#nav li a.casestudiesBtn,
body#GalleryPage ul#nav li a.galleryBtn,
body#about ul#nav li a.aboutBtn,
body#faqs ul#nav li a.faqsBtn,
body#contactPage ul#nav li a.contactBtn {
	background-position:bottom;
	cursor:default;
}

/*----------------------------------------------------------- TABS STYLES -----------------------------------------------------------*/

ul#tabs {
	position: relative;
	float: right;
	height: 35px;
	margin: -22px 16px 5px 0;
}

ul#tabs li {
	list-style: none;
	float: left;
	margin-left: 14px;
}

ul#tabs li a {
	display: block;
	text-indent: -9000px;
	overflow: hidden;
	height: 35px;
}

ul#tabs li a.homeideasTab, ul#tabs li a.homeideasTab:visited {
	width: 234px;
	background: #e8c997 url(/_cust/images/homeideasTab.jpg) no-repeat;
}

ul#tabs li a.galleryTab, ul#tabs li a.galleryTab:visited {
	width: 128px;
	background: #e8c997 url(/_cust/images/galleryTab.jpg) no-repeat;
}

ul#tabs li a.homeTab, ul#tabs li a.homeTab:visited {
	width: 128px;
	background: #e8c997 url(/_cust/images/homeTab.jpg) no-repeat;
}

ul#tabs li a:hover {
	background-position: bottom;
}


/*----------------------------------------------------------- SIDEBAR STYLES -----------------------------------------------------------*/

#sidebar {
	float: left;
	width: 303px;
	padding-bottom: 60px;
	padding-left: 5px;
}
	
#productspanel {
	background: url(/_cust/images/productspanel_bottom.jpg) no-repeat bottom left;
	width: 303px;
	padding-bottom: 16px;
	margin-bottom: 9px;
}

#productspanel h2 {
	background: url(/_cust/images/productspanel_h2.jpg) no-repeat center;
	display: block;
	text-indent: -9000px;
	overflow: hidden;
	width: 303px;
	height: 33px;
	margin-bottom: 0;
}

#sidebar ul#productslist  {
	padding-top: 4px;
	background: url(/_cust/images/productspanel_tile.jpg) repeat-y;
}

#sidebar ul#productslist li {
	list-style: none;
	clear: left;
}

#sidebar ul#productslist li a {
	display: block;
	height: 58px;
	width: 286px;	
	padding: 16px 11px;
	font-size: 18px;
	color: #3d3d3d;
	text-decoration: none;
}

#sidebar ul#productslist li a em {
	font-size: 12px;
	line-height: 15px;
	color: #767676;
	font-style: normal;
	width: 180px;
	float: left;
}

#sidebar ul#productslist li a img {
	background-color: #0a0909;
	font-size: 7px;
	float: left;
	display: block;
	width: 80px;
	height: 57px;
	margin-right: 13px;
}
	
#sidebar ul#productslist li a:hover {
	background: url(/_cust/images/productspanel_tilehover.jpg) repeat-y;
	color: #f7f4ed;
}

#sidebar ul#productslist li a:hover em {
	color: #cfcfcf;
}


#sidebar .panel  {
	background: #fbfaf6 url(/_cust/images/panel_bottom.jpg) no-repeat bottom;
	width: 303px;
	padding-bottom: 14px;
	margin-bottom: 9px;
}

#sidebar .panel img.icon {
	background-color: #0a0909;
	font-size: 7px;
	float: left;
	display: block;
	width: 113px;
	height: 80px;
	margin-right: 13px;
}

#sidebar .panel a {
	background: #fbfaf6 url(/_cust/images/panel_tile.jpg) repeat-y;
	display: block;
	height: 80px;
	width: 281px;	
	padding: 17px 11px 5px 11px;
	font-size: 11px;
	line-height: 20px;
	color: #00529f;
	text-decoration: none;	
	position: relative;
}
	
#sidebar .panel img.arrow {
	position: absolute;
	top: -18px;
	right: 10px;
	display: none;	
}

#sidebar .panel a:hover img.arrow {
	display: block;
}

#sidebar .panel a:hover {
	color: #0a0909;
}

#sidebar .panel h2 {
	display: block;
	text-indent: -9000px;
	overflow: hidden;
	width: 303px;
	height: 27px;
	margin-bottom: 0;
}

#sidebar .panel h2.services {
	background: #fbfaf6 url(/_cust/images/servicespanel_h2.jpg) no-repeat;
}

#sidebar .panel h2.casestudies {
	background: #fbfaf6 url(/_cust/images/casestudiespanel_h2.jpg) no-repeat;
}

#sidebar .panel h2.gallery {
	background: #fbfaf6 url(/_cust/images/gallerypanel_h2.jpg) no-repeat;
}

#sidebar .panel h2.productsservices {
	background: #fbfaf6 url(/_cust/images/productsservicespanel_h2.jpg) no-repeat;
}



/*----------------------------------------------------- PRODUCTS SERVICES STYLES ---------------------------------------------*/

body#productsservice #content {
	min-height: 800px;
}


#content ul#productslist  {
	width: 585px;
}

#content ul#productslist li {
	background: url(/_cust/images/bglight_tile.jpg) repeat;
	list-style: none;
	clear: both;
	padding: 16px 11px;
	text-decoration: none;
	margin-bottom: 16px;
	width: 585px;
	float: left;
}

#content ul#productslist .colleft {
	width: 100px;
	margin-right: 13px;
	float: left;
}

#content ul#productslist .colright {
	width: 420px;
	float: left;
}

#content ul#productslist h3 {
	color: #3d3d3d;
}

#content ul#productslist li  p {
	font-size: 12px;
	color: #767676;
}

#content ul#productslist li p.subtitle {
	color: #01539f;
	margin-bottom: 0;
	clear: both;
	text-align: center;
	
}

#content ul#productslist li img {
	font-size: 7px;
	display: block;
	margin-bottom: 8px;
}

#content ul#serviceslist {
	list-style: none;
	clear: both;
	margin-top: 12px;
}

/*----------------------------------------------------- CASE STUDIES STYLES ---------------------------------------------*/

ul#casestudieslist li {
	list-style: none;
	width: 585px;
}

ul#casestudieslist li a {
	float: left;
	display: block;
	height: auto;
	width: 608px;
	padding: 16px 11px 8px;
	text-decoration: none;
	background: url(/_cust/images/bglight_tile.jpg) repeat;
	margin-bottom: 16px;
}

ul#casestudieslist li a:hover {
	background: #FCF8F5;
}

ul#casestudieslist li a:hover strong {
	color: #01539f;
}

ul#casestudieslist li a:hover em {
	color: #444;
}

ul#casestudieslist a strong {
	color: #3d3d3d;
	font-size: 15px;
	font-weight: normal;
}

ul#casestudieslist a em {
	float: left;
	width: 470px;
	color: #767676;
	text-align: left;
	font-style: normal;
	line-height:1.7em;
	margin-bottom:10px;
	margin-top: 4px;
}

ul#casestudieslist a img {
	background: #a6895b;
	font-size: 7px;
	display: block;
	margin-bottom: 8px;
	float: left;
	margin-right: 10px;
}


ul#casestudieslist .colleft {
	width: 100px;
	margin-right: 13px;
	float: left;
}

ul#casestudieslist .colright {
	width: 470px;
	float: left;
}

ul#casestudieslist h3 {
	color: #3d3d3d;
	font-size: 15px;
}





/*----------------------------------------------------- ABOUT US STYLES ---------------------------------------------*/

ul#stafflisting {
	width: 608px;
}

ul#stafflisting li {
	background: url(/_cust/images/bglight_tile.jpg) repeat;
	list-style: none;
	clear: both;
	padding: 16px 11px;
	text-decoration: none;
	margin-bottom: 16px;
	float: left;
	width: 585px;
}

ul#stafflisting .colleft {
	width: 112px;
	margin-right: 0px;
	float: left;
}

ul#stafflisting .colright {
	width: 461px;
	padding-right: 10px;
	float: left;
}

ul#stafflisting li img {
	background: url(/_cust/images/bglight_tile.jpg) repeat;
	border: 1px solid #a6895b;
	float: left;
	margin-right: 6px;
}

ul#stafflisting li p.name strong {
	text-transform: uppercase;
	letter-spacing: 0px;
	font-size: 16px;
	
}

ul#stafflisting li p.name {
	line-height: 16px;
	color: #292828;
	text-align: left;
}

ul#stafflisting li p em {
	color: #4f565c;
	font-style: normal;
}

ul#stafflisting li p {
	color: #767676;
}

#phonenumbers {
	line-height: 30px;
	font-size: 16px;
	color: #01539F;
	margin-left: 14px;
}


/*----------------------------------------------------- FAQs & TERMINOLOGY STYLES ---------------------------------------------*/

ul#faqslist li, ul#terms li {
	list-style: none;
	font-size: 13px;
	margin: 0 0 14px 24px;
}

ul#faqslist li a, ul#terms li a {
	background: url(/_cust/images/icon_plus.jpg) no-repeat top left;
	o//verflow: hidden;
	t//ext-indent: -9999px;
	text-decoration: none;
	color: #464646;
	height: 13px;
	display: block;
}

ul#faqslist li a:hover, ul#terms li a:hover{
	background-position: top left;
	color: #01539F;
}

ul#faqslist li a.active, ul#terms li a.active {
	background: url(/_cust/images/icon_minus.jpg) no-repeat top left;
	color: #01539F;
}

ul#faqslist li a.active:hover, ul#terms li a.active:hover{
	background-position: top left;
}

ul#faqslist li a span, ul#terms li a span {
	margin-left: 20px;
}

ul#faqslist li .answer, ul#terms li .answer {
	display: block;
	width: 400px;
	height: auto;
	padding: 10px;
	margin-top: 3px;
	margin-left: 20px;
	background: url(/_cust/images/bglight_tile.jpg) repeat;
}

/*----------------------------------------------------- FOOTER STYLES ---------------------------------------------*/

#fwrap {
	background: #e5b770 url(/_cust/images/ftile.jpg) repeat-x top;
	clear: both;
	width: 100%;
	height: 53px;
	line-height: 53px;
}

#footer {
	margin: 0 auto;
	width: 945px;
	text-transform: uppercase;
	color: #00529f;
	font-size: 11px;
}

#footer a {
	text-decoration: none;
}

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

#footer ul.left {
	float: left;
	list-style: none;
}

#footer ul.left li {
	margin-right: 18px;
	float: left;
}

#footer ul.right {
	float: right;
	list-style: none;
}




/*----------------------------------------------------- CONTACT ---------------------------------------------*/


body#contactPage #content #colleft {
	width: 410px;
	float: left;
}

body#contactPage #content #colright {
	width: 180px;
	float: left;
	margin-top: 55px;
}

body#contactPage #content #colright p {
	text-align: left;
}

input.ffi  {
	border: 1px solid #666666;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	padding:3px 5px;
	background:url(../_cust/images/inputBG.png) #FAF9F5 repeat-x top;
}

#employmentPage h5 {
	margin-top: 12px;
	margin-bottom: 6px;
}

td.imagev input {
	margin-left: 2px;
	height: 26px;
	font-size: 1.7em;
	border: 1px solid #666666;
	background:url(../_cust/images/inputBG.png) #FFFFFF repeat-x top;
}

textarea {
	border: 1px solid #666666;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	padding:3px 5px;
	background:url(../_cust/images/inputBG.png) #FAF9F5 repeat-x top;
}

.error_msg
{
	border: 1px solid #ff0000;
	color: #ff0000;
	background-color: #FDD0D0;
	font-weight: 900;
	padding: 4px;
	text-align: center;
}

.success_msg
{
	border: 1px solid #00ff00;
	color: #009900;
	background-color: #ffffff;
	font-weight: 900;
	padding: 4px;
	text-align: center;
}

.form_msg_width
{
	width: 240px;
}

a.buttonlink, a.buttonlink:visited {
	background: #01539F;
	border:1px solid #999999;
	display:block;
	height:16px;
	padding:3px 7px;
	text-align:center;
	width:50px;
	text-decoration: none;
	color:#fff;
}

a.buttonlink:hover {
	background: #FAF9F5;
	color: #01539F;
}



/*-------------------------------------- --- WORD VERIFICATION --------------------------------------------------------*/

.word_verification_msg {
}

input.word_verification {
	margin-left: 2px;
	height: 26px;
	font-size: 1.7em;
	background: #FAF9F5;
	border: 1px solid #666666;
}

img.word_verification {
	border:none;
}

/*----------------------------------------------------------- GALLERY STYLES --------------------------------*/

#gallery #loader {
	float: right;
	border: 1px solid #5a5a5a;
}

ul#thumbnails {
	float: left;
	width: 280px;
}

ul#thumbnails li {
	margin-bottom: 4px;
	margin-right: 4px;
	position: relative;
	list-style:none;
	float: left;
}

ul#thumbnails li img {
	border: 1px solid #5a5a5a;
}

#loader img {
    height: 240px;
    width: 320px;
}

#loader p {
	position: absolute;
	top: 15px;
	left: 15px;
	display: none;
}

#loader.loading p {
	display: static;
}


body#homeIdeasPage #slideshow #video {
	padding-left: 103px;
	padding-top: 25px;
	margin-bottom: 60px;




/*----------------------------------------------------------- SITEMAP -----------------------------------------------------------
*/

#sitemap {
	margin-bottom: 10px;
	font-size: 14px;
}


#sitemap_disp
{
	font-size: 1.2em;
	margin-left: 20px;
}

#sitemap_disp ul li
{
	margin-left: 24px;
}

/*----------------------------------------------------------- CLEARFIX -----------------------------------------------------------*/

.left {
	float: left;
}

.right {
	float: right;
}


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

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}