html { height:100%;}
body { height:100%; min-height:534px; position:absolute; top:0;left:0; margin:0;padding:0; width:100%; background-color:#000; font-family:Tahoma, Geneva, sans-serif; color:#CCC; }
div.clear { height: 1px; font-size: 0px; clear: both; overflow: hidden; }

/* HEADER ##########################################################################*/

div#size { display:block; width:990px; height:700px;}
div#container {display:block;  position:absolute; width:100%; min-width:990px; height:634px; top:50%; margin-top:-317px; }
div#top {display:block; width:686px; height:60px; margin:0 0 0 100px;}
div#top a#logo {float:left; width:238px; height:60px; background: url(../images/header.gif) no-repeat left top; overflow:hidden; text-indent:-500px }
ul#menu {float:right; list-style:none; width:448px; height:60px; margin:0; padding:0; }
ul#menu li { float:left; height:60px; margin:0; padding:0;}
ul#menu li#fashion { width:88px;}
ul#menu li#hair-and-beauty { width:132px;}
ul#menu li#personal-work { width:139px;}
ul#menu li#contact { width:89px;}
ul#menu li a { display:block; width:100%; height:100%; background:url(../images/header.gif) no-repeat; overflow:hidden; text-indent:-500px; }
ul#menu li#fashion a { background-position:-238px 0;}
ul#menu li#hair-and-beauty a { background-position:-326px 0;}
ul#menu li#personal-work a { background-position:-458px 0;}
ul#menu li#contact a { background-position:-597px 0;}
ul#menu li#fashion.active a, ul#menu li#fashion a:hover { background-position:-238px -60px;}
ul#menu li#hair-and-beauty.active a, ul#menu li#hair-and-beauty a:hover { background-position:-326px -60px;}
ul#menu li#personal-work.active a, ul#menu li#personal-work a:hover { background-position:-458px -60px;}
ul#menu li#contact.active a, ul#menu li#contact a:hover { background-position:-597px -60px;}

/* LEFT ##########################################################################*/

div#left { position:absolute; width:100px; height:622px; left:0;}
div#left a { display: block; width:100px; height:622px; background: url('../images/left.gif') no-repeat 44px 65px; }

/* CONTENT ##########################################################################*/

div#content { width:85%; height:560px; margin:0 60px 0 100px; background-color:#0a0a0a; border: 1px solid #2f2f2f; overflow:auto;} 

/* ilosc zdjec x 22( borders + margin) + wszystkie dlugosci zdjec + 20(last margin) */

div#gallery.fashion {width:28775px;}  
div#gallery.hair {width:15917px;}  
div#gallery.personal {width:32459px;}  
div#gallery img {float: left; margin-left:20px; margin-top:20px; border:#333 solid 1px;}
div#about { font-size:12px; line-height:18px; padding:40px; }
div#about div.photo { float:left; margin-right:40px; }
div#about div.copy { float:left; }

/* FOOTER ##########################################################################*/

div#footer {width:85%; height:34px; margin:0 60px 0 100px;}

div#footer ul {float:right; list-style:none; width:552px; height:34px; margin:0; padding:0; }
div#footer ul li { float:left; height:34px; margin:0; padding:0;}
div#footer ul li#about { width:62px;}
div#footer ul li#follow { width:104px;}
div#footer ul li#blog { width:47px;}
div#footer ul li#mobile { width:146px;}
div#footer ul li#email { width:193px;}

div#footer ul li a { display:block; width:100%; height:100%; background:url(../images/footer.gif) no-repeat; overflow:hidden; text-indent:-500px; }

div#footer ul li#about a { background-position:0 0;}
div#footer ul li#follow a { background-position:-62px 0;}
div#footer ul li#blog a { background-position:-166px 0;}
div#footer ul li#mobile a { background-position:-213px 0;}
div#footer ul li#email a { background-position:-359px 0;}

div#footer ul li#about.active a, div#footer ul li#about a:hover { background-position:0 -34px;}
div#footer ul li#follow a:hover { background-position:-62px -34px;}
div#footer ul li#blog a:hover { background-position:-166px -34px;}
div#footer ul li#mobile a:hover { background-position:-213px -34px;}
div#footer ul li#email a:hover { background-position:-359px -34px;}