/* -------------------------------------------------------
   * Filename	screen.css
   * Updated	2009-10-21 / 2011-01-03
   * Author     Dariusz Pobożniak
   * Website	http://pobozniak.pl
   ----------------------------------------------------- */

/* CSS Document main default file */

@import url("reset.css"); 	    /* reset browser defaults */
@import url("fancybox.css");    /* lightbox gallery css   */

/* colors
 main:      #ededed
 green:     #00ae35
 grey:      #6a6a6a
 orange:    #fa780f
*/

a 		{ color: #46af00; text-decoration: none; }
a:hover { text-decoration: underline; }

body { 
	background: #ededed;
	color: #ededed;
	font: normal 62.5%/170% Verdana, Arial, Helvetica, sans-serif;
}
p { margin: 1em 0; }
strong { font-weight: bold; }
em { font-style: italic; }
h1, h2, h3, h4 {
    font-weight: normal;
}
h2 {
    clear: both;
    color: #ffffff;
    font-size: 1.8em;
    text-transform: uppercase;
}
h4, #searchform label {
    font: normal 120% Arial, Courier, Garamond, serif;
    text-transform: uppercase;
}
input {
    background: #fff;
    color: #000;
    font: 1em Verdana;
}
input[type=checkbox] { background: transparent; }
textarea { overflow: auto; }

/* GRID
 ---------------------------------------------------------------------------- */
#header, #container, #footer {
    margin: 0 auto;
    width: 1042px;
}
#header {
    background: url(../gfx/bgHeader.jpg) 0 0 no-repeat;
    font: 1.4em "Times New Roman", Courier, Garamond, serif;
    height: 228px;
    text-transform: uppercase;
}
#home #header {
    background: url(../gfx/bgHeaderHome.jpg) 0 0 no-repeat;
    height: 570px;
}
#container, #footer {
    font-size: 1.2em;
}
#sidebar {
    background: #000 url(../gfx/bgSidebar.gif) 0 100% no-repeat;
    float: left;
    font-family: "Times New Roman", Courier, Garamond, serif;
    text-transform: uppercase;
    width: 238px;
}
#content {
    float: left;
    width: 804px;
}
#footer {
    background: url(../gfx/bgFooter.gif) 0 0 no-repeat;
    color: #000;
    padding-top: 2em;
    text-align: center;
}
#header:after, #container:after, #footer:after
{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* HEADER
 ---------------------------------------------------------------------------- */
.logo {
    display: inline;
	float: left;
	height: 174px;
	margin: 25px 0 0 36px;
	width: 183px;
}
.logo a {
	background: url(../gfx/logo.gif) 0 0 no-repeat;
	display: block;
	height: 100%;
	overflow: hidden;
	text-indent: -99999px;
	width: 100%;
}
#topnav {
    float: right;
    font-size: 1.4em;
    margin: 93px 0 45px;
    text-align: center;
    width: 800px;
}
    #topnav li { display: inline; padding: 0 .6em; }
        #topnav li a { color: #ffffff; }
.input, textarea, select {
	background: #fff;
	border: 0 none;
	font: 1em Verdana;
	padding: 2px;
}

/* --- =USER-PANEL --- */
#user-panel {
    background: url(../gfx/bgUserPanel.gif) 50% 100% no-repeat;
    display: inline;
	float: right;
	height: 67px;
    margin-right: 30px;
	width: 725px;
}
#user-panel form, #user-panel #logged {
	color: #ffffff;
	float: left;
	height: 67px;
    padding-right: 20px;
    width: 320px;
}
#user-panel #basket-box a { background: none; font-size: 1.7em; }
#user-panel #logged { font-size: 80%; color: #fff; }
#basket-box span { color: #ffffff; display: block; font-size: 2em; }
#logged p span { color: #ffffff; }
#user-panel  p { margin: .5em 0 1.2em; }
#user-panel fieldset { float: left; font-size: 90%; width: 180px; }
#user-panel fieldset p { margin: .5em 0 0; }
#user-panel fieldset a { font-size: 90%; }
#user-panel .links p { margin: .5em 0; }
#user-panel .input {
    font-size: 90%;
    padding: 1px;
    width: 105px;
}
#user-panel label { 
    float: left;
    margin-right: 8px;
    text-align: right;
    width: 60px;
}
#user-panel form div { float: left; width: 120px; }
#user-panel .links, #user-panel form, #logged {
    font-family: Verdana;
    text-transform: none;
}
#user-panel form, #user-panel a, #user-panel form div a { color: #ffffff; }
#user-panel a, #user-panel .submit {
    background: url(../gfx/bgHeaderLink.gif) 100% 50% no-repeat;
    padding-right: 20px;
}
#user-panel .submit {
    border: 0 none;
    color: #fff;
    text-align: left;
    text-transform: uppercase;
    width: 105px;
}
#user-panel div { float: left; width: 165px; }
#user-panel div a, #user-panel .links span { color: #fff; }
#flash { 
    display: inline;
    float: right;
    height: 330px;
    margin-right: 30px;
    width: 730px;
}

/* SIDEBAR
 ---------------------------------------------------------------------------- */
#sidebar h2 {
    background: url(../gfx/bgSidebarTop.gif) 0 0 no-repeat;
    padding: 45px 0 87px 55px;
}
#home #sidebar h2 {background: url(../gfx/bgSidebarTopHome.gif) 100% 0 no-repeat;}
#mainnav, .banners {
    background: #ededed;
    margin-left: 6px;
    min-height: 200px;
    padding: 0 15px 4em;
    width: 202px;
}
#mainnav .title {
    background: url(../gfx/bgMainnavTitle.gif) 0 80% no-repeat;
    color: #000000; 
    display: block;
    font-size: 15px;
    padding: .7em 0 .2em 18px;
}
#mainnav li li  {
    border-bottom: 1px solid #d2d2d2; 
    font-size: 13px;
    padding: .3em .3em .2em 0px;
}
#mainnav li li:last-child { border-bottom: 0 none; }
#mainnav li a { color: #6e6e6e; }
#mainnav li a:hover { color: #a4a4a4; text-decoration: none; }
#mainnav li ul {  margin-left: 18px;}
#mainnav li li li { border: 0 none; font-size: 14px; padding: .1em;}
.banners { text-align: center; }
.banners img { border: 1px solid #ededed; }
.banners a:hover img { border-color: #a4a4a4; }

/* CONTENT
 ---------------------------------------------------------------------------- */
#search-box {
    background: #000 url(../gfx/bgSearchBox.gif) 0 0 no-repeat;
    height: 56px;
    padding: 38px 0 0 50px;
    width: 754px;
}
#home #search-box {
    background: #000 url(../gfx/bgSearchBoxHome.gif) 0 0 no-repeat;
}
#search-box h4, #searchform label {
    float: left;
    line-height: 30px;
}
.box {
    background: url(../gfx/bgBox.gif) 0 0 no-repeat;
    float: left;
    width: 804px;
}
.box h2 { margin: 20px 0 14px 65px;}
.inside {
    background: #000 url(../gfx/bgInside.gif) 0 100% no-repeat;
    float: left;
    margin-bottom: 1em;
    padding: 0 35px 3em;
    width: 734px;
}
#content > .inside { min-height: 270px; }
.promo img { float: right; margin: 0 10px; }
#partnerbox .inside { text-align: center; }

/* ---- COLORS ---- */
#colors {
    background: url(../gfx/bgColors.gif) 0 0 no-repeat;
    float: left;
    height: 30px;
    padding-left: 11px;
    width: 322px;
}
#colors h4 {
    color: #000;
    margin-right: 13px;
}
#colors a {
    border: 1px solid #c8c8c4;
    float: left;
    height: 9px;
    margin: 10px 1px 0 0;
    overflow: hidden;
    text-indent: -9999px;
    width: 9px;
}
#colors a:hover { border-color: #999; }
.white          { background-color: #ffffff; }
.beige          { background-color: #f5f5c5; }
.orange         { background-color: #fd9700; }
.pink           { background-color: #fea0d0; }
.azuline        { background-color: #00bbf1; }
.lightgreen     { background-color: #00f900; }
.black          { background-color: #000000; }
.grey           { background-color: #9d9ca5; }
.yellow         { background-color: #f2e400; }
.red            { background-color: #ed0000; }
.purple         { background-color: #9f048d; }
.navy           { background-color: #06128b; }
.green          { background-color: #007e00; }
.brown          { background-color: #802A2A; }

/* ---- SEARCH FORM ---- */
#searchform {
    background: url(../gfx/bgSearchInput.gif) 160px 0 no-repeat;
    float: left;
    width: 385px;
}
#searchform label { color: #fff; margin: 0 8px 0 40px; }
#searchform input {
    background: none;
    float: left;
    height: 14px;
    padding: 7px 15px;
    width: 130px;
}
#searchform button {
    background: none;
    border: 1px solid #000;
    -moz-border-radius: 5px;
    color: #ffffff;
    cursor: pointer;
    margin: 4px 0 0 4px;
}
#searchform button:hover { border-color: #ffffff; }

.breadcrumb { margin: 0 0 1em 15px; }
.breadcrumb a { color: #bfbebe; }
.breadcrumb span { color: #fff; }
.crossbar {
    background: url(../gfx/bgCrossbar.gif) 0 0 no-repeat;
    color: #000;
    display: inline;
    float: left;
    font-weight: bold;
    height: 30px;
    line-height: 30px;
    margin: 0 0 1em 15px;
    padding: 0 20px;
    width: 674px;
}
.crossbar span { float: left; }
.crossbar a { color: #000; }
.crossbar .sort {
    background: url(../gfx/bgCrossbarSort.gif) 0 50% no-repeat;
    float: right;
    margin-right: 30px;
    padding-left: 20px;
}

/* ---- PRODLIST ---- */
#prodlist { clear: both; }
#prodlist li, #productbox {
    border: 1px solid #6a6a6a;
    float: left;
    list-style: none;
    margin-bottom: 10px;
    padding: 15px;
    width: 702px;
}
#prodlist li img, #productbox img { float: left; margin-right: 10px; }
#prodlist li a, #prodlist li .price,
#productbox h1, #productbox .buy, #productbox .price, .recommends h2,
#newprodlist a {
    font: 1.1em Verdana, Arial, "Times New Roman", Courier, Garamond, serif;
}
#prodlist li a, #newprodlist a, .recommends a { color: #fff; } 
#newprodlist a:hover { color: #4daa00; }
#prodlist li .price, #productbox .price, #newprodlist .price { color: #ffffff; font-size: 1.3em; }
#prodlist li .buy, #productbox .buy,  .buy, .promo .more, .submit input {
    background: url(../gfx/bgLinkBuy.gif) 100% 50% no-repeat;
    color: #ffffff;
    float: right;
    font-size: 1.2em;
    /* margin-top: -20px; */
    padding-right: 45px;
    text-transform: uppercase;
}
#prodlist h2 { clear: none; font-size: 92%; }
#productbox #p-photo { float: left; width: 260px; }
#productbox #p-photo img { margin-bottom: 10px; }
#productbox .buy { margin-top: 0; }
#newprodlist { float: left; margin: 2em 0; }
#newprodlist li {
    border: 1px solid #6a6a6a;
    float: left;
    list-style: none;
    margin: 2px;
    padding: 1.2em 12px 150px;
    position: relative;
    width: 150px;
}
#newprodlist img { bottom: 35px; left: 12px; margin: .2em 0 .5em; position: absolute; }
#newprodlist .buy, .promo .more {
    height: 24px;
    overflow: hidden;
    margin-top: 0; 
    padding: 0;
    text-indent: -9999px;
    width: 43px;
}
#newprodlist .buy { bottom: 2px; position: absolute; right: 12px; }
#newprodlist .price { bottom: 6px; position: absolute; left: 12px; }
.promo .more { margin: 0 20px; }
.oldprice { font-size: 90%; text-decoration: line-through; }
.recommends { clear: both; padding-top: 20px; }
.recommends h4 { margin-bottom: 10px; }
.inside .recommends ul li { display: table; list-style: none; margin: 5px 0; overflow: hidden; }
.recommends .photo { display: table-cell; float: left; }
.recommends h2 { clear: none; display: table-cell; font-size: 111%; vertical-align: middle; }



/* ---- ALERTS ---- */
.positive, .negative, .hint {
    border: 4px solid;
	font-size: 1.3em;
    margin-bottom: 2em;
    padding: 1.3em;
    text-align: center;
}
.hint { border-color: #AFAFAF; }
.negative { border-color: #DF0D29; }
.positive { border-color: #158F00; }
#content form .hint { float: none; margin: 0 0 2em; width: auto; }

/* ----- FORMS ----- */
#registerform .input, textarea, #registerform select, .volume {
    border: 1px solid #6a6a6a;
    float: left;
    width: 505px;
}
#registerform legend, .delivery legend, .informations legend { 
    display: block;
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 1em;
}
.volume { float: none; width: 30px; }
#registerform fieldset {
    border-bottom: 1px solid #6a6a6a;
    margin-bottom: 1.5em;
    padding: 0 0 1.5em;
}
#registerform label, .informations label {
    float: left;
    margin-right: 20px;
    width: 146px;
}
#registerform p, .informations p {
    float: left;
    margin: .3em 0 ;
    width: 100%;
}
p.submit { float: left; width: 100%; }
p.submit a:hover, p.submit input:hover { 
    color: #a2a2a2;
    text-decoration: none;
}
.submit input { cursor: pointer; float: left; }
.submit input, .submit a { margin: 0; }
#map { 
    height: 500px;
    margn: 1em 0;
    width: 730px;
}
.delivery legend { margin: 0; }
.delivery dt { font-size: 120%; margin: 1em 0 .5em; }
.delivery dd { margin: .2em 0; }
#till .submit input { float: right; }
#till .buy { float: left; }
#till .informations { margin: 1em 0; }

/* ----- TABLE ----- */
table { 
    border: 1px solid #6a6a6a;
    border-collapse: collapse; 
    margin: 0 0 1.3em;
    width: 100%; 
}
th, td {
    border-bottom: 1px solid #6a6a6a;
    border-right: 1px solid #6a6a6a;
    padding: .3em .5em;
}
table th { 
    background-color: #6a6a6a; 
    font-size: 90%; 
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
}
table .remove { display: block; font-size: 90%; }
.basket { margin-bottom: 2em; }
.basket td:first-child { width: 50%; }
.basket td:last-child { width: 20%; }
.basket td:nth-child(3) { width: 10%; text-align: center; }
.history caption { margin: 1em 0 .2em; text-align: left; }
.history .price { min-width: 60px; text-align: right; }

/* Markdown & common styles */
.inside ul, .inside ol { margin: .2em 0 .2em 20px; }
.inside ul li { list-style: disc; }
.inside ol li { list-style: decimal; }
/* gallery-box */
.gallery-box {
    background: #111;
    border: 1px dashed #333;
    margin: 1.5em 0;
    padding: 1em;
    text-align: center;
}
.gallery-box dl { text-align: left; }
.gallery-box dt { color: #4c4c4c; font-size: 120%;}
.gallery-box dd { margin: .4em 0; }
.gallery-box a img { border: 1px solid #ccc; margin: .3em; padding: 3px; }
.gallery-box a:hover img { border-color: #888; cursor: -moz-zoom-in; }
/* gallery-desc */
.gallery-desc { float: left; margin: 1em 0; width: 100%; }
#content .gallery-desc ul, .gallery-desc li p { margin: 0; }
#content .gallery-desc ul li { list-style: none; }
.gallery-desc li {
    clear: both; 
    float: left; 
    margin: .5em 0;
    width: 100%;
}
.gallery-desc .left img { float: left; }
.gallery-desc .right img { float: right; }
.gallery-desc .left p, .gallery-desc .left h4 { margin-left: 180px; }
.gallery-desc .right p, .gallery-desc .right h4 { margin-right: 180px; text-align: right; }
.gallery-desc .center { 
    clear: none; 
    max-height: 210px; 
    _height: 210px; 
    overflow: hidden; 
    width: 190px; 
}


/* FOOTER
 ---------------------------------------------------------------------------- */
#footer span { float: right; margin: 3em 0 0 ;}
#footer ul { 
    border-bottom: 1px solid #000;
    display: inline;
    text-transform: uppercase;
}
#footer li {
    display: inline;
    padding: 0 1em;
}
#footer a { color: #000; }
#footer p { margin: 105px 0 3em; }