* {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
text-underline: none;
color: #fff;
font-size: 13px;
line-height: 1.4em;
}
html {
background: #0d171d url(../i/bottom-bg.jpg);
height: 100%;
}
body {
margin: auto;
background: url(../i/top-bg.jpg) no-repeat center top;
height: 100%;
min-height: 711px;
}
#page {
width: 941px;
margin: auto;
position: relative;
}
/* =header
-----------------------------*/
#header {
height: 100px;
}
#logo {
width: 143px;
height: 70px;
position: absolute;
left: 14px;
top: 17px;
background: url(../i/text-bg.gif) no-repeat 0 -196px;
}
#logo a {
display: block;
height: 100%;
position: relative;
overflow: hidden;
text-indent: -9999px;
}
#scroll {
width: 217px;
height: 35px;
position: absolute;
top: 20px;
right: 7px;
background: url(../i/text-bg.gif) no-repeat -223px -121px;
}
#scroll:hover {
background-position: -168px -202px;
}
#scroll a {
position: relative;
height: 100%;
display: block;
text-indent: -9999px;
overflow: hidden;
}
/* =project viewer
-----------------------------*/
#project {
height: 500px;
}
#projects {
display: none;
}
#screen {
margin-left: 2px;
_margin-left: 10px;
margin-top: 7px;
}
#screen object {
outline: 0;
}
/* =about
-----------------------------*/
#about {
width: 445px;
margin: 22px 18px 16px 10px;
float: left;
}
#about h2 {
background: url(../i/text-bg.gif) no-repeat 0 0;
width: 173px;
height: 20px;
margin-bottom: 17px;
text-indent: -9999px;
}
#about .profile ul {
margin: 5px 0 0;
}
#about .profile li {
background: url(../i/bullet.gif) no-repeat left 6px;
padding-left: 13px;
margin-bottom: 6px;
}
#about .profile li strong {
display: inline-block;
height: 17px;
background: url(../i/inline-left.png) no-repeat left 1px;
}
#about .profile li strong span {
display: inline-block;
height: 17px;
background: url(../i/inline-right.png) no-repeat right 1px;
color: #26280b;
padding: 0 3px;
font-weight: normal;
}
#about .klimatika {
margin-bottom: 16px;
}
#about .lukasz {
position: relative;
margin-bottom: 16px;
}
#about .lukasz h3 {
width: 343px;
height: 19px;
background: url(../i/text-bg.gif) no-repeat 0 -30px;
text-indent: -9999px;
margin-bottom: 18px;
}
#about .lukasz img {
position: absolute;
border: 1px solid #d7e34f;
top: 40px;
}
#about .lukasz .profile {
margin-left: 70px;
}
#about .networks h4, #about .networks li,
#contact .details h4, #contact .details li {
height: 21px;
background-image: url(../i/text-bg.gif);
background-repeat: no-repeat;
float: left;
}
#about .networks {
margin-bottom: 16px;
overflow: hidden;
}
#about .networks h4 {
width: 131px;
background-position: 0 -165px;
text-indent: -9999px;
}
#about .networks li a {
display: block;
text-indent: -9999px;
}
#about .networks li.twitter {
width: 105px;
background-position: -131px -165px;
}
#about .networks li.facebook {
width: 123px;
background-position: -236px -165px;
}
#about .networks li.linkedin {
width: 83px;
background-position: -359px -165px;
}
/* =contact
-----------------------------*/
#contact {
width: 420px;
margin: 23px 18px 0 19px;
float: left;
overflow: hidden;
}
#contact h2 {
background: url(../i/text-bg.gif) no-repeat 0 -59px;
width: 192px;
height: 20px;
margin-bottom: 16px;
text-indent: -9999px;
}
#contact h3 {
text-indent: -9999px;
height: 20px;
width: 367px;
margin-bottom: 20px;
background: url(../i/text-bg.gif) no-repeat 0 -87px;
}
#contact .touch {
margin-bottom: 19px;
}
/* =form
-----------------------------*/
#contact form {
position: relative;
margin-bottom: 12px;
zoom: 1;
overflow: hidden;
}
#contact form input, #contact form textarea {
float: left;
width: 280px;
border: 0;
background-image: url(../i/form-bg.gif);
background-repeat: no-repeat;
padding: 4px 5px 4px 5px;
}
#contact form .error input {
background-position: -300px 0;
}
#contact form .error textarea {
background-position: -300px -40px;
}
#contact form .control {
margin-bottom: 10px;
overflow: hidden;
float: left;
}
#contact form input {
height: 22px;
}
#contact form textarea {
height: 92px;
background-position: 0 -40px;
overflow: auto;
}
#contact form .textarea {
overflow: visible;
}
#contact form button {
width: 98px;
height: 41px;
background: url(../i/text-bg.gif) no-repeat -1px -116px;
border: 0;
text-indent: -9999px;
margin: 11px 0 0 324px;
float: left;
}
#contact form button:hover {
background-position: -110px -116px;
}
#contact form label {
width: 130px;
float: left;
padding-top: 6px;
}
#message {
position: absolute;
width: 160px;
bottom: 21px;
left: 130px;
font-size: 10px;
}
#message.error {
color: #f00;
}
/* =contact details
-----------------------------*/

#contact .details h4 {
width: 125px;
background-position: -172px -251px;
text-indent: -9999px;
}
#contact .details li.email {
background-position: -418px -227px;
padding-left: 31px;
margin-right: 25px;
}
#contact .details li.phone {
background-position: -345px -244px;
padding-left: 24px;
padding-top: 6px;
margin-top: -6px;
}
#contact .details li, #contact .details li * {
font-size: 12px;
}
/* =content
-----------------------------*/
li {
list-style: none;
}
p {
text-align: justify;
}
a {
text-decoration: none;
}