body { background: #fff url("images/bg.gif") repeat-x; color: #7d7d7d; font: normal 12px/18px Arial, sans-serif; margin: 0px; padding: 0px; overflow-x: hidden; }

html, body { overflow-x:hidden; }

* { margin: 0px; padding: 0px; border: 0px; }

a:link { color: #63afec; text-decoration: none; }

a:visited { color: #63afec; text-decoration: none; }

a:hover { color: #ffc400; text-decoration: none; }

a:active { color: #63afec; text-decoration: none; }

a:hover img { background-color: transparent; } 

h1 { color: #ffc400; font: bold 36px/36px Arial, serif; }

h1 span { font-weight: normal; } 

h2 { color: #000; font: normal 21px/24px Arial, serif; }

h2 span { background-color: #f0f0f0; }

h3 { font: bold 14px/14px Arial, sans-serif; margin: 0px; padding: 0px; }

h4 { font:  normal 11px/14px Arial, sans-serif; text-transform: uppercase; margin-bottom: 6px; }


.clearfloats { clear: both; }

#copyright { margin-top: 300px; padding: 10px; background: #fff; width: 128px; font: normal 10px/10px Arial, sans-serif; text-transform: uppercase; } 



#siteContainer { width: 974px; font: normal 12px/18px Arial, sans-serif; color: #7d7d7d; text-align: left; }

#topArea { width: 974px; padding: 30px 0 50px 46px; }
#logoArea { width: 148px; font: bold 18px/18px Arial, sans-serif; color: #ffc400; float: left; text-transform: lowercase; }
#logoArea a { color: #ffc400; text-decoration: none; } 
#tagArea { width: 826px; font: normal 14px/18px Arial, sans-serif; color: #7D7D7D; float: left; }

#navArea { width: 128px; padding-left: 36px; position: absolute; top: 97px; z-index: 1000; background: transparent; }

.smallArea { background: #fff; width: 128px; padding: 0 10px; }

#navMain { width: 128px; padding: 0 0 56px 0; }
.nav { margin-left: 0; padding-left: 0; list-style: none; font: normal 14px/14px Arial, sans-serif; text-transform: lowercase; font-weight: bold; }
.nav li { margin: 2px 0 0px 0px; padding-left: 0px; }
.nav a:link { font: bold 14px/14px Arial, sans-serif; color: #6db4ed; text-decoration: none; }
.nav a:visited { font: bold 14px/14px Arial, sans-serif; color: #6db4ed; text-decoration: none; }
.nav a:hover { font: bold 14px/14px Arial, sans-serif; color: #ffc400; text-decoration: none; }
.nav a:active { font: bold 14px/14px Arial, sans-serif; color: #6db4ed; text-decoration: none; }
.nav a.current { color: #7D7D7D; }
.nav .header {  font: bold 18px/18px Arial, sans-serif; color: #7D7D7D; }
.subnavMain { width: 126px; padding: 0 0 10px 0; }



#navOtherMain { width: 128px; padding: 0 0 56px 0; }
.navOther { margin-left: 0; padding-left: 0; list-style: none; font: normal 11px/14px Arial, sans-serif; }
.navOther li { margin: 2px 0 0px 0px; padding-left: 0px; padding-bottom: 10px; }
.navOther a:link { font: normal 11px/14px Arial, sans-serif; color: #6db4ed; text-decoration: underline; }
.navOther a:visited { font: normal 11px/14px Arial, sans-serif; color: #6db4ed; text-decoration: underline; }
.navOther a:hover { font: normal 11px/14px Arial, sans-serif; color: #ffc400; text-decoration: underline; }
.navOther a:active { font: normal 11px/14px Arial, sans-serif; color: #6db4ed; text-decoration: underline; }
.navOther a.current { color: #7D7D7D; }
.navOther .header {  font: bold 14px/14px Arial, sans-serif; color: #7D7D7D; padding-bottom: 0px; }

/* HOME PAGE */
#homeBg { width: 100%; height: 100%; position: absolute; }
#homeDesc { width: 375px; color: #ffc400; font: normal 28px/30px Arial, serif; }

.homeNewsMain { width: 300px; padding: 160px 0 10px 0; }
.homeNews { margin-left: 0; padding-left: 0; list-style: none; font: normal 11px/14px Arial, sans-serif; }
.homeNews li { padding-left: 0px; padding-bottom: 15px; }
.homeNews a:link { padding: 7px; font: normal 14px/20px Arial, sans-serif; color: #fff; background: #7D7D7D; text-decoration: none; }
.homeNews a:visited { padding: 7px; font: normal 14px/20px Arial, sans-serif; color: #fff; background: #7D7D7D; text-decoration: none; }
.homeNews a:hover { padding: 7px; font: normal 14px/20px Arial, sans-serif; color: #fff; background: #63afec; text-decoration: none; }
.homeNews a:active { padding: 7px; font: normal 14px/20px Arial, sans-serif; color: #fff; background: #7D7D7D; text-decoration: none; }
.homeNews a.current { padding: 7px; color: #fff; background: #7D7D7D; text-decoration: none; }
.homeNews .header { margin: 0px 0 15px 0px; font: bold 14px/14px Arial, sans-serif; color: #7D7D7D; padding-bottom: 0px; }



#topInfo { position: absolute; top: 20; left: 0; z-index: 900; }
/*#projectName { font: normal 11px/14px Arial, sans-serif; background: #63afec; color: #fff; text-decoration: none; display: inline; width: 150px; white-space: nowrap; padding: 3px; text-transform: uppercase; }*/
#projectName { font: bold 36px/36px Arial, sans-serif; color: #7D7D7D; }
#projectDesc { width: 300px; border: 10px solid #63afec; background: #63afec; font: normal 12px/18px Arial, sans-serif; color: #fff; position: absolute; top: 125px; left: 0px; }
#projectDesc a:link, #projectDesc a:visited, #projectDesc a:active, #projectDesc a:hover { font: bold 14px/14px Arial, sans-serif; color: #fff; text-decoration: none; }
#btnDetails { padding-top: 6px; }
#projectTag { width: 100%; }
.projectMedia { float: left; margin-right: 100px; text-align: center; }
.viewClient { position: relative; top: 300px; z-index: 901; margin-top: -14px; }
.viewClient span { font-weight: normal; } 
.viewClient a:link  { padding: 7px; font: bold 14px/14px Arial, sans-serif; color: #fff; background: #63afec; text-decoration: none; }
.viewClient a:visited  { padding: 7px; font: bold 14px/14px Arial, sans-serif; color: #fff; background: #63afec; text-decoration: none; }
.viewClient a:hover  { padding: 7px; font: bold 14px/14px Arial, sans-serif; color: #fff; background: #63afec; text-decoration: none; }
.viewClient a:active  { padding: 7px; font: bold 14px/14px Arial, sans-serif; color: #fff; background: #63afec; text-decoration: none; }
#btnPrev { margin-right: 5px; }
#btnNext { margin-right: 5px; }

#contentArea { width: 826px; position: absolute; top: 97px; left: 194px; }

.scrollerCont { display: inline; }
.scrollerNav a { width: 78px; background: #eaeaea; font: normal 10px/10px Arial, sans-serif; text-transform: uppercase; display: block; padding: 4px; text-decoration: none; }
.scrollerNav a:hover { background: #63afec; color: #fff; text-decoration: none; }

#scrollerArea { width: 12000px; background: #fff; position: absolute; top: 0; left: 0; z-index: 500; }

/* Clients */
#clientLogos { padding-top: 46px; }
#clientLogos a { margin-right: 40px; }
.clientNew { background: #ffc400; color: #fff; font: normal 10px/14px Arial, sans-serif; text-transform: uppercase; font-weight: bold; }
.clientUpdated { background: #63afec; color: #fff; font: normal 10px/14px Arial, sans-serif; text-transform: uppercase; font-weight: bold; }

/* About Area */
#aboutArea { width: 390px; font: normal 12px/16px Arial, sans-serif; margin-top: 4px; }
#aboutImg { padding-top: 30px; }
#aboutStudio { width: 440px; font: normal 12px/16px Arial, sans-serif; margin-top: 8px; }

/* Staff */
#userArea { margin-top: 66px; }
#userDesc { font: bold 14px/18px Arial, sans-serif; padding: 20px 0 0 10px; }


/* Blog Entry */
#blogArea { width: 726px; position: absolute; top: 97px; left: 194px; }
#blogLeft { width: 500px; padding-right: 40px; float: left; }
#blogRight { width: 160px; float: left; }

.blogEntry { padding-bottom: 25px; margin-bottom: 4px; border-bottom: 1px solid #7D7D7D; }
.blogAuthorArea { padding-bottom: 50px; font: normal 10px/14px Arial, sans-serif; text-transform: uppercase; }

#pagination { text-align: left; clear: both; margin: 0 0 0.5em 0; padding: 0px 0 1em 0; }
#pagination a { border: 1px solid #999; text-decoration: none; background: #fff; }
#pagination a:hover { background: #ffc400; color: #fff; }
#pagination a, #pagination span { padding: 0.3em 0.5em; }
#pagination a.pn { border: 1px solid #fff; }
#pagination a.pn b { font-weight: normal; }
#pagination a.pn:hover { border: 1px solid #999; }
#pagination p { color: #999; }


/*Services */
#serviceArea { width: 746px; margin-top: 60px; }
.serviceContainer { width: 350px; padding-right: 46px; margin-bottom: 40px; float: left; font: normal 12px/16px Arial, sans-serif; }
.service { font: normal 36px/40px Arial, sans-serif; margin-bottom: 4px;  }

/* Contact Area */
#contactArea { width: 390px; font: normal 12px/16px Arial, sans-serif; margin-top: 4px; }


/* Form Properties */

.labelXl { width: 637px; margin-bottom: 8px; }
.labelLg { width: 420px; margin-bottom: 8px; }
.labelSm { width: 203px; float: left; }
.labelMiddle { width: 14px; float: left; }
.inputLg { width: 410px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; }
.inputSm { width: 190px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; }
.selectSm { width: 192px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; }
.selectLg { width: 410px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; }
.textAreaSm { width: 410px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; height: 40px; }
.textAreaLg { width: 410px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; height: 100px; }
.largeTextForm { width: 410px; font: normal 24px/24px Georgia, serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; height: 30px;  }
.formRequired { background-color: #fffbd1; display: inline; }
.formHint { background: #f2f2f2; color: #666; font: normal 10px/12px Arial, sans-serif; }
.inputHelper { font: normal 11px/16px Verdana, sans-serif; font-style: italic; }
.btnDelete { padding: 5px; border: 0; background: #ece9d8; color: #000; font: normal 12px/12px Arial, sans-serif; text-transform: uppercase; }
.btnSubmit { padding: 5px; border: 0; background: #63afec; color: #fff; font: normal 12px/12px Arial, sans-serif; text-transform: uppercase; }
.selectMedia { width: 120px; font: normal 13px/13px Verdana, sans-serif; color: #666; border: 1px solid #7D7D7D; margin: 4px 0; }

.errorArea { background-color: #F1F1F1; color: #333333; padding: 20px; width: 85%; margin-bottom: 20px; font-size: 12px; border: 1px solid #666; }
.errorText { color: #FF0000; text-transform: uppercase; }
.errorArea ul { margin-left: 15px; }

/* Loading */

.loadTopSpace { margin-top: 150px; }
#loadingPage { display: inline; margin-left: 4px; }