@charset "utf-8";
/* CSS Document */
/* colors:
yellow: #ffcb3e;
light grey: #b2ad87 
*/

/*** GENERAL STYLES ***/
.preload {display:none;}
body { font-family: Arial, Helvetica, sans-serif; color:#333333;}
p{font:normal 12px/18px Arial, Helvetica, sans-serif; margin-bottom:10px;}
p.bannerText{font-size:14px; line-height:18px; }
h1{ font-size:17px; line-height:18px; color:#686a5e; margin-bottom:4px; padding-top:4px;}
h1 a:link, h1 a:visited, h1 a:hover, h1 a:active {color:#686a5e; text-decoration:none; background-color:transparent;}
h2 {font-size:13px; line-height:18px; color:#f47920; margin-bottom:4px;}
h2 a:link, h2 a:visited, h2 a:hover, h2 a:active {color:#f47920; text-decoration:none; background-color:transparent;}
h3 {font-size:13px; line-height:18px; color:#77785e; margin-bottom:4px; text-transform:uppercase;}
h3 a:link, h3 a:visited, h3 a:hover, h3 a:active {color:#77785e; text-decoration:none; background-color:transparent;}
h5 {font:normal 12px/18px Arial, Helvetica, sans-serif; color:#77785e; font-style:italic; }
.finprint { font-size:9px; line-height:1.3;}
a:link {color: #f46600;}
a:visited {color: #c2502e;}
a:hover{ background-color: #f47920; color:#fff; text-decoration:none;}
a:active {color:#fff;}
input { border: solid 1px #ffcb3e; padding:4px; color:#555555; font-size:10px; margin-top:3px;}
ul {font:normal 12px/18px Arial, Helvetica, sans-serif; margin-bottom:6px;}
li {list-style-type: disc; list-style-position:outside; margin-left:17px;}
table {margin:16px 0 20px;}
tr, td { vertical-align:top;}
.imgFloat {float:right;padding:0 0 20px 20px;}
.boxOutline {border:1px solid #f47920; background:#fbf9f9; padding:15px; margin-bottom:20px;}
/* Nav items */
.navContainer {background:#383837 url(../images/nav-bg.jpg) repeat-x 0 0; height:98px; }
.navItems {width:960px; margin:0 auto;}
.logo {float:left;}
.menuLinks {float:right;}

/* Banners */
.bannerContainer { height:277px; background:#ffc233 url(../images/banner-bg.jpg) repeat-x top;}
.bannerBottom {background:#383837 url(../images/banner-bottom.jpg) repeat-x center top; height:15px; }

#bannerReady {height:277px; width:960px; background-image: url(../images/banner-ready.jpg);	margin:0 auto;}
#bannerReady div {width:370px; padding-top:110px;}

#bannerEnjoy {height:277px; width:960px; background-image: url(../images/banner-enjoy.jpg);	margin:0 auto;}
#bannerEnjoy div  {width:440px; padding-top:126px; margin-left:6px;}

#bannerProcess{height:277px; width:960px; background-image: url(../images/banner-process.jpg); margin:0 auto;}
#bannerWebsite {height:277px; width:960px; background-image: url(../images/banner-websites.jpg); margin:0 auto;}
#bannerWebsite div {width:420px; padding-top:140px;}

#bannerProfessional{height:277px; width:960px; background-image: url(../images/banner-professional.jpg); margin:0 auto;}
#bannerProfessional div  {width:400px; padding-top:140px; }

#bannerHappyClient{height:277px; width:960px; background-image: url(../images/banner-happyClient.jpg); margin:0 auto;}
#bannerHappyClient div  {width:600px; padding-top:126px; }

/*Content */
.contentTop{background:#c6bfac url(../images/content-top.jpg) no-repeat center top; height:12px; overflow:hidden;}
.contentContainer {background:#c5beab url(../images/content-bg.jpg) repeat-y center top; overflow:auto; padding:30px 0 20px;}
.wrapCol {width:960px; margin:0 auto;}
.leftCol-wide {width:630px;  float:left;}
.leftCol {width:290px;  float:left;}
.rightCol {width:290px;  float:right;}
.middleCol{float:left; width:350px;}

/* Tables */
.tableGeneral {font:normal 12px/18px Arial, Helvetica, sans-serif; border-bottom:3px solid #ffcb3e; border-top:2px solid #ffcb3e;}
.tableGeneral td {padding:8px 10px; border-right:1px solid #b2ad87; }
.tableSectionSub {color:#888572; font-weight:bold;}
tr.dottedrow td{border-top:1px dashed #ffcb3e; border-bottom:1px dashed #ffcb3e; background:#fbf9f9;}

/*For a 2 column table */
table.table2col img {float:left; padding:0 30px 40px 0;} 
.table2col tr td{padding-bottom:0px;}
/** Tool tip **/
.tip a:link, .tip a:visited, .tip a:hover, .tip a:active {color:#f47920; text-decoration:none; background-color:transparent; z-index: 100000 !important;}
.tip  {	position: relative;margin:0; padding:0; z-index: 100000 !important;}
p.tip em {font-size:11px; line-height:13px; color:#fff; z-index: 100000 !important;}
.tip em {background: transparent url(../images/hover.gif) top center no-repeat;	width: 196px; height: 118px; position: absolute;
	top: 45px; /* match this to the second function in hover.js */
	left: 20px; /* match this to the position in hover.hs */
	text-align: center;	padding: 45px 0px 10px;	font-style: normal;	z-index: 100000 !important;	display: none;}

/*** CALL TO ACTION ***/
/* for the CTA gif images with transparent background - get rid of background shading on hover */
.ctaTop a:hover img, a:hover img.pad-10-bottom {
background: transparent; /* show to Mozilla/Safari/Opera */
_background: #f6f5eb; /* show to IE */
}

#ctaBlog-home{width:281px; margin-left:40px;}
#ctaBlog, #ctaContactBox {width:281px; margin:0 auto;}
#ctaContactBox .ctaBody {width:281px; background:transparent url(../images/cta-orange-bg.jpg) repeat-y center top;}
#ctaBlog .ctaBody, #ctaBlog-home .ctaBody {width:281px; background:transparent url(../images/cta-grey-bg.jpg) repeat-y center top;}
.ctaBody{padding:16px 0 10px;}
.ctaBody p {padding: 0 20px;}
.ctaBody span {font-size:13px; line-height:18px; color:#f47920; font-weight:bold;}
.ctaBody span a { text-decoration:none;}

.ctaChoose {background:transparent url(../images/cta-choose.gif) no-repeat center top; height:291px; margin-top:6px; margin-bottom:20px;}
.ctaWhy {background:transparent url(../images/cta-why.gif) no-repeat center top; height:297px; margin-bottom:20px; }

ul.green {list-style-position: inside; list-style-image: url(../images/bullet-green.gif);font:normal 13px/16px Arial, Helvetica, sans-serif;  padding-top:114px; margin-left:144px;}
ul.blue {list-style-position: inside; list-style-image: url(../images/bullet-blue.gif);font:normal 13px/16px Arial, Helvetica, sans-serif;  padding-top:114px;margin-left:20px;}
ul.green li, ul.blue li {margin-bottom:5px;}

a#ctaOrangeBase{ background-image:url(../images/cta-orange-base.jpg); height: 44px; width:281px; display:block; }
a#ctaOrangeBase span, a#ctaGreyBase span { display:none; }
a#ctaOrangeBase:hover, a#ctaGreyBase:hover  { background-position:0 44px; }
a#ctaGreyBase{ background-image:url(../images/cta-grey-base.jpg); height: 44px; width:281px; display:block; }

/** Side column text **/
.columnBox-black {width:236px; border: solid 1px #fff; background: #656361 url(../images/column-bg-black.jpg) no-repeat bottom right; padding:24px 20px 90px; margin-bottom:30px;}
.columnBox-green{width:236px; border: solid 1px #fff; background: #c2d63f url(../images/column-bg-green.jpg) no-repeat bottom right; padding:24px 20px 36px; margin-bottom:30px;}
.columnBox-grey{width:236px; border: solid 1px #fff; background: #f0ecd6 url(../images/column-bg-grey.jpg) no-repeat bottom right; padding:24px 20px 90px; margin-bottom:30px;}
.columnBox-black h1, .columnBox-green h1{ font-size:17px; line-height:18px; color:#fff; margin-bottom:6px;}
.columnBox-grey h1{ font-size:17px; line-height:18px; color:#888572; margin-bottom:6px;}

#faqSections .returnToTop{font-size:10px; text-align:right; border-bottom:solid 1px #d9d6ba;  padding-bottom:20px;margin-bottom:20px;}
.pad-10-bottom {margin-bottom:0px; background-color:none;}
a:link img, a:visited img, a:hover img, a:active img {background-color:transparent;}

#min_contact_form input{width:200px;}

.testimonial {color:#534741;padding-bottom:10px; border-top: 1px solid #d9d6ba; margin-top:6px; padding-top:16px;}
.testimonial .clientSignoff a{height: 40px; width: 200px; display:block; padding: 10px 0 0 84px; text-decoration: none; color:#534741; font-size: 12px; line-height: 1.3;}
.testimonial .clientSignoff a:hover{background: none;}
.testimonial .clientSignoff .hapkido, .testimonial .clientSignoff .hapkido:hover{background: url(../images/logo-hca.gif) top left no-repeat;  }
.testimonial .clientSignoff .thatcouture, .testimonial .clientSignoff .thatcouture:hover{background: url(../images/logo-thatcouture.gif) left 8px no-repeat;  }
.testimonial .clientSignoff .imix, .testimonial .clientSignoff .imix:hover{background: url(../images/logo-imix.gif) left 8px no-repeat;  }
.testimonial .clientSignoff .hungryhunter, .testimonial .clientSignoff .hungryhunter:hover{background: url(../images/logo-hh.gif) left 8px no-repeat;  }
/** Blog pages **/
h1.blogTitle {font-size:140%; margin-bottom:20px;}
.blogReferences p, .blogReferences p a, .blogReferences p a:hover {font-size:9px; margin-bottom:0; color:#666666; background-color:transparent;}
.blogEnd {padding:20px; background: #f2eedb url(../images/blog-end-bg.jpg) no-repeat bottom;margin:20px 0; min-height:70px;}

/************************************< CONTACT PAGE >************************************/

.contact_form {width:550px; height:505px; margin-top:20px; background:transparent url(../images/contactus-bg.jpg) bottom center no-repeat;}
.contact_form .contact_formContainer {padding:84px 30px 20px 30px;}
.contact_form p {color:#ffffff;}
.contact_form label{
	width: 90px;
	height:20px;
	float:left;
}
.contact_form input{
	background-repeat: repeat-x;
	background-position: left top;
	border: 1px solid #ffffff;
	width:70%;
	background-color:transparent;
}
.contact_form textarea{
	border: 1px solid #ffffff;
	margin-bottom: 5px;
	width:70%;
	height:70px;
	background-color:transparent;

}
.contact_form input, .contact_form textarea {font-family: Arial, Helvetica, sans-serif; padding:4px; color:#ffffff; font-size:12px; margin-top:3px;}

.contact_form input.btnSubmit{ width:96px; height:32px; background:url(../images/btn-submit-orange.jpg) no-repeat; border:none;	cursor:pointer; float:right; margin: 16px 45px 0 0; }
.contact_form input.btnSubmit:hover	{ 
background-position:0 -32px;
}
.contact_form input.btnSubmit:active	{ 
background-position:0 -64px;
}

/*** FOOTER ***/
.footerText{width:960px; margin:0 auto; padding-top:6px;}
.footerText p {color:#fff; font-size:9px;}
.footerText a:link,.footerText a:active,.footerText a:visited{color:#fff;}
.footer_left {float:left;}
.footer_right {float:right;}


/*** button ***/
input.btnSubmit	{ width:96px; height:32px; background:url(../images/btn-submit.jpg) no-repeat; border:none;	cursor:pointer; }
input.btnSubmit:hover	{ 
background-position:0 -32px;
}
input.btnSubmit:active	{ 
background-position:0 -64px;
}