@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */


body { background: #000 url(../img/background.jpg) center 130px no-repeat; font-family: 'Lato', Helvetica, Arial, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; padding: 0; }
h1 { font-size: 46px; font-weight: 500; margin-bottom: 10px; text-transform: uppercase; text-align: center; color: #d2d2d2; letter-spacing: 3px; }
h2 { font-size: 24px; font-weight: 300; text-align: center; color: #d2d2d2; }
h3 { font-size: 22px; font-weight: 300; text-align: center; color: #252525; margin-bottom: 40px; padding-bottom: 20px; border-bottom: 1px dotted #c0c0c0; }
h4 { font-size: 18px; font-weight: 700; color: #252525; margin-bottom: 5px; }
p { font-size: 16px; }
a, a:visited { text-decoration: none; color: #494949; }
a:hover { color: #000; }

#header { width: 100%; height: 130px; padding-top: 55px; background: #252525; -webkit-box-shadow: 3px 0 5px #000; -moz-box-shadow: 3px 0 5px #000; box-shadow: 3px 0 5px #000; z-index: 2; position: relative; }
#hobby { color: #a5a5a5; text-align: center; padding: 40px 0; z-index: 2; position: relative; -webkit-box-shadow: 0 0 5px #000; -moz-box-shadow: -3px 0 5px #000; box-shadow: -3px 0 5px #000; }
#hobby h1 { color: #f7f7f7; font-size: 42px; font-weight: 300; text-transform: lowercase; }
#hobby h5 { font-size: 26px; font-weight: 300; margin-top: 60px; color: #c5c5c5; }
#hobby p { line-height: 22px; font-weight: 500; margin: 30px 0; }
#hobby a, #hobby a:visited { text-transform: uppercase; color: #8A8A8A; margin: 0 30px; padding-bottom: 5px; border-bottom: 1px dashed #4B4B4B; }
#hobby a:hover { border-bottom: none; }
#hobby .wrapper { width: 700px; }
#kontakt { background: #fff; width: 100%; padding: 50px 0; text-align: center; z-index: 1; position: relative; }
#kontakt h1 { color: #252525; font-size: 42px; font-weight: 300; margin-bottom: 60px; text-transform: lowercase; }
#kontakt h2 { color: #747474; font-size: 28px; }
#menu { width: 100%; height: 410px; z-index: 1; position: relative; }
#main-nav { margin-top: 185px; text-transform: uppercase; }
#main-nav ul { list-style-type: none; text-align: center; margin: 0; padding: 0; }
#main-nav li { display: inline-block; margin: 0 75px; font-size: 18px; }
#projects, .projects-content { background: #f2f2f2; width: 100%; padding: 50px 0; }
#projects-header, .projects-header { background: #000; height: 105px; padding-top: 45px; position: relative; z-index: 2; -webkit-box-shadow: 0 0 5px #000; -moz-box-shadow: -3px 0 5px #000; box-shadow: -3px 0 5px #000; }
#projects-header h1, .projects-header h1 { color: #f7f7f7; font-size: 42px; font-weight: 300; text-transform: lowercase; }
.half { width: 45%; margin-left: 2%; float: left; }
.half:first-child { margin-left: 0; }
.icon { width: 32px; height: 32px; display: inline-block; margin: 0 5px; }
.icon-css { background: url(../img/icon-css.png) center no-repeat; }
.icon-cms { background: url(../img/icon-cms.png) center no-repeat; }
.icon-html { background: url(../img/icon-html.png) center no-repeat; }
.icon-js { background: url(../img/icon-js.png) center no-repeat; }
.icon-foto { background: url(../img/icon-foto.png) center no-repeat; }
.icon-php { background: url(../img/icon-php.png) center no-repeat; }
.icon-wp { background: url(../img/icon-wp.png) center no-repeat; }
.project { margin-bottom: 80px; height: 300px; }
.projects-list { text-align: center; }
.projects-list a { font-weight: 300; margin-bottom: 20px; display: inline-block; }
.projects-list img { opacity: 0.7; margin-bottom: 20px; }
.projects-list img:hover { opacity: 1; }
.pull-right { float: right; }
.technologies { font-size: 14px; font-weight: 300; }
.wrapper { width: 1180px; margin: 0 auto; }