/* LAYOUT */ @width: 990px; /*** COLORS ************************/ @color1: #000000; @color2: #1510F0; @color3: #ccc; @color4: #efefef; @color5: #fbfbfb; /* Black & White */ @black: #000; @white: #fff; /* Global */ @bgmargin: 0px; @text: lighten(@black,15%); @bgcolor: @color4; @red: red; @a: @color1; /* Header */ @bar: #424242; @bar_border: #424242; @bar_text: @white; /* Components */ @head: #2a2a2a; @head_text: @white; @border: @color3; @button: darken(@border,5%); /* Selected components */ @head_selected: darken(@color2,10%); @head_selected_text: @white; @border_selected: darken(@color3,7%); @a_selected: @color1; /* Footer */ @foot: @color5; /*** Layout/Components/etc ******************/ @width1: @width - (@bgmargin*2); @column: @width1*0.18864097; @space: @width1*0.01419878; /* 3 columns divided into 4 columns */ @column3on4: ((@column*3)+(@space*2)) * 0.23720137; @space3on4: @column3on4*0.075268817; /* 3 columns divided into 5 columns */ @column3on5: ( @column*3 + @space*2 ) / (5 + 4 * 0.075268817 ); @space3on5: @column3on5 * 0.075268817; /* 4 columns divided into 5 columns */ @column4on5: ( @column*4 + @space*3 ) / (5 + 4 * 0.075268817 ); @space4on5: @column4on5 * 0.075268817; /* 4 columns divided into 6 columns */ @column4on6: ( @column*4 + @space*3 ) / (6 + 5 * 0.075268817 ); @space4on6: @column4on6 * 0.075268817; #bg_container { overflow: hidden; margin-bottom: 25px; } #bg_container_bottom { overflow: hidden; } #middle, #navigation { padding: 0px @bgmargin; } #path { background-color: lighten(@color5,4%); } #banner_middle { background: @color5; width: (@column*3)+(@space*2); height: 192px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-bottom: 10px; } .title { margin:10px; } .title p { margin: 0px !important; padding: 0px !important; font-style:italic; } .box { border: 1px solid @border; margin-bottom: 10px; background-color: @white; } .box .head { padding: 5px 5px 4px 10px; border-bottom: 1px solid @border; background: url(/images/frontend/theme/default2/bg_gradient.png) top left repeat-x; background-color: @head; -moz-border-radius: 4px 4px 0px 0px; -webkit-border-radius: 4px 4px 0px 0px; border-radius: 4px 4px 0px 0px; } #category_tree .head { background-color: @head_selected; border-bottom: 1px solid @head_selected; } #category_tree { border: none; } #category_tree .content { border: 1px solid @border; border-top: none; -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px; } #category_tree h3 { color: @head_selected_text; } .box h3.head { color: @head_text; font-size: 1.1em; font-weight: bold; } .box h3.head a { background: url(/images/frontend/theme/default2/buttons/heading-arrow.png) center right no-repeat; text-decoration: none; display: block; color: @head_text; } .box .content { padding: 5px 10px; } .roundies { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .clear, .st_clear_all { clear: both; font-size: 0px; line-height: 0%; padding:0; margin:0; height: 0px; } .buttons a, .buttons button { display:block; float:left; background-color: lighten(@button,24%); border:1px solid @button; border-top:1px solid lighten(@button,15%); border-left:1px solid lighten(@button,15%); line-height:130%; text-decoration:none; color:@text; cursor:pointer; padding:5px 10px 6px 7px; /* Links */ } .buttons button { width:auto; overflow:visible; padding:4px 10px 3px 7px; /* IE6 */ } .buttons button[type] { padding: 5px 7px 5px 7px; /* Firefox */ line-height:17px; /* Safari */ } *:first-child+html button[type] { padding: 4px 10px 3px 7px; /* IE7 */ } .buttons button img, .buttons a img { margin:0 0px -3px 0 !important; padding:0; border:none; width:16px; height:16px; } /* BASE */ button:hover, .buttons a:hover { background-color:darken(@button,5%); border:1px solid darken(@button,7%); color: @text; } .buttons a:active { background-color:darken(@button,9%); border:1px solid darken(@button,11%); color:@white; } /* DEFAULT */ button.regular, .buttons a.regular { color:@text; } .buttons a.regular:hover, button.regular:hover { background-color:darken(@button,5%); border:1px solid darken(@button,7%); color: @text; } .buttons a.regular:active { background-color:darken(@button,9%); border:1px solid darken(@button,11%); color:@white; } button[disabled="disabled"] { opacity: 0.3; } button[disabled="disabled"]:hover { background-color: lighten(@button,24%); border:1px solid @button; border-top:1px solid lighten(@button,15%); border-left:1px solid lighten(@button,15%); } .left { float:left; } .right { float:right; } #left .container_content { padding-top: 10px; } #main .container_content { padding-top: 10px; } #right .container_content { padding-top: 10px; } #overbaner { padding: 5px 0px 4px 0px; overflow: hidden; } #currency { margin: 3px; } .languages { position: relative; top: 4px; } .txt_lang { position: relative; top: -3px; } #online { float: left; padding: 10px 0px 5px 0px; color: lighten(@text,30%); } #underbaner { border: 1px solid @bar_border; background: url(/images/frontend/theme/default2/bg_gradient_menu.png) top left repeat-x; background-color: @bar; overflow: hidden; padding-right: 5px; color: @bar_text; } #underbaner #pick { position: relative; top: 6px; color: @color1; } #underbaner .languages { position: relative; top: 11px; } #underbaner #search #keywords input { border: none; } #underbaner #search { position: relative; top: 6px; } #content_baner { background: url(/images/frontend/theme/simple/baner.jpg) top left no-repeat; width: 985px; height: 200px; padding-right: 15px; padding-top: 15px; } .logo { display: none; } .logo a { text-decoration: none; color: @black; } .icon_logo { float: left; padding-bottom: 10px; padding-right: 15px; } .box_logo { float: left; padding-top: 6px; } .box_logo h1 { font-size: 22px; color: @white; } .txt_logo { font-size: 10px; color: lighten(@black,65%); } .column_baner_right { color: @white; padding-top: 5px; } .column_baner_right a { color: @color1; } .column_baner_right .header { padding-top: 1px; color: @color1; } .row { overflow: hidden; padding: 5px 0px; } #header #home { padding: 9px 10px 0 15px; } #underbaner a { color: @bar_text; font-weight: bold; text-decoration: none; } #underbaner a:hover { text-decoration: underline; } #header .left { padding-right: 10px; } #header .right { padding-left: 10px; } #copyright { text-align: right; float:right; padding: 10px 0px 5px 0px; } #copyright .link { float:left; } #copyright .link a { text-decoration: none; color: lighten(@text,30%); } #copyright .logo { float: left; padding-top: 2px; padding-left: 5px; } #open { clear: both; display: block; color: @color4; text-decoration:none; text-align: left; font-size: 10px; padding-left: 15px; line-height: 12px; } .header a { display: block; padding: 8px 10px 0px 10px; font-size: 13px; font-weight: bold; float: left; } #navigation { overflow: hidden; } #footer { border: 1px solid @border; background-color: @foot; margin-top: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } #footer h4 { font-weight: bold; color: @color1; } #footer a { color: darken(@color2,10%); } .txt_input { position: relative; top:2px; } .txt { position: relative; top:2px; } #header .row .left { padding-right: 3px; } #header .row .right { padding-left: 3px; } .space10_right { padding-right: 10px; } /* formularze */ .st_form { padding: 0; margin: 0; } .st_form .st_row { padding: 5px 0px; clear: both; } .st_form .st_row_last { clear: both; border-top: 1px solid @border; background-color: @color5; } .st_form label { float: left; width: 100px; text-align: right; } .st_form .st_field { margin-left: 110px; } .st_form .st_error { margin-left: 110px; color: red; } #main_categories .category a, #subcategories .name a { font-size: 1em; font-weight: bold; color: @color1; } #main_products .basket, #product_long .basket { background-color: @color5; border-top:1px solid lighten(@color1,75%); } #main_products .description, #product_long .description { color: lighten(@color1,45%); } .basket a { color: @a_selected; } .box .content .full { background-color: @white; } /** do element__w przesuwania [wyrzucic] **/ .block-hover { border: 1px dashed @color3; } #schowek_add { padding-right:12px; margin-right:12px; border-right:1px solid @color3; } #js_frame { display:none; } #img_delivery,#img_card { margin-top: 10px; } /* module stBasket */ #st_basket-add-button-content { background-color: lighten(@button,24%); border: 1px solid @button; border-top: 1px solid lighten(@button,15%); border-left: 1px solid lighten(@button,15%); color:@text; } #st_basket-add-button-content input { color: @text; } /* module stCategory */ #st_category-list > li { border-top: 1px solid @border; } #main_categories, #subcategories { margin-left: 0px - @space3on4; margin-right: 0px - @space3on4; } #main_categories .item, #subcategories .item { width: @column3on4; margin-left: @space3on4; } #main_categories .image, #subcategories .image { width: @column3on4 - 2; } /* module stCurrencyPlugin */ #pick select#currency { border: 1px solid @color3; color: @color1; background-color:@white; } /* module stNavigationPlugin */ #path a { color: lighten(@color1,15%); } #path .not_active { color: @color1; } /* module stNewsletterPlugin */ #newsletter .content .sign .email { border: 1px solid @border; } #newsletter .content .sign .email input { background-color: @white; } #newsletter .content .sign .email .submit input { border: 1px solid @border; background-color: @white; } .email #newsletter_email { color: lighten(@text,30%); } /* module stProduct */ .price, .major_price span { color: @black; } .minor_price { color: @black; } .old_price, .old_price span, .price .old_price { color: @red; } #list #product_other { margin-left: 0px - @space3on5; margin-right: 0px - @space3on5; } #product_other .item, #product_recommend .item, #product_accessories .item { width: @column3on5; margin-left: @space3on5; } #product_other .image, #product_recommend .image, #product_accessories .image { width: @column3on5 - 2; } /* Product list long and main */ @columnx: @space * (-1); #main_products, #product_long { margin: 0px @columnx 10px @columnx; } #main_products .item, #product_long .item { width: @column - 2; margin-left: @space; } #product_other .image, #product_recommend .image, #product_accessories .image { border: 1px solid @border; background-color: @white; } #product_short .bg_grey_short td { background-color: lighten(@black,95%); } .box_photo_sort { border: 1px solid @border; background-color: @white; } #product_card .label { border: 1px solid @border; } #product_card .information .price { border-top: 1px dotted @border; } #product_card .information .basket { border-bottom: 1px dotted @border; } .border_basket { border-top: 1px solid @white; } /* module stTabNavigatorPlugin */ .st_tab_navigator li a { color: @text; background-color: @white; border-top:1px solid @border; border-left:1px solid @border; border-right:1px solid @border; border-bottom:1px solid @white; } .st_tab_navigator li a span { background-color: lighten(@black,95%); } .st_tab_navigator li.st_selected a { color: @text; } .st_tab_navigator li.st_selected a span { background-color:@white; } .st_content_tab { border: 1px solid @border; background-color: @white; } /* t__o za pomoca obrazka */ /* .box .head { background: url(/images/frontend/theme/default2/bg_gradient.png) top left repeat-x; } #category_tree .head { background: url(/images/frontend/theme/default2/bg_head_category.gif) top left repeat-x; } #underbaner { background: url(/images/frontend/theme/default2/bg_menu.gif) top left repeat-x; } #path { background: url(/images/frontend/theme/default2/stNavigationPlugin/bg_navigation.gif) top left repeat-x; } */ body { margin: 0; padding: 0; font-family: Arial,Helvetica, Verdana, sans-serif; color: @text; font-size: 12px; text-align: left; letter-spacing: 0.5px; line-height: 150%; background-color: @white; } input, textarea, select, button { font-family: Arial,Helvetica, Verdana, sans-serif; font-size: 12px; } fieldset { padding: 0px; } h1, h2, h3, h4, h5, h6, table, td, th, ul, ol, li, form { margin: 0; padding: 0; } h1,h2,h3,h4,h5,h6 { font-weight: normal; } h1 { font-size: 2.5em; font-weight: bold; line-height: 1.1em; } h2 { font-size: 1.6em; line-height: 1.1em; } h3 { font-size: 1.2em; } h4 { font-size: 1.1em; } h5 { font-size: 1.05em; } h6 { font-size: 1.05em; } a { color: @a; text-decoration: underline; outline-style:none; } ul,ol { list-style-position: inside; margin-left: 0px; list-style-type:none; } ol ol, ul ul { margin-left: 1.4em; } dt { font-weight: bold; } dd { margin-left: 0px; } blockquote { margin: 0px; font-style: italic; } img { border-style: none; } input, select, textarea { border: 1px solid #ccc; padding: 3px; } table { border-left:1px solid @border; border-top: 1px solid @border; } table th, table td { border-right:1px solid @border; border-bottom: 1px solid @border; padding: 5px; background-color: @white; } table th { background-color: @color5; } .tinymce_html ul { list-style-type: disc; } .tinymce_html ul ul { list-style-type: circle; } .tinymce_html ul ul ul { list-style-type: square; } .tinymce_html ol { list-style-type: decimal; } .tinymce_html button { display:block; float:left; background-color: lighten(@button,24%); border:1px solid @button; border-top:1px solid lighten(@button,15%); border-left:1px solid lighten(@button,15%); line-height:130%; text-decoration:none; color:@text; cursor:pointer; padding:5px 10px 6px 7px; /* Links */ } .tinymce_html button:hover { background-color:darken(@button,5%); border:1px solid darken(@button,7%); color: @text; } image-xelexin{ background-image:url(http://rafal.net.pl/sote/ask-disabled-basket.png); background-repeat:no-repeat; cursor: pointer; } #container { margin: 0 auto; width: @width; } #left { float: left; width: @column; text-align: left; line-height: 142%; margin-right: @space/2; } #main { float: right; width: (@column*4)+(3*@space); display: inline; margin-left: @space/2; }