@charset "utf-8";
/*****************************************
COLORS:
  Navy:    215290
  Blue:    2864b0
  Lt Lime: c4e680
  Dk Lime: b8e163

TABLE OF CONTENTS // ++ // ++ ///
 02.0     STATIC CONTENT
 02.0 a   ERIC MEYER CSS RESET
 02.0 b   LAYOUT
 02.0 c   NAVIGATION
 02.0 d   FARHNER IMAGE REPLACEMENT (fir)
 02.0 e   TYPOGRAPHY
 02.0 f   CALL-TO-ACTION BUTTONS
--
 02.1 a   OUR HOMES > Photo Gallery (Landing Page)
 02.1 b   OUR HOMES > Videos (Stories)
 02.1 c   OUR HOMES > Energy Star (Savings Calculator)
 02.1 d   OUR HOMES > Features
--
 02.2 a   ABOUT CLAYTON > Interactive Timeline (Landing Page)
 02.2 b   ABOUT CLAYTON > Giving Back
 02.2 c   ABOUT CLAYTON > Careers
 02.2 d   ABOUT CLAYTON > FAQ
 02.2 e   ABOUT CLAYTON > Our Brands
 02.2 f   ABOUT CLAYTON > Partners + Affliates
--
 02.3 a | TESTIMONIALS
********************************************/

h1 { left: -18px; }

a {
	text-decoration: underline;
	color:#2763b0;
	cursor:pointer;
	outline-style: none;
}

strong { font-weight: bold; }

:focus { outline: 0; }

#column-one, #column-one-noscript {
	position: relative;
  	float: left;
  	width: 350px;
  	left: 20px;
}

#column-two {
	position: relative;
  	float: right;
  	width: 350px;
	right: 20px;
    overflow: hidden;
}

#column-one li, #column-one-noscript li, #column-two li { margin-left: 18px; }

#column-one h3, #column-one-noscript h3, #column-two h3, #aboutFaq h3 {
  color: #565656;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: -0.034em;
  line-height: 160%;
  border-bottom: 1px solid #c7c7c7;
}
.top-headline {
  clear: both;
  color: #2864b0;
  border: none;
}

.strongColor {
	color: #444;
}

/** 02.2 a | ABOUT CLAYTON > Interactive Timeline (Landing Page) ***/
.about-history #column-one {
  width: 250px;
}
.about-history #column-one {
  position: relative;
}
#timeline {
  display: block;
  width: 850px;
  height: 106px;
  margin: 15px auto 0 auto;
  background: url(/brands/default/images/static/about_us/timeline/bg_timeline.gif) no-repeat;
  background-position: 5px 2px;
  position: relative;
  z-index: 0;
}
#timeline ul {
  list-style-type: none;
  padding: 45px 0 14px 0;
}
#timeline li {
  display: inline;
  font-size: 0.81em;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding: 45px 0 14px 0;
}
#timeline li a {
  color: #777;
  text-decoration: underline;
  background-image: url(/brands/default/images/static/about_us/timeline/timeline_selected.gif);
  background-repeat: no-repeat;
  background-position: 12px 0;
  padding: 42px 25px 14px 25px;
  text-align: center;
  height: 140px;
  font-size: 12px;
}
#timeline li a:hover,
#timeline li a.selected  {
  color: #2864b0;
  font-weight: bold;
  background-position: 12px -90px;
}
/* note: '2008' text reads 'current', so it's longer than a four-digit year 
li#year-08 a {       background-position: 17px 0; }
li#year-08 a:hover { background-position: 17px -90px; }*/
  li#year-34 {  margin-left:     0; }
  li#year-66 {  margin-left:  14px; }
  li#year-74 {  margin-left: -15px; }

  li#year-83 { margin-left:  -30px; }
  li#year-88 {  margin-left: -35px; }

  li#year-91 {  margin-left: -34px; }
  li#year-94 {  margin-left: -27px; }
  li#year-95 {  margin-left: -38px; }
  li#year-97 {  margin-left: -34px; }
  li#year-98 {  margin-left: -38px; }

  li#year-02 {  margin-left: -28px; }
  li#year-03 {  margin-left: -38px; }
  li#year-04 {  margin-left: -38px; }
  li#year-05 {  margin-left: -38px; }
  li#year-06 {  margin-left: -38px; }
  li#year-09 {  margin-left: -38px; }
.timeline-content {
  position: relative;
  width: 850px;
  height: 491px;
  clear: both;
}
.timeline-info {
  position: relative;
  top: 0; left: 0;
  z-index: 3;
  width: 400px;
}
.timeline-content img {
  width: 664px;
  position: relative;
  top: -100px; left: 170px;
  z-index: 0;
}
  /*#timeline-content-03 img { top: -330px;}*/
  #timeline-content-03 img { top: -189px;}  
  #timeline li a#06 { padding-left: 0;}

.about-history #column-one h3 {
  padding-top: 55px;
  width: 200px;  
}
.about-history h5 {
  font-size: 0.74em;
  line-height: 1.25em;
  color: #777;
  font-weight: bold;
  padding: 5px 0 0 0;
}
.about-history p a {
  font-weight: bold;
  text-transform: lowercase;  
}
#timeline-content-03 p {
  width: 400px;
}

/** 02.2 b | ABOUT CLAYTON > Giving Back ***/
#aboutGiving {
	position: relative;
	left: 16px;
  width: 770px;
}
#aboutGiving img {
  width: 842px; margin: 15px 0 0 25px;
}
#giving h3 {
  border: none;
  color: #2864b0;
  height: 34px;
}

/** 02.2 c | ABOUT CLAYTON > Careers ***/
#aboutJobs img {
  width: 846px;
}

#aboutJobs ul {
  margin: 5px 0 20px 0;
}
#aboutJobs li {
  list-style-type: disc;
  color: #777; 
}

#aboutJobs p#phone {
	padding-top: 10px;
}

#aboutJobs h3 #mailing {
  margin-top: 15px;
}

.vcard {
  margin: 10px 0 0 0;
  line-height: 1.35em;
  color: #777;
}

.vcard a {
  text-decoration: underline !important;
  color: #777 !important;
}

iframe#hrview{
	position:relative;
	left: -30px;
	margin-left: 0px;
	height: 550px;
	width: 900px;
}

/** 02.2 d | ABOUT CLAYTON > FAQ ***/
#aboutFaq {
	position: relative;
	margin: 0 auto;
  	width: 800px;
}

#questionAnswerCnr {
	position: relative;
	clear: both;
	width: 760px;
	margin: 0 auto;
}

#qaLabel_Q {
	position: relative;
	float: left;
	clear: left;
	width: 60px;
	height: 28px;
	background: url(/brands/default/images/brButtons/qa_q.jpg) no-repeat;
}

#qaLabel_A {
	position: relative;
	float: left;
	clear: left;
	width: 60px;
	height: 28px;
	background: url(/brands/default/images/brButtons/qa_a.jpg) no-repeat;
}

.faq-content {
	position: relative;
	float: left;
	width: 670px;
	left: 25px;
	line-height: 160%;
}

/** 02.2 e | ABOUT CLAYTON > Our Brands ***/
a.partners {
	border: none;
	text-decoration: underline;
	color: inherit;
}
div.partners {
  clear: both;
  float: right;
  display: block;
  width: 225px;
  padding: 26px 0 0 0;
}
img.partners {
  float: left;
  width: 107px;
  padding: 32px 0 0 0;
}

/** 02.2 f | ABOUT CLAYTON > Partners + Affliates ***/
.about-partners #column-one {
  width: 700px;
}
.about-partners #column-one h3 {
  width: 225px;
}
.about-partners div.partners {
  width: 525px;
}

/************ CALL TO ACTION BUTTONS ************/

#searchJobsBttn {
	position: absolute;
	top: 570px;
	left: 10px;
	width: 208px;
	height: 40px;
	display: none;
}

div.aboutUsCntr {
	margin: 6px 0 6px;
}

div#brandBB {
	width: 100%;
	text-align: center;
}

/************ MULTIPLE STORIES FOR EACH YEAR ************/

.hidden
{
	display: none; 
}

.unhidden
{ 
	display: block; 
}

.npBttns img
{
	position: static;
	margin-left: -6px;
	margin-top: 18px;
}

#event1, #event2
{
	position: relative;
	top: 0; left: 0;
	z-index: 3;
	width: 400px;
}

.lastP
{
	z-index: 90;
	position: relative;
}

