/* Global Styles */
html {
font: 100% arial, sans-serif;
margin: 0;
padding: 0;
}
body  {
font: 100% arial, sans-serif;
color: #525759;
background: #ffffff;
margin: 0;
padding: 0;
}
.clear {
height: 1px;
clear: both;
overflow: hidden;
}
p {
margin: 0 0 1em 0;
padding: 0;
}
form {
margin: 0;
padding: 0;
}
img {
border: none;
}
#pageContainer {
width: 740px;
margin: 100px auto;
position: relative;
font-size: .6em;
}
#portfolioPageContainer {
width: 740px;
margin: 10px auto;
position: relative;
font-size: .6em;
}
em {
color: #fa120c;
font-style: normal;
}
#logo {
height: 90px;
width: 250px;
background: #ffffff url(images/logo.jpg) left top no-repeat;	
}


/* Content Areas */
#contentArea1 {
position: relative;
background: url(images/logo.jpg) left bottom no-repeat;
clear: both;
width: 740px;
}
#contentArea2 {
position: relative;
clear: both;
margin: 20px 0;
}
#contentArea3 {
position: relative;
clear: both;
width: 740px;	
}


/* Splash Styles */
#splashBanner, #splashBanner:visited {
height: 206px;
width: 740px;
display: block;
background: #ffffff url(images/splashBanner.jpg) left top no-repeat;	
}
#splashBanner:hover, #splashBanner:visited:hover {
height: 206px;
width: 740px;
display: block;
background: #ffffff url(images/splashBannerHover.jpg) left top no-repeat;	
}
#loginLink {
margin-left: 257px;	
}


/* Login and Home Styles */
#loginContainer {
width: 250px;
padding: 0 0 0 20px;
float: left;
}
#loginTitle {
font-size: 1.4em;	
}
.loginLabel {
float: left;
color: #fa120c;
font-style: normal;
padding: .5em 0;	
}
.loginInput {
border: 1px solid #525759;
float: right;
}
#loginButton {
float: right;
border: none;
background: #ffffff;
color: #fa120c;
font-size: 1em;
font-weight: bold;
margin: 0;
padding: 0;
}
#loginButton:hover {
float: right;
border: none;
background: #fa120c;
color: #ffffff;
font-size: 1em;
font-weight: bold;
margin: 0;
padding: 0;
cursor: pointer;	
}
#whatWeDo {
height: 80px;
width: 360px;
background: url(images/whatWeDo.jpg) left bottom no-repeat;	
}


/* Banners */
#bannerContent {
padding: 20px;
line-height: 1.1em;	
}
.smallCaps {
font-size: .9em;
color: #ff776d;	
color: #ffffff;
}
#redChairBanner {
width: 740px;
background: #ff1100 url(images/redChair.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#capabilitiesBanner {
width: 740px;
background: #ff1100 url(images/capabilities.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#careersBanner {
width: 740px;
background: #ff1100 url(images/careers.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#categoriesBanner {
width: 740px;
background: #ff1100 url(images/categories.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#clientsBanner {
width: 740px;
background: #ff1100 url(images/clients.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#commendationsBanner {
width: 740px;
background: #ff1100 url(images/commendations.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#communityBanner {
width: 740px;
background: #ff1100 url(images/community.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#contactBanner {
width: 740px;
background: #ff1100 url(images/contact.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#creativesBanner {
width: 740px;
background: #ff1100 url(images/creatives.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}
#eventsBanner {
width: 740px;
background: #ff1100 url(images/events.jpg) right center no-repeat;
color: #ffffff;
min-height: 94px;
}


/* Text Positions */
#topRightText {
width: 350px;
text-align: justify;
line-height: 1.1em;
float: right;
}
#bottomRightText {
width: 350px;
text-align: justify;
line-height: 1.1em;
float: right;	
}
#bottomLeftText {
width: 350px;
text-align: justify;
line-height: 1.1em;
float: left;	
}
#bottomFullText {
text-align: justify;
line-height: 1.1em;
}
#column1 {
float: left;
width: 232px;	
}
#column2 {
float: left;
width: 232px;
margin: 0 20px;	
}
#column3 {
float: right;
width: 232px;	
}


/* Thumb Postitions */
#topRightThumbs {
height: 112px;
width: 360px;
overflow: hidden;
float: right;
}
#topRightThumbs img {
float: left;
margin:  0 0 10px 10px;	
}
#bottomRightThumbs {
height: 110px;
width: 360px;
overflow: hidden;
float: right;	
}
#bottomRightThumbs img {
float: left;
margin:  0 0 10px 10px;	
}
#bottomLeftThumbs {
height: 110px;
width: 360px;
overflow: hidden;
float: left;	
}
#bottomLeftThumbs img {
float: left;
margin:  0 10px 10px 0;	
}
#bottomFullThumbs {
height: 70px;
width: 740px;
overflow: hidden;	
}
#bottomFullThumbs img {
float: left;
margin:  0 6px 10px 5px;	
}


/* Browse Message */
#browseMessage {
text-align: right;
font-size: 1.5em;
font-weight: bold;
color: #fa120c;
}


/* Portfolio */
#pageNav {
float: left;
width: 180px;
height: 400px;
overflow: hidden;	
position: relative;
}
#moveUp {
position: absolute;
top: 0;
right: 0;
height: 20px;
width: 13px;
background: url(images/upArrow.jpg) left top no-repeat;	
cursor: pointer;
z-index: 98;
}
#moveDown {
position: absolute;
bottom: 0;
right: 0;
height: 20px;
width: 13px;
background: url(images/downArrow.jpg) left top no-repeat;
cursor: pointer;
z-index: 99;
}
.listTitle {
position: absolute;
top: 0;
left: 0;
display: block;
background: #ffffff;
z-index: 97;
width: 100%;	
}
.navList {
position: absolute;
top: 1.2em;
left: 0;
list-style: none;
margin: 0 0 0 20px;
padding: 0;
width: 140px;
z-index: 96;
}
.navList a {
color: #fa120c;
text-decoration: none;
line-height: 1.2em;
}
#portfolioImages {
margin: 0 0 0 200px;	
}
#portImgContainer {
height: 350px;
width: 520px;
overflow: hidden;
border: 1px dashed #d1d1d1;	
position: relative;
}
#portImgRow {
height: 350px;
width: 5200px;
position: absolute;
top: 0px;
left: 0px;
}
#portImgRow img {
margin: 0 1px 0 0 0;	
}
#imageNav {
position: absolute;
top: 80px;
right: 20px;
}
#previous {
cursor: pointer;
margin: 0 0 -1px 0;
}
#next {
cursor: pointer;
margin: 0 0 -1px 0;
}


/* Admin */
#adminContainer {
margin: 0 0 0 200px;	
}
.formBox {
border: 1px dashed #d1d1d1;
position: relative;
width: 520px;
float: left;
}
.inputRow {
padding: .5em 1em;	
}
.inputRowFullRight {
padding: .5em 1em;
text-align: right;	
}
label {
float: left;
width: 30%;
}
.textField {
float: right;
width: 60%;
border: 1px solid #d1d1d1;	
}
.textArea {
float: right;
width: 60%;
border: 1px solid #d1d1d1;	
}
.selectBox {
float: right;
width: 60%;
border: 1px solid #d1d1d1;	
}
.selectBoxNoWidth {
float: right;
border: 1px solid #d1d1d1;	
}
.fileUpload {
float: right;
width: 60%;
border: 1px solid #d1d1d1;	
}
.submitButton {
border: 1px solid #d1d1d1;
background: #d1d1d1;
color: #888888;
font: 1.2em arial, sans-serif;
cursor: pointer;
}


/* Other Styles */
.inlineLink, .inlineLink:visited {
color: #fa120c;
text-decoration: none;
}
.inlineLink:hover, .inlineLink:visited:hover {
color: #fa120c;
text-decoration: underline;
}
.backLink, .backLink:visited {
color: #fa120c;
text-decoration: none;
font-weight: bold;
font-size: 1.2em;
cursor: pointer;
margin: 0 0 1em 20px;
position: absolute;
top: -18px;
left: -20px;
}
.backLink:hover, .backLink:visited:hover {
color: #fa120c;
text-decoration: underline;
font-weight: bold;
font-size: 1.2em;
cursor: pointer;
margin: 0 0 1em 20px;
position: absolute;
top: -18px;
left: -20px;
}
.redText {
font-weight: bold;
color: #ff1100;
}


/* Contextual Help */
.labelHelp {
/* background: #d1d1d1 url(images/redChairIcon.jpg) left center no-repeat; */
background: #ffffff;
color: #444444;
font-size: .8em;
font-weight: bold;
padding: 6px 10px 6px 22px;
position: absolute;
top: 0px;
left: 0px;
width: 250px;
z-index: 99;
border: 1px solid #444444;	
}

.staffImageLarge {
position: absolute;
top: 0px;
left: 0px;
width: 300px;
z-index: 99;	
}


#portfolioDetail {
text-align: center;
margin: 20px auto;
}