@CHARSET "UTF-8";

body { background: #f4f4f4; margin: 0; font-family: Tahoma; line-height: 18px; }
ul, ul li { margin: 0; padding: 0; }
.clear { clear: both; }
.flash { background: transparent url('../gfx/flash.gif') 50% 50% no-repeat !important; display: block; }
input, textarea { color: #a7a7a7; font-family: Tahoma; font-size: 12px; }

div#content { width: 909px; overflow-x: hidden; display: block; position: absolute; left: 50%; margin-left: -454px; }
div#content div.left  { width: 154px; text-align: right; float: left; position: fixed; top: 0; }
div#content div.right { width: 692px; display: block; float: right; padding-top: 135px; }

/* lewy blok */
div#content div.left * { float: right; } 
div#content div.left div.logo {  }
  div#content div.left div.logo a { width: 55px; height: 108px; margin-left: 17px; display: block; background: #00b6eb url('../gfx/logo.gif') 17px 67px no-repeat; float: left; }
  div#content div.left div.logo a:hover { color: transparent; }
div#content div.left h1 { width: 143px; height: 38px; margin: 27px 0 18px; background-image: url('../gfx/cap_peha_portfolio.gif'); padding: 0; }
div#content div.left ul#menu { list-style: none; }
  div#content div.left ul#menu li { width: 100%; height: 18px; padding-top: 3px; display: block; }
    div#content div.left ul#menu li a { height: 17px; float: right; display: block; background-image: url('../gfx/menu_btns.gif'); }
    div#content div.left ul#menu li a.about { width: 39px; background-position: -34px -3px; }
    div#content div.left ul#menu li a.logo { width: 29px; margin-top: 3px; background-position: -45px -26px; }
    div#content div.left ul#menu li a.illustration { width: 72px; margin-top: 2px; background-position: 0 -46px; }
    div#content div.left ul#menu li a.others { width: 44px; margin-top: 2px; background-position: -29px -66px; }
    div#content div.left ul#menu li a.contact { width: 51px; margin-top: 1px; background-position: -21px -88px; }
    div#content div.left ul#menu li a:hover.about,
    div#content div.left ul#menu li.active a.about { background-position: -107px -3px; }
    div#content div.left ul#menu li a:hover.logo,
    div#content div.left ul#menu li.active a.logo { background-position: -118px -26px; }
    div#content div.left ul#menu li a:hover.illustration,
    div#content div.left ul#menu li.active a.illustration { height: 14px; background-position: -73px -46px; }
    div#content div.left ul#menu li a:hover.others,
    div#content div.left ul#menu li.active a.others { background-position: -102px -66px; }
    div#content div.left ul#menu li a:hover.contact,
    div#content div.left ul#menu li.active a.contact { background-position: -94px -88px; }

/* prawy blok */
div#content div.right { font-size: 12px; color: #999999; padding-top: 135px; }
  div#content div.right h1 { font-size: 14px; color: #00b6eb; }
  div#content div.right h1.caps { height: 16px; margin: 0; display: block; background: url('../gfx/h1_caps.gif') left bottom no-repeat;}
  div#content div.right h1.about_me   { width: 66px; }
  div#content div.right h1.education  { width: 68px; background-position:  -71px 0; }
  div#content div.right h1.experience { width: 74px; background-position: -143px 0; }
  div#content div.right h1.featured   { width: 59px; background-position: -221px 0; }
  div#content div.right h1.contact    { width: 54px; background-position: -284px 0; }

  div#content div.right img.hello { margin: auto; }

  div#content div.right ul.about-list { display: block; padding-bottom: 20px; list-style: none; }
    div#content div.right ul.about-list li { display: block; }
      div#content div.right ul.about-list li div.l  { width: 116px; float: left; } 
      div#content div.right ul.about-list li div.r { width: 574px; float: right; }
  div#content div.right ul.contact li { margin-bottom: 2px; }
  div#content div.right ul.contact li a { color: #999999; text-decoration: none; font-size: 12px;font-family: Tahoma; }
  div#content div.right ul.contact li a:hover { text-decoration: underline; }
  div#content div.right form#form_contact { margin-top: 25px; }
    div#content div.right form#form_contact input { width: 678px; height: 22px; padding: 8px 7px 0; background: #ffffff; border: 1px solid transparent; margin-bottom: 1px; }
    div#content div.right form#form_contact input.error { border-color: #ff0000; }
    div#content div.right form#form_contact input#contact_email { margin-bottom: 0; }
	div#content div.right form#form_contact textarea { width: 678px; height: 211px; padding: 8px 7px; background: #ffffff; border: 1px solid transparent; margin-bottom: 1px; }
    div#content div.right form#form_contact textarea.error { border-color: #ff0000; }
    div#content div.right form#form_contact button { width: 41px; height: 30px; background: url('../gfx/btn_send.gif'); padding: 0; float: left; border: 0; }
    div#content div.right form#form_contact button:hover { background-position: 0 -30px; }
    div#content div.right form#form_contact div#contact_status { display: block; }
    div#content div.right form#form_contact div#contact_status span { display: block; } 
    div#content div.right form#form_contact div#contact_status span.error { color: #ff0000; }
    div#content div.right form#form_contact div#contact_status span.ok { color: #00cc00; }

/* list prac */ 
  div#content div.right ul.img-list { overflow-y: hidden; }
  div#content div.right ul.img-list li { list-style: none; margin-bottom: 44px; }
  div#content div.right ul.img-list li div { width: 692px; /*height: 337px;*/ height: 60px; background: transparent url('../gfx/loader.gif') 50% 50% no-repeat; margin-bottom: 6px; }
  div#content div.right ul.img-list li span { }

/* pager */
div.pager { float: right; overflow: hidden; }
div.pager a { width: 345px; height: 37px; display: block; background: url('../gfx/pager_btns.gif'); float: right; margin-left: 1px; }
div.pager a.prev { background-position: 0 0; }
div.pager a:hover.prev { background-position: 0 -37px; }
div.pager a.next { background-position: -345px 0; }
div.pager a:hover.next { background-position: -345px -37px; }