@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700&subset=latin-ext'); body { font-family: Ubuntu, sans-serif; font-size:16px; color:#454545; } body.blocked { overflow:hidden !important; } /* GLOBAL STYLES */ @media (min-width: 1430px) { .container { width: 1370px; } } .container-fluid.move-left { margin-left: 160px; } .alert { margin:20px auto 30px; text-align:center; } a { color:#eb2c2c } a:hover { color:#000; } h2 { color:#252525; font-size:45px; margin:0 0 5px 0; } h3 { text-transform:uppercase; font-size:16px; line-height:20px; margin:0 0 25px; color:#e43232; } .button { background-color:#eb2e2c; border:0; color:#FFF; display:inline-block; padding:14px 50px; text-transform:uppercase; font-size:14px; text-align:center; margin:10px 0; transition: all .25s ease; } #orderForm .button { background-color: #eb6462; border: 0; color: #FFF; display: inline-block; padding: 18px 50px; text-transform: uppercase; font-size: 24px; text-align: center; margin: 10px 0; transition: all .25s ease; border-radius: 10px; } .button:hover, .button:focus, .button:active { background-color:#1b1b1b; transform: scale(.93); box-shadow:0px 3px 0px rgba(0,0,0,.2); color:#FFF; text-decoration:none; border-radius:5px; outline:none; } p.typical-subheader { font-size: 45px; color: #252525; margin: 50px 0 30px; font-weight: 700; letter-spacing: -2px; } /* END OF GLOBAL STYLES */ /* HEADER */ header.header { background: #151515; color: #FFF; height:100px; } a.logo.floating { background-color: #FFF; display: block; width: 160px; text-align: center; padding: 20px; height: 160px; position: absolute; top: 0; left: 0; z-index: 9; } .right-side { text-align:right; color:#989898; padding-top: 37px; } .right-side a { color:inherit; font-size:11px; text-transform:uppercase; margin-left:20px; } .right-side a:not(.lang-select) i { display:inline-block; font-size:24px; margin-right:5px; vertical-align:middle; } a.lang-select { display: inline-block; margin-left: 20px; padding: 0 5px; } .header .hd { margin:30px 0 0 15px; font-size:20px; color:#FFF; text-transform:uppercase; font-weight:700; line-height:20px; } .header .hd span { font-size: 13px; color: #FFF; font-weight: 300; background: cornflowerblue; padding: 2px 5px; margin-top: 5px; display: inline-block; } .hd-span { font-size: 13px; color: #FFF; font-weight: 300; background: cornflowerblue; padding: 2px 5px; margin-top: 5px; display: inline-block; text-transform: uppercase; } .search-main { position:relative; } .action-field { background-color:#FFF; border:1px #9d9d9d solid; padding:6px; color:#333; margin:30px 0 25px 0; max-width:400px; position:relative; cursor:pointer; } .action-field i { float:right; margin-top:7px; } .action-field input { border:0; padding: 5px 10px; } ul.select { position: absolute; z-index: 15; background-color: #FFF; top: 77px; left: 15px; padding: 15px; width: calc(100% - 30px); border: 1px #9d9d9d solid; list-style:none; display:none; } ul.select.on { display:block; } ul.select li { color:#1b1b1b; display:block; padding:5px 10px; } ui.select li:not(:last-of-type) { border-bottom:1px #9d9d9d solid; } ul.langs { list-style: none; display: none; } .ui-autocomplete { max-width:400px; } .ui-autocomplete li div { font-size: 14px; clear: both; height: 100px; padding-top: 0px; display: flex; align-items: center; } .ui-autocomplete img { width: 100px; float:left; margin:0 20px 0 0; } /* END OF HEADER */ /* WHEELS */ .section-wheels { padding:40px 0; } .section-wheels .wheels { padding:40px 0; } .section-wheels h3 { font-size:24px; color:#000; } .section-wheels ul { margin:15px 0 40px; } .section-slider { clear:both; } /* MAIN NAVIGATION */ nav.nav { box-shadow:0px 2px 5px rgba(0,0,0,.15); height:60px; position:relative; z-index:100; } nav.nav ul { list-style: none; padding: 0 0; margin: 0 0; width: 100%; display:flex; align-items:center; overflow:hidden; max-height: 60px; } nav.nav ul li { display:inline-block; } nav.nav ul li a { display: inline-block; color: #4b4b4b; text-transform: uppercase; text-align:center; font-size: 13px; padding: 20px 17px; letter-spacing:-.3px; margin: 0 1px; transition: background .25s ease; } nav.nav ul li a:hover { background-color:#efefef; text-decoration:none; } nav.nav .socials { position: absolute; top: 10px; right: 10px; } nav.nav .socials a { color:#4c4c4c; font-size:22px; display:inline-block; padding:5px 10px; } /* END OF MAIN NAVIGATION */ /* SLIDER */ .start-slider { height:690px; width:100%; } .start-slider .item { height:690px; background:#e5e5e7 url() no-repeat center center; background-size:contain; } .start-slider .text { font-size: 13px; line-height: 20px; text-transform: uppercase; font-weight: 300; margin-top: 80px; max-width: 700px; } .start-slider .text h1, .start-slider .text h2 { color:#e43232; font-size:28px; line-height:20px; margin:0 0 30px; font-weight:300; } .start-slider .text h1 strong, .start-slider .text h2 strong { color:#252525; font-weight:700; font-size:75px; text-transform:none; line-height:70px; } /* END OF SLIDER */ /* SECTIONS */ @-webkit-keyframes pulse{ from{-webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1);} 50%{-webkit-transform:scale3d(1.12, 1.12, 1.12);transform:scale3d(1.12, 1.12, 1.12);} to{-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1);}} @keyframes pulse{from{-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1);}50%{-webkit-transform:scale3d(1.12, 1.12, 1.12);transform:scale3d(1.12, 1.12, 1.12);}to{-webkit-transform:scale3d(1, 1, 1);transform:scale3d(1, 1, 1);}} .pulse{-webkit-animation-name:pulse;animation-name:pulse;} .section-concept { padding:50px 0; line-height:28px; font-weight:300; } .section-concept .main-image { } .section-concept .main-image img { max-width:100%; } .section-concept .dot { width: 24px; height: 24px; border-radius: 12px; background-color: #000; position: absolute; border: 5px #FFF solid; transition: transform .15s ease, background .15s ease, border .15s ease; } .section-concept .dot:after { animation: pulse 1.5s infinite linear; display: block; position: absolute; background-color: transparent; border: 3px #eb2e2c solid; width: 28px; height: 28px; top: -7px; left: -7px; content: ""; border-radius: 15px; z-index: 1; } .section-concept .dot:before { display:none; content:attr(data-title); position:absolute; width:200px; background-color:#000; padding:5px; color:#FFF; text-align:center; top:-70px; left:50%; margin:0 0 0 -100px; font-size:13px; } .section-concept .dot:hover { z-index:10001; cursor:pointer; transform:scale(1.2); } .section-concept .dot:hover:before { display:block; } .section-references { background-color:#191919; color:#FFF; padding:50px 0; overflow:hidden; position:relative; } .section-references .floating-text { position: absolute; bottom: -10px; left: 50px; font-size: 150px; color: rgba(255,255,255,.06); font-weight: 700; margin: 0 0; line-height: 150px; } .section-references .item { text-align:center; } .section-references .item blockquote { font-size:23px; line-height:36px; text-align:center; color:#FFF; font-weight:400; padding:20px; margin:10px auto; border:0; } .section-references .item cite { font-size:16px; color:rgba(255,255,255,.2); font-weight:300; letter-spacing:-.2px; } .section-references .owl-theme .owl-nav [class*=owl-] { background:transparent; font-size:40px; color:rgba(255,255,255,.2); font-weight:300; } .section-references .owl-theme .owl-nav [class*=owl-]:hover { color:#FFF; } .section-youtube { padding:50px 0; } .section-youtube iframe { width:100%; } .upper-padding { padding:20px 0 10px; } .section-standard { padding:40px 0 30px; } /* END OF SECTIONS */ /* FORMS */ .page-zamowienie .gray, .gray { background-color: #f5f5f5; padding: 30px 0; } .page-login .gray, .page-logowanie .gray { background-color: #f5f5f5; padding: 80px 0; } .login-inner h2 { font-size: 36px; margin: 0 0 25px; } .form-standard input[type=text], .form-standard input[type=email], .form-standard input[type=password], .form-standard textarea, .form-standard select { display: block; width: 100%; max-width: 400px; border: 1px #ccc solid; padding: 10px 15px; border-radius: 6px; box-shadow: 0px 0px 3px rgba(0,0,0,.15); margin: 5px 0 15px; } .form-standard input[type=text]:focus, .form-standard input[type=email]:focus, .form-standard input[type=password]:focus, .form-standard textarea:focus, .form-standard select { box-shadow:0px 0px 5px rgba(0,0,0,.3); border-color:#aaa; outline:none; } .error { border: 1px #f00 solid !important; } .form-standard .form__label { font-weight:600; display:block; } .space { padding:25px; } /* ORDER & BASKET */ . h2.step--title { margin: 0 0 25px; font-size: 24px; color: #eb2e2c; } form#zamowienieForm { max-width: 840px; margin: 0 auto; } .page-zamowienie h1 { text-align:center; } /* ATTRIBUTES */ .section-attributes { padding:40px 0 30px; } .carousel-attributes { text-align:center; } .carousel-attributes .item { width: 200px; display: inline-block; font-size: 12px; text-transform: uppercase; color: rgba(0,0,0,.5); text-align: center; margin: 0 10px 10px; vertical-align: top; } .carousel-attributes .item .picture { background:#EFEFEF url() no-repeat center center; background-size:cover; border-radius:50%; width:200px; height:200px; margin:0 auto 25px; position:relative; z-index:5; } .carousel-attributes .item .picture:after { display:block; content:""; background:transparent; border-radius:50%; width:200px; height:200px; top:0; left:0; border-right:10px #e43232 solid; position:absolute; z-index:3; transform:rotate(45deg); } .carousel-attributes .flex-name { display:flex; align-items:center; justify-content:center; height:50px; } .carousel-attributes .item .name { color:#000; font-size:16px; font-weight:700; } /* PRODUCTS */ .product-item { width:300px; height:410px; background-color:#FFF; position:relative; border:1px #e1e1e1 solid; transition: border .25s ease; margin-bottom:25px; } .product-item .picture { margin:10px; text-align:center; } .product-item .picture img { width:100%; } .product-item .details { text-align:left; margin:0 20px 5px; } .product-item .details a { color: #252525; font-size: 16px; line-height: 18px; font-weight: 500; transition: color .25s ease; display: block; } .product-item .details a.check { color:#eb2e2c; font-size:12px; font-weight:400; margin:12px 0 5px 0; display:block; text-transform:uppercase; max-width:200px; } .product-item .price { position: absolute; bottom: 0px; right: 0px; background-color: #eb2e2c; color: #FFF; padding: 10px 17px; font-size: 20px; } .product-item:hover { border-color:#eb2e2c; } .product-item:hover .details a { color:#eb2e2c; } .products-carousel.owl-theme .owl-nav [class*=owl-] { background:transparent; font-size:60px; color:rgba(0,0,0,.3); font-weight:300; position:absolute; top:160px; } .products-carousel .owl-next { right: 0px; } .products-carousel.owl-theme .owl-nav [class*=owl-]:hover { color:#272727; } .products-carousel .owl-prev { left:-70px; } .products-carousel .owl-next { right:-40px; } .product-sizes { background: #EFEFEF; padding: 10px; text-align: center; } /* END OF PRODUCTS */ /* PRODUCT DETAILS */ .product-details { padding: 30px 0; } a.image-main { border: 2px #EFEFEF solid; padding: 10px; display: block; } a.image-thumb { width:125px; height:125px; border: 2px #EFEFEF solid; padding: 10px; display: inline-block; margin:5px 10px 5px 0; background:white url() no-repeat center center; background-size:contain; } a.image-thumb img { width: 100%; height: 100%; object-fit: cover; } a.image-main:hover, a.image-thumb:hover { border-color:#eb2c2c; } .compatibility { padding:20px; background-color:#f5f5f5; margin:0 auto 25px; } .compatibility ul li { font-size:18px; font-weight:600; } .compatibility ul li em { font-weight:200; font-size:12px; display:block; font-style:normal; } .product-videos { margin:45px 0 15px; } /* END OF PRODUCT DETAILS */ /* PARALLAX */ .section-parallax { min-height:350px; margin:0 auto 0; } .section-parallax .text { } .section-parallax .flex { max-width: 900px; display: flex; align-items: center; /* justify-content: center; */ min-height: 350px; text-align:left; } .section-parallax h1 { margin:0 0; } .section-parallax h1 em { font-style:normal; color:#eb2c2c; font-size:42px; } /* ARGS */ .section-args { margin:30px auto; padding:30px 0; background-color:#f5f5f5; } .args-list { max-width:900px; margin:20px auto; } .arg-item { margin: 20px auto 20px; padding: 20px 0; position: relative; background-color:#FFF; } /* .args-list > div:not(:last-of-type):after { position: absolute; background-color: #eb2c2c; width: 14px; height: 14px; content: ""; border-radius: 10px; left: 50%; bottom: -28px; } */ .arg-item .picture { width:100%; height:250px; background:transparent url() no-repeat center center; background-size:contain; } .arg-item .text { height:250px; display:flex; text-align:center; align-items:center; justify-content:center; } .arg-item .text > div { padding:10px 25px; font-size:15px; letter-spacing:-.5px; } /* END OF ARGS */ /* FOOTER */ .footer.invert { filter:invert(100%); } .footer.invert img[alt='Paypal'] { filter:invert(100%); } .footer { background-color:#f5f5f5; color:#7c7c7c; padding:40px 0; text-transform:uppercase; font-size:13px; line-height:20px; } .footer h3 { color:#252525; font-size:24px; margin:0 0 10px; } .footer a { color:inherit; } .footer a:hover { color:#000000; text-decoration:underline; } .footer img { float:left; margin-right:20px; } .footer .text { } .footer .first-box:after { clear:both; display:block; content:""; } #cookieinfo { background-color:#7c7c7c; color:#FFF; font-size:11px; text-align:center; padding:10px; width:100%; } #cookieinfo a { color:inherit; text-decoration:underline; } p.buy-now { text-align: center; font-size: 26px; background-color: #fe0000; display: block; margin: 0 0 0px; padding: 8px 5px; color: #FFF; font-weight: 600; } p.buy-now span { display:block; font-size:12px; text-transform:uppercase; } .shipping-prices { margin-bottom: 20px; background: #f5f5f5; padding: 15px 5px; } .shipping-prices .shipping-price { display: block; text-align: center; } .shipping-prices .shipping-price .shipping-price, .shipping-prices .shipping-price .region-name { display: block; width: 100%; text-align: center; } .shipping-prices .shipping-price .region-name { margin:3px 0 0 ; font-size: 13px; } .shipping-prices > div:not(:first-of-type) { border-top:1px #DDD solid; padding:10px 0 10px; } .shipping-prices span.shipping-price { font-weight: 600; font-size: 22px; display: block; margin: 0 0 10px; } .shipping-price button.basket.btn { display: block; width: 90%; margin: 0 auto 15px; box-shadow: 0px 4px rgba(0,0,0,.2); position: relative; background-color:#d5d5d5; } .shipping-price button.basket.btn:hover { top:2px; margin-top:-2px; margin-bottom:17px; box-shadow: 0px 2px rgba(0,0,0,.2), inset 0px 5px 5px rgba(255,255,255,.2); background-color:#e3e3e3; } .shipping-price button.basket.btn:focus, .shipping-price button.basket.btn:active { margin-top:-2px; margin-bottom:17px; top:3px; box-shadow: 0px 0px rgba(0,0,0,.2), inset 0px 5px 5px rgba(255,255,255,.5); background-color:#efefef; outline:none; } .shipping-price button.basket.btn i { font-size:18px; margin-right:5px; } .order-floating-sidebar { display: block; text-align: center; background: #FFF; padding: 0px; } input.error { background-color: red; } .alert-info { padding: 10px; text-align: center; display: none; } .ajaxInfo { display: none; padding: 10px 20px; text-align: center; font-weight: 600; font-size: 18px; } /* CONTACT */ .section-contact { padding:40px 0; position:relative; } .section-contact input, .section-contact textarea { } .section-contact textarea { max-width:100%; height:150px; } /* MODUĊY DODATKOWE */ img { max-width:100%; } .flex { display:flex; } .flex.center{ align-content: center; justify-content: center; } .flex.column { flex-direction: column; } .small-container .container { max-width:1200px; } .container.narrow { max-width:1100px; } .roboto { font-family: 'Roboto',sans-serif; } .section-bg-text { padding:40px 0; background-size:cover; background-position: center center; position:relative; } .section-bg-text .row.flex { display:flex; justify-content: center; align-items: center; } .section-bg-text .thin-subtitle { margin-bottom:40px; font-size:38px; color:red; } .section-bg-text .text { text-align: justify; color:#fff; font-size:24px; line-height:28px; } .section-bg-text .change-margin { margin-top: -40px; } .section-bg-text .picture { text-align:center; } .section-bg-text .text.big { text-align:center; font-size:36px; color:#161616; } .section-bg-text .border-top:before { content:''; opacity:.3; width:90%; max-width:1180px; height:1px; background-color:#eeeeee; position:absolute; top:-40px; left:50%; transform:translate(-50%,0); display:block; z-index:1; } .section-bg-text .text.absolute { position:relative; top:-130px; left:100px; font-size:27px; color:#fff; } .no-bottom { padding-bottom:0; } .no-bottom .text { padding: 0 100px; } .section-bg-text .text.black { color:#161616; } .section-youtube.with-bg { padding:65px 0 80px; background-size:cover; background-position: center center; } .section-youtube.with-bg .title-wrapper { padding: 30px 40px 0 0; position:relative; height:100%; } .section-youtube.with-bg .title { position: absolute; top: 270px; left: 21px; transform: rotate(-90deg); font-size: 36px; line-height: 1; width: 300px; transform-origin: 100px 100px; text-align:right; } .section-youtube.with-bg .title strong { color:red; font-size:48px; display:block; font-weight:300; } .section-3-parts { padding:40px 0 80px; background-size:cover; background-position: center center; } .section-3-parts .change-margin { margin-top: -80px; } .section-3-parts .section-youtube.with-bg .title { color:#fff; } .section-3-parts .border-top .picture { text-align:center; } .section-3-parts .border-top .picture img { max-width:480px; } /* */ @media (max-width:1600px) and (min-width:1440px) { nav.nav ul { width:90%; } nav.nav .socials { } } /* RESPONSIVE */ @media (max-width:1440px) { nav.nav ul { height:58px; } nav.nav .socials { display:none; } nav.nav ul li a { padding:10px 12px; font-size:12px; } } @media (max-width:1230px) { } div#cookieinfo { background: #FFF; color: #232323; font-size: 16px; letter-spacing: .5px; text-align: center; padding: 10px; position:fixed; bottom:0; left:0; width:100%; z-index:10000; } div#cookieinfo p { max-width:600px; margin:10px auto; font-size:18px; line-height:26px; } div#cookieinfo a { color:#ababab; white-space:nowrap; } .category-description { margin:30px auto; padding:10px; } .shop-item { margin:20px auto; text-align:center; } .shop-item .img { display:block; width:100%; height:250px; background:transparent url() no-repeat center center; background-size:contain; } .shop-item .img:hover{ opacity:.8; } .shop-item .title { display:block; padding:5px; font-size:20px; } @media (max-width:1019px) { img { max-width: 100% !important; } .section-bg-text .change-margin .xs-no-margin { margin-top:0; } .section-youtube.with-bg { padding:20px 0 40px; } .section-bg-text .row.flex, .section-youtube.with-bg .row.flex { flex-wrap:wrap; } .section-youtube.with-bg .row.flex > div { flex:1 100%; } .section-youtube.with-bg .title { position: relative; top: 0; left: 0; transform: none; width: 100%; text-align: center; margin: 30px 0; font-size:29px; } .section-youtube.with-bg .title strong { font-size:36px; } .section-youtube.with-bg .image { text-align:center; } .section-youtube.with-bg .image img { width:60px; } .section-bg-text .text.absolute { top:unset; left:unset; } .section-bg-text .text { flex: 1 100%; padding: 50px 15px; margin:0; order:1; font-size: 17px !important; } .section-bg-text .text span { font-size:17px !important; } .section-bg-text .text a { display:block; } .section-bg-text .picture { order:2; } } @media (max-width:900px) { body { font-size:13px; } .arg-item .text > div { font-size:13px; } nav.nav { height:auto; } nav.nav ul { display:block; height:auto; text-align:center; } nav.nav ul li a { padding: 6px 10px; } a.logo.floating { width: 120px; padding: 10px; height: 120px; } header.header, .blackbar { height:120px; } h1, .h1 { font-size: 26px; } h2 { font-size:25px; } .choose-region { padding-top:20px !important; } .choose-region .items { display: block !important; } .choose-region .h1 { font-size: 24px; margin: 20px auto 10px; } .choose-region .items a { font-size: 14px !important; height: 50px !important; } p.typical-subheader { font-size: 25px; margin:25px auto 10px; } .container-fluid.move-left { margin-left:auto; } .start-slider .text h1, .start-slider .text h2 { color: #e43232; font-size: 22px; line-height: 22px; margin: 0 50px 30px 0; font-weight: 300; } .start-slider .text h1 strong, .start-slider .text h2 strong { font-size:45px; } .start-slider .text { font-size: 11px; line-height: 15px; } .section-references .item blockquote { font-size: 18px; line-height: 26px; } .section-references .floating-text { bottom: -10px; left: 30px; font-size: 60px; line-height: 70px; } .section-parallax h1 em { font-size:32px; } .section-references .item blockquote { font-size: 12px; line-height: 17px; } img { max-width:100%; height:auto !important; } } a.btn.btn-secondary { display: block; margin: 0 0 4px; padding: 3px; font-size: 12px; color: #000; } a.btn.btn-secondary strong { }