body { background-color: #353535; font-family: "Lucida Grande", Helvetica, Arial, sans-serif;}

#boxContactTwitter { width: 100%; height: 380px; background: url(../images/contactBackground.png) repeat-x  bottom; background-color: #42abb2; overflow: hidden;}
#boxContactEmail { width: 100%; height: 380px; background: url(../images/contactBackground.png) repeat-x  bottom; background-color: #42abb2; overflow: hidden; z-index: 1; position: relative;}
#boxContactFacebook { width: 100%; height: 380px; background: url(../images/contactBackground.png) repeat-x  bottom; background-color: #42abb2; overflow: hidden;}
.boxContactStatus { display: none;}

#boxContent { width: 902px; margin: auto; margin-top: 40px;}
#boxHeader { width: 902px; height: 229px; background: url("../images/title.png") no-repeat;}

#boxHeaderText { margin-top: 0px; position: relative;}

.nav { width: 902px; height: 180px; background: url(../images/contactMap.png) no-repeat; position: relative; top: 47px; }
.nav li { display: inline; }
.nav li a:link, .nav li a:visited { position: absolute; top:0; height: 180px; text-indent: -9000px; height: 180px; overflow: hidden; z-index: 10;}

.contactTwitter { width: 162px; height: 180px; left: 100px; position: absolute;}
.contactTwitter a { display: block; width: 162px; background: url(../images/contactMap.png) no-repeat -100px 0px;}
.contactTwitter a:hover, .contactTwitter a:focus { background-position: -100px -180px;}
.nav-contactTwitter { position: absolute; width: 162px; height: 180px; background: url(../images/contactMap.png) no-repeat -100px -180px;}

.contactFacebook { width: 155px; height: 180px; left: 475px; position: absolute; }
.contactFacebook a { display: block; width: 155px; background: url(../images/contactMap.png) no-repeat -475px 0px;}
.contactFacebook a:hover, .contactFacebook a:focus { background-position: -475px -180px;}
.nav-contactFacebook { position: absolute; width: 155px; height: 180px; background: url(../images/contactMap.png) no-repeat -475px -180px;}

.contactEmail { width: 239px; height: 180px; left: 670px; position: absolute;}
.contactEmail a { display: block; width: 239px; background: url(../images/contactMap.png) no-repeat -670px 0px;}
.contactEmail a:hover, .contactEmail a:focus { background-position: -670px -180px;}
.nav-contactEmail { position: absolute; width: 239px; height: 180px; background: url(../images/contactMap.png) no-repeat -670px -180px; }

#contactClose { margin: -20px auto auto auto; position: relative; width: 40px; height: 40px; z-index: 3}
#contactClose a { width: 40px; height: 40px; background: url(../images/contactCloseMap.png) no-repeat 0 0; display: block; overflow: hidden; text-indent: -9000px;}
#contactClose a:hover, #contactClose a:focus { background-position: -40px 0; }

/* FOOTER */
#boxFooter { position: relative; height: 630px; margin-top: 80px; padding-top: 100px; background: url(../images/footerBackground.png) repeat-x top; background-color: #272727;}
#footerContent { width: 875px; margin: auto; font-size: .71em; }
#links a:link, #links a:visited, #resume a:link, #resume a:visited { display: block; height: 28px; background: url(../images/footerListBackground.gif) repeat-x top left; text-decoration: none; color: #7A7A7A }
#links a:hover, #links a:focus, #links a:active, #resume a:hover, #resume a:focus, #resume a:active { color: #fff; background-position: 0 -28px;}

#credits a:link, #credits a:visited { color: #7A7A7A;}
#credits a:hover, #credits a:focus, #credits a:active { color: #FFF; }

.strikeout {text-decoration: line-through; display: block; height: 28px; background: url(../images/footerListBackground.gif) repeat-x top left; color: #7A7A7A; margin-top: 10px; }
#credits .strikeout { text-decoration: line-through; background: none; display: inline; color: #5A5A5A;}
#links { width: 290px; height: 530px; float: left; overflow: hidden; }
#links ul { margin-left: 2px;}
#links h2 { background: url(../images/footerLinksTitle.gif) no-repeat top left; height: 40px; width: 199px; text-indent: -9000px; overflow: hidden;}
#links a { margin-top: 10px; }
#resume { width: 560px; height: 190px; overflow: hidden; float: right;}
#resume a:link, #resume a:visited { background: url(../images/footerListBackgroundLong.gif) repeat-x top left;}
#resume a:hover, #resume a:focus, #resume a:active { background-position: 0 -28px;}
#resume ul { margin-left: 2px; }
#resume h2 { background: url(../images/footerResumeTitle.gif) no-repeat top left; height: 40px; width: 188px; text-indent: -9000px; overflow: hidden; }
#resume a { margin-top: 10px; }
#credits { width: 560px; float: right; margin-top: 30px;}
#credits ul { margin-left: 2px;}
#credits h2 { background: url(../images/footerCreditsTitle.gif) no-repeat top left; height: 40px; width: 213px; text-indent: -9000px; overflow: hidden; }
#credits p { color: #9A9A9A; line-height: 2.2em; font-size: 1em; text-align: justify; float: left; width: 263px;}
#credits p.first { padding-right: 30px;  }

/* #scrollTop { position: relative; left: 690px; width: 183px; height: 25px; overflow: hidden; }
#scrollTop a:link, #scrollTop a:visited { display: block; width: 183px; height: 25px; background: url(../images/footerScrollTopMap.gif); overflow: hidden; text-indent: -9000px;}
#scrollTop a:hover, #scrollTop a:focus, #scrollTop a:active { background-position: 0 -25px;} */

/* CONTACT FORMS - EMAIL, TWITTER, FACEBOOK */
#EmailBox { width: 900px; height: 360px; margin: auto; overflow: hidden; z-index: 3; position: relative;}
#Email { top: 35px; position: relative; width: 739px; height: 244px; margin: auto; background: url(../images/contactEmailInstructions.png) no-repeat; z-index: 1;}
#Email a { top: 240px; position: relative; display: block; text-indent: -9000px; width: 739px; height: 57px; background: url(../images/contactEmailSendMap.png) no-repeat;}

#Email a:hover, #Email a:focus { background-position: 0 -58px; }
#EmailStatus { position: relative; top: -200px; left: 650px; width: 380px; height: 244px; background: url(../images/contactEmailStatus.jpg) no-repeat; margin: auto;}
#EmailComplete { position: relative; top: -350px; left: 750px; width: 488px; height: 121px; background: url(../images/contactEmailComplete.gif) no-repeat; margin: auto;}

input, textarea { font-family: "Lucida Grande", Helvetica, Arial, sans-serif; font-size: .8em; border: none; background-color: #97e3e8; padding: 3px; color: #2a7176;}
#formName { position: absolute; left: 193px; top: 86px; width: 180px;}
#formEmail { position: absolute; top: 208px; left: 30px; width: 300px; }
#formMessage { position: absolute; top: 78px; left: 423px; width: 278px; height: 140px;}

#TwitterBox { display: block; width: 900px; height: 360px; margin: auto; overflow: hidden;}
#TwitterTitle { display: block; width: 320px; height: 57px; margin: auto; background: url(../images/contactTwitterTitle.gif) no-repeat; margin-top: 20px; }

#TwitterSliderBox { width: 480px; overflow: hidden; margin: auto; }
#TwitterSlider { width: 10000px; overflow: hidden;}
.TwitterEntry { background: url(../images/contactTwitterEntry.png) no-repeat; float: left; font-size: 1.4em; line-height: 1.3em; display: block; width: 408px; height: 168px; padding: 15px 20px; color: #444; z-index: 12; margin: 0 15px; }

#TwitterCloud1 { position: static; margin-top: -420px; margin-left: 650px; display: block; width: 150px; height: 177px; background: url(../images/contactTwitterCloud1.png) no-repeat; z-index: 12}
#TwitterCloud2 { margin-top: -200px; margin-left: 140px; display: block; width: 103px; height: 214px; background: url(../images/contactTwitterCloud2.png) no-repeat; z-index: 2;}

#TwitterNavigation { display: block; width: 450px; height: 75px; margin: auto;  }
#TwitterNavigation span { display: block; float: left;}
#TwitterFollow a { display: block; width: 325px; height: 75px; background: url(../images/contactTwitterFollowMap.jpg) no-repeat top left}
#TwitterFollow a:hover, #TwitterFollow a:focus { background: url(../images/contactTwitterFollowMap.jpg) no-repeat 0 -75px; }
#TwitterPrev a { display: block; width: 62px; height: 75px; background: url(../images/contactTwitterPrevMap.jpg) no-repeat }
#TwitterPrev a:hover, #TwitterPrev a:focus { background: url(../images/contactTwitterPrevMap.jpg) no-repeat 0 -75px; }
#TwitterNext a { display: block; width: 63px; height: 75px; background: url(../images/contactTwitterNextMap.jpg) no-repeat }
#TwitterNext a:hover, #TwitterNext a:focus { background: url(../images/contactTwitterNextMap.jpg) no-repeat 0 -75px; }

#boxContactFacebook a {text-indent: -9000px; position: relative; top: 110px; display: block; width: 491px; height: 144px; margin: auto; background: url(../images/contactFacebook.png) no-repeat top left;}
#boxContactFacebook a:hover, #boxContactFacebook a:focus, #boxContactFacebook a:active { background-position: 0 -144px;}
/* PORTFOLIO */
.portfolioLink {display: none;}
#boxPortfolio { margin-left: 7px; height: 200px; position: relative;}
#boxPortfolio ul li { display: block; width: 296px; height: 214px; float: left; background-color: white; overflow: hidden; cursor: pointer; z-index: 9; position: relative;}
.portfolioNav { margin: 5px 0 0 5px; position: absolute; z-index: 12; display: block; font-weight: bold; font-size: .7em; text-align: center; }
.portfolioNav a:link, .portfolioNav a:visited { display: block; float: left; width: 71px; height: 55px; overflow: hidden; background: url(../images/zoomMap.png) top left; color: white; text-decoration: none; text-indent: -9000px; }
.portfolioNav a:hover, .portfolioNav a:focus { background: url(../images/zoomMap.png) 0 -55px; color: #4e0c1f;}

.slider { width: 2000px; display: block; z-index: 7; position: absolute}
.slider img { float: left; overflow: hidden; z-index: 7; }
.border { width: 296px; height: 214px; z-index: 9; display: block; background: url(../images/border.png) no-repeat; position: absolute;}

.description { display: block; position: relative; top: 179px; z-index: 8; text-transform: uppercase; font-family: "Lucida Grande", Helvetica, Arial, sans-serif; font-weight: bold; font-size: .7em; padding: 10px; padding-left: 15px; width: 270px; color: #bf8402; background-color: #ebd01d; clear: both;}

.navNext {display: none;}