/*********************** MAIN STYLES **********************/

#mainContent {position:relative; width:100%;}
.mainContentTop {position:relative; width:100%; height:23px; background:url(../img/body_top.png) no-repeat center top;}
.mainContentBg {position:relative; width:100%; background:url(../img/body.png) repeat-y center top; padding-bottom:40px;}

.mainContentBg h2 {width:254px; display:block; padding-top:52px; overflow:hidden; height:0px !important; height /**/:52px; margin:0 0 10px 25px;}
.mainContentBg h2.aboutMe {background:url(../img/about_me.png) no-repeat;}
.mainContentBg h2.employment {background:url(../img/employment.png) no-repeat;}
.mainContentBg h2.skills {background:url(../img/skills.png) no-repeat;}
.mainContentBg h2.portfolio {background:url(../img/featured.png) no-repeat;}
.mainContentBg h2.projects {background:url(../img/projects.png) no-repeat;}


.mainContentBg p {color:#fff; font-size:12px; font-weight:normal; line-height:16px; margin:0 80px 15px 80px;}

.mainContentBg img.profilePic {float:right; display:inline; margin:0 65px 0 15px;}

.mainContentBg a.downloadCV {float:right; display:inline; width:211px; padding-top:151px; overflow:hidden; height:0px !important; height /**/:151px; background:url(../img/paper.png) no-repeat left 0; margin:0 65px 0 15px;}
.mainContentBg a.downloadCV:hover {background-position:left -151px;}

.mainContentBg .jobRole {position:relative; width:530px; margin:0 0 20px 70px; float:left; display:inline;}
.mainContentBg .jobRole ul {list-style:none;}
.mainContentBg .jobRole ul li {float:left; display:inline; color:#fff; font-size:14px; padding-left:10px; margin-bottom:10px;}
.mainContentBg .jobRole ul li strong {padding-right:10px; font-weight:bold;}

.mainContentBg .jobRole p {clear:both; color:#2b2b2b; font-size:10px; font-weight:normal; line-height:16px; margin:0; width:auto; font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; margin-left:10px;}
.mainContentBg .jobRole p strong {color:#6b6a6a; float:left; width:80px;}
.mainContentBg .jobRole p span {float:left;}
.mainContentBg .jobRole a {color:#ecc100; font-size:10px; font-weight:normal; text-transform:uppercase; text-decoration:underline;}
.mainContentBg .jobRole a:hover {text-decoration:none;}

.mainContentBg .skillsContainer {position:relative; width:740px; margin-left:80px;}
.mainContentBg .skillsContainer ul {list-style:none; float:left; display:inline; width:350px; padding-right:20px;}
.mainContentBg .skillsContainer ul li {color:#fff; font-size:12px; padding-left:30px; margin-bottom:10px; background:url(../img/bullet.png) no-repeat left 0; line-height:24px;}

.mainContentBg .skillsContainer ul li a {color:#fff; font-size:12px; font-family:Tahoma, Geneva, sans-serif; color:#6b6a6a;text-decoration:underline;}
.mainContentBg .skillsContainer ul li a:hover {color:#deb500; text-decoration:none;}






/*** MENU ***/

.menu {position:relative; width:900px; height:321px; margin-bottom:20px;}

.menu #twitter_div {position:absolute; top:48px; left:83px; z-index:25;}
.menu #twitter_div ul {list-style:none;}
.menu #twitter_div ul li {color:#232323; font-size:11px; font-weight:normal;}
.menu #twitter_div ul li a {color:#fff; margin-left:3px; font-size:11px; font-weight:normal; text-decoration:none;}
.menu #twitter_div ul li a:hover {text-decoration:underline;}

.menu .nav {position:relative; width:301px; height:250px; padding-top:71px; float:left; display:inline; background:url(../img/menu_bg.png) no-repeat;}

.menu .nav .panel {width:262px; margin-left:39px; height:75px;}
.menu .nav .panel.skills {height:74px;}
.menu .nav .panel.portfolio {height:76px;}

.menu .nav .panel a {width:100%; display:block; padding-top:75px; overflow:hidden; height:0px !important; height /**/:75px; background-repeat:no-repeat; background-position:left top;}
.menu .nav .panel.skills a {padding-top:74px; height /**/:74px;}
.menu .nav .panel.portfolio a {padding-top:76px; height /**/:76px;}

.menu .nav .panel.about:hover a {background-image:url(../img/about_on.png);}
.menu .nav .panel.skills:hover a {background-image:url(../img/skills_on.png);}
.menu .nav .panel.portfolio:hover a {background-image:url(../img/port_on.png);}

.menu .nav .panel .profile {position:absolute; top:0; left:301px; width:599px; height:321px; background:url(../img/menu_img.png) no-repeat left 0; display:none; z-index:10;}
.menu .nav .panel.about .profile {display:block;}
.menu .nav .panel.about:hover .profile {background-position:left -321px; z-index:20; display:block;}
.menu .nav .panel.skills:hover .profile {background-position:left -642px; z-index:20; display:block;}
.menu .nav .panel.portfolio:hover .profile {background-position:left -963px; z-index:20; display:block;}

/*** GALLERY ***/

.gallery {position:relative; width:712px; height:198px; padding-top:8px; background:url(../img/gallery_mid.png) repeat-x left top; margin:0 auto;}
.gallery .left {position:absolute; width:55px; height:100%; left:-55px; top:0; background:url(../img/gallery_left.png) no-repeat;}
.gallery .right {position:absolute; width:55px; height:100%; right:-55px; top:0; background:url(../img/gallery_right.png) no-repeat;}

.gallery .placeholder {float:left; display:inline; width:483px; height:136px; margin:5px 0 0 -8px; z-index:10; position:relative;}
.gallery .placeholder img {border:none;}
.gallery .websiteLink {float:left; display:inline; width:220px; padding-top:41px; margin-left:16px;}

.gallery .websiteLink h3 {color:#2b2b2b; font-weight:bold; font-size:24px; font-family:Arial, Helvetica, sans-serif;}
.gallery .websiteLink p, .gallery .websiteLink a {color:#fff; font-weight:normal; font-size:24px; text-decoration:none; margin:5px 0 0 0; line-height:24px;font-family:Arial, Helvetica, sans-serif;}
.gallery .websiteLink a:hover {color:#f6c900;}



.gallery p.info {position:absolute; bottom:25px; left:-1px; margin:0; font-size:10px; font-family:Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase;}
.gallery p.info strong {float:left; padding:0 20px 0 3px;}
.gallery p.info span {float:left; color:#2b2b2b;}