/****************
Site-wide settings 
*****************/
* {
font-family: "Verdana", "Arial", "Trebuchet MS", "Verdana", sans-serif;
}

a {
text-decoration: none;
}

/**********************
High-level structure 
***********************/
body {
margin: 0px;
padding: 0px;
width: 100%;
}

#letterbox {
position: relative;
margin: 15px auto 0px auto;
background-color: transparent;
}

/**********
Bubbles
***********/
/* All bubbles share these properties */
.bubble {
position: relative;
width: 100%;
background: url(/gr/bubbleLeftSlice.gif) top left repeat-y;
}

/* Bubbles have this as a primary container which does NOT contain the bubble borders */
.bubbleContent {
position: relative;
margin: 0px auto 0px auto;
padding: 15px 0px 15px 0px;
}

#imageBubble {
margin-top: 0px;
margin-bottom: 20px;
}

#contactBubble {
height: 111px;
}

#clientBubble {
height: auto;
padding: 0px 0px 10px 0px;
text-align: center;
font-size: 11pt;
}

#descriptionBubble {
height: auto;
}

#stockBubble {
padding: 0px;
height: 111px;
line-height: 111px;
font-size: 15px;
}

#notesBubble {
position: absolute;
z-index: 10;
}

#footerBubble {
height: auto;
text-align: center;
font-size: 10pt;
}

/**********
Bubble outline & borders
***********/
.bubbleTop {
position: absolute;
top: 0px;
left: 0px;
width: 788px;
height: 56px;
z-index: 5;
}

.bubbleBottom {
position: absolute;
bottom: 0px;
left: 0px;
width: 788px;
height: 55px;
z-index: 5;
}

/**********
Banner bubble content
***********/
#wpjBlurb {
width: 100%;
margin: 10px 0px 25px 0px;
text-align: center;
font-size: 15pt;
}

#wpjBlurb a {
padding: 0px 4px;
}

#bannerBubble {
z-index: 10;  /* This and the z-index on #bannerBubbleContent are strictly to workaround stupid IE z-index bug on dropdown menu */	
}

#bannerBubbleContent {
position: relative;
font-size: 20pt;
z-index: 10;
}

#bannerContainer {
position: relative;
width: 720px;
margin: 0px auto 10px auto; /* Center */
}

#bannerCenter {
float: left;
width: 80px;
height: 100px;
margin: 0px 10px;
}

#bannerLeftContainer {
float: left;
width: 310px;
}

#bannerLeft {
width: 310px;
height: 50px;
display: block;
}

#bannerRightContainer {
float: left;
width: 310px;
}

#bannerRight {
position: relative;
left: 0px;
width: 310px;
height: 50px;
}

.contactEmail {
float: right;
font-size: 16pt;
margin-top: 8px;
margin-right: 5px;
padding: 0px 15px;
}

.contactPhone {
float: left;
font-size: 15pt;
margin-top: 4px;
margin-bottom: 20px;
margin-left: 23px;	
}

#notesBubbleText {
font-size: 11pt;
margin: 20px;
line-height: 1.3em;
text-align: justify;	
}

h1 {
font-size: 16pt;
font-weight: 500;
line-height: 1.3em;
text-align: center;
}

h2 {
font-size: 14pt;
font-weight: 400;
line-height: 1.4em;
text-align: center;
}

/**************
Image bubble content
***************/
#leftImage {
position: absolute;
left: 9px;
top: 0px;
width: 218px;
height: 100%;
z-index: 2;
}

#rightImage {
position: absolute;
left: 227px;
top: 0px;
width: 561px;
height: 100%;
z-index: 1;
border: none;
}

/************
Thumbnails
************/
.thumbWrapper {
position: absolute;
margin: 0px;
padding: 0px;
width: 44px;
height: 44px;
}

a.thumb {
position: absolute;
margin: 0px;
padding: 0px;
width: 44px;
height: 44px;
}

img.thumb {
position: absolute;
margin: 0px;
padding: 0px;
width: 44px;
height: 44px;
border: none;
cursor: pointer;
}

.dimmed {
filter: alpha(opacity=40);
opacity: .40;
}

#thumbGridPortfolioWrapper {
position: absolute;
left: 15px;
width: 203px;	
}

#thumbGridPortfolioName {
position: relative;
text-align: center;
font-size: 2em;	
}

/**********
Contact zone
***********/
#contactDetails {
position: relative;
text-align: center;	
font-size: 26px;
z-index: 3;
}

/**********
Description bubble
***********/
#descriptionDetails {
position: relative;
padding: 10px 50px 10px 50px;
margin-bottom: 1em;
text-align: justify;
font-size: 11pt;
z-index: 6;	
}

.textAnchor {
padding: 0px 2px;
}

/**********
Client bubble
**********/
#clientTitle {
margin-top: 10px;
font-size: 11pt;
}

#clientListDetails {
padding: 0px 30px 0px 30px;
}

.clientListLine {
display: block;
margin: 0.5em 3em 0 3em;	
}

#testimonialDetails {
padding: 10px 30px 0px 30px;
margin-bottom: 1em;
text-align: justify;
font-size: 11pt;		
}

.testimonialText {
display: block;
margin: 1em 3em 0 3em;
font-size: 10pt;	
font-style: oblique;
}

.testimonialClient {
display: block;
text-indent: 3em;
font-size: 10pt;	
font-weight: bold;	
}

/**********
Stock
***********/
#stockDetails {
position: relative;
margin: 20px 0px;
/*text-align: center;*/
font-size: 12pt;
line-height: 35px;
z-index: 6;	
}

/**********
Footer bubble
***********/
#footerBubbleContent {
background: url(/gr/bgLogo.gif) no-repeat center 50%;	
z-index: 6;
}

#footerLogo {
display: block;
margin: 0px auto 0px auto;
padding: 10px 0px 10px 0px;
}

#footerCopyright {
margin: 10px 0px;
padding-bottom: 4px;
font-size: 10pt;
text-align: center;
}

#trailer {
position: relative;
width: 10px;
}

/**********
Errors
***********/
.errorContainer {
position: absolute;
top: 200px;
left: 0px;
width: 100%;
text-align: center;
font-size: 20pt;
}

/***********
Rounded corners
************/
.rounded,
.contactEmail {
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 12px;
}

.textAnchor {
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
}