/*
	Global Stylesheet for Pop Art 2010
	Rules in this file should be applied to every page on the site.
	If a rule will only apply to one or two, add it to pages.css instead.
	Be polite to future developers, and label any hex colors you use!
*/

/* Universal Rules -------------------------------------------------- */
body {
	background: #000;
	color: #858585; /* grey */
	font: 76%/1.5 helvetica, arial, sans-serif;
	text-shadow: 0 0 0 #000;
}
.ahem, hr { display: none; }
a, a:link, a:visited { color: #858585; } /* grey */
a:hover, a:focus, a:active { color: #EBEB00; } /* yellow */
.floatleft { float: left; margin: 0 1em 1em 0; }
.floatright { float: right; margin: 0 0 1em 1em; }
.clearboth { clear: both; }
object { outline:none; } /* fix for swfobject in FF3 */
.fpo,
#content .fpo a,
#content .fpo th,
#content .fpo td,
#content .fpo {
	color: #f00 !important;
	background: #ff0 !important;
	padding: .25em;
}

/* Layout -------------------------------------------------- */
#container {
	width: 990px;
	margin: 0 auto;
}
#header {
	width: 990px;
	margin: 0 auto 20px;
	position: relative;
	padding-top: 44px;
}
#wrapper {
}
#sidebar {
	float: left;
	width: 170px;
	margin-top: 20px;
	/*height: 130px; */
}
#content {
	float: right;
	width: 787px;
	margin: 0 0 20px 0px;
}
#footer {
	clear: both;
}

/* Header Styles -------------------------------------------------- */

#header p {
	margin: 0;
}
.follow {
	display: block;
	width: 160px;
	height: 28px;
	position: absolute;
	top: 20px;
	left: 824px;
	margin: 0;
	text-align: right;
}

.follow li {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: 1;
}
.follow li,
.follow a {
	display: inline;
	height: 28px;
}

#follow-us-on {
	height: 11px;
	position: absolute;
	top: 8px;
	left: 0px;
}
#header .logo a {
	display: block;
	text-indent: -9999px;
	width: 189px;
	height: 34px;
	background: transparent url("/images/pa-logo-black-1.png") no-repeat;
}
#header .logo a:hover, #header .logo a:focus {
	background-position: left bottom;
}

/* Navbar Styles -------------------------------------------------- */
.nav {
	width: 752px;
	height: 43px;
	background: transparent url("/images/nav.png") no-repeat;
	position: absolute;
	top: 42px;
	left: 238px;
	margin: 0;
}
.nav li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
	line-height: 1;
}
.nav li,
.nav a {
	display: block;
	height: 43px;
	text-indent: -9999px;
}
.nav a {
	background: transparent url("/images/nav.png") no-repeat;
}
/* Navbar Placement */
#nav-company	{ left: 0; width: 100px; }
#nav-portfolio	{ left: 148px; width: 97px; }
#nav-contact	{ left: 281px; width: 89px; }
#nav-blog		{ left: 401px; width: 57px; }
/* Navbar Images */
#nav-company a		{ background-position: 0 0; }
#nav-portfolio a	{ background-position: -148px 0; }
#nav-contact a		{ background-position: -281px 0; }
#nav-blog a			{ background-position: -401px 0; }
/* Selected Navbar Item */
#nav-company a:hover,	#nav-company a:focus	{ background-position: 0 -41px; }
#nav-portfolio a:hover,	#nav-portfolio a:focus	{ background-position: -148px -41px; }
#nav-contact a:hover,	#nav-contact a:focus	{ background-position: -281px -41px; }
#nav-blog a:hover,		#nav-blog a:focus		{ background-position: -401px -41px; }
/* Current Navbar Item */
.careers #nav-company a,
.portland #nav-company a,
.news #nav-company a,
.events #nav-company a,
.partners #nav-company a,
.pa-company #nav-company a		{ background-position: 0 -41px; }
.pa-portfolio #nav-portfolio a	{ background-position: -148px -41px; }
.pa-contact #nav-contact a		{ background-position: -281px -41px; }

#nav #nav-search {
	text-indent: 0;
	left: 500px;
	width: 246px;
	height: auto;
	top: 10px;
	text-align: right;
}
#nav-search label {
	display: none;
}
#nav-search #txtSearch{
	width: 170px;
	font-size: .9em;
	padding: .2em;
}
#nav-search input:focus {
	outline: 1px dotted #999;
}
#nav-search #btnSearch {
	width: auto;
	background: #333;
	border: 1px solid #666;
	color: #eee;
	cursor: pointer;
	margin-left: .5em;
}


/* New Sidebar Navigation Styles -------------------------------------------------- */

#sidebar-menu {
	margin-top: 10px;
}

p.menu {
 	line-height: 1.5em;
}

ul.menu, ul.menu ul {
	list-style-type:none;
	margin: 0;
	padding: 0;
	width: 170px;
}
ul.menu {
	margin-bottom: 20px;
	padding: 8px 0px;
	background: url("/images/bg-sidebar-menu.png") no-repeat 0 0 #1C1C1C;
}
ul.menu a {
	display: block;
	text-decoration: none;	
}

ul.menu li {
	margin-top: 1px;
	margin-left: 0px;
}

ul.menu li a {
	color: #999999;		
	padding: 0.3em 1.3em;
	font-size: 12px;
	font-weight: bold;
}

ul.menu li a:hover {
	color: #EBEB00;
}

ul.menu li ul li a {
	color: #999999;	
	padding: 0.1em 0 0.1em 20px;
	font-weight: normal;
	font-size: 11px;
}

ul.menu li ul li a:hover {
	color: #FFFFFF;
}

p.menu-two {
 	line-height: 1.5em;
}

ul.menu-two, ul.menu-two ul {
	list-style-type:none;
	margin: 0;
	padding: 0;
	width: 170px;
}
ul.menu-two {
	margin-bottom: 20px;
	padding: 8px 0px;
	background: url("/images/bg-sidebar-menu.png") no-repeat 0 0 #1C1C1C;
}
ul.menu-two a {
	display: block;
	text-decoration: none;	
}

ul.menu-two li {
	margin-top: 1px;
	margin-left: 0px;
}

ul.menu-two li a {		
	padding: 0.3em 1.3em;
	font-size: 11px;
	font-weight: normal;
}

ul.menu-two li a:hover {
	color: #FFFFFF;
}

ul.menu-two li ul li a {
	color: ##727272;	
	padding: 0.1em 0 0.1em 30px;
	font-weight: normal;
	font-size: 11px;
	background-color: #2E2E2E;
}

ul.menu-two li ul li a:hover {
	color: #FFFFFF;	
}


/* Sidebar Promos -------------------------------------------------- */
.sidebar-promo {
	margin-top: 10px;
}
.related-content {
	margin-bottom: 20px;
	padding: 8px 0px;
	background: url("/images/bg-sidebar-menu.png") no-repeat 0 0 #1C1C1C;
}
.related-content-top {
	height: 56px;
	margin: 0px;
	padding: 0px 7px;
}
.related-content-bottom {
	clear: both;
}
.related-content-photo {
	float: left;
	width: 56px;
	height: 56px;
	margin: 0px;
	padding: 0px;
}
.related-content-title {
	float: left;
	margin: 0px 0px 0px 6px;
	padding: 0px;
	height: 56px;
	font-size: 15px;
	line-height: 18px;
}

.related-content-description {
	margin: 6px;
	padding: 0px;
	line-height: 15px;
}
/* Slide Show styles -------------------------------------------------- */

#slider,
#slider2,
#slider3 { 
	margin: 0 0 0 22px;
}	
#slider ul, #slider li, #slider2 ul, #slider2 li, #slider3 ul, #slider3 li {
	margin:0;
	padding:0;
	list-style:none;
}
#slider li, #slider2 li, #slider3 li { 
	/* 
		define width and height of list item (slide)
		entire slider area will adjust according to the parameters provided here
	*/ 
	width:742px;
	height:166px;
	overflow:hidden; 
}	
#slider2 li, #slider3 li { 
	/* background:#f1f1f1; */
}		
#slider2 li h2, #slider3 li h2 { 
	margin:0 20px;
	padding-top:20px;
}	
#slider2 li p, #slider3 li p { 
	margin:20px;
}							
p#controls, p#controls2, p#controls3 {
	margin:0;
	position:relative;
} 
#prevBtn, #nextBtn, #prevBtn2, #nextBtn2, #prevBtn3, #nextBtn3 { 
	display:block;
	margin:0;
	overflow:hidden;
	text-indent:-8000px;		
	width:23px;
	height:34px;
	position:absolute;
	left:0px;
	top:-110px;
}	
#nextBtn, #nextBtn2, #nextBtn3 { 
	left:764px;
}														
#prevBtn a, #nextBtn a, #prevBtn2 a, #nextBtn2 a, #prevBtn3 a, #nextBtn3 a {  
	display:block;
	width:23px;
	height:34px;
	background:url("/images/btn_prev.gif") no-repeat 0 0;	
}	
#nextBtn a, #nextBtn2 a, #nextBtn3 a { 
	background:url("/images/btn_next.gif") no-repeat 0 0;	
}
.triple {
	margin: 7px 0 0 7px;
	padding: 0px;
	width: 238px;
	background: #565656;
}
.project-title {
	font-size: 11px;
	line-height: 24px;
}
.project-title a,
.project-title a:link {
	display: block;
	margin: 0px;
	padding-left: 6px;
	color: #CCCCCC;
	text-decoration: none;
}
.project-title a:hover,
.project-title a:focus {
	color: #EBEB00;
}


/* Container Styles -------------------------------------------------- */
#container {
	position: relative;
	z-index: 2;
}
#wrapper {
	position: relative;
}

/* Content Styles -------------------------------------------------- */
#content {
	position: relative;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	line-height: 1;
}
h1 { font-size: 3.15em; letter-spacing: -1px; color: #FFFFFF; }
h2 { font-size: 1.75em; color: #ece430; } /* cyan */
h3 { font-size: 1.5em; }
h4 { font-size: 1.33em; }
h5, h6 { font-size: 1em; }
/*
	Headlines have no bottom margin.
	Set text elements to have minimal top margin to pull them together.
	Tables get set down below. - SV
*/
#content ul ul,
#content ol ol {
	margin: 0;
}
.splash {
	padding: 20px 0px 30px 0px;
	margin: 0 auto 0;
	position: relative;
	top: 0;
	left: 0px;
}
.splashSub {
	padding: 20px 0px 10px 0px;
	margin: 0 auto 0;
	position: relative;
	top: 0;
	left: 0px;
}
#content .splash p {
	margin: 0;
	font-size: 18px;
	line-height: 24px;
	color: #009FC5;
	
}
#content .splash .breadcrumb {
	font-weight: normal;
	margin: 0 0 1em;
	color: #333;
	line-height: 1;
	font-size: .9em;
}
.splash a:link, .splash a:visited { color: #ff0; } /* yellow */



.splash a:hover, .splash a:focus, .splash a:active { color: #f11287; } /* magenta */
.splash .breadcrumb a:link, .splash .breadcrumb a:visited { color: #333; text-decoration: none; } /* gray */
.splash .breadcrumb a:hover, .splash .breadcrumb a:focus, .splash .breadcrumb a:active { color: #ff0; } /* yellow */
/*.splash .breadcrumb a.current:link, .splash .breadcrumb a.current:visited { color: #ff0; }*/ /* yellow */

p.tagline { color: #009FC5; text-shadow: 0 0 0 #000; }
p.tagline a:link, P.tagline a:visited, P.tagline a:hover { color: #009FC5; } /* blue */

/*.splash .breadcrumb a.current:hover, .splash .breadcrumb a.current:focus, .splash .breadcrumb a.current:active { color: #f11287; }*/ /* magenta */

/* Section Headers */
.section {
	clear: both;
	margin-bottom: 26px;
}
.section-head {
	width: 787px;
	height: 33px;
	background: transparent url("/images/bg-portfolio-section-header.png") no-repeat;
	padding: 8px 18px 0px 18px;
}

/* This builds lists within the Expertise and Client Project sections */
#project-list { 
	margin: 0px;
	padding: 0px;
}	
#project-list ul, 
#project-list li {
	margin:0;
	padding:0;
	list-style:none;
}
#project-list li { 
	width:787px;
}

/* This builds the Main columns for interior pages */
#columns {
	margin: 0;
	padding: 0;
	height: 100%;
}
.main-column {
	float: left;
	width: 432px;
	min-height: 476px;
}
.right-column {
	float: right;
	margin-right: 7px;
	width: 326px;
}
/* Tables -------------------------------------------------- */
table {
	width: 100%;
	margin: .5em 0 1em;
}
th, td {
	padding: .5em .75em;
	text-align: left;
	vertical-align: top;
	line-height: 1.1;
}
th {
	border-left: 1px solid #333;
	border-bottom: 1px solid #333;
}
td {
	border-left: 1px solid #333;
	border-bottom: 1px solid #333;
}
tr th:first-child,
tr td:first-child {
	border-left: none;
}

/* generic css rollover -------------------------------------------------- */
.button_rollover {
	background-position:top left;
	background-repeat:no-repeat;
	text-decoration:none;
}
.button_active {
	background-position:bottom left;
}
a:hover.button_rollover { 
	background-position:bottom left;
}

p.see-more a, 
p.see-more a:link, 
p.see-more a:visited { 
	color: #f11287; /* magenta */
	text-decoration: none;
	background: url(/images/bg-arrows-pink.png) no-repeat right center;
	padding-right: 16px;
}

p.back a, 
p.back a:link, 
p.back a:visited { 
	color: #f11287; /* magenta */
	text-decoration: none;
	background: url(/images/bg-arrows-pink-back.png) no-repeat left center;
	padding-left: 16px;
}

/* Forms -------------------------------------------------- */
.required {
	color: #FFFFFF;
	font-style: normal;
}
.form div {
	position: relative;
	margin-bottom: 1px;
	font-size: 15px;
	color: #FFFFFF;
}
.form .error {
	background: #ff6;
	font-style: italic;
}
.form div .required {
	position: absolute;
	left: -.75em;
	top: .25em;
}
.form div label {
	display: block;
	font-size: 15px;
	color: #FFFFFF;
}
.form div input,
.form div select,
.form div textarea {
	margin: .25em 0 1em;
	width: 75%;
}
.form .check input,
.form .radio input {
	margin: 0;
	position: absolute;
	top: .25em;
	left: 0;
	width: auto;
}
.form .check label,
.form .radio label {
	padding-left: 1.75em;
}
.stacked div {
	float: left;
	width: 100%;
}
.stacked div label {
	width: 7em;
	float: left;
	margin: .5em 1em 1em 0;
}
.stacked div input,
.stacked div select,
.stacked div textarea {
	width: 50%;
}
.stacked div .required {
	top: .75em;
}
#content .form .footnote {
	font-size: .9em;
	text-align: right;
	margin: 0;
}

/* Footer Styles -------------------------------------------------- */
#footer {
	width: 990px;
	margin: 0;
	font-size: .9em;
	color: #999;
	margin-bottom: 30px;
}
#footer h3 {
	font-size: 2em;
	margin: 0;
	padding: 0;
}
#footer .box-two-thirds {
	margin: 0;
	padding: 0;
	width: 180px;
	color: #666;
}
#footer .contact {
	margin: 2px 0 0;
	padding: 0;
	color: #666;
}
#footer .bottom-nav {
	margin: 4px 0 0;
	padding: 0;
	color: #CCC;
}
#footer .copyright {
	margin: 2px 0 0;
	padding: 0;
	color: #999;
}
#footer a:link, #footer a:visited { color: #666; text-decoration: none; border-bottom: 1px solid #666; }
#footer a:hover, #footer a:focus, #footer a:active { color: #FFF100; border-bottom: 1px solid #FFF100; } /* yellow */
#foot-bottom-nav a:link, #foot-bottom-nav a:visited { color: #CCC; text-decoration: none; border-bottom: 0px; }
#foot-bottom-nav a:hover, #foot-bottom-nav a:focus, #foot-bottom-nav a:active { color: #FFF100; } /* yellow */
#footer .logo a, #footer .logo a:link, #footer .logo a:visited {
	display: block;
	text-indent: -9999px;
	width: 125px;
	height: 38px;
	background: transparent url("/images/pa-logo-black.png") no-repeat;
	margin: 0 auto;
	border: 0;
}
#footer .logo a:hover, #footer .logo a:focus {
	background-position: left bottom;
}
#footer-top {
	padding: 20px 0px 20px 0px;
	height: 80px;
	border-top: 1px dotted #333;
	border-bottom: 1px dotted #333;
}
#footer-bottom {
	padding: 20px 0px 20px 0px;
	height: 30px;
}
.promo,
.foot {
	float: left;
	position: relative;
	z-index: 2;
}
#promo-contact-popart {
	width: 266px;
	margin-right: 40px;
}
#promo-popart-goes-social {
	width: 252px;
}
#promo-see-strengths {
	width: 242px;
}
#promo-living-the-brand {
	width: 180px;
}
#foot-bottom-nav {
	width: 274px;
}
#foot-contact {
	width: 470px;
}
#foot-copyright {
	width: 246px;
}

/* Social Media Sprite -------------------------------------------------- */
.social-media {
	width: 121px;
	height: 24px;
	position: absolute;
	top: 30px;
	left: 3px;
	margin: 0;
}
.social-media li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
	line-height: 1;
}
.social-media li,
.social-media a {
	display: block;
	height: 24px;
	text-indent: -9999px;
}
.social-media a {
	background: transparent url("/images/icons-social-media.gif") no-repeat;
}

.social-media a:link, .social-media a:visited {
	border-bottom: 0px solid #000;
}
/* Sprite Placement */
#social-media-facebook		{ left: 0; width: 29px; }
#social-media-twitter		{ left: 29px; width: 33px; }
#social-media-flickr		{ left: 62px; width: 33px; }
#social-media-youtube		{ left: 95px; width: 32px; }
/* Sprite Images */
#social-media-facebook a:link, #social-media-facebook a:visited			{ background-position: 0 0; border-bottom: 0px solid #000; }
#social-media-twitter a:link, #social-media-twitter a:visited			{ background-position: -29px 0; border-bottom: 0px solid #000; }
#social-media-flickr a:link, #social-media-flickr a:visited				{ background-position: -62px 0; border-bottom: 0px solid #000; }
#social-media-youtube a:link, #social-media-youtube a:visited			{ background-position: -95px 0; border-bottom: 0px solid #000; }
/* Sprite Item */
#social-media-facebook a:hover,	#social-media-facebook a:focus			{ background-position: 0 -24px; }
#social-media-twitter a:hover,	#social-media-twitter a:focus			{ background-position: -29px -24px; }
#social-media-flickr a:hover,	#social-media-flickr a:focus			{ background-position: -62px -24px; }
#social-media-youtube a:hover,		#social-media-youtube a:focus		{ background-position: -95px -24px; }

/* Extras -------------------------------------------------- */
.pixel {
	position: absolute;
	text-indent: -9999px;
	width: 30px;
	height: 30px;
	background: transparent url("/images/pixel-magenta.gif") no-repeat;
	z-index: 1;
}
.line {
	position: absolute;
	text-indent: -9999px;
	width: 57px;
	height: 94px;
	background: transparent url("/images/line-dashed.gif") no-repeat;
	z-index: 1;
}
.main-image {
	position: absolute;
	left: 50%;
	top: 0;
}


/* Flyouts */
.flyout-container {
	position: absolute;
	z-index: 3;
	cursor: pointer;
	margin: 0;
	padding: 0;
}
.flyout-container a img {
	padding: 0;
	margin: 0;
	border: none;
}
.flyout-container strong,
.whitepaper strong {
	text-transform: uppercase;
	display: block;
	height: 15px;
	font-size: 9px;
	padding: 0;
	margin: 0;
	color: #fff;
}
.flyout-container .type {
	font-size: 12px;
	font-weight: bold;
	height: 20px; /*setting a large enough height so that the natural font padding doesn't exceed causing layout issues for the flyout in ies.*/
}
.flyout-container .flyout {
	background: #333 url("/images/icon-blog.gif") no-repeat;
	color: #fff;
	position: absolute;
	width: 200px;
	height: auto;
	padding: 20px 25px;
	border: 1px solid #000;
	-webkit-box-shadow: 0px 0px 30px #000;
	-moz-box-shadow: 0px 0px 30px #000;
	box-shadow: 0px 0px 30px #000;
}
.top-left .flyout {
	top: -1px;
	left: -1px;
	background-position: right bottom;
	padding: 10px 35px 10px 10px;
	margin-top: 15px;

}
.blog .flyout {
	margin-top: 0;
}
.top-right .flyout {
	top: -1px;
	right: -1px;
	background-position: left bottom;
	padding: 10px 10px 10px 35px;
	margin-top: 15px;
}
.bottom-right .flyout {
	bottom: -1px;
	right: -1px;
	background-position: left top;
	padding: 10px 10px 10px 35px;
	margin-bottom: 20px
}
.bottom-left .flyout {
	bottom: -1px;
	left: -1px;
	background-position: right top;
	padding: 10px 35px 10px 10px;
	margin-bottom: 20px
}
.flyout-container .hidden {
	width: 25px;
	height: 25px;
	padding: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.flyout-container .hidden * {
	display: none;
}
.flyout p,
#content .flyout p {
	margin-bottom: 0;
}
.flyout h4,
#content .flyout h4 {
	font-size: 1.5em;
}
.flyout a:link, .flyout a:visited { color: #fff; }
.flyout a:hover, .flyout a:focus, .flyout a:active { color: #ff0; } /* yellow */
.portfolio .flyout.hidden {
	background-image: url("/images/icon-portfolio.gif");
}
.portfolio .flyout {
	background-image: url("/images/icon-portfolio.gif");
}
.portfolio .type {
	color: #ff0;
}
.news .flyout.hidden {
	background-image: url("/images/icon-news.gif");
}
.news .flyout {
	background-image: url("/images/icon-news.gif");
}
.news .type {
	color: #f11287; /* magenta */
}
.blog .flyout.hidden {
	background: url("/images/icon-blog.gif");
}
.blog .flyout {
	background-image: url("/images/icon-blog.gif");
	background-color: #fff;
	color: #333;
	top: -1px;
	left: -1px;
	margin-left: -26px;
}
.blog .flyout h4 {
	color: #f00;
}
.blog .flyout a:link, .blog .flyout a:visited { color: #f00; font-weight: bold; text-decoration: none; }
.blog .flyout a:hover, .blog .flyout a:focus, .blog .flyout a:active { color: #00a0c6; } /* cyan */
.blog .type {
	font-size: 9px;
}
.inspiration .flyout.hidden {
	background-image: url("/images/icon-inspiration.gif");
}
.inspiration .flyout {
	background-image: url("/images/icon-inspiration.gif");
}
.inspiration .type {
	color: #00a0c6; /* cyan */
}
#footer .type {
	color: #999;
}
.MenuSelected {
	color: yellow !important;
}
.MenuSubSelected {
	color: #FFFFFF !important;
}