@charset "utf-8";
/* CSS Document */

body {
background:#242729 url('/images/repeat.png') repeat-x top center;
/*background:#242729 url("/images/JBNew.jpg") no-repeat scroll center top;*/
margin:0; padding:0; font-family:Tahoma, Verdana; font-size:12px; }

h1{ font-size:18px; color:#FFF; font-family:Tahoma, Verdana; margin:0 0 14px; }
h2{ margin:0; color:#FFF; font-family:Tahoma, Verdana; }
h3{  font-size:18px; color:#000; font-family:Tahoma, Verdana;font-weight:bold; margin:0 0 15px; }

strong{ color:#FA8D01; }
a { text-decoration:none; font-weight:bold; font-size:13px; color:#FFF; }
a:active { color:#FFF; }
a:hover { color:#FA8D01; }

#bodyContainer { width:960px; margin:0 auto; padding:0 0;}

#header { width: 960px; height:122px; display: block; margin: 0 auto; }

/*** BOF SLIDER ***/
#sliderWrap #slider { left: 0; margin-left: auto; margin-right: auto; position: absolute; text-align: center; top: 0; width: 100%; z-index: 99; }
#sliderWrap #slider #sliderContent { background: none repeat scroll 0 0 #fa8d01; color: #FFF; font-weight:bold; font-size:13px; height: 210px;
margin-top:-210px; overflow: hidden; position: relative; width: 100%; z-index: 3; }

#sliderWrap #slider #sliderContent #sliderContainer { font-size: 0.85em; margin: 0 auto; padding-top: 15px; text-align: left; width: 960px; }
#sliderWrap #slider #sliderContent #sliderContainer .contBox { border-left: 1px solid #333333; float: left; padding: 0 15px; min-height:185px; }
#sliderWrap #slider #sliderContent #sliderContainer .contBox .title { color:#242729; }
#sliderWrap #slider #sliderContent #sliderContainer .logo { border-left: 0; width: 180px; }
#sliderWrap #slider #sliderContent #sliderContainer .info { width: 380px; }
#sliderWrap #slider #sliderContent #sliderContainer .form { width: 280px; }
#sliderWrap #slider #sliderContent #sliderContainer .form .errorMessage { color:#CC0000; text-align:center; }
#sliderWrap #slider #sliderContent #sliderContainer .form p { margin:2px 0; min-height:20px; width:100%; display:block; float:left; }
#sliderWrap #slider #sliderContent #sliderContainer .form p label {  }
#sliderWrap #slider #sliderContent #sliderContainer .form p input { float:right; width:150px; }
#sliderWrap #slider #sliderContent #sliderContainer .form p textarea { float:right; width:274px; }
#sliderWrap #slider #sliderContent #sliderContainer .form p #cSubmit { width:280px; }
#sliderWrap #slider #openCloseWrap { height:8px; background:transparent url('/images/contact-bottom.gif') repeat-x top center; }
#sliderWrap #slider #openCloseWrap .contactCont { display: block; margin: 0 auto; width: 960px; }
#sliderWrap #slider #openCloseWrap .contactCont a img { border: 0 none; float: right; margin:0 100px 0 0; }
#sliderWrap #openCloseIdentifier { display: none; }
/*** EOF SLIDER ***/


/*** BOF LOGO ***/
#header .siteLogo { width:50px;	height:48px; margin: 37px 0 0 3px; overflow: hidden; padding: 0; position: relative; float:left; }
#header .siteLogo a { cursor: pointer; display: block; text-indent: -99999px; }
#header .siteLogo span { background: url("../../images/logo-small.gif") no-repeat scroll left top transparent; display: block; width:50px;	height:48px; left: 0; margin: 0; padding: 0; position: absolute; top: 0; z-index: 1; }
/*** EOF LOGO ***/

/*** BOF NAVIGATION ***/
#header #navMenu { background: url("../../images/nav-bg.gif") repeat-x scroll left top transparent; width: 885px; height:30px; margin:49px 5px 0; float: right; font-family:Arial Black, Arial; }
#header #navMenu ul { margin:5px 0 0 0; padding:0; }
#header #navMenu ul li { display:block; float:right; padding:0 11px; }
#header #navMenu ul li.last { padding:0 0 0 11px; }
#header #navMenu ul li a { color:#FFF; }
#header #navMenu ul li a:hover { color:#FA8D01; }
#header #navMenu ul li a.current { color:#FA8D01; }
/*** EOF NAVIGATION ***/

#content { display:block; padding:0 0 50px; width:964px; height:684px; }

/*** BOF PORTFOLIO SLIDER ***/
#content .portMain{ background:#2b2e30; width:930px; height:276px; display: block; margin: 0 auto; padding:10px; }
/*** EOF PORTFOLIO SLIDER ***/


#content .middle_boxes{ position: absolute; width: 950px; height: 440px; margin-left:7px;}
#content .middle_boxes .holding_box{ display: block; float:left; width: 284px; height: 178px; margin: 8px 15px; background:transparent url(/images/holding_box.png) no-repeat top center; }

#content .middle_boxes .skills_boxes{ position:absolute; width: 284px; height: 178px; }
#content .middle_boxes .skills_boxes span{ display: none; }

#content .middle_boxes .scripting_lang{ background:transparent url(/images/languages_box.png) no-repeat top center; }
#content .middle_boxes .html_five{ background:transparent url(/images/html5_box.png) no-repeat top center; }
#content .middle_boxes .jquery{ background:transparent url(/images/jQuery_box.png) no-repeat top center; }
#content .middle_boxes .frameworks{ background:transparent url(/images/frameworks_box.png) no-repeat top center; }
#content .middle_boxes .seo{ background:transparent url(/images/seo_box.png) no-repeat top center; }
#content .middle_boxes .platforms{ background:transparent url(/images/platforms_box.png) no-repeat top center; }

#content .middle_boxes .pos_one{ top: 45px; left: 14px; }
#content .middle_boxes .pos_two{ top: 45px; left: 328px; }
#content .middle_boxes .pos_three{ top: 45px; left: 642px; }
#content .middle_boxes .pos_four{ top: 239px; left: 14px; }
#content .middle_boxes .pos_five{ top: 239px; left: 328px; }
#content .middle_boxes .pos_six{ top: 239px; left: 642px; }


#content .main_content{ padding:50px 0 0 0; color:#6E6E6E; display: block;
    float: left;
    margin-top: 400px; }

#content .main_content .body_content_top{ height:24px; margin:0; padding:0; background:transparent url(/images/content_top.png) top center no-repeat; }
#content .main_content .body_content{  margin:0; padding:5px 20px; background:transparent url(/images/content_middle.png) top center repeat-y; }
#content .main_content .body_content .main_details {  display:block; float:left; width:650px;}
#content .main_content .body_content .main_details p{  margin:0; padding:0 0;  }
#content .main_content .body_content .quick_info{ padding:0 0 0 15px; border-left:4px solid #242729; display:block; float:right; width:250px; }

.tweet ul { margin:15px 0 0 0; padding:0; }
.tweet ul li { display:block; float:right; padding:0 11px 18px; }
.tweet ul li .tweet_time{ display:block; float:left; }
.tweet ul li .tweet_text{ display:block; float:left;}
.tweet ul li a img{ border:0; }

#content .main_content .body_content_bottom{ height:24px;  margin:0; padding:0; background:transparent url(/images/content_bottom.png) bottom center no-repeat; }

.main_image {
    width: 749px;
    height: 276px;
    float: left;
    background: #333;
    position: relative;
    overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
    color: #fff;
}
.main_image h2 {
    font-size: 2em;
    font-weight: normal;
    margin: 0 0 5px;
    padding: 10px;
}
.main_image p {
    font-size: 0.9em;
    line-height: 1.6em;
    padding: 10px;
    margin: 0;
}
.block small { /*--We'll be using this same style on our thumbnail list--*/
    font-size: 1em;
    padding: 0 0 0 20px;
    background: url(icon_calendar.gif) no-repeat 0 center;
}
.main_image .block small {margin-left: 10px;}
.main_image .desc{
    position: absolute;
    bottom: 0;
    left: 0; /*--Stick the desc class to the bottom of our main image container--*/
    width: 100%;
    display: none; /*--Hide description by default, if js is enabled, we will show this--*/
}
.main_image .block{
    width: 100%;
    background: #111;
    border-top: 1px solid #000;
}
.main_image a.collapse { /*--This is our hide/show tab--*/
    background: url(/images/btn_collapse.png) no-repeat left top;
    height: 26px;
    width: 92px;
    text-indent: -99999px;
    position: absolute;
    top: -26px;
    right: 20px;
}
.main_image a.show {background-position: left bottom;}




.image_thumb {
    float: left;
    width: 171px;
    height: 85px;
    margin:0 0 10px 10px;
}
.image_thumb img {
    border:0;
    float: left;
}
.image_thumb ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.image_thumb ul li{
    margin: 0;
    padding: 0;
    width: 171px;
    float: left;
}
.image_thumb ul li.hover { /*--Hover State--*/
    cursor: pointer;
}
.image_thumb ul li.active { /*--Active State--*/
    cursor: default;
}
.image_thumb ul li h2 {
    font-size: 10px;
    color: #FFF;
    margin: 0;
    padding: 0;
    float: right;
}
.image_thumb ul li .block {
    float: left;
    margin: -23px 0 0 0;
    padding: 5px 0 0 0;
    width: 171px; height:18px;
    background: #111;
}
.image_thumb ul li p{display: none;}/*--Hide the description on the list items--*/


#content iframe
{
display:none;
}

#footer{ height:151px; width:100%; background:transparent url(/images/footer-bg.jpg) repeat-x top center; margin:10px 0 0 0; }

#footer #container{ width:905px; display:block; padding:25px 0 0; margin:0 auto; }

/*** BOF LOGO ***/
#footer .siteLogoOrange { width:50px;	height:58px; margin: 0; padding: 0; overflow: hidden; }
#footer .siteLogoOrange a { cursor: pointer; display: block; text-indent: -99999px; }
#footer .siteLogoOrange span { background: url("../../images/jb_orange.gif") no-repeat scroll left top transparent; display: block; width:50px;	height:48px; left: 0; margin: 0; padding: 0; top: 0; z-index: 1; }
/*** EOF LOGO ***/


#footer #container #copyright{ display: block; float: left; }
#footer #container #copyright .copyright{ color:#FFF; font-weight:bold; font-size:12px; margin:0; padding:0; }
#footer #container #copyright .additional{ color:#242729; font-weight:bold; font-size:10px; }


#footer #container #networking{ display: block; float: right; }
#footer #container #networking{ display: block; float: right; }
#footer #container #networking{ display: block; float: right; }

#footer #container #networking ul { margin:15px 0 0 0; padding:0; }
#footer #container #networking ul li { display:block; float:right; padding:0 11px; }
#footer #container #networking ul li a img{ border:0; }