generalexperts Posted March 2, 2014 Share Posted March 2, 2014 (edited) I need help moving items on the (default prestashop) products page. I would like to Place the add to cart button next to the Quantity box. When I try to move things, the entire section moves with it. I'd like to be able to move things around to how I want. For example, when I move the add to cart button the Price moves with it. Is there a way to make them all separate? Thanks! Edited September 25, 2014 by generalexperts (see edit history) Link to comment Share on other sites More sharing options...
Detelin Markov Posted March 2, 2014 Share Posted March 2, 2014 (edited) Hi generalexperts, I check your site but your are turn on CCC (Combine, Compress and Cache) and i can`t see your css files but you can try this: Search and replace this code in your product.css file. In end of my answer you can see what will be your result. .product_attributes { display: block; float: left; width: 200px; padding: 10px 0 0; .content_prices { display: block; float: right; width: 200px; text-align: right; #buy_block p { padding: 0px; about print button - can be moved but need to touch product.tpl file you can search #usefull_link_block - i suggest to disable it #usefull_link_block { display: none; list-style-type: none; margin-top: 20px; You have problem with add to cart button in chrome 34 (dev v) you can see what i see in picture below. About Yotpo social widget that you use. I use it for one of my project... before time. Try something better. Now i use Get Kudos.me Regards from Bulgaria, /Detelin Markov Edited March 2, 2014 by Detelin Markov (see edit history) Link to comment Share on other sites More sharing options...
generalexperts Posted March 2, 2014 Author Share Posted March 2, 2014 Thank you for your help! Is there a way to mix the two blocks of information together. For example.. have the 'price' up above, then the 'size' drop down (visible for some products), then quantity box below it with the add to cart right next to it. What would I need to do to the tpl file for that to work? Yes, you're right the print button can be disabled, no point for that. The add to cart button does look different, I didn't notice that, and thanks for pointing that out. Right now I really don't understand the add to cart button. If I change other buttons it for some reason changes the style of the add to cart button. I don't know how to separate them. So when I edit it it doesn't change it. Would you be able to help me with that as well? Thank you! I appreciate your help!! Link to comment Share on other sites More sharing options...
Detelin Markov Posted March 3, 2014 Share Posted March 3, 2014 Hi, Turn off CCC combination from advanced setting - need to do this because now i can't view your filles. When you stop ccc i will check your siteagain and will answer. Link to comment Share on other sites More sharing options...
generalexperts Posted March 8, 2014 Author Share Posted March 8, 2014 Anyone able to help? I'm looking to condense all the small information such as quantity, add to cart, availability, on sale, etc. Purpose is to move up the tabs up so people can see them easier without having to scroll way down, giving it a more condensed look. Thanks! Link to comment Share on other sites More sharing options...
Detelin Markov Posted March 8, 2014 Share Posted March 8, 2014 Hi again generalexperts, Can you show me picture what i want to be final result? You want to show: quantity, add to cart, availability, on sale, etc. - may be on one row bottom of short desc - or i don`t understand you properly? Regards! Detelin Link to comment Share on other sites More sharing options...
generalexperts Posted March 8, 2014 Author Share Posted March 8, 2014 (edited) If you look at my site it shows Size Reference Quantity Availability In stock Price Price per Unit Add to cart button Then the tabs More info, Specs, resources, reviews That is a very long list. Lots of unneeded white space, I'd like to be able to move those items closer up, that way the tabs can be much higher without a lot of white space. I just like to know what how i can move those items separately. For example, Right now if I try to move Price, the entire price column (Price, Price per unit, and Add to cart) has to be moved. I want to be able to mix them around. Is that possible? Edited April 30, 2014 by generalexperts (see edit history) Link to comment Share on other sites More sharing options...
Detelin Markov Posted March 8, 2014 Share Posted March 8, 2014 You don`t have all product attributes for that you talk about. If you want to use it all make product to have all of these and than touch design! With that i see now i make several changes in your css files try it and tell me what you think. I make design for this page: http://www.savvymarina.com/products/16--pettit-aluma-protect-aluminum-epoxy-primer.html Your code is very messy. Try to locate where you are set this: <div class="grid_9 alpha omega clearfix" id="columns" style="position: relative; top:150px"> top:150px make the white space above the products and center block. Site that you showing me don`t have left column and have white space on product page - look: http://www.madeleinemarket.com/fr/poivre-noir-malabar.html Your global.css /* ################################################################################################## PRESTASHOP CSS ################################################################################################## */ /* **************************************************************************** reset **************************************************************************** */ html{color:#000;background:#1D83AE;} ,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0} table{border-collapse:collapse;border-spacing:0} fieldset,img{border:0} address,caption,cite,code,dfn,em,th,var,optgroup{font-style:inherit;font-weight:inherit} del,ins{text-decoration:none} caption,th{text-align:left} h1,h2,h3,h4,h5,h6{font-size:100%} q:before,q:after{content:''} abbr,acronym{border:0;font-variant:normal} sup{vertical-align:baseline} sub{vertical-align:baseline} legend{color:#000} input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit} input,button,textarea,select{font-size:100%} .ie7 input, .ie7 select{line-height:18px} a {cursor:pointer} .clearfix:before, .clearfix:after { content: "."; display: block; height: 0; overflow: hidden } .clearfix:after {clear: both} .clearfix {zoom: 1} /* ************************************************************************************************ struture ************************************************************************************************ */ #page {} #header {z-index:10} #columns {z-index:1} #left_column {} #center_column {} #right_column {} #footer {} /* ************************************************************************************************ generic style ************************************************************************************************ */ body{ font:normal 11px/14px Arial, Verdana, sans-serif; color:#222; background:url('../../shop/img/body_bg7.jpg'); background-position:center top; background-repeat:repeat; margin:0; padding:0; } body.content_only { background: #FFF; } body {margin:0px!important;} /* positionnement ****************************************************************************** */ .hidden {display:none} .f_left {float:left} .f_right {float:right} p.center {text-align:center} .clearBoth {clear:both} /* title *************************************************************************************** */ h1 { margin-bottom:20px; font-size:24px; line-height: 22px } h2 { padding-bottom:20px; font-size:18px } h3 { padding-bottom:20px; font-size:16px } .title_block { padding-bottom:20px; font-size:14px } .hide-left-column #left_column {display:none} .hide-left-column #center_column {width:757px} /* text **************************************************************************************** */ p {padding-bottom:20px} p em {font-style:italic} .warning { margin:0 0 10px 0; padding:10px; border:1px solid #e6db55; font-size:13px; background:#ffffe0 } .success { margin:0 0 10px 0; padding:10px; border:1px solid #5cff74; font-size:13px; background: #d3ffab; } .error { margin:0 0 10px 0; padding:10px; border:1px solid #990000; font-size:13px; background:#ffcccc } .error ol {margin-left:20px} .error p.lnk { margin-top:20px; padding:0; font-size:11px } .required {color:#990000} /* link **************************************************************************************** */ a, a:active, a:visited { color:#333; text-decoration:none; outline: medium none } a:hover {text-decoration:underline} /* HACK IOS ipad, iphone */ input[type="text"], input[type="email"], input[type="search"], input[type="password"], input[type="submit"], input[type="image"] { -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-radius:0px !important; -moz-border-radius:0px !important; border-radius:0px !important; } /*buttons ************************************************************************************** */ input.button_mini, input.button_small, input.button, input.button_large, input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled, input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large, input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, a.button_mini, a.button_small, a.button, a.button_large, a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large, span.button_mini, span.button_small, span.button, span.button_large, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled { position:relative; display:inline-block; padding:5px 7px; border:1px solid #333333; -moz-border-radius: 3px !important; -webkit-border-radius: 3px !important; border-radius: 3px !important; font-weight:bold;#B3DCED color:#000; background: #25aae1; cursor: pointer; text-align: center; margin-right: 88px; width:60px; /* top:-3px; */ padding-left:7px; padding-right:7px; height:27px; } *:first-child+html input.button_mini, *:first-child+html input.button_small, *:first-child+html input.button, *:first-child+html input.button_large, *:first-child+html input.button_mini_disabled, *:first-child+html input.button_small_disabled, *:first-child+html input.button_disabled, *:first-child+html input.button_large_disabled, *:first-child+html input.exclusive_mini, *:first-child+html input.exclusive_small, *:first-child+html input.exclusive, *:first-child+html input.exclusive_large, *:first-child+html input.exclusive_mini_disabled, *:first-child+html input.exclusive_small_disabled, *:first-child+html input.exclusive_disabled, *:first-child+html input.exclusive_large_disabled { border:none } /* input button */ input.button_mini, input.button_small, input.button, input.button_large, input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled, input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large, input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled { /*padding-bottom: 2px*/ } /* disabled button */ input.button_mini_disabled, input.button_small_disabled, input.button_disabled, input.button_large_disabled, input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, span.button_mini, span.button_small, span.button, span.button_large, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled { /*background-position: left -36px; cursor: default; color: #888!important*/ } /* exclusive button */ input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large, input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled { /*color: white!important*/ } /* exclusive disabled button */ input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled, span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large { /*color: #488c40!important*/ } /* hover button */ input.button_mini:hover, input.button_small:hover, input.button:hover, input.button_large:hover, input.exclusive_mini:hover, input.exclusive_small:hover, input.exclusive:hover, input.exclusive_large:hover, a.button_mini:hover, a.button_small:hover, a.button:hover, a.button_large:hover, a.exclusive_mini:hover, a.exclusive_small:hover, a.exclusive:hover, a.exclusive_large:hover { text-decoration:none; background-position: left -50px } /* exclusive hover button */ input.exclusive_mini:hover, input.exclusive_small:hover, input.exclusive:hover, input.exclusive_large:hover, a.exclusive_mini:hover, a.exclusive_small:hover, a.exclusive:hover, a.exclusive_large:hover { /*color: white!important*/ } /* active button */ input.button_mini:active, input.button_small:active, input.button:active, input.button_large:active, input.exclusive_mini:active, input.exclusive_small:active, input.exclusive:active, input.exclusive_large:active, a.button_mini:active, a.button_small:active, a.button:active, a.button_large:active, a.exclusive_mini:active, a.exclusive_small:active, a.exclusive:active, a.exclusive_large:active { background-position: left -100px;} /* classic buttons */ input.button_mini, input.button_mini_disabled, input.exclusive_mini, input.exclusive_mini_disabled, a.button_mini, a.exclusive_mini, span.button_mini, span.exclusive_mini { /*width: 30px; background-image: url('../img/button-mini.png')*/ } input.button_small, input.button_small_disabled, input.exclusive_small, input.exclusive_small_disabled, a.button_small, a.exclusive_small, span.button_small, span.exclusive_small { /*width: 60px; background-image: url('../img/button-small.png')*/ } input.button_disabled, input.exclusive_disabled, span.exclusive { border:1px solid #ccc; color:#999; background:url(../img/bg_bt_2.gif) repeat-x 0 0 #CCCCCC; cursor:default; } input.button_large, input.button_large_disabled, input.exclusive_large, input.exclusive_large_disabled, a.button_large, a.exclusive_large, span.button_large, span.exclusive_large, span.exclusive_large_disabled { /*width: 180px; background-image: url('../img/button-large.png')*/ } /* exclusive button */ /*input.exclusive, input.exclusive_disabled, a.exclusive, span.exclusive { background-image: url('../img/button-medium_exclusive.png') } input.exclusive_mini, input.exclusive_mini_disabled, a.exclusive_mini, span.exclusive_mini { background-image: url('../img/button-mini_exclusive.gif') } input.exclusive_small, input.exclusive_small_disabled, a.exclusive_small, span.exclusive_small { background-image: url('../img/button-small_exclusive.gif') } input.exclusive_large, input.exclusive_large_disabled, a.exclusive_large, span.exclusive_large, span.exclusive_large_disabled { background-image: url('../img/button-large_exclusive.gif') }*/ /* form **************************************************************************************** */ form.std fieldset { margin:20px 0; border:1px solid #ccc } /* table *************************************************************************************** */ table.std, table.table_block { margin-bottom:20px; width:100%; border:1px solid #999; border-bottom:none; background:white; border-collapse:inherit } table.std th, table.table_block th { padding:14px 12px; font-size:12px; color:#fff; font-weight:bold; text-transform:uppercase; text-shadow:0 1px 0 #000; background:url(../img/bg_table_th.png) repeat-x 0 0 #999 } table.std tr.alternate_item, table.table_block tr.alternate_item {background-color: #f3f3f3} table.std td, table.table_block td { padding:12px; border-right:1px solid #e9e9e9; border-bottom:1px solid #e9e9e9; font-size:12px; vertical-align:top } /* BLOCK .block ******************************************************************************** */ .block {margin-bottom:20px} #footer .block {margin-bottom:0} .block .title_block, .block h4 { padding:6px 11px; font-size:12px; color:#FFFFFF; text-shadow:0 1px 0 #000; text-transform:uppercase; background:#4d4d4d; text-align:left; font-weight: bold; } .block .title_block a, .block h4 a {color:#fff} .block ul { list-style-type: none; padding:0px; } .block li.last { border:none} .block li a { display:block; color:#333 } /* BLOCK .products_block *********************************************************************** */ .products_block {} .products_block li {float:left } .products_block li img {border:1px solid #d1d1d1} /* BLOCK customer privacy ******************************************************************* */ .account_creation label{ float:left; padding-top:5px; width:80%; text-align:left; cursor:pointer } /* BLOCK .footer_links (cms pages) ************************************************************* */ ul.footer_links { list-style-type:none; margin-bottom:20px } ul.footer_links li {float:left} ul.footer_links li.f_right {float:right} ul.footer_links li .icon { position:relative; top:6px; left:0 } /* barre comparaison / tri ********************************************************************* */ .content_sortPagiBar {margin:20px 0;} #center_column .sortPagiBar { padding:10px; font:normal 11px Arial, Verdana, sans-serif; color:#666; background:#eee; } #center_column .sortPagiBar strong {color:#000;} #center_column .sortPagiBar p {padding:0;} #center_column .sortPagiBar form {display:inline-block;} .ie7 #center_column .sortPagiBar form {display:inline;} .sortPagiBar #productsSortForm {float:right;} .sortPagiBar select#selectPrductSort { margin:0 0 0 10px; color:#000; border:1px solid #ccc } .sortPagiBar #bt_compare { padding:3px 7px; border:none; color:#fff; text-shadow:0 1px 0 #000; background:url(../img/bg_bt_compare.gif) repeat-x 0 0 #111; } .sortPagiBar .nbrItemPage {margin-left:40px;} .sortPagiBar .PrductSort {float:left;} .sortPagiBar .nbrProduct { display:inline-block; padding:0 10px; } .sortPagiBar #nb_item {border:1px solid #ccc} /* pagination ********************************************************************************** */ form.pagination {display:none;} div.pagination { margin:10px 0; text-align: center } ul.pagination {list-style-type:none} ul.pagination li {display: inline;} ul.pagination a, ul.pagination span { display:inline-block; height:24px; width:24px; border:1px solid #eee; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:11px/24px Arial,Verdana,sans-serif; color:#999 } ul.pagination a { text-align:center; } ul.pagination a:hover { color:#333; border:1px solid #333 } ul.pagination .current span { color:#000; border:1px solid #fff } ul.pagination li.disabled span {color:#ccc} #pagination_previous {float:left} #pagination_next {float:right} .ie7 #pagination_previous, .ie7 #pagination_next {float:none} #pagination_previous a, #pagination_previous span, #pagination_next a, #pagination_next span { padding:0 8px; width:auto; } #pagination_previous span, #pagination_next span { color:#ccc; border:1px solid #eee } /* CART steps *********************************************************************** */ ul#order_step { background-color: white;} ul.step { list-style-type:none; margin-bottom:30px; height:52px; width:757px } ul.step li { float:left; height:52px; width:151px; text-align:center; text-transform:uppercase; background:url(../img/step_standard.gif) no-repeat center bottom transparent } ul.step li a, ul.step li.step_current span, ul.step li.step_current_end span { display:inline-block; padding:8px 10px 12px; color:#000; background:url(../img/step_current_span.gif) no-repeat center bottom transparent } ul.step li.step_current { font-weight:bold; background:url(../img/step_current.gif) no-repeat center bottom transparent } ul.step li.step_current_end { font-weight:bold; background:url(../img/step_end_current.gif) no-repeat center bottom transparent } ul.step li.step_todo span { display:inline-block; padding:8px 10px 6px; color:#999; text-shadow:0 1px 0 #fff; background:#eee } ul.step li.step_done { font-weight:bold; background:url(../img/step_done.gif) no-repeat center bottom transparent } /*ul.step li#step_end {background:url(../img/step_end.gif) no-repeat center bottom transparent}*/ /* module productcomments ********************************************************************** */ .rating { clear: both; display: block; margin: 2em; cursor: pointer; } .rating:after { content: '.'; display: block; height: 0; width: 0; clear: both; visibility: hidden } .cancel, .star { overflow: hidden; float: left; margin:0 1px 0 0; width: 16px; height: 16px; text-indent: -999em; cursor: pointer } .cancel, .cancel a { background: url(../../../modules/productcomments/img/delete.gif) no-repeat 0 -16px !important } .star, .star a { background: url(../../../modules/productcomments/img/star.gif) no-repeat 0 0 } .cancel a, .star a { display: block; width: 100%; height: 100%; background-position: 0 0 } div.star_on a { background-position: 0 -16px } div.star_hover a, div.star a:hover { background-position: 0 -32px } .pack_content { margin: 10px 0 10px 0 } .pack_price { float: right; margin-right: 3px; font-size: 12px } .confirmation { margin: 0 0 10px; padding: 10px; border: 1px solid #e6db55; font-size: 13px; background: none repeat scroll 0 0 #ffffe0; } #page .rte { background: transparent none repeat scroll 0 0 } .listcomment { list-style-type:none; margin:0 0 20px 0 !important; } .listcomment li { padding:10px 0; border-bottom:1px dotted #ccc; color:#666 } .listcomment .titlecomment { display:block; font-weight:bold; font-size:12px; color:#333 } .listcomment .txtcomment { display:block; padding:5px 0; color:#333 } .listcomment .authorcomment {} /* ************************************************************************************************ HEADER ************************************************************************************************ */ #header {position:relative;} #header_logo { position: absolute; top: 30px; z-index: 1; } #header_right { position:relative; float: right } /* ************************************************************************************************ BREADCRUMB ************************************************************************************************ */ .breadcrumb { margin-bottom:10px; font-size:12px } .breadcrumb .navigation-pipe {margin:0 3px 0 5px} .breadcrumb img { position:relative; top:5px } /* ************************************************************************************************ FOOTER ************************************************************************************************ */ #footer { color:#fff; background:#4D4D4D; width: 99.8%; height:250px; padding-right:2px; } .blockcategories_footer, #footer .myaccount , #block_various_links_footer, #social_block, #block_contact_infos { float:left; width:175px } .blockcategories_footer {margin-left:0} #footer .title_block { padding-bottom: 10px; text-transform:uppercase } #footer .title_block , #footer .title_block a { font-weight:normal; font-size:14px; color:#fff } #footer a {color:#fff} #footer a:hover {text-decoration:underline} #footer ul { padding-left: 0px; list-style-type: none; } #footer li {padding:7px 0} #footer li a {color:#fff} #footer .myaccount {padding: 15px 10px} #footer .myaccount .title_block, #footer .myaccount h4 { padding:0 0 10px 0; background:none; text-shadow:none } #footer .myaccount .favoriteproducts img, #footer .myaccount .lnk_wishlist img {display:none} /* ************************************************************************************************ PRODUCT PAGE ************************************************************************************************ */ /* BLOCK idTabs ******************************************************************************** */ .idTabs { list-style-type: none; /* margin-top: 20px; */ border-bottom: 8px solid #4D4D4D; } ul.idTabs li { float: left; margin-right: 1px } .idTabs a { display:block; padding:10px 10px 7px 10px; font-weight:bold; text-decoration:none; color:#fff; background:#4D4D4D; box-shadow:0.3px 1px 1px #363636; } .idTabs .selected { color:#000; background: url(../img/bg_li_idTabs.png) repeat-x 0 0 } #more_info_sheets {padding-top:10px} #more_info_sheets ul, #more_info_sheets ol, #more_info_sheets dl {margin-left:20px} #more_info_sheets em {font-style:italic} #more_info_sheets .product_desc{ margin-top:5px } #more_info_sheets .product_desc .product_image{ float:left } #more_info_sheets .product_desc .block_description{ float:left; margin-left:10px; width:420px } #more_info_sheets .product_desc .clear_product_desc{ clear:both; height:0px; line-height:0px } /* Make sure lists are correctly displayed in tinyMCE BO edition mode too */ #short_description_content ul, #short_description_content ol, #short_description_content dl, #tinymce ul, #tinymce ol, #tinymce dl {margin-left:20px} .block_hidden_only_for_screen {display:none} /* ************************************************************************************************ PAGE AUTHENTIFICATION ************************************************************************************************ */ #authentication #left_column {display:none} #authentication #center_column{ width:757px; height:450px; } /* ************************************************************************************************ PAIMENT - PAGE ORDER ************************************************************************************************ */ /* nav bottom ********************************************************************************** */ #order #left_column , #order-confirmation #left_column {display:none} #order #center_column, #order-confirmation #center_column{width:757px} .cart_navigation {margin:20px 0} .cart_navigation .exclusive, .cart_navigation .exclusive_large { float:right } .cart_navigation .button, .cart_navigation .button_large { border-color:#ccc; background-image:url(../img/bg_bt_2.gif) } /* step 1 - cart ******************************************************************************* */ .cart_last_product {display:none} /*p.cart_navigation .multishipping-button { margin-right: 10px }*/ #order-detail-content {margin-bottom:20px} table#cart_summary th { padding:14px 12px; color:#fff; font-weight:bold; text-transform:uppercase; text-shadow:0 1px 0 #666; background:url(../img/bg_table_th.png) repeat-x 0 -15px #999 } table#cart_summary th.cart_product {text-align:center} table#cart_summary td { padding:12px; border-right:1px solid #e9e9e9; border-bottom:1px solid #e9e9e9; font-weight:bold; font-size:12px; vertical-align:top } table#cart_summary td.cart_delete, table#cart_summary td.price_discount_del {border-right:none;text-align: center} table#cart_summary .last_item td {border-bottom:1px solid #999} table#cart_summary tr.cart_item.odd, table#cart_summary tr.cart_total_delivery, table#cart_summary tr.cart_total_price, table#cart_summary tr.cart_total_voucher{ background-color: #fff } table#cart_summary tr.cart_item.even { background-color: #f3f3f3 } table#cart_summary tr.customization.odd { background-color: #fff } table#cart_summary tr.customization.even { background-color: #f3f3f3 } table#cart_summary tr ul { list-style: none; } table#cart_summary .cart_product { width:80px; text-align:center } table#cart_summary tbody tr:last-child td { border-bottom: 1px solid #999; } table#cart_summary tbody tr td.cart_discount_delete { padding-left: 34px; } table#cart_summary .cart_product img {border:1px solid #ccc} table#cart_summary .cart_description { width:230px; } table#cart_summary .cart_unit {width:130px;text-align: center} table#cart_summary td.cart_unit {text-align: right} table#cart_summary .cart_quantity {width:130px} table#cart_summary .customization .cart_quantity {padding: 8px 12px 0;} .cart_quantity .cart_quantity_input { float:left; margin-left: 5px; width: 20px; border:1px solid #fff } .cart_quantity .cart_quantity_button { float:left; position: relative; top: -5px } table#cart_summary .cart_total {width:120px;text-align: center} table#cart_summary td.cart_total {text-align: right} table#cart_summary .cart_delete { width:64px; text-align:center } table#cart_summary .cart_discount_price {text-align: right} .cart_delete a.cart_quantity_delete, a.price_discount_delete { display:inline-block; padding:1px 2px; font-size:8px; color:#666; text-transform:uppercase; text-shadow:0 1px 0 #fff; background:#ccc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px } .cart_total_price .total_price_container { border-right:none; } table#cart_summary .cart_total_price td.cart_voucher { border-bottom:1px solid #999; vertical-align:middle } table#cart_summary #total_price_container { border-bottom:1px solid #999; border-right: none; } .cart_voucher .title_block, .cart_voucher h4 .cart_voucher p {float:left;} .cart_voucher .title_block, .cart_voucher h4 { margin-right:12px; padding:5px 0; font-size:13px } .cart_voucher p {padding-bottom:0;} .cart_voucher p.discount_name_block {float:left;} .cart_voucher #display_cart_vouchers { clear:both; line-height: 20px; color:#666; padding-top:2px; font-weight:normal; border-top:1px dotted #ccc } .cart_voucher .title_offers { margin-top:15px; margin-bottom:5px } .cart_voucher #display_cart_vouchers span { font-weight:bold; cursor:pointer; } .cart_voucher input.discount_name { padding:0 5px; height:22px; width:170px;/* 180 */ border:1px solid #ccc; font-weight:normal; background:url(../img/bg_discount_name.png) repeat-x 0 0 #fff } .cart_voucher .submit input.button { margin-left:2px; padding:2px; height:24px; border:1px solid #000; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; color:#fff; text-transform:uppercase; text-shadow:0 -1px 0 #333; background:url(../img/bg_cart_voucher_submit.png) repeat-x 0 0 #000 } #cart_summary .price { border-right:none; text-align: right; white-space: nowrap; } .total_price_container p {text-align: left} table#cart_summary .cart_total_price .total_price_container { padding:0; border-bottom:1px solid #999; border-right:1px solid #999; } .cart_total_price .total_price_container p { display:block; padding:8px; font-weight:bold; color:#fff; text-transform:uppercase; background:#333 } .cart_total_price .total_price_container span { display:block; padding:15px; font-weight:bold; font-size:18px; text-align:center } #order_carrier { clear:both; margin-top:20px; border:1px solid #999; background:#fff } #order_carrier .title_block { padding:0 15px; height: 29px; font-weight: bold; line-height:29px; color:#fff; font-weight:bold; text-transform:uppercase; background:url(../img/bg_table_th.png) repeat-x 0 -10px #999 } #order_carrier span { display:block; padding:15px; font-weight:bold } .order_delivery .first_item {margin-right:35px;} .multishipping_close_container { text-align: center; } table#cart_summary .gift-icon { color: white; background: #0088CC; line-height: 20px; padding: 2px 5px; border-radius: 5px; } /* step 2 - authentification ******************************************************************* */ #create-account_form, #authentication #login_form { clear: none; float: left; height: 20em; width: 49%; } #create-account_form {margin-right: 11px;} #authentication #create-account_form fieldset, #authentication #login_form fieldset { min-height: 200px } #authentication #create-account_form .form_content, #authentication #login_form .form_content { padding:15px 10px } #create-account_form h3, #authentication #login_form h3 { padding:8px; border-bottom:1px solid #ccc; font-weight:bold; font-size:12px; color:#fff; text-transform:uppercase; background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898 } #create-account_form .title_block { padding-bottom:22px; font-size:11px; color:#333 } #create-account_form label, #login_form label { display:inline-block; width:110px; color:#666 } #order-opc #login_form_content label { display:block; margin:0 0 10px 0 } #create-account_form #email_create, #login_form #email, #login_form #passwd, #login_form #login_email, #login_form #login_passwd { padding:0 5px; height:20px; width:220px;/* 230 */ border:1px solid #ccc; color:#666; background:url(../img/bg_discount_name.png) repeat-x 0 0 #fff; line-height:20px; } #create-account_form #SubmitCreate, #login_form #SubmitLogin { float:right } .lost_password { float:left; width:200px } .lost_password a {color:#666} #order-opc .lost_password { display:block; float:none; margin:5px 0 10px; width:auto; font-size:11px; color:#666 } #ordermsg p {padding-bottom:0} #ordermsg p.txt { float:left; margin-right:25px; width:220px } /*#ordermsg .textarea {float:right}*/ #ordermsg .textarea textarea { height:90px; width:475px; border:1px solid #ccc } /* step 3 - address ************************************************************************** */ .address-form-multishipping { padding: 10px 0px; } #multishipping_mode_box { border: 1px solid #D0D3D8; background: url("../img/form_bg.jpg") repeat-x scroll left top #D0D1D5; margin-bottom: 10px; padding: 5px; } #multishipping_mode_checkbox { vertical-align: middle; margin-right: 5px; } #multishipping_mode_box.on { border: 1px solid #ddd; } #multishipping_mode_box .title { padding: 5px; font-weight: bold; } #multishipping_mode_box .description, #multishipping_mode_box .description_off { padding: 5px; } #multishipping_mode_box .description_off { display: none; padding: 5px; } #multishipping_mode_box .description_off div { margin-bottom: 10px; } #multishipping_mode_box .description_off a, #multishipping_mode_box .description a { display: block; text-align: center; text-decoration: none; padding: 5px 10px; margin: 0 160px; border: 1px solid #ccc; background: #ddd; } #multishipping_mode_box .description_off a:hover, #multishipping_mode_box .description a:hover { background: #f3f3f3; border: 1px solid #ccc; } #multishipping_mode_box.on .description_off { display: block; } /* step 4 - paiement ************************************************************************** */ .delivery_options { border: 1px solid #BDC2C9; border-top: 0; } #order .delivery_options_address h3, #order-opc .delivery_options_address h3 { /*background: url("../img/table_header.gif") no-repeat; color: #374853; font-weight: bold; height: 14px; padding: 5px 10px; margin: 10px 0 0 0;*/ padding: 6px 11px; font-size: 12px; color: #fff; text-shadow: 0 1px 0 #000; text-transform: uppercase; background: none repeat scroll 0 0 #383838; } #order .delivery_option_radio, #order-opc .delivery_option_radio { float: left; margin: 21px 12px; } #order .delivery_option label, #order-opc .delivery_option label { display: block; padding-bottom: 5px; padding-top: 5px; } #order .delivery_option label > table.resume, #order-opc .delivery_option label > table.resume { height: 46px; width: 685px; } #order .delivery_option.item, #order-opc .delivery_option.item { background: #fafafa; } #order .delivery_option.alternate_item, #order-opc .delivery_option.alternate_item { border-top: 1px solid #bdc2c9; background: #f1f2f4; border-bottom: 1px solid #bdc2c9; } #order .delivery_option label > table.resume td, #order-opc .delivery_option label > table.resume td { padding: 0 8px; } #order .delivery_option label > table.resume td + td, #order-opc .delivery_option label > table.resume td + td { width: 300px; } #order .delivery_option label > table.resume td + td + td, #order-opc .delivery_option label > table.resume td + td + td { width: 100px; text-align: right; } #order .delivery_option_carrier td {width:200px} #order .delivery_option_carrier td + td {width:280px;} #order .delivery_option_carrier td + td + td {width:200px} #order .delivery_options_address .delivery_option_logo, #order .delivery_option_carrier .delivery_option_logo, #order-opc .delivery_options_address .delivery_option_logo { padding-left:10px; width: 160px; } #order .delivery_options_address .delivery_option_logo img, #order-opc .delivery_options_address .delivery_option_logo img { /*height: 40px;*/ } #order .delivery_option_carrier .first_item, #order-opc .delivery_option_carrier .first_item { padding: 3px 5px 3px 12px; background:url(../img/arrow_right_2.png) no-repeat 3px 7px } .order_carrier_content { padding:15px; border:1px solid #ccc; font-size:12px; color:#000; background:#f8f8f8 } .order_carrier_content h3 { padding:15px 0 10px 0; font-size:13px; color:#000 } .order_carrier_content h3.carrier_title {padding-top:0} .order_carrier_content input { position:relative; top:1px } #carrierTable { border:1px solid #999; border-bottom:none; background:#fff } #carrierTable tbody{ border-bottom:1px solid #999; } #carrierTable th { padding:0 15px; height: 29px; font-weight: bold; line-height:29px; color:#fff; text-transform:uppercase; background:url(../img/bg_table_th.png) repeat-x 0 -10px #999 } #carrierTable td { padding:15px; font-weight:bold; border-right:1px solid #e9e9e9 } #carrierTable td.carrier_price {border:none} #gift_div { display:none; padding-bottom:10px } #gift_div label { display:block; margin-bottom:5px } #gift_div #gift_message { height:50px; width:720px; border:1px solid #999 } a.iframe {font-weight:bold} .hook_extracarrier { margin-top: 5px; padding: 5px; } /* step 5 - paiement ************************************************************************** */ .paiement_block { padding:15px; border:1px solid #ccc; font-size:12px; color:#000; background:#f8f8f8 } .payment_module { position:relative; padding-top:20px; border-top:1px dotted #ccc; text-transform:uppercase; } .payment_module a {display:block;} .payment_module img { float:left; margin-right:10px } /*.payment_module span { position:absolute; top:50px; left:145px }*/ .payment_module:before, .payment_module:after { content: "."; display: block; height: 0; overflow: hidden } .payment_module:after {clear: both} .payment_module {zoom: 1} /* ************************************************************************************************ PAGE ORDER-OPC ************************************************************************************************ */ #order-opc #left_column {display:none} #order-opc #center_column{width:757px} #order-opc h2 {} #order-opc h2 span { display:inline-block; padding:5px 7px; color:#fff; background:#333; } #order-opc #login_form fieldset { background: none repeat scroll 0 0 #FFFFE0; border: 1px solid #E6DB55; font-size: 13px; margin: 0 0 10px; padding: 10px; } #order-opc #login_form fieldset p {padding:0} #order-opc #login_form fieldset p a {padding:0} #order-opc #new_account_form p.submit { margin-right: 120px; text-align:right } #order-opc #new_account_form p.opc-required {margin-left:20px} #order-opc .addresses {margin-bottom:20px} #order-opc #opc_delivery_methods h3 {margin-top:20px;} #order-opc #opc_delivery_methods textarea { height:60px; width:723px; border:1px solid #ccc } #order-opc #opc_delivery_methods #message { width: 757px; } #order-opc #opc_payment_methods {margin-bottom:20px} #order-opc #opc_payment_methods #opc_payment_methods-content p{margin:0} .delivery_option_carrier td {width:200px} .delivery_option_carrier td + td {width:280px;} .delivery_option_carrier td + td + td {width:200px} .delivery_option_carrier { margin: 5px 0 0 45px; width: 670px; display: none; } .delivery_option_carrier tr td { padding: 5px; } .delivery_option_carrier.selected { display: table; } .delivery_option_carrier.not-displayable { display: none; } .delivery_option_title { font-weight: bold; } /* ************************************************************************************************ express checkout ************************************************************************************************ */ #new_account_form {clear:both;margin-bottom: 20px} #new_account_form h3 { margin-bottom:20px; padding:8px; border-bottom:1px solid #ccc; font-weight:bold; font-size:12px; color:#fff; text-transform:uppercase; background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898 } #center_column #new_account_form p { margin:0; padding:0 0 10px 0 } #new_account_form p.required {color:#222} #new_account_form p.required sup {color:#990000} #new_account_form p.radio span, #new_account_form p.text label, #new_account_form p.password label, #new_account_form p.select label, #new_account_form p.select span, #new_account_form p.textarea label { display: inline-block; padding: 6px 15px; width: 230px; font-size: 14px; text-align: right } #new_account_form p.radio label { float:none; padding-right:10px; width:auto; font-size:14px; } #new_account_form p.checkbox label { float: none; width: auto; font-size: 12px; } #new_account_form p.text input, #new_account_form p.password input, #new_account_form p.select input { height:22px; padding:0 5px; width:360px; border:1px solid #ccc; font-size:12px; color:#666 } #new_account_form p.checkbox input {margin-left: 260px;} #new_account_form #submitGuestAccount {float: right} /* ************************************************************************************************ */ /* ************************************************************************************************ paiment - CONFIRMATION ************************************************************************************************ */ #orderconfirmation #left_column {display:none} #orderconfirmation #center_column{width:757px} /* ************************************************************************************************ PAGE PASSWORD ************************************************************************************************ */ #form_forgotpassword fieldset { padding: 10px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: #eee } #form_forgotpassword p.text label { display: inline-block; padding-right: 10px; width: 174px; font-weight: bold; font-size: 12px; text-align: right } #form_forgotpassword p.text input { padding: 0 5px; height: 20px; width: 288px; border: 1px solid #ccc; background: url(../img/bg_input.png) repeat-x 0 0 #fff } #form_forgotpassword p.submit { margin-right:25px; padding-bottom:5px; text-align:right } #password .icon { position:relative; top:6px; } /* ************************************************************************************************ PAGE ADRESSES ************************************************************************************************ */ #addresses #left_column {display:none} #addresses #center_column{width:757px} #address p.inline-infos { margin:0 0 0 265px !important; font-size:12px; color:#666; } /* ************************************************************************************************ PAGE ADD ADRESS ************************************************************************************************ */ #address #left_column {display:none} #address #center_column{width:757px} form#add_address {} #add_address fieldset { margin:0; border:1px solid #ccc; background:#F8F8F8 } #add_address h3 { margin:0 0 15px 0; padding:8px; font-size:14px; color:#fff; text-transform:uppercase; background:url(../img/bg_form_h3.png) repeat-x 0 0 #989898 } #center_column #add_address p {margin:0; padding:0 0 10px 0} #add_address p.required {color:#222} #add_address p.required sup {color:#990000} #add_address p.text label, #add_address p.password label, #add_address p.select label, #add_address p.select span, #add_address p.textarea label { display:inline-block; padding:6px 15px; width:230px;/* 260 */ font-size:14px; text-align:right } #add_address p.text input, #add_address p.password input, #add_address p.select input { padding:0 5px; height:22px; width:360px;/* 370 */ border:1px solid #ccc; font-size: 12px; color:#666; line-height:22px } #add_address p.checkbox input { margin-left:260px; } #add_address p.select select { margin-right:10px; border:1px solid #ccc; font-size: 12px; color:#666 } #add_address p.textarea label {vertical-align:top} #add_address p.textarea textarea { height:80px; width:370px; border:1px solid #ccc; font-size: 12px; color:#666 } #center_column #add_address p.submit2 { margin-top:20px; text-align:right } #add_address span.form_info, #add_address span.inline-infos { display:block; margin:5px 0 0 265px; color:#666 } /* ************************************************************************************************ PAGE ORDER-SPLIP ************************************************************************************************ */ #order-slip #left_column {display:none} #order-slip #center_column{width:757px} #order-slip #order-list {border-bottom:1px solid #999} #order-slip #order-list td { border-top: 1px solid #ccc; border-bottom:none } #order-slip #order-list td.history_invoice {border-right:none} /* ************************************************************************************************ PAGE DISCOUNT ************************************************************************************************ */ #discount #left_column {display:none} #discount #center_column{width:757px} #discount .table_block tr.last_item td {border-bottom:1px solid #999} #discount .table_block td.discount_expiration_date {border-right:1px solid #999} #discount .table_block td.discount_value {white-space:nowrap} /* ************************************************************************************************ PAGE ORDER FOLLOW ************************************************************************************************ */ #order-follow #left_column {display:none} #order-follow #center_column{width:757px} /* ************************************************************************************************ PAGE NEW-PRODUCTS ************************************************************************************************ */ #newproducts .sortPagiBar {margin-bottom:20px} /* ************************************************************************************************ PAGE BEST SALES ************************************************************************************************ */ #bestsales .sortPagiBar {margin-bottom:20px} /* ************************************************************************************************ PAGE PRICES DROP SALES ************************************************************************************************ */ #pricesdrop .sortPagiBar {margin-bottom:20px} /* ************************************************************************************************ PAGE MANUFACTURER ************************************************************************************************ */ #manufacturer .nbrmanufacturer { margin: 15px 0 10px; padding: 8px 7px; font-size:12px; color: #000; background: none repeat scroll 0 0 #f0f0f0 } #manufacturer #product_list {margin-top:15px} ul#manufacturers_list {list-style-type:none} ul#manufacturers_list li { margin-bottom: 14px; padding: 12px 8px; border: 1px solid #eee; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius:3px; } ul#manufacturers_list li a.lnk_img { display: block; float: left; } ul#manufacturers_list li img { display: block; float: left; margin-right: 14px; border: 1px solid #ccc; vertical-align: bottom } ul#manufacturers_list li h3 { padding: 0 0 10px; font-size: 13px; color: #000 } ul#manufacturers_list li .description { overflow: hidden; padding: 0; font-size:12px; color:#666 } ul#manufacturers_list li .right_side {float:right;} .description_box { border: 1px solid #CCCCCC; border-radius: 3px 3px 3px 3px; box-shadow: 0 1px 1px #E2E2E2; padding: 5px; margin-bottom: 20px; font-size: 12px; line-height: 18px; } .description_box p { margin: 0; padding: 0 10px 5px; } .description_box .hide_desc { display: none; } .description_box .lnk_more { background: url("../img/arrow_right_1.png") no-repeat scroll 100% 4px transparent; color: #0088CC; padding: 0 10px; } .description_box ul { padding-left: 30px; padding-bottom: 10px; } /* ************************************************************************************************ PAGE SUPPLIER ************************************************************************************************ */ #supplier .nbrmanufacturer { margin: 15px 0 10px; padding: 8px 7px; font-size:12px; color: #000; background: none repeat scroll 0 0 #f0f0f0 } ul#suppliers_list {list-style-type:none} ul#suppliers_list li { margin-bottom: 14px; padding: 12px 8px; border: 1px solid #eee; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius:3px; } ul#suppliers_list li a.lnk_img { display: block; float: left; } ul#suppliers_list li img { display: block; float: left; margin-right: 14px; border: 1px solid #ccc; vertical-align: bottom } ul#suppliers_list li h3 { padding: 0 0 10px; font-size: 13px; color: #000 } ul#suppliers_list li .description { overflow: hidden; padding: 0; font-size:12px; color:#666 } ul#suppliers_list li .right_side {float:right;} /* ************************************************************************************************ PAGE SEARCH ************************************************************************************************ */ #search h3.nbresult { margin:0 0 10px 0; padding:10px; border:1px solid #e6db55; font-size:13px; background:#ffffe0 } #search .sortPagiBar {margin-bottom:20px} /* ************************************************************************************************ PAGE 404 ************************************************************************************************ */ #pagenotfound #left_column, #pagenotfound #right_column, #pagenotfound #footer {display:none} #pagenotfound #left_column, #pagenotfound #right_column, #pagenotfound #footer {display:none} #pagenotfound #center_column {width:940px;} #pagenotfound .pagenotfound { padding:30px 300px 0 0; height:330px; font-size:14px; background:url(../img/bg_404.png) no-repeat 100% 0 } #pagenotfound h3 { font-weight:normal; font-size:14px } #pagenotfound fieldset {border:none} #pagenotfound fieldset label {color:#333} #pagenotfound #search_query { -moz-border-bottom-colors: none; -moz-border-image: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-bottom: 1px solid #666; border-left: 1px solid #666; border-right: 1px solid #fff !important; border-top: 1px solid #666; padding: 0 5px; height: 24px; width: 200px; color: #ccc; background: url(../../../modules/blocksearch/img/bg_search_input.png) repeat-x scroll 0 0 #fff } #pagenotfound .button_small { padding: 4px 7px; border: medium none; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; color: #fff; text-transform: uppercase; background: url("../../../modules/blocksearch/img/bg_search_submit.png") repeat-x scroll 0 0 #101010 } #pagenotfound .pagenotfound a { font-weight:bold; color:#333 } #pagenotfound .pagenotfound .icon { position:relative; top:3px } /* ************************************************************************************************ addons payment cheque ************************************************************************************************ */ #module-cheque-payment #left_column {display:none} #module-cheque-payment #center_column{width:757px} /* ************************************************************************************************ addons payment bankwire ************************************************************************************************ */ #module-bankwire-payment #left_column {display:none} #module-bankwire-payment #center_column{width:757px} /* ************************************************************************************************ addons google checkout ************************************************************************************************ */ #module-gcheckout-payment #left_column {display:none} #module-gcheckout-payment #center_column{width:757px} /* ************************************************************************************************ addons paypal ************************************************************************************************ */ #module-payment-submit #left_column {display:none} #module-payment-submit #center_column{width:757px} /* ************************************************************************************************ addons cashondelivery validation ************************************************************************************************ */ #module-cashondelivery-validation #left_column {display:none} #module-cashondelivery-validation #center_column{width:757px} /* ************************************************************************************************ addon RerversoForm ************************************************************************************************ */ #account-creation_form fieldset.reversoform {padding:10px !important} #account-creation_form fieldset.reversoform .text label{ display:block; padding:0 0 10px 0; width:100%; text-align:left; } #account-creation_form fieldset.reversoform .infos-sup { padding:0 !important; font-size:10px; font-style:italic; text-align:right } /* ************************************************************************************************ addon customer privacy ************************************************************************************************ */ #account-creation_form fieldset.customerprivacy label, fieldset.customerprivacy label{ padding-bottom:0; font-size:14px; text-align:left; cursor:pointer } /* ************************************************************************************************ addon referralprogram ************************************************************************************************ */ #module-referralprogram-referralprogram-program #left_column {display:none} #module-referralprogram-referralprogram-program #center_column{width:757px} #footer .myaccount li.referralprogram img {display:none} #module-referralprogram-referralprogram-program .sheets {padding-top:10px} #module-referralprogram-referralprogram-program form p.checkbox {font-weight:bold} #module-referralprogram-referralprogram-program form p.checkbox a {text-decoration:underline} #module-referralprogram-referralprogram-program form p.submit {text-align:right} #module-referralprogram-referralprogram-program form p.see_email { padding-left:10px; color: #0088cc; background:url(../img/arrow_right_1.png) no-repeat 0 4px; } #module-referralprogram-referralprogram-program form p.see_email a { color: #0088cc; text-decoration:underline } /* ************************************************************************************************ addon loyalty ************************************************************************************************ */ #module-loyalty-default #left_column {display:none} #module-loyalty-default #center_column{width:757px} #product p#loyalty { padding:10px 0 0 20px; border-top:1px solid #ccc; background:url(../img/icon/info.png) no-repeat 0 8px; margin-top: 10px; } #footer .myaccount li.loyalty img {display:none} /* ************************************************************************************************ addon Livezilla ************************************************************************************************ */ #livezilla_lnk { margin:10px 0; text-align: right } #livezilla_lnk a { display:inline-block; padding:6px 8px 8px 8px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; font:bold 10px Arial,Verdana,sans-serif; color:#fff; text-shadow: 0 -1px 0 #000; background: url(../img/bg_bt_compare.gif) repeat-x scroll 0 0 #000 } #livezilla_lnk a:hover {text-decoration:none} /* ************************************************************************************************ addons comments products ************************************************************************************************ */ form#sendComment fieldset{ padding:10px; border:1px solid #ccc; background:#eee } form#sendComment h3 {font-size:14px;} #new_comment_form p.text { margin-bottom: 0; padding-bottom: 0; } #sendComment p.text label, #sendComment p.textarea label { display: block; margin: 12px 0 4px; font-weight: bold; font-size: 12px; } #sendComment p.text input { padding: 0 5px; height: 28px; width: 498px; border: 1px solid #ccc; background: url(../img/bg_input.png) repeat-x 0 0 #fff; } #sendComment p.textarea textarea { height:80px; width:508px; border:1px solid #ccc; } #sendComment p.submit { padding:0; text-align:right } #sendComment p.closeform { float:right; padding:0; height:12px; width:12px; text-indent:-5000px; background:url(../img/icon/delete.gif) no-repeat 0 0 } .star { position: relative; top:2px; float: left; height: 12px; width: 12px; overflow: hidden; text-indent: -999em; cursor: pointer } .star, .star a { background: url(../../../modules/productcomments/img/star.gif) no-repeat 0 0 } div.star_on a { background-position: 0 -12px } div.star_hover a, div.star a:hover { background-position: 0 -12px } /* ************************************************************************************************ xxxxx ************************************************************************************************ */ /* ************************************************************************************************ guest tracking ************************************************************************************************ */ #guest-tracking fieldset p:first-child { padding-top: 10px; } #guest-tracking fieldset p:last-child { padding-bottom: 10px; } /* ************************************************************************************************ CSS Modules ************************************************************************************************ */ /******* IMPORTANT - Internet Explorer can read 31 CSS files max. Some CSS have been put here and erased from their own module folder.************/ /*************** Block ADVERTISING ***************/ .advertising_block { width: 191px; margin-bottom: 1em; text-align: center } /*************** Block CATEGORIES ***************/ #categories_block_left li {border-bottom:1px dotted #ccc} #categories_block_left li.last { border:none;} #categories_block_left li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blockcategories/img/arrow_right_2.png) no-repeat 10px 10px transparent } #categories_block_left li ul {margin-left:40px} #categories_block_left li ul li {border:none} #categories_block_left li ul li a { padding-left:0; background:none } #categories_block_left li .OPEN, #categories_block_left li .CLOSE { display:block; float:right; margin:10px 10px 0; height:9px; width:9px; background:url(../../../modules/blockcategories/img/icon/open-close.png) no-repeat 0 -9px; cursor:pointer } #categories_block_left li .CLOSE {background-position:0 0} /* footer */ .blockcategories_footer { padding:15px 10px; } .blockcategories_footer .category_footer {float:left;clear:none;} .blockcategories_footer .category_footer .list{float:left;} .blockcategories_footer ul ul {display:none !important} /*************** Block CMS ***************/ /* footer */ #footer .block_various_links {padding:15px 10px;} /* Block CMS links */ .informations_block_left li {border-bottom:1px dotted #eee} .informations_block_left li.last {border:none;} .informations_block_left li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blockcms/img/arrow_right_2.png) no-repeat 10px 10px transparent; } tr.subitem > td:first-child + td { padding-left: 10px; } /*************** Block CONTACTINFOS ***************/ #block_contact_infos {padding:15px 10px;} #block_contact_infos li { padding:0 !important; line-height: 20px; } #block_contact_infos li strong { font-weight:normal; font-size:13px; } #block_contact_infos li pre {font: 11px/20px Arial,Verdana,sans-serif;} /*************** Block LINK ***************/ #links_block_left .block_content li {border-bottom:1px dotted #eee} #links_block_left .block_contentt li.last {border:none;} #links_block_left .block_content li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blocklink/img/arrow_right_2.png) no-repeat 10px 10px transparent; } /*************** Block MANUFACTURER ***************/ .blockmanufacturer li {border-bottom:1px dotted #ccc} .blockmanufacturer li.last { border:none;} .blockmanufacturer li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blockmanufacturer/img/arrow_right_2.png) no-repeat 10px 10px transparent } .blockmanufacturer form {margin-top:10px;} .blockmanufacturer p { padding:0; text-align:center; } /*************** Block LOGO PAYMENT ***************/ .paiement_logo_block { width: 191px; text-align: center; margin-bottom: 1.5em } .paiement_logo_block a { text-decoration: none } .paiement_logo_block img { margin: 0 0.5em } /*************** Block RSS ***************/ #rss_block_left p { margin:0; padding:10px; } #rss_block_left li {border-bottom:1px dotted #ccc} #rss_block_left li.last { border:none;} #rss_block_left li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blockrss/img/arrow_right_2.png) no-repeat 10px 10px transparent } /*************** Block SOCIAL ***************/ #social_block {padding:15px 10px;} #social_block li {padding-left:22px !important;} #social_block li.facebook {background:url(../../../modules/blocksocial/img/sprite_pict_social_block.png) no-repeat 0 6px;} #social_block li.twitter {background:url(../../../modules/blocksocial/img/sprite_pict_social_block.png) no-repeat 0 -26px;} #social_block li.rss {background:url(../../../modules/blocksocial/img/sprite_pict_social_block.png) no-repeat 0 -56px;} /*************** Block STORE ***************/ .blockstore img { margin: 10px 0 0 0} .blockstore p { padding-bottom:0; font-weight:bold; text-align: right } .blockstore p.store_image { padding-bottom:10px; text-align:center } /*************** Block SUPPLIER ***************/ .blocksupplier li {border-bottom:1px dotted #ccc} .blocksupplier li.last { border:none;} .blocksupplier li a { display:block; padding:7px 11px 5px 22px; color:#333; background:url(../../../modules/blocksupplier/img/arrow_right_2.png) no-repeat 10px 10px transparent } .blocksupplier form {margin-top:10px;} .blocksupplier p { padding:0; text-align:center } .ie7 #featured-products_block_center .product_image span.new {top:110px;right:0;width:94%} .ie8 #featured-products_block_center .product_image span.new{top:110px;right:0;width:94%} .lt-ie6 #featured-products_block_center .product_image span.new {top:110px;right:0;width:94%} #new-products_block_left dd { padding: 0 0 10px 0; border-bottom: 1px dotted #ccc; margin: 0px; } #new-products_block_left li.first { margin-left: 0px; } and product.css /* product desc */ /* primary_block ***************************************************************************** */ #primary_block { margin-top:15px; } /* pb-right-column ***************************************************************************** */ #pb-right-column { float:left; width:266px; } #pb-right-column #image-block { position:relative; } #pb-right-column #image-block img { border:1px solid #cdcdcd; } #pb-right-column #image-block #view_full_size { display:block; cursor:pointer; } #pb-right-column #image-block #view_full_size .span_link { position:absolute; bottom:10px; left:32%; display:block; padding:0 12px 0 30px; line-height:20px; color:#fff; text-shadow:0 1px 0 #000; text-align:center; text-transform:uppercase; background-image:url(../img/icon/zoom.png); background-repeat:no-repeat; background-position:10px 2px; background-color:#000; background-color:rgba(0,0,0,0.5); border-radius:12px; -moz-border-radius:12px; -webkit-border-radius:12px; } #pb-right-column #image-block #view_full_size .span_link img { position:relative; top:3px; left:-3px; border:none; padding-right:2px; } /* miniatures */ #pb-right-column #views_block { margin-top:10px; width:266px; } #thumbs_list { float:left; overflow:hidden; margin-left:4px; width:216px; } #thumbs_list ul#thumbs_list_frame { list-style-type:none; padding-left:0; } #thumbs_list li { float:left; height:60px; width:72px; cursor:pointer; } #thumbs_list li img { margin:0 6px; border:1px solid #cdcdcd; } span.view_scroll_spacer { float:left; height:16px; width:21px; } #view_scroll_left,#view_scroll_right { float:left; margin-top:20px; padding:0 4px; height:18px; width:9px; text-indent:-3000px; background:url(../img/thumbs_left.gif) no-repeat center center transparent; } #view_scroll_right { margin-left:4px; background-image:url(../img/thumbs_right.gif); } .resetimg { padding:10px 0 0; } /* link list */ #usefull_link_block { display: none; list-style-type:none; margin-top:20px; } #usefull_link_block li { padding:2px 0; } #usefull_link_block li.print { padding-left:20px; background:url(../img/icon/print.gif) no-repeat 0 0; } #usefull_link_block li.sendtofriend { padding-left:20px; background:url(../img/icon/send_friend.gif) no-repeat 0 0; } #usefull_link_block li#left_share_fb { padding-left:20px; background:url(../img/icon/picto_fb.png) no-repeat 0 0; } /* pb-left-column ****************************************************************************** */ #pb-left-column { float:left; margin-left:14px; width: 455px; } #pb-left-column h1 { padding-bottom:5px; font-size:18px; } #pb-left-column #short_description_block { color:#666; } #pb-left-column #short_description_block .buttons_bottom_block { display:none; } /* form */ #pb-left-column #buy_block { margin-top:10px; } #buy_block p { display: block; float: left; margin-top: 5px; padding-bottom: 0px; } #pb-left-column #buy_block label { display:inline-block; width: 65px; font-weight:700; font-size:12px; text-align:right; } .ie7 #pb-left-column #buy_block label {margin-right:5px;float:left} /* short description pack */ .short_description_pack { display:none; } /* color_picker */ #pb-left-column #color_picker p { padding-bottom:5px; font-weight:700; } #attributes fieldset { padding-bottom:10px; } #attributes fieldset label { vertical-align:top; } #attributes .attribute_list { display:inline-block; } .ie7 #attributes .attribute_list { display:inline; zoom:1; float:right } #attributes .attribute_list ul{ list-style:none } #attributes .attribute_list ul li{ clear:both } #attributes .attribute_list input.attribute_radio{float: left;margin-left: 3px;} #attributes .attribute_list span{float: left;margin-bottom: 5px;margin-left: 3px;} .ie7 #attributes .attribute_list span{margin-top:1px} #attributes .attribute_list #color_to_pick_list { list-style-type:none; width:125px; } #attributes .attribute_list #color_to_pick_list li { float:left; margin:0 8px 8px 0; padding:1px; border:1px solid #ccc; clear:none } #attributes .attribute_list #color_to_pick_list li.selected { border:1px solid #000; } #attributes .attribute_list #color_to_pick_list a.color_pick { display:block; height:20px; width:20px; } .product_attributes { display: block; float: left; width: 130px; margin-top: 3px; margin-right: 10px; } /* attributes */ #attributes select { width:120px; border:1px solid #cdcdcd; } /* quantity_wanted */ #quantity_wanted_p input { width:50px; border:1px solid #cdcdcd; } /* availability_statut */ #availability_statut { margin: 10px 0 0 0; } #availability_statut span#availability_label, #availability_date_label { display:inline-block; width:125px; font-weight:700; font-size:12px; text-align:right; } #availability_statut #availability_value { background-color:green; color:#ffffff; text-shadow:none; padding:0 10px; text-transform: uppercase; font-size:10px; font-weight: bold; display:inline; } #availability_statut #availability_value.warning_inline { background-color:#9B0000; } /* prices */ .content_prices { display: block; width: 315px; float: left; margin-top: 5px; text-align:right; } .unit-price{font-size: 18px;padding: 2px 0 0 10px;} #buy_block p.price { padding:0; } .discount { display:none; } #buy_block p#old_price { padding-bottom:15px; font-size:14px; text-decoration:line-through; } .our_price_display { display: block; float: left; padding-bottom:10px; /* font-weight:700; */ font-size: 18px; line-height:18px; color:#9b0000; } #reduction_percent,#reduction_amount { display:block; float:right; margin-left:10px; padding:0 0 0 10px; font-weight:700; font-size:12px; color:#fff; background:url(../img/bg_reduction.png) no-repeat 0 0 transparent; } #reduction_percent span,#reduction_amount span { display:block; padding:1px 5px 1px 0; background:url(../img/bg_reduction.png) no-repeat 100% 0 transparent; } /* online_only */ #buy_block p.online_only { font-weight:700; font-size:11px; color:#900; text-align:left; text-transform:uppercase; } /* add_to_cart */ .content_prices #add_to_cart { display: block; float: right; margin-top: 0px; } .content_prices #add_to_cart .exclusive,.content_prices #add_to_cart .exclusive_disabled { height: 26px; padding: 5px 52px 5px 15px; margin-right:0px; box-shadow: .3px .3px 7px #000; } @media screen and (-webkit-min-device-pixel-ratio:0) { /*hack Chrome and Safari */ #add_to_cart .exclusive{ position: relative; float: right; color: #fff; border: 1px solid #25AAE1; outline: none; background: #25AAE1; padding: 10px 40px 25px 10px; cursor: pointer; } .content_prices #add_to_cart .exclusive,.content_prices #add_to_cart .exclusive_disabled { border: 1px solid #25AAE1; outline: none; width: 90px; background: #25AAE1; } } .ie9 .content_prices #add_to_cart .exclusive, .ie9 .content_prices #add_to_cart .exclusive_disabled, .ie8 .content_prices #add_to_cart .exclusive, .ie8 .content_prices #add_to_cart .exclusive_disabled, .ie7 .content_prices #add_to_cart .exclusive, .ie7 .content_prices #add_to_cart .exclusive_disabled { padding:8px 7px 4px 15px; line-height:12px; } :first-child+html .content_prices #add_to_cart .exclusive { padding:4px 3px 4px 11px; } .content_prices #add_to_cart span { } /* */ .buttons_bottom_block { /* clear:both; */ /* padding-top:20px; */ } .buttons_bottom_block #wishlist_button { font-weight:700; } /* SEND TO FRIEND (pop-in) ##################################################################### */ #send_friend_form { } #send_friend_form h2 { padding:8px 11px; font-size:12px; color:#fff; text-shadow:0 1px 0 #000; text-transform:uppercase; background:#383838; } #send_friend_form .product { margin:20px 10px; } #send_friend_form .product img { float:left; margin:0 10px 0 0; border:1px solid #ccc; } #send_friend_form .product .product_desc { float:left; width:380px; } #send_friend_form .product .product_desc p { padding:0 10px 0 0; color:#333; } #send_friend_form .product .product_desc p.product_name { font-size:12px; color:#000; } #send_friend_form .send_friend_form_content { margin:0 10px 20px; } #send_friend_form .form_container { padding:10px 15px; border:1px solid #ccc; background:#eee; } #send_friend_form .form_container p.intro_form { padding-bottom:14px; font-weight:700; font-size:13px; color:#333; } #send_friend_form .form_container p.txt_required { padding-bottom:0; color:/* SEND TO FRIEND (pop-in) ##################################################################### */ #666; } #send_friend_form .form_container .text { padding-bottom:10px; } #send_friend_form .form_container .text label { display:inline-block; padding:6px 15px; width:180px; /* 210 */ font-size:12px; text-align:right; } #send_friend_form .form_container .text input { padding:0 5px; height:22px; width:260px; border:1px solid #ccc; font-size:12px; color:#666; } #send_friend_form .submit { margin-top:20px; padding-bottom:0; text-align:right; } /* PACK ##################################################################### */ #blockpack { margin-top:20px; padding-top:20px; border-top:1px dotted #999; } /* PERSONNALISATION ##################################################################### */ .customization_block { } .customization_block p.infoCustomizable { margin:10px 0 20px; padding:0 0 0 20px; background:url(../img/icon/infos.gif) no-repeat 0 0 transparent; } ul#uploadable_files,ul#text_fields { list-style-type:none; } .customizableProductsFile,.customizableProductsText { margin-bottom:20px; padding-bottom:10px; border-bottom:1px dotted #ccc; } .customizationUploadLine { padding-bottom:10px; } .customizationUploadBrowse img + a { position: relative; top: -51px; } .customizationUploadLine label { display:inline-block; width:150px; vertical-align:top; } .customizationUploadLine textarea { height:50px; width:300px; border:1px solid #ccc; } #customizedDatas { float:right; } .accessories_block div ul li a { display:inline-block; } .accessories_block div ul li .s_title_block a, .accessories_block div ul li .s_title_block span { font-weight:bold; } What are you thinking about this result? Regards from Bulgaria Detelin Link to comment Share on other sites More sharing options...
generalexperts Posted March 8, 2014 Author Share Posted March 8, 2014 (edited) I'm sorry, I'm having a hard time understanding what your saying. I'm wanting to be able to mix around the different product attributes that I have. The attributes are there depending on the product, so you probably didn't see them depending on the product you are looking at. I also will have to work on the position of other attribute that may appear that don't appear now, such as On Sale or other things not currently in use. Let's just say for example. I want to remove the word Quantity and put the quantity box next to the add to cart button without moving anything else (shown in that other website). How would I do that? Maybe once I see how that is done I can do the rest. I appreciate your help! Edited March 8, 2014 by generalexperts (see edit history) Link to comment Share on other sites More sharing options...
generalexperts Posted April 7, 2014 Author Share Posted April 7, 2014 Still looking for help... Any help is greatly appreciated!! Link to comment Share on other sites More sharing options...
generalexperts Posted April 13, 2014 Author Share Posted April 13, 2014 (edited) This can be marked as [sOLVED] Thanks! Edited August 29, 2014 by generalexperts (see edit history) Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now