/*
 * Project:   Web-o-matic
 * Date:      2010/05/19
/* ---------------------------------------- */

* { margin: 0; padding: 0; }

html { min-height: 100%; margin: 0 0 1px; font-size: 100.01%; }
body { background: #fff; font-size: 62.5%; }

@media only screen and (max-device-width: 480px) { html { -webkit-text-size-adjust: none; } }

body, textarea, input, select, option, button { color: #455059; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; line-height: 1.6; }
li, dt, dd, p, th, td, caption, pre { font-size: 1.4em; }
ul, ol, dl, p, table, pre, h1, h2, h3, h4, h5, h6 { margin-bottom: 20px; }

a { color: #54606b; text-decoration: underline; }
a:hover, a:focus, a:active { text-decoration: none; }

ul, ol, dd, blockquote { padding-left: 40px; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
li *, li p, li li, dt *, dd *, p *, th *, td * { font-size: 1em; }

img { border: none; -ms-interpolation-mode: bicubic;  }
a {outline:none;}
pre { font-family: "Courier New",monospace; white-space: pre-wrap; }
table { border-collapse: collapse; border-spacing: 0; }
button { overflow: visible; padding: 0 10px; cursor: pointer; } button::-moz-focus-inner { padding: 0; border: none; }

hr { overflow: hidden; height: 1px; margin: 15px 0 !important; margin: -5px 0 8px; padding: 0; border: none; background-color: #ccc; color: #ccc; }
*:first-child+html hr { margin: -7px 0 8px !important; }

.offset { position: absolute !important; left: -10001px !important; overflow: hidden !important; }

/* LAYOUT
------------------------------------------- */

#root { }
 .wrapper { width: 960px; margin: 0 auto; }
 #top { background: #8dd4cf url(../images/top-bg.png) 50% 0 no-repeat; }
  #top .wrapper { position: relative; height: 179px; overflow: hidden; }
  #logo { position: absolute; top: 53px; left: 0; margin: 0; }
   #logo a { }
  #skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
   #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 200px; margin: 15px 0 0 15px; padding: 2px 0; background: #333; color: #fff; text-align: center; text-decoration: none; }
 #navigation { width: 100%; overflow: hidden; padding: 0 0 3px; border-top: 1px solid #aaddd8; background: #69c6be url(../images/navigation-bg.png) 0 100% repeat-x; }
 
  #nav { list-style: none; margin: 0; padding: 0; }
   #nav li { float: left; display: inline; border-right: 1px solid #aaddd8; font-size: 1.8em; line-height: 1; text-transform: lowercase; }
    #nav li a { float: left; display: inline; border-right: 1px solid #61a8a2; background: url(../images/nav-bg.png) 100% -400px no-repeat; color: #fff; text-decoration: none; }
	 #nav li a span { float: left; display: inline; height: 29px; margin: 0; padding: 11px 15px 0; background: url(../images/nav-bg.png) 0 -400px no-repeat; cursor: pointer; }
   #nav li.first, #nav li#first { border-left: 1px solid #61a8a2; }
    #nav li.first a, #nav li#first a { border-left: 1px solid #aaddd8; }
	#nav li a.selected, #nav li.selected a, #nav li a:hover, #nav li a:active, #nav li a:focus { background-position: 100% 0px; }
	#nav li a.selected span, #nav li a:hover span, #nav li a:active span, #nav li a:focus span { background-position: 0 -80px; }
    #nav li em { position: absolute; left: -10001px; top: -10001px; }
	
	#nav ul, #nav-foot ul {margin-bottom:0px;}
	#nav-foot ul {padding-left:0px;}
	#nav {display:none;}
	
 #intro { background: url(../images/intro-bg.jpg) 0 0 repeat-x; }
  #intro .wrapper { position: relative; height: 518px; }
   #intro .slider { position: absolute; top: 20px; left: 1px; }
   #intro .adv { position: absolute; top: 49px; right: 1px; }
 .bar-a { border-bottom: 5px solid #54606b; background: #303237 url(../images/grad.png) 0 0 repeat-x; }
 .bar-b { width: 100%; background: #e4f1f6 url(../images/bar-2-bg.png) 0 100% repeat-x; }
  .bar-b .wrapper { min-height: 320px; overflow: visible; background: url(../images/side-blue.png) 100% 0 repeat-y; }
 * html .bar-b .wrapper { height: 320px; }
  .bar-b .cols-2-a { width: 580px; float: left; }
 #content { clear: both; background: #eff7fa; }
 .home #content { background: #fff; margin: 0 0 32px; }
  #content .wrapper { overflow: hidden; background: url(../images/side-bg.png) 100% repeat-y; }
  .home #content .wrapper { background: transparent; }
   #main { float: left; display: inline; width: 550px; padding: 0 20px; }
   .home #main { padding: 0; }	
   #side { float: right; display: inline; width: 327px; padding: 45px 10px 0; }
   .home #side { width: 370px; padding: 16px 0 0; background: url(../images/side-blue-bottom.png) 0 0 repeat-x; }

#side_contact {
 float: right; display: inline; width: 327px; padding: 45px 10px 0; 
}

#side_contact p {

}

#side_contact h4 {
margin-bottom: 0px;
font-size: 12px;
font-weight:bold;
}

 #footer { padding: 40px 0 0; }
  #footer .wrapper { overflow: hidden; }
  #nav-foot { float: left; display: inline; margin: 0 0 10px; padding: 10px 0 7px; background: #eff7fa; } 
   #nav-foot li { display: inline; margin: 0 13px; padding: 0; font-size: 1.4em; line-height: 1; text-transform: lowercase; }
    #nav-foot li a { color: #54606b; text-decoration: none; }
	#nav-foot li a:hover, #nav-foot li a:focus, #nav-foot li a:active { text-decoration: underline; }
  .foot-info { clear: right; float: right; display: inline; color: #333; }
   .foot-info p { margin: 0 0 5px; font-size: 1.2em; line-height: 1; white-space: nowrap; }
   .foot-info .nav-a { float: right; display: inline; list-style: none; margin: 0 0 10px; padding: 0; }
   * html .foot-info .nav-a { margin-right: -12px; }
   *:first-child+html .foot-info .nav-a { margin-right: -12px; } 
   .foot-info .nav-a li { display: inline; width: auto; margin-right: 3px; padding-left: 5px; border-left: 1px solid #54606b; font-size: 1.2em; line-height: 1; }
    .foot-info .nav-a li a { color: #54606b; }
   .foot-info .nav-a li.first { border-left: 0; }
   
/* GENERAL
------------------------------------------- */

/* headers */

h1, h2, h3, h4, h5, h6 { }
h1 { font-size: 2.2em; }
h2 { font-size: 1.8em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.0em; }

.header-a { font-size: 3em; font-weight: normal; line-height: 1; }
.header-b { padding: 10px;  background: #eff7fa; font-size: 1.8em; font-weight: normal; line-height: 1.2; }
.header-c { color: #54606b; font-size: 2.2em; font-weight: normal; line-height: 1; }
.header-d { margin: 0 0 5px; color: #303237; font-size: 1.5em; line-height: 1; }

.gfx-recent-posts { display: block; overflow: hidden; margin: 0 0 25px; width: 369px; height: 157px; background: url(../images/gfx-recent-posts.png) 0 0 no-repeat; text-indent: -100001em; }

/* containers */

.list-t { padding-left: 8px; }
 .list-t .item { clear: both; width: 100%; margin: 0 0 48px; overflow: hidden; }
  .list-t .item .head { width: 100%; overflow: hidden; }
   .list-t .item .head .img { float: left; display: inline; }
   .list-t .item .head .intro { float: right; display: inline; width: 175px; padding: 10px 15px 30px; background: #aabbc5 url(../images/cloud-tip.gif) 0 100% no-repeat; color: #fff; font-size: 1.8em; line-height: 1.2; }
  .list-t .item .descr { padding: 0 10px 5px 0; color: #455059; }
   .list-t .item .descr p { font-size: 1.3em; line-height: 1.3; }
   .list-t .item .descr .title { margin: 0; text-transform: uppercase; }
   .list-t .item .descr .subtitle { margin: 0 0 5px; text-transform: uppercase; }
  .list-t .item .foot { width: 100%; overflow: hidden; }

.list-p { list-style: none; margin: 0 0 15px; padding: 0 0 0 6px; }
 .list-p li { margin: 0 0 13px; padding: 0; color: #666 font-size: 1.4em; line-height: 1.2; }
  .list-p li a { color: #000; text-decoration: none; }
  .list-p li a:hover, .list-p li a:active, .list-p li a:focus { text-decoration: underline; }
  .list-p li .date { color: #666; }

.list-q { width: 100%; margin: 0; padding: 0; overflow: hidden; list-style: none; }
 .list-q li { float: left; display: inline; border-right: 1px solid #3c3f46; color: #fff; font-size: 1.8em; line-height: 1.25; text-align: center; }
 .list-q li.first { border-left: 1px solid #000; }
  .list-q li a { float: left; display: inline; min-height: 165px; padding: 26px 34px 0; border-right: 1px solid #000; color: #fff; text-decoration: none; }
  .list-q li.first a { padding: 26px 22px 0; border-left: 1px solid #3c3f46; }
  * html .list-q li a { height: 191px; }  
  .list-q li a.ico-notebook { background: url(../images/ico-notebook.gif) 50% 92px no-repeat; }
  .list-q li a.ico-tooltip { background: url(../images/ico-tooltip.gif) 50% 88px no-repeat; }
  .list-q li a.ico-chart { background: url(../images/ico-chart.gif) 50% 90px no-repeat; }
  .list-q li a:hover, .list-q li a:active, .list-q li a:focus { text-decoration: underline; }
   .list-q li a span { display: block; color: #ff6; font-weight: bold; }

.heading { margin: 0 -20px 10px; padding: 50px 20px 5px; background: #f6fafc; }
 .heading .header-a { width: 100%; overflow: hidden; margin: 0 0 20px; vertical-align: middle; }
  .heading .header-a span { float:left; display: inline; margin-right: 1.2em; }
  .heading .header-a span.logo { padding-top: 1px; margin-right: 0.5em; }

.slider { display: block; width: 523px; height: 430px; padding: 29px 0 0 31px; overflow: hidden; background: url(../images/tv-bg.png) 0 0 no-repeat; }
 .slider .wrap { display: block; width: 411px; height: 316px;  overflow: hidden; }
 .slider ul { list-style: none; margin: 0; padding: 0; width: 999999px; height: 316px; }
  .slider ul li { float: left; display: inline; width: 411px; height: 316px; overflow: hidden; }
   .slider ul li a { float: left; display: inline; }
    .slider ul li a img { float: left; display: inline; }

.adv { display: block; width: 215px; height: 230px; padding: 170px 30px 0 106px; background: url(../images/adv-bg.png) 0 0 no-repeat; }
 .adv .text { color: #2b5553; font-size: 1.8em; line-height: 1.2; }

.hero { float: right; display: inline; position: relative; width: 330px; margin: -222px 0 0; padding: 0 20px; }
 .hero .hero-photo { width: 252px; margin: 0 auto 0; }
  .hero p.text-d {margin-bottom: 8px;}
 .hero .desc { color: #333; }
  .hero .desc p { font-size: 1.4em; line-height: 1.57; marign: 0 0 8px; }
			
.cols-cont { width: 100%; overflow: hidden; }

.cols-2-a { padding: 34px 0 0; }
 .cols-2-a .col { float: left; display: inline; }
 .cols-2-a .col-a { width: 350px; margin-right: 18px; }
 .cols-2-a .col-b { width: 205px; padding: 25px 0 0; }
 
.cols-3-a {}
 .cols-3-a .col { float: left; display: inline; }
  .cols-3-a .col .header-c { text-align: center; }
  .cols-3-a .col .img { display: block; height: 156px; }
  .cols-3-a .col .cont { clear: both; float: right; min-height: 150px; width: 133px; padding: 10px 13px 10px; background: #f3f1d5 /*url(../images/tooltip-top.gif) 0 0 no-repeat*/; color: #666; }
  * html .cols-3-a .col .cont { height: 150px; }
   .cols-3-a .col .cont p { margin: 0 0 3px; font-size: 1.3em; line-height: 1.3; }
    .cols-3-a .col .cont .link a { color: #666; text-decoration: none; }
    .cols-3-a .col .cont .link a:hover, .cols-3-a .col .cont .link a:focus, .cols-3-a .col .cont .link a:active { text-decoration: underline; }
 /*.cols-3-a .col-a { width: 161px; margin-right: 19px; }
  .cols-3-a .col-a .header-c { padding-right: 6px; }
 .cols-3-a .col-b { width: 173px; margin-right: 6px; }
  .cols-3-a .col-b .header-c { padding-right: 19px; }
 .cols-3-a .col-c { width: 175px; }				
  .cols-3-a .col-c .header-c { padding-right: 19px; }
*/

.cols-3-a .col-a { width: 159px; margin-right: 14px; position: relative; height: 270px; background: url(../images/front-img1.jpg) top center no-repeat #f3f1d5;}
.cols-3-a .col-b { width: 159px; margin-right: 14px; position: relative; height: 270px; background: url(../images/front-img2.jpg) top center no-repeat #f3f1d5;}
.cols-3-a .col-c { width: 159px; position: relative; height: 270px; background: url(../images/front-img3.jpg) top center no-repeat #f3f1d5;}				

.cols-3-a .col-a p.img, .cols-3-a .col-b p.img, .cols-3-a .col-c p.img {position: absolute; top: 0; right: 20px;}
.cols-3-a .col-a div.cont, .cols-3-a .col-b div.cont, .cols-3-a .col-c div.cont {position: absolute; bottom: 0;}
/* forms */
.form-a { width: 490px; overflow: hidden; }
 .form-a .row { width: 100%; overflow: hidden; margin: 0 0 15px; font-size: 1.3em; line-heihgt: 1.3; }
  .form-a label { float: left; display: inline; width: 180px; color: #333; }
   .form-a .req { color: #ff3509; }
  .form-a input, .form-a textarea { float: right; display: inline; width: 278px; padding: 5px 10px; border: 1px solid #dae9ee; background: #fff; }
  .form-a textarea { height: 88px; }
 .form-a .captcha { width: auto; padding: 7px 0 0 190px; margin: 0 0 2px; }
  .form-a .captcha img { display: block; }
 .form-a .submitrow { margin: 0px 0 15px; text-align: right; font-size: 1.4em; line-height: 1; }
  .form-a button { padding: 5px 10px; border: 0; background: #9dacb8; color: #fff; line-height: 1; }


/* tables */

table { }
 table th, table td { padding: 5px 10px; border: 1px solid #ccc; }

/* lists */

.nav-social { float: right; display: inline; list-style: none; margin: 0 0 15px; padding: 0; }
 .nav-social li { float: left; display: inline; margin: 0 2px 0 8px; }
  .nav-social li a { float: left; width: 50px; height: 38px; overflow: hidden; background: url(../images/icos-social.png) 0 0 no-repeat; text-indent: -100001em; }
  .nav-social li a.ico-rss {}
  .nav-social li a.ico-facebook { background-position: -70px 0; }
  .nav-social li a.ico-twitter { background-position: -140px 0; }
  .nav-social li a.ico-linkedin { background-position: -210px 0; }
  
.nav-social-s {}
 .nav-social-s li { margin: 0 0 0 7px; }
  .nav-social-s li a { background: url(../images/icos-social-s.png) 0 0 no-repeat; }
  .nav-social-s li a.ico-facebook { background-position: 0 0; }
  .nav-social-s li a.ico-twitter { background-position: -70px 0; }
 .nav-social-s li.label { margin: 10px 3px 0 0; overflow: hidden; text-indent: -100001em; }
 .nav-social-s li.connect-chris { width: 139px; height: 18px; background: url(../images/connect-chris.png) 0 0 no-repeat; }
 .nav-social-s li.connect-chad { width: 139px; height: 18px; background: url(../images/connect-chad.png) 0 0 no-repeat; }
 .nav-social-s li.connect-richard { width: 161px; height: 18px; background: url(../images/connect-richard.png) 0 0 no-repeat; }


/* paragraphs */

.text-a { margin: 0 -20px 20px; padding: 10px 20px; background: #e6f1f5; font-size: 1.6em; line-height: 1.3; }
.text-a-b { margin-top: 20px; }
.text-b { margin: 0 -20px 20px; padding: 10px 20px; background: #e5f0f4; font-size: 2.2em; line-height: 1.28; }
.text-c { margin: 0 0 15px; color: #303237; font-size: 1.5em; line-height: 1.4; }
.text-d { color: #000; font-size: 2.4em; text-align: center; line-height: 1; }
 .text-d span { display: block; font-size: 0.712em; line-height: 1.3; }

/* links */

.link-a { padding: 3px 10px 5px; background: #b3c1ca; color: #fff; font-size: 1.3em; line-height: 1; text-transform: lowercase; text-decoration: none; cursor: pointer; }
.link-a:hover, .link-a:active, .link-a:focus { text-decoration: underline; }

.link-m { color: #455059; font-style: italic; text-decoration: none; }
.link-m:hover, .link-m:active, .link-m:focus { text-decoration: underline; }

/* other */

/* OUR CLIENTS PAGE TEMPLATE
------------------------------------------- */

div#notepad {
	background: url(../images/notepad.jpg) no-repeat;
	width: 300px;
	height: 211px;
	padding: 55px 15px 0 20px;
	margin: 0 0 20px 0;
	}
div#notepad h2 {
	font-size: 18px;
	font-weight: bold;
	color: #455059;
	margin-bottom: 18px;
	}
div#notepad p {
	line-height: 128%;
	margin-bottom: 18px;
	}
div#notepad a.cta-2 {
	display: block;
	width: 270px;
	height: 31px;
	background: url(../images/cta-2.gif) no-repeat;
	text-indent: -9000em;
	margin: 0 0 0 12px;
	}
.innerClients #root #content .wrapper #main {	
	margin:0 0 0 20px;
	}

.innerClients #root #content .wrapper #main div#featured {
	background:#F6FAFC;
	padding: 15px;
	margin: 0 0 20px 0;
	}
.innerClients #root #content .wrapper #main div#featured h2 {
	text-indent: -9000em;
	margin: 40px 0 10px 175px;
	width: 334px;
	height: 23px;
	background: url(../images/featured-heading1.jpg) no-repeat;
	}
.innerClients #root #content .wrapper #main div#featured p.question {
	color: #455059;
	font-weight: bold;
	font-size: 15px;
	margin-bottom: 10px;
	}
.innerClients #root #content .wrapper #main div#featured p {	
	color: #455059;
	line-height: 140%;
	margin-bottom: 10px;
	}
.innerClients #root #content .wrapper #main div#featured p a {
	font-style: italic;
	text-decoration: none;
	}
.innerClients #root #content .wrapper #main div#featured p a.finished {	
	background-color: #B8C3CC;
	display: inline-block; 
	padding: 5px;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	font-style: normal;
	margin: 0 0 0 175px;
	}
.innerClients #root #content .wrapper #main div#featured div#featured-img {
	float: left;
	text-align: center;
	margin: 0 15px 0 0;
	}
.innerClients #root #content .wrapper #main div#featured div#featured-img p.caption span {
	font-size: 18px;
	}
.innerClients #root #content .wrapper #main {
	padding-top: 0px;
	}

/* PRICING PAGE TEMPLATE
------------------------------------------- */
.innerPricing #root #content {
	background: #303237 url(../images/pricing2.jpg) repeat-x;
	}
.innerPricing #root #content .wrapper {
	background: url(../images/pricing-mainbg.jpg) no-repeat;
	width: 995px;
	height: 1350px;
	}
.innerPricing #root #content .wrapper #main {
	width: 100%;
	}
 .innerPricing #root #content .wrapper #main h2 {
 	color: #FF3408;
	margin: 7px 0 0 30px;
	font-size: 28px;
	}
 .innerPricing #root #content .wrapper #main h3 {
 	color: #000;
	font-weight: normal;
	font-size: 21px;
	margin: 0 0 0 30px;
	}
.innerPricing #root #content .wrapper #main table {
	margin: 234px 0 0 55px;
	font-family: "Courier New", Courier, monospace;
	}
	
.innerPricing #root #content .wrapper #main table td {
	line-height: 100%;
	}
	
	/* PORTFOLIO PAGE TEMPLATE
------------------------------------------- */
.innerPortfolio #root #content {
	background: #303237 url(../images/pricing2.jpg) repeat-x;
	}
.innerPortfolio #root #content .wrapper {
	background: url(../images/portfolio-bg.jpg) no-repeat;
	width: 995px;
	min-height: 500px;
	}
.innerPortfolio #root #content .wrapper #main {
	width: 100%;
	}
 .innerPortfolio #root #content .wrapper #main h2 {
 	color: #FF3408;
	margin: 7px 0 0 30px;
	font-size: 28px;
	}
 .innerPortfolio #root #content .wrapper #main h3 {
 	color: #000;
	font-weight: normal;
	font-size: 21px;
	margin: 0 0 0 30px;
	}
.innerPortfolio #root #content .wrapper #main #portfolio {
	padding: 100px 20px 20px 20px;
	color: #fff;
	}
.innerPortfolio #root #content .wrapper #main #portfolio ul {
	list-style-type: none;
	padding: 0px;
	color: #fff;
	width: 995px;
	margin: 10px 0 0 -40px;
	}
.innerPortfolio #root #content .wrapper #main #portfolio ul li {
	display: block;
	float: left;
	background-color: #45474B;
	height: 245px;
	width: 284px;
	overflow:hidden;
	padding: 12px;
	margin: 0 0 12px 12px;
	
	}
.innerPortfolio #root #content .wrapper #main #portfolio ul li h3 {
	color: #fff;
	margin: 0px;
	}
 
/* SPECIFIC
------------------------------------------- */

.list-p span.author  {display:none;}

.blog-container .post-list {float:left;width:58%;}
.comment-list {background:none;}

.blog-post input, .blog-post text-area {float:none !important;}
.blog-post h2.post-title {border:none;}
input.commentSubmit {width:100px; margin-top:15px;}
body.innerPage  #main  {padding-top:15px !important;}

div.captchaimg {float: left; width: 178px !important;}
input#CaptchaV2 {float:left; width:100px !important;}
p.captchaRow {width:190px !important; float:left !important;}

 .system-message, .system-error-message {margin:0px; padding:0px; padding:25px; background:none; border:none;}
table th, table td {border:0px; }

*+html .form-a input,  {height:20px;}

#CaptchaHV2, #CaptchaTV2 {display:none;}



.questionimg {
float:left;
}

.questionanswer {
float: left;
width: 475px;
padding-left: 20px;
}