@charset "UTF-8";
/* CSS Document */
/* 
Imported Styles
-----------------------------------------------------------------------------*/	
@import url("cssreset.css"); /* Resets defaults to help minimize browser interpretation issues */
@import url("sifr.css"); /* used for professional font replacment */
@import url("slideshow.css"); /* used for professional font replacment */
/* 
Typography
-----------------------------------------------------------------------------*/	
h1, h2, h3, h4, h5, h6, th {margin-bottom: 10px; padding:0; margin-top:0;}
h1 {font-size:36px;}
h2, #primary-content .col-2 h3 {font-size:24px;}
	#primary-content .col-2 h3 {border-bottom:#b3aaab 1px solid;}
	#secondary-content .col-1 h2, #secondary-content .col-2 h3  {border-bottom:#d1d1d1 1px solid;}
h3 {font-size:20px;}

h4 {font-size:18px;}
	#tertiary-content h4 {border-bottom:#333 1px solid;}
#content p, #content ol, #content ul, #content dl, 
	#content small, #content td { line-height:1.5em; margin-bottom:1.5em; padding:0; margin-top:0;}
#primary-content ul, #secondary-content ul{margin-left:25px;}
	#primary-content ul li, #secondary-content ul li, #tertiary-content ul li {list-style:square;}
#primary-content ol, #secondary-content ol, #tertiary-content ol {margin-left:32px;}
	#primary-content ol li, #secondary-content ol li, #tertiary-content ol li {list-style:decimal;}
#footer ul, #footer p, #footer h5 {margin-bottom:0;}


a:link, a:visited {text-decoration:; color:#00759b;}
a:hover, a:focus {text-decoration:none;}
a:active {}

/* 
Containers
-----------------------------------------------------------------------------*/	
html {text-align: center; font:12px Arial, Helvetica, sans-serif; padding:0; margin:0; background:#969696 url(../images/html-back.png) top left repeat-x;}
body {width: 950px; margin:0 auto; /*background: url(../images/body-grid.gif) top center repeat-y;*/ background-color:#fff;}
#wrap {width: 890px;  background-color:#fff;  margin-left:30px;}
#masthead, #content, #footer {width: 890px; position:relative;}
#masthead {height:110px;}
	#logo {position: absolute; top:18px; left:0;}
	#contact-info {position:absolute; top:80px; right:0;}
	#tagline {position:absolute; top: 44px; right:0;}
	#social-media-links {position:absolute; top: 6px; right:0;}
		#social-media-links li {display:inline; margin:0 9px 0 0;}
		#social-media-links li.last {margin-right:0;}
#portfolio-search {height:55px; width:890px; background:url(../images/portfolio-back.png) top right repeat-x; position:relative;}
	#portfolio-search p {position:absolute; top:23px; left:8px; font-size:11px; font-weight:bold;}
	#porftolio-industry {position:absolute; top:20px; left:480px;}
	#porftolio-solution {position:absolute; top: 20px; left:680px;}
#content {float:left; text-align:left; margin-bottom:20px; padding-top:10px;}
#primary-content {width:100%;}
	#primary-content .col-1 {float:left; width:590px; margin-left:10px;}
	#primary-content .col-2{float:right; width:250px; margin-right:10px; background:url(../images/secondary-content-back.png) top left repeat-x;}
#secondary-content, #tertiary-content {width:890px; background:url(../images/secondary-content-back.png) top left repeat-x; clear:both; padding-top:20px; margin-bottom:20px;}
	#secondary-content .col-1 {float:left; width: 560px; margin-left:10px; position:relative;}
	#secondary-content .col-2 {float:right; width: 230px; margin-right:10px; position:relative;}
	#tertiary-content .col-1 {float:left; width: 270px; margin: 0 30px 0 10px;}
	#tertiary-content .col-2 {float:left; width: 270px; margin-right:30px;}
	#tertiary-content .col-3 {float:left; width: 270px; margin-right:0;}
	
#footer {clear:both; width: 890px; padding:20px 0; border-top:#f4f4f4 1px solid;}

/* 
Gutters
-----------------------------------------------------------------------------*/	
#primary-content .col-2 .gutter {padding:20px 10px;}
#masthead .gutter {padding:;}
#banner .gutter {padding:;}
#footer .gutter {padding:;}
/* 
Navigation
-----------------------------------------------------------------------------*/	
#main-navigation {width:100%;}
#nav {height:35px; float:left;}
#nav li {float: left; width:127px; background:url(../images/nav-border.gif) top right no-repeat; margin:0; padding:0;}
#nav #nav-7 {background-image:none; width:128px;}
#nav li a {width: 125px; display:block; line-height:35px; background:url(../images/nav-back.png); color:#fff; text-decoration:none;}
#nav #nav-7 a {width:128px;}
#nav li a:hover, #nav li a:focus, #nav li a.active {background: url(../images/nav-back-active.png);}
#nav li a.active:hover {cursor: default;}

.sf-menu {line-height:	30px;}
.sf-menu ul {position:absolute;	top:-999em;	width:20em !important; /* left offset of submenus need to match (see below) */}
.sf-menu ul li {width:100%; 	width:15em !important;}
.sf-menu li:hover {visibility:inherit; /* fixes IE7 'sticky bug' */}
.sf-menu li {float:left; position:relative;}
.sf-menu a {position:relative;width:15em;}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {left:0;top:35px; /* match top ul list item height */z-index:99;}

ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {top:-999em;}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {left:15em; /* match ul width */top:0;}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {top:-999em;}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {left:10em; /* match ul width */top:	0;}

.sf-menu ul {border-bottom: none; 	width:20em !important;}
.sf-menu ul li { background:url(../images/nav-back.png) !important; text-align:left; 	width:20em !important;}
.sf-menu ul a {display:block; text-indent:10px; 	width:20em !important; background-image:none !important}
#nav-3 ul a {text-indent:35px !important;}
.sf-menu ul a:hover {background-color:#4a71bd; color:#fff !important; text-decoration:underline !important;}
.sf-menu {float:left;}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {outline:0; }
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}
#web-design-service {background:url(../images/service-icons/bravo-art-trans.png) 5px 5px no-repeat !important;}
#web-optimization-service {background:url(../images/service-icons/bravo-re-web-trans.png) 5px 5px no-repeat !important;}
#content-management-service {background:url(../images/service-icons/bravo-cms-trans.png) 5px 5px no-repeat !important;}
#application-development-service {background:url(../images/service-icons/bravo-app-trans.png) 5px 5px no-repeat !important;}
#sem-service {background:url(../images/service-icons/bravo-seo-trans.png) 5px 5px no-repeat !important;}
#ecommerce-service {background:url(../images/service-icons/bravo-cart-trans.png) 5px 5px no-repeat !important;}
#copywriting-service {background:url(../images/service-icons/bravo-re-write-trans.png) 5px 5px no-repeat !important;}
#web-hosting-service {background:url(../images/service-icons/bravo-host-trans.png) 5px 5px no-repeat !important;}
#email-service {background:url(../images/service-icons/bravo-mail.trans.png) 5px 5px no-repeat !important;}
#social-media {background:url(../images/service-icons/bravo-media-trans.png) 5px 5px no-repeat !important;}

#footer-nav {width: 100%;}
#footer-nav li {display:inline;}
/* 
Images
-----------------------------------------------------------------------------*/	
.img-right {float:right; margin:0 0 1em 1em;}
.img-left {float:left; margin:0 1em 1em 0;}
#port-images img {border:#ccc 1px solid;}
/* 
Forms
-----------------------------------------------------------------------------*/	
label {display: block;}
#portofio-search-form label {display:inline;}
#customer-support label {position:absolute; top: -90000px;}
#customer-support input[type="text"],#customer-support input[type="password"], #mc-embedded-subscribe-form input[type="text"] {width:100%;  height:20px; margin-bottom:5px;}
/* 
Tables
-----------------------------------------------------------------------------*/	
#whitepapers td {padding:10px 10px 10px 0; vertical-align:top;}
table.management-team td {padding:20px !important; vertical-align:top;}
#contact-form {border:#f4f4f4 1px solid;}
#contact-form td {padding:10px !important; vertical-align:top;}
#contact-form input[type="text"] {width:100%;}
#whitepapers p, #whitepapers h3 {margin:0; padding:0;}
	/*
	   "Tiger Striping"
		if you want the rows to alternate colors, add class="stripe" to the 
		table tag on your web page.
	*/
	.stripe .alt {background-color:#f4f4f4;}
		/*This will make every other table right a different back ground color. */
	.stripe .over {background-color:#ccc;}
		/*This will make the background color change when you hover over a table row. */
/* 
Curvy Corners
-----------------------------------------------------------------------------*/	
.box {-webkit-border-radius: 8px; -moz-border-radius: 8px;}

/* 
Drop Shadow
-----------------------------------------------------------------------------*/	
.shadow {box-shadow:0 0 10px #999; -o-box-shadow:0 0 10px #999; -moz-box-shadow:0 0 10px #999;	-webkit-box-shadow:	0 0 10px #999;}

/* container for slides */
.testimonial-slider {
	position:relative;	
	height:200px;
	
	width:100%;
	float:left;	
	cursor:pointer;
	
}

/* single slide */
.testimonial-slider div {
	display:none;
	position:absolute;
	top:0;
	left:0;		
	height:200px;
}
.testimonial-slider div p {font-style:italic; margin-bottom:0;}

/* tabs (those little circles below slides) */
.tabs {
	clear:both;
	margin-left:330px;
}

/* disabled navigational button. is not needed when tabs are configured with rotate: true */
.disabled {
	visibility:hidden !important;		
}
