/* ------------------------------------------- Name: Silicones Date: 2016/03/21 Author: http://psdhtml.me --------------------------------------------- */ * { margin: 0; padding: 0; } *, :before, :after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } html { overflow-y: scroll; min-height: 100%; margin: 0 0 1px; font-size: 100.01%; -webkit-tap-highlight-color: rgba(0,0,0,0); -moz-osx-font-smoothing: grayscale; -webkit-overflow-scrolling: touch; -ms-content-zooming: none; } body { min-height: 100%; padding-top: 28px; background: #1070b8; font-size: 62.5%; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body, textarea, input, select, option, button { color: #222324; font-family: Proxima, Arial, Helvetica, sans-serif; line-height: 1.42857142857; } li, dt, dd, p, figure, th, td, caption, legend, pre { font-size: 1.4em; } li *, dt *, dd *, p *, figure *, th *, td *, legend * { font-size: 1em; } ul, ol, dl, p, figure, table, pre, h1, h2, h3, h4, h5, h6, legend { margin-bottom: 20px; } article, aside, details, div, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } /*! Layout --------- */ #root { overflow: hidden; position: relative; width: 100%; background: #fff; } #top { position: relative; z-index: 9; width: 1190px; margin: 0 auto 21px; padding: 80px 0 0; border-top: 1px solid #b5b5b5; } #top:before { content: ""; display: block; position: absolute; left: -1000em; top: -1px; bottom: -1px; z-index: 1; width: 3000em; border-top: 1px solid #b5b5b5; } #top h1 { position: relative; z-index: 2; width: 268px; height: 104px; margin: 0 0 14px; padding: 0; } #top h1 a { display: block; overflow: hidden; position: relative; z-index: 2; width: 100%; height: 107px; background: url(./logo.svg) no-repeat; background-size: auto 100%; text-indent: -3000em; } #top h1:before { content: ""; display: block; position: absolute; left: -1000em; bottom: 0; z-index: 1; width: 3000em; height: 1px; background: #b5b5b5; } #top p { margin: 0; font-size: 1.55em; font-weight: 600; } #top p span, #top p a { color: #1070b8; font-weight: 700; } #skip { position: fixed; top: 0; left: -10000px; } #skip a:focus, #skip a:active { display: block; position: absolute; left: 10000px; top: 0; z-index: 10001; width: 200px; margin: 15px 0 0 15px; padding: 4px 8px; background: #333; color: #fff; font-weight: 500; font-size: 1.1em; text-align: center; text-decoration: none; } #nav { position: fixed; left: 20px; top: 0; right: 20px; z-index: 3; height: 55px; border-bottom: 1px solid #b5b5b5; background: #222324; color: #fff; } /*! #nav:before { content: ""; display: block; position: absolute; left: -1000em; top: 0; bottom: -1px; z-index: 1; width: 3000em; border-bottom: 1px solid #b5b5b5; background: #222324; } */ #nav:before { content: ""; display: block; position: absolute; left: -1000em; top: 0; bottom: -1px; z-index: 1; width: 3000em; height:55px; border-bottom: 1px solid #b5b5b5; background: #1070b8; } #nav > ul { position: relative; z-index: 2; float: right; list-style: none; margin: 0; padding: 0; font-weight: 600; } #nav > ul > li { position: relative; float: left; margin: 0 18px 0 0; font-size: 1.3em; } #nav > ul > li:before { content: "|"; display: block; position: absolute; left: -18px; top: 0; width: 18px; line-height: 55px; text-align: center; } #nav > ul > li:last-child, #nav > ul:first-child > li:last-child { margin-right: 0; } #nav > ul > li > a { display: block; position: relative; z-index: 1; float: left; color: #fff; line-height: 55px; } #nav > ul > li.sub { margin-right: 34px; } #nav > ul > li.sub > a { padding-right: 19px; } #nav > ul > li.sub > a:before { content: "\e90b"; display: block; position: absolute; right: 0; top: 0; color: #7a7b7c; font-family: i; font-size: 4px; font-weight: 400; line-height: 55px; } #nav > ul > li.sub > span.sub { display: block; position: absolute; right: 0; top: -3000em; z-index: 2; width: 19px; height: 55px; cursor: pointer; } .mobile #nav > ul > li.sub > span.sub { left: auto; right: -5px; top: 0; width: 30px; } /*! #nav > ul > li > ul { position: absolute; left: -15px; top: -3000em; list-style: none; margin: -1px 0 0; padding: 0; border-bottom: 1px solid #b5b5b5; background: #222324; line-height: 1.42857142857; white-space: nowrap; } */ #nav > ul > li > ul { position: absolute; left: -15px; top: -3000em; list-style: none; margin: -1px 0 0; padding: 0; border-bottom: 1px solid #b5b5b5; background: #222324; line-height: 1.42857142857; white-space: nowrap; } #nav > ul > li > ul li { border-top: 1px solid #303133; } #nav > ul > li > ul li a { display: block; padding: 6px 15px; color: #fff; } .no-mobile #nav > ul > li:hover > ul, .mobile #nav > ul > li.toggle > ul { top: 100%; } #nav > ul > #language { margin-right: 15px; font-weight: 400; text-transform: uppercase; } #nav > ul > #cart { font-size: .9em; } #nav > ul > #cart > a { width: 23px; text-indent: -3000em; } #nav > ul > #cart > a:before { content: "\e908"; display: block; position: absolute; left: 0; top: 0; z-index: 1; font-size: 17px; font-family: i; font-weight: 400; line-height: 55px; text-indent: 0; } #nav > ul > #cart > a span { display: block; position: absolute; right: 0; top: 15px; z-index: 2; min-width: 14px; height: 14px; padding: 0 4px; border-radius: 20px; background: #f25480; color: #fff; line-height: 14px; text-align: center; text-indent: 0; } #nav > ul:first-child { float: left; text-transform: uppercase; } #nav > ul:first-child > li { margin-right: 53px; } #nav > ul:first-child > li:first-child { width: 18px; margin-right: 20px; } #nav > ul:first-child > li:first-child > a { text-indent: -3000em; } #nav > ul:first-child > li:first-child > a:before { content: "\e917"; display: block; position: absolute; left: 0; top: 0; font-family: i; font-weight: 400; font-size: 13px; line-height: 53px; text-indent: 0; } #nav em, #nav > ul:first-child > li:before, #nav > ul > li:first-child:before, #nav > ul > #language:before, #nav > ul > #language + li:before, #nav > ul > #cart:before, #nav > ul > #cart + li:before, #nav > ul > #language a span, #footer > form label, #mobile em, #root #mobile #cart, #root #mobile #language { position: absolute; left: -3000em; top: -3000em; } #top > form { position: absolute; right: 0; top: 98px; z-index: 2; width: 712px; padding: 0 0 1px; } #top > form p { padding: 0 55px 0 0; font-size: 1.3em; } #top > form p > a { display: block; overflow: hidden; position: absolute; right: 55px; top: 0; z-index: 10; width: 46px; height: 43px; color: #d1d3d5; font-size: 4px; font-weight: 400; line-height: 20px; text-indent: -3000em; text-align: left; } #top > form p > a:before { content: "\e90b"; display: block; position: absolute; left: 10px; top: 50%; margin: -10px 0 0; font-family: i; text-indent: 0; } #top > form label { position: absolute; left: -3000em; top: 0; } #top > form input { width: 100%; height: 43px; padding: 0 55px 0 21px; border-radius: 4px 0 0 4px; border-color: #e1e1e1; border-right: 0; } #top > form button { display: block; position: absolute; right: 0; top: 0; width: 55px; min-width: 0; height: 43px; padding: 0; border-radius: 0 4px 4px 0; border: 0; background: #1070b8; color: #fff; font-size: 1em; font-weight: 400; text-align: left; text-indent: -3000em; } #top > form button:before, #top > .search:before { content: "\e906"; display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -10px 0 0; font-size: 15px; font-family: i; font-weight: 400; line-height: 20px; text-align: center; text-indent: 0; } #top > form > ul { position: absolute; left: 0; top: -3000em; list-style: none; width: 100%; margin: 0; padding: 6px 0; border-radius: 4px; border: 1px solid #e1e1e1; background: #fff; } #top > form.toggle > ul { top: 100%; } #top > form > ul li { font-size: 1.3em; } #top > form > ul li a { display: block; padding: 6px 21px; color: #8b9195; text-decoration: none; } #top > form > ul li a:hover { background: #1070b8; color: #fff; } #top > .menu { display: block; position: fixed; left: 0; top: -3000em; z-index: 10; width: 40px; height: 40px; cursor: pointer; } #top > .menu:before, #top > .menu:after { content: ""; display: block; position: absolute; left: 50%; width: 20px; margin: 0 0 0 -10px; height: 10px; border-bottom: 3px solid #fff; } #top > .menu:before { top: 12px; border-top: 3px solid #fff; } #top > .menu:after { bottom: 11px; } #top > .search { display: block; position: fixed; right: 0; top: -3000em; z-index: 10; width: 40px; height: 40px; color: #fff; cursor: pointer; } #breadcrumbs { position: relative; z-index: 3; width: 1190px; margin: -6px auto 40px; color: #909090; } #breadcrumbs ul, #breadcrumbs ol { list-style: none; margin: 0; padding: 0; } #breadcrumbs li { position: relative; float: left; margin: 0 26px 0 0; } #breadcrumbs li:before { content: "|"; display: block; position: absolute; left: 100%; top: 0; width: 26px; color: #1070b8; text-align: center; } #breadcrumbs li:last-child { margin-right: 0; } #breadcrumbs li:last-child:before { left: -3000em; } #breadcrumbs li a { color: #1070b8; } #breadcrumbs p { float: right; margin: -25px 0 0; font-size: 1.3em; } #breadcrumbs p a { display: block; overflow: hidden; position: relative; float: left; padding: 6px 13px 6px 23px; border-radius: 5px; background: #1070b8; color: #fff; text-decoration: none; } #breadcrumbs p a:before { content: "\e90f"; display: block; position: absolute; left: 10px; top: 50%; margin: -10px 0 0; color: #fff; font-family: i; font-size: 7px; line-height: 20px; } #news { padding: 0 35px; } #mobile { overflow-x: hidden; overflow-y: auto; position: fixed; left: -250px; right: auto; top: 0; bottom: 0; z-index: 100; width: 240px; margin: 0; box-shadow: 0 0 5px rgba(0,0,0,.25); background: rgba(46,46,46,1); line-height: 1.55; } #mobile > ul { list-style: none; margin: 0; padding: 0; } #mobile > ul > li { position: relative; float: none; margin: 0; border-bottom: 1px solid #434343; font-size: 1.6em; } #mobile > ul > li > a:first-letter { text-transform: uppercase; } #mobile > ul > li > a { display: block; position: relative; z-index: 1; float: none; padding: 8px 20px; color: #fff; text-transform: none; text-decoration: none; } #mobile > ul > li.sub > a { padding-right: 60px; } #mobile > ul > li > .toggle { display: block; position: absolute; right: 0; top: 0; z-index: 2; width: 41px; height: 41px; cursor: pointer; } #mobile > ul > li > .toggle:before { content: "\e90b"; display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -10px 0 0; color: #fff; font-family: i; font-size: 4px; font-weight: 400; line-height: 20px; text-align: center; } #mobile > ul > li > ul { position: absolute; left: -3000em; top: 0; list-style: none; margin: 0; padding: 0; border-top: 1px solid #434343; background: rgba(0,0,0,.25); } #mobile > ul > li.toggle > ul { position: relative; left: 0; } #mobile > ul > li > ul li { margin: 0; padding: 0; border-top: 1px solid #393939; font-size: 14px; } #mobile > ul > li > ul li:first-child { border: 0; } #mobile > ul > li > ul li a { display: block; padding: 4px 20px 4px; color: #fff; } #mobile ul + ul li.mobile-hide { position: relative; left: 0; top: 0; } #shadow { visibility: hidden; position: fixed; left: 0; top: 0; z-index: 99; width: 100%; height: 100%; background: rgba(9,9,9,.54); opacity: 0; cursor: pointer; } #content { position: relative; z-index: 2; width: 1190px; margin: 0 auto; padding: 0 0 23px; } #content:after, #breadcrumbs ul:after, #breadcrumbs ol:after, #top:after, .nav-a li:after, #footer:after, #footer > *:after, .list-a:after, .list-b:after, .news-a footer:after, #breadcrumbs p:after, .list-c:after, .list-d:after, .form-b:after, .double:after, .product:after { content: ""; display: block; overflow: hidden; clear: both; height: 1px; } #footer:after{ content: ""; display: block; overflow: hidden; clear: both; height: 0px; } #footer { position: relative; z-index: 1; width: 1190px; margin: 0 auto; padding: 72px 0 0; background: #f2f2f4; color: #868686; line-height: 1.92857142857; } #footer:before, #footer > ul:before { content: ""; display: block; position: absolute; left: -1000em; top: 0; z-index: 1; width: 3000em; height: 100%; background: #f2f2f4; } #footer > * { position: relative; z-index: 2; } #footer > nav { margin-left: -90px; } #footer > nav > * { float: left; width: 22%; border-left: 90px solid rgba(0,0,0,0); } #footer > nav > *:first-child { width: 34%; } #footer > nav > *:first-child:before { content: ""; display: block; width: 191px; height: 77px; margin: 7px 0 20px; background: url(./logo.svg) no-repeat; background-size: auto 100%; } #footer > nav ul { list-style: none; padding: 0; } #footer > nav a { color: #868686; } #footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6 { margin: 0 0 24px; font-size: 1.6em; } #footer * + .rating-a { margin-top: 62px; } #footer ul, #footer p { margin-bottom: 23px; } #footer > form { padding: 55px 0; border-top: 1px solid #cacaca; font-size: 0; text-align: right; } #footer > form > * { display: inline-block; vertical-align: top; } #footer > form h1, #footer > form h2, #footer > form h3, #footer > form h4, #footer > form h5, #footer > form h6 { margin: 0; padding: 16px 22px 0 0; font-size: 16px; } #footer > form p { width: 504px; margin: 0; padding: 0 162px 0 0; font-size: 13px; } #footer > form input { display: block; width: 100%; height: 50px; padding: 0 15px; border-radius: 5px 0 0 5px; border-color: #fff; } #footer > form button { display: block; position: absolute; right: 0; top: 0; width: 162px; min-width: 0; height: 50px; padding: 0; border-radius: 0 5px 5px 0; border: 0; background: #f25480; color: #fff; font-size: 13px; font-weight: 600; text-align: center; text-transform: uppercase; } #footer > form figure { position: absolute; left: 0; top: 65px; color: #868686; font-size: 12px; font-style: italic; text-align: left; } #footer > form figure img { display: block; margin: 0 0 7px; } #footer > ul { position: relative; list-style: none; margin: 0; padding: 40px 0 38px; color: #fff; text-align: right; } #footer > ul:before { background: #1070b8; } #footer > ul li { display: inline; position: relative; z-index: 2; margin: 0 0 0 62px; } #footer > ul a { color: #fff; } #cookie { position: fixed; left: 0; bottom: 0; right: 0; z-index: 9; margin: 0; padding: 10px 0; color: #fff; font-weight: 700; font-size: 12px; font-weight: 700; line-height: 1.5; text-align: center; } #cookie.toggle { -moz-transform: translateY(100%); -webkit-transform: translateY(100%); -o-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } #cookie:before { content: ""; display: block; position: absolute; left: -1000em; top: 0; bottom: 0; z-index: 1; width: 3000em; background: rgba(0,0,0,.5); } #cookie > * { position: relative; z-index: 2; } #cookie a { display: inline-block; margin: 0 0 0 10px; padding: 11px 0; color: #fff; text-decoration: none; opacity: .7; } #cookie a:last-child { margin-right: 0; } #cookie a:after { content: " »"; } #cookie a.close { padding: 11px 30px; background: #707070; opacity: 1; } #cookie a.close + * { margin-left: 30px; } /*! Columns --------- */ .cols-a { } .cols-a > *:first-child, .cols-a > header:first-child + * { float: right; width: 965px; } .cols-a > aside, .cols-a > header:first-child { float: left; width: 225px; } .cols-b { } .cols-b > *:first-child, .cols-b > header:first-child + * { float: left; width: 890px; } .cols-b > aside, .cols-b > header:first-child { float: right; width: 220px; } .double, .product { position: relative; } .double > *, .product > * { display: block; position: relative; float: right; border-left: 0 solid rgba(0,0,0,0); } .double > *:first-child { float: left; } .double.a, .product { margin-left: -25px; } .double.a > *, .product > * { float: left; width: 50%; border-left-width: 25px; } .double.b { } .double.b > * { width: 41%; } .double.b > *:first-child { width: 47%; } /*! Modules --------- */ .cols-a { } .cols-a > aside h3, .cols-a > header:first-child, .cols-b > aside h3, .cols-b > header:first-child { font-size: 1.8em; } .cols-a > aside h3:first-child, .cols-a > header:first-child h3:first-child, .cols-b > aside h3:first-child, .cols-b > header:first-child h3:first-child { padding-top: 3px; } .gallery-a { overflow: hidden; list-style: none; margin: 0 0 0 -26px; padding: 0; font-weight: 600; line-height: 1.1; text-transform: uppercase; word-wrap: break-word; } .gallery-a > li { overflow: hidden; position: relative; float: left; width: 25%; height: 202px; margin: 0 0 26px; border-left: 26px solid #fff; background-color: #f2f2f5; background-position: center center; background-repeat: no-repeat; background-size: cover; font-size: 1.6em; cursor: pointer;} .gallery-a > li:nth-child(4n) + li { clear: both; } .gallery-a > li:before { content: ""; display: block; position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; background: #fff; opacity: 0; } .gallery-a > li.middle { background: #94928e; font-size: 2.2em; font-weight: 600; text-align: center; } .gallery-a > li.middle a { display: block; position: absolute; left: 0; top: 50%; z-index: 3; width: 100%; padding: 16px 20px 0; text-decoration: none; } .gallery-a > li.middle a, .gallery-a > li > div { -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .gallery-a > li.middle span { display: block; position: relative; padding: 36px 0 13px; font-size: .63636363636em; font-weight: 400; } .gallery-a > li.middle span:before, .gallery-a > li > div p .strong.text-uppercase:before { content: ""; display: block; position: absolute; left: 50%; bottom: 0; width: 40px; height: 2px; margin: 0 0 0 -20px; background: #fff; } #root .gallery-a a.clone { display: block; overflow: hidden; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 4; height: 100%; text-indent: -3000em; text-align: left; } #root .gallery-a a.clone { -moz-transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; transform: none; } #root .gallery-a a.clone * { display: block; position: absolute; left: -3000em; top: 0; } .gallery-a > li.middle:before { background: none; } .gallery-a > li.inv, .gallery-a > li.inv a { color: #fff; } .gallery-a > li.inv:before { background: #2d2d2d; } .gallery-a > li.pattern-a { background: #868A08; } .gallery-a > li.pattern-a a, .gallery-a > li.pattern-b a, .gallery-a > li.pattern-c a, .gallery-a > li.pattern-d a, .gallery-a > li.pattern-e a { color: #fff; } .gallery-a > li.pattern-b { background: #1D609C; } .gallery-a > li.pattern-c { background: #F2933A; } .gallery-a > li.pattern-d { background: #E88EBA; } .gallery-a > li.pattern-e { background: #ACA81B; } .gallery-a span { display: block; position: relative; z-index: 3; } .gallery-a span.img { display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; /*max-height:90%;max-width:90%;*/ } .gallery-a.home span.img img { display: none !important; } .gallery-a span.img img { display: block; position: absolute; left: 50%; top: 50%; } .gallery-a span.img img { -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } /*.gallery-a span.info { position: absolute; left: 17px; bottom: 14px; right: 70px; z-index: 2; }*/ .gallery-a span.info { position: absolute; left: 12px; right: 12px; bottom: 12px; z-index: 2; padding: 10px 10px 5px; background: rgba(255,255,255,.7); } .no-mobile .gallery-a > li:hover span.info, .mobile .gallery-a > li.toggle span.info { padding: 0 58px 0 0; background: none; } .gallery-a span.price { overflow: hidden; max-height: 30px; padding: 4px 0 2px; color: #a3a3a3; } .gallery-a span.desc { overflow: hidden; max-height: 0; color: #a3a3a3; font-weight: 400; font-size: .875em; line-height: 1.28571428571; text-transform: none; } .gallery-a span.rating-b { overflow: hidden; max-height: 0; margin-top: 11px; } .gallery-a span.scheme-a { display: inline-block; margin: 0 0 8px; padding: 6px 10px 5px; font-size: .875em; } .gallery-a span.label { display: block; position: absolute; right: 8px; top: 8px; width: 76px; height: 76px; border-radius: 40px; background: #1070b8; color: #fff; font-weight: 700; font-size: 1.125em; line-height: 76px; text-align: center; } .gallery-a span.label.left { left: 8px; right: auto; } .gallery-a span.label.a { background: #a3cf6c; } .no-mobile .gallery-a > li:hover:before, .mobile .gallery-a > li.toggle:before { opacity: .70; } /*{ opacity: .95; }*/ .no-mobile .gallery-a > li:hover span.desc, .no-mobile .gallery-a > li:hover span.rating-b, .mobile .gallery-a > li.toggle span.desc, .mobile .gallery-a > li.toggle span.rating-b { max-height: 50px; } .no-mobile .gallery-a > li:hover span.desc, .mobile .gallery-a > li.toggle span.desc { max-height: 150px; } .no-mobile .gallery-a > li:hover span.price, .mobile .gallery-a > li.toggle span.price { max-height: 0; } .gallery-a > li > ul { position: absolute; right: -35px; bottom: 15px; z-index: 4; list-style: none; margin: 0; padding: 0; } .no-mobile .gallery-a > li:hover > ul, .mobile .gallery-a > li.toggle > ul { right: 15px; } .gallery-a > li > ul li { padding: 5px 0 0; font-weight: 400; font-size: 12px; } .gallery-a > li > ul a { display: block; overflow: hidden; position: relative; width: 35px; height: 35px; border-radius: 5px; background: #222324; color: #fff; text-align: left; text-indent: -3000em; text-decoration: none; } .gallery-a > li > ul a:hover, .gallery-a > li > ul li:first-child a { background: #f35480; } .gallery-a > li > ul i { display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -10px 0 0; line-height: 20px; text-align: center; text-indent: 0; } .gallery-a > li > ul i.icon-zoom { font-size: 13px; } .gallery-a > li > ul i.icon-cart { font-size: 18px; } .gallery-a > li > div { position: absolute; left: 50%; top: 50%; z-index: 2; width: 100%; width: 684px; margin: 0 0 0 -342px; padding: 20px 20px 0; font-size: 10px; font-weight: 400; line-height: 1.6875; text-align: center; text-transform: none; } .gallery-a > li > div h1, .gallery-a > li > div h2, .gallery-a > li > div h3, .gallery-a > li > div h4, .gallery-a > li > div h5, .gallery-a > li > div h6 { margin: 0; color: #fff; font-size: 5.2em; } .gallery-a > li > div p { position: relative; z-index: 1; margin-bottom: 15px; font-size: 1.6em; } .gallery-a > li > div p.scheme-a { z-index: 2; padding: 4px 34px 3px; font-size: 1.9em; } .gallery-a > li > div p .strong.text-uppercase { display: block; position: relative; padding: 40px 0 12px; font-size: .875em; text-transform: uppercase; } .gallery-a > li > div p.scheme-a + * { z-index: 3; } .gallery-a > li > div p.scheme-a:before { content: "\e919"; display: block; position: absolute; left: 17px; top: 100%; margin: -.5px 0 0; color: #f25480; font-family: i; font-weight: 400; font-size: 46px; line-height: 46px; } h1 + .gallery-a, h2 + .gallery-a, h3 + .gallery-a, h4 + .gallery-a, h5 + .gallery-a, h6 + .gallery-a { margin-top: 34px; } .gallery-a.a { margin: 0 0 53px -22px; } .gallery-a.a > li { width: 14.28%; margin-bottom: 22px; border-left-width: 22px; } .gallery-a.a > li:nth-child(4n) + li { clear: none; } .gallery-a.a > li.w-15 { width: 15.44%; } .gallery-a.a > li.w-21 { width: 21.42%; } .gallery-a.a > li.w-27 { width: 27.41%; } .gallery-a.a > li.w-28 { width: 28.57%; } .gallery-a.a > li.w-29 { width: 29.72%; } .gallery-a.a > li.w-42 { width: 42.85%; } .gallery-a.a > li.h-200 { height: 222px; } .gallery-a.a > li.h-400 { height: 400px; } .gallery-a.a > li.h-500 { height: 522px; } .gallery-a.a > li.h-550 { height: 578px; } .gallery-a.a > li.h-400 .label, .gallery-a.a > li.h-500 .label, .gallery-a.a > li.h-550 .label { right: 37px; top: 37px; } .gallery-a.a > li.h-400 .label.left, .gallery-a.a > li.h-500 .label.left, .gallery-a.a > li.h-550 .label.left { right: auto; left: 37px; } .double .gallery-a { margin-left: -15px; } .double .gallery-a > li { width: 33.333333333%; height: 182px; margin: 0 0 15px; border-left-width: 15px; font-size: 1.2365em; } .double .gallery-a > li:nth-child(4n) + li { clear: none; } .double .gallery-a > li:nth-child(3n) + li { clear: both; } /*.double .gallery-a span.info { left: 11px; right: 45px; bottom: 8px; }*/ .no-mobile .double .gallery-a > li:hover span.info, .mobile .double .gallery-a > li.toggle span.info { padding: 0 33px 0 0; } .double .gallery-a span.price { padding-top: 2px; } .double .gallery-a span.rating-b { margin-top: 6px; padding: 16px 0 0; } .double .gallery-a > li > ul { bottom: 5px; } .no-mobile .double .gallery-a > li:hover > ul, .mobile .double .gallery-a > li.toggle > ul { right: 5px; } .gallery-b { overflow: hidden; list-style: none; margin: 0 0 0 -44px; padding: 0; } .gallery-b li { position: relative; float: left; width: 33.33333333333%; height: 184px; margin: 0 0 44px; border-left: 44px solid rgba(0,0,0,0); } .gallery-b li:before { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; border-radius: 3px; border: 1px solid #c5cad1; } /*.gallery-b li:after { content: "\e911"; display: block; position: absolute; left: -44px; top: 50%; width: 44px; margin: -20px 0 0; color: #000; font-size: 19px; font-family: i; font-weight: 400; line-height: 40px; text-align: center; }*/ .gallery-b li:after {content: url('./267-plus.png'); display: block; position: absolute; left: -44px; top: 50%; width: 44px; margin: -20px 0 0; color: #000; font-size: 19px; font-family: i; font-weight: 400; line-height: 40px; text-align: center; } .gallery-b li:nth-child(3n-2):after { left: -3000em; } /*.slider-a .bx-wrapper a img, .slider-a .custom-pager li a img, */ .gallery-b img { display: block; position: absolute; left: 50%; top: 50%; z-index: 1; width: auto !important; height: auto !important; max-width: 90% !important; max-height: 90% !important; margin: 0; } /*.slider-a .bx-wrapper a img, .slider-a .custom-pager li a img, */ .gallery-b img { -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } .nav-a { line-height: 1.42857142857; } .nav-a, .nav-a ul { list-style: none; padding: 0; } .nav-a li { clear: both; margin: 0 0 1px; } .nav-a li a { display: block; float: left; margin: 0 0 0 -6px; padding: 3px 6px 1px; border-radius: 3px; color: #222324; text-decoration: none; } .nav-a li.active a, .nav-a li a:hover { background: #1070b8; color: #fff; } .nav-a li.active a { font-weight: 700; cursor: default; } .nav-a + nav, .nav-b + nav { margin-top: 80px; } .nav-b { line-height: 1.42857142857; } .nav-b, .nav-b ul { overflow: hidden; list-style: none; margin-bottom: 0; padding: 0; text-transform: uppercase; } .nav-b li { position: relative; float: left; margin: 0 12px 9px 0; padding: 3px 8px 2px; border-radius: 3px; background: #c9c8c6; color: #fff; font-size: 1.3em; } .nav-b li a { display: block; float: left; color: #fff; text-decoration: none; } .nav-b li.active, .nav-b li:hover, .nav-b.a li { background: #f35480; color: #fff; } .nav-b li.active a { cursor: default; } .nav-b li a:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .news-a { margin-bottom: 68px; line-height: 1.78571428571; } .news-a article { margin: 0 0 31px; } .news-a article > footer { position: relative; margin: 33px 0 0 0; padding: 44px 0 0; } .news-a article > footer:before { content: ""; display: block; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: #b5b5b5; } .news-a article > footer .list-a { float: left; margin: 0 /*25px*/ 0 0; } .news-a article > footer .link-a { float: left; margin: -15px 25px 0 0; } .news-a article > footer .social-a { float: right; margin-top: -5px; } .news-a h1, .news-a h2, .news-a h3, .news-a h4, .news-a h5, .news-a h6 { margin-bottom: 10px; font-size: 2.1em; } .news-a p, .news-a ul { margin-bottom: 25px; } .news-a .nav-b ul, .news-a ul.nav-b { margin-bottom: 14px; } .news-a header .list-a { padding-top: 16px; border-top: 1px solid #b5b5b5; } .news-a article + .list-b, .news-a article + nav { margin-top: 68px; } .pagination-a { overflow: hidden; font-size: 0; } .pagination-a ul, .pagination-a ol { overflow: hidden; list-style: none; padding: 0; } .pagination-a li { display: inline-block; margin: 0 2px; font-size: 13px; } .pagination-a li:first-child { margin-left: 0; } .pagination-a li:last-child { margin-right: 0; } .pagination-a li > * { display: inline-block; position: relative; min-width: 25px; height: 25px; padding: 0 4px; border-radius: 4px; border: 1px solid #e8e8e8; color: #222324; line-height: 24px; text-align: center; } .pagination-a li.active > * { color: #1070b8; text-decoration: none; cursor: default; } .pagination-a li.prev { margin-right: 10px; } .pagination-a li.next { margin-left: 10px; } .pagination-a li.prev > *, .pagination-a li.next > * { padding: 0; border: 0; } .pagination-a li.prev > * { padding-left: 10px; } .pagination-a li.next > * { padding-right: 10px; } .product { margin-bottom: 20px; } .product > figure { position: relative; height: 475px; color: #fff; text-align: center; } .product > figure:before { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; border: 1px solid #f8f8fa; } .product > figure a { display: block; overflow: hidden; position: relative; z-index: 2; height: 475px; color: #fff; } .product > figure img { position: absolute; left: 50%; top: 50%; z-index: 1; max-width: 90% !important; max-height: 90% !important; } .product > figure img { -moz-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } .product > figure a:before { content: "\e906"; display: block; position: absolute; left: 0; bottom: 0; z-index: 2; width: 47px; height: 47px; border-radius: 0 5px 0 0; background: #f35480; color: #fff; font-size: 18px; font-weight: 400; font-family: i; line-height: 47px; text-align: center; } .product > figure .bx-prev, .product > figure .bx-next { display: block; position: absolute; top: 50%; width: 38px; height: 38px; margin: -19px 0 0; background: #1070b8; color: #fff; font-weight: 400; text-align: left; text-indent: -3000em; } .product > figure .bx-prev { left: 20px; } .product > figure .bx-next { right: 20px; } .product > figure .bx-prev:before, .product > figure .bx-next:before { display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -10px 0 0; border-radius: 0; background: none; font-size: 14px; line-height: 20px; text-align: center; text-indent: 0; } .product > figure .bx-prev:before { content: "\e90c"; } .product > figure .bx-next:before { content: "\e90d"; } .product p { margin-bottom: 15px; } .product .scheme-a + h1, .product .scheme-a + h2, .product .scheme-a + h3, .product .scheme-a + h4, .product .scheme-a + h5, .product .scheme-a + h6 { margin-top: -4px; } .product .double { position: relative; padding: 19px 0 0; } .product .double:before { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; height: 1px; background: #dedede; } #content > .product:first-child { margin-top: -16px; } .product-configure-options-option { position: relative; } .product-configure-options-option + .product-configure-options-option { margin-top: 15px; } .quote-a { margin-top: 39px; color: #909090; font-weight: 600; font-size: 1.5em; } .quote-a q { display: block; color: #222324; font-size: 1.13333333333em; font-weight: 400; line-height: 1.4; quotes: none; } .quote-a q:before, .quote-a q:after { font-size: 30px; line-height: 1px; } .quote-a q:before { content: "‘‘"; margin: 0 8px 0 0; } .quote-a q:after { content: "’’"; margin: 0 0 0 8px; } .quote-a .rating-b { display: block; margin: 18px auto 25px; } .rating-a { display: block; position: relative; padding: 0 0 0 143px; color: #1070b8; font-size: 3.2em; font-weight: 700; line-height: 1.42857142857; } .rating-a:before { content: ""; display: block; position: absolute; left: -1px; top: -8px; width: 130px; height: 44px; background: url(./trustpilot.png) no-repeat; background-size: 100% 100%; } .rating-a span { margin: 0 0 0 4px; color: #868686; font-weight: 400; font-size: .4375em; } .rating-b { display: block; position: relative; padding: 0px; color: #a3a3a3; font-size: 12px; font-weight: 400; line-height: 1.42857142857; } .rating-b .rating { display: block; position: absolute; left: 0; top: 1px; width: 77px; height: 13px; } .rating-b .rating > * { display: block; float: left; height: 13px; background-repeat: no-repeat; background-size: auto 100%; } .rating-b .rating > .a { background-image: url(./rating-aa.svg); } .rating-b .rating > .b { background-image: url(./rating-ab.svg); background-position: 100% 0; } .rating-b.a { overflow: hidden; width: 93px; height: 16px; padding: 0; text-indent: -3000em; text-align: left; } .rating-b.a .rating { top: 0; width: 93px; height: 16px; } .rating-b.a .rating > * { height: 16px; } .social-a { overflow: hidden; list-style: none; padding: 0; } .social-a li { float: left; margin: 0 10px 10px 0; } .social-a a { display: block; overflow: hidden; position: relative; float: left; width: 30px; height: 30px; border-radius: 5px; border: 1px solid #c9c8c6; color: #c9c8c6; font-weight: 400; text-indent: -3000em; text-align: left; text-decoration: none; } .social-a a:hover { border-color: #f35480; background: #f35480; color: #fff; } .social-a i { display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -11px 0 0; line-height: 20px; text-align: center; text-indent: 0; } .social-a i.icon-twitter { font-size: 12px; } .social-a i.icon-linkedin { font-size: 12px; } .social-a i.icon-pinterest, .social-a i.icon-google-plus { font-size: 15px; } .tabs-a { } .tabs-a > ul { overflow: hidden; list-style: none; margin: 0 0 31px; padding: 0 0 10px; border-bottom: 1px solid #dedede; font-weight: 700; line-height: 1.1; text-transform: uppercase; } .tabs-a > ul li { float: left; margin: 0 55px 10px 0; font-size: 1.8em; } .tabs-a > ul li:last-child { margin-right: 0; } .tabs-a > ul li a { color: #222324; } .tabs-a > ul li.active a { color: #1070b8; text-decoration: none; cursor: default; } .tabs-a + * { margin-top: 58px; } /* .wsa-cookielaw { position: absolute; left: -3000em; top: -3000em; height: auto; } */ .wsa-cookielaw { position: fixed; bottom: 0; top:unset !important; z-index: 99999 !important; width: 100%; height: unset !important; margin: 0; padding: 10px; color: #fff; line-height: unset !important; background:rgba(0,0,0,0.4);transform:translateZ(0);-webkit-transform:translateZ(0); border-top: 1px solid #bbbbbb;border-bottom:0 !important; font-family:unset !important; white-space:unset !important; } .wsa-cookielaw-button,.wsa-cookielaw-button-green,.wsa-cookielaw-button-red,.wsa-cookielaw-button-orange,.wsa-cookielaw-button:hover,.wsa-cookielaw-button-green:hover,.wsa-cookielaw-button-red:hover,.wsa-cookielaw-button-orange:hover {background:#707070;border:none;border-radius:3px;padding:13px 30px;line-height:normal;text-shadow:none;height:auto;margin:5px;color:#fff;} .wsa-cookielaw-link,.wsa-cookielaw-link:hover {color:unset;margin:0;margin-left:10px;padding:0px 20px;} /*! Headers --------- */ h1, h2, h3, h4, h5, h6 { margin: 59px 0 11px; color: #222324; font-size: 1.7em; line-height: 1.1; text-transform: uppercase; } h1, h2 { font-size: 2.5em; } h3 { font-size: 2.1em; } h4 { font-size: 1.9em; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #222324; } .header-a { padding: 0 0 20px; border-bottom: 1px solid #dedede; font-size: 1.8em; } /*! Content --------- */ b, strong, .strong { font-weight: 700; } blockquote { margin: 1em 40px; } dfn, em, i, .em { font-style: italic; } ins { background: #ff9; color: #000; text-decoration: none; } mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } pre, code, kbd, samp { font-family: monospace, serif; font-size: 1em; } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } small { font-size: 85%; } strike, del, .strike { text-decoration: line-through; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } .text-justify { text-align: justify; } .text-lowercase { text-transform: lowercase; } .text-uppercase { text-transform: uppercase; } .overlay-a { color: #1070b8; } .overlay-b { color: #db1d00; } .overlay-c { color: #a3cf6c; } .overlay-d { color: #f0517d; } .size-a { font-size: 15px; } .scheme-a { display: inline-block; position: relative; padding: 4px 8px 2px; border-radius: 3px; background: #1070b8; color: #fff; font-size: 13px; text-transform: uppercase; } p + .scheme-a, ul + .scheme-a, ol + .scheme-a { margin-top: -11px; } .scheme-a a, a.scheme-a { color: #fff; text-decoration: none; } .scheme-a + h1, .scheme-a + h2, .scheme-a + h3, .scheme-a + h4, .scheme-a + h5, .scheme-a + h6 { margin-top: -9px; } .scheme-a.a { background: #f25480; } .scheme-a.b { background: #a3cf6c; } /*! Links --------- */ a { background: none; color: #1070b8; text-decoration: none; cursor: pointer; } /*---*/ a span { cursor: pointer; } a:hover, a:focus, a:active { text-decoration: underline; outline: none; } .link-a { font-size: 1.3em; font-weight: 600; line-height: 1.78571428571; text-transform: uppercase; } .link-a a { display: inline-block; overflow: hidden; position: relative; min-width: 160px; padding: 13px 32px; border-radius: 5px; background: #1070b8; color: #fff; text-decoration: none; text-align: center; } /*! Lists --------- */ ul, ol, dd, blockquote { padding-left: 40px; } ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; } .list-a { list-style: none; padding: 0; color: #909090; line-height: 1.42857142857; } .list-a li { position: relative; float: left; margin: 0 26px 0 0; } .list-a li:before { content: "|"; display: block; position: absolute; left: 100%; top: 0; width: 26px; text-align: center; } .list-a li:last-child, .social-a li:last-child { margin-right: 0; } .list-a li:last-child:before { left: -3000em; } .list-a li.a { } .list-a li.a a { display: block; position: relative; float: left; padding: 0 0 0 22px; color: #909090; } .list-a li.a a:before { content: "\e909"; display: block; position: absolute; left: 0; top: 0; color: #f35480; font-size: 15px; font-family: i; line-height: 15px; } .list-b { overflow: hidden; list-style: none; padding: 0; } .list-b li { float: right; font-size: 1.3em; } .list-b a { display: block; position: relative; float: left; padding: 0 10px 0 0; color: #222324; } .list-b a:before, .pagination-a li.prev a:before, .pagination-a li.next a:before { content: "\e910"; display: block; position: absolute; right: 0; top: 50%; margin: -5px 0 0; font-family: i; font-size: 7px; font-weight: 400; line-height: 10px; } .list-b li:first-child { float: left; } .list-b li:first-child a { padding: 0 0 0 10px; } .list-b li:first-child a:before, .pagination-a li.prev a:before { content: "\e90f"; left: 0; right: auto; } .list-c { position: relative; z-index: 2; list-style: none; margin: 0 0 34px; padding: 0; background: #1070b8; } .list-c:before { content: ""; display: block; position: absolute; left: -1000em; top: 0; z-index: 1; width: 3000em; height: 100%; background: #1070b8; } .list-c > li { position: relative; z-index: 2; float: left; padding: 0 44px 0 0; } .list-c > li > a { display: block; float: left; padding: 13px 15px 11px; color: #fff; } .list-c > li > ul { position: absolute; left: 0; top: -3000em; list-style: none; min-width: 100%; padding: 14px 19px; background: #015a9c; color: #fff; white-space: nowrap; } .list-c > li.toggle > ul { top: 100%; } .list-c > li > ul li { margin-bottom: 8px; } .list-c > li > ul label, .list-c > li > ul a { margin: 0; padding: 0; color: #9fbdde; cursor: pointer; font-size: 12px; } .list-c > li > ul label { padding-left: 23px; } .list-c > li > ul label input { position: absolute; left: -3000em; top: 0; } .list-c > li > ul label .input { display: block; overflow: hidden; position: absolute; left: 0; top: 3px; width: 13px; height: 13px; border: 1px solid #e1e1e1; background: #fff; cursor: pointer; } .list-c > li > ul label .input:before { content: "\e90a"; display: block; position: absolute; left: -3000em; top: 50%; width: 100%; margin: -10px 0 0; color: #1070b8; font-family: i; font-size: 6px; line-height: 20px; text-align: center; } .list-c > li > ul label.active .input:before { left: 0; } .list-c > li > ul label.active, .list-c > li > ul li.active label, .list-c > li > ul li.active a { color: #fff; text-decoration: none; } #breadcrumbs + #content > .list-c:first-child, #breadcrumbs + #content > form:first-child > .list-c:first-child { margin-top: -21px; } .list-d { position: relative; z-index: 2; list-style: none; margin: 0 0 26px; padding: 16px 22px 0 0; border-radius: 5px; background: #1070b8; color: #fff; line-height: 1.14285714286; } .list-d li { position: relative; float: left; width: 25%; min-height: 36px; margin: 0 0 16px; padding: 3px 0 0 54px; border-left: 22px solid rgba(0,0,0,0); } .list-d a { display: block; color: #fff; text-decoration: none; } .list-d i { display: block; overflow: hidden; position: absolute; left: 0; top: 50%; width: 36px; height: 36px; margin: -18px 0 0; border-radius: 30px; background: #a3cf6c; color: #fff; line-height: 36px; text-align: center; text-shadow: 1px 1px rgb(133, 174, 83), 2px 2px rgb(133, 174, 83), 3px 3px rgb(133, 174, 83), 4px 4px rgb(133, 174, 83), 5px 5px rgb(133, 174, 83), 6px 6px rgb(133, 174, 83), 7px 7px rgb(133, 174, 83), 8px 8px rgb(133, 174, 83), 9px 9px rgb(133, 174, 83), 10px 10px rgb(133, 174, 83), 11px 11px rgb(133, 174, 83), 12px 12px rgb(133, 174, 83), 13px 13px rgb(133, 175, 83), 14px 14px rgb(134, 176, 84), 15px 15px rgb(135, 177, 84), 16px 16px rgb(136, 178, 85), 17px 17px rgb(137, 179, 85), 18px 18px rgb(138, 180, 86), 19px 19px rgb(138, 181, 86), 20px 20px rgb(139, 182, 87), 21px 21px rgb(140, 183, 87), 22px 22px rgb(141, 184, 88), 23px 23px rgb(142, 185, 88), 24px 24px rgb(143, 186, 89), 25px 25px rgb(143, 187, 89), 26px 26px rgb(144, 188, 90), 27px 27px rgb(145, 189, 90), 28px 28px rgb(146, 190, 91), 29px 29px rgb(147, 191, 91), 30px 30px rgb(148, 193, 92); } .list-d i.icon-refresh { font-size: 16px; } .list-d i.icon-truck { font-size: 11px; } .list-d li.br { padding-top: 11px; } .list-d .inner { font-weight: 400; } .list-d span { font-weight: 700; } .list-d + .double { margin-top: 44px; } .list-d + * { position: relative; z-index: 1; } .list-d:before { content: "\e91a"; display: block; position: absolute; right: 17px; top: 100%; margin: -.5px 0 0; color: #1070b8; font-size: 45px; font-weight: 400; font-family: i; line-height: 45px; } .list-e { list-style: none; padding: 0; } .list-e li { position: relative; padding: 0 0 0 75px; color: #909090; font-size: 1.842em; } .list-e li > span:first-child { display: block; position: absolute; left: 0; top: 5px; color: #909090; font-weight: 400; font-size: 14px; } .list-e li.a { margin-top: -3px; color: #222324; font-weight: 700; font-size: 3.2em; } .list-e li.a > span:first-child { top: 14px; } .list-f { list-style: none; padding: 0; color: #000; } .list-f li { position: relative; margin: 0 0 10px; padding: 0 0 0 22px; font-size: 1.5em; font-style: italic; } .list-f li:before { content: "\e90a"; display: block; position: absolute; left: 0; top: 3px; color: #1070b8; font-size: 9px; font-family: i; font-weight: 400; font-style: normal; line-height: 9px; } .double > * + * > .list-f:first-child { padding-top: 32px; } /*.list-i li:after{ left: -3000em; }*/ .list-i { list-style: none; margin-bottom: 26px; padding: 0; color: #131414; font-family: Vito, Proxima, "Proxima Nova", Arial, Helvetica, sans-serif; } .list-i li { position: relative; min-height: 23px; margin: 0 0 2px; padding: 0 130px 0 0; font-size: 1.6em; } .list-i li > span:last-child { position: absolute; right: 0; top: 0; } .list-i li.a { min-height: 42px; margin: 13px 0 9px; padding: 10px 0 9px; background: #f8f9fb; font-weight: 700; } .list-i li.a > span:last-child { top: 10px; } .list-i li.a > span:last-child:before { content: ""; display: block; position: absolute; left: 0; top: 9px; right: 0; bottom: 9px; background: url(price-black.svg) no-repeat; background-size: 100% 100%; } .list-i li.b { margin: 9px 0 0; padding: 0 175px 0 0; font-size: 2.25em; font-family: Proxima, "Proxima Nova", Arial, Helvetica, sans-serif; font-weight: 700; text-align: right; } .list-i li.b > span:last-child { margin: -4px 0 0; color: #; font-size: 1.33333333em; font-weight: 600; } .list-i li.b + li.c { margin-top: 2px; } .list-i li.c { margin: 9px 0 0; padding: 0 175px 0 0; color: #6a6b6c; font-size: 1.3em; font-family: Vito, Proxima, "Proxima Nova", Arial, Helvetica, sans-serif; text-align: right; } /*! Media --------- */ img, iframe, object, embed { max-width: 100% !important; } img { height: auto !important; image-rendering: optimizeQuality; -ms-interpolation-mode: bicubic; } .lt-ie9 img { max-width: none !important; } img::selection { background: transparent; } img::-moz-selection { background: transparent; } figure { margin-bottom: 27px; } .icon-check { position: relative; top: -1px; margin: 0 4px 0 0; font-size: 9px; } /*! Forms --------- */ fieldset, hr { border-width: 0; } legend { position: absolute; left: 0; top: -3000em; padding: 0; border: 0; white-space: normal; } input, select, textarea { position: relative; z-index: 1; margin: 0; padding: 0; box-shadow: none; border-radius: 0; font-size: 1em; line-height: normal; text-align: left; text-transform: none; outline: none; } input, select, textarea, button, input[type="button"], input[type="reset"], input[type="submit"] { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } input { } input[type="search"], input[type="number"] { -moz-appearance: textfield; -webkit-appearance: textfield; appearance: textfield; } input::-webkit-search-decoration, input::-webkit-search-cancel-button { -webkit-appearance: none; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button, input::-webkit-clear-button, input::-webkit-calendar-picker-indicator { -webkit-appearance: none; visibility: hidden !important; height: auto; margin: 0; } input::-o-outer-spin-button, input::-o-inner-spin-button { -o-appearance: none; margin: 0; } input[type="checkbox"], input[type="radio"], .lt-ie9 input[type="checkbox"], .lt-ie9 input[type="radio"] { height: auto; padding: 0; border: 0; background: none; line-height: 1; } input[type="color"] { padding: 0; cursor: pointer; } textarea { overflow: auto; vertical-align: top; resize: vertical; } select { line-height: 1; text-overflow: ''; text-indent: 0.01px; -moz-appearance: none; -webkit-appearance: none; appearance: none; } select::-ms-expand { display: none; } button, input[type="button"], input[type="reset"], input[type="submit"] { display: block; overflow: visible; position: relative; z-index: 3; height: auto; margin: 0; box-shadow: none; text-transform: none; text-indent: 0; cursor: pointer; outline: none; -webkit-appearance: button; -webkit-font-smoothing: inherit; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; outline: none; } form [disabled] { cursor: default; } form > div { position: relative; } ::-webkit-input-placeholder { opacity: 1; color: #8b9195; } ::-moz-placeholder { opacity: 1; color: #8b9195; } :-moz-placeholder { opacity: 1; color: #8b9195; } :-ms-input-placeholder { opacity: 1; color: #8b9195; } :focus::-webkit-input-placeholder { opacity: 0; } :focus::-moz-placeholder { opacity: 0; } :focus:-moz-placeholder { opacity: 0; } :focus:-ms-placeholder { opacity: 0; } form { line-height: 1.42857142857; } label { display: block; position: relative; left: 0; top: 0; z-index: 2; margin: 0 0 5px; font-weight: 400; } form p { position: relative; clear: both; } form p:after { content: ""; display: block; overflow: hidden; clear: both; height: 0; } input { height: 38px; padding: 0 16px; } .lt-ie9 input { line-height: 36px; } select { padding: 9px 60px 9px 12px; } .select { display: block; position: relative; } .select select { display: block; position: relativee; z-index: 3; width: 100%; border-color: rgba(0,0,0,0); background: none; } .select:before, .semantic-select .ticker:before { content: "\e90e"; display: block; position: absolute; right: 0; top: 0; z-index: 2; width: 44px; height: 100%; border-radius: 0 4px 4px 0; background: #1070b8; color: #fff; font-family: i; font-weight: 400; font-size: 5px; line-height: 38px; text-align: center; } .select:after { content: ""; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; border-radius: 4px 8px 8px 4px ; border: 1px solid #e8e8e8; background: #fff; } textarea { height: 75px; min-height: 75px; padding: 9px 9px 9px 16px; } input, select, textarea, .semantic-select .input { border-radius: 4px; border: 1px solid #e8e8e8; background: #fff; } button, input[type="button"], input[type="reset"], input[type="submit"] { overflow: hidden; float: right; min-width: 160px; padding: 14px 32px; border-radius: 5px; border: 1px solid #1070b8; background: #1070b8; color: #fff; font-weight: 600; font-size: 13px; text-align: center; text-transform: uppercase; } .semantic-select { position: relative; } .semantic-select .input { display: block; height: 38px; padding: 0 60px 0 16px; border-radius: 4px 8px 8px 4px; background: #fff; line-height: 36px; } .semantic-select .input .text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: break-word; } .semantic-select .ticker { position: absolute; right: 0; top: 0; width: 44px; height: 100%; cursor: pointer; } .semantic-select ul { overflow: auto; position: absolute; left: -3000em; top: 37px; list-style: none; max-height: 250px; margin: 0; padding: 0; box-shadow: 0 1px 2px rgba(0,0,0,.23); border-radius: 0; border: 1px solid #e8e8e8; background: #fff; } .semantic-select ul li { font-size: 12px; } .semantic-select ul li a { display: block; padding: 4px 9px 3px; color: #222324; } .semantic-select ul li.active a { background: #f2f2f5; text-decoration: none; cursor: default; } .semantic-select.active ul { left: 3px; right: 44px; } .form-a { } .form-a header { margin-bottom: 44px; } .form-a h1, .form-a h2, .form-a h3, .form-a h4, .form-a h5, .form-a h6 { margin-bottom: 26px; font-size: 2.1em; } .form-a p { margin-bottom: 17px; } .form-a > p > span { display: block; float: left; padding: 9px 0 0; } .form-a > p > textarea + span { float: none; padding: 11px 0 0; text-align: right; } .form-a label .inner:after { content: ":"; } .form-a input, .form-a select, .form-a textarea { display: block; float: left; width: 427px; margin: 0 26px 0 0; border-radius: 0; border-color: #c8c8c8; font-size: 1em; } .form-a textarea { float: none; width: 100%; margin: 0; } .form-a button { margin-top: 29px; } .form-b { margin: 9px 0 27px; } .form-b > * { float: left; clear: none; margin: 0; } .form-b > *:first-child { margin-right: 27px; } .form-b > *:last-child { float: right; } .form-b ul, .form-b ol { margin: 0; } .form-b p { font-size: 1.3em; } .form-b p > span:first-child { display: block; float: left; padding: 3px 14px 0 0; } .form-b p > span:first-child .strong { margin-right: 7px; } .form-b label { display: block; float: left; padding: 3px 17px 0 0; } .form-b input, .form-b .select, .form-b select, .form-b .semantic-select-wrapper { display: block; float: left; } .form-b input, .form-b .semantic-select .input { height: 26px; } .form-b .semantic-select .input { padding: 0 39px 0 10px; line-height: 24px; } .form-b .semantic-select .ticker, .form-b .semantic-select .ticker:before, .form-b .select:before { width: 30px; line-height: 26px; } .form-b .semantic-select ul { top: 25px; } .form-b .semantic-select ul li a { padding-left: 10px; padding-right: 10px; } .form-b .semantic-select.active ul { right: 30px; } .form-b select { padding: 3px 39px 3px 6px; } .form-c { } .form-c p { margin-bottom: 28px; } .form-c label { color: #222324; font-weight: 700; text-transform: uppercase; } .form-c label span { position: absolute; right: 0; top: 2px; color: #e94673; font-weight: 400; font-size: .85714285714em; text-transform: none; } .form-c label span.overlay-d { position: relative; top: 0; font-size: 1em; } .form-c .submit { } .form-c .submit > span { display: block; float: left; padding: 8px 0 0; } .form-c .submit > button { float: right; border-color: #e94674; background: #e94674; } .form-c .submit .semantic-select .ticker { width: 32px; height: 32px; } .form-c .submit .semantic-select .ticker:before { width: 100%; background: none; color: #c9c9c9; line-height: 34px; } .form-c .submit .semantic-select .input { width: 88px; height: 32px; padding: 0 0 0 10px; border-radius: 3px; line-height: 30px; } .form-c .submit .semantic-select.active ul { right: 3px; top: 31px; } .form-c + .rating-b { margin-top: -7px; } .form-d { margin: 0 0 30px; } .form-d .double .list-i { margin-top: -5px; } .form-d { margin: 0 0 30px; } .form-d h3, .form-c h4, .form-c h5, .form-c h6 { margin-bottom: 5px; } .form-d .list-c { margin-bottom: 13px; } .form-d .double .list-i { margin-top: -5px; } .form-d p.submit { float: right; } .form-d p.submit label { float: left; } .form-d p.submit input { float: left; } .form-d p.submit button { float: right; } .form-d h5 { margin:39px 0 31px;} .form-d p.submit label {float: left; margin: 0 13px 0 0; padding: 6px 0 0; font-weight: 400; } .form-d p.submit input { display: block; float: left; width: 41px; height: 32px; padding: 0 5px; font-size: 13px; font-weight: 700; text-align: center;} .form-d button {width: 225px; height: 46px; margin: -7px 0 0 25px; font-size: 15px; } /*! Tables --------- */ table { display: table; width: 100%; border-collapse: collapse; border-spacing: 0; } th, td { padding: 5px 10px; border: 1px solid #eee; font-weight: 400; text-align: left; } /*! Helpers --------- */ *, *:before, *:after { -moz-transition: color 0.4s ease-in-out 0s, background-color 0.4s ease-in-out 0s, border-color 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s; -webkit-transition: color 0.4s ease-in-out 0s, background-color 0.4s ease-in-out 0s, border-color 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s; -o-transition: color 0.4s ease-in-out 0s, background-color 0.4s ease-in-out 0s, border-color 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s; -ms-transition: color 0.4s ease-in-out 0s, background-color 0.4s ease-in-out 0s, border-color 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s; transition: color 0.4s ease-in-out 0s, background-color 0.4s ease-in-out 0s, border-color 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s; -moz-transform-origin: center center; -webkit-transform-origin: center center; -o-transform-origin: center center; -ms-transform-origin: center center; -webkit-transition-delay: -0.1s; } #top > .menu:before, #top > .menu:after, #shadow, #mobile, .gallery-a *, .gallery-a > li.middle a, #cookie { -moz-transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -o-transition: all 0.4s ease-in-out 0s; -ms-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; } .clear { clear: both; overflow: hidden; width: 100%; height: 0; } .hidden, [hidden], template { position: absolute; left: -3000em; top: 0; } hr, .hr { display: block; overflow: hidden; width: 100%; height: 1px; margin: 15px 0; padding: 0; border: 0; border-top: 1px solid #ccc; background: none; font-size: 0; } .hr hr { display: none; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, #breadcrumbs p:first-child, .form-b:first-child, .list-e li.a:first-child, .quote-a:first-child, #root .form-d .list-i li:first-child { margin-top: 0; } .product:last-child, .gallery-a > li > div p:last-child { margin-bottom: 0; } /*! Warnings --------- */ p.lt-ie9, #root:after { position: fixed; left: 0; top: 0; z-index: 1000; width: 100%; height: 28px; background: #333; color: #fff; font-size: 1.2em; font-family: Arial, Helvetica, sans-serif; line-height: 28px; text-align: center; } p.lt-ie9 a { color: #fff; font-weight: 700; text-decoration: underline; } p.lt-ie9 a:hover, p.lt-ie9 a:focus, p.lt-ie9 a:active { text-decoration: none; } #root:after { content: "Ummm... schakel JavaScript ondersteuning in aub, voor een betere gebruikservaring van deze website."; } .js #root:after { position: absolute; left: -3000em; top: -3000em; } .js body { padding-top: 0; } .lt-ie9 body { padding-top: 28px; } /*! Miscellaneous --------- */ audio, canvas, iframe, img, svg, video { border-width: 0; vertical-align: middle; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } svg:not(:root) { overflow: hidden; } @-ms-viewport { width: auto; } ::selection { background: #1070b8; color: #fff; text-shadow: none; } ::-moz-selection { background: #1070b8; color: #fff; text-shadow: none; } #root .desktop-hide, #root .tablet-only, #root .mobile-only { position: absolute; left: -3000em; top: -3000em; bottom: inherit; right: inherit; } /**Added custom CSS **/ /* Dynamic search */ #search-results { position: absolute; width: 712px; right: 0; margin: 0; padding: 40px 0 36px; background: #fff; border-left: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; } #search-results a div.search-product { display: inline-block; padding: 0 24px; width: 70%; height: 90px; top: 35%; position: absolute; } .list-a.list-search li:before{ content: ""; } .list-a.list-search li:first-child:after{ display: none; } .list-a.list-search li:after{ content: ""; display: block; position: absolute; left: 56px; right: 56px; top: 0; height: 1px; background: #e1e1e1; } .list-a.list-search li { display: block; position: relative; width: 100%; min-height: 95px; margin: 0 0 10px; padding: 20px 0 0 54px; font-size: 1.7em; font-weight: 700; } .list-a.list-search img { display: inline-block; width: 150px; } #search-results li a { color: #000; } #search-results a div.search-image { display: inline-block; width: 90px; height: 90px; background-repeat: no-repeat; background-position: center; background-size: cover; border: 1px solid #e1e1e1; } .list-a.list-search span.more-info{ display: block; padding: 4px 0 0; color: #A5A4A4; font-size: 1em; font-weight: 400; position: absolute; text-transform: none; } .list-a.list-search span.more-info:hover{ text-decoration: underline; } .list-a.list-search span.price { display: block; padding: 3px 0 0; color: #000; font-size: 1em; font-weight: 700; position: absolute; right: 0; } div.link-b { overflow: hidden; max-width: 587px; margin-left: auto; margin-right: auto; text-align: center; text-transform: uppercase; } div.link-b a { display: inline-block; position: relative; padding: 0 25px; color: #000; font-size: 1.3em; font-weight: 400; } /* Bundle products */ .form-d .double.c { margin-left: -25px; } .form-d .double.c { margin-left: -25px; } .double.c > * { width: 41%; border-left-width: 25px; } .double.c > *:first-child { width: 59%; } .form-d .double.c > * { width: 41%; border-left-width: 25px; } .form-d .double.c > *:first-child { width: 59%; } .form-d .double > *:first-child { float: left; } .form-d .double > * { display: block; position: relative; float: right; border-left: 0 solid rgba(0,0,0,0); } /* END Bundle products */ .product input#quantity { width: 70px; text-align: center; display: inline-block; } p.compare { margin-top: 25px; } .product .double.b p.compare a { font-size: 14px; text-decoration: none; float: left; display: block; } ul.select-product_configure_variants, .product-configure-custom-option ul{ z-index: 10; } .homepage-usps{ width: 1184px; margin: 0 auto 75px; } #header-margin-left{ margin-left: 25px; } #writeReviewLink{ padding-left:1.8em; } #writeReviewLink>a{ font-size:0.8em;color:#1070b8; } .green{ color:#a3cf6c; } .product .double.b a, .product p.rating-b { font-size: 1.5em; } .product .double.b li>a{ font-size: 1.16em; } div.product>div>div.double.b>div>a { font-size: 1.4em!Important; } .prod-specs .row { border-top: 1px solid #e1e1e1; border-left: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; margin: 0px; } .prod-specs div.row:last-child { border-bottom: 1px solid #e1e1e1; } .prod-specs .col-xs-5{ border-right: 1px solid #e1e1e1; } .prod-specs .col-xs-5 p, .prod-specs .col-xs-7 p{ margin: 10px 0; } /* Customizing fonts, forms, dropdowns & buttons in gui --------- */ .gui .gui-popover, .gui ul.select-gui-form-country, .gui ul.select-gui-form-type, .gui ul.select-gui-form-details-region, .gui ul.select-gui-form-details-type, .gui ul.select-gui-form-billing_address-region, .gui ul.select-gui-form-billing_address-country, .gui .semantic-select.active ul{ z-index: 10; } .gui .gui-form .gui-checkbox label { word-break: break-word; } .gui .gui-input { position: relative; border: 1px solid #CCCCCC; overflow: hidden; height: 44px; } .gui .gui-input input { height: 44px; } .gui .gui-select select { font-size: 14px; height: 44px; } .gui .gui-image.gui-image-50 { width: 50px; } /*GUI FONTS*/ .gui .gui-form label em { font-size: 18px; } /*Service page --------- */ .gui.gui-faq .gui-block-title, .gui.gui-faq .gui-field label, .gui.gui-faq .gui-field .gui-input, .gui.gui-faq .gui-field .gui-text, .gui.gui-faq .gui-required, .gui.gui-faq .gui-button-small{ font-size: 14px; } /*Sitemap --------- */ .gui.gui-sitemap .gui-block-title, .gui.gui-sitemap .gui-list strong, .gui.gui-sitemap .gui-list a{ font-size: 14px; } /*Login page --------- */ .gui.gui-login .gui-page-title { font-size: 16px; } .gui.gui-login .gui-content-title, .gui.gui-login .gui-block-title, .gui.gui-login p, .gui.gui-login a.gui-button-small, .gui.gui-login .gui-field label, .gui.gui-login .gui-input input, .gui.gui-login a.gui-button-link, .gui.gui-login .gui-required { font-size: 14px; } /*Logged out page --------- */ .gui.gui-loggedout .gui-page-title { font-size: 16px; } .gui.gui-loggedout .gui-page-content { font-size: 14px; } /* Password*/ .gui.gui-password .gui-block-title, .gui.gui-password .gui-form label, .gui.gui-password .gui-form .gui-input input, .gui.gui-password .gui-required, .gui.gui-password .gui-buttons { font-size: 14px; } /* Register page --------- */ .gui.gui-register .gui-block-title, .gui.gui-register .gui-field label, .gui.gui-register .gui-input input, .gui.gui-register .gui-required, .gui.gui-register a.gui-button-link, .gui.gui-register span.select, .gui.gui-register .semantic-select .input .text, .gui.gui-register a.gui-button-small{ font-size: 14px; } /* Account page --------- */ .gui.gui-account .gui-block-title { font-size: 16px; } .gui.gui-account .gui-block-subtitle, .gui.gui-account .gui-block-subcontent, .gui.gui-account .gui-page-content, .gui.gui-account a.gui-button-link, .gui.gui-account .gui-field label, .gui.gui-account .gui-input input, .gui.gui-account .gui-required, .gui.gui-account span.select, .gui.gui-account .semantic-select .input .text, .gui.gui-account .gui-text textarea, .gui.gui-account a.gui-button-small { font-size: 14px; } /* Cart --------- */ .gui.gui-cart .gui-page-content, .gui.gui-cart .gui-progressbar li, .gui.gui-cart .gui-block-title, .gui.gui-cart .gui-field label, .gui.gui-cart .gui-form label, .gui.gui-cart .gui-input input, .gui.gui-cart .semantic-select .input .text, .gui.gui-cart .gui-required, .gui.gui-cart .gui-form .gui-field .gui-description, .gui.gui-cart a.gui-button-large.gui-button-action, .gui.gui-cart a.gui-button-small, .gui.gui-cart .gui-cart-sum, .gui.gui-cart span.select{ font-size: 14px; } .gui.gui-cart p.cart_variant { font-size: 14px !important; } /* Checkout --------- */ .gui.gui-checkout .gui-progressbar li, .gui.gui-checkout .gui-block-title, .gui.gui-checkout .gui-block-subtitle, .gui.gui-checkout .gui-field label, .gui.gui-checkout .gui-form label, .gui.gui-checkout .gui-input input, .gui.gui-checkout span.select, .gui.gui-checkout .gui-required, .gui.gui-checkout .gui-form .gui-field .gui-description, .gui.gui-checkout a.gui-button-large.gui-button-action, .gui.gui-checkout a.gui-button-link, .gui.gui-checkout a.gui-button-small{ font-size: 14px; } /* /checkout/onestep/ --------- */ .gui.gui-checkout.gui-checkout-one-page small.gui-price, .gui.gui-checkout.gui-checkout-one-page .gui-block-subtitle, .gui.gui-checkout.gui-checkout-one-page .gui-content-subtitle, .gui.gui-checkout.gui-checkout-one-page .gui-table thead tr th, .gui.gui-checkout.gui-checkout-one-page .gui-table tbody tr td, .gui.gui-checkout.gui-checkout-one-page .gui-text textarea, .gui.gui-checkout.gui-checkout-one-page .gui-cart-sum{ font-size: 14px; } .gui.gui-checkout.gui-checkout-one-page p.cart_variant { font-size: 14px !important; } /* /checkout/onestep/ --------- */ .gui .gui small { font-size: 12px; } /* /checkout/thankyou/ --------- */ .gui.gui-thankyou > * , .gui.gui-compare > *{ font-size: 14px; } .gui-table thead tr th, .gui-table tbody tr td { font-size: 14px; } /* review --------- */ .gui.gui-review > * { font-size: 14px; } /*Messages --------- */ .gui-messages, .messages{ width: 100%; font-size: 14px; line-height: 20px; margin-bottom: 30px; } .messages ul li{ font-size: 14px; } .gui-messages ul, .messages ul { padding: 10px 15px; color: #3B5998; background: #ECEFF5; list-style-type: none; border: 1px solid #3B5998; } .gui-messages ul li{ font-size: 14px; } .gui-messages ul.gui-error { color: #DD3C10; border-color: #DD3C10; background: #FCECE8; } .gui-messages ul.gui-success { color: #609946; border-color: #609946; background: #EFF5ED; } .gui-messages ul.gui-warning { color: #E2C822; border-color: #E2C822; background: #FCFAE9; } /*! Fonts --------- */ @font-face { font-family: 'Proxima'; src: url('./proximanova-regularit.eot'); src: url('./proximanova-regularit.eot?#iefix') format('embedded-opentype'), url('./proximanova-regularit.woff') format('woff'), url('./proximanova-regularit.ttf') format('truetype'), url('./proximanova-regularit.svg#proxima_novaregular_italic') format('svg'); font-weight: 400; font-style: italic; } @font-face { font-family: 'Proxima'; src: url('./proximanova-semibold.eot'); src: url('./proximanova-semibold.eot?#iefix') format('embedded-opentype'), url('./proximanova-semibold.woff') format('woff'), url('./proximanova-semibold.ttf') format('truetype'), url('./proximanova-semibold.svg#proxima_novasemibold') format('svg'); font-weight: 600; font-style: normal; } @font-face { font-family: 'Proxima'; src: url('./proximanova-semibolditalic.eot'); src: url('./proximanova-semibolditalic.eot?#iefix') format('embedded-opentype'), url('./proximanova-semibolditalic.woff') format('woff'), url('./proximanova-semibolditalic.ttf') format('truetype'), url('./proximanova-semibolditalic.svg#proxima_novasemibold_italic') format('svg'); font-weight: 600; font-style: italic; } @font-face { font-family: 'Proxima'; src: url('./proximanova-bold.eot'); src: url('./proximanova-bold.eot?#iefix') format('embedded-opentype'), url('./proximanova-bold.woff') format('woff'), url('./proximanova-bold.ttf') format('truetype'), url('./proximanova-bold.svg#proxima_novabold') format('svg'); font-weight: 700; font-style: normal; } @font-face { font-family: 'Proxima'; src: url('./proximanova-boldit.eot'); src: url('./proximanova-boldit.eot?#iefix') format('embedded-opentype'), url('./proximanova-boldit.woff') format('woff'), url('./proximanova-boldit.ttf') format('truetype'), url('./proximanova-boldit.svg#proxima_novabold_italic') format('svg'); font-weight: 700; font-style: italic; } /*! Icons --------- */ @font-face { font-family: 'i'; src: url('./icomoon.eot?zcocy0'); src: url('./icomoon.eot?zcocy0#iefix') format('embedded-opentype'), url('./icomoon.ttf?zcocy0') format('truetype'), url('./icomoon.woff?zcocy0') format('woff'), url('./icomoon.svg?zcocy0#icomoon') format('svg'); font-weight: 400; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'i' !important; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-drops-a:before { content: "\e919"; } .icon-drops-b:before { content: "\e91a"; } .icon-linkedin:before { content: "\e900"; } .icon-pinterest:before { content: "\e901"; } .icon-refresh:before { content: "\e902"; } .icon-star:before { content: "\e903"; } .icon-truck:before { content: "\e904"; } .icon-twitter:before { content: "\e905"; } .icon-zoom:before { content: "\e906"; } .icon-box:before { content: "\e907"; } .icon-cart:before { content: "\e908"; } .icon-chat:before { content: "\e909"; } .icon-check:before { content: "\e90a"; } .icon-chevron-down:before { content: "\e90b"; } .icon-chevron-left:before { content: "\e90c"; } .icon-chevron-right:before { content: "\e90d"; } .icon-chevron-rounded-down:before { content: "\e90e"; } .icon-chevron-rounded-left:before { content: "\e90f"; } .icon-chevron-rounded-right:before { content: "\e910"; } .icon-chevron-rounded-up:before { content: "\e911"; } .icon-chevron-up:before { content: "\e912"; } .icon-euro:before { content: "\e913"; } .icon-facebook:before { content: "\e914"; } .icon-google-plus:before { content: "\e915"; } .icon-heart:before { content: "\e916"; } .icon-home:before { content: "\e917"; } .icon-instagram:before { content: "\e918"; } /*! Fancybox --------- */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-overlay, .fancybox-overlay * { -moz-transition: none; -webkit-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .fancybox-wrap, .fancybox-wrap * { transition: none; -moz-transition: none; -webkit-transition: none; -o-transition: none; -ms-transition: none; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url(./fancybox_sprite.png); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060; } #fancybox-loading div { width: 44px; height: 44px; background: url(./fancybox_loading.gif) center center no-repeat; } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url(./blank.gif); -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-nav:hover span { visibility: visible; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /*.fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; }*/ .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url(./fancybox_overlay.png); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } /*.fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; }*/ .fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } #fancybox-buttons { position: fixed; left: 0; width: 100%; z-index: 8050; } #fancybox-buttons.top { top: 10px; } #fancybox-buttons.bottom { bottom: 10px; } #fancybox-buttons ul { display: block; width: 166px; height: 30px; margin: 0 auto; padding: 0; list-style: none; border: 1px solid #111; border-radius: 3px; -webkit-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); -moz-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); background: rgb(50,50,50); background: -moz-linear-gradient(top, rgb(68,68,68) 0%, rgb(52,52,52) 50%, rgb(41,41,41) 50%, rgb(51,51,51) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(68,68,68)), color-stop(50%,rgb(52,52,52)), color-stop(50%,rgb(41,41,41)), color-stop(100%,rgb(51,51,51))); background: -webkit-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); background: -o-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); background: -ms-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); background: linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 ); } #fancybox-buttons ul li { float: left; margin: 0; padding: 0; } #fancybox-buttons a { display: block; width: 30px; height: 30px; text-indent: -9999px; background-color: transparent; background-image: url(./fancybox_buttons.png); background-repeat: no-repeat; outline: none; opacity: 0.8; } #fancybox-buttons a:hover { opacity: 1; } #fancybox-buttons a.btnPrev { background-position: 5px 0; } #fancybox-buttons a.btnNext { background-position: -33px 0; border-right: 1px solid #3e3e3e; } #fancybox-buttons a.btnPlay { background-position: 0 -30px; } #fancybox-buttons a.btnPlayOn { background-position: -30px -30px; } #fancybox-buttons a.btnToggle { background-position: 3px -60px; border-left: 1px solid #111; border-right: 1px solid #3e3e3e; width: 35px; } #fancybox-buttons a.btnToggleOn { background-position: -27px -60px; } #fancybox-buttons a.btnClose { border-left: 1px solid #111; width: 35px; background-position: -56px 0px; } #fancybox-buttons a.btnDisabled { opacity : 0.4; cursor: default; } #fancybox-thumbs { position: fixed; left: 0; width: 100%; overflow: hidden; z-index: 8050; } #fancybox-thumbs.bottom { bottom: 2px; } #fancybox-thumbs.top { top: 2px; } #fancybox-thumbs ul { position: relative; list-style: none; margin: 0; padding: 0; } #fancybox-thumbs ul li { float: left; padding: 1px; opacity: 0.5; } #fancybox-thumbs ul li.active { opacity: 0.75; padding: 0; border: 1px solid #fff; } #fancybox-thumbs ul li:hover { opacity: 1; } #fancybox-thumbs ul li a { display: block; position: relative; overflow: hidden; border: 1px solid #222; background: #111; outline: none; } #fancybox-thumbs ul li img { display: block; position: relative; border: 0; padding: 0; max-width: none; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url(./fancybox_sprite@2x.png); background-size: 44px 152px; } #fancybox-loading div { background-image: url(./fancybox_loading@2x.gif); background-size: 24px 24px; } } /* Responsive --------- */ @media only screen and (min-width: 112.5em) { /* 1800 */ ul.select-fbb { min-width: 113px; } .list-c > li > a { padding: 13px 25px 11px; } } @media only screen and (max-width: 112.5em) { /* 1800 */ #news { padding: 0 20px; } ul.select-fbb { min-width: 113px; } } @media only screen and (max-width: 106.25em) { /* 1700 */ .gallery-a.a > li.w-21 { width: 21.415%; } } @media only screen and (max-width: 100em) { /* 1600 */ .gallery-a.a > li.w-21 { width: 21.41%; } .gallery-a.a > li.w-29 { width: 29.7%; } .gallery-a > li > div { left: 0; width: auto; margin: 0; } .gallery-a > li > div h1, .gallery-a > li > div h2, .gallery-a > li > div h3, .gallery-a > li > div h4, .gallery-a > li > div h5, .gallery-a > li > div h6 { margin-bottom: 4px; font-size: 4.2em; } .gallery-a > li > div p { font-size: 1.5em; } } @media only screen and (max-width: 93.75em) { /* 1500 */ .gallery-a.a { margin-left: -10px; } .gallery-a.a > li { margin-bottom: 10px; border-left-width: 10px; } .homepage-usps{ margin: 0 auto 65px;} .gallery-a.a > li.h-200 { height: 210px; } .gallery-a.a > li.h-400 { height: 388px; } .gallery-a.a > li.h-500 { height: 498px; } .gallery-a.a > li.h-550 { height: 566px; } .gallery-a.a > li.h-400 .label, .gallery-a.a > li.h-500 .label, .gallery-a.a > li.h-550 .label { right: 8px; top: 8px; } .gallery-a.a > li.h-400 .label.left, .gallery-a.a > li.h-500 .label.left, .gallery-a.a > li.h-550 .label.left { right: auto; left: 8px; } } @media only screen and (max-width:84.375em) { /* 1350 */ .gallery-a.a { } #root .gallery-a.a > li { width: 33.2%; } .gallery-a.a > li.h-400 .label, .gallery-a.a > li.h-500 .label, .gallery-a.a > li.h-550 .label { right: 37px; top: 37px; } .gallery-a.a > li.h-400 .label.left, .gallery-a.a > li.h-500 .label.left, .gallery-a.a > li.h-550 .label.left { right: auto; left: 37px; } } @media only screen and (max-width: 75em) { /* 1200 */ #top, #content, #breadcrumbs, #footer { width: 960px; } #top { } #top > form { width: 612px; } #search-results { width: 612px; } #footer { } #footer > nav { margin-left: -30px; } #footer > nav > * { border-left-width: 30px; } #footer * + .rating-a { margin-top: 0; } .homepage-usps{ width: 100%;} .double.b { margin-left: -25px; } .double.b > * { width: 50%; border-left-width: 25px; } .double.b > *:first-child { width: 50%; } .cols-a { } .cols-a > *:first-child, .cols-a > header:first-child + * { width: 735px; } .cols-b > *:first-child, .cols-b > header:first-child + * { width: 700px; } .gallery-a { margin: 0 0 6px -20px; } .gallery-a > li { height: 225px; margin-bottom: 20px; border-left-width: 20px; } .gallery-a span.info { bottom: 8px; } .gallery-a span.rating-b { margin-top: 6px; padding: 16px 0 0; } .no-mobile .gallery-a > li:hover span.desc, .mobile .gallery-a > li.toggle span.desc { max-height: 150px; } .double .gallery-a { margin-left: -10px; } .double .gallery-a > li { height: 150px; margin: 0 0 10px; border-left-width: 10px; } .news-a { } .news-a article > footer { padding-top: 30px; } .news-a article > footer > .link-a { float: none; margin: 0 0 10px; } .product { } .product .double:before { left: 25px; } .rating-a { padding: 0; } .rating-a:before { position: relative; left: 0; top: 0; } .tabs-a { } .tabs-a > ul li { margin-right: 35px; } .form-a { } .form-a input, .form-a select { width: 100%; max-width: 300px; } .form-c { margin-bottom: 28px; } .form-c p { margin-bottom: 10px; } .form-c .submit > span { position: relative; z-index: 9; float: none; padding: 0; } .form-c .submit > button, .form-c .submit .semantic-select .input { float: none; width: 100%; } .form-c .submit > * + * { margin-top: 10px; } #root .desktop-only, #root .tablet-hide, #footer > form figure { position: absolute; left: -3000em; top: -3000em; bottom: inherit; right: inherit; } .form-d button { margin-left: 15px; } .list-a.list-search span.price { right: 24px; } .list-c > li > a { padding: 13px 14px 11px; } } @media only screen and (max-width: 63.750em) { /* 1020 */ #cookie { left: 50%; width: 720px; margin-left: -360px; padding-top: 15px; } #cookie .text { display: block; } #cookie .link { display: block; padding: 10px 0 0; } #cookie .link a { margin: 0 15px; } } @media only screen and (max-width: 62.5em) { /* 1000 */ .list-a.list-search li { padding: 20px 0 0 24px; } .list-a.list-search li:after{ left: 24px; right: 24px;} #root .form-d .double > * { float: none; width: auto; } #top, #content, #breadcrumbs, #footer, .homepage-usps { width: 720px; } #top { } #nav > ul:first-child > li, #nav > ul > li.sub { margin-right: 25px; } #nav > ul > li.sub > a { padding-right: 14px; } #top > form { width: 400px; } #search-results { width: 400px; } #footer { } #footer > nav { margin-left: -20px; } #footer > nav > * { border-left-width: 20px; } #footer > form { padding: 30px 0; } #footer > form h1, #footer > form h2, #footer > form h3, #footer > form h4, #footer > form h5, #footer > form h6 { display: block; float: left; padding-right: 0; } #footer > form p { display: block; clear: none; float: right; width: 360px; padding-right: 120px; } #footer > form button { width: 120px; } #footer > ul li { margin-left: 30px; } .cols-a { } .cols-a > *:first-child, .cols-a > header:first-child + * { width: 495px; } .cols-b > *:first-child, .cols-b > header:first-child + * { width: 460px; } #root .product .double > * { float: none; width: auto; } #root .product .double > * + * { margin-top: 35px; } .gallery-a { } .gallery-a > li { width: 33.333333333%; height: 227px; } .gallery-a > li:nth-child(4n) + li { clear: none; } .gallery-a > li:nth-child(3n) + li, .list-d li:nth-child(2n) + li { clear: both; } .gallery-a > li > div h1, .gallery-a > li > div h2, .gallery-a > li > div h3, .gallery-a > li > div h4, .gallery-a > li > div h5, .gallery-a > li > div h6 { font-size: 3.2em; } .gallery-a.a > li.h-400 .label, .gallery-a.a > li.h-500 .label, .gallery-a.a > li.h-550 .label { right: 8px; top: 8px; } .gallery-a.a > li.h-400 .label.left, .gallery-a.a > li.h-500 .label.left, .gallery-a.a > li.h-550 .label.left { right: auto; left: 8px; } .double .gallery-a { margin-left: -10px; } .double .gallery-a > li { width: 50%; height: 169px; } .double .gallery-a > li:nth-child(3n) + li { clear: none; } .double .gallery-a > li:nth-child(2n) + li { clear: both; } .list-c { } .list-c > li { padding-right: 10px; } .list-d { } .list-d li { width: 50%; } .list-f { } .double > * + * > .list-f:first-child { padding-top: 0; } .news-a { } .news-a article > footer { padding-top: 30px; } .news-a article > footer .list-a { float: none; margin: 0 0 15px; } .news-a article > footer .social-a { float: none; margin: 0; } .product { } .product > figure, .product > figure a { height: 347px; } .quote-a { margin-top: 0; } .quote-a q:before { margin: 0 4px 0 0; font-size: 1em; line-height: 1; } .quote-a q:after { margin: 0 0 0 4px; font-size: 1em; line-height: 1; } .form-a { } .form-a input, .form-a select, .form-a > p > span { float: none; } .form-b { position: relative; } .form-b > *:last-child { position: absolute; right: 0; top: 0; margin-top: 0; } .form-b > * { float: none; clear: both; } .form-b > * + * { margin-top: 10px; } #root .desktop-hide, #root .tablet-only { position: relative; left: 0; top: 0; } #root .desktop-only, #root .tablet-hide, #footer > form figure { position: absolute; left: -3000em; top: -3000em; bottom: inherit; right: inherit; } } @media only screen and (max-width: 47.5em) { /* 760 */ .list-a.list-search li { padding: 20px 0 0 56px; } #search-results a div.search-product { padding: 0 24px ; width: 70%;} .list-a.list-search li:after{ left: 56px; right: 56px;} .list-a.list-search span.price {right:56px; } .gallery-b { margin-left: -30px; } .gallery-b li { border-left-width: 30px; } .gallery-b li:after { left: -30px; width: 30px; font-size: 15px; } .list-i { } .list-i li { padding-right: 80px; font-size: 1.4em; } .list-i li.b, .list-i li.c { padding-right: 80px; text-align: left; } .form-d p.submit { float: none; padding: 0; } .form-d p.submit label, .form-d p.submit input{ margin-bottom: 6px; } .form-d button { float: none; clear: both; width: 100%; margin: 0; } #top, #content, #breadcrumbs, #footer, .homepage-usps { width: auto; } #top, #content, #breadcrumbs, #footer { padding-left: 20px; padding-right: 20px; } #top { padding-top: 60px; border-top: 0; } #top:before { border-top: 0; } #top h1 { width: auto; margin: 0 -20px; } #top h1 a { background-position: center 0; } #nav, #nav:before { top: 0; height: 40px; padding: 0 40px 0 0; border: 0; line-height: 40px; } #nav > ul > li, #nav > ul > li.sub, #nav > ul > #language { margin: 0 10px 0 0; } #nav > ul > li > a, #nav > ul > li.sub > a:before, #nav > ul > #cart > a:before { line-height: 40px; } #nav > ul > #cart > a { width: 40px; } #nav > ul > #cart > a:before { width: 100%; text-align: center; } #nav > ul > #cart > a span { right: 50%; top: 7px; margin: 0 -16px 0 0; } #top > .menu, #top > .search { top: 0; } #top > form { left: 0; right: 0; top: -3000em; z-index: 9; width: 100%; padding: 0; box-shadow: 0 2px 2px rgba(0,0,0,.10); } #top > form p { padding: 0 40px 0 0; } #top > form p > a { right: 40px; width: 30px; text-align: left; } #top > form input { height: 40px; padding: 0 30px 0 20px; border-radius: 0; border: 0; border-bottom: 1px solid #e1e1e1; } #top > form button { width: 40px; height: 40px; border-radius: 0; } #top > form > ul { box-shadow: 0 2px 2px rgba(0,0,0,.10); border-radius: 0; border-left: 0; border-right: 0; border-top: 0; } #top > form > ul li a { padding-left: 20px; padding-right: 20px; } #search-results{ width: 100%; } .search-active #top > form { top: 40px; } .menu-active #mobile { left: 0; } .menu-active #shadow { visibility: visible; opacity: 1; } #breadcrumbs { } #breadcrumbs p { float: none; clear: both; margin-top: 5px; } #footer { padding-top: 20px; } #footer > form { padding: 20px 0; } #footer > form h1, #footer > form h2, #footer > form h3, #footer > form h4, #footer > form h5, #footer > form h6 { margin: 0 0 10px; padding: 0; text-align: center; } #footer > form p { width: 100%; padding: 0; } #footer > form input, #footer > form button { border-radius: 5px; } #footer > form button { position: relative; right: 0; top: 0; width: 100%; margin: 5px 0 0; } #footer > ul { padding: 20px 0; line-height: 1.4; text-align: center; } #footer > ul li:first-child { display: block; margin: 0 0 20px; } #footer > ul li + li { display: block; margin: 10px 0 0; } #cookie { left: 0; right: 0; width: auto; margin-left: 0; padding-left: 20px; padding-right: 20px; } #root .cols-a > *, #root .cols-b > *, #root #footer > nav > *, #footer > form h1, #footer > form h2, #footer > form h3, #footer > form h4, #footer > form h5, #footer > form h6, #footer > form p, #breadcrumbs p, #breadcrumbs ol, #breadcrumbs ul, #root .double > *, #root .product > * { float: none; width: auto; } #root .cols-a > * + *, #root .cols-b > * + *, #root #footer > nav > * + * { margin-top: 40px; } .cols-a { } .cols-a > aside h3:first-child, .cols-a > header:first-child h3:first-child, .cols-b > aside h3:first-child, .cols-b > header:first-child h3:first-child { padding-top: 0; } .gallery-a { margin: 0 0 16px -10px; } .gallery-a > li, .double .gallery-a > li { float: left; width: 50%; height: 135px; margin-bottom: 10px; border-left-width: 10px; } .gallery-a > li:nth-child(3n) + li, .double .gallery-a > li:nth-chid(3n) + li { clear: none; } .gallery-a > li:nth-child(2n) + li, .double .gallery-a > li:nth-chid(2n) + li { clear: both; } #root .gallery-a > li span.desc { max-height: 0; } #root .gallery-a span.price { max-height: 30px; } .gallery-a span.info { left: 10px; right: 55px; } #root .gallery-a > li > ul { right: 10px; bottom: 10px; } .gallery-a.a { margin-bottom: 10px; } #root .gallery-a.a > li { width: 49.95%; } .list-c { } .list-c > li { float: none; clear: both; margin: 0 -20px; padding: 0; } .list-c > li > a { float: none; padding-left: 20px; padding-right: 20px; font-size: 1em;} .list-c > li.toggle > ul { position: relative; top: 0; height: auto !important; min-height: 0 !important; } .list-c > li > ul li:last-child { margin-bottom: 0; } .list-d { } .list-d li { float: none; width: auto; } .nav-a { } .nav-a + nav, .nav-b + nav, .news-a article + .list-b, .news-a article + nav { margin-top: 0; } .news-a { } .news-a article { margin: 0 0 50px; } .cols-b > .news-a { margin-bottom: 0; } .pagination-a { text-align: center; } .product { } .product > figure { height: auto; margin-left: -20px; margin-right: -20px; } .product > figure a { height: auto; padding: 20px; } .product > figure img { position: relative; left: 0; top: 0; max-width: 100% !important; max-height: none !important; } .form-a { } .form-a button { margin-top: 5px; } .form-b { } #root .form-b > * { margin-right: 0; } .form-b > *:last-child { position: relative; float: none; margin-top: 8px; } .form-b label, .form-b p > span:first-child { float: none; margin: 0; padding: 0; } .form-b input, .form-b .select, .form-b select, .form-b .semantic-select-wrapper { float: none; clear: both; width: 100%; } .form-b .semantic-select .input { min-width: 0 !important; } .product > figure img { -moz-transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; transform: none; } #root .tablet-hide, #root .mobile-only, #nav > ul > #language, #nav > ul > #cart { position: relative; left: 0; top: 0; } #root .tablet-only, #root .mobile-hide, #nav > ul:first-child, #nav > ul > li, #top > p, #root .gallery-a > li:before { position: absolute; left: -3000em; top: -3000em; bottom: inherit; right: inherit; } #header-margin-left{ margin-left: 10px; } .form-d button { float: none; clear: both; width: 100%; margin: 0; } } @media only screen and (max-width: 31.25em) { /* 500 */ .gallery-a { } .gallery-a > li { height: 200px; } .gallery-a.a { height: auto !important; } #root .gallery-a.a > li { position: relative !important; left: 0 !important; top: 0 !important; float: none; width: auto; } #root .gallery-a.a > li { -moz-transform: none !important; -webkit-transform: none !important; -o-transform: none !important; -ms-transform: none !important; transform: none !important; } .list-a.list-search li { padding: 20px 0 0 24px; } .list-a.list-search li:after{ left: 0; right: 0;} .list-a.list-search span.price {float: right;} .list-a.list-search span.more-info {float: left;} } @media only screen and (max-width: 25em) { /* 400 */ @-ms-viewport { width: device-width; } @viewport { width: device-width; } .gallery-a { } .gallery-a > li { float: none; width: auto; height: 200px; } .gallery-a span.img { position: relative; left: 0; top: 0; padding: 1em; } .gallery-a span.img img { position: relative; left: 0; top: 0; margin: 0 auto; } .gallery-a span.img img { -moz-transform: none; -webkit-transform: none; -o-transform: none; -ms-transform: none; transform: none; } #root .gallery-a .label { position: absolute; left: -3000em; top: -3000em; bottom: inherit; right: inherit; } .gallery-b { margin-left: -20px; } .gallery-b li { border-left-width: 20px; } .gallery-b li:after { left: -20px; width: 20px; font-size: 12px; } } /* Test checkout formulier aanpassen ================================================== */ .gui-checkout-one-step .gui-block-option .gui-field .gui-radio > label { font-size: 14px !important; font-weight: normal; line-height: 25px; padding: 0; } .gui-checkout .gui-form .gui-right { font-size: 14px !important; }