@charset "utf-8";
/* CSS Document for Astonish Designs */

html {background: #303b43 url(../images/bg-main.png) repeat-x; margin: 0;}
body {background: url(../images/bg-spotlights.png) no-repeat center top; margin: 0; font-family: lucida sans unicode, arial, sans-serif; line-height: 20px;}
#content-container {width: 960px; margin: 0 auto; display: table;}

/* ---------- HEADINGS ---------- */
h1 {font-size: 36px; font-family: "lucida sans unicode", geneva, arial, sans serif; font-weight: normal; color: #7e9ca3;}
h2 {font-size: 30px; font-family: "lucida sans unicode", geneva, arial, sans serif; font-weight: normal; color: #7e9ca3;}
h3 {font-size: 24px; font-family: "lucida sans unicode", geneva, arial, sans serif; font-weight: normal; color: #7e9ca3; line-height: normal;}
h4 {font-size: 18px; font-family: "lucida sans unicode", geneva, arial, sans serif; font-weight: normal; color: #7e9ca3;}
/* page titles */
h1#main-title {background: url(../images/title-main.png) no-repeat; width: 479px; height: 170px; text-indent: -9999px; margin: 0;}
h1#main-title2 {background: url(../images/title-main2.png) no-repeat; width: 462px; height: 171px; text-indent: -9999px; margin: 0;}
h1#request-quote {background: url(../images/title-request-quote.png) no-repeat; width: 312px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#website-design {background: url(../images/services-website-design.png) no-repeat; width: 291px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#search-engine-optimization {background: url(../images/services-search-engine-optimization.png) no-repeat; width: 521px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#web-development {background: url(../images/title-web-development.png) no-repeat; width: 476px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#internet-marketing {background: url(../images/services-internet-marketing.png) no-repeat; width: 370px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#contact {background: url(../images/title-contact.png) no-repeat; width: 206px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#our-work {background: url(../images/title-our-work.png) no-repeat; width: 174px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#aboutus {background: url(../images/title-aboutus.png) no-repeat; width: 168px; height: 49px; text-indent: -9999px; margin: 30px 0 20px 0; float: left;}
h1#thankyou {background: url(../images/title-thankyou.png) no-repeat; width: 201px; height: 48px; text-indent: -9999px; margin: 30px 0 21px 0; float: left;}
h1#testimonials {background: url(../images/title-testimonials.png) no-repeat; width: 241px; height: 43px; text-indent: -9999px; margin: 30px 0 26px 0; float: left;}
h1#archive {background: url(../images/title-archive.png) no-repeat; width: 142px; height: 43px; text-indent: -9999px; margin: 30px 0 26px 0; float: left;}
h1#news {background: url(../images/title-news.png) no-repeat; width: 133px; height: 33px; text-indent: -9999px; margin: 40px 0 26px 0; float: left;}
h1#careers {background: url(../images/title-careers.png) no-repeat; width: 147px; height: 33px; text-indent: -9999px; margin: 40px 0 26px 0; float: left;}
h1#newsletters {background: url(../images/title-newsletters.png) no-repeat; width: 238px; height: 41px; text-indent: -9999px; margin: 30px 0 28px 0; float: left;}


/* page sentences */
h2#mission {background: url(../images/title-mission.png) no-repeat; width: 599px; height: 103px; text-indent: -9999px;}
h2#coexist {background: url(../images/title-coexist.png) no-repeat; width: 599px; height: 103px; text-indent: -9999px;}
h2#internet-marketing {background: url(../images/title-internet-marketing-big.png) no-repeat; width: 588px; height: 103px; text-indent: -9999px;}
h2#search-engine-optimization {background: url(../images/title-search-engine-optimization-big.png) no-repeat; width: 569px; height: 66px; text-indent: -9999px;}
h2#aboutus {background: url(../images/title-team.png) no-repeat; width: 569px; height: 99px; text-indent: -9999px;}
h2#aboutus2 {background: url(../images/title-about.png) no-repeat; width: 487px; height: 99px; text-indent: -9999px;}


/* ---------- COMMON CLASSES / TAGS ---------- */
img {border: none;}
a {color: #ffcc4e;}
a:hover {text-decoration: none;}
a.common {color: #a7bbcb; text-decoration: none; border-bottom: 2px solid #44545f; padding: 0 2px;}
a.common:hover {background: #3b4952; text-decoration: none;}

.clear {clear: both;}
.left {float: left;}
.right {float: right;}
.photo {border: 2px solid #445058; margin: 20px 0; clear: both;}
.photo-noborder {margin: 20px; clear: both;}
.text-right {text-align: right;}
.testimonial-photo {border: 2px solid #fff; margin: 20px 0; clear: both;}
.mgright {margin-right: 20px;}
.mgleft {margin-left: 20px;}
.mgboth {margin-right: 20px; margin-left: 20px;}
.photo-nomargin {border: 2px solid #445058; margin-left: 20px;}
.graphic {margin: 0 20px 20px 20px;}
.hr {border-top: 1px solid #1f2930; border-bottom: 1px solid #3f4b53; height: 0px;}
.call-to-action {float: right; margin: 40px 0 0 0;}
.highlight {background-color: #385064; border-bottom: 1px solid #f6f3bc; color: #d9d9d9;}
.center-graphic {margin: 50px;}
ul.checkmarks {padding-left: 85px; margin: 0;}
ul.checkmarks li {list-style: none; background: url(../images/bullet-checkmark.gif) no-repeat 0 5px; padding-left: 18px; font-size: 13px; color: #bbb; margin: 0 0 7px 0;}
table.simple {border: none; border-spacing: 1px 0; margin: 20px;}
table.simple thead td {color: #7e9ca3; font-size: 13px; background: #273037; font-weight: bold; text-align: center;}
table.simple td {background: #38454e; padding: 2px;}
table.technologies ul {margin: 0; padding: 0 0 0 20px;}
table.technologies ul li {font-size: 12px; color: #bbb;}
#main-column p.smalltext {font-size: 12px; margin: 0 25px; color: #5f7a8b;}
/* colors */
.turquoise {color: #347082;}
.orange {color: #f99d1c;}
.blue {color: #74a0b2;}
.white {color: #fff;}
.orange {color: #</span>;}


/* ---------- PORTFOLIO STRUCTURE ---------- */
#portfolio-screenshots a.active-screen img {border: 3px solid #f99d1c; cursor: default;}
#portfolio-screenshots a:hover img {border: 3px solid #7893a6;}
#portfolio-screenshots a.active-screen:hover img {border: 3px solid #f99d1c;}
img.screenshot-small {float: left; margin-bottom: 25px; margin-right:15px; border: 3px solid #303b43;}
img.screenshot-small-last {float: left; margin-bottom: 25px; border: 3px solid #303b43;}
img.screenshot-large {float: left; margin-top: 12px;}


/* ---------- HEADING ---------- */
#heading {background: url(../images/bg-heading.gif) repeat-x; height: 44px; margin: 15px 0 0 0; display: block; border-top: 1px solid #41868d;}
#heading .logo {margin: 4px 0 0 12px; float: left;}
#heading .tagline {float: right; margin: 14px 22px 0 0;}


/* ---------- NAVIGATION ---------- */
#navigation-container {width: 100%; float: right;}
#navigation-container ul.navigation {padding: 0; margin: 0; list-style: none; float: right;}
#navigation-container ul.navigation li {float: left; background: #253037 url(../images/bg-inactive-tab.gif) repeat-x; margin-left: 2px; position: relative; z-index: 20;}
#navigation-container ul.navigation li.active {background: #062946;}
#navigation-container ul.navigation li.active a {color: #f99d1c;}
#navigation-container ul.navigation li a {color: #647578; font-weight: bold; text-decoration: none; font-family: Arial, Helvetica, sans-serif; font-size: 12px; display: block; padding: 5px 10px;}
#navigation-container ul.navigation li a:hover {color: #fff;}
/* dropdown menu */
#navigation-container ul.navigation li:hover ul {display:block;}
#navigation-container ul.navigation li ul {position:absolute; top: 30px; left:-2px; list-style:none; padding:0; margin:0; width:135px; z-index:100; display: none; overflow: hidden;}
#navigation-container ul.navigation li ul li{width:100%; background: #253037; border-top: 1px solid #38454d; padding: 8px 0; opacity: 0.9; filter: alpha(opacity=90);}
#navigation-container ul.navigation li ul li.first {padding-top: 7px; border-top: 0;}
#navigation-container ul.navigation li ul a{text-indent:0; display:block; line-height:15px; cursor:pointer; padding:0 10px; width:auto; color: #7f9498;}
#navigation-container ul.navigation li.active ul li a {color: #647578;}
#navigation-container ul.navigation li.active ul li a:hover {color: #fff;}


/* ---------- OPENING SECTION ---------- */
#action-text {width: 480px; float: left; margin: 55px 0 0 0;}
#action-text p {font-family: Arial, Helvetica, sans-serif; color: #a4a4a4; font-size: 14px; line-height: 20px;}
#action-text .btn {margin: 30px 10px 0 0;}
#action-graphic {float: right; width: 470px; margin: 30px 0 20px 0;}
#action-graphic img {position: relative; left: -17px; z-index: 10;}
#action-graphic a {outline: none;}


/* ---------- SERVICES BLOCK ---------- */
div#services {background: url(../images/bg-services.jpg) no-repeat center bottom; float: left; margin: 10px 0 0 0; padding-bottom: 10px;}
div#services.no-background {background: none; padding: 0; margin: 30px 0 10px 0;}
div#services dl {float: left; height: 177px; width: 227px; display: block; margin: 0 17px 0 0; padding: 0;}
div#services dl.last {float: left; margin-right: 0;}
div#services dt {height: 50px; text-indent: -9999px; padding: 0; display: block;}
a.service-hover h2 {display: none;}
#services dl dd {margin: 0; font-family: Arial, Helvetica, sans-serif; color: #a4a4a4; font-size: 13px; line-height: 18px; width: 200px; padding: 0;}
dl#search-engine-optimization dt {background: url(../images/title-search-engine-optimization.png) no-repeat;}
dl#website-design dt {background: url(../images/title-website-design.png) no-repeat;}
dl#internet-marketing dt {background: url(../images/title-internet-marketing.png) no-repeat;}
dl#application-development dt {background: url(../images/title-application-development.png) no-repeat;}
div#services a.service-hover {height: 157px; width: 207px; display: block; padding: 15px 0 0 15px; overflow: hidden; text-decoration: none; cursor: pointer;}
div#services a.service-hover:hover {background: url(../images/bg-services.png) no-repeat; height: 177px; width: 227px; display: block; text-decoration: none;}
/* services compact */
#services-compact {padding-bottom: 10px; margin: 10px 0 0 0; float: left;}
#services-compact dl {float: left; height: 76px; width: 227px; display: block; margin: 0 17px 0 0; padding: 0;}
#services-compact dl.last {float: left; margin-right: 0;}
#services-compact dt {height: 50px; text-indent: -9999px; padding: 0; display: block;}
a.service-hover h2 {display: none;}
#services-compact dl dd {margin: 0; font-family: Arial, Helvetica, sans-serif; color: #a4a4a4; font-size: 13px; line-height: 18px; width: 200px; padding: 0;}
dl#search-engine-optimization dt {background: url(../images/title-search-engine-optimization.png) no-repeat;}
dl#website-design dt {background: url(../images/title-website-design.png) no-repeat;}
dl#internet-marketing dt {background: url(../images/title-internet-marketing.png) no-repeat;}
dl#application-development dt {background: url(../images/title-application-development.png) no-repeat;}
#services-compact a.active {background: url(../images/bg-services-compact.png) no-repeat; height: 177px; width: 227px; display: block; text-decoration: none; height: 56px; width: 207px; display: block; padding: 15px 0 0 15px; overflow: hidden; text-decoration: none; cursor: pointer;}
#services-compact a.service-hover {height: 56px; width: 207px; display: block; padding: 15px 0 0 15px; overflow: hidden; text-decoration: none; cursor: pointer;}
#services-compact a.service-hover:hover {background: url(../images/bg-services-compact.png) no-repeat; height: 62px; width: 227px; display: block; text-decoration: none;}
#services-compact a.active {background: url(../images/bg-services-compact.png) no-repeat; height: 62px; width: 227px; display: block; text-decoration: none; text-indent: -9999px; cursor: default;}
#services-compact a.active:hover {background: url(../images/bg-services-compact.png) no-repeat; height: 62px; width: 227px; display: block; text-decoration: none;}


/* ---------- SUB PAGE ---------- */
#column-container {margin-top: 10px; border: 1px solid #445058; border-top: none; float: left;}
#column-container p {font-size: 13px; color: #bbb; margin-left: 24px; margin-right: 24px; line-height: 24px;}
#column-container h5 {margin: 0 24px;}
#column-container h3 {margin: 0 24px;}
#column-container h4 {margin: 0 24px;}
/* Full Column */
#column-container-full {background: url(../images/bg-main-column.gif) repeat-x; margin-top: 10px; border: 1px solid #445058; border-top: none; float: left; width: 958px;}
.padding {padding: 24px;}
#column-container-full p {font-size: 13px; margin: 0; color: #bbb; line-height: 24px;}
/* Mission Statement */
div.mission {display: block; clear: both;}
div.mission h2 {float: left; margin: 30px 0 0 0;}
div.mission a.portfolio {display: block; width: 323px; height: 153px; background: url(../images/astonish-designs-screenshots.png) no-repeat; float: right; text-indent: -9999px; outline: none;}
div.mission a.portfolio:hover {background: url(../images/astonish-designs-screenshots-over.png) no-repeat;}


/* ---------- FORMS ---------- */
form#contact {clear: left;}
form#request-quote label {color: #a09fa4; font-size: 14px; font-weight: bold;}
form#request-quote input {width: 451px; background: url(../images/bg-input-text.png) no-repeat; border: none; height: 25px; padding: 5px 0 0 13px; font-size: 15px; color: #fff; font-weight: bold;}
form#request-quote table {width: 100%;}
#request-left {width: 530px; float: left;}
#request-left h4 {margin-top: 0;}
#request-right {float: right; padding-top: 44px; width: 370px;}
/* general contact */
#contact-left {width: 550px; float: left;}
#contact-left h4 {margin-top: 0;}
/* error checking */
div.error-message {width: 480px; margin-bottom: 20px; border-bottom: 1px dashed #445058; padding-bottom: 20px;}
div.error-message img {float: left; margin: 0 15px 10px 0}
div.error-message p {line-height: 16px !important; font-size: 11px; color: #fff !important;}
div.error-message h5 {font-size: 18px; color: #ff3535; margin: 0 0 5px 0; overflow: hidden; font-weight: normal;}
label.error {color: #ff3535 !important;}
input.error {border: 1px solid #ff3535 !important;}
select.error {border: 1px solid #ff3535 !important;}
span.error {color: #ff3535 !important;}


/* ---------- PORTFOLIO STRUCTURE ---------- */
ul#portfolio-categories {margin: 10px 0 0 0; padding: 0; list-style: none; height: 62px;}
ul#portfolio-categories li {float: left; text-indent: -9999px; background: url(../images/bg-inactive-portfolio.png) no-repeat; position: relative; margin-top: 3px;}
ul#portfolio-categories li.active {background: url(../images/bg-active-portfolio.png) no-repeat; display: block; width: 239px; height: 62px; margin: 0; position: relative; margin-top: 3px;}
ul#portfolio-categories li a {display: block; width: 230px; height: 53px; margin: 0 8px 0 0; margin-top: 1px; outline: none;}
ul#portfolio-categories li.active a {background: none; display: block; width: 239px; height: 62px; margin: 0 8px 0 0; position: relative; margin-top: 1px;}

/* portfolio tabs */
ul#portfolio-categories li a#website-design {background: url(../images/portfolio-title-website-design-inactive.png) no-repeat 30px 17px;}
ul#portfolio-categories li.active a#website-design {background: url(../images/portfolio-title-website-design.png) no-repeat 30px 17px;}
ul#portfolio-categories a#application-showcase {background: url(../images/portfolio-title-application-showcase.png) no-repeat 16px 14px;}
ul#portfolio-categories li.active a#application-showcase {background: url(../images/portfolio-title-application-showcase-active.png) no-repeat 17px 14px;}

/* portfolio navigation */
#portfolio-navigation {height: 178px; background: url(../images/bg-portfolio-nav.png) repeat-x; border: 1px solid #445058; padding: 25px; margin-bottom: 25px;}

#portfolio-navigation ul {float: left; padding: 0; margin: 0; list-style: none; font-family: Arial, Helvetica, sans-serif;}
#portfolio-navigation ul li {line-height: 17px; float: left; width: 164px; margin: 0 8px 14px 8px;}
#portfolio-navigation ul li a {font-size: 12px; font-weight: bold; color: #fff; text-decoration: none; display: block;}
#portfolio-navigation ul li a span {color: #a09fa4; font-size: 12px; display: block; font-weight: normal;}
#portfolio-navigation ul li a:hover {font-size: 12px; font-weight: bold; color: #7292a2; text-decoration: none; display: block;}
#portfolio-navigation ul li a:hover span {color: #7292a2; font-size: 12px; display: block; font-weight: normal;}
#portfolio-navigation ul li a.active {font-size: 12px; font-weight: bold; color: #f99d1c; text-decoration: none; display: block;}
#portfolio-navigation ul li a.active span {color: #637c82; font-size: 12px; display: block; font-weight: normal;}
/* photo fader */
#image-holder {height:600px; left:0px; position:relative; top:-12px; visibility:hidden; float:left; overflow:hidden; width:910px; z-index:50;}
#image-holder ul {list-style-image:none; list-style-position:outside; list-style:none; margin:0; padding:0;}
#image-holder li {left:0; position:absolute; top:0; z-index:1;}
p.website-description {color: #a09fa4; font-size: 13px; line-height: 18px; display: inline;}
h2.website-description-heading {color: #fff; font-size: 14px; font-weight: bold; margin: 0; display: inline;}


/* testimonials */
.testimonial {margin: 0 0 45px 0; clear: both; float: left;}
.testimonial img {float: left; margin: 0 0 0 25px;}

#column-container .testimonial p.quote span {background: #212e36; display: block; margin: 10px 0 0 15px; padding: 0 15px;}
#column-container .testimonial p.quote {
	background: url(../images/bg-quote-top.png) no-repeat; 
	width: 472px; 
	float: left;
	margin: 0 0 0 15px; 
	color: #7e9ca3; 
	font-size: 12px; 
	line-height: 20px; 
	}
#column-container .testimonial p.quote span.bottom {background: url(../images/bg-quote-bottom.png) no-repeat; height: 13px; width: 456px; margin: 0 0 0 15px;}	
#column-container .testimonial p.source {background: none; clear: both; margin: 0 0 0 25px; padding-top: 5px; width: auto; height: auto; line-height: 18px; font-size: 12px;}
.testimonial p.source span {color: #fff;}


/* request a quote testimonials */
#request-right div.testimonial {margin-bottom: 24px; margin-top: 0;}
#request-right div.testimonial-top {background: url(../images/bg-testimonial-top.png) no-repeat; height: 10px; width: 368px;}
#request-right div.testimonial-middle {background-color: #242e35; width: 328px; margin: 0 20px 0 0; padding: 5px 20px;}
#request-right div.testimonial-bottom {background: url(../images/bg-testimonial-bottom.png) no-repeat; height: 24px; width: 368px;}
#request-right div.testimonial-middle p {font-size: 16px; font-family: "Palatino Linotype","MS Sans Serif","Sans Serif"; color: #bbb; line-height: 25px;}
#request-right div.testimonial p.source {font-family: lucida sans unicode, arial, sans serif; font-size: 12px; font-weight: normal; font-style: normal; background: url(../images/bg-testimonial-source.png) no-repeat 0 4px; padding: 0 0 0 15px; color: #618093; line-height: 16px; width: 340px;}
#request-right div.testimonial p.source a {color: #6cb1b8;}

form#contact label {color: #a09fa4; font-size: 14px; font-weight: bold;}
form#contact input {width: 270px; background: #1d282f; border: none; height: 25px; padding: 5px 0 0 5px; margin-bottom: 4px; font-size: 15px; color: #fff; font-weight: bold;}
form#contact input.btn {border: none; width: auto; height: auto; background: none; margin-left: -6px;}
form#contact select {width: 275px; background: #1d282f; padding: 5px; margin-bottom: 4px; font-size: 15px; color: #fff; font-weight: bold; border: none;}
form#contact textarea {width: 469px; background: #1d282f; min-height: 185px; padding: 5px; margin-bottom: 4px; font-size: 15px; color: #fff; font-weight: bold; font-family: arial, sans-serf; border: none;}
form#contact table {width: 100%; border-spacing: 0; margin-bottom: 20px;}
td.input-cell {width: 280px;}

/* checkboxes */
form#contact td.checkboxes-cell input {width: auto; margin: 0 10px 0 0; padding: 0; background: none; vertical-align: middle;}
td.checkboxes-cell p {padding: 0; margin: 0;}
td.checkboxes-cell p span {font-size: 13px; color: #bbb; vertical-align: middle; margin: 0; padding: 0;}

td.label-cell {width: 200px;}
td.label-cell-large {width: 230px;}
.required {color: #a09fa4; font-size: 20px;}
#map {width: 100%; height: 385px; margin-bottom: 10px;}
#map #logocontrol, #map #copyright {display: none;}

#contact-right {width: 350px; float: right; padding-top: 44px;}
#contact-right p {color: #94b6bf; font-size: 11px;}
#contact-right p strong {color: #dae8f2;}
#contact-right p.contact-details {background: #242e35; font-size: 13px; margin-bottom: 10px; padding: 10px; border-bottom: 1px solid #38454f; border-top: 1px solid #1c272e; border-left: 1px solid #1c272e; border-right: 1px solid #38454f;}


/* ---------- MAIN COLUMN ---------- */
#main-column {background: url(../images/bg-main-column.gif) repeat-x; padding: 30px 0 0 0; width: 672px; float: right; border-left: 1px solid #445058;}
#main-column p.sub-title {font-size: 20px; line-height: 28px; font-weight: normal;}
/* breadcrumbs */
#breadcrumbs {border-top: 1px solid #445058; margin: 25px 0 0 0; width: 100%; height: 31px; overflow: hidden;}
#breadcrumbs ul {margin: 0; padding: 0;}
#breadcrumbs ul li {float: left; list-style: none; background: url(../images/breadcrumb-separator.png) no-repeat; line-height: normal; font-size: 12px;}
#breadcrumbs ul li.home {float: left; list-style: none; background: none;}
#breadcrumbs ul li.home a {padding-left: 16px;}
#breadcrumbs ul li a {padding: 7px 9px 9px 32px; display: block; color: #748794; text-decoration: none;}

img.lifecycle-graphic {margin: 0 0 25px 25px;}

dl.technologies {float: left; margin-left: 65px;}
dl.technologies dd img {margin: 10px 10px 0 0;}
dl.technologies dt {color: #4c949b; font-size: 16px; margin-top: 15px;}
dl.technologies dd {margin: 0; color: #bbbbbb; font-size: 12px;}

ul.generic li span {color: #bbb;}
ul.generic li {color: #f3881d; line-height: 24px; font-size: 13px;}
ul.generic {margin-right: 20px;}
ul.generic-alt {margin-right: 25px;}
ul.generic-alt li span {color: #bbb;}
ul.generic-alt li span strong {color: #fff;}
ul.generic-alt li {color: #9bd697; line-height: 24px; font-size: 13px; margin-bottom: 10px;}

ol.generic {margin: 15px 20px 0 5px;}
ol.generic li span {color: #bbb;}
ol.generic li {color: #fff; line-height: 24px; font-size: 13px; margin-bottom: 10px;}

ol.generic-alt li span {color: #fff; font-weight: bold;}
ol.generic-alt li {color: #9bd697; line-height: 24px; font-size: 13px;}


#showcase {margin: 0 25px 45px 25px; background: #38444d; padding: 20px 15px; border: 1px solid #445058;}
#showcase a.back {float: left; margin: 90px 15px 100px 0;}
#showcase a.forward {float: right; margin: 90px 0 0 15px;}
#showcase p {margin: 0; font-size: 12px; width: 225px; margin-left: 45px; line-height: 18px;}
#showcase h5 {text-transform: uppercase; margin: 0 0 5px 0; color: #4d969d;}
#showcase img.screenshot {float: right; margin: 5px 20px 0 25px; border: 1px solid #252d33;}
#showcase p.technologies {margin-top: 10px; color: #4d969d; font-style: italic;}

/* ---------- SIDE COLUMN ---------- */
#side-column {background: url(../images/bg-side-column.gif) repeat-x; float: left; width: 285px; padding-top: 30px; min-height: 320px;}
#side-column h3 {margin: 0 0 20px 20px; color: #445058;}
#side-column .bg-underlay {background: url(../images/services-box.png) no-repeat center 20px;}
#side-column p {color: #7292a2;}
#side-column ul.sidenav {margin: 0; padding: 0; position: relative;}
#side-column ul.sidenav li {list-style: none; font-size: 15px; margin-bottom: 10px; margin-left: 5px; position: relative; left: 1px; height: 40px;}
#side-column ul.sidenav li a {color: #3d7083; display: block; padding: 7px 0 6px 48px; text-decoration: none;}
#side-column ul.sidenav li a:hover {color: #efaf44;}
#side-column ul.sidenav li.top {background: url(../images/bg-subnav-active-top.png) no-repeat;}
#side-column ul.sidenav li.middle {background: url(../images/bg-subnav-active.png) no-repeat;}
#side-column ul.sidenav li.bottom {background: url(../images/bg-subnav-active-bottom.png) no-repeat;}
/* sub navigation - no icons */
#side-column ul.sidenav-noicons {margin: 0; padding: 0; position: relative;}
#side-column ul.sidenav-noicons li {list-style: none; font-size: 15px; margin-bottom: 10px; margin-left: 5px; position: relative; left: 1px; height: 40px;}
#side-column ul.sidenav-noicons li a {color: #3d7083; display: block; padding: 7px 0 6px 18px; text-decoration: none;}
#side-column ul.sidenav-noicons li a:hover {color: #efaf44;}
#side-column ul.sidenav-noicons li.top {background: url(../images/bg-subnav-active-top.png) no-repeat;}
#side-column ul.sidenav-noicons li.middle {background: url(../images/bg-subnav-active.png) no-repeat;}
#side-column ul.sidenav-noicons li.bottom {background: url(../images/bg-subnav-active-bottom.png) no-repeat;}

#side-column ul li.active a {color: #fff;}
#side-column ul li.active a:hover {color: #fff;}
/* tab icons & titles */
#side-column ul.sidenav li a#search-engine-optimization {background: url(../images/icon-mini-search-engine-optimization.png) no-repeat 18px 7px;}
#side-column ul.sidenav li.active a#search-engine-optimization {background: url(../images/icon-mini-search-engine-optimization-color.png) no-repeat 18px 7px;}
#side-column ul.sidenav li a#website-design {background: url(../images/icon-mini-website-design.png) no-repeat 18px 9px;}
#side-column ul.sidenav li.active a#website-design {background: url(../images/icon-mini-website-design-color.png) no-repeat 18px 9px;}
#side-column ul.sidenav li a#internet-marketing {background: url(../images/icon-mini-internet-marketing.png) no-repeat 18px 9px;}
#side-column ul.sidenav li.active a#internet-marketing {background: url(../images/icon-mini-internet-marketing-color.png) no-repeat 18px 9px;}
#side-column ul.sidenav li a#application-development {background: url(../images/icon-mini-application-development.png) no-repeat 18px 8px;}
#side-column ul.sidenav li.active a#application-development {background: url(../images/icon-mini-application-development-color.png) no-repeat 18px 8px;}


/* ---------- LET'S TALK BOX ---------- */
.lets-talk-box {clear: both; margin-left: 30px;}
.lets-talk-inner {background: url(../images/bg-lets-talk.png) no-repeat; padding: 15px; margin-left: 42px;}
.lets-talk-inner h3 {font-size: 22px; font-family: "lucida sans unicode", geneva, arial, sans serif; color: #cae5f1; font-weight: normal; line-height: 18px;}
.lets-talk-inner p {margin-top: 10px;}
.lets-talk-inner a {color: #cae5f1; text-decoration: underline;}
img.lets-talk-icon {float: left;}


/* ---------- TWO COLUMN DIV STRUCTURE (Web Design Page) ---------- */
div.cell {float: left; margin: 0 0 40px 30px; width: 290px;}
div.cell h4 {font-size: 15px; color: #fff; margin: 0 0 15px 0; padding: 0; line-height: 22px;}
div.cell img {float: left; margin-right: 15px;}
.topmargin {margin-top: 4px;}
#column-container div.cell p {font-size: 13px; margin: 0; padding: 0;}
.timeline {margin: 20px 0 20px 30px;}

div.cell-small {float: left; margin: 0 0 30px 30px; width: 290px; min-height: 100px;}
div.cell-small h4 {font-size: 17px; color: #fff; padding: 0; line-height: 24px;}
div.cell-small img {float: left; margin: 3px 10px 0 0;}
#column-container div.cell-small p {font-size: 13px; margin: 0; padding: 0; line-height: 20px;}

div.cell-full {clear: both; width: auto; margin: 0 30px;}
div.cell-full h4 {font-size: 17px; color: #ff9c00; padding: 0; line-height: 24px;}
div.cell-full img {float: left; margin: 3px 15px 0 0;}
#column-container div.cell-full p {font-size: 13px; margin: 0; padding: 0; line-height: 20px;}


.archive h1, .archive h2, .archive h3, .archive h4 {margin: 0 24px; line-height: normal;}
.archive h1 {font-size: 24px;}
.archive h2 {font-size: 20px;}
.archive h3 {font-size: 16px;}
.archive h4 {font-size: 14px;}

.archive ul li, ol li {font-size: 13px;}
.archive ol li {margin: 0 0 15px 0;}
.archive ol li p {margin: 0 !important; padding: 0 !important;}


/* ---------- PRE FOOTER ----------*/
#pre-footer {margin: 20px 0; float: left;}
#pre-footer h3 {font-size: 14px; color: #637c82; font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif; margin: 0 0 15px 0;}
#portfolio {float: left; width: 465px; margin-right: 40px;}
#testimonials {float: left; width: 205px; margin-right: 30px;}
#testimonials p {font-size: 16px; font-family: "Palatino Linotype", "MS Sans Serif", "Sans Serif"; color: #fff; font-style: italic; font-weight: bold; line-height: 24px;}
#testimonials p.source {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; line-height: 16px !important; margin: 0 0 30px 0;}
#testimonials p span.name {color: #f99d1c;}
#testimonials p span.company {color: #999; font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-weight: normal;}
#news {float: right; width: 215px;}
#news a {text-decoration: none;}
#news a:hover {text-decoration: none !important;}
#news p {font-size: 12px; font-family: Arial, Helvetica, sans-serif; color: #a4a4a4; line-height: 18px;}
#date-tag {background: url(../images/date-tag.png) no-repeat; height: 80px; width: 51px; float: left; margin: 0 15px 0 0;}
#date-tag span.date {font-family: "trebuchet ms", arial, sans serif; font-size: 32px; color: #637c82; display: block; text-align: center; width: 51px; height: 37px; margin-top: 27px; line-height: 24px;}
#date-tag span.month {font-family: "trebuchet ms", arial, sans serif; font-size: 12px; letter-spacing: 1px; color: #a0a0a0; text-transform: uppercase; display: block; text-align: center; width: 51px; margin-top: -9px;}
#news a.read-more {color: #f99d1c;}
#news a:hover {text-decoration: underline;}

div.news-article #date-tag {margin: 0 15px 10px 25px;}
div.news-article a #date-tag {text-decoration: none;}
div.news-article p {margin-top: 5px; line-height: 20px !important;}
.news-article h3 {line-height: normal; font-size: 22px;}
div.news-article h3 a {text-decoration: none; color: #7e9ca3;}
div.news-article h3 a:hover {text-decoration: underline;}
.news-article p.details {margin: 0;}

/* ---------- FOOTER ---------- */
#footer {background: url(../images/bg-footer.gif) repeat-x; min-height: 172px; margin: 30px 0 20px 0; border-top: 1px solid #41868d;}
#footer div.links {float: left; margin: 10px 10px 0 15px;}
#footer div.links a {color: #c3d9e2; font-weight: bold; font-size: 11px; line-height: 14px; text-decoration: none;}
#footer div.links ul {margin: 0; padding: 0; list-style: none; padding-top: 3px;}
#footer div.links ul li {line-height: 12px;}
#footer div.links ul li a {color: #638c9e; font-weight: normal;}
/* social media links */
#footer div#sm-links {float: right; clear: right; margin: 0 15px 0 0;}
#footer div#sm-links a {margin-right: 10px; float: left;}
#footer div#sm-links a.facebook {height: 31px; width: 30px; background: url(../images/icon-facebook.png) no-repeat; display: block;}
#footer div#sm-links a.facebook:hover {background: url(../images/icon-facebook-hover.png) no-repeat;}
#footer div#sm-links a.twitter {height: 26px; width: 30px; background: url(../images/icon-twitter.png) no-repeat; display: block;}
#footer div#sm-links a.twitter:hover {background: url(../images/icon-twitter-hover.png) no-repeat;}
#footer div#sm-links a.linkdin {height: 26px; width: 30px; background: url(../images/icon-linkdin.png) no-repeat; display: block;}
#footer div#sm-links a.linkdin:hover {background: url(../images/icon-linkdin-hover.png) no-repeat;}
/* footer extras */
#footer img#footer-corner {position: relative; width: 24px; height: 33px; float: right; top: -1px;}
#footer #footer-logo {float: right; margin: 15px 0 0 0;}
p.copyright {font-family: Arial, Helvetica, sans-serif; font-size: 11px; float: right; clear: right; margin: 0 25px 0 0; width: 300px;}
p.seo {font-family: Arial, Helvetica, sans-serif; font-size: 11px; float: right; clear: right; margin: 15px 25px 0 0;}