/* 
Theme Name: Paragon Research Associates
Theme URL: http://paragonresearch.net
Description: PRA.
Author: Adam Hindman
Author URI: http://pugetworks.com
Version: 1.0
*/

/* == PAGE STRUCTURE =================== */

.container,#header,#main{
margin:auto;
width:960px;
}

#content{text-align:left;}

#footer{
background: url('/images/footer-shelf.png') repeat-x;
height:152px
}

#footer .meta{
background: url('/images/footer-plate-wide.png') no-repeat;
width:993px;
float:right;
margin-right:-19px;
margin-top:10px;
height:82px;
color:#606060;
font-family:
	"gill sans mt",
	Arial, 
	Helvetica, 
	sans-serif;
}

#footer .meta h2{margin:10px 0 -7px 35px;}
span.contact{
	margin:0 0 0 35px;
	display:block;
	width:290px;
}


#footer .meta span.floatRight{
margin-left:30px;
width:310px;
}

#header{}

#nav{float:right;margin-top:20px}

#nav li{
float:left;
font-family:"gill sans mt";
font-size:131%;
margin-right:0px;
}

#nav li.last{margin-right:0}

#nav li.active,#nav a:hover{
background:#248ea0;
}

#nav a{
color:#676767;
text-decoration:none;
display:block;
padding:5px 16px;
}

#nav li.active a, #nav a:hover{color:#fff}

/* == BASE STYLES ============ */

a{color:#248ea0}

.service-ad a{color:#fff;}

a.action{
background-color:#676767;
display:block;
padding:10px;
margin-top:15px;
text-align:center;
width:100%;
}

html,body{
height:100%;
text-align:center;
font-family:
	Georgia, 
	Palatino, 
	"Palatino Linotype",
	Times, 
	"Times New Roman",
	serif
}

* html #container{ height:100%; } /* IE6 100% height */

html{}

body{
background-color:#fff;
font-size:13px;
text-align:center; 
line-height:1.8;
}

#home {background: url('/images/shelf.png') repeat-x top left;}

h1,h2,h3,h4,h5,h6{
font-family:
	"gill sans mt",
	Arial, 
	Helvetica, 
	sans-serif;
font-size:131%;
color:#248ea0;
}

h1{font-size:167%;}
h2{font-size:138.5;}
h3{font-size:131%;}

#home h2{margin-bottom:5px;}

p,.callout-list li span{font-size:85%;}

strong{font-weight:bold}

/* == HOME ============================ */
#intro{margin-top:0px;padding-top:22px;}

#intro .container{
background: url('/images/home-bg2.png') no-repeat;
height:243px;
margin-top:6px;
}

#intro p,#summary p,#summary h2{
color:#fff;
width:595px;
font-size:131%;
line-height:1.5;
padding:20px 25px 20px 20px;
}

#main .service-ad{
float:left;
}

#crm-ad{width:290px;margin-right:20px}
#crm-ad .action{width:290px;}
#ccm-ad{width:300px;margin-left:0px}


/* == SERVICES PAGE =================== */
.service #content{
background: url('/images/service-bg.png') repeat-x;
}

.service #main,#about #main{padding-top:50px;}

#logo{float:left;margin-top:10px;height:76px}
.service #logo {float:left;}

/* == MAINTABS =================== */
.tabs{float:right;margin-top:-16px}

.tabs li {
  float:left;
  background:url("/images/tabs/inact-left.png") no-repeat left top;
  padding:0 0 0 8px;
  height:45px;
}

.tabs a{
  display:block;
  background:url("/images/tabs/inact-right.png") no-repeat right top;
  padding:0px 25px 0px 15px;
  text-decoration:none;
  height:45px;
  line-height:45px;
  outline:none;
  margin-right:-8px;
  color:#676767;
  font-size:123.1%;
  font-family: "gill sans mt",Arial,Helvetica,sans-serif;
}

#ccm .tabs a{
padding: 0 13px 0 5px;
font-size:1.15em;
}

.tabs .selected{
  background:url("/images/tabs/act-left.png") no-repeat left top;
}

.tabs .selected a{
  background:url("/images/tabs/act-right.png") no-repeat right top;
}

/* == SUMMARY SECTION ================= */
#summary h2{
margin:0;
padding:20px 0px 10px 20px;
font-size:153.9%;
}

#summary{
background: url('/images/green-plate.png') top left no-repeat;
height:212px;
width:620px;
float:left;
margin-right:20px;
}

#summary p{
padding:0 0 0 20px;
}
/* == IN PAGE TABS ==================== */
.service #projects h2{margin:0px 0 20px 0}
.service #projects h2{margin:10px 0 10px 0}

/* == CALLOUT LIST ==================== */
.callout-list{
background: url('/images/diagonal-stripe.png');
}

.callout-list address{
display:block;
font-size:85%;
width:280px;
margin:10px 10px 0 20px;
}

.callout-list strong{font-weight:normal;font-style:italic;}

.callout-list h1, .callout-list h2, .callout-list h3{
background-color:#248ea0;
color:#fff;
padding:2px 10px;
}

.callout-list li{
list-style:square outside;
color:#ccc;
margin-left:10px;
font-size:100%
}

.callout-list li span{
color:#000;
font-size:85%;
}

.callout-list ul{margin:5px 10px;}


/* == CURATION & COLLECTIOSN MANAGEMENT ==== */
#clients{float:left;}
#clients ul{float:left;width:300px;}
#clients ul li{margin-left:10px;}

#ccm #services{
float:left;
width:320px;
}

.project{
width:300px;
margin-bottom:20px;
margin-right:20px;
float:left;
min-height:16em;
}

#s106 .project{min-height:20em}

.tab .about{background:url(/images/regulation-bg.png);}
.tab .about h4{background:#e0e0e0;padding:5px 0 5px 10px}
.tab .about p{padding-left:10px;}

.tab em{font-style:italic}

.project h4,.bio h4{color:#000;font-size:116%;line-height:1.1}
.bio h4 em{float:right;background:#eee;padding:1px 10px;line-height:1.4}

/* == CULTURAL RESOURCE MANAGEMENT ===== */

#primary,#sidebar{float:left}
#primary{width:620px;margin-right:20px;}
#sidebar{width:320px}
.service #services{margin-bottom:20px;}
.service #services em{display:block;font-size:100%;padding-left:35px}
.service #summary {margin-bottom:-20px}
.service #clients{width:620px;margin-top:20px}
.service #clients ul{float:left;width:290px}
.service #projects .project{width:290px;float:left;margin:10px 20px 0 0}
.service #projects{width:620px;margin-top:30px;}

#projectTabs{	
background:url('/images/tabs/shadow.png') bottom left repeat-x;
height:45px;
width:620px;
margin-top:-10px;
}

#projectTabs ul{float:right;margin-right:20px;}

/* == ABOUT PAGE ====================== */
#about #description p{margin-bottom:20px;}

#description{float:left;width:620px;margin-right:20px}
#about #summary{
	background: url('/images/green-plate-tall.png') top left no-repeat;
	height:278px;
	margin-bottom:20px	
}

#about .callout-list{float:left;width:320px;padding-bottom:20px;margin-bottom:20px;}
#about .callout-list p{padding:20px 20px 0 20px;line-height:2;%}

#about .bio{float:left;width:460px;margin:20px 30px 0 0;}
#about .even{margin-right:0}

/* == HOME CAROUSEL SLIDER ================= */

#home .carousel{float:left;width:320px;}

#home #carousel{
background: url('/images/home-carousel.png') no-repeat;
width:310px;
height:320px;
margin-top:-40px;
padding:11px 0 0 25px;	
}

#home #slider {
   width: 280px; /* important to be same as image width */
   height: 280px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#home #sliderContent {
   width: 280px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

#home .sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

#home .sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px 15px 13px;
   width: 374px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;
}

#home .clear {
   clear: both;
} 

/* == SERVICES CAROUSEL SLIDERS ================= */

#ccm .carousel{margin-bottom:20px}

.service .carousel{float:left;width:320px;}

.service #carousel{
background: url('/images/home-carousel.png') no-repeat;
width:320px;
height:240px;
margin-top:-40px;
padding:11px 0 0 25px;	
}

.service #slider {
   width: 320px; /* important to be same as image width */
   height: 240px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

.service #sliderContent {
   width: 320px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.service .sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.service .sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: 10px/15px Arial, Helvetica, sans-serif;
   padding: 10px 13px 15px 13px;
   width: 374px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;
}

.service .clear {
   clear: both;
}