/* -------------------------------------------------------
   * Filename		screen.css
   * Updated		2010-04-28
   * Author     	Dariusz Pobożniak
   * Website		http://pobozniak.pl
   * Description 	CSS Document main default file
   ----------------------------------------------------- */


body {
    background: #bebebe;
    color: #4c4c4c;
    font: normal 62.5%/170% Verdana, Arial, Helvetica, sans-serif;
}

a { text-decoration: none; }
a:hover { text-decoration: underline; }
p { margin: 1em 0; }
em { font-style: italic; }
strong { font-weight: bold; }

/* BORDER RADIUS */
#wrapper,
#topnav, #logged, #loginform,
#searchform, #sidenav, #sidenav li, #filterform fieldset,
.content, .inner, #loginform .input,
.pricebox, #buyform, #buyform button, .btn1, .btn2, .productview .img, .recomlist a, #prodbox .img, .breadcrumb p, .alertbox,
.handiform fieldset, .fancybox, .gallery-box a,
#basketbox, #sidebar dl {
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}
#header, #prodkindlist {
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
}
#footer {
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px; 
}
#prodkindlist li:first-child, #prodkindlist li:first-child span {
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
}

/* COLORS */
a, button { color: #4c4c4c; }
#topnav a, #sidenav a, #basketbox, #basketbox a, #buyform, #buyform h3 { color: #fff; }
#topnav a:hover, #sidenav a:hover, #basketbox a:hover { color: #bebebe; text-decoration: none; }
#footer, #footer a { color: #9c9c9c; }
#sidebar dt { color: #696969; }

/* BACKGROUNDS */
#basketbox, #buyform, #logged, #loginform, #topnav, #searchform, #sidenav li, .content, #sidebar dl { 
    background-image: url(../gfx/gradient1.png); 
    background-position: 0 0;
    background-repeat: repeat-x; 
}
.pricebox, .breadcrumb p, #buyform button, .btn1, .btn2, #filterform fieldset {
    background-image: url(../gfx/gradient2.png); 
    background-position: 0 0;
    background-repeat: repeat-x;
}
#logged, #loginform, .content, #searchform, #sidebar dl, .breadcrumb p, #prodkindlist .active, #prodkindlist li:hover, .alertbox,
.textwrapper .delivery th, #buyform button, .btn1, .btn2, #filterform fieldset { 
    background-color: #bebebe; 
}
#basketbox h3, #basketbox p, #sidebar dt,
#sidenav .subnav li a, #sidebar .more, #sidebar .less, #filterform .more, #filterform .less, #filterform h3,
#buyform p, #buyform table, #buyform th { 
    background: url(../gfx/borderHor.png) 0 100% repeat-x; 
}
#topnav li, .productview .pricebox .price, #loginform fieldset {
    background: url(../gfx/borderVer.png) 100% 0 repeat-y;
}
#sidenav .subnav li a, #menubar .more, #topnav li, #sidebar .more, #sidebar .less, #filterform .more, #filterform .less { 
    background-position: 0 0; 
}
.inner { float: left; background: #fff; width: 600px; }
#footer { background: #eaeaea; }



/* STRUCTURE
 ---------------------------------------------------------------------------- */
#wrapper { background: #fff; font-size: 1.2em; margin: 8px auto; position: relative; width: 960px; }
#header { height: 305px; padding: 5px; }
#menubar, #sidebar { display: inline; float: left; margin: 35px 5px 0; width: 160px; }
#content { float: left; margin-top: 35px; width: 620px; }
#footer { clear: both; float: left; margin-top: 40px; width: 100%; }
#wrapper:after, #header:after, #footer:after, .content:after, .inner:after, .gallery-box:after {
    content: "."; display: block; font-size: 0; 
    height: 0; clear: both; visibility: hidden; 
}


/* HEADER
 ---------------------------------------------------------------------------- */
h1 { clear: both; height: 205px; overflow: hidden; text-indent: -99999px; }
h1 a { display: block; height: 100%; width: 100%; }
#logged, #loginform { float: left; width: 100%; }
#logged dl, #loginform fieldset { float: left; height: 50px; padding: 0 10px 8px 25px; width: 450px; }
/* #loginform fieldset { width: 450px; } */
#loginform p { float: left; margin: 4px 0 0; width: 180px }
#loginform label { font-size: 90%; display: block; margin-bottom: .2em; }
#loginform .input { background: #fff; padding: .2em; width: 170px; }
#logged dt { font-size: 90%; margin-top: 8px; }
#logged dd { font-size: 120%; font-weight: bold; }
#topnav li, #logged li, #loginform li { float: left; }
#logged ul, #loginform ul { display: inline; float: right; margin-right: 15px; }
#logged li, #loginform li { line-height: 50px; padding: 0 10px; }
#logged li a, #loginform li a, #loginform .login { padding-left: 23px; }
#header .edit     { background: url(../gfx/ico_user_edit.png) 0 50% no-repeat; }
#header .history  { background: url(../gfx/ico_clock.png) 0 50% no-repeat; }
#header .logout   { background: url(../gfx/ico_cancel.png) 0 50% no-repeat; }
#header .login    { background: url(../gfx/ico_key_go.png) 0 50% no-repeat; margin-top: 20px; }
#header .newpass  { background: url(../gfx/ico_help.png) 0 50% no-repeat; }
#header .register { background: url(../gfx/ico_user_add.png) 0 50% no-repeat; }
#header .login { cursor: pointer; float: left; margin: 15px 0 0 10px; }
#topnav { float: left; overflow: hidden; }
#topnav li { line-height: 50px; margin-left: -2px; text-align: center; width: 192px; }
#topnav li a { display: block; height: 100%; width: 100%; }
#topnav li, h3, #sidebar dt, #sidenav a { font-size: 120%; text-shadow: 1px 1px 1px rgba(0,0,0,0.4); }



/* MENUBAR
 ---------------------------------------------------------------------------- */
#searchform, h2 { padding: 8px 8px 16px; }
#searchform fieldset { background: #fff; border: 1px solid #adadaf; }
#searchform input { border: 0 none; float: left; padding: .3em .3em .2em; width: 110px; }
#searchform button {
    background: #fff url(../gfx/ico_zoom.gif) 50% 50% no-repeat;
    border: 0 none;
    cursor: pointer;
    float: right;
    height: 22px;
    overflow: hidden;
    text-indent: -999em;
    width: 22px;
}
#sidenav, .inner, #topnav { margin-top: -8px; }
#sidenav { color: #696969; }
#sidenav > li { margin-bottom: 5px; }
#sidenav li { height: 1%; position: relative; }
#sidenav li:first-child { border-top: 0 none; }
#sidenav a { display: block; margin: 0 10px; padding: .7em 0; }
#sidenav .active { font-weight: bold; }
#sidenav .subnav { margin: 0 10px; padding-bottom: .8em; }
#sidenav .subnav li { background: none; }
#sidenav .subnav li a { background: none; font-size: 100%; height: 1%; text-shadow: none; }
#sidenav .subnav li a, #menubar .more {  margin: 0; }
#filterform fieldset { padding-bottom: .6em; position: relative; }
#filterform fieldset p { margin: .2em 10px; }
#filterform fieldset label { margin-left: 3px; }
#menubar .clear {
    background: url(../gfx/bgClearFilter.gif) 0 0 no-repeat;
    cursor: pointer;
    display: block;
    height: 8px;
    overflow: hidden;
    position: absolute;
    right: 6px;
    text-indent: -9999px;
    top: 8px;
    width: 7px;
}


/* SIDEBAR
 ---------------------------------------------------------------------------- */
#basketbox, #buyform { padding: 10px 10px 0; }
#basketbox h3, #buyform h3 { margin: 0; padding-bottom: .7em; }
#basketbox p, #basketbox ul { margin: 0; padding: 15px 0; }
#basketbox .price { font-size: 150%; }
#basketbox .action { border-bottom: 0 none; padding: 10px 0; }
#basketbox a { display: block; margin: 4px 0; }
#basketbox .show, #basketbox .empty { font-size: 90%; padding: .2em 22px; }
#basketbox .show { background: url(../gfx/ico_cart.png) 0 50% no-repeat; }
#basketbox .empty { background: url(../gfx/ico_cart_delete.png) 0 50% no-repeat; }
#basketbox, #sidebar .adv, #sidebar dl, #sidenav, #filterform fieldset { margin-bottom: 5px; }
#basketbox ul { padding: 11px 0; }
#basketbox ul li { padding: 4px 0; }
#sidebar .adv, #sidebar img { display: block; }
#sidebar dl { padding-bottom: 6px; }
#sidebar dt, #filterform h3 { margin-bottom: 6px; padding: 7px; }
#sidebar dd { padding: 6px 12px; }
#sidebar .sidebox p { margin: 5px 0; }
#sidebar .more, #sidebar .less, #filterform .more, #filterform .less { 
    cursor: default; display: block; font-size: 90%; margin: 6px 12px; padding-top: 2px; text-align: right; 
}

/* CONTENT
 ---------------------------------------------------------------------------- */
.content {
    float: left;
    margin-bottom: 5px;
    overflow: hidden;
    padding: 0 3px 3px;
    width: 614px;
}
.inner { padding: 7px; }
h2 { font-size: 1.8em; line-height: 110%; }
h2, h3, h4 { clear: both; font-weight: normal; }
.slide h4 { clear: none; }
.content h3, h4 { font-size: 1.7em; margin: .2em 0; }
.breadcrumb { 
    float: left;
    font-size: 90%;
    left: 0;
    margin: 5px;
    position: absolute;
    top: 315px;
    width: 100%;
}
.breadcrumb p { float: left; line-height: 25px; margin: 0; }
.breadcrumb a, .breadcrumb span { 
    background: url(../gfx/bgBreadcrumbA.gif) 0 0 no-repeat; 
    float: left;
    padding: 0 7px 0 22px;
}
.breadcrumb .home { background: none; padding-left: 7px; }
.productview li {
    display: inline;
    float: left;
    margin: 5px;
    padding-top: 2em;
    position: relative;
    width: 140px;
}
.productview .icons, #prodimage .icons, #prodbox .icons {
    float: left;
    left: 0;
    margin: 0;
    position: absolute;
    top: 0;
}
.icons span {
    float: right;
    height: 16px;
    margin-left: 3px;
    overflow: hidden;
    text-indent: -9999em;
    width: 16px;
}
#prodimage .icons span, .pricebox { float: left; }
.icons .basket { background: url(../gfx/ico_basket.png) 0 50% no-repeat; float: left; }
.icons .promo { background: url(../gfx/ico_procent.png) 50% 50% no-repeat; }
.icons .new { background: url(../gfx/ico_star.png) 50% 50% no-repeat; }
.icons .excl { background: url(../gfx/ico_excl.png) 50% 50% no-repeat; }
.productview .pricebox { color: #fff; font-size: 110%; font-weight: bold; }
.productview .pricebox .price {
    float: left;
    line-height: 32px;
    text-indent: 10px; 
    width: 108px;
}
.productview .pricebox a {
    background:url("../gfx/ico_magnifier.png") no-repeat scroll 50% 50% transparent;
    float:right;
    height:32px;
    overflow:hidden;
    text-indent:-9999em;
    width:32px;
}
.productview .pricebox a:hover, .productview .img:hover { opacity: .8; }
.productview .img { display: block; height: 140px; width: 140px; }
.productview .desc { line-height: 120%; margin: 4px 0; }
.productview .desc .producer, #sidebar dl .producer, #basketbox .producer { display: block; font-weight: bold; }
.productview .icons { float: left; width: 140px; }
.productview .parameters, .productview .filters { display: none; }
#prodbox { padding: 2.5em 10px .7em; width: 580px; }
#prodbox .icons { width: 556px; }

#prodkindlist { border: 1px solid #bebebe; float: left; width: 100%; }
#prodkindlist li { border-right: 1px solid #bebebe; cursor: pointer; float: left; padding: .6em 1.1em; }
#prodbox { margin-bottom: 20px; position: relative; }
#prodbox, #prodbox .icons span, #prodbox img, .productview { float: left; }
#prodbox .img { float: left; height: 290px; width: 290px; }
#buyform { float: right; min-height: 270px; padding-bottom: 10px; position: relative; width: 254px; }
#buyform p { margin: 0; padding: 1em 0; }
#buyform p span { float: right; line-height: 1; margin: -5px 0 0 10px; } 
#buyform p .old { font-size: 16px; text-decoration: line-through; }
#buyform p .price { font-size: 25px; }
#buyform button { bottom: 6px; left: 57px; position: absolute; width: 160px; }
#buyform button, .btn1, .btn2 { cursor: pointer; float: right; margin-left: 0.2em; padding: 6px 0; }
#buyform button:hover, .btn1:hover, .btn2:hover { background: #bebebe; }
#buyform button span { background: url(../gfx/ico_cart_put.png) no-repeat 8px 50% transparent; }
#buyform button span, .btn1 span, .btn2 span { height: 100%; padding: 0 10px 0 30px; }
button span.tick { background: url(../gfx/ico_tick.png) no-repeat scroll 8px 50%; }
#buyform table { border-collapse: separate; width: 100%; }
#buyform th { font-size: 90%; padding: 1em 0 .5em; }
#buyform td { padding: 6px 0; }
#buyform .input { background: #fff; padding: 1px 2px; text-align: center; width: 24px; }
#buyform .bf2, #buyform .bf3, .textwrapper th { text-align: center; }
#buyform .bf2 { width: 60px; }
#prodnav {
    border: 1px solid #bebebe;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    float: left;
    overflow: hidden;
    width: 598px;
}
#prodnav li {
    border-left: 1px solid #bebebe;
    float: left;
    margin-left: -1px;
    width: 149px;
}
#prodnav li a { display: block; padding: 12px 9px 12px 48px; }
#pnav-question { background: url(../gfx/bgPnavQuestion.png) 20px 50% no-repeat; }
#pnav-delivery { background: url(../gfx/bgPnavDelivery.png) 20px 50% no-repeat; }
#pnav-store { background: url(../gfx/bgPnavStore.png) 20px 50% no-repeat; }
#pnav-recommend { background: url(../gfx/bgPnavRecommend.png) 34px 50% no-repeat; }
#prodnav #pnav-recommend a { padding-left: 65px; }
.recomlist { float: left; width: 300px; }
.recomlist a { display: inline; float: left; height: 90px; margin: 2px; width: 90px; }
.description { clear: both; }
.description, .recomlist { border-bottom: 1px solid #bebebe; padding: 20px 0; }
h4 { font-size: 16px; }
.textwrapper ul, .textwrapper ol { margin: 2em 0 2em 17px; }
.textwrapper ol { margin-left: 21px; }
.textwrapper ul li, .description ul li { list-style: disc; }
.textwrapper ol li, .description ol li { list-style: decimal; }
.textwrapper table {
    border: 1px solid #bebebe;
    border-collapse: collapse;
    margin: 1em 0;
    width: 100%;
}
.textwrapper td, .textwrapper th { 
    border-left: 1px solid #bebebe;
    border-bottom: 1px solid #bebebe;
    padding: .3em; 
    text-align: center;
    vertical-align: middle;
}
.textwrapper .header, .textwrapper th { font-weight: bold; }
#basket th, #basket td, .delivery th, .delivery td { border-bottom-width: 2px; padding: .5em; text-align: center; }
#basket td .input { float: none; text-align: center; width: 20px; }
#basket td:first-child, #basket td:nth-child(4), #basket table.delivery td, .delivery td, .delivery th { text-align: left; }
#basket td:nth-child(2), #basket td:nth-child(4) { font-size: 150%; }
#basket td:nth-child(2), #basket td:nth-child(4) { text-align: right; }
#basket .delivery td:nth-child(2) { font: 1em Verdana,Arial,Helvetica,sans-serif; }
#basket table .delete {
    background: url(../gfx/ico_delete.png) 50% 0 no-repeat;
    display: block;
    height: 16px;
    text-indent: -9999em;
}
#basket .handiform { clear: both; filter: left; }
#basket .text { background: #f2efe5; float: left; margin-top: 1.6em; padding: 1em 2em; }
#basket .send { float: left; margin: 0; width: 100%; }
#basket .handiform { float: left; margin-top: 7px; }
table.delivery { margin-bottom: 1em; }
table.delivery label { float: none; padding-left: .4em; }
.plus, .minus { cursor: pointer; }
.basketsum { clear: right; font-size: 180%; line-height: 2em; margin: 2px 0; text-align: right; }
.basketsum span { margin-left: .2em; padding: 0 1em; }
.paytype { float: left; width: 366px; }
.paytype dt { font-size: 150%; margin-bottom: .5em; padding: .5em .8em; }
.paytype dd { border-right: 1px solid #ccc09b; padding: .2em 0 .2em 1.2em; }
.paytype:last-child dd { border-right: 0 none; }
table.transaction { border: 0 none; margin-bottom: 2em; }
.transaction td { border-left: 0 none; }
.transaction .count { text-align: center; }
.transaction td:nth-child(1), .transaction .price { text-align: right; }
.transaction .price { width: 18%; }
.transaction .name { width: 45%; }
.transaction .no { width: 6%; }
.handiform .input, .handiform textarea, .handiform select { width: 505px; }
.handiform legend { 
    display: block;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 1em;
}
.handiform fieldset, .fancybox  {
    background: #eaeaea;
    border: 1px solid #bebebe;
    clear: both;
    margin: 7px 0;
    padding: 15px;
}
.handiform .input, .handiform textarea, .handiform select {
    background: #fff;
    border: 1px solid #bebebe;
    float: left;
    font: 1em Verdana,Arial,Helvetica,sans-serif;
    padding: 0.2em;
    width: 400px;
}
.handiform label {
    float: left;
    margin-right: 20px;
    text-align: right;
    width: 135px;
}
.handiform p {
    float: left;
    margin: .3em 0 ;
    width: 100%;
}
.handiform fieldset.slide .delete, .handiform fieldset.slide .add {
    float: right;
    padding-right: 20px;
}
.handiform fieldset.slide .delete { background: url(../gfx/ico_delete.png) 100% 0 no-repeat; }
.handiform fieldset.slide .add { background: url(../gfx/ico_add.png) 100% 0 no-repeat; }
.handiform h4 { margin-bottom: .7em; }
.handiform fieldset.slide h4 { cursor: pointer; }
p.submit { float: left; width: 100%; }
p.submit a:hover, p.submit input:hover { 
    color: #cc3300;
    text-decoration: none;
}
.submit input { cursor: pointer; float: left; }
.submit input, .submit a { margin: 0; }

.gallery-box dl { display: none; }
.gallery-box a { float: left; height: 100px; margin: 5px; width: 100px; }
.alertbox {
    background: #eaeaea;
    border: 1px solid #eaeaea;
    margin: 5px;
    position: relative;
    top: 32px;
    text-align: center;
}
.alertbox .negative { color: #cc0000; }
.alertbox .positive { color: #1c8548; }
#recommend, #question, #delivery { display: none; }
#fancy_div .handiform, .delivery, .fancybox { color: #4c4c4c; font-size: 12px; }
#fancy_div .input, #fancy_div textarea, #fancy_div select { width: 345px; }


/* FOOTER
 ---------------------------------------------------------------------------- */
#footer p { margin: 0; padding: 6px; }
#footer .author { float: right; text-align: right; width: 250px; }

