/** * Custom CSS stylesheet. Add here your custom styles. * * Enable this file from the backend: * System -> Configuration -> Theme Setup -> Custom CSS -> Load Custom CSS File * * Please refer to the User"s Guide for more information. */ .product-view .product-shop .price-box .price { font-size:24px; font-weight: 800; letter-spacing: -1px; color: #000; } .price-box .old-price{ letter-spacing: -1px; font-weight: 300; } .price-box .old-price .price{ letter-spacing: -1px; font-weight: 300 !important; } .special-price .price { color:#e40040 !important; } .product-view .special-price .price { color:#000 !important; font-weight:600 !important; font-size:24px; } .product-view .product-shop .price-box .old-price .price { font-size:17px; color: #777777; } .price_old { color: #000; text-decoration: line-through; vertical-align: middle; } .selectedcrossselling { border-color: #4180ff !important; margin-top: 0px; } .crossselling { float: left; width: 25%; height: 50px; width: 50px; background-size: cover; background-color: #FFF; border: 1px solid #c6c6c6; margin-bottom: 8px; margin-right: 8px; margin-left: 1px; } .catalog-product-view input[type=radio] { display:none; } .catalog-product-view input[type=radio] + label { background: #F1EFEF; display:block; margin:10px; padding: 9px 9px; margin-bottom: 0; font-size: 11px; line-height: 25px; color: #333; text-align: center; vertical-align: middle; cursor: pointer; background-size: cover; } .catalog-product-view input[type=radio]:checked + label { outline: 1px; outline-style: solid; outline-color: #4180ff; background: #F1EFEF; /*color: #0082ff;*/ } .catalog-product-view .attributeOptions > div { width: 55px; float: left; margin: 0px; } .catalog-product-view .attributeOptions .disabled { background: #F1EFEF; color: #C0C0C0 !important; cursor: default; } .product-options .input-box-select .chosen-container { display:none !important; } .product-options { border: none; padding: 0 0 0 0; clear:both; } .product-options dl { line-height: normal; } .product-options .option-label { color: #666; } .product-shop h1 { font-size: 1.575rem; } .product-options label { font-weight: normal; } .product-view .product-shop .price-box .price-custom { font-size:16px; } .catalog-product-view input[type="radio"] + label { margin-left: 0px !important; } .top-bar-section > ul > li > a { text-transform: none !important; } .mdformfields .select-list > label { color: #84a0cc; } a.greenlink { color: #00cc00; } .tax-details { display:none !important; } .catalog-product-view .tax-details { display:block !important; margin-top:5px; font-size:smaller; } /* CHECKOUT PAYMENT CSS */ #checkout-step-payment .form-list li{ height: auto; } #checkout-step-payment .field label,#checkout-step-payment .form-list label,#checkout-step-payment .checkmo-list label { top: 0px; } #checkout-step-payment .form-list label{ top: 0px; } #checkout-step-payment .field label,#checkout-step-payment .form-list label,#checkout-step-payment .checkmo-list label { position: relative; } #vaimo_klarna_invoice_input_fields{ padding: 0 10px; } #vaimo_klarna_invoice_input_fields input{ width: 100% !important; } #vaimo_klarna_invoice_input_fields .gender-input-box input{ width: 20px !important; } #vaimo_klarna_invoice_input_fields .gender-input-box{ padding-left: 10px; } #vaimo_klarna_invoice_input_fields .input_combo input{ width: 20px !important; padding-top: 10px; } #vaimo_klarna_invoice_input_fields .input_combo label{ float: left !important; width: 70%; } /* NB 26.11.2015 - set background color gray */ .product-collateral-wrapper .product-collateral.custom-info { background-color: #f4f4f4; } /* Margin for search field*/ .form-search .search-box{ margin-top: 0px; } /* Zusatzinformation coursor and font changes*/ #product-attribute-specs-table .data label{ cursor: default; } #product-attribute-specs-table .first .data { font-weight: normal; } .optionstick { position: absolute; top:32%; right:33%; font-size:30px; width: 110px; z-index:1000; } .optionstick .stickplus { width:auto; } .optionstick .optionstickpreview { -webkit-transform: rotate(30deg); -moz-transform: rotate(30deg); font-weight: bold; top: 35px; position: relative; } .stickoption { display: none; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index:1000; } .optionprice{ float: right; background: #FFF; border-radius: 99px; -moz-border-radius: 99px; -webkit-border-radius: 105px; width: 105px; height: 105px; margin-top: 20px; margin-right: 20px; text-align: center; } .optionprice p { color: #000; vertical-align: middle; margin-top: 15px; } .optionprice p span { font-size: 2.2em; margin-top: auto; margin-bottom: auto; display: block; } .stickoption .settings { width: 145px; right: 20%; position: absolute; top: 120px; font-size: 1.2em; color: #fff; line-height: 1em; } .stickoption .settings p { margin-bottom: 3px; } .stickoption .settings input[type="text"] { background: transparent; border: 2px solid #FFF; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-align: center; font-size: 1.8em; width: 100%; color: #FFF; margin-top: 10px; margin-bottom: 25px; padding:0; } .stickoption .settings button { background: #0082ff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #0082ff; color:#FFF; padding: 5px; width: 100%; } .stickoption .settings p { color:#fff; } .stickoption .settings .buttons { text-align: center; margin-top:20px; } .stickoption .settings .textcolor { margin-bottom: 25px; } .stickoption .settings .textcolor div { float:left; width: 22px; height: 22px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border:3px solid transparent; margin: 2px; } .stickoption .settings .textcolor div.active { border:3px solid #2090ff; } .stickoption .settings button.simple { background: transparent; border:0px; border-bottom: 1px solid #FFF; color:#FFF; padding: 5px; width:auto; } .optionstickpreview { text-align: center; text-transform: uppercase; } .button.btn-stick.showStickDialog { background: #FFF; cursor: pointer; border: 2px solid #c2c2c2; -moz-border-radius: 10px; border-radius: 10px; font-size: 1.2em; text-align: center; padding: 10px; } .button.btn-stick.showStickDialog.showStickDialog span { background: transparent; color: #000;} .AddStickContainer h3 { padding-top: 17px; font-size: 26px; clear: both; display: block; color: #222; font-weight: normal; margin-bottom: 0px; } .AddStickContainer p { color: #222; padding-bottom: 10px; } .textright { text-align: right; } .textcenter { text-align: center; } .whitebox { border:2px solid #f1f1f1; font-size: 1.125em; background: #FFF; padding: 40px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .whitebox { margin-top: 10px; } .stickinfotextbottom { display: block; clear: both; position: relative; top: 330px; width: 90%; margin: auto; left: 0px; right: 0px; left: 10px; color: #FFF; } /* Header Layout Update*/ .cms_header_links { color: #ccc; text-transform: uppercase; } .top-header { padding-top: 0px !important; } .shoplogo { max-height: 55px; } .top-bar-section ul.left { padding-left: 0px !important; } /* New Styles logo*/ .shoplogo a{ height: 137px; width: 139px; background-color: #FFF; display: block; padding: 10px 30px; } .cms_header_links .columns{ margin-top: 20px; text-align: center; } .cms_header_links .columns a{ color: #cccccc; font-size: 9pt; } .cms_header_links .columns a i{ padding-right: 3px; font-size: 9pt; padding-top: 2px; } .cms_header_links .columns a:hover{ color: #cccccc; } .cms_header_links .columns a.link-payment{ font-size: 9pt; font-weight: bold; letter-spacing: -0.3px; } .cms_header_links .columns a.link-delivery{ font-size: 9pt; font-weight: bold; letter-spacing: -0.3px; } .cms_header_links .columns a.link-return{ font-size: 9pt; font-weight: bold; letter-spacing: -0.3px; } /* Header changed layout */ @media only screen and (max-width: 40.063em) { form .form-search{margin: 0; margin-top: 7px !important; } label[for="search"]{display: none;} .icons-for-medium{min-width:170px;} .links-bottom a {margin: 0px 5px !important; max-height: 45px;} .search-top{position: relative;} .links-bottom a { line-height: 0; font-size: 0 !important; color: transparent; width: 45px; text-align: center; } .shoplogo a{ height: 109px; width: 99px; background-color: #FFF; display: block; padding: 10px 20px; padding-bottom: 0px; } .links-bottom a:nth-child(2),.links-bottom a:nth-child(3){ border-left: solid 1px #e2e2e2; padding: 5px 10px; margin: 0px !important; min-width: 45px; } .links-bottom a:nth-child(4){ margin: 0px !important; padding: 5px 10px; min-width: 45px; } .main-header .top-header { min-height: 110px !important;} .links-bottom {position: relative; top: 64px !important;} .ssllogo {margin-right: 5px;} } @media only screen and (min-width: 40.063em) { .form-search { margin-left: 0px; } .shoplogo a { float: right; } } @media only screen and (max-width: 64.063em) { .links-bottom {position: relative; top: 84px;} .search-top{position: relative; bottom: 34px;} .main-header .top-header {background: linear-gradient(to bottom, #000 0%,#000 45%,#fff 45%,#fff 100%); min-height: 140px;} form .form-search{margin: 0; margin-top: 13px;} label[for="search"]{display: none;} .links-bottom a {float: right; margin: 0px 15px; max-height: 45px;} .cms_header_links .columns a.link-payment{ font-size: 0.675rem; } .cms_header_links .columns a.link-delivery{ font-size: 0.675rem; } .cms_header_links .columns a.link-return{ font-size: 0.675rem; } .cms_header_links .columns{ margin-top: 15px; } .links-bottom a { color: #999; font-size: 0.675rem; letter-spacing: -0.5px; } .ssllogo { float: right !important; position: relative !important; display: block !important; } .ssllogo table{ margin-bottom: 0px; position: absolute; left: -145px; top: -10px; border: none; } .icon-user2, .icon-cart3{ padding-bottom: 2px !important; } } @media only screen and (min-width: 64.063em) { .top-bar-section ul.left { padding-left: 18.6% !important; } .right-off-canvas-menu{ padding-top: 25px; padding-bottom: 7px; } form#search_mini_form{ margin-top: 11px; } .top-bar-section .right ul.dropdown a.sign-in{ color: #FFF !important; padding-top: 8px; } /*Menu Static Changes*/ .top-bar-section li:not(.has-form) a:not(.button){ padding: 0 45px 0 15px; } .top-bar-section .left li.level0 > a.level0{ height: 40px; letter-spacing: -0.3px; } .top-bar-section .left li.nav-5 > a.level0{ color: #6699cc; } #search_mini_form .form-search{ float: right; } } .iconcart{ display: block; background: url("../images/warenkorb.png") no-repeat center; height: 21px; } .iconmenu{ display: block; background: url("../images/menu.png") no-repeat center; height: 21px; } .top-bar-section .right .has-dropdown > a:after, .top-bar-section .right .has-dropdown-for-large > a:after{ display: none; } .iconaccount{ display: block; background: url("../images/user.png") no-repeat center; height: 21px; } .top-bar-section .right li a{ line-height: 15px !important; } .top-bar-section .right li a, .top-bar-section .right li a{ color: #999999 !important; } form .form-search{ border: 1px solid #303030; border-radius: 4px; } .main-logo, .main-logo-small {margin-top: 0px !important;} .top-bar-section .left a.level0 { text-transform: uppercase !important; font-weight: 600 !important; } #onestepcheckout-form li{ list-style: none; } #onestepcheckout-form #billing_address_list li{ margin-top: 10px; } #onestepcheckout-form #billing_address_list li > div{ margin-top: 20px; } #onestepcheckout-form #billing_address_list .input-country, #onestepcheckout-form #billing_address_list .input-region{ padding-bottom: 0px; } #onestepcheckout-form #shipping_address li{ margin-top: 10px; } #onestepcheckout-form #shipping_address li > div{ margin-top: 20px; } #onestepcheckout-form #shipping_address .input-country, #onestepcheckout-form #shipping_address .input-region{ padding-bottom: 0px; } /* Payment Methods */ #payment_form_vaimo_klarna_invoice, #vaimo_klarna_invoice_input_fields, #payment_form_ops_cc{ display: inline-block; } #onestepcheckout-form label { line-height: 2.2; } #onestepcheckout-form #billing_address_list { margin-top: 30px; margin-left: 0px; } #onestepcheckout-form #shipping_address_list ul { margin-top: 30px; margin-left: 0px; } #onestepcheckout-form #billing_address > ul, #onestepcheckout-form #shipping_address > ul{ margin-left: 0px; } .top-bar-section .right li a{ font-size: 9pt !important; line-height: 5px !important; } .top-bar-section .right { padding-top: 0px; } .marke-logo { display:block; float:right; width: 50px; margin-right: 17px; } .marke-logo:after { clear:both; } .saving-label { display:block; float:left; color:#6699cc; font-weight: 700; margin: 1em 0em; letter-spacing: -1px; font-size: 16px; } .saving-and-brand { width:280px; } .product-in-stock { font-size: smaller; color: #33cc33; } /* Filter nach */ #catalog-listing .category-description{ display: none !important; } .ssllogo { float: left; position: relative; } .ssllogo table{ margin-bottom: 0px; position: absolute; left: -145px; top: -10px; border: none; } .top-bar-section{ min-height: 50px; } .links-bottom .ssllogo{ display: none; } /* Stephan Änderungen - Icons bei Produktseite*/ .bg-box .header { font-weight:bold; } .bg-box .header i { margin-right: 10px; color:#6699cc; } .bg-box.additional-banners { clear:both; margin-top:20px; color: #666666; } .catalog-product-view .product-shop-side { width:25%; } .cms-wrapper > p{ margin-bottom: 4px; } /* Product Page */ h1#category-name { overflow: visible; font-size: 1.5rem; font-weight: 400; line-height: 1; } @media only screen and (max-width: 768px) { .product-view .product-shop-side{ float: none; width: 100%; } } @media only screen and (max-width: 450px) { .ssllogo table{ background: transparent; } } .icon-user2, .icon-cart3, .icon-main-menu1 { display: block; color: #000; width: 100%; font-size: 24px; padding-bottom: 5px; text-align: center; } .icon-main-menu1 { padding-bottom: 4px; font-size: 22px; } #onestepcheckout-form fieldset{ border: none !important; } #onestepcheckout-form .input-box .input-text{ -webkit-appearance: none; border: 0px; } .mandatory{ display: block; width: 98%; text-align: right; } .mandatory p{ color: #ea1818; } #onestepcheckout-login-table .input-box { height: 2px; margin-bottom: 40px; } #onestepcheckout-login-table .input-button { border-bottom: none; } #onestepcheckout-forgot-table .input-box { height: 2px; margin-bottom: 40px; } #onestepcheckout-forgot-table .input-button { border-bottom: none; } #onestepcheckout-form .chosen-container { max-width: 98%; } #invoicexx #klarna-link-dynamic-at{ display: none; } #payment_form_vaimo_klarna_invoice .input_combo label{ top: 6px; width: 100%; margin-left: 0px; margin-right: 0px; left: 0px; line-height: 1.2rem; } #payment_form_vaimo_klarna_invoice .input_combo #vaimo_klarna_invoice_consent{ margin-top: 8px; } #payment_form_vaimo_klarna_invoice .gender-input-box input{ margin-top: 20px; } #payment_form_vaimo_klarna_invoice .gender-input-box label{ top: 0px; left: 0px; margin-left: 0px !important; } .checkout-types .multishipping-link {display: none;} @media only screen and (min-width: 1400px) and (max-width: 1650px) { .top-bar-section li:not(.has-form) a:not(.button){ padding: 0 15px 0 15px !important; } } @media only screen and (min-width: 1025px) and (max-width: 1399px) { .top-bar-section li:not(.has-form) a:not(.button){ padding: 0 9px 0 9px !important; } .top-bar-section > ul > li > a { font-size: 9.5pt !important; } } @media only screen and (min-width: 1025px) and (max-width: 1180px) { .right .ssllogo{ display: none !important; } } /* Files From default-template styles */ .right-off-canvas-menu.main-nav { background: #ffffff !important; } .main-nav .top-bar-section li:not(.has-form) a:not(.button), .main-nav .top-bar-section ul { background: #ffffff; } .main-nav .top-bar-section ul li a:not(.button) { color: #000000; } .top-bar-section > ul > li > a { font-size: 10.5pt !important; font-weight: normal !important; } .newsletter-ribbon { background: #f4f4f4; } .footer-bottom { background-color: #000; } .sosumi { color: #fff; } @media only screen and (max-width: 64.063em) { .right-off-canvas-menu.main-nav { background: #333333 !important; } .top-bar-section ul li:hover > a, .top-bar-section ul li ul li:hover a { background: #272727 !important; } .main-nav .top-bar-section ul li a { color: #ffffff !important; } .main-nav .top-bar-section ul li:hover a, .main-nav .top-bar-section ul.left li ul li:hover > a:not(.button) { color: #ffffff !important; } } @media only screen and (min-width: 64.063em){ .main-nav .top-bar-section > ul > li:hover > a:not(.button) { color: #999 !important; } .main-logo-small { margin-top: 0px; } .form-search { margin-top: 0px !important; margin-bottom: 0px !important; } }