/* ------------------------------------------
   LAYOUT
------------------------------------------- */ 

@font-face {
font-family: coolvetica;
src: url("../fonts/coolvetica.ttf") format("truetype");
}

html, body { margin: 0; padding: 0; font: 12px/150% Arial; color: #1F1F1F; text-align: center; background: url(../images/bg_body.png); }

#topbar { height: 30px; margin-bottom: 50px;  }
#wrapthework { float: left; overflow: hidden; width: 940px; height: 700px; position: relative; }
#wrapper, #header, .wrap { width: 940px; margin: 0 auto; text-align: left; position: relative; }

#content-wrap { float: left;  position: absolute; top: 0; left: 0; width: 2000px; }

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

#header { padding-bottom: 30px; margin-bottom: 100px; width: 100%; }

#logo { position: absolute; top: 0; left: -10px; }
#shortnav { position: absolute; top: 40px; right: 0; font-size: 14px; }

#activework { position: absolute; height: 650px; display: none; background: url(../images/bg_body.png); width: 967px; top: 140px; left: -17px; z-index: 2001; border-top: 1px solid #dbddde; border-bottom: 1px solid #dbddde; }
#work_wrap{ float: left; height: 555px; width: 20000px; position: relative; }

#footer { font-size: 11px; padding-top: 15px; }

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

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

#worklist{ width: 1420px; position: relative; }
#btn-home{ position: absolute; top: 20px; right: 0; }

#wrapWork { float: left; margin: 10px 0 0 50px; width: 870px; overflow: hidden; }
.work-wrapper { float: left; width: 870px; }
.active { width: 470px; height: 555px; background-color: #dbddde; float: left;  display: inline; }
.screenshot { width: 460px;  border: 0; margin: 5px; }
.work_info { float: right; width: 380px; margin-top: 20px;  display: inline; }
	
.link a { color: #323232; }

.pagi_btn { cursor: pointer; z-index: 2000; }

.work { float: left; width: 460px; height: 270px; margin-bottom: 30px; background-color: #dbddde; margin-left: 20px; display: inline; }

.thumb-container { position: relative; width: 450px; height: 260px;  margin: 5px; overflow: hidden; }

.thumb, .workhover { width: 450px; height: 260px; position: absolute; }
.workhover { top: 180px; background: url(../images/img-workoverlay.png); text-align: center; line-height: 150px; font-size: 18px; font-family: coolvetica; color: #1e1e1e; }
.update { cursor: pointer; }

#contact_wrap { position: absolute; top: -50px; right: 0; z-index: 100; 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; }

#contact_content h2, #about h2 { color: #fff; font-size: 16px; height: 43px; line-height: 43px; padding-left: 15px; }

#btn_send_message  { border: 0; margin-bottom: 15px; }

.link_about, .a_contact { cursor: pointer; }

.weblink { display: block; width: 177px; height: 30px; color: #4A4A4A; }

.services { float: left; width: 230px; }
.services li { list-style-image: url(../images/icon_check.png); padding-left: 30px; height: 40px; line-height: 40px; }
.services .alt { background: url(../images/bg_alt.png); }

p { color: #6e6e6e; margin-top: 30px; }