/* ------------------------------------------
   LAYOUT
------------------------------------------- */ 
html, body { margin: 0; padding: 0;font:  12px/150% Arial, Helvetica, sans-serif; color: #b6b5b5; text-align: center; background: url(../images/bg_body.png) #171717; }

#background { margin: 0; background: url(../images/bg_body.jpg) top center no-repeat; }

#top { background: url(../images/bg.png) top right repeat-x; }

#wrapper, #header { width: 940px; margin: 0 auto; text-align: left; position: relative; }

#follow { float: left; width: 200px; height: 29px; background: url(../images/txt_follow.png) left center no-repeat; padding-left: 87px; margin: 30px 0 0 30px; }

#content-wrap { float: left; background: url(../images/bg_wap.jpg) top center no-repeat; padding-top: 0px;  position: relative; }

#nav { float: right; clear: both; text-align: right; }

#header { height: 90px; background: url(../images/bg_header.png) bottom center no-repeat; margin-bottom: 20px; margin-top: 55px;  width: 100%; }

#logo { position: absolute; top: 0px; }

#activework { position: absolute; height: 445px; display: none; background: url(../images/bg_activework.png); width: 980px; top: 190px; left: -20px; overflow: hidden;  }
#work_wrap{ float: left; height: 445px; width: 20000px; position: relative; }

#search { float: left; height: 25px; margin-top: 50px; width: 175px; background: url(../images/bg_search.png); }

#footer { background: url(../images/bg_header.png) bottom center no-repeat; text-align: left; font-size: 11px; padding-top: 15px; }

#zukubot { float: left; width: 340px; margin-top: -220px; }

.content1 { width: 540px; float: right; }
#content { width: 540px; height: 400px; float: right; position: relative; }

.areas { float: left; margin-right: 20px; width: 300px; }

#mywork , #mywork2 { height: 180px; position: absolute; width: 2000px; }
#mywork2 { display: none; }


.loading_div { background: url(../images/loading.gif) center no-repeat;}

#latest_tweet { position: absolute; left: 320px; top: 10px; width: 470px; }
#tweet { color: #fff; }

.tweet { float: left; }

#wrapWork { float: left; margin: 10px 0 0 50px; width: 870px; overflow: hidden; }
.work-wrapper { float: left; width: 870px; }
.active { width: 520px; height: 260px; background-color: #0c0c0c; float: left;  display: inline; }
.screenshot { width: 500px; height: 240px; border: 0; margin: 10px; }
.work_info { float: right; width: 320px; margin-top: 20px;  display: inline; }
	
.link a { color: #323232; }

.pagi_btn { display: none; cursor: pointer; }

.work
{
	position: relative;
    float: left;
	width: 300px;
	height: 180px;
    margin-left: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	display: inline;
	background-color: #0c0c0c;
	overflow: hidden;
}

.work:first-child { margin-left: 0px; !important } 

.thumb, .workhover { width: 280px; height: 160px; margin: 10px; position: absolute; display: none; }
.workhover { top: 180px; background-image: url(../images/img-workoverlay.png);  text-align: center; line-height: 150px; color: #3e8dee; font-size: 12px; }
.update { cursor: pointer; }

#screenshot_tip { display: none; position: absolute; top: 42px; left: 22px; width: 515px; height: 250px; background-image: url(../images/overlay.png); color: #f8f8f8; }
#screenshot_tip h1 {  width: 515px; height: 250px; line-height: 250px; color: #f8f8f8; text-align: center; display: none; }

.tooltip { display: none; position: absolute; top: -20px; left: -2px; }

#contact_wrap { position: absolute; top: -50px; right: 0; width: 320px; background: url(../images/overlay.png); display: none; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; }
#contact_content { margin: 10px; background: url(../images/bg_body.png) top; width: 300px; float: left; display: inline; }

#about-wrap { position: absolute; top: 0; right: 0; width: 560px; background: url(../images/overlay.png);display: none; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; }
#about { margin: 10px; background: #f8f8f8; width: 540px; float: left; display: inline; }

#contact_content h2, #about h2 { color: #fff; font-size: 16px; height: 43px; line-height: 43px; padding-left: 15px; }
#social li , .info_btn { position: relative; }

.tip { display: none; background: url(../images/overlay.png); padding: 5px; position: absolute; top: 50px; left: -600; color: #efefef; width: 100px; font-size: 11px; text-align: left; font-weight: normal; }

.pagi_btn .tip { top: 20px; left: 20px; }
.info_btn .tip { top: -43px; left: 0; }

.btn_send_message  { width: 70px; height: 35px; text-align: center; color: #525252; font-weight: bold; font-size: 15px; background-color: #f8f8f8; border: 1px solid #dfdfdf; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-bottom: 15px; }

#info_nav { background: #111; height: 43px;  margin-top: -3px; padding-right: 15px; color: #fff; }
#info_nav  .info_btn { padding: 0 15px 0 15px; line-height: 43px; display: block; height: 44px; float: right; cursor: pointer; }
#info_nav  .info_btn , #info_nav  #weblink { font-size: 12px !important; } 
.info_active { border-bottom: 1px solid #191919; background-color: #191919; }
.info_box { padding: 15px; background-color: #191919; margin-top: 0; border-left: 1px solid #1e1e1e; border-bottom: 1px solid #1e1e1e; font-size: 11px; }
		
#work_role { display: inline; }

.a_hover { color: #526996; }


#a_about { position: absolute; top: 300px; right: -50px; }

.link_about { cursor: pointer; }

.weblink { display: block; width: 100px; height: 33px; line-height: 33px; text-align: center; color: #f8f8f8; background-color: #0c0c0c;}