/*****************************************************************************/
/*                       BarlowPro.com Global Styles                         */
/*****************************************************************************/


/*** Generic Typography ******************************************************/

body {
	font: 76% arial, helvetica, sans-serif;
	color: #333;
}

a, a:link, a:visited {
	text-decoration: none;
  color: #ff5c00;
}

a:active, a:hover {
	text-decoration: underline;
  color: #ff5c00;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0.5em 0 0 0;
}

h1 {
	/*font-size: 2.0em;*/
	font-size: 1.3em;
  color: #ff5c00;
}

h1 .subtitle {
  display: block;
  font-size: 0.8em;
  font-weight: normal;
  line-height: 1.1em;
}

h2 {
	font-size: 1em;
}

h3 {
	font-size: 1em;
}

h4 {
	font-size: 1em;
}

h5 {
	font-size: 1em;
}

h6 {
}


/*** Common styles ***********************************************************/

html, body, form {
  height: 100%;
  overflow: inherit;
}

body { 
	margin: 0;
	padding: 0;
	color: #fff;
	background: #000 url(../images/common/bg-page.jpg) 50% 0 no-repeat;
}

img {
  border: none;
}

.page-outer {
  position: relative;
  min-height: 100%;
}

.page {
  position: relative;
  margin: 0 auto;
  width: 940px;
  padding-left: 60px;
}

.inline-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.inline-list li {
  display: inline;
  padding: 0 0.6em;
}

.inline-list li.first {
  padding-left: 0;
}

.inline-list li.last {
  padding-right: 0;
}

.centered-list-outer {
  float: left;
  position: relative;
  left: 50%;
}

.centered-list {
  position: relative;
  left: -50%;
}

.floatL {
  float: left;
}

.floatR {
  float: right;
}

.clear-fix {
  height: 0;
  clear: both;
}

/*--- Even-Width Column Layouts ---*/

.col-outer {
  width: 100%; /* makes IE5.5 happy, doesn't hurt anything else */
  overflow: hidden;
}

.col-outer .col {
  float: left;
}

.two-col-outer .col {
  width: 50%;
}

/* The odd value of the 3-column layout causes some variation in different 
browsers. Noteably, Safari 2 and Opera 9.5 ignore the decimal places and has 
a larger gap after the last column. */
.three-col-outer .col {
  width: 33.33%;
}

.four-col-outer .col {
  width: 25%;
}

.five-col-outer .col {
  width: 20%;
}

.col-inner {
  margin: 0.5em;
}


/*** Header ******************************************************************/

.header-top {
  padding: .25em 0 .15em 0;
  font-size: 0.95em;
  color: #000;
  background: #ff5c00 url(../images/header/header-top.jpg) repeat-x;
}

.header-top .right {
  float: right;
}

.header-top .login-link {
  position: absolute;
  right: 90px;
  padding-left: 12px;
  font-weight: bold;
  font-size: 0.85em;
  line-height: 1.7em;
  text-transform: uppercase;
  background: url(../images/common/arrow-right.gif) 0 center no-repeat;
}

.header-top a,
.header-top a:link,
.header-top a:visited {
  color: #000;
}

.header-top a:hover {
  /*background-color: transparent;*/
}

.header-top .current a,
.header-top .current a:link,
.header-top .current a:visited {
  /*color: #fff;*/
}

.header-top .logout-link,
.header-top .logout-link:link,
.header-top .logout-link:visited {
  margin-right: 25px;
  font-weight: bold;
  font-size: 0.85em;
  line-height: 1.7em;
  text-transform: uppercase;
  color: #fff;
}

.header-top .current a:hover {
  text-decoration: none;
}

.header {
  overflow: hidden;
  width: 100%;
  min-height: 61px;
	background: transparent url(../images/header/bg-header.png) 0 100% repeat-x;
}

.header .logo-area {
  float: left;
  margin: 12px 20px 15px 9px;
}

.header .logo-area a:hover {
  /*background-color: transparent;*/
}

.primary-nav {
  margin-left: 9px;
}

.services-nav {
  margin: 0 0 0 253px;
  padding: 0;
  font-size: 1.2em;
  font-weight: bold;
  text-transform: uppercase;
  list-style-type: none;
}

.services-nav li {
  float: left;
  padding: 28px 1.1em 14px 1.1em;
  text-align: center;
}

.services-nav li.current {
  background: #ff5c00;
}

.services-nav a,
.services-nav a:link,
.services-nav a:visited {
  color: #ff5c00;
  text-decoration: none;
}

.services-nav a:hover,
.services-nav li.current a,
.services-nav li.current a:visited {
  color: #fff;
  text-decoration: none;
  /*background-color: transparent;*/
}


/*** Body ********************************************************************/

.body-outer {
  overflow: hidden;
  padding-bottom: 20em;
}

.req {
  color: #ff5c00;
}

.content-area {
  float: left;
  padding: 16px 10px 30px 5px;
  width: 215px;
  line-height: 1.35em;
}

.content-area h1,
.banner-area h1 {
  margin-bottom: .5em;
  line-height: 1.1em;
}

.content-area p,
.content-area ul,
.content-area ol,
.banner-area .content p,
.banner-area .content ul,
.banner-area .content ol {
  margin-bottom: .8em;
}

.content-area ul li,
.content-area ol li,
.banner-area .content ul li,
.banner-area .content ol li {
  margin-left: 15px;
}

.content-area ul li.title,
.banner-area .content ul li.title {
  margin-top: 0.8em;
  margin-left: 0;
  font-weight: bold;
  list-style-type: none;
}

.secondary-content-area {
  float: right;
  width: 190px;
  padding: 26px 0;
}

.secondary-content-area .button-link {
  float: left;
  clear: left;
  margin-bottom: 4px;
}

.banner-area {
  margin: 0 190px 0 230px;
  padding: 26px 10px;
}

.banner-area .banner-outer {
  overflow: hidden;
  padding: 10px;
  color: #000;
  background: #fff;
}

.banner-area .banner-outer p {
  margin: 10px 10px 5px 10px;
  font-size: 0.9em;
  color: #606a74;
}

.banner-area .banner-outer p.footnote {
  color: #ff5c00;
}

.banner-area .banner-image-outer {
  padding: 10px 10px 0 10px;
  background: url(../images/common/bg-content.png);
}

.banner-area .content {
  padding: 10px 20px;
  background: url(../images/common/bg-content.png);
}

.subnav {
  margin: -5px 0 20px 0;
  width: 150px;
  list-style-type: none;
}

.subnav li {
  margin-top: 2px;
  padding-bottom: 2px;
  border-bottom: dotted 1px #7D7D7D;
}

.subnav li.current a,
.subnav li.current a:visited {
  color: #fff;
}

/*--- Thumbnails ---*/

.banner-area .banner-outer #thumbs {
  overflow: hidden;
  min-height: 330px;
  background: #333;
}

.banner-area .banner-outer #thumbs img {
  float: left;
}

.thumbs-pager {
  display: none;
  margin: 0 auto;
  width: 26em;
}

.thumbs-pager #info {
}

.thumbs-pager #info,
.thumbs-pager #prev,
.thumbs-pager #next {
  float: left;
  margin: 0 2px;
  padding: 5px 15px;
  font-size: 0.9em;
  background: url(../images/common/bg-content.png);
}

.thumbs-pager #prev.disabled,
.thumbs-pager #prev.disabled:hover,
.thumbs-pager #next.disabled,
.thumbs-pager #next.disabled:hover {
  text-decoration: none;
  color: #74757A;
}

.thumbs-pager #prev span {
  padding-left: 12px;
  background: url(../images/common/angle-l.gif) 0 3px no-repeat;
}

.thumbs-pager #next span {
  padding-right: 12px;
  background: url(../images/common/angle-r.gif) 100% 3px no-repeat;
}

.thumbs-pager #prev,
.thumbs-pager #next {
  text-transform: uppercase;
}

#tooltip { position: absolute; z-index: 3000; }
#tooltip h3, #tooltip div { margin: 0; }

.thumb-tooltip {
  padding: 5px;
  min-width: 150px;
  white-space: nowrap;
  background: #ff5c00;
}

.thumb-tooltip strong {
  display: block;
}

/*--- Home page ---*/

.banner-area .home-banner-outer {
  min-height: 361px;
  padding-bottom: 0;
}

#rotating-banner {
  min-height: 320px;
}

#rotating-banner a {
  display: none;
}

#rotating-banner a.default-link {
  display: inline;
}

#rotating-banner img {
  display: block;
  width: 480px;
  height: 320px;
}

#banner-bottom {
  float: right;
  visibility: hidden;
  min-width: 50%;
  padding: 5px 0 5px 10px;
  text-align: right;
  background: url(../images/common/dots.gif) 0 center repeat-x;
}

#banner-bottom a img {
  margin: 0 3px;
  border: solid 2px #fff;
}

#banner-bottom a.activeSlide img {
  border: solid 2px #ff5c00;
}

#banner-bottom #pause-link {
  display: block;
  overflow: hidden;
  float: right;
  margin: 0 0 0 10px;
  width: 24px;
  height: 24px;
  border: solid 2px #fff;
  text-align: left;
  text-indent: -9999px;
  background: url(../images/common/btn-pause.gif) no-repeat;
}

#banner-bottom #pause-link.paused {
  background: url(../images/common/btn-play.gif) no-repeat;
}

/*--- Contact page ---*/

.banner-area #map_canvas {
  overflow: hidden;
  margin-bottom: 0.8em;
  width: 480px;
  height: 320px;
}

.contact-form {
  border: none;
}

.contact-form legend {
  display: none;
}

.contact-form .validation-summary {
  padding-left: 30px;
  min-height: 68px;
  font-weight: bold;
	color: #ff5c00;
	background: url(../images/common/exclamation.gif) no-repeat;
}

.contact-form .validation-summary ul {
  margin-left: 15px;
  font-weight: normal;
}

.contact-form .fields-list {
  margin: 15px 0;
  padding: 0;
  list-style-type: none;
}

.banner-area .contact-form .fields-list li {
  overflow: hidden;
  clear: left;
  margin: 0;
  width: 49%;
}

.contact-form .fields-list .right {
  float: right;
}

.contact-form .fields-list label {
  float: left;
}

.contact-form .fields-list .tb,
.contact-form .fields-list .ta {
  font-size: 1.2em;
  font-family: arial, helvetica, sans-serif;
  color: #fff;
  background: #333;
}

.contact-form .fields-list .tb { /* textboxes */
  float: right;
  margin-bottom: 4px;
  width: 150px;
  border: none;
  /*border-bottom: solid 1px #858585;*/
}

.contact-form .fields-list .ta { /* textarea */
  border: none;
  /*border: solid 1px #858585;*/
  /*width: 98%;*/
  height: 10.2em;
  overflow: auto;
}

.contact-form .buttons {
  margin-left: 200px;
}

/*--- Tips page ---*/

.tips-list li {
  margin-bottom: 10px;
}

.tips-list li ul {
  list-style-type: disc;
}

.tips-list li ul li {
  margin-bottom: auto;
}

/*--- Client List ---*/

.client-list {
  float: left;
  margin: 0 30px 0 0;
  padding: 0;
  list-style-type: none;
}

/*--- Client Area ---*/

.ui-tabs-nav li.ui-tabs-selected {
	border-bottom-color: #ff5c00;
}

.ui-tabs-nav li.ui-tabs-selected a, 
.ui-tabs-nav li.ui-tabs-selected a:hover {
	/*background: #ff5c00;*/
}

#proofs td, 
#finals td {
  padding: 5px;
  vertical-align: bottom;
  text-align: center;
}

#proofs .item-info,
#finals .item-info {
  text-align: center;
  font-size: 0.9em;
}

#proofs .item-info a,
#finals .item-info a,
#proofs .item-info .size,
#finals .item-info .size {
  font-size: 0.8em;
  font-weight: bold;
}

#proofs .item-info .size,
#finals .item-info .size {
  font-weight: normal;
}


/*** Footer ******************************************************************/

.footer {
  position: absolute;
  overflow: hidden;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 15em;
  padding: 20px 0;
	background: url(../images/footer/bg-footer.png) 0 0 repeat-x;
}

.footer .content-left {
  float: left;
  padding: 8px 10px 0 5px;
  width: 215px;
}

.footer .contact-list {
  list-style-type: none;
}

.footer .contact-list li {
  margin-bottom: 10px;
  padding-left: 22px;
}

.footer .contact-list li.icon-phone {
  background: url(../images/footer/icon-phone.gif) 0 0 no-repeat;
}

.footer .contact-list li.icon-mail {
  background: url(../images/footer/icon-mail.gif) 0 0 no-repeat;
}

.footer .contact-list li.icon-visit {
  background: url(../images/footer/icon-visit.gif) 0 0 no-repeat;
}

.footer .contact-list .adr {
  font-size: 0.9em;
}

.footer .contact-list .locality {
  margin-left: 2.8em;
}

.footer .contact-list .title {
  padding-left: 0;
	font-size: 1.3em;
	font-weight: bold;
	text-transform: uppercase;
  color: #ff5c00;
}

.footer .content-main {
  margin-left: 230px;
}

.footer .content-main .col {
  float: left;
  padding: 5px 30px 0 0;
}

.footer .content-main .links-list {
  list-style-type: none;
  font-size: 0.9em;
}

.footer .content-main .links-list li {
  margin-bottom: 3px;
  line-height: 1.1em;
}

.footer .content-main .links-list li a,
.footer .content-main .links-list li a:visited {
  color: #858585;
}

.footer .content-main .links-list li a:hover {
  /*background-color: transparent;*/
}

.footer .content-main .links-list .title {
  margin: 6px 0;
  font-size: 1.1em;
  font-weight: bold;
  text-transform: uppercase;
  color: #ff5c00;
}

.footer .content-main .links-list .title a,
.footer .content-main .links-list .title a:visited {
  color: #ff5c00;
}

.footer .content-main .links-list .title a:hover {
  /*background-color: #444;*/
}

.footer-bottom {
  clear: left;
  padding-top: 25px;
  font-size: 0.9em;
  color: #858585;
}