body {
font-family: Arial; 
font-style: normal; 
font-weight: normal; 
font-variant: normal; 
line-height: normal; 
text-align: left; 
text-decoration: none; 
color: #000; 
font-size: 13px;
background: url('http://www.design4u.pl/template/gfx/bg.gif') top left #333;
margin: 0;
}

img {
border: 0;
}

/* ######################### ADMIN PANEL ######################### */

#AdminPanel {
display: block;
width: 258px;
height: 138px;
background: url('http://www.design4u.pl/template/gfx/bg_pnl_admin.jpg') top left no-repeat;
margin: 21px 0 0 16px;
padding: 0;
}
#AdminPanel form {
margin: 0;
padding: 0;
}
#AdminPanel .forms {
position: absolute;
display: block;
padding: 0;
margin: 52px 0 0 83px;
}
#AdminPanel .form {
border: 0;
background: #fff;
color: #aaa;
font-size: 13px;
font-weight: normal;
padding: 0;
width: 140px;
height: 16px;
line-height: 16px;
margin: 0 0 8px 0;
}
#AdminPanel .btn_submit {
position: absolute;
display: block;
margin: 102px 0 0 156px;
}
#AdminPanel .btn_submit .button {
width: 76px;
height: 26px;
border: 0;
background: url('http://www.design4u.pl/template/gfx/btn_login.jpg') top left no-repeat;
cursor: pointer;
}
#AdminPanel .btn_submit .button:hover {
background: url('http://www.design4u.pl/template/gfx/btn_login.jpg') bottom left no-repeat;
}

#promocje {
display: block;
width: 258px;
background: url('http://www.design4u.pl/template/gfx/box_promo_m.gif') top left repeat-y;
margin: 21px 0 0 16px;
padding: 0;
}
#promocje p {padding: 4px 15px; margin: 0; color: #fff}

#clients {
display: block;
width: 258px;
height: 496px;
background: url('http://www.design4u.pl/template/gfx/block_zaufali.jpg') top left no-repeat;
margin: 21px 0 0 16px;
padding: 0;
}

/* ######################### RECENT WORKS PANEL ######################### */

#RecentWorks {
display: block;
width: 285px;
background: url('http://www.design4u.pl/template/gfx/bg_pnl_recent2.gif') top left repeat-y;
margin: 21px 0 0 16px;
padding: 0;
}
#RecentWorks .heading {
display: block;
width: 285px;
height: 140px;
background: url('http://www.design4u.pl/template/gfx/bg_pnl_recent.gif') top left no-repeat;
margin: 0 0 -90px 0;
padding: 0;
}
#RecentWorks .ending {
display: block;
width: 285px;
height: 22px;
background: url('http://www.design4u.pl/template/gfx/bg_pnl_recent3.gif') top left no-repeat;
margin: 0;
padding: 0;
}
#RecentWorks .image {
display: block;
width: 228px;
height: 188px;
padding: 0;
margin: 10px 0 0 15px;
text-align: center;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.design4u.pl/template/gfx/recent_box.png', sizingMethod='scale');		/* tło dla IE */
}
html>body #RecentWorks .image {
background: url('http://www.design4u.pl/template/gfx/recent_box.png') top left no-repeat;														/* i dla FF, Opery i Netscape */
}
#RecentWorks .image .screenshot {
display: block;
width: 175;
height: 130;
overflow: hidden;
margin: 26px 0 0 26px;
position: absolute;

filter:alpha(opacity=50);
-moz-opacity:.50;
opacity:.50;
}
#RecentWorks .image .title {
display: block;
width: 200px;
height: 20px;
color: #fe3a3a;
font-size: 13px;
font-weight: normal;
text-align: center;
position: absolute;
margin: 162px 0 0 13px;
text-decoration: none;
}
#RecentWorks a .image {
cursor: pointer;
}
#RecentWorks a {
text-decoration: none;
border: 0;
}
#RecentWorks a:hover .image .title {
color: #ff7365;
text-decoration: none;
}
#RecentWorks a:hover .image .screenshot {
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}



/* ######################### MENU BAR ######################### */

#MenuBar {
display: block;
width: 616px;
height: 40px;
margin: 0 0 0 45px;
padding: 0;
}
#MenuBar a {
display: block;
height: 40px;
margin: 0;
padding: 0;
float: left;
}
#MenuBar a.m1 {
width: 149px;
background: url('http://www.design4u.pl/template/gfx/m_1.gif') top left no-repeat;
}
#MenuBar a.m1:hover {
background: url('http://www.design4u.pl/template/gfx/m_1.gif') bottom left no-repeat;
}
#MenuBar a.m2 {
width: 91px;
background: url('http://www.design4u.pl/template/gfx/m_2.gif') top left no-repeat;
}
#MenuBar a.m2:hover {
background: url('http://www.design4u.pl/template/gfx/m_2.gif') bottom left no-repeat;
}
#MenuBar a.m3 {
width: 106px;
background: url('http://www.design4u.pl/template/gfx/m_3.gif') top left no-repeat;
}
#MenuBar a.m3:hover {
background: url('http://www.design4u.pl/template/gfx/m_3.gif') bottom left no-repeat;
}
#MenuBar a.m4 {
width: 158px;
background: url('http://www.design4u.pl/template/gfx/m_4.gif') top left no-repeat;
}
#MenuBar a.m4:hover {
background: url('http://www.design4u.pl/template/gfx/m_4.gif') bottom left no-repeat;
}
#MenuBar a.m5 {
width: 112px;
background: url('http://www.design4u.pl/template/gfx/m_5.gif') top left no-repeat;
}
#MenuBar a.m5:hover {
background: url('http://www.design4u.pl/template/gfx/m_5.gif') bottom left no-repeat;
}

/* ######################### CONTENTS PANE ######################### */

#Contents {
display: block;
width: 644px;
border: 3px solid #759eb3;
background: #fff;
padding: 0;

margin: 10px 0 15px 23px;
}
#Contents ul, ol {
color: #444;
list-style: none;
padding: 0;
margin-left: 10px;
}
#Contents ul li {
padding-left: 15px;
line-height: 1.5;
background: url('http://www.design4u.pl/template/gfx/p.gif')0px 6px no-repeat;
}
#Contents ul.listing {
display: block;
float: left;
}
#Contents .upLeft {
display: block;
position: absolute;
width: 114px;
height: 117px;
background: url('http://www.design4u.pl/template/gfx/c_upleft.gif') top left no-repeat;
margin: -7px 0 0 -15px;
padding: 0
}
#Contents .upRight {
display: block;
position: absolute;
width: 50px;
height: 50px;
background: url('http://www.design4u.pl/template/gfx/c_upright.gif') top left no-repeat;
margin: -3px 0 0 597px;
padding: 0
}
#Contents .downLeft {
display: block;
position: absolute;
width: 114px;
height: 117px;
background: url('http://www.design4u.pl/template/gfx/c_downleft.gif') top left no-repeat;
margin: -47px 0 0 -3px;
padding: 0
}
#Contents .downRight {
display: block;
position: absolute;
width: 50px;
height: 50px;
background: url('http://www.design4u.pl/template/gfx/c_downright.gif') top left no-repeat;
margin: -47px 0 0 597px;
padding: 0
}
#Contents .textArea {
display: block;
width: 570px;
margin: 40px auto 30px auto;
padding: 0;
}

/* ######################### CONTENTS PANE - text style ######################### */

#Contents h1 {
font-size: 29px;
font-weight: normal;
color: #9d0000;
margin: 0;
padding: 15px 10px;
}
#Contents h2 {
font-size: 20px;
font-weight: normal;
color: #000;
margin: 0;
padding: 10px;
color: #444;
}
#Contents p {
font-size: 13px;
font-weight: normal;
color: #555;
margin: 0;
line-height: 1.5;
padding: 5px 0;
text-indent: 10px;
text-align: justify;
}
#Contents p:first-letter {
font-size: 16px;
font-weight: bold;
}
#Contents a {
color: #0080ff;
text-decoration: none;
}
#Contents a:hover {
text-decoration: underline;
}


/* ######################### CONTENTS PANE - steps style ######################### */

#stepOne, #stepTwo, #stepThree, #stepFour {
display: block;
width: 550px;
height: 160px;
margin: 20px auto;
padding: 0;
}
#stepOne p, #stepTwo p, #stepThree p, #stepFour p {
display: block;
padding: 10px 20px 0 20px;
line-height: 1.2;
color: #9d0000;
}
#stepOne h3, #stepTwo h3, #stepThree h3, #stepFour h3 {
padding: 15px 0 0 20px;
line-height: 1.0;
margin: 0;
color: #444;
font-size: 20px;
font-weight: normal;
}
#stepOne .pic, #stepTwo .pic, #stepThree .pic, #stepFour .pic {
display: block;
position: relative;
float: left;
height: 160px;
margin: 0 20px 0 0;
padding: 0;
width: 135px;
}
#stepOne {
background: url('http://www.design4u.pl/template/gfx/bg_step1.gif') top right no-repeat #e5e5e5;
margin-top: 25px
}
#stepOne .pic {
background: url('http://www.design4u.pl/template/gfx/step1.gif') top left no-repeat;
}
#stepTwo {
background: url('http://www.design4u.pl/template/gfx/bg_step2.gif') top right no-repeat #e5e5e5;
}
#stepTwo .pic {
background: url('http://www.design4u.pl/template/gfx/step2.jpg') top left no-repeat;
}
#stepThree {
background: url('http://www.design4u.pl/template/gfx/bg_step3.gif') top right no-repeat #e5e5e5;
}
#stepThree .pic {
background: url('http://www.design4u.pl/template/gfx/step3.jpg') top left no-repeat;
}
#stepFour {
background: url('http://www.design4u.pl/template/gfx/bg_step4.gif') top right no-repeat #e5e5e5;
}
#stepFour .pic {
background: url('http://www.design4u.pl/template/gfx/step4.jpg') top left no-repeat;
}

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

#footer {
display: block;
width: 100%;
height: 76px;
background: url('http://www.design4u.pl/template/gfx/foot_right.gif') 818px 0px no-repeat;
vertical-align: middle;
}
#footer .text {
display: block;
text-align: center;
color: #888;
font-size: 10px;
padding-top: 20px;
}
#footer .text h1 {
display: block;
font-size: 11px;
color: #888;
font-weight: bold;
margin: 0;
padding: 0;
}
#footer .text a {
color: #9d4444;
text-decoration: none;
}
#footer .text a:hover {
text-decoration: underline;
}



/* ######################### PORTFOLIO ######################### */

#Contents .portfolioWork {
width: 550px;
height: 190px;
display: block;
background: url('http://www.design4u.pl/template/gfx/bg_prtfl.gif') right center no-repeat #fff;
padding: 0;
margin: 0 auto;
}
#Contents .portfolioWork .image {
display: block;
float: left;
width: 228px;
height: 188px;
padding: 0;
margin: 0;
text-align: center;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.design4u.pl/template/gfx/recent_box.png', sizingMethod='scale');		/* tło dla IE */
}
html>body #Contents .portfolioWork .image {
background: url('http://www.design4u.pl/template/gfx/recent_box.png') top left no-repeat;														/* i dla FF, Opery i Netscape */
}
#Contents .portfolioWork .image .screenshot {
display: block;
width: 175;
height: 130;
overflow: hidden;
margin: 26px 0 0 26px;
position: absolute;

filter:alpha(opacity=50);
-moz-opacity:.50;
opacity:.50;
}
#Contents .portfolioWork .image .title {
display: block;
width: 200px;
height: 20px;
color: #fe3a3a;
font-size: 13px;
font-weight: normal;
text-align: center;
position: absolute;
margin: 162px 0 0 13px;
text-decoration: none;
}
#Contents .portfolioWork a .image {
cursor: pointer;
}
#Contents .portfolioWork a:hover {
text-decoration: none;
}
#Contents .portfolioWork a:hover .image .title {
color: #ff7365;
text-decoration: none;
}
#Contents .portfolioWork a:hover .image .screenshot {
filter:alpha(opacity=75);
-moz-opacity:.75;
opacity:.75;
}
#Contents .portfolioWork a:hover .image {
text-decoration: none;
border: 0;
}
#Contents .portfolioWork .text {
display: block;
float: left;
width: 320px;
height: 168px;
padding: 10px 0;
color: #333;
}
#Contents .portfolioWork .text h1 {
font-size: 18px;
margin: 0;
padding: 15px 0 5px 10px;
}



/* ######################### CONTACT FORM ######################### */

#contactForm {
display: block;
width: 570px;
height: 320px;
margin: 30px auto;
padding: 10px 0 10px 0;
background: url('http://www.design4u.pl/template/gfx/contact_bg.jpg') top left no-repeat;
text-align: left;
color: #555;
}
#contactForm h1 {
display: block;
color: #666;
font-size: 26px;
font-weight: normal;
margin: 5px 20px;
padding: 0;
}
#contactForm h2 {
display: block;
color: #fff;
font-size: 20px;
font-weight: normal;
margin: 5px 20px;
padding: 0;
}
#contactForm .form {
padding: 15px;
margin: 0;
}
#contactForm .submit {
display: block;
width: 202px;
height: 52px;
position: absolute;
border: 0;
background: url('http://www.design4u.pl/template/gfx/contact_submit.gif') top left no-repeat;
padding: 0;
margin: 76px 0 0 331px;
cursor: pointer;
}
#contactForm .submit:hover {
background: url('http://www.design4u.pl/template/gfx/contact_submit.gif') bottom left no-repeat;
}
#contactForm .input {
height: 16px;
width: 146px;
margin: 2px;
padding: 2px;
font-size: 12px;
color: #666;
background: url('http://www.design4u.pl/template/gfx/contact_input.gif') top left no-repeat;
border: 0;
}
#contactForm .input2 {
border: 0;
width: 306px;
height: 96px;
margin: 2px;
padding: 2px;
font-size: 12px;
color: #444;
background: url('http://www.design4u.pl/template/gfx/contact_input2.gif') top left no-repeat;
}


/* ######################### PAGES NAVIGATION ######################### */
#Contents .pageNav {
display: block;
width: 320px;
margin: 15px auto;
padding: 0;
clear: both;
height: 30px;
}
#Contents .pageNav .first, #Contents .pageNav .last {
display: block;
float: left;
width: 29px;
height: 17px;
margin: 1px;
padding: 3px 0 0 0;
color: #fff;
background: url('http://www.design4u.pl/template/gfx/nav2.gif') top left no-repeat;
text-align: center;
font-size: 11px;
line-height: 11px;
}
#Contents .pageNav .back, #Contents .pageNav .next {
display: block;
float: left;
width: 79px;
height: 16px;
margin: 1px;
padding: 4px 0 0 0;
color: #fff;
background: url('http://www.design4u.pl/template/gfx/nav1.gif') top left no-repeat;
text-align: center;
font-size: 11px;
line-height: 11px;
}
#Contents .pageNav a.first:hover, #Contents .pageNav a.last:hover {
background-position: bottom left;
text-decoration: none;
}
#Contents .pageNav a.back:hover, #Contents .pageNav a.next:hover {
background-position: bottom left;
text-decoration: none;
}
#Contents .pageNav a.number {
display: block;
float: left;
margin: 1px;
padding: 2px;
border: 1px solid #fff;
color: #7b90b9;
}
#Contents .pageNav b {
display: block;
float: left;
margin: 1px;
padding: 2px;
color: #555;
border: 1px solid #fff;
font-size: 14px;
}


/* ######################### PAGES QUOTES ######################### */
 #quotes .quote {width: 550px; background: url('../gfx/quote_bg.gif') top left repeat-y; padding: 0; margin: 20px auto}
 #quotes .quote .quote_top {width: 550px; height: 35px; background: url('../gfx/quote_top.gif') top left no-repeat; margin: 0 0 10px 0}
 #quotes .quote .quote_btm {width: 550px; height: 35px; background: url('../gfx/quote_btm.gif') top left no-repeat; margin: 10px 0 0 0}
#quotes  .quote p {font-style: italic; font-size: 12px; color: #444; text-align: justify; padding: 5px 20px; margin: 0}
 #quotes .quote p.autor{font-style: normal; font-size: 11px; font-weight: bold; color: #3f3f3f; text-align: right; padding: 5px 20px; line-height: 1.5}
 #quotes .quote p.autor a {font-style: normal; font-size: 11px; font-weight: bold; color: #ff5500; text-decoration: none; border: 0}
 #quotes .quote p.autor a:hover {text-decoration: underline}