﻿/*
ARCO & ASSOCIATES, LLC
Developed by RULE13	  
*/

* { padding: 0; margin: 0; }

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #7A924F;
}
h1 { 
	color: #4A4A00;
	font-size: 26px; 
	line-height: 36px;
	margin-bottom: 15px; 
	margin-top: 18px;
}
h2 { 
	color: #4A4A00;
	font-size: 20px; 
	line-height: 20px; 
	margin-bottom: 15px;
}
h3 { 
	font-size: 14px; 
	line-height: 18px; 
}
p {
	margin-bottom: 15px; 
	color: #333;
	font-size:12px;
	}
p.form-row {
	margin-bottom:9px;
}
a {
	outline:none;
}
a:link,
a:active,
a:visited {
	color:#415F0C;
	text-decoration:underline;
}
a:hover {
	color:#000;
	text-decoration:none;
}
a.pdf {
	background:url(../img/icons/acrobat.png) no-repeat left center;
	padding: 2px 0 2px 20px;
}
a.web {
	background:url(../img/icons/world.png) no-repeat left center;
	padding: 2px 0 2px 20px;
}
a.podcast {
	background:url(../img/icons/podcast.png) no-repeat left center;
	padding: 2px 0 2px 20px;
}
blockquote p
    {
    padding: 0px;
    float: left;
		width: 400px;
}

blockquote
    {
    padding: 10px;
}

cite
    {
	border-left: 2px solid #4A4A00;
	margin-left:5px;
	padding:10px;
	width:180px;
		font-size: 11px;
    float: right;    
} 
strong {
	color:#4A4A00;
	font-size:14px;
}
strong.list-head {
	font-size:95%;
}
ul.body-list {
	margin-bottom:10px;
	margin-left:17px;
	font-size:95%;
	color: #4A4A00;
}
p.note {
	font-size:95%;
	font-style:italic;
}
p.list-text {
	font-size:95%;
}
.cleaner {
clear: both;
height: 0;
font-size: 0;
visibility: hidden;
content: ' ';
}

.cleaning-box { 
min-height: 1px;
}

.cleaning-box:after {
display: block; 
clear: both; 
visibility: hidden; 
height: 0; 
font-size: 0; 
content: ' ';
}

.noscreen {
display: none;
}
#wrapper { 
 margin: 20px auto;
 width: 922px;
 position:relative;
}
#faux {
 background: url(../img/bg-2-col.gif);
 margin-bottom: 5px;
 overflow: auto; /* Paul O Brien Fix for IE www.pmob.co.uk */
 width: 100%;
 height:500px;
 border-right:18px solid #A7BA87;
 height:540px;
}
#header {
 color: #333;
 width: 902px;
 padding: 10px;
 height: 100px;
 margin: 10px 0px 5px 0px;
 background: #ABBEBE;
}
#leftcolumn { 
 display: inline;
 color: #333;
 margin: 10px 10px 0;
 padding: 120px 0 0 0;
 width: 195px;
 float: left;
 background: transparent url(../img/logo-nav.gif) no-repeat top center;
}
#rightcolumn {
	float: left;
	color: #333;
	margin-left: 4px;
 /*padding: 2px;
 margin-right:28px;*/
 width: 702px;
	display: inline;
	position: relative;
	height:540px;
}
#rightcolumn .copy {
	margin:136px 14px 0 14px;
	}
#rightcolumn .copy .block-left {
	float:left;
	width:320px;
}
#rightcolumn .copy .block-right {
	float:left;
	width:320px;
	margin-left:20px;
}
#footer { 
 width: 902px;
 clear: both;
 color: #FFF;
 margin: 0px 0px 10px 0px;
 padding: 10px;
 font-size:18px;
 font-weight:normal;
}
#footer .siteby {
	float:left;
}
#footer .siteby a {
	display:block;
	width:65px;
	height:26px;
}
#footer .siteby a img {
	border:none;
}
#footer .contact-info {
	float:right;
	text-align:right;
}
#footer .contact-info .phone {
	background: url(../img/icons/phone.gif) no-repeat left center;
	padding-left: 22px;
}
#footer .contact-info a {
	font-size:11px;
	color:#fff;
}
.clear { clear: both; background: none; }

/* MENU SYSTEM */

.logo-link {
	position:absolute;
	width:190px;
	height:115px;
	top:25px;
	left:14px;
	cursor:pointer;
}

.glossymenu{
	margin: 5px 0;
	padding: 0;
	width: 195px; /*width of menu*/
}

.glossymenu a.menuitem{
	background: black url(../img/glossyback.gif) repeat-x bottom left;
	font-weight:bold;
	color: #333;
	display: block;
	position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
	width: auto;
	padding: 4px 0;
	padding-left: 10px;
	text-decoration: none;
}

.glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
	position: absolute;
	top: 5px;
	right: 5px;
	border: none;
}

.glossymenu a.menuitem:hover,
.glossymenu a.menuitem:focus{
background-image: url(../img/glossyback2.gif);
color: #FFF;
}

.glossymenu div.submenu{ /*DIV that contains each sub menu*/
background: #C6D2B0;
}

.glossymenu div.submenu ul{ /*UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
}

.glossymenu div.submenu ul li{
/*border-bottom: 1px solid blue;*/
	font-size:12px;
}

.glossymenu div.submenu ul li a{
display: block;
color: #333;
text-decoration: none;
padding: 2px 0;
padding-left: 10px;
}

.glossymenu div.submenu ul li a:hover,
.glossymenu div.submenu ul li a:focus{
background: #88A35C;
color: #FFF;
}

/* TURN ON MENU FOR SPECIFIC PAGE */

#home .glossymenu a.index,
#about .glossymenu a.about,
#services .glossymenu a.services,
#process .glossymenu a.process,
#portfolio .glossymenu a.portfolio,
#leadership .glossymenu a.leadership,
#testimonials .glossymenu a.testimonials,
#contact .glossymenu a.contact {
background-image: url(../img/glossyback2.gif);
color: #FFF;
}
body.brochures .glossymenu div.submenu ul li a.active-brochures,
body.blogs .glossymenu div.submenu ul li a.active-blogs,
body.casestudy .glossymenu div.submenu ul li a.active-casestudy,
body.mail .glossymenu div.submenu ul li a.active-mail,
body.web .glossymenu div.submenu ul li a.active-web,
body.print .glossymenu div.submenu ul li a.active-print,
body.pr .glossymenu div.submenu ul li a.active-pr,
body.events .glossymenu div.submenu ul li a.active-events,
body.enewsletters .glossymenu div.submenu ul li a.active-enewsletters, 
body.logos .glossymenu div.submenu ul li a.active-logos,
body.video .glossymenu div.submenu ul li a.active-events {
background: #9AAF78;
color: #FFF;
}
body.brochures .glossymenu div.submenu ul li a.active-brochures:hover,
body.blogs .glossymenu div.submenu ul li a.active-blogs:hover,
body.casestudy .glossymenu div.submenu ul li a.active-casestudy:hover,
body.mail .glossymenu div.submenu ul li a.active-mail:hover,
body.web .glossymenu div.submenu ul li a.active-web:hover,
body.print .glossymenu div.submenu ul li a.active-print:hover,
body.pr .glossymenu div.submenu ul li a.active-pr:hover,
body.events .glossymenu div.submenu ul li a.active-events:hover, 
body.enewsletters .glossymenu div.submenu ul li a.active-enewsletters:hover,
body.logos .glossymenu div.submenu ul li a.active-logos:hover {
background: #88A35C;
}

/* HEADER IMAGE REPLACEMENT */
#page-title {
	width: 494px;
	height: 88px;
	position: relative;
	margin-bottom:0;
	display:none;
	}
#page-title span.about {
	background: url(../img/headers/about.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.services {
	background: url(../img/headers/services.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.process {
	background: url(../img/headers/process.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.portfolio {
	background: url(../img/headers/portfolio.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.leadership {
	background: url(../img/headers/leadership-profile.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.testimonials {
	background: url(../img/headers/testimonials.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}
#page-title span.contact {
	background: url(../img/headers/contact.gif) no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	}	

/* PORTFOLIO PAGE ADD-ON TITLES */
.portfolio-title {
	position:absolute;
	width:455px;
	height: 76px;
	top:53px;
	right:0px;
}	
.brochures .portfolio-title {
	background-image:url(../img/portfolio-brochures.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.blogs .portfolio-title {
	background-image:url(../img/portfolio-blogs.png);
	background-repeat: no-repeat;
	background-position: top left;
}
.logos .portfolio-title {
	background-image:url(../img/portfolio-logos.png);
	background-repeat: no-repeat;
	background-position: top left;
}
.enewsletters .portfolio-title {
	background-image:url(../img/portfolio-enewsletters.png);
	background-repeat: no-repeat;
	background-position: top left;
}
.casestudy .portfolio-title {
	background-image:url(../img/portfolio-casestudy.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.mail .portfolio-title {
	background-image:url(../img/portfolio-mail.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.web .portfolio-title {
	background-image:url(../img/portfolio-web.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.print .portfolio-title {
	background-image:url(../img/portfolio-print.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.pr .portfolio-title {
	background-image:url(../img/portfolio-pr.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.events .portfolio-title {
	background-image:url(../img/portfolio-events.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
.video .portfolio-title {
	background-image:url(../img/portfolio-video.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}
/* PAGE-SPECIFIC BODY BACKGROUND */
.bg-home {
	background-image:url(../img/bg-main.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
	margin-right:1px;
}
.bg-about {
	background-image:url(../img/bg-about.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}
.bg-services {
	background-image:url(../img/bg-services.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}

.bg-process {
	background-image:url(../img/bg-process.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}
.bg-portfolio {
	background-image:url(../img/bg-portfolio.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}
.bg-leadership {
	background-image:url(../img/bg-leadership.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}
.bg-testimonials {
	background-image:url(../img/bg-testimonials.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}
.bg-contact {
	background-image:url(../img/bg-contact.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	height:500px;
}



form {
  padding: 0;
  margin: 0;
}

/* If you're finding the input elements get pushed down, increase the width */
label {
  float: left;
  width: 20%;
  vertical-align: top;
	text-align:right;
	padding-top:3px;
	padding-right:20px;
}

input,
textarea,
select {
  padding: 1px;
  font: 400 1em verdana, sans-serif;
  color: #4A4A00;
  background: #E3EAD9;
  border: 1px solid #4A4A00;
	padding:2px 4px;
}

input:focus,
input:hover,
textarea:focus,
textarea:hover,
select:focus,
select:hover {
  color: #000;
  background: #FFF;
  border: 1px solid #527610;
}

input.noBorder,
input:focus.noBorder,
input:hover.noBorder {
  padding: 0;
  border: 0;
}

input.button {
  padding: 2px 5px;
  font: 400 0.9em verdana, serif;
  cursor: pointer;
  color: #fff;
  background: #527610;
  border-width: 1px;
  border-style: solid;
  border-color: #AECF74 #141F02 #141F02 #AECF74;
}

input.radio {
  background: none;
  border: 0px;
}
.width200 {
	width:200px;
}
.width640 {
	width:660px;
}
.required {
	color: #F00;
	}
	
	
/* Gallery intro */
	
#small-gallery .thumbnail {
float: left;
width: 130px;
margin: 0 10px 15px 0;
padding: 5px;
text-align:center;
}
#small-gallery .thumbnail a {
	text-decoration:none;
	font-size:11px;
}
#small-gallery .thumbnail img {
	border: 2px solid #7A924F;
	margin: 0;
	width:120px;
	height:90px;
}
#small-gallery .thumbnail a:hover img {
	border: 2px solid #2B3F08;
}

.clearboth { clear: both; }
	

/* Small gallery */

#small-gallery {
	margin: 1em 0 3em 0;
	width: 600px;
	padding: 16px 0 1px 20px;
}

#small-gallery img {
	border: 2px solid #7A924F;
	margin: 0 10px 15px 0;
	width:120px;
	height:90px;
}

#small-gallery a:hover img {
	border: 2px solid #2B3F08;
}
#small-gallery .gallery-text {
	padding-top:90px;
}
#small-gallery a .gallery-link {
	width:120px;
	padding-top:4px;
	text-align:center;
}
/* Large gallery */

#large-gallery {
	margin: 1em 0 0 1em;
	width: 650px;
	text-align:left;
	padding-top:16px;
}

#large-gallery img {
	border: 2px solid #7A924F;
	margin: 0 10px 15px 0;
	float:left;
	background:#fff;
}

#large-gallery a:hover img {
	border: 2px solid #7A924F;
}
#large-gallery .portfolio-copy {
	float:left;
	width:320px;
	margin-left:10px;
	padding:5px;
}
#large-gallery .portfolio-copy h2 {
	margin-bottom:12px;
}
#large-gallery .alternate-nav {
	float:left;
	width:320px;
	margin-left:10px;
	padding:5px;
}
#large-gallery .alternate-nav .next {
	float:right;
}
a.disabled {
	color:#999;
}
	

