/* CSS Document */
/* PADC CreativeHUB */

body { margin: 0; background: #0f0f0f url(images/hub-background.jpg) repeat-x top; font-size: 71%; font-family: Tahoma, Arial, Helvetica, sans-serif; color: #FFFFFF; }

#wrapper { background-image: url(images/wrapperbg.jpg); background-repeat: no-repeat; background-position: top center; }

#sitecontainer { margin: 0 auto; width: 974px;}

#maincontainer { display: block; padding: 0; margin: 28px 0 0 0; background-image: url(images/hub-maincontainer-bg.gif); background-repeat:repeat-y; }
#maincontainer #top { width: 974px; height: 6px; font-size: 1px; background-image: url(images/hub-maincontainer-top.gif);}
#maincontainer #bottom { width: 974px; height: 6px; font-size: 1px; background-image: url(images/hub-maincontainer-bottom.gif);}

#inset { margin: 0 6px 0 6px;}
#disclaimer { clear: both; display: block; width: 974px; height: 12px; margin: 0 auto 30px auto; padding: 10px 0 0 0;}
#disclaimer .disclaimerfooter { float:left; width: 77px; height: 12px; }
#disclaimer .sumo { float: right; }
.logo { display: block; float: left; width: 185px; height: 100px; }

#mainnavigation { display: block; width: 954px; height: 27px; padding: 13px 0 0 0; margin-left: 0px; }

#mainnavigation ul { margin: 0; padding: 0; list-style: none; }
#mainnavigation li { display: inline; height: 9px; }
#mainnavigation li.home { width: 29px; margin-right: 168px; }
#mainnavigation li.join { width: 123px; margin-right: 164px; }
#mainnavigation li.subscriber { width: 179px; margin-right: 164px; }
#mainnavigation li.about { width: 110px; }

#generalcontainer h3 { color: white; font-size: 15px; margin: 15px 0; font-weight: normal; font-family:Georgia, "Times New Roman", Times, serif;}
#generalcontainer .pagetitle { margin-bottom: 40px; text-align:center;}

.levelselected { font-weight: bold;}

/* Profile Classes */

#profilecontainer { display: block; padding: 0; overflow:hidden; background-color: #000000; height: 742px; border: 1px solid #4d4d4d; width: 960px;}
#profilecontainer #profileheader { width: 960px; height: 163px; border-bottom: 1px solid #4d4d4d; background-image: url(images/hub-profile-worklist-bg.jpg); background-repeat:no-repeat; }
#profilecontainer #profilesidecolumn { height: 578px; width: 188px; border-right: 1px solid #4d4d4d; float: left; font-size: 90%;}
#profilecontainer #profilecanvas { height: 566px; margin: 5px; width: 759px; border: 1px solid #383838; float: left;}

/* Side Column */

#profilesidecolumn .location { display: block; width: 110px; text-align: center; font-size: 100%; text-transform: uppercase; color: #009bd5; margin: 36px auto 25px auto; font-weight: bold; }
#profilesidecolumn ul { width: 150px; margin: 0 auto; padding: 0; list-style: none; }
#profilesidecolumn li { margin: 0 0 10px 0; padding: 0; list-style: none; text-align: center; }
#profilesidecolumn li a:link,#profilesidecolumn li a:visited { color: #a9a9a9; text-decoration: none;}
#profilesidecolumn li a:hover,#profilesidecolumn li a:active { color: #ffffff; text-decoration: none;}
#profilesidecolumn li a.selected { color: #ffffff; text-decoration: none; font-weight: bold;}

/* Header */
#profilecontainer #profileheader #logoback { padding: 24px 0 0 0; height: 139px;  width: 188px; float: left; text-align: center; }
#profilecontainer #profileheader #logoback .smalllogo { margin-bottom: 40px; }
#profilecontainer #profileheader #namethumbs { float: left; width: 772px; height: 139px; }
#profilecontainer #profileheader #namethumbs #profilename { height: 68px; padding-top: 15px; text-align: center; color: white; font-size: 10px; }
#profilecontainer #profileheader #namethumbs #profilename a { text-decoration: none; color: white; }
#profilecontainer #profileheader #namethumbs #profilename h1 { letter-spacing: 1px; font-size: 22px; font-weight: normal; font-family:Georgia, "Times New Roman", Times, serif; color: #808080; margin: 4px 0 0 0; padding: 0; }

#profilecontainer #profileheader #namethumbs #workthumbs ul { list-style: none; margin: 0 0 0 56px; padding: 0; }
#profilecontainer #profileheader #namethumbs #workthumbs li { display: block; float: left; width: 114px; margin: 0; padding: 0; }
#profilecontainer #profileheader #namethumbs #workthumbs li img { cursor: pointer; }

.hoverhint { border: 1px solid #2e2e2e; padding: 3px; background-color: #000000; color: #cccccc; width: 120px; }
.hoverhinthead { display: none; }

/* text Only */

#profilecontainer #textprofilecanvas { height: 518px; margin: 5px; padding: 24px; width: 711px; border: 1px solid #383838; float: left;}
#profilecontainer #textprofileheader { width: 960px; height: 163px; border-bottom: 1px solid #4d4d4d; }
#profilecontainer #textprofileheader #logoback { padding: 24px 0 0 0; height: 139px;  width: 188px; float: left; text-align: center; }
#profilecontainer #textprofileheader #logoback .smalllogo { margin-bottom: 40px; }
#profilecontainer #textprofileheader #namethumbs { float: left; width: 772px; height: 139px; }
#profilecontainer #textprofileheader #namethumbs #profilename { height: 18px; padding-top: 55px; text-align: center; color: white; font-size: 10px; }
#profilecontainer #textprofileheader #namethumbs #profilename a { text-decoration: none; color: white; }
#profilecontainer #textprofileheader #namethumbs #profilename h1 { letter-spacing: 1px; font-size: 36px; font-weight: normal; font-family:Georgia, "Times New Roman", Times, serif; color: #808080; margin: 4px 0 0 0; padding: 0; }


/* Homepage */

#homeheader { border: 1px solid #4d4d4d; width: 960px; background-color: #151515; height: 107px; }
#homecolumncontainer { position: relative; color: #cccccc; display: block; clear: both; width: 960px; height: 598px; border: 1px solid #4d4d4d; border-top: none;}

#homepage { padding: 18px 0 0 0; display: block; position: absolute; top: 6px; left: 191px; width: 762px; border: 1px solid #333333; height: 567px; }
#homepage #featuredwork { height: 161px; width: 762px; background-image: url(images/hub-home-featured-bg.jpg); background-repeat:no-repeat; }
#homepage #finger { height: 21px;}
#homepage #welcome { text-align: center; height: 158px; }
#homepage #textonly { display: none; }

#homepage #featuredwork #featuretitle { height: 46px; text-align: center; }
#homepage #featuredwork #featuredshelf { margin-left: 107px; height: 115px;}
#homepage #featuredwork #featuredshelf ul { list-style: none; margin: 0; padding: 0; height: 115px; }
#homepage #featuredwork #featuredshelf li { display: block; float: left; width: 114px; margin: 0; padding: 0; }
#homepage #featuredwork #featuredshelf li img { cursor: pointer; }

#homepage #threepromo { height: 240px; background-image:url(images/hub-home-3promo-bg.gif); background-repeat:no-repeat;}
#homepage #threepromo #promo1 { width: 254px; height: 204px; float: left; }
#homepage #threepromo #promo2 { width: 208px; height: 176px; float: left; padding: 28px 23px 0 23px; color: #8b8b8b; }
#homepage #threepromo #promo3 { width: 208px; height: 176px; float: left; padding: 28px 23px 0 23px; color: #8b8b8b; }

#homepage #threepromo #promo1 a.portallogin { display: block; width: 254px; height: 46px; padding: 158px 0 0 0; background-image:url(images/hub-home-portal-bg.jpg); background-repeat:no-repeat; text-decoration: none; }

#homepage #threepromo #promo3 #suckitcopy { padding-left: 55px; width:153px; background-image: url(images/hub-home-promo3-zero.gif); background-position: top left; background-repeat:no-repeat; }
#homepage #threepromo #promo3 #suckitcopy a { color: #92ce4b; text-decoration: none; font-weight: bold; }

#homepage #threepromo #promo2 #eight { padding-left: 75px; width:133px; background-image: url(images/hub-home-3promo-about.gif); background-position: top left; background-repeat:no-repeat; }

#homepage #threepromo #promo2 #eight a { color: white; text-decoration: none; font-weight: bold; }

/* Columns */

#level1 { display: block; position: absolute; top: 6px; left: 6px; width: 146px; height: 551px; border: 1px solid #333333; padding: 17px; }
#level1 a:link,#level1 a:visited { margin: 0 0 10px 0; display: block; padding: 0 0 5px 0; border-bottom: 1px solid #363636; background-image: url(images/hub-step1-bg.gif); background-repeat:no-repeat; background-position: right center; color: #a9a9a9; text-decoration: none;}
#level1 a:hover,#level1 a:active { margin: 0 0 10px 0; display: block; padding: 0 0 5px 0; border-bottom: 1px solid #363636; background-image: url(images/hub-step1-bg.gif); background-repeat:no-repeat; background-position: right center; color: #ffffff; text-decoration: none;}

.colhead { color: #009bd5; font-weight: bold; margin: 0 0 10px 0; display: block; padding: 0 0 5px 0; border-bottom: 1px solid #363636; }

#level2 {visibility:hidden; display: block; position: absolute; top: 6px; left: 191px; width: 146px; height: 551px; border: 1px solid #333333; padding: 17px; }
#level2 a:link,#level2 a:visited { display: block; color: #a9a9a9; text-decoration: none; margin: 0 0 10px 0; padding: 0 0 5px 0; border-bottom: 1px solid #363636; }
#level2 a:hover,#level2 a:active { display: block; color: #ffffff; text-decoration: none; margin: 0 0 10px 0; padding: 0 0 5px 0; border-bottom: 1px solid #363636; }

#level3 { display: block; visibility:hidden; position: absolute; top: 6px; left: 376px; width: 551px; height: 545px; padding: 20px 0 20px 26px; border: 1px solid #333333; position: relative; overflow:auto;}
#level3 .clickthru { display: block; margin: 4px 0 0 0;}
#level3 #counter { position: absolute; top: 20px; right: 29px; width: 37px; height: 51px; background-image: url(images/hub-profile-counter-bg.gif); background-repeat:no-repeat;}
#level3 #counter h1 { font-family: Tahoma, Arial, Helvetica, sans-serif; width: 37px; text-align: center; padding: 0; font-size: 18px; font-weight: bold; color: white; margin: 0; }
#level3 #counter .descriptor { float: left; line-height: 42px; height: 42px; padding-left: 5px; color: #808080; }

#level3 #headblock { height: 70px; }
#level3 #loading { width: 144px; height: 37px; margin: 70px auto 0 auto; }
#level3 h1 { margin: 0; padding: 0; height: 64px; color: #009bd5; font-weight: normal; letter-spacing: 1px; text-transform: capitalize; font-family:Georgia, "Times New Roman", Times, serif; }
#level3 h3 { color: white; text-transform: uppercase; font-size: 12px; font-weight: bold; margin: 0 0 5px 0; padding: 0;}
#level3 .item { color: #808080; width: 230px; height: 130px; float: left; padding: 0 25px 0 0;}
#level3 .item .thumb { width: 80px; height: 80px; cursor: pointer; float: left; margin-right: 20px; }
#level3 .item a { color: white; font-weight: bold; text-decoration: none; display: block;}

#level3sorry { width: 551px; height: 545px; padding: 20px 0 20px 26px; position: absolute; top: 0; left: 0; height:380px; background-image: url(images/hub-home-sorry.jpg); background-repeat:no-repeat;}

/* Text profile and profile page class */

.textprofile { color: #9c9c9c; height: 500px;}
.textprofile .profcol1 { float: left; width: 390px;  padding: 0 50px 0 10px; display: block; height: 500px; margin-right: 49px; text-align: left; border-right: 1px solid #333333;}
.textprofile .profcol1 .textframe { line-height: 17px; overflow:auto; width: 370px; height: 400px; padding-left: 20px;}
.textprofile .profcol2 { float: left; width: 140px; height: 500px; display: block; text-align: left; }
.textprofile .profcol2 a:link,.textprofile .profcol2 a:visited { border: 0; color: #009bd5; text-decoration: none; }
.textprofile .profcol2 a:hover,.textprofile .profcol2 a:active { border: 0; color: #009bd5; text-decoration: underline; }
.textprofile .profcol2 h3 { font-size: 11px; font-weight: bold; color: white; margin: 0 0 10px 0; text-transform: uppercase;}
.textprofile img.title { display: block; margin-bottom: 30px;} 


/* Visual Profile - Info under Enlargement/Reflection */
.noreflect { margin-bottom: 30px; }
.description h4 { margin: 0 0 8px 0; font-size: 100%; color: #ffffff; }
.description { display: block; clear: all; width: 651px; }
.description .info { margin-left: 0px; text-align: center; color: #808080; }
.description .info a.download { text-decoration: none; color: white; display: block; background-image:url(images/download-icon.gif); background-repeat:no-repeat; background-position: center left; padding-left: 19px; width: 140px; text-align: left; margin: 5px auto 0 auto;}
.description .info a.external { text-decoration: none; color: white; display: block; background-image:url(images/link-icon.gif); background-repeat:no-repeat; background-position: center left; padding-left: 19px; width: 170px; text-align: left; margin: 5px auto 0 auto;}




.profilename { display: block; margin: 0; text-align: center; }
.profilename h1 { margin: 5px 0 0 0; color: #009bd5; font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; font-size: 230%; }

.profiledetails { display: block; text-align: center; padding-top: 24px; margin: 0; font-size: 90%; line-height: 120%; }
.profiledetails a:link,.profiledetails a:visited { color: #ffffff; text-decoration: none; margin-right: 15px; }
.profiledetails a:hover,.profiledetails a:active { color: #ffffff; text-decoration: none; margin-right: 15px; }

#maincontainerlist { width: 974px; display: block; padding: 0; margin:0 }

#outerbackground { width: 952px; padding-left: 10px; padding-right: 10px;}




#profilecatlist { font-size: 90%; display: block; float: left; width: 185px; height: 719px; border-right: 1px solid #1f1f1f; background-color: #0a0a0a; padding: 0 0 0 0; }
#profilecatlist .location { display: block; width: 185px; text-align: center; font-size: 100%; text-transform: uppercase; color: #6c6c6c; margin: 0 0 22px 0; font-weight: bold; }
#profilecatlist ul { margin: 0 0 0 0; padding: 0; list-style: none; }
#profilecatlist li { width: 185px; margin: 0 0 15px 0; padding: 0; list-style: none; text-align: center; }
#profilecatlist a:link, #profilecatlist a:visited { color: #a9a9a9; text-decoration: none; }
#profilecatlist a:hover, #profilecatlist a:active { color: #FFFFFF; text-decoration: none; }

.middisplay { display: block; width: 650px; height: 433px; text-align: center;}
.textprofile img.title { display: block; margin-bottom: 30px;} 

#listcontainer { position: relative; color: #cccccc; display: block; clear: both; width: 993px; height: 590px; background-color: #000000; border: 1px solid #515151; }

#generalcontainer { width: 962px;}
#generalcontainer #headersteps { width: 912px; height: 67px; border: 1px solid #4d4d4d; background-color: #151515; padding: 0 24px; }
#generalcontainer #headersteps #signuplogo { float: left; width: 304px; height: 67px; }

#generalcontainer #aboutcontainer { border: 1px solid #4d4d4d; padding: 24px; margin-top: 4px; position:relative;}

#aboutcontainer { display: block; clear: both; width: 912px; padding: 30px 40px 30px 41px; background-color: #000000; border: 1px solid #515151; }
#aboutcontainer #features { width: 608px; float: left; }
#aboutcontainer img.subtitle { display: block; margin: 0 0 30px 0; }
#aboutcontainer #actions {  color: #cccccc; width: 194px; float: left; padding: 0 0 0 110px; }
#aboutcontainer #actions a { color: #ffffff; text-decoration: none; }
#aboutcontainer #actions img.subtitle { display: block; margin-bottom: 20px; }
#aboutcontainer #actions img.subtitle2 { display: block; margin: 50px 0 20px 0; }

#aboutcontainer #features .featureodd { width: 200px; margin: 0 70px 50px 0; padding-left: 69px; float: left; display: block; background-repeat: no-repeat; background-position: top left;  color: #cccccc; }
#aboutcontainer #features .featureeven { width: 200px; margin: 0 0 50px 0; padding-left: 69px; float: left; display: block; background-repeat: no-repeat; background-position: top left;  color: #cccccc; }
#aboutcontainer #features .featureodd img,#aboutcontainer #features .featureeven img { display: block; margin-bottom: 5px; }
#aboutcontainer #features #top5 { background-image: url(images/about-icon-top5.gif); }
#aboutcontainer #features #upload { background-image: url(images/about-icon-upload.gif); }
#aboutcontainer #features #annual { background-image: url(images/about-icon-annual.gif); }
#aboutcontainer #features #multi { background-image: url(images/about-icon-multi.gif); }
#aboutcontainer #features #suckit { background-image: url(images/about-icon-suckit.gif); }
#aboutcontainer #features #unlimited { background-image: url(images/about-icon-unlimited.gif); }
#aboutcontainer #features #visual { background-image: url(images/about-icon-visual.gif); }
#aboutcontainer #features #team { background-image: url(images/about-icon-team.gif); }
#aboutcontainer img.title { display: block; margin-bottom: 60px; }