/*------------------------RESET---------------------------*/ body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ul,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; text-decoration:none; list-style-type: none;} article, aside, details, figcaption, figure, hgroup, menu, nav, section { display: block; } /*------------------------------------------------------*/ .hintNew { display:block; width:85%; max-height:calc(100% - 6em); position:fixed; left:5%; bottom:1em; overflow:auto; z-index:100100; background:rgb(33,33,33); color:white; font-size:0.9em; padding:2em 4em 2em 2em; } .hintNew > div { } .hintNew .close {opacity: 0.4; display: block; width: 1em; height: 1em; position: absolute; right: 2em; top: 1em; background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .hintNew .close:hover {opacity: 0.8;} .hintNew em { text-decoration:underline; cursor:pointer; } #in_hodnoceni_name { position: absolute; left: -9999em; top: 0; } .stitekblackfriday { color:#fff !important; background-color:#d3313c !important; } .radiNabidnemeSlevu_nasli { margin-top:1em; } #bt_nalezenaLepsiCena { margin-top:0.5em; } #bt_pridatDoKosiku { border: 3px solid #7bef1a !important; background-color: #1eb51e !important; } #bt_nalezenaLepsiCena { color:black; } .s1s .discount.p2 { border-radius:4px; } /*------------------------------------------------------*/ .dopStrong { color: #8c4f02; font-weight: 600; } .pobockyNaseptavani { display:block; width:100%; line-height:50px; background-color:#bb1b02; font-size:1.2em; } .pobockyNaseptavani::placeholder { font-weight: bold; color: black; } .descriptionSmartWatch hr { border:1px solid #d7d7d7; } .popisZS { color:#d0a43a; text-decoration-line: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; font-weight:300; font-size:1.1em; margin:70px 0px 58px 0px; cursor:pointer; display:block; width:100%; text-align:center; border-bottom:3px solid #d7d7d7; padding-bottom:20px; } .popisZS.prazdny { margin-top:30px; cursor:inherit; } @media screen and (max-width: 600px) { .popisZS { margin:45px 0px 25px 0px; } } .zs_sports > span { width:100%; display:block; display: flex; justify-content: center; align-content: center; align-items: center; flex-wrap: wrap; } .plus > .popisZS { border:0px solid black !important; margin:0px !important; position:relative; top:20px; } #pn_zs_a_z { margin-top:0.5em !important; font-weight:300 !important; top:25px; } .parametryZobrazit { color:#d0a43a; position:relative; top:3px; text-decoration-line: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; font-weight:300; font-size:1.1em; margin:10px 0px 0px 0px; cursor:pointer; display:block; width:100%; text-align:center; } .pn_white { background-color:white; } .obsah { background-color:white; } .exklusivni { color:white !important; } .darek { color:white !important; } html {width: 100%; height: 100%; background-color: white; overflow-x: hidden; font-family: 'Roboto', sans-serif;} body {display: block; width: 100%; box-sizing: border-box; min-height: 100%; height: auto; background: #0d0d0d; margin: 0 auto; font-weight: 300; font-family: 'Roboto', sans-serif; overflow-x: hidden; position: relative;} body.hidden {height: 100%; overflow: hidden;} body form {display: block; width: 100%; min-height: 100vh; background: white; margin: 0 auto; padding-left: 10px; padding-right: 10px; box-sizing: border-box; position: relative;} @media screen and (min-width: 2000px) { body {font-size: 22px;} } @media screen and (max-width: 2000px) { body {font-size: 20px;} } @media screen and (max-width: 1800px) { body {font-size: 19px;} } @media screen and (max-width: 1600px) { body {font-size: 18px;} } @media screen and (min-width: 1400px) { body form {max-width: 64em;} } @media screen and (max-width: 1300px) { body {font-size: 17px;} } @media screen and (max-width: 1080px) { body {font-size: 18px;} } @media screen and (max-width: 768px) { body {font-size: 17px;} } @media screen and (max-width: 640px) { body {font-size: 16px;} } @media screen and (max-width: 540px) { body {font-size: 15px;} } .cta-graphics {display: none;} @media screen and (min-width: 1400px) { .cta-graphics {display: block; width: 60em; height: 100%; background-size: 100% auto; background-repeat: no-repeat; background-position: center top; position: fixed; top: 0;} .cta-graphics.left {left: calc(50% - 32em - 60em);} .cta-graphics.right {right: calc(50% - 32em - 60em);} .cta-graphics.discount > div {display: block; width: 7.4em; text-align: center; position: absolute; top: 31.1em;} .cta-graphics.discount.left > div {right: 0.9em;} .cta-graphics.discount.right > div {left: 0.9em;} .cta-graphics.discount > div p:first-child {display: inline-block; text-align: center; font-size: 1.3em; color: white; font-weight: 800; background: #d0a43a; padding: 0.2em 0.65em; border-radius: 0.2em; box-sizing: border-box;} .cta-graphics.discount > div p:first-child::before {content: "až ";} .cta-graphics.discount > div p:last-child {display: block; width: 100%; text-align: center; font-size: 0.95em; color: white; font-weight: 500; line-height: 1.3em; margin-top: 0.85em;} .cta-graphics.tissot.left {background-image: url('/themes/default/images/cta-graphics/2024/tissot-left.jpg');} .cta-graphics.tissot.right {background-image: url('/themes/default/images/cta-graphics/2024/tissot-right.jpg');} .cta-graphics.certina.left {background-image: url('/themes/default/images/cta-graphics/2024/certina-left.jpg');} .cta-graphics.certina.right {background-image: url('/themes/default/images/cta-graphics/2024/certina-right.jpg');} .cta-graphics.rado.left {background-image: url('/themes/default/images/cta-graphics/2024/rado-left.jpg');} .cta-graphics.rado.right {background-image: url('/themes/default/images/cta-graphics/2024/rado-right.jpg');} .cta-graphics.citizen.left {background-image: url('/themes/default/images/cta-graphics/2024/citizen-left.jpg');} .cta-graphics.citizen.right {background-image: url('/themes/default/images/cta-graphics/2024/citizien-right.jpg');} .cta-graphics.seiko.left {background-image: url('/themes/default/images/cta-graphics/2024/seiko-left.jpg');} .cta-graphics.seiko.right {background-image: url('/themes/default/images/cta-graphics/2024/seiko-right.jpg');} .cta-graphics.garmin.left {background-image: url('/themes/default/images/cta-graphics/2024/garmin-left.jpg');} .cta-graphics.garmin.right {background-image: url('/themes/default/images/cta-graphics/2024/garmin-right.jpg');} .cta-graphics.mauricelacroix.left {background-image: url('/themes/default/images/cta-graphics/2024/maurice-left.jpg');} .cta-graphics.mauricelacroix.right {background-image: url('/themes/default/images/cta-graphics/2024/maurice-right.jpg');} .cta-graphics.hamilton.left {background-image: url('/themes/default/images/cta-graphics/2024/hamilton-left.jpg');} .cta-graphics.hamilton.right {background-image: url('/themes/default/images/cta-graphics/2024/hamilton-right.jpg');} .cta-graphics.ball.left {background-image: url('/themes/default/images/cta-graphics/2024/ball-left.jpg');} .cta-graphics.ball.right {background-image: url('/themes/default/images/cta-graphics/2024/ball-right.jpg');} .cta-graphics.edox.left {background-image: url('/themes/default/images/cta-graphics/2024/edox-left.jpg');} .cta-graphics.edox.right {background-image: url('/themes/default/images/cta-graphics/2024/edox-right.jpg');} .cta-graphics.festina.left {background-image: url('/themes/default/images/cta-graphics/festina-left.jpg');} .cta-graphics.festina.right {background-image: url('/themes/default/images/cta-graphics/festina-right.jpg');} .cta-graphics.raymondweil.left {background-image: url('/themes/default/images/cta-graphics/2024/raymond-left.jpg');} .cta-graphics.raymondweil.right {background-image: url('/themes/default/images/cta-graphics/2024/raymond-right.jpg');} .cta-graphics.frederiqueconstant.left {background-image: url('/themes/default/images/cta-graphics/2024/frederique-left.jpg');} .cta-graphics.frederiqueconstant.right {background-image: url('/themes/default/images/cta-graphics/2024/frederique-right.jpg');} .cta-graphics.oris.left {background-image: url('/themes/default/images/cta-graphics/oris-left.jpg');} .cta-graphics.oris.right {background-image: url('/themes/default/images/cta-graphics/oris-right.jpg');} .cta-graphics.calvinklein.left {background-image: url('/themes/default/images/cta-graphics/calvinklein-left.jpg');} .cta-graphics.calvinklein.right {background-image: url('/themes/default/images/cta-graphics/calvinklein-right.jpg');} .cta-graphics.esprit.left {background-image: url('/themes/default/images/cta-graphics/esprit-left.jpg');} .cta-graphics.esprit.right {background-image: url('/themes/default/images/cta-graphics/esprit-right.jpg');} .cta-graphics.storm.left {background-image: url('/themes/default/images/cta-graphics/storm-left.jpg');} .cta-graphics.storm.right {background-image: url('/themes/default/images/cta-graphics/storm-right.jpg');} .cta-graphics.prim.left {background-image: url('/themes/default/images/cta-graphics/2024/prim-left.jpg');} .cta-graphics.prim.right {background-image: url('/themes/default/images/cta-graphics/2024/prim-right.jpg');} .cta-graphics.casio.left {background-image: url('/themes/default/images/cta-graphics/casio-left.jpg');} .cta-graphics.casio.right {background-image: url('/themes/default/images/cta-graphics/casio-right.jpg');} .cta-graphics.police.left {background-image: url('/themes/default/images/cta-graphics/police-left.jpg');} .cta-graphics.police.right {background-image: url('/themes/default/images/cta-graphics/police-right.jpg');} .cta-graphics.jacqueslemans.left {background-image: url('/themes/default/images/cta-graphics/jacqueslemans-left.jpg');} .cta-graphics.jacqueslemans.right {background-image: url('/themes/default/images/cta-graphics/jacqueslemans-right.jpg');} .cta-graphics.tagheuer.left {background-image: url('/themes/default/images/cta-graphics/tagheuer-left.jpg');} .cta-graphics.tagheuer.right {background-image: url('/themes/default/images/cta-graphics/tagheuer-right.jpg');} .cta-graphics.mido-default.left {background-image: url('/themes/default/images/cta-graphics/2024/mido-left.jpg');} .cta-graphics.mido-default.right {background-image: url('/themes/default/images/cta-graphics/2024/mido-right.jpg');} .cta-graphics.baumemercier-default.left {background-image: url('/themes/default/images/cta-graphics/2024/baume-left.jpg');} .cta-graphics.baumemercier-default.right {background-image: url('/themes/default/images/cta-graphics/2024/baume-right.jpg');} .cta-graphics.montblanc-default.left {background-image: url('/themes/default/images/cta-graphics/2024/montblanc-left.jpg');} .cta-graphics.montblanc-default.right {background-image: url('/themes/default/images/cta-graphics/2024/montblanc-right.jpg');} .cta-graphics.tagheuer-default.left {background-image: url('/themes/default/images/cta-graphics/tagheuer-default-left.jpg');} .cta-graphics.tagheuer-default.right {background-image: url('/themes/default/images/cta-graphics/tagheuer-default-right.jpg');} .cta-graphics.soc-default.left {background-image: url('/themes/default/images/cta-graphics/2024/banner-soc-left.jpg');} .cta-graphics.soc-default.right {background-image: url('/themes/default/images/cta-graphics/2024/banner-soc-right.jpg');} } .hint strong {font-weight:600; font-size: 1em;} .pn_sportIkonky {display: flex; width: 100%; justify-content: center; align-content: center; align-items: center; flex-wrap: wrap; margin-bottom: 3em;} .pn_sportIkonky h2 {display: block; width: 100%; text-align: center; font-size: 1.8em !important; color:black !important; margin: 0 0 1.2em 0 !important;} .pn_sportIkonka {display: flex; width: 13em; height: 13em; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; background: #f5f5f5; border: 1px solid black; border-radius: 100%; padding: 1.3em; margin: 1em 0.5em; box-sizing: border-box;} .pn_sportIkonka .img {display: block; width: 100%; margin: 0.5em auto;} .pn_sportIkonka .img img {display: block; width: 60%; margin: 0 auto;} .pn_sportIkonka span {display: block; width: 100%; text-align: center; font-size: 0.85em; line-height: 1.2em; font-weight: 600;} .messageP {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; background: rgba(10,10,10,0.9); padding: 1.4em; box-sizing: border-box; position: fixed; top: 0; left: 0; z-index: 1001; overflow:auto;} .messageP .box {display: flex; width: 100%; max-width: 34em; justify-content: center; align-items: center; background: white; padding: 4em; border-radius: 6px; box-sizing: border-box; position: absolute; top: 30px; overflow: hidden;} .messageP .box:after {display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-size: auto 90%; background-position: center center; opacity: 0.1; position: absolute; left: 0; top: 0; z-index: 1; content: "";} .messageP .box .cross {display: block; width: 1em; position: absolute; right: 1em; top: 1em; z-index: 10; opacity: 0.4; cursor: pointer;} .messageP .box .cross:hover {opacity: 1;} .messageP .box .info {display: flex; width: 100%; height: 100%; justify-content: center; align-content: center; align-items: center; flex-wrap: wrap; position: relative; index: 2;} .messageP .box .info img {width:100%; height: 100%;} .messageP .box .info p {display: block; width: 100%; text-align: center; line-height: 1em;} .messageP .box .info p.text1 {font-size: 1em; font-weight: 600; color: #000000;} .messageP .box .info p.text2 {font-size: 2em; font-weight: 800; color: #000000; margin: 0.6em 0;} .slovnikPopis em { font-weight: normal; text-decoration-line: underline; text-decoration-style: solid; cursor:pointer; color:#be8805; } .slovnikPopis .popisDetail {display: none; width: 100%; height: auto; cursor: auto; padding: 40px 60px 40px 20px; font-size: 15px; font-style: italic; position: fixed; left: 0px; bottom: 0; text-align: left; z-index: 500; background: rgb(33,33,33); color: white; box-sizing: border-box;} .slovnikPopis.showPopis .popisDetail {display: block; font-size:20px; width:calc(100% - 100px); } .slovnikPopis .popisDetail .close {opacity: 0.4; display: block; width: 16px; height: 16px; position: absolute; left: 20px; top: calc(50% - 8px); background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .slovnikPopis .popisDetail .close:hover {opacity: 0.8;} .slovnikPopis .popisDetail object { display:block; margin-left:35px; } /*.product-component-sports__icon { display:inline-block; width:200px; } .product-component-sports__icon img { display:inline-block; width:200px; } .product-component-sports__icon .product-component-sports__name { }*/ img.product-component-sports__image { width: 200px; } .stitek {display: inline-block; align-items: center; color: black; font-size: 0.9em; font-weight: 600; padding: 0.2em 0.5em 0.15em; line-height: 1.3em; margin: 3px 3px 3px 0; border-radius: 3px;} .stitek.novinka {background: #a7dbff; color:#8c4f02;} .stitek.doporucene {background: #a7dbff; color:#8c4f02;} #cph_obsah_pn_kosik_krok2_doprava_doprava .item, #cph_obsah_pn_kosik_krok2_doprava_platba .item { padding-right: 1em; } #cph_obsah_pn_kosik_krok2_doprava_doprava .item:hover, #cph_obsah_pn_kosik_krok2_doprava_platba .item:hover { background-color:#EEEEEE; } #cph_obsah_pn_kosik_krok2_doprava_platba h3 { border-top:3px solid #f9cf6b; padding-top: 1.5em; } .dopravaAplatba .item { cursor:pointer; } @media screen and (min-width: 768px) { .dopravaAplatba { } /*.dopravaAplatba .item.sel { background-color:#DDFFDF; }*/ .dopravaAplatba .item { padding-top:0px !important; padding-bottom:0px !important; } .dopravaAplatba .item .img { cursor:pointer; } .dopravaAplatba .item .product { cursor:pointer; } .dopravaAplatba .item .price { cursor:pointer; } } .individualniCeny { position:fixed; font-size:18px; display: block; width:100%; color:White; text-align:center; padding:10px 0px 10px 0px; bottom:0px; left:0px; right:0px; background-color:#CA0000; z-index:99999; } .microsites {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; padding: 0 1em; box-sizing: border-box;} .microsites .item {display: block; width: calc(33.33% - 2em); margin-top: 3em;} .microsites .item:nth-child(1), .microsites .item:nth-child(2) {width: calc(50% - 2em);} .microsites .item .img {display: block; width: 100%; margin: 0 auto 0.5em;} .microsites .item .img img {display: block; width: 100%;} .microsites .item .img:hover img {-webkit-transform: none; transform: none;} .microsites .item h2 {display: block; width: 100%; text-align: center; margin: 0 0 1em;} .microsites .item h2 a {display: inline-block; font-size: 1.4em; font-weight: 600; color: black;} .microsites .item .button {display: flex; width: 10em; font-size: 0.8em; text-transform: uppercase; font-weight: 500; justify-content: center; margin: 0 auto;} @media screen and (max-width: 640px) { .microsites .item {width: calc(50% - 0.5em);} .microsites .item:nth-child(1), .microsites .item:nth-child(2) {width: 100%;} } .flex {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; padding: 0 2em; box-sizing: border-box;} .pg-panel .flex {padding: 0;} .container {display: block; width: 100%; margin-bottom: 2em; box-sizing: border-box;} .wrapper, .wrapper2 {display: flex; margin-left: auto; margin-right: auto; width: 100%; justify-content: center; align-items: center; align-content: center; box-sizing: border-box; flex-wrap: wrap;} @media screen and (max-width: 640px) { .flex {padding: 0 1.2em;} } p {font-size: 1em; line-height: 1.5em; font-weight: 300;} .flags li {padding-left: 1.5em; box-sizing: border-box; position: relative;} .flags li:before {display: block; width: 1em; height: 1em; background-size: 100% auto; background-position: center center; background-repeat: no-repeat; position: absolute; left: 1.1em; top: 0.26em; content: ""} .flags li.sui:before {background-image: URL("images/flags/sui.png");} .flags li.ger:before {background-image: URL("images/flags/ger.png");} .flags li.aut:before {background-image: URL("images/flags/aut.png");} .flags li.fra:before {background-image: URL("images/flags/fra.png");} .flags li.usa:before {background-image: URL("images/flags/usa.png");} .flags li.nor:before {background-image: URL("images/flags/nor.png");} .flags li.jpn:before {background-image: URL("images/flags/jpn.png");} .flags li.ita:before {background-image: URL("images/flags/ita.png");} .flags li.cze:before {background-image: URL("images/flags/cze.png");} .flags li.swe:before {background-image: URL("images/flags/swe.png");} .flags li.eng:before {background-image: URL("images/flags/eng.png");} .flags li.spa:before {background-image: URL("images/flags/esp.png");} .flags li a {padding-right: 2.2em !important;} .pn_vsechnynej { text-align:center !important; display:block; width:100%; } .pn_vsechnynej a { display:block; text-align:center; color:#666666; font-size:15px; text-transform:uppercase; text-decoration:underline;} .pn_vsechnynej a:hover { color:black; text-decoration:none; } .code { border-top:solid 2px #d7d7d7; padding-top:40px; padding-left:30px; } .code p { font-size:20px; display:inline-block; margin-right:15px; } .code div { width: 300px; display:inline-block; } .code div input { width: 300px; line-height:25px; } .poznamkaDodatek { font-size:18px; } /* .miluna { background-color:#DEE2E3 !important; } .miluna.detail .image .thumbs:after, .miluna.detail .image .thumbs:before { background-color:#DEE2E3 !important; } .miluna.detail .image .swiper-button-prev2, .miluna.detail .image .swiper-button-next2 { background-color:#DEE2E3 !important; } .miluna.detail .last-viewed .last:after, .miluna.detail .last-viewed .last:before { background-color:#DEE2E3 !important; } */ .imgRes_a { display:block; margin:0px auto; } .imgRes_a > .imgRes { max-width:100%; max-height:100%; height:auto; display:block; margin:0px auto; } .akcePopis { background-color:#751b22ed; color:white; display:inline-block; text-align:left; font-weight:600; font-size: 0.85em; line-height: 1.3em; /*border:1px solid #bc6036;*/ padding: 0.2em 0.4em; margin: -0.5em 0 1em; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .akcePopis strong { font-size: 30px; font-weight:600; } .dotazNaCenuOtaznik { display:block; font-size:30px; font-weight:600; padding:0px 10px 0px 10px; cursor:pointer; } .dotazNaCenuOtaznik i { font-size:36px; color:#d0a43a; margin:0px 15px 0px 10px; cursor:pointer; } .posledniNahled { position:fixed; width:300px; background-color:#d0a43a; padding:7px; top:25px; left:50%; margin-left:-160px; } #PKWin_form_loader { width:250px; height:150px; position:fixed; bottom:10px; z-index:99999; left:50%; margin:0px 0px 0px -125px; } #PKWin_form_loader div { width:250px; height:150px; background-color:#0C1116; position:absolute; z-index:99998; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: alpha(opacity=85); -moz-opacity: 0.85; -khtml-opacity: 0.85; opacity: 0.85;} #PKWin_form_loader div:before { width:250px; height:150px; content: ''; display:block; background-image:url('/themes/default/ajaxLoader.svg'); background-position:center center; background-repeat:no-repeat; } .bt_nacistVse, .bt_nacistDalsi { display:none; } .pn_infoPanel.zelene { font-size:25px; padding:0px 0.9rem 0px 0.9rem; } .krok5 .rychlaRegistrace { font-size:22px; padding:20px; margin:30px 0.9rem 60px 0.9rem; background-color:#ffd7a4; } .krok5 .rychlaRegistrace a { color:Black; text-decoration:underline; } .cart .infoDetailData { font-size:25px; width:100% !important; } .pn_zpravy { padding:0px 0px 40px 0px; min-height:300px; } .pn_nastaveniMenu { display:block; text-align:center; } #cph_obsah_pn_administrace { } #cph_obsah_pn_administrace h1 { font-size: 2em; font-weight: 600; } .pn_udaj input { } .bt_zmenaHesla { text-align:center !important; font-size:15px !important; padding:5px 0px 5px 0px !important; margin-top:5px !important; } #cph_obsah_pn_mojeObjednavky { } #cph_obsah_pn_mojeObjednavky .radek { display:block !important; width:100%; } .orders table {width: 80%; margin: 0px auto 30px auto;} .orders table th, .orders table td {padding: 4px 20px 4px 0; font-size: 16px; text-align: left;} .orders table th {color: #2f2f2f; font-weight: 600; font-family: 'Oswald', sans-serif;} .orders table td {color: #6a6a6a; font-weight: 500;} .orders table td a {color: #000000; text-decoration: underline; font-weight: 600;} .orders table td a:hover {text-decoration: none;} .orders table td:last-child a {width: 80px; padding: 5px 0; font-size: 12px; text-decoration: none; float: right;} @media screen and (max-width: 768px) { .orders table th, .orders table td {padding: 3px 15px 3px 0; font-size: 15px;} } @media screen and (max-width: 640px) { .orders table th, .orders table td {padding: 3px 12px 3px 0; font-size: 14px;} } @media screen and (max-width: 540px) { .orders table {display: block;} .orders table thead {display: none;} .orders table tbody {display: block; width: 100%;} .orders table tr {display: block; width: 100%; padding: 25px; margin-bottom: 5px; background: #f2f2f2; border: solid 1px #e0e0e0; box-sizing: border-box;} .orders table td {display: block; width: 100%; padding: 4px 0px;} .orders table td:first-child {font-size: 17px;} .orders table td:last-child a {float: none; padding: 11px 0;} } /*.tabcontrol { display:block; margin:50px 0px 50px; } .tabcontrol ul { border-bottom:1px solid #d8d8d8; } .tabcontrol ul li { display:inline-block; padding:5px 10px 5px 10px; position:relative; top:1px; cursor:pointer; color:#707070; font-size:17px; font-weight:500; } .tabcontrol ul .sel { border-bottom:2px solid #203e92; color:#203e92; } .tabcontrol .tab { padding:10px; display:none; font-size:16px; color:#707070; } .tabcontrol .tab table { display:inline-table; width:300px; margin-right:30px; } .tabcontrol .tab table td { width:50%; color:#1c294f; padding:5px 0px 5px 0px; border:0px solid black; } .tabcontrol .tab table td:last-child { color:#1c294f; font-weight:600; } .tabcontrol .tab .odkaz { display:block; margin:5px 0px 5px 0px; } .tabcontrol > .sel { display:block; }*/ .tabcontrol { display:block; width:100%; } .tabcontrol .tab { display:none !important;} .tabcontrol > .sel { display:block !important; } .chyba { background-color:#c81816; color:#ffffff; text-align:center; font-size:14px; padding:5px 0px 5px 0px; margin:1px auto 10px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .pg-contacts .tovys {margin-bottom: 1.3em;} .tovys {display: flex; width: 100%; height: 15em; justify-content: center; padding-top: 1em; box-sizing: border-box;} .tovys .text {display: flex; height: 100%; justify-content: flex-end; align-content: center; flex-wrap: wrap; margin-right: 0.5em;} .tovys h2 {display: block; width: 100%; color: #ffd7a4; font-size: 0.9em; line-height: 1.3em; text-align: right; margin-top: 0.6em;} .tovys h2 span {display: block; font-size: 1.5em; line-height: 1.3em; color: white;} .tovys .signature {display: block; height: 5em; width: auto; margin-top: 1em;} .tovys .img {display: block; width: auto; height: 100%; margin-right: 3em;} @media screen and (max-width: 540px) { .tovys {height: 11em;} .tovys .text {margin-right: 0;} .tovys h2 {font-size: 0.7em;} .tovys .signature {display: block; height: 4em; margin-top: 0.8em;} .tovys .img {margin-right: 1em;} } .cookiesInfo { position:fixed; font-size:18px; display: block; width:100%; bottom:0px; left:0px; right:0px; background-color:#1d1d1d; z-index:10000002; } .cookiesInfo .cookiesCnt { display: flex; min-height:60px; justify-content: center; align-items: center; flex-wrap: wrap; padding: 10px 30px; box-sizing: border-box;} .cookiesInfo .cookiesCnt .cookiesText { display: block; color: white; width: calc(100% - 200px);} .cookiesInfo .cookiesCnt .cookiesText a { color: #ffd7a4; text-decoration:underline; } .cookiesInfo .cookiesCnt .bt_cookiesOK { display:-block; width: 140px; margin-left: 40px; text-align:center; color: black; padding: 4px 0px 8px; background:#ffd7a4; border: solid 1px transparent;} .cookiesInfo .cookiesCnt .bt_cookiesOK:hover { border-color: #ffd7a4; color: #ffd7a4; background: none;} @media screen and (max-width: 768px) { .cookiesInfo .cookiesCnt .cookiesText {width: 100%; margin-bottom: 10px; font-size: 15px; text-align: center;} .cookiesInfo .cookiesCnt .bt_cookiesOK {width: 100px; margin-left: 0px; padding: 3px 0px 6px; font-size: 15px;} } #loader { display:block; position:absolute; z-index:500; } #loader > div { display:block; width:100%; height:100%; opacity:0.3; background-color:#000000; position:absolute; top:0px; left:0px; } #loader > span { display:block; width:32px; height:32px; position:absolute; top:0%; left:50%; margin:0px 0px 0px -16px; background-image:url('/themes/default/images/loader.gif'); background-repeat:no-repeat; background-position:0px center; } /* HEADER */ body form {padding-top: 5em;} #headerElm {display: flex; width: 100%; justify-content: center; position: fixed; top: 0; left: 0; font-size: 1em; z-index: 10000; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} #headerElm > div {display: flex; width: 100%; height: 5em; justify-content: space-between; background: white; padding: 0 1.3em; box-sizing: border-box; position: relative;} #headerElm > div:before {display: block; width: 100%; height: 100%; background: white; position: absolute; left: 0; top: 0; content: "";} #headerElm .logo {display: flex; width: 12em; height: 100%; align-items: center; position: absolute; left: calc(50% - 6em); top: -0.2em; z-index: 1; overflow: hidden;} #headerElm .logo > div {display: flex; width: 100%; height: 100%; align-items: center; padding: 1em; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 2;} #headerElm .logo > div video {display: block; width: 100%;} #headerElm .logo img {display: block; width: 100%; background: white; height: auto; position: relative; z-index: 1; animation-name: logo-img; animation-duration: 4s;} #headerElm .side {display: flex; width: auto; height: 100%; align-items: center; position: relative; z-index: 2;} #headerElm .side .navicon {display: flex; align-items: center; opacity: 0.6; color: black; position: relative; z-index: 1001; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} #headerElm .side .navicon .text-menu, #headerElm .side .navicon .text-close {display: flex; height: 24px; font-size: 1em; font-weight: 400; align-items: center;} #headerElm .side .navicon.menu .text-close {display: none;} #headerElm .side .navicon.close .text-menu {display: none;} #headerElm .side .navicon:hover {opacity: 1;} #headerElm .side .navicon > div {display: block; width: 1.1em; height: 0.8em; font-size: 1em; font-weight: 400; margin-right: 0.4em; cursor: pointer; position: relative; z-index: 10002;} #headerElm .side .navicon > div span {display: block; width: 100%; height: 2px; background: black; position: absolute; left: 0; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out;} #headerElm .side .navicon > div span:nth-child(1) {top: 0;} #headerElm .side .navicon > div span:nth-child(2), #headerElm .side .navicon > div span:nth-child(3) {top: calc(50% - 1px);} #headerElm .side .navicon > div span:nth-child(4) {bottom: 0;} #headerElm .side .navicon.close > div span:nth-child(2) {transform: rotate(45deg);} #headerElm .side .navicon.close > div span:nth-child(3) {transform: rotate(-45deg);} #headerElm .side .navicon.close > div span:nth-child(1), #headerElm .side .navicon.close > div span:nth-child(4) {opacity: 0 !important;} #headerElm .side .bt_zpetNaZnacky, #headerElm .side .bt_zpetNaUvod {display: block; opacity: 0.7; font-size: 1em; color: black; font-weight: 400; padding-left: 1.2em; position: relative; z-index: 1001; cursor: pointer; margin-left: 1.2em; transition: .15s ease-in-out;} #headerElm .side .bt_zpetNaZnacky:before, #headerElm .side .bt_zpetNaUvod:before {display: block; width: 0.9em; height: 0.9em; background-repeat: no-repeat; background-position: center center; background-size: contain; position: absolute; left: 0; top: 0.14em; content: "";} #headerElm .side .bt_zpetNaZnacky:before {background-image: url('images/icon-button-znacky.svg');} #headerElm .side .bt_zpetNaUvod:before {background-image: url('images/icon-button-uvod.svg');} #headerElm .side .bt_zpetNaZnacky:hover, #headerElm .side .bt_zpetNaUvod:hover {opacity: 1;} .landing #headerElm .side .bt_zpetNaZnacky {display: none;} #headerElm nav {display: block; width: 100%; height: 100%; opacity: 0; text-align: center; position: fixed; top: 0; left: -100%; z-index: -105; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; transition: opacity .25s ease-in-out;} #headerElm nav.show {opacity: 1; left: 0;} #headerElm nav > div {display: flex; width: 100%; min-height: 100%; flex-wrap: wrap; margin: 0 auto; background: white; position: relative; box-sizing: border-box;} #headerElm nav > div .header-left {display: block; padding: 0 0 5em 3em; box-sizing: border-box; position: relative; overflow: hidden;} #headerElm nav > div .header-left > span {display: flex; width: 7.2em; text-align: right; font-size: 1.5em; font-weight: 300; color: #999999; position: absolute; right: calc(100% - 1em); top: -1.9em; transform: rotate(-90deg); transform-origin: bottom right;} #headerElm nav > div .header-left > span:before {display: block; width: 10000px; height: 1px; background: #cacaca; position: absolute; right: 105%; top: 0.6em; content: "";} #headerElm nav > div ul {display: block; width: 100%;} #headerElm nav > div ul li {display: block; width: 100%; text-align: left; margin-bottom: 0.4em;} #headerElm nav > div ul li a {display: inline-block; font-size: 1.35em; color: #252525; font-weight: 600; transition: .15s ease-in-out;} #headerElm nav > div ul li a span {font-weight: 300;} #headerElm nav > div ul li a:hover {color: #c49831;} #headerElm nav > div .soc {display: block; position: absolute; left: 3em; bottom: 0;} #headerElm nav > div .soc p {display: block; font-size: 0.8em; color: #252525; font-weight: 600; margin: 0 0 0.3em;} #headerElm nav > div .soc div {display: flex; align-items: center;} #headerElm nav > div .soc div a {display: block; width: 1.3em; height: 1.3em; margin-right: 0.2em;} #headerElm nav > div .soc div a svg {display: block; width: 100%; height: 100%; fill: #252525; transition: .15s ease-in-out;} #headerElm nav > div .soc div a:hover svg {fill: #c49831;} #headerElm nav > div .header-right {display: block; box-sizing: border-box; position: relative;} #headerElm nav > div .img-links {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;} #headerElm nav > div .img-links div {display: block; position: relative; margin-bottom: 0.4rem; border-radius: 0.3em; overflow: hidden;} #headerElm nav > div .img-links div span {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; position: absolute; left: 0; top: 0; z-index: 1;} #headerElm nav > div .img-links div span img {display: block; width: 100%; transition: .15s ease-in-out;} #headerElm nav > div .img-links div span:after {display: block; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.5) 100%); position: absolute; left: 0; top: 0; z-index: 2; content: "";} #headerElm nav > div .img-links div p {display: flex; width: 100%; height: 100%; align-items: flex-end; text-align: left; line-height: 1.3em; color: white; font-weight: 600; text-shadow: 0.1em 0.1em 0.3em rgba(0,0,0,0.5); padding: 1.1em; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 3;} #headerElm nav > div .img-links div a {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 4;} #headerElm nav > div .img-links div:hover img {opacity: 0.8;} #headerElm nav > div .info-contacts {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; position: absolute; left: 0; bottom: 0;} #headerElm nav > div .info-contacts p {display: block; text-align: left; line-height: 1.3em; color: #252525; font-weight: 400;} #headerElm nav > div .info-contacts p strong {font-weight: 600;} #headerElm nav > div .info-contacts p span {display: inline-block; width: 4em;} #headerElm nav > div .info-contacts p a {display: inline-block; font-weight: 600; color: #252525;transition: .15s ease-in-out;} #headerElm nav > div .info-contacts p a:hover {color: #c49831;} #headerElm .side .icon {display: block; width: auto; height: auto; opacity: 0.5; margin-left: 1em; position: relative; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} #headerElm .side .icon:hover {opacity: 1;} #headerElm .side .icon img {display: block; width: auto; height: 1.2em;} #headerElm .side .icon.icon-user span, #headerElm .side .icon.icon-cart span, #headerElm .side .icon.icon-compare1 span, #headerElm .side .icon.icon-compare2 span {display: flex; width: 1em; height: 1em; justify-content: center; align-items: center; border-radius: 100%; background: black; color: white; font-size: 0.55em; position: absolute; right: -0.4em; bottom: -0.4em;} #headerElm .side .icon.icon-compare1 {display: none;} #headerElm .side .icon.icon-user span img {display: block; width: 70%; height: 70%;} @media screen and (min-width: 1400px) { #headerElm > div, #headerElm nav > div {max-width: 64em;} } @media screen and (min-width: 1081px) { #headerElm nav > div {justify-content: space-between; padding: 9em 3em 2em;} #headerElm nav > div .header-right {width: 35em;} } @media screen and (max-width: 1080px) { #headerElm .side .bt_zpetNaZnacky, #headerElm .side .bt_zpetNaUvod {text-indent: -1000px; padding-left: 1.3em; margin: -0.3em 0 0 0.75em;} #headerElm .side .bt_zpetNaZnacky:before, #headerElm .side .bt_zpetNaUvod:before {width: 1.22em; height: 1.22em;} #headerElm nav > div {padding: 9em 8% 2em;} #headerElm nav > div .header-right {width: 100%; margin-top: 2em;} } @media screen and (min-width: 640px) and (max-width: 1080px){ #headerElm nav > div ul {display: flex; justify-content: space-between; flex-wrap: wrap;} #headerElm nav > div ul li {width: 48%;} } @media screen and (max-width: 540px) { #headerElm {padding-top: 0; padding-bottom: 0;} #headerElm > div {width: 100%; height: 5em; border-radius: 0;} #headerElm .logo {width: 10em; left: calc(50% - 5em);} #headerElm .side .navicon > div {height: 0.9em;} #headerElm .side .navicon.menu .text-menu, #headerElm .side .navicon.close .text-close {display: none;} #headerElm .side .icon.icon-compare1 {display: block; position: relative; z-index: 1001;} #headerElm .side .icon.icon-compare2 {display: none;} } @media screen and (min-width: 441px) { #headerElm nav > div .header-right {padding-bottom: 5em;} #headerElm nav > div .img-links div {width: calc(50% - 0.2rem); padding-top: 28%;} #headerElm nav > div .img-links div p {font-size: 1em;} #headerElm nav > div .info-contacts p {width: calc(50% - 0.2rem); font-size: 0.8em;} } @media screen and (max-width: 440px) { #headerElm nav > div .header-right {padding-bottom: 10em;} #headerElm nav > div .img-links div {width: 100%; padding-top: 55%;} #headerElm nav > div .img-links div p {font-size: 1.2em;} #headerElm nav > div .info-contacts p {width: 100%; font-size: 1em; margin-top: 0.8rem;} } @keyframes logo-img { 0% {opacity: 0;} 70% {opacity: 0;} 100% {opacity: 1;} } /* FOOTER */ #footer {order: 2; display: block; width: 100%; height: auto; font-size: 0.85em; position: absolute; bottom: 0; left: 0; z-index: 10;} #footer .wrapper {justify-content: space-between; align-items: stretch; width: 100%; padding: 3em; margin: 0; box-sizing: border-box; position: relative;} #footer ul {display: block;} #footer ul li {display: flex; width: 100%; font-size: 1em; color: white; position: relative; margin: 0.2em 0;} #footer ul li:first-child {padding-bottom: 0.6em; margin-bottom: 0.3em; font-size: 1.1em; font-weight: 500; color: #ffd7a4;} #footer ul li a {display: inline-block; color: white; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} #footer ul li a:hover {color: #ffd7a4;} #footer ul.address li span {display: inline-block; width: 60px;} #footer ul.opening li span {display: inline-block; width: 80px;} #footer ul.opening li span.small {width: auto; color: #8b8b8b; font-size: 0.8em; max-width: 200px;} #footer ul.last {min-height: 100%; position: relative; margin-left: 2rem; padding-bottom: 40px; box-sizing: border-box;} #footer ul.last input {display: block; width: 15em; height: 2.6em; padding: 0 0.6em; background: black; color: white; font-size: 0.9em; border: solid 1px #525252; box-sizing: border-box; border-radius: 2px 0 0 2px;} #footer ul.last button {display: block; width: 2em; height: 2em; padding: 0; border-radius: 0 2px 2px 0;} #footer ul.last button img {display: block; width: 100%; height: 100%;} #footer ul.last .svk {max-width: 20em; margin-top: 1em; color: #8a8a8a; font-size: 0.8em; line-height: 1.2em;} #footer ul.last .svk img {display: block; width: 34px; height: 22px; margin-top: 6px; margin-right: 11px;} #footer ul.last .copyright {display: inline-block; text-align: right; font-size: 0.8em; position: absolute; bottom: 0; right: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} #footer ul.last .copyright a {color: #8a8a8a;} #footer ul.last .copyright a:hover {color: #ffd7a4;} #footer ul.last .fb, #footer ul.last .insta, #footer ul.last .yt {display: inline-block; width: auto; margin: 1em 0.6em 0 0;} #footer ul.last .fb img, #footer ul.last .insta img, #footer ul.last .yt img {display: block; width: auto; height: 1.5em; opacity: 1; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} #footer ul.last .fb:hover img, #footer ul.last .insta:hover img, #footer ul.last .yt:hover img {opacity: 0.85;} @media screen and (max-width: 1200px) { #footer ul.last {display: block; width: 100%; justify-content: center; margin-left: 0; padding-bottom: 0;} } @media screen and (max-width: 768px) { #footer .wrapper {display: block; max-width: 320px; height: auto; margin: 0 auto;} #footer ul {display: block; width: 100%; margin-bottom: 40px;} #footer ul li {display: flex; width: 100%; justify-content: center; align-items: flex-start; flex-wrap: wrap; font-size: 15px; text-align: center;} #footer ul li:first-child {padding-bottom: 2px; margin-bottom: 5px; font-size: 18px;} #footer ul.address li span {width: auto; margin-right: 5px; color: #a5a5a5;} #footer ul.opening li span.small {display: block; width: 100%; max-width: 100%; text-align: center;} #footer ul.opening li:last-child span {width: auto;} #footer ul.last {margin-bottom: 0;} #footer ul.last .svk {display: block; max-width: 100%; width: 100%; text-align: center;} #footer ul.last .svk img {margin: 35px auto 5px;} #footer ul.last .copyright {display: block; width: 100%; text-align: center; position: relative; bottom: auto; left: auto; margin-top: 40px;} #footer ul.last .fb, #footer ul.last .insta, #footer ul.last .yt {display: block;} #footer ul.last .insta {margin-top: 2px;} #footer ul.last .yt {margin-top: 5px;} } .whisperer {display: block; width: 100%; background: white; border: solid 1px rgba(0,0,0,0.2); overflow: auto;} .whisperer p {display: block; width: 100%; font-size: 0.9em; font-weight: 400; color: #666666; box-sizing: border-box; padding: 1rem 1rem 0.3em; border-top: solid 1px rgba(0,0,0,0.1);} .whisperer p strong {color: #252525;} .whisperer strong {font-weight: 600; color: #be8805;} .whisperer > ul {display: block; width: 100%; margin-top: 0.6em;} .whisperer > ul li {display: block; width: 100%;} .whisperer > ul li .label {display: block; width: 100%; font-size: 0.9em; font-weight: 400; color: #666666; padding: 0.25em 1rem; box-sizing: border-box; cursor: pointer; transition: .2s ease-in-out;} .whisperer > ul li .label .arrow {display: inline-block; width: 0.6em; height: 0.6em; background: URL('images/arrow-r.svg') no-repeat center center; background-size: 100% auto; margin: 0 0.5em 0 0.3em; opacity: 0.8; position: relative; top: 0.25em;} .whisperer > ul li .label:hover {color: #252525; background: rgba(0,0,0,0.05);} .whisperer .results {display: flex; width: 100%; flex-wrap: wrap; margin-top: 0.6em; border-top: solid 1px rgba(0,0,0,0.1);} .whisperer .results > div {display: flex; justify-content: space-between; align-items: center; padding: 1rem; box-sizing: border-box; position: relative; cursor: pointer;} .whisperer .results > div .img {display: block; width: 30%;} .whisperer .results > div .img img {display: block; width: 100%;} .whisperer .results > div ul {display: block; width: 65%;} .whisperer .results > div ul li:nth-child(1) {font-size: 0.9em; color: #666666;} .whisperer .results > div ul li:nth-child(2) {font-size: 1em; color: #252525; font-weight: 500;} .whisperer .results > div ul li:nth-child(3) {font-size: 0.8em; color: #666666;} .whisperer .results > div:after {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; content: ""; transition: .2s ease-in-out;} .whisperer .results > div:hover:after {background: rgba(0,0,0,0.06);} @media screen and (min-width: 960px) { .whisperer .results > div {width: 33.33%;} } @media screen and (min-width: 540px) and (max-width: 960px){ .whisperer .results > div {width: 50%;} } @media screen and (max-width: 540px) { .whisperer .results > div {width: 100%;} } /* GENERAL */ strong {font-weight: 500;} em {font-style: italic;} p a, .link {color: #be8805; text-decoration: underline;} p a:hover, .link:hover {text-decoration: none} .heading1 {display: block; width: 100%; font-size: 36px; font-weight: 600; color: #303030; text-align: center; margin-bottom: 1rem; text-transform: uppercase;} .section {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; margin: 14px 0;} .button {display: inline-block; font-size: 1em; padding: 0.4em 1.1em; border: none; outline: none; text-align: center; box-sizing: border-box; cursor: pointer; -webkit-transition: .2s ease-in-out; transition: .2s ease-in-out;} .button.yellow {background: #ffd7a4; color: #874325; font-weight: bold;} .button.yellow:hover {background: #f7bc87;} .button.yellow.arrow:after {display: inline-block; margin-left: 9px; content: " \f105 \f105"; font-family: fontawesome; font-size: 1em;} .button.grey {color: white; background: /*#252525 - do 14.12.23*/#dcaf36; border: solid 2px #f3e0a4; border-radius:6px;} .button.grey:after {display: inline-block; margin-left: 0.5em; content: " \f105 \f105"; font-family: fontawesome; font-size: 1em; position: relative; top: 0em;} .button.grey:hover {background: none; color: rgba(33,33,33,1);} .button.grey.highlight { border: solid 3px #f3e0a4; color:black; font-weight:600; font-size:1.2em; } .button.border {border: solid 1px rgba(33,33,33,1); color: rgba(33,33,33,1); font-size: 15px;} .button.border:hover {background: #2A0003; color: white;} .bg-black {background: URL('images/bg-black-stripe.png') no-repeat center top, URL('images/bg-black-stripe.png') no-repeat center bottom, URL('images/bg-black-glow.png') no-repeat center top, #252525; background-size: 1900px 4px, 1900px 4px, 1900px auto, cover;} .brands {display: block; width: 100%; height: 160px; height:60px; position: relative; overflow: hidden;} .brands .logos {display: flex; width: auto; height: 60px; align-items: center; position: absolute; left: 0; top: 60px; animation-name: move-brands; animation-duration: 40s; animation-iteration-count: infinite; animation-timing-function: linear;} .brands .logos a {display: block; width: auto; height: 60px; margin: 0 30px;} .brands .logos a img {display: block; width: auto; height: 40px;} .tiny-nav {display: flex; width: 100%; flex-wrap: wrap; margin-bottom: 1em; margin-bottom: 1em; box-sizing: border-box;} .tiny-nav a {display: block; font-size: 0.85em; text-decoration: underline; color: #9e9e9e; margin-right: 0.7em; line-height: 1.4em; letter-spacing: 0.02em;} .tiny-nav a:hover {color: #6e6e6e; text-decoration: none;} .tiny-nav a:before {display: inline-block; margin-right: 0.7em; content: "\f105"; font-family: fontawesome;} .tiny-nav a:hover:before {color: #b6b6b6;} .tiny-nav a:first-child:before {display: none;} .tiny-nav a:last-child {text-decoration: none; font-weight: 600;} .line1 {display: block; width: calc(100% - 1.8rem); height: 1px; margin: 15px 0.9rem 30px; background: #e5e5e5;} .input1, select, .chkselect {display: block; width: 9em; height: 2.5em; background: white; border: solid 1px #e0e0e0; padding: 0 0.8em; font-size: 1em; font-weight: bold; box-sizing: border-box; outline: none;} select {padding-right: 2.2em; -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; text-overflow: ''; position: relative; background: URL('images/arrow-down.png') no-repeat center right 0.7em; background-size: 0.4em auto;} select::-ms-expand {display: none;} .input1:focus, select:focus, .chkselect:focus, .input1:hover, select:hover, .chkselect:hover {border-color: #a0a0a0;} .chkselect {padding-right: 2em; background: URL('images/arrow-down.png') no-repeat right 1em top 1.05em, white; background-size: 0.6em auto, cover; position: relative;} .chkselect .info {font-size: 0.6em;} .chkselect p {display: flex; width: 100%; height: 100%; align-items: center; font-size: 0.8em; font-weight: 400; line-height: 1.3em; color: #484848; box-sizing: border-box; cursor: pointer;} .chkselect .options {display: none; width: calc(100% + 2px); height: auto; max-height: 15em; padding: 1em; position: absolute; top: 2.5em; left: -1px; z-index: 5; overflow: auto; background: white; border-left: solid 1px #e0e0e0; border-right: solid 1px #e0e0e0; border-bottom: solid 1px #e0e0e0; box-sizing: border-box; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .chkselect .options .note {display: block; width: 100%; font-size: 0.85em; color: #747474; margin-bottom: 1em;} .chkselect.show {background-image: URL('images/arrow-up.png'); border-color: #a0a0a0;} .chkselect.show .options {display: block; border-color: #a0a0a0;} .chkselect.empty {height: 1px; visibility: hidden;} .bt_filtr_parametr_ok {display:block; font-size: 0.7em; text-align:center; cursor:pointer; margin-top: 0.8em; padding: 0.8em 0px; background-color:#e9e9e9;} .label1 {display: flex; width: 100%; align-items: center; flex-wrap: wrap; color: #8c8c8c; box-sizing: border-box; font-size: 0.8em; font-weight: 400; position: relative;} .label1:hover {color: #5b5b5b;} input.chk1:not(:checked), input.chk1:checked {position: absolute; left: -9999px;} input.chk1:not(:checked) + label, input.chk1:checked + label {padding-left: 1.3em; margin-top: 0.5em; cursor: pointer;} input.chk1:not(:checked) + label:before, input.chk1:checked + label:before {content: ""; display: block; width: 1.1em; height: 1.1em; position: absolute; left: 0; top: 0.08em; background-image: URL('images/checkbox.png'); background-size: auto 300%; background-repeat: no-repeat;} input.chk1:not(:checked) + label:before {background-position: left top;} input.chk1:not(:checked) + label:hover:before {background-position: left center;} input.chk1:checked + label:before {background-position: left bottom;} input.chk1:checked + label {color: #00507c;} .ordering {display: flex; width: 100%; justify-content: flex-start; align-items: center; flex-wrap: wrap; font-size: 0.9em; margin-bottom: 0.7em; box-sizing: border-box; position: relative; } .ordering > div {display: flex;} .ordering span {display: inline-block; color: #9b9b9b; font-size: 0.9em; font-weight: 600; margin-left: 1em; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .ordering span:first-of-type {margin-left: 0;} .ordering span:hover, .ordering span.active {color: #1a1a1a; cursor: pointer;} /*.ordering .count p {margin-right: 0.4em;}*/ .ordering .chk {display: flex; height: 1.8em; align-items: center; padding: 0 0.55em; background: #ffd7a4; margin-right: 0.2em;} .ordering .chk:hover {background: #fccc8e;} .ordering label {font-weight: 600; font-size: 0.9em; line-height: 1em; color: #996425; font-family: 'Roboto', sans-serif; position: relative;} .ordering .razeni {margin-left: 1em;} .headline2 {display: block; width: 100%; text-align: center; color: black; font-size: 1.6em; margin-bottom: 0.7em;} .chk2:not(:checked), .chk2:checked {position: absolute; left: -9999px;} .chk2:not(:checked) + label, .chk2:checked + label {padding-left: 1.25em; cursor: pointer;} .chk2:not(:checked) + label:before, .chk2:checked + label:before {content: ""; display: block; width: 1.05em; height: 1.05em; position: absolute; left: 0; top: 0.05em; background-image: URL('images/checkbox2.png'); background-size: auto 300%; background-repeat: no-repeat;} .chk2:not(:checked) + label:before {background-position: left top;} .chk2:not(:checked) + label:hover:before {background-position: left center;} .chk2:checked + label:before {background-position: left bottom;} .pagination {display: flex; width: 100%; justify-content: center; flex-wrap: wrap; margin: 2em 0 3em;} .pagination a {display: block; color: #666666; font-size: 1em; font-weight: 300; padding: 0.3em 0.5em; margin: 0 1px; border: solid 1px transparent; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .pagination a.first:before {display: inline-block; content: "\f100"; font-family: 'fontawesome';} .pagination a.prev:before {display: inline-block; content: "\f104"; font-family: 'fontawesome';} .pagination a.next:after {display: inline-block; content: "\f105"; font-family: 'fontawesome';} .pagination a.last:after {display: inline-block; content: "\f101"; font-family: 'fontawesome';} .pagination a:hover {color: #1a1a1a;} .pagination a.active {border-color: #1a1a1a; color: #1a1a1a; font-weight: 500;} .pagination a.disabled {display: none;} .info-text {display: block; width: 100%; margin-bottom: 0.8em; box-sizing: border-box; } .info-text h1, .article h1 {display: block; width: 100%; font-size: 2.2em; font-weight: 600; line-height: 1.2em; margin: 0 0 0.25em;} .info-text p {display: block; width: 100%;} .info-text .pnBox {display: block; width: 100%; font-size: 0.9em; color: #545454; letter-spacing: 0.02em; line-height: 1.3em; margin-bottom: 0.6em; margin-top: 1em; position: relative; overflow: hidden;} .info-text .pnBox img {margin: 0 0.6em 0.6em 0;} .info-text .hidden {max-height: 5.4em;} .info-text .hidden.hidden2 {max-height: 340px !important;} .info-text .mask {display: none;} .info-text .pnBox a {display: inline; font-size:16px; margin: 0 0px; color: #be8805; text-decoration: underline;} .info-text .pnBox a:hover {text-decoration: none;} .info-text .bt_zobrazit {display: block; font-size: 0.7em; font-weight: 400; text-decoration: underline; color: #999999; cursor: pointer;} .info-text .bt_zobrazit span {display: none;} .info-text .bt_zobrazit.var1 span.show {display: block;} .info-text .bt_zobrazit.var1 span.hide {display: none;} .info-text .bt_zobrazit span.hide {display: block;} .info-text .bt_zobrazit span:before {display: inline-block; content: "\f105"; font-family: fontawesome; margin-right: 0.5em;} .info-text .bt_zobrazit:hover {text-decoration: none; color: black;} @keyframes move-brands { 0% {left: 0;} 50% {left: -100%;} 99% {left: 0;} } @media screen and (max-width: 960px) { .brands .logos a {margin: 0 2rem;} } @media screen and (max-width: 724px) { .ordering .razeni {width: 100%; margin: 1em 0 0 0;} } @media screen and (max-width: 640px) { .ordering {justify-content: center;} .ordering .types {display: flex; width: 100%; justify-content: center;} /*.ordering .count {border-top: solid 1px #e0e0e0; padding-top: 10px; margin-top: 10px;}*/ .ordering .chk {margin-bottom: 0.5em;} } /* SEARCH */ #search {display: none; width: 100%; height: 100%; overflow: auto; padding: 0 5%; background: rgba(250, 250, 250, 0.95); box-sizing: border-box; position: fixed; top: 0; left: 0; z-index: 1001; -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);} #search.show {display: block;} #search .box {display: block; width: 90%; max-width: 50em; height: auto; margin: 7em auto 2em; padding-top: 2em; box-sizing: border-box; border: none; position: relative;} #search .box p {display: block; width: 100%; text-align: center; color: #8a8a8a; font-size: 2.2em; font-weight: 600; margin-bottom: 0.5em;} #search .searchfield {display: block; width: 90%; min-width: 250px; height: 54px; position: relative; margin: 0 auto;} #search input {text-indent: 20px; display: block; width: 100%; height: 100%; font-size: 16px; background: white; border-radius: 3px; border: solid 1px #cecece; padding: 0 80px 0 15px; outline: none; box-sizing: border-box;} #search button {display: block; width: 54px; height: 100%; padding: 5px; opacity: 0.4; outline: none; background: URL('images/icon-search.svg') no-repeat center center; background-size: 40%; border: none; box-sizing: border-box; position: absolute; right: 0; top: 0; cursor: pointer;} #search button:hover {opacity: 0.8;} #search #whisp {display: none; width: 60%; min-width: 250px; height: 100px; background: grey; margin: 0 auto;} #search #cross {display: block; width: 1.3em; height: 1.3em; opacity: 0.25; background: URL('images/cross.png') no-repeat center center; background-size: 100%; position: absolute; top: 0; right: 0; z-index: 1000; cursor: pointer;} #search #cross:hover {opacity: 0.7;} @media screen and (max-width: 960px) { #search .searchfield, #search #whisp {width: 90%;} } .products {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; position: relative;} .products .swiper-container {width: 100%;} .products .wrapper {display: flex; justify-content: space-between; flex-wrap: wrap; position: relative;} .products .items {display: flex; width: 100%; height: auto; flex-wrap: wrap;} .products .product {display: flex; height: auto; justify-content: center; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; padding: 1.5em 0.6em; box-sizing: border-box; position: relative; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} /* .products .product:after {display: block; width: 1px; min-height: 100%; background: URL('images/product-separator.png') no-repeat center center; background-size: 100% 100%; content: ""; position: absolute; right: 0; top: 0;} .products .product:last-child:after {display: none;} */ .products .product .img {display: flex; width: 100%; justify-content: center; align-items: flex-start; flex-wrap: wrap; margin-bottom: 1em; box-sizing: border-box; position: relative; overflow: hidden;} .products .product .img .tag {display: flex; width: 100%; max-width: 100%; justify-content: center; flex-wrap: wrap; margin-top: 0.5em;z-index: 1;} .products .product .img .tag span {display: block; padding: 0.2em 0.4em; margin: 1px; position:relative; left:-5px; font-size: 12px; background: #ffd7a4; color: #ad6100; letter-spacing: 0; text-transform: uppercase; font-weight: bold; } .products .product .img .tag span.novinka {background-color:#a7dbff; color:#8c4f02 !important;} .products .product .img .icon-video {display: block; width: 1.5em; height: 1.5em; background: URL('images/icon-video.svg') no-repeat center center; background-size: contain; position: absolute; left: 0; top: 0; z-index: 1; content: "";} .products .product .img img {display: block; /*height: 15em;*/ width: 9em; object-fit: contain; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .products .product:hover .img img {-ms-transform: scale(1.05,1.05); -webkit-transform: scale(1.05,1.05); transform: scale(1.05,1.05);} .products .product h3 {display: flex; width: 100%; justify-content: center; text-align: center; margin-bottom: -0.2em;} .products .product h3 a {display: inline-block; width: auto; max-width: 16em; height: auto; font-size: 1em; line-height: 1.2em; font-weight: 500; color: #191919; box-sizing: border-box;} .products .product h3 a:hover {text-decoration: underline;} .products .product p {display: block; width: 100%; max-width: 16em; height: auto; font-size: 0.8em; line-height: 1.35em; color: #666666; margin-top: 3px; letter-spacing: 1px; text-align: center; box-sizing: border-box;} .products .product p.discount {display: block; width: 100%; text-align: center; margin-top: 0.6em; position: relative;} .products .product p.discount:before {display: block; width: 50%; height: 1px; background: #b1b1b1; position: absolute; left: 25%; top: calc(50% - 1px); content: "";} .products .product p.discount span {display: inline-block; padding: 0 0.4em; font-size: 1.3em; color: #e30030; background: white; position: relative; z-index: 1; font-weight: bold;} .products .product p.price {font-size: 1em; margin-top: 0.2em; color: #d0a43a; font-weight: bold;} .products .product p.price.old {font-size: 0.7em; color: black; text-decoration: line-through; font-weight: normal; margin-top: -0.2em;} .products .product p.dopCena {margin: 0.4em 0 -0.4em;} .products .product .button {width: 6em; margin: 0.7em calc(50% - 3em) 0; font-size: 0.8em; padding: 0.3em 0;} .products .swiper-button-prev, .products .swiper-button-next {display: block; opacity: 0.25; position: absolute; top: calc(50% - 13px); width: 26px; height: 26px; z-index: 500; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .products .swiper-button-prev {left: -2rem; background: URL('images/arrow-l.svg') no-repeat center center; background-size: auto 100%;} .products .swiper-button-next {right: -2rem; background: URL('images/arrow-r.svg') no-repeat center center; background-size: auto 100%;} .products .swiper-button-prev:hover, .products .swiper-button-next:hover {opacity: 1; cursor: pointer;} @media screen and (max-width: 1080px) { .products .swiper-button-prev {left: -1em;} .products .swiper-button-next {right: -1em;} } @media screen and (min-width: 960px) { .products .product {width: 33.33%;} } @media screen and (max-width: 960px) { .products .product {width: 50%;} } @media screen and (max-width: 640px) { .products .product .img img {width: 10em;} } @media screen and (max-width: 540px) { .products .product {width: 100%;} } .product.product-cta {min-height: 20em; max-height: 22.9em; margin-top: 1.5em; flex-direction: column; align-items: center; align-content: stretch; background: #F2F2F2; padding: 2.4em 0 0; transition: .15s ease-in-out; overflow: hidden;} .product-cta:before {display: block; width: 3em; text-align: center; font-size: 0.75em; color: white; font-weight: bold; padding: 0.6em 0 0.4em; background: #D30B18; position: absolute; left: calc(50% - 1.5em); top: 0; z-index: 5; content: "Tip";} .product-cta .product-cta-title {display: block; width: 100%; flex-grow: 0; text-align: center; font-size: 1.3em; font-weight: bold; color: #252525; line-height: 1.25em; padding-bottom: 1em; box-sizing: border-box;} .product-cta .product-cta-img {display: block; width: 100%; flex-grow: 1; background: URL('https://www.tovys.cz/themes/default/images/tovys-profile2.png') no-repeat center bottom; background-size: auto 100%;} .product-cta .product-cta-button {display: flex; width: 100%; justify-content: center; position: absolute; left: 0; bottom: 2em; z-index: 5;} .product-cta .product-cta-button span {display: flex; align-items: center; font-size: 0.85em; line-height: 1em; font-weight: bold; color: white; background: #D30B18; padding: 0.7em 0.8em 0.85em; border-radius: 0.3em; transition: .15s ease-in-out; box-shadow: 0 0 1em rgba(0,0,0,0.5);} .product-cta .product-cta-button span img {display: block; width: 1.25em; margin: 0.05em 0.5em 0 0;} .product-cta > a {display: block; width: 100%; height: 100%; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 10;} .product-cta:hover {background: #e3e3e3;} .product-cta:hover .product-cta-button span {background: #c20714;} .product-cta-panske .product-cta-title {max-width: 8em;} @media screen and (min-width: 1400px) { .product-cta .product-cta-img {position: relative; left: -10px;} } @media screen and (min-width: 540px) { .product-cta > a {border-left: solid 18px white !important; border-right: solid 18px white !important; box-sizing: border-box;} } .pg-panel form .left {order: 0; display: block; background: #f2f2f2; border-radius: 8px 3px 3px 3px; margin-bottom: 10px; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} .pg-panel form .left .menu-text {display: none;} .pg-panel form .left .panel {display: block; width: 100%; font-size: 1.1em; border-radius: 3px; overflow: hidden; box-sizing: border-box;} .pg-panel form .left h2 {font-size: 0.9em; font-weight: 600; margin: 0.8em 0 1em; padding: 0 0.92em; box-sizing: border-box; position: relative; z-index: 1;} .pg-panel form .left .sleva {display: block; width: 100%; font-size: 0.6em; line-height: 1.2em; text-align: right; color: black; margin: -3.8em 0 0.5em; padding: 0 1.3em; box-sizing: border-box;} .pg-panel form .right {order: 1; display: block; font-size: 1em; position: relative; padding: 0 1em; box-sizing: border-box; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} @media screen and (min-width: 1080px) { .pg-panel form .left {width: 14em;} .pg-panel form .left .responsive {display: none;} .pg-panel form .right {width: calc(100% - 14em - 10px);} } @media screen and (max-width: 1080px) { .pg-panel form .left {width: 20em; margin-left: -17.7em; position: relative; z-index: 10; border-right: solid 3em #ededed; box-sizing: border-box; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} .pg-panel form .left .responsive {display: flex; width: 15em; height: 3em; align-items: center; opacity: 0.6; font-weight: bold; text-transform: uppercase; padding-right: 3em; box-sizing: border-box; position: absolute; right: 0; top: 0; z-index: 1000; transform: rotate(-90deg); transform-origin: top right; cursor: pointer; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} .pg-panel form .left .responsive img {display: block; width: 3em; height: 3em; position: absolute; right: 0; top: 0; transform: rotate(90deg); -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} .pg-panel form .left .responsive p {display: block; width: 100%; text-align: right; font-size: 1em; font-weight: 400; color: black;} .pg-panel form .left .responsive p span:nth-child(2) {display: none;} .pg-panel form .left .responsive:hover {opacity: 1;} .pg-panel form .left .panel-categories {position: relative; left: 0; top: 0; padding-right: calc(36px + 0.9rem);} .pg-panel form .right {width: calc(100% - 2.3em - 10px);} .pg-panel.show form .left {margin-left: 0;} .pg-panel.show form .left .responsive img {transform: rotate(-90deg);} .pg-panel.show form .left .responsive p span:nth-child(1) {display: none;} .pg-panel.show form .left .responsive p span:nth-child(2) {display: block;} .pg-panel.show form .right {margin-right: -17em; opacity: 0.4;} .pg-panel.menu-responsive form .left {margin-left: 0;} .pg-panel.menu-responsive form .right {margin-right: -17.7em;} .pg-panel.menu-responsive form .right > * {opacity: 0.25;} .pg-panel.menu-responsive .responsive img {transform: rotate(-90deg) !important;} .pg-panel form .left .panel-shop {padding-right: calc(36px + 0.9rem);} } @media screen and (max-width: 768px) { .pg-panel form .left .panel-categories {padding-bottom: 0.5rem;} } .pg-panel .panel > ul {display: block; width: 100%; font-size: 0.8em; font-weight: 400; margin-bottom: 1em;} .pg-panel .panel > ul > li {display: block; width: 100%; font-size: 1em; box-sizing: border-box; position: relative; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .pg-panel .panel > ul > li > a {display: block; width: 100%; font-size: 1em; color: #666666; padding: 0.2em 1em; box-sizing: border-box; position: relative; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .pg-panel .panel > ul > li > a:hover {color: black;} .pg-panel .panel > ul > li.sel > a, .pg-panel .panel > ul > li > a.active {color: black; font-weight: bold;} .pg-panel .panel > ul > li > span {display: flex; width: 1em; height: 1em; justify-content: center; align-items: center; color: #939393; font-size: 1em; font-weight: 400; position: absolute; right: 0.8em; top: 0.9em; cursor: pointer;} .pg-panel .panel > ul > li > span:hover {color: black;} .pg-panel .panel > ul > li > span.minus {display: none;} .pg-panel .panel > ul > li.sel > span.plus {display: none;} .pg-panel .panel > ul > li.sel > span.minus {display: flex;} .pg-panel .panel > ul.categories {border-bottom: solid 0.6em white; margin-bottom: -1px;} .pg-panel .panel > ul.categories > li {padding-right: 2em; border-bottom: solid 3px white;} .pg-panel .panel > ul.categories > li:first-of-type {border-top: solid 3px white; margin-top: -3px;} .pg-panel .panel > ul.categories > li:hover, .pg-panel .panel > ul.categories > li.sel {background: #ededed;} .pg-panel .panel > ul.categories > li > a {padding: 1em 0 1em 1.5em; padding: 0.8em 0 0.8em 1em;} .pg-panel .panel > ul > li > ul {display: none; padding: 0 1.1em 1em; box-sizing: border-box;} .pg-panel .panel > ul > li.sel ul {display: block; font-size: 1em;} .pg-panel .panel > ul > li > ul > li {font-size: 0.9em;} .pg-panel .panel > ul > li > ul li {display: block; width: 100%; color: #D0A43A; font-weight: 500; box-sizing: border-box; position: relative;} .pg-panel .panel > ul > li > ul li a {display: inline-block; font-size: 1em; color: #666666; font-weight: 400; padding: 0.1em 0 0.1em 1.2em; box-sizing: border-box; position: relative; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .pg-panel .panel > ul > li > ul li a:before {display: block; height: 1em; width: 0.35em; background: URL('images/arrow-r.svg') no-repeat center center; background-size: contain; position: absolute; left: 0.4em; top: 0.2em; content: ""; } .pg-panel .panel > ul > li > ul li a:hover {color: black;} .pg-panel .panel > ul > li > ul li a.active {color: black; font-weight: bold;} .pg-panel .panel > ul > li > ul li ul {display: block; width: 100%; padding-left: 1em; box-sizing: border-box;} .pg-panel .panel li.subtitle {margin-bottom: 0.8em;} .pg-panel .panel li.subtitle > ul {padding-left: 0; margin-top: 0.2em;} .pg-panel .panel .discount {display: inline-block; padding: 0.1em; position: absolute; right: 0.8em; top: 0.3em;} .pg-panel .panel .discount a:before {display: block; content: "\f02b"; font-family: fontawesome; color:#d0a43a; font-size: 20px; } .pg-panel .panel .cta-yt {display: block; width: 100%; background: #252525; padding: 1.2em; box-sizing: border-box; position: relative; border-bottom: solid 0.6em white;} .pg-panel .panel .cta-yt:before {display: block; height: 100%; width: 100%; background: URL('images/cta-yt.png') no-repeat right bottom; background-size: 50% auto; position: absolute; right: 0; bottom: 0; z-index: 1; content: ""; } .pg-panel .panel .cta-yt > * {position: relative; z-index: 2;} .pg-panel .panel .cta-yt p {display: block; width: auto; font-size: 0.9em; color: white; line-height: 1.2em; font-weight: 600;} .pg-panel .panel .cta-yt a {display: inline-block; font-size: 0.65em; color: white; text-transform: uppercase; font-weight: 600; background: #d30b18; padding: 0.5em 1em; margin-top: 1em; transition: .15s ease-in-out;} .pg-panel .panel .cta-yt a:hover {background: #f11726;} .pg-panel .panel-shop {font-size: 0.9em; font-weight: 400; padding: 1.1em; box-sizing: border-box;} .pg-panel .panel-shop img {display: block; width: 100%; height: auto; -webkit-box-shadow: 0px 0px 0.2em 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 0.2em 0px rgba(0,0,0,0.3); box-shadow: 0px 0px 0.2em 0px rgba(0,0,0,0.3);} .pg-panel .panel-shop h2 {margin-bottom: 0.3em !important; padding: 0 !important;} .pg-panel .panel-shop ul {display: block; width: 100%;} .pg-panel .panel-shop ul li {display: block; color: #666666; font-size: 1em;} .pg-panel .panel-shop ul li a {display: inline-block; color: #666666} .pg-panel .panel-shop ul li a:hover {text-decoration: underline; color: black;} .pg-panel .panel-shop ul li a.ref-map {margin: 0.5em 0; text-decoration: underline;} .pg-panel .panel-shop ul li a.ref-map:hover {text-decoration: none;} .pg-panel .panel-shop ul li a span {display: inline-block; width: 3.5em;} .subcategories {display: flex; width: 100%; flex-wrap: wrap; margin-bottom: 0.8em; box-sizing: border-box;} .subcategories .pnBox {display: flex; width: 100%; flex-wrap: wrap; box-sizing: border-box;} .subcategories .hidden .mask {display: block; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; z-index: 1; background: URL("images/info-text-mask.png") no-repeat center bottom; background-size: 100% 150px;} .subcategories .mask {display: none;} .subcategories h2 {display: block; width: 100%; font-size: 1.5em; color: #747474; margin-top: 1.5em;} .subcategories h2:first-of-type {margin-top: 0;} .subcategories > div {display: flex; width: 100%; flex-wrap: wrap;} .subcategories a {display: flex; min-height: 4em; justify-content: center; align-items: center; text-align: center; font-size: 0.9em; color: #494949; font-weight: bold; background: white; border: solid 1px #e0e0e0; padding: 0.4em 2em 0.4em 0.7em; box-sizing: border-box; position: relative; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .subcategories a:after {display: flex; width: 2em; height: 100%; justify-content: center; align-items: center; content: "\f105"; color: #969696; font-size: 1.1em; font-family: fontawesome; font-weight: regular; position: absolute; top: 0; right: 0;} .subcategories a:before {display: block; width: 100%; height: 100%; background: black; opacity: 0.04; position: absolute; left: 0; top: 0; content: ""; transition: .15s ease-in-out;} .subcategories a:hover {border-color: #c6c6c6;} .subcategories a:hover:before {opacity: 0;} .subcategories a.sel:before {opacity: 0;} .subcategories a.sel {border-color: #c6c6c6; border-color:black;} .subcategories a.empty {visibility: hidden; height: 1px;} .subcategories a img {display: block; width: 4em;} .subcategories a.product-group {justify-content: flex-start;} .subcategories a.product-group img {margin-right: 0.8em;} .subcategories .bt_zobrazit {display: block; font-size: 1em; font-weight:600; text-decoration:underline; color: #d30b18; cursor: pointer; margin: 0.5em 0 0.2em;} .subcategories .bt_zobrazit span {display: none;} .subcategories .bt_zobrazit.var1 span.show {display: block;} .subcategories .bt_zobrazit.var1 span.hide {display: none;} .subcategories .bt_zobrazit span.hide {display: block;} .subcategories .bt_zobrazit span:before {display: inline-block; content: "\f105"; font-family: fontawesome; margin-right: 8px;} .subcategories .bt_zobrazit:hover {text-decoration: underline;} .subcategories .hidden {max-height: 9.5em; overflow: hidden;} @media screen and (max-width: 1300px) { .subcategories a.product-group img {margin-right: 0.4em;} } @media screen and (min-width: 768px) { .subcategories a {width: calc(33.33% - 0.2em); margin: 0.3em 0.3em 0 0;} .subcategories a:nth-child(3n+3) {margin-right: 0;} .subcategories a:nth-child(-n+3) {margin-top: 0;} } @media screen and (min-width: 540px) and (max-width: 768px){ .subcategories a {width: calc(50% - 0.2em); margin: 0.4em 0.4em 0 0;} .subcategories a:nth-child(even) {margin-right: 0;} .subcategories a:nth-child(-n+2) {margin-top: 0;} .subcategories .hidden {max-height: 19em;} } @media screen and (max-width: 540px) { .subcategories a {width: 100%; margin-top: 0.3em;} .subcategories .hidden {max-height: 38em;} } .subcategories a.seikoVelke {display: flex; height: auto !important; justify-content: center; align-items: center; /*font-size: 0.9em; color: #494949; font-weight: bold;*/ background: none; border: none; padding: 0;} .subcategories a.seikoVelke:before, .subcategories a.seikoVelke:after {display: none;} .subcategories a.seikoVelke.empty {visibility: hidden; height: 1px;} .subcategories a.seikoVelke img {display: block; width:100%; height:auto !important; max-width:100% !important; } .subcategories a.seikoVelke.product-group {justify-content: flex-start;} .subcategories a.seikoVelke.product-group img {margin-right: 12px;} @media screen and (min-width: 768px) { .subcategories a.seikoVelke {width: calc(33.33% - 0.4em); margin: 0.8em 0.6em 0 0;} .subcategories a.seikoVelke:nth-child(3n+3) {margin-right: 0;} } @media screen and (min-width: 480px) and (max-width: 768px){ .subcategories a.seikoVelke {width: calc(50% - 0.3em); margin: 0.8em 0.6em 0 0;} .subcategories a.seikoVelke:nth-child(even) {margin-right: 0;} } @media screen and (max-width: 480px) { .subcategories a.seikoVelke {width: 100%; margin: 0.8em 0 0;} } .pg-article .preview {display: block; width: calc(100% - 325px); background: white; border: solid 1px #c1c1c1; position: absolute; top: 84px; right: 0; box-sizing: border-box;} .pg-article .preview:after {display: block; width: calc(100% - 300px); height: 100%; background: rgba(250,250,250,0.7); position: fixed; top: 0; right: 0; z-index: 1; content: "";} .pg-article .preview .text {display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 0.8rem; background: white; border: solid 1px #c1c1c1; border-left: solid 2px #f9cf6b; position: absolute; top: 133px; right: 0.9rem; z-index: 2; box-sizing: border-box;} .pg-article .preview .text:before {display: block; width: 11px; height: 20px; background: URL('images/preview-arrow.png') no-repeat right center; background-size: cover; position: absolute; left: -12px; top: 10px; content: "";} .pg-article .preview .text img {display: block; width: 160px;} .pg-article .preview .text p {display: block; width: calc(100% - 180px); font-size: 16px;} @media screen and (min-width: 1200px) { .pg-article .right {padding: 0 1em; box-sizing: border-box;} } .article {display: block; width: 100%; font-size: 1em; margin: 0 0 0.9rem; background: white; box-sizing: border-box; } .article h2 {display: block; width: 100%; font-size: 1.4em; font-weight: 600; margin: 1em 0 -0.3rem;} .article h3 {display: block; width: 100%; font-size: 1.1em; font-weight: 600; margin-bottom: 0.4em;} .article p {display: block; width: 100%; font-size: 1em; font-weight: 300; letter-spacing: 0.02em; line-height: 1.4em; margin-top: 1.2em; box-sizing: border-box;} .article .style-box {padding: 1em; background: #f2f2f2; border: solid 1px #e0e0e0; border-left: solid 3px #f9cf6b; color: black; margin-bottom: 2em;} .article .style-box a {color: #be8805; text-decoration: underline;} .article .style-box a:hover {color: #a77503; text-decoration: none;} .article .img-width100 {display: block; width: 100%; height: auto; margin-bottom: 2em;} .article .img-width100 img {display: block; width: 100%; height: auto;} .article #map {display: block; width: 100%; height: 8rem; min-height: 300px;} .article ul, .article ol {padding-lefT: 1.5em; margin: 1em 0 0; box-sizing: border-box;} .article li {display: block; width: 100%; font-size: 1em; line-height: 1.4em; position: relative; box-sizing: border-box; margin: 0.2em 0;} .article ul li .title {font-weight: 600; font-size: 1.3em;} .article ul.opening li span {display: inline-block; width: 4.5em;} .article ul.opening li span.small {width: auto; color: #8b8b8b; max-width: 22em;} .article ol {list-style: none; counter-reset: li;} .article ol li {padding-left: 1.5em; counter-increment: li;} .article ol li::before {display: flex; width: 1.6em; height: 1.6em; justify-content: center; align-items: center; content: counter(li) ""; font-size: 0.7em; color: white; font-weight: 600; background: #be8805; border-radius: 100%; position: absolute; left: 0; top: 0.15em;} .article .highlight {background: rgba(0,0,0,0.06); padding: 2em; margin-top: 1.2em; box-sizing: border-box;} .article .highlight > *:first-child {margin-top: 0;} .article .highlight ul, .article .highlight ol {padding-left: 0;} .article .highlight a {color: #be8805; text-decoration: underline;} .article .highlight a:hover {color: #a77503; text-decoration: none;} .article .embedBlok {display: block; width: 100%; margin-top: 1em;} .article .embedBlok .youtube {display: block; width: 100%; padding-top: 56%; position: relative;} .article .embedBlok .youtube iframe {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .article .links {display: flex; width: 100%; flex-wrap: wrap; margin-top: 1.2em;} .article .links > div {display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; background: #f2f2f2; padding: 1em; box-sizing: border-box; border-radius: 0.4em;} .article .links > div p {display: block; width: 100%; text-align: center; font-size: 0.85em; line-height: 1.2em; color: #252525; font-weight: 600; margin: 0 0 0.5em;} .article .links > div a {font-size: 0.75em;} .article .hashtags {display: block; width: 100%; margin-top: 1.2em;} .article .hashtags a {display: inline-block; font-size: 0.9em; font-weight: 600; font-style: italic; color: #c49831; text-decoration: underline; margin-right: 0.5em; transition: .15s ease-in-out;} .article .hashtags a:hover {color: #252525; text-decoration-color: transparent;} .article .gallery {display: block; width: 100%; height: auto; overflow: hidden; margin-bottom: 2em;} .article .gallery a.swiper-slide {display: block; width: auto; height: 5rem; min-height: 7em; cursor: pointer; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .article .gallery a.swiper-slide img {display: block; width: auto; height: 100%;} .article .gallery .swiper-button-prev, .article .gallery .swiper-button-next {display: flex; width: 1.5em; height: 100%; justify-content: center; align-items: center; opacity: 0.7; position: absolute; top: 0; z-index: 500; -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out;} .article .gallery .swiper-button-prev {left: -1px; background: URL('images/arrow2-l.svg') no-repeat center center, URL('images/arrow2-bg.png') repeat center center; background-size: 36% auto, cover;} .article .gallery .swiper-button-next {right: -1px; background: URL('images/arrow2-r.svg') no-repeat center center, URL('images/arrow2-bg.png') repeat center center; background-size: 36% auto, cover;} .article .gallery .swiper-button-prev:hover, .article .gallery .swiper-button-next:hover {opacity: 1; cursor: pointer;} .article .gallery .swiper-button-disabled {opacity: 0 !important;} .news .gallery {display: block; width: 100%; box-sizing: border-box; position: relative;} .news .slider { padding: 0 1em !important; } .news .swiper-container {display: block; width: 100%; overflow: hidden;} .news .swiper-slide {display: flex; height: auto; margin-top: 0; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .news .swiper-slide > * {display: flex; width: 100%; align-items: center; margin: 0; padding: 1.2rem; box-sizing: border-box;} .news .swiper-slide > * > img { display: block; width: 100%; margin: 0; } /*.news .swiper-wrapper {display: block; width: 100%; position: relative;}*/ .news .gallery .swiper-button-prev, .news .gallery .swiper-button-next {display: flex; width: 1.5em; height: 1em; justify-content: center; align-items: center; opacity: 0.7; position: absolute; top: calc(50% - 0.5em); z-index: 500; -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out;} .news .gallery .swiper-button-prev {left: 0; background: URL('images/arrow-l.svg') no-repeat center center; background-size: 100% auto;} .news .gallery .swiper-button-next {right: 0; background: URL('images/arrow-r.svg') no-repeat center center; background-size: 100% auto;} .news .gallery .swiper-button-prev:hover, .news .gallery .swiper-button-next:hover {opacity: 1; cursor: pointer;} .news .gallery .swiper-button-disabled {opacity: 0 !important;} .article .banners-grid {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;} .article .banners-grid a {display: block; width: calc(50% - 5px); margin-bottom: 10px;} .article .banners-grid a img {display: block; width: 100%; height: auto; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .article .banners-grid a:hover img {-ms-transform: scale(1.03,1.03); -webkit-transform: scale(1.03,1.03); transform: scale(1.03,1.03);} .article .text-img, .article .img-text {display: flex; width: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; color: #666666; padding: 1rem 2rem; margin-bottom: 2em; border-bottom: solid 1px #e0e0e0; box-sizing: border-box;} .article .text-img .img, .article .img-text .img {display: block; width: 40%; height: auto;} .article .text-img .img img, .article .img-text .img img {display: block; width: 100%; height: auto;} .article .img-text .img {order: 0;} .article .img-text p {order: 1;} .article .text-img .img {order: 1;} .article .text-img p {order: 0;} .article .text-img p, .article .img-text p {width: calc(60% - 1.4rem); font-size: 1em; margin-bottom: 0;} .article .text-img p {text-align: right;} .article .text-img p span, .article .img-text p span {display: inline-block; width: auto; font-style: italic; padding: 0 3px; line-height: 1.03em;} .article .text-img p span:first-child, .article .img-text p span:first-child {padding-top: 8px; border-top: solid 1px #e8e8e8;} .article .text-img p span:last-child, .article .img-text p span:last-child {padding-bottom: 8px; border-bottom: solid 1px #e8e8e8;} .article .video {display: flex; width: 100%; height: 100%; justify-content: center; background: black; margin-bottom: 2em;} .article .video iframe {display: block; width: 100%; height: 10rem;} .article .grid {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;} .article .grid .item {display: flex; width: calc(33.33% - 0.25em); align-items: center; align-content: center; flex-wrap: wrap; margin-bottom: 0.5em; background: #f2f2f2; border: solid 1px #ededed; padding: 1.1em; box-sizing: border-box;} .article .grid .item.empty {height: 1px; visibility: hidden;} .article .grid .item .title {display: block; width: 100%; margin-bottom: 0.4em; font-size: 1em; color: #2f2f2f; font-weight: 600; text-align: center;} .article .grid .item p {display: block; width: 100%; font-size: 0.9em; color: #666666; font-weight: 300; text-align: center; margin: 0; line-height: 1.2em;} @media screen and (max-width: 1300px) { .pg-article .preview {width: calc(75% - 25px); top: 54px;} .article .text-img, .article .img-text {padding: 1.4rem 0;} .article .text-img p span, .article .img-text p span {display: inline;} .article .text-img p br, .article .img-text p br {display: none;} } @media screen and (max-width: 960px) { .pg-article .preview {display: none !important;} } @media screen and (min-width: 769px) { .article .links > div {width: calc(33.33% - 0.2em); margin: 0.3em 0.3em 0 0;} .article .links > div:nth-child(-n+3) {margin-top: 0;} .article .links > div:nth-child(3n+3) {margin-right: 0;} } @media screen and (min-width: 480px) and (max-width: 768px){ .article .links > div {width: calc(50% - 0.15em); margin: 0.3em 0.3em 0 0;} .article .links > div:nth-child(-n+2) {margin-top: 0;} .article .links > div:nth-child(even) {margin-right: 0;} } @media screen and (max-width: 768px) { .article .grid .item {width: calc(50% - 0.25em);} .article .banners-grid a {width: 100%; margin-bottom: 6px;} } @media screen and (max-width: 640px) { .article .video iframe {height: 13em;} .article ul.opening li span.small {display: block; width: 100%; max-width: 100%;} .article .text-img, .article .img-text {display: block;} .article .text-img .img, .article .img-text .img {width: 100%; max-width: 22em; margin: 0 auto;} .article .text-img p, .article .img-text p {width: 100%; text-align: center; margin-top: 10px;} .article .text-img p span, .article .img-text p span {font-size: 0.7em; border: none !important; padding: 0 !important;} .article .grid .item {width: calc(50% - 0.25em);} } @media screen and (max-width: 480px) { .article .links > div {width: 100%; margin: 0.3em 0 0;} .article .links > div:nth-child(1) {margin-top: 0;} .article .grid .item {width: 100%;} } /* LANDING PAGE */ .pg-panel form .right.landing {display: flex; align-content: flex-start; flex-wrap: wrap; padding: 0;} .searchbar {display: flex; width: 100%; font-size: 0.9em; margin-bottom: 10px; position: relative; background: #f2f2f2; box-sizing: border-box;} .searchbar input {display: block; width: 100%; height: 3em; font-size: 1em; border: none; background: none; padding: 0 4em 0 1.2em; outline: none; border-radius: 8px; border: solid 2px #D0A43A; box-sizing: border-box; font-family: 'Roboto', sans-serif; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .searchbar input:focus {background: #f2f2f2; border-color: #999999;} .searchbar button {display: block; width: 4em; height: 3em; font-size: 1em; background: #D0A43A; position: absolute; right: 0; top: 0; z-index: 5; border: none; outline: none; border-radius: 8px; overflow: hidden; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .searchbar button:after {display: block; width: 100%; height: 100%; background: URL("images/icon-search-white.svg") no-repeat center center; background-size: auto 100%; position: absolute; left: 0; top: 0; z-index: 1; content: "";} .searchbar button:hover {background: #c49831;} .landing .cover {display: block; min-height: 5em; font-size: 1em; background: URL("images/provozovna-panorama.jpg") no-repeat center center; background-size: cover; position: relative; border-radius: 3px; box-sizing: border-box; margin-bottom: 10px;} .landing .cover:after {display: block; width: 100%; height: 100%; opacity: 0.8; position: absolute; top: 0; left: 0; z-index: 1; background: URL("images/cover-shine.png") no-repeat center center; background-size: 100% 100%; content: "";} .landing .cover h1 {display: flex; width: 100%; height: 3em; justify-content: center; align-items: center; text-align: center; line-height: 1.3em; font-weight: bold; color: black; text-shadow: 0px 0px 0.2em white, 0px 0px 0.4em white, 0px 0px 0.6em white; position: absolute; left: 0; top: 31%; z-index: 2;} .landing .cover .infographics {display: flex; width: 100%; height: 100%; justify-content: center; align-items: flex-end; align-content: flex-end; padding: 1.2em; position: absolute; left: 0; bottom: 0; z-index: 2; box-sizing: border-box;} .landing .cover .infographics p {display: block; color: black; height: auto; font-size: 1em; font-weight: bold; text-shadow: 0 0 0.2em #f2f2f2, 0 0 0.4em #f2f2f2, 0 0 0.6em #f2f2f2, 0 0 0.8em #f2f2f2, 0 0 1em #f2f2f2, 0 0 1.5em #f2f2f2, 0 0 1.5em #f2f2f2, 0 0 1.5em #f2f2f2, 0 0 1.5em #f2f2f2, 0 0 1.5em #f2f2f2;} .landing .cover .infographics p:nth-child(2) {margin: 0 2em;} .landing .cover .infographics p span {display: block; position: relative;} .landing .cover .infographics p span:nth-child(1) {font-size: 0.8em; line-height: 1.2em; z-index: 2;} .landing .cover .infographics p span:nth-child(2) {font-size: 1.9em; line-height: 1em; margin: 0 0 -0.05em;} .landing .cover .infographics p span:nth-child(3) {font-size: 0.8em; line-height: 1.2em; text-align: right; z-index: 2;} @media screen and (min-width: 960px) { .landing .cover {width: 60%;} } @media screen and (max-width: 960px) { .landing .cover {width: 100%; min-height: 10em; padding-top: 21.1%;} } @media screen and (max-width: 640px) { .landing .cover .infographics p {font-size: 0.85em;} .landing .cover .infographics p span:nth-child(1), .landing .cover .infographics p span:nth-child(3) {font-size: 1em;} } @media screen and (max-width: 440px) { .landing .cover .infographics p {font-size: 0.65em;} .landing .cover .infographics p:nth-child(2) {margin: 0 0.8em;} } .eshop-slider {display: block; width: 100%; margin-bottom: 10px; border-radius: 3px; overflow: hidden;} .eshop-slider .swiper-container {display: block; width: 100%;} .eshop-slider .swiper-slide {display: block; width: 100%; height: auto; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .eshop-slider .swiper-slide img {display: block; width: 100%; height: auto;} @media screen and (min-width: 960px) { .eshop-slider {width: calc(40% - 10px); margin-left: 10px;} } @media screen and (max-width: 960px) { .eshop-slider {width: 100%;} } .eshop-slider2 {display: block; width: 100%; margin-bottom: 10px; border-radius: 3px; overflow: hidden;} .eshop-slider2 .swiper-container {display: block; width: 100%;} .eshop-slider2 .swiper-slide {display: block; width: 100%; height: auto; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .eshop-slider2 .swiper-slide img {display: block; width: 100%; height: auto;} .slider-pagination {display: flex; position: absolute; z-index: 1; right: 0; bottom: 0; padding: 1em; box-sizing: border-box;} .slider-pagination .swiper-pagination {display: flex; padding: 0.5em; background: rgba(255,255,255,0.5); border-radius: 1em;} .slider-pagination .swiper-pagination-bullet {display: flex; width: 1em; height: 1em; align-items: center; font-size: 0.8em; margin: 0 0.2em !important; background: rgba(0,0,0,0.2); border-radius: 100%; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .slider-pagination .swiper-pagination-bullet:hover, .slider-pagination .swiper-pagination-bullet-active {background: rgba(0,0,0,0.9);} @media screen and (max-width: 768px) { .slider-pagination {font-size: 0.85em;} } .about-eshop {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; font-size: 0.9em; background: #252525; border-radius: 3px; margin-bottom: 10px; overflow: hidden;} .about-eshop > div {display: block; box-sizing: border-box; position: relative;} .about-eshop p {display: block; width: 100%; text-align: justify; font-size: 1em; font-weight: 300; line-height: 1.4em; color: white;} .about-eshop p span {display: block; font-size: 1.4em; font-weight: 500; text-align: left; margin-bottom: 0.6em;} .about-eshop .tovys-profile > img {display: block;} .about-eshop .tovys-profile > div p {display: block; font-size: 1em; color: white; text-align: right;} .about-eshop .tovys-profile > div p span {display: block; font-size: 0.7em; line-height: 1.1em; color: #ffd7a4; text-align: right; margin: 0;} .about-eshop .tovys-profile > div img {display: block; width: 4em; margin-top: 0.6em; float: right;} @media screen and (min-width: 960px) { .about-eshop > div:nth-child(1) {width: calc(50% - 1em); padding: 6em 0 6em 3em;} .about-eshop > div:nth-child(2) {width: 50%;} .about-eshop .tovys-profile > img {height: 90%; position: absolute; left: 20%; bottom: 0;} .about-eshop .tovys-profile > div {display: block; position: absolute; right: 60%; bottom: 45%;} } @media screen and (max-width: 960px) { .about-eshop > div:nth-child(1) {width: 100%; padding: 3em; position: relative; z-index: 1; order: 1;} .about-eshop > div:nth-child(2) {width: 100%; margin-top: 2em; order: 0; padding-top: 55%;} .about-eshop .tovys-profile > img {width: 50%; position: absolute; left: 30%; bottom: 0;} .about-eshop .tovys-profile > div {display: block; position: absolute; right: 58%; bottom: 45%;} } @media screen and (max-width: 640px) { .about-eshop > div:nth-child(1) {padding: 2em;} } @media screen and (max-width: 540px) { .about-eshop > div:nth-child(2) {padding-top: 60%;} .about-eshop .tovys-profile > img {width: 55%; left: 35%;} .about-eshop .tovys-profile > div {right: 50%; bottom: 35%;} } .about-eshop-text {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; padding: 2em 2.5em 0; box-sizing: border-box;} .about-eshop-text p {text-align: justify; font-size: 0.9em; font-weight: 300; line-height: 1.4em;} @media screen and (min-width: 768px) { .about-eshop-text p {width: calc(50% - 1em);} } @media screen and (max-width: 768px) { .about-eshop-text p {width: 100%;} } .landing .sortiment {font-size: 1em; padding: 1.9em 3em; background: #f2f2f2; box-sizing: border-box;} .landing .sortiment .brand-select {margin-top: -0.4em;} .landing .products {padding: 3em; box-sizing: border-box;} .landing .products .swiper-button-prev {left: -2em; background: URL('images/arrow-l.svg') no-repeat center center; background-size: auto 100%;} .landing .products .swiper-button-next {right: -2em; background: URL('images/arrow-r.svg') no-repeat center center; background-size: auto 100%;} .articles-grid {display: block; width: 100%; font-size: 1.2em; margin-bottom: 10px;} .articles-grid .wrapper {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; box-sizing: border-box;} .articles-grid a {display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; background-size: cover; background-repeat: no-repeat; background-position: center center; padding: 1em; line-height: 1.3em; text-align: center; font-size: 1em; color: #dddddd; font-weight: 500; box-sizing: border-box; border-radius: 3px; overflow: hidden; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .articles-grid a:nth-child(1) {background-image: URL("images/img-article1b.jpg");} .articles-grid a:nth-child(2) {background-image: URL("images/img-article2b.jpg");} .articles-grid a:nth-child(3) {background-image: URL("images/img-article3b.jpg");} .articles-grid a:nth-child(4) {background-image: URL("images/img-article4b.jpg");} .articles-grid a:nth-child(5) {background-image: URL("images/img-article5b.jpg");} .articles-grid a:nth-child(6) {background-image: URL("images/img-article6b.jpg");} .articles-grid a:hover {color: white; -ms-transform: scale(1.03,1.03); -webkit-transform: scale(1.03,1.03); transform: scale(1.03,1.03); -webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4); box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.4); -webkit-filter: brightness(120%); filter: brightness(120%);} .articles-grid a span {display: block; max-width: 100%; opacity: 0.9; font-size: 0.7em; margin-top: 0.5em; font-weight: 300; line-height: 1.4em; box-sizing: border-box; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .articles-grid a:hover span {display: block; opacity: 1;} @media screen and (min-width: 1200px) { .articles-grid a {height: 10em; width: calc(33.33% - 0.2em); margin-top: 0.4em;} .articles-grid a:nth-child(-n+3) {margin-top: 0;} } @media screen and (min-width: 640px) and (max-width: 1200px){ .articles-grid a {height: 10em; width: calc(50% - 0.2em); margin-top: 0.4em;} .articles-grid a:nth-child(-n+2) {margin-top: 0;} } @media screen and (max-width: 640px) { .articles-grid a {height: 9em; width: 100%; margin-top: 0.4em;} .articles-grid a:first-child {margin-top: 0;} } .bests .swiper-slide a {display: flex; width: 100%; justify-content: center; flex-wrap: wrap;} .bests .swiper-slide a img {display: block; width: auto; height: 10em; margin: 0 auto 1.2em;} .bests .swiper-slide a span {display: block; width: 100%; text-align: center; font-size: 1em; color: black; font-weight: 500; line-height: 1.1em;} .hp-news {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; font-size: 1em; padding: 3em; background: #252525; margin-bottom: 10px; border-radius: 3px; box-sizing: border-box;} .hp-news h2 {color: white;} .hp-news article {display: block;} .hp-news article img {display: block; width: 100%; height: auto; border-radius: 3px;} .hp-news article h3 {display: block; width: 100%; color: black; font-size: 1.2em; margin: 1.2em 0 0.7em; } .hp-news article h3 a {display: inline-block; font-size: 1em; font-weight: 500; color: white;} .hp-news article h3 a:hover {text-decoration: underline;} .hp-news article p {display: block; font-size: 0.9em; color:#f2f2f2; line-height: 1.4em; font-weight: 300;} @media screen and (min-width: 768px) { .hp-news article {width: calc(50% - 1em);} } @media screen and (max-width: 768px) { .hp-news article {width: 100%;} .hp-news article:first-of-type {margin-bottom: 3em;} } @media screen and (max-width: 440px) { .hp-news {padding: 1.5em;} } .virtual {display: block; width: 100%; padding-top: 45%; position: relative; margin-bottom: 10px; border-radius: 3px; overflow: hidden;} .virtual iframe {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .virtual.zoom iframe {pointer-events: auto;} .product-grid {display: flex; width: 100%; height: 100%; min-height: 540px; flex-wrap: wrap; background: black;} .product-grid .item {display: flex; width: calc(99.99% / 3); height: 50%; overflow: hidden; position: relative; background: white;} .product-grid .item .swiper-container {display: block; width: 100%; height: 100%;} .product-grid .item .swiper-slide {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; opacity: 1; overflow: hidden; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .product-grid .item .swiper-slide .img {display: block; width: 101%; height: 101%; -webkit-transition: .35s ease-in-out; transition: .35s ease-in-out;} .product-grid .item:hover .swiper-slide .img {-ms-transform: scale(1.03,1.03); -webkit-transform: scale(1.03,1.03); transform: scale(1.03,1.03); opacity: 0.1;} .product-grid .item .info {display: flex; align-content: center; justify-content: center; flex-wrap: wrap; position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .product-grid .item .info .title {display: flex; height: 54px; align-items: center; color: white; font-size: 28px; line-height: 1em; padding: 0 18px 0 30px; background: rgba(33,33,33,0.85); position: absolute; bottom: 16px; left: 0; z-index: 3;} .product-grid .item .info .title:after {display: inline-block; margin-left: 10px; content: " \f105 \f105"; font-family: fontawesome; font-size: 21px;} .product-grid .item:hover .info .title {width: 100%; justify-content: center; color: black; font-size: 38px; letter-spacing: -0.035em; padding: 0; margin-bottom: 10px; background: none; position: relative; bottom: 0; left: 0;} .product-grid .item:hover .info .title:after {display: none;} .product-grid .item .info .brands {display: none; height: 60px; position: relative; z-index: 1;} .product-grid .item .info .brands .logos {height: 30px; top: 15px;} .product-grid .item .info .brands .logos a {margin: 0 20px; opacity: 0.5;} .product-grid .item .info .brands .logos a:hover{opacity: 1;} .product-grid .item:hover .info .brands {display: block;} .product-grid .item .info > a {display: none; position: ralative; z-index: 1; padding: 6px 15px; margin-top: 20px; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .product-grid .item:hover .info > a {display: block;} .product-grid .item:hover .info > a:hover {background: none; color: rgba(33,33,33,1);} .product-grid .men .img1 {background: URL("images/product-grid-men1.jpg") no-repeat center center; background-size: cover;} .product-grid .men .img2 {background: URL("images/product-grid-men2.jpg") no-repeat center center; background-size: cover;} .product-grid .women .img1 {background: URL("images/product-grid-women1.jpg") no-repeat center center; background-size: cover;} .product-grid .women .img2 {background: URL("images/product-grid-women2.jpg") no-repeat center center; background-size: cover;} .product-grid .sport .img1 {background: URL("images/product-grid-sport1.jpg") no-repeat center center; background-size: cover;} .product-grid .sport .img2 {background: URL("images/product-grid-sport2.jpg") no-repeat center center; background-size: cover;} .product-grid .elegant .img1 {background: URL("images/product-grid-elegant1.jpg") no-repeat center center; background-size: cover;} .product-grid .elegant .img2 {background: URL("images/product-grid-elegant2.jpg") no-repeat center center; background-size: cover;} .product-grid .jewellry .img1 {background: URL("images/product-grid-jewellry1.jpg") no-repeat center center; background-size: cover;} .product-grid .jewellry .img2 {background: URL("images/product-grid-jewellry2.jpg") no-repeat center center; background-size: cover;} .product-grid .cases .img1 {background: URL("images/product-grid-cases1.jpg") no-repeat center center; background-size: cover;} .product-grid .cases .img2 {background: URL("images/product-grid-cases2.jpg") no-repeat center center; background-size: cover;} .product-grid .pens .img1 {background: URL("images/product-grid-pens1.jpg") no-repeat center center; background-size: cover;} .product-grid .pens .img2 {background: URL("images/product-grid-pens2.jpg") no-repeat center center; background-size: cover;} @media screen and (max-width: 1080px) { .product-grid {height: auto; min-height: auto;} .product-grid .item {width: 50%; height: 7rem;} .product-grid .item .info .title {height: 44px; font-size: 24px; padding: 0 15px 0 25px; bottom: 12px;} .product-grid .item .info .title:after {margin-left: 8px;font-size: 20px;} .product-grid .item:hover .info .title {font-size: 32px; margin-bottom: 7px;} .product-grid .item .info .brands {height: 46px;} .product-grid .item .info .brands .logos {height: 22px; top: 12px;} .product-grid .item .info .brands .logos a {margin: 0 14px;} .product-grid .item .info > a {font-size: 16px; padding: 4px 16px; margin-top: 16px;} .product-grid .item .info > a:after {margin-left: 4px;} } @media screen and (max-width: 640px) { .product-grid .item {height: 200px;} } @media screen and (min-width: 481px) and (max-width: 640px){ .product-grid .item .info .title {font-size: 20px; padding: 0 11px 0 18px; bottom: 10px;} .product-grid .item .info .title:after {margin-left: 6px;font-size: 17px;} .product-grid .item:hover .info .title {font-size: 28px; margin-bottom: 5px;} .product-grid .item .info > a {font-size: 14px;} } @media screen and (max-width: 480px) { .product-grid .item {width: 100%;} } .advantages {display: flex; width: 100%; height: auto; padding: 1.5rem 0; position: relative;} .advantages .wrapper {justify-content: space-between;} .advantages .left {display: block; width: 48%; position: relative; z-index: 2;} .advantages .left h2 {display: block; font-size: 38px; line-height: 1em; color: #ffd7a4; margin-bottom: 20px;} .advantages .left .swiper-container {display: block; width: 100%; height: 100%; position: relative; padding-bottom: 55px;} .advantages .left .swiper-slide {display: block; width: auto; height: 100%; font-size: 20px; color: white; padding-left: 1px; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .advantages .left .swiper-pagination {display: flex; position: absolute; text-align: left; z-index: 1; left:0; bottom: 0; } .advantages .swiper-pagination-bullet {display: flex; height: 22px; align-items: center; font-size: 17px; padding: 0px 8px 0px; margin: 0 2px !important; font-weight: bold; border: solid 2px #ffd7a4; color: #ffd7a4; border-radius: 1px; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .advantages .swiper-pagination-bullet:hover, .advantages .swiper-pagination-bullet-active {background: #ffd7a4; color: black;} .advantages img {display: block; width: auto; height: 105%; position: absolute; bottom: 0; right: 7%; z-index: 1;} @media screen and (max-width: 1340px) { .advantages {padding: 1.2rem 0;} .advantages .left {width: 50%;} .advantages .left h2 {font-size: 30px; margin-bottom: 16px;} .advantages .left .swiper-container {padding-bottom: 48px;} .advantages .left .swiper-slide {font-size: 17px;} .advantages .swiper-pagination-bullet {font-size: 15px; padding: 0px 7px 2px; border: solid 1px #ffd7a4;} .advantages img {right: 5%;} } @media screen and (max-width: 1080px) { .advantages .left {width: 60%;} .advantages .left h2 {font-size: 26px; margin-bottom: 14px;} .advantages .left .swiper-container {padding-bottom: 40px;} .advantages .left .swiper-slide {font-size: 16px;} .advantages .swiper-pagination-bullet {font-size: 14px; padding: 0px 6px 2px;} .advantages img {right: -4%;} } @media screen and (max-width: 880px) { .advantages {padding: 3rem 0;} .advantages .left {width: 100%; text-align: center;} .advantages .left .swiper-pagination {display: flex; width: 100%; justify-content: center;} .advantages img {height: 95%; opacity: 0.3; right: calc(32% - 90px); bottom: 5px;} } /* .best {padding: 2rem 0;} .best h2 {display: block; width: 100%; font-size: 42px; line-height: 1em; text-align: center; color: white; margin-bottom: 30px;} .best h2 span {color: #ffd7a4;} .best .swiper-container {width: 100%;} .best .wrapper {display: flex; justify-content: space-between; flex-wrap: wrap; position: relative;} .best .swiper-slide {display: flex; width: calc(100% / 6); justify-content: center; height: auto; align-items: flex-start; flex-wrap: wrap; padding: 20px; box-sizing: border-box; position: relative; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .best .swiper-slide img {display: block; height: 160px; margin-bottom: 20px; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .best .swiper-slide:hover img {-ms-transform: scale(1.05,1.05); -webkit-transform: scale(1.05,1.05); transform: scale(1.05,1.05);} .best .swiper-slide span {block; width: 100%; text-align: center; font-size: 14px; text-transform: uppercase; color: white;} .best .swiper-slide:hover span {color: #ffd7a4;} .best .swiper-button-prev, .best .swiper-button-next {display: block; opacity: 0.25; position: absolute; top: 50%; width: 26px; height: 26px; z-index: 500; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .best .swiper-button-prev {left: -30px; background: URL('images/arrow2-l.svg') no-repeat center center; background-size: auto 100%;} .best .swiper-button-next {right: -30px; background: URL('images/arrow2-r.svg') no-repeat center center; background-size: auto 100%;} .best .swiper-button-prev:hover, .best .swiper-button-next:hover {opacity: 1; cursor: pointer;} @media screen and (max-width: 1200px) { .best .swiper-slide {width: 20%; padding: 15px;} .best .swiper-slide span {font-size: 13px;} } @media screen and (max-width: 1124px) { .best {padding: 3rem 0;} .best h2 {font-size: 36px;} } @media screen and (max-width: 960px) { .best .swiper-slide {width: 25%;} } @media screen and (max-width: 768px) { .best h2 {font-size: 28px;} .best .swiper-slide {width: calc(100% / 3); padding: 10px;} } @media screen and (max-width: 640px) { .best .swiper-slide {width: 50%;} .best .swiper-slide span {font-size: 12px;} .best .swiper-button-prev {left: -10px;} .best .swiper-button-next {right: -10px;} } @media screen and (max-width: 420px) { .best .swiper-slide {width: 100%; padding: 20px;} .best .swiper-slide img {height: 190px;} .best .swiper-slide span {font-size: 13px;} } */ /*--HP - ARTICLES - GRID --*/ .hp .section-articles {display: block; padding: 0; background: URL("images/img-articles.jpg") no-repeat center center; background-size: cover;} .hp .section-articles .wrapper {justify-content: space-between; padding: 1.5rem 0;} .hp .section-articles a {color: #ffdaa0;} .hp .section-articles a:nth-child(1) {background-image: URL("images/img-article1.jpg");} .hp .section-articles a:nth-child(2) {background-image: URL("images/img-article2.jpg");} .hp .section-articles a:nth-child(3) {background-image: URL("images/img-article3.jpg");} .hp .section-articles a:nth-child(4) {background-image: URL("images/img-article4.jpg");} /**/.hp .section-articles a:nth-child(5) {background-image: URL("images/img-article5.jpg");} /**/.hp .section-articles a:nth-child(6) {background-image: URL("images/img-article6.jpg");} .hp .section-articles a:hover {color: white;} .h1strong h1 { font-size:1em !important; display:inline !important; } .filterHidd { display:none !important; } .bt_showHide {display: block; font-size: 0.7em; font-weight: 400; text-decoration: underline; color: #999999; cursor: pointer;} .bt_showHide span {display: none;} .bt_showHide.var1 span.show {display: block;} .bt_showHide.var1 span.hide {display: none;} .bt_showHide span.hide {display: block;} .bt_showHide span:before {display: inline-block; content: "\f105"; font-family: fontawesome; margin-right: 0.5em;} .bt_showHide:hover {text-decoration: none; color: black;} .filters > .box > .bt_showHide { margin-top:0.8em; font-size: 0.8em; font-weight:600; text-decoration:underline; color: #d30b18; } .eshop .filters {display: block; width: 100%; margin-bottom: 0.5em; box-sizing: border-box; } .eshop .filters .box {display: block; background: #fafafa; padding: 0.7em 1.2em 0.2em; border: solid 1px #e0e0e0; box-sizing: border-box;} .eshop .filters .box .loader {display: flex; width: 100%; flex-wrap: wrap; justify-content: center; align-items: center;} .eshop .filters .box .loader img {display: block; width: 26px; height: 26px; margin: 5px;} .eshop .filters .box .loader p {display: block; margin: 5px; font-size: 16px; color: #7c7c7c; font-family: 'Unna', serif} .eshop .filters .price {display: flex; width: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; margin: 0.6em 0 0.3em;} .eshop .filters .price .price-slider-wrapper {display: block; position: relative; width: calc(100% - 20em); height: 0.7em;} .eshop .filters .price .price-slider-wrapper .text {display: block; width: 100%; position: absolute; top: -1.55em; font-size: 0.95em; text-align:center;} .eshop .filters .price .price-slider {display: block; width: 100%; height: 1em; background: grey;} .eshop .filters .price .price-slider .ui-slider-handle {width: 1em; height: 1.25em; margin-left: -2px !important; margin-top: 0.1em !important;} .eshop .filters .price .price-slider .ui-slider-handle:last-of-type {margin-left: -1em !important;} .eshop .filters .price .inputs {display: flex; width: 18em; align-items: center; flex-wrap: wrap; margin-top: 0.25em;} .eshop .filters .price .inputs input {width: 7rem; height: 2em; font-size: 0.9em;} .eshop .filters .price .inputs p {display: block; font-size: 0.9em; color: #9c9c9c;} .eshop .filters .filter-inputs {display: flex; width: calc(100% + 0.3em); margin: 0 -0.15em; align-items: flex-start; align-content: flex-start; flex-wrap: wrap;} .eshop .filters .chkselect.hidden {display: none; position: absolute; left: -99999px;} .eshop .filters .chkselect .options {z-index: 1000;} .eshop .filters .selected {display: block; width: calc(100% + 0.3em); margin: 0 -0.15em;} .eshop .filters .selected .item {display:inline-block; border: 1px solid #aab4cd; color:#203e92; font-size: 0.9em; font-weight: 500; margin: 0.16em; padding: 0.25em 0 0.25em 0.6em;} .eshop .filters .selected .item .hodnota {display:inline-block; font-weight: 300;} .eshop .filters .selected .item .hodnota span:before{content:'\f00d'; font-family: FontAwesome; font-size: 0.8em; color:#203e92; margin: 0 0.6em 0 0.25em; cursor: pointer; width: 1em; height: 1em;} .eshop .filters .more {display: block; width: 100%;} .eshop .filters .more a {display: inline-block; font-size: 21px; color: #606060; text-transform: uppercase; line-height: 1em; font-weight: bold; cursor: pointer;} .eshop .filters .more a:hover {text-decoration: underline;} .eshop .filters .more a span:after {display: inline-block; margin-left: 8px; content: ""; font-family: fontawesome; font-weight: regular;} .eshop .filters .more a span:first-child:after {content: "\f105";} .eshop .filters .more a span:last-child:after {content: "\f106";} .eshop .filters .more a span:last-child {display: none;} .eshop .filters .more p {display: block; font-size: 16px; color: #969696; line-height: 1em; margin-top: -3px;} .eshop .filters .buttons {display: flex; width: 100%; justify-content: flex-end; margin-top: 10px;} .eshop .filters .buttons button {display: inline-block; padding: 9px 14px; font-size: 16px; text-transform: uppercase; font-weight: bold; border-width: 1px; letter-spacing: 0.01em; border-style: solid; cursor: pointer; outline: none; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .eshop .filters .buttons button:first-child {color: #6e6e6e; background: #e2e2e2; border-color: #c1.03c1;} .eshop .filters .buttons button:last-child {color: white; background: #658492; border-color: #658492; margin-left: 5px;} .eshop .filters .buttons button:first-child:hover {background: #ebebeb;} .eshop .filters .buttons button:last-child:hover {background: #7898a6;} .eshop .filters .box.all .chkselect.hidden {display: block;} .eshop .filters .box.all .more a span:first-child {display: none;} .eshop .filters .box.all .more a span:last-child {display: inline-block;} .eshop .brands {height: 60px; margin: 1rem 0;} .eshop .brands .logos {height: 60px; top: 0;} .eshop .brands .logos a {height: 60px; margin: 0 0.7rem;} @media screen and (max-width: 1300px) { .eshop .filters .price .price-slider {width: 100%;} } @media screen and (min-width: 960px) { .eshop .filters .chkselect {width: calc(25% - 0.3em); margin: 0.3em 0.15em 0;} } @media screen and (max-width: 960px) { .eshop .filters .price .price-slider-wrapper {width: calc(100% - 20em);} } @media screen and (min-width: 768px) and (max-width: 960px){ .eshop .filters .chkselect {width: calc(33.33% - 0.3em); margin: 0.3em 0.15em 0;} } @media screen and (max-width: 768px) { .eshop .filters .price {margin-top: 1.3em;} .eshop .filters .price .price-slider {width: 100%;} .eshop .filters .price .price-slider-wrapper {width: 100%;} .eshop .filters .price .inputs {width: 100%; margin-top: 1em;} .eshop .filters .price .inputs input {width: calc(50% - 2.2em);} } @media screen and (min-width: 540px) and (max-width: 768px){ .eshop .filters .chkselect {width: calc(50% - 0.3em); margin: 0.3em 0.15em 0 0;} .eshop .filters .chkselect:nth-of-type(-n+2) {margin-top: 0;} .eshop .filters .chkselect:nth-of-type(even) {margin-right: 0;} } @media screen and (max-width: 540px) { .eshop .filters .filter-inputs {width: 100%; margin: 0;} .eshop .filters .chkselect {width: 100%; margin-top: 0.3em;} } /* DETAIL */ .detail .flex {} .detail .upper {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; margin: 1em 0; box-sizing: border-box;} .detail .upper .left {display: block; width: calc(35% - 2em); box-sizing: border-box;} .detail .image {display: block; width: 100%; position: relative;} .detail .image.n2 {display: none;} .detail .image:after {display: block; width: 100%; height: 40px; /*background: URL('images/detail-shadow.png') no-repeat center center;*/ background-size: auto 100%; content: "";} .detail .image .cover {display: flex; width: 100%; height: auto; right: -0.4em} .detail .image .cover .swiper-slide {display: flex; width: 100%; height: auto; justify-content: center; align-items: center; overflow: hidden; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .detail .image .cover .swiper-slide img {display: block; width: 90%; height: auto;} .detail .image .thumbs {display: block; width: 100%; height: auto; margin-top: 0.4em; box-sizing: border-box; position: relative;} .detail .image .thumbs:after {display: block; width: 2.4em; height: 100%; background: white; position: absolute; right: 0; top: 0; z-index: 30; content: "";} .detail .image .thumbs:before {display: block; width: 2.4em; height: 100%; background: white; position: absolute; left: 0; top: 0; z-index: 30; content: "";} .detail .image .thumbs .swiper-slide {opacity: 0.3; display: block; width: 25%; height: auto; margin: 0; padding: 0 0.5em; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .thumbs .swiper-slide:hover, .detail .image .thumbs .swiper-slide-active {opacity: 1;} .detail .image .thumbs .swiper-slide img {height: auto; width: 100%; cursor: pointer;} .detail .image .pn_pocetFotografii {display: block; width: 100%; text-align: center; font-size: 1em; font-weight: 500; margin: 1.8em 0 0;} .detail .image .swiper-button-prev, .detail .image .swiper-button-next {display: block; width: 2em; height: 100%; opacity: 0.75; position: absolute; top: 0; z-index: 500; background-size: 0.8em auto; background-repeat: no-repeat; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .swiper-button-prev {left: 0; background-image: URL('images/arrow-l.svg'); background-position: left 1em center;} .detail .image .swiper-button-next {right: 0; background-image: URL('images/arrow-r.svg'); background-position: right 1em center;} .detail .image .swiper-button-prev:hover, .detail .image .swiper-button-next:hover {opacity: 0.4; cursor: pointer;} .detail .image .cover .zoomMax {display: block; cursor: pointer; background-color:transparent !important; width: 2em; height: auto; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 1; opacity: 0.6; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .cover .zoomMax:hover {opacity: 1; padding: 0.2em;} .detail .image .cover .zoomMax img {display: block; width: 100%; height: auto; position: relative; z-index: 1;} .detail .image .cover .zoomMax span {display: flex; width: 0; height: 100%; align-items: center; background: white; font-size: 0.8em; color: #797979; box-sizing: border-box; overflow: hidden; white-space: nowrap; position: absolute; left: 2.5em; bottom: 0; z-index: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .cover .zoomMax:hover span {width: 17em; padding: 0 0.8em;} .detail .image .cover .zoomMax:after, .detail .image .cover .zoomMax span:after {display: block; width: 100%; height: 100%; background: black; opacity: 0; position: absolute; right: 0; top: 0; z-index: 2; content: "";} .detail .image .cover .zoomMax:hover:after, .detail .image .cover .zoomMax:hover span:after {opacity: 0.04;} .detail .image .cover .tocompare2 {display: block; background-color: transparent !important; width: 2em; height: auto; box-sizing: border-box; position: absolute; left: 0; top: 2.5em; z-index: 1; opacity: 0.6; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .cover .tocompare2:hover {opacity: 1; padding: 0.2em;} .detail .image .cover .tocompare2 img {display: block; width: 100%; height: auto; position: relative; z-index: 1;} .detail .image .cover .tocompare2 span {display: flex; width: 0; height: 100%; align-items: center; background: white; font-size: 0.8em; color: #797979; box-sizing: border-box; overflow: hidden; white-space: nowrap; position: absolute; left: 2.5em; bottom: 0; z-index: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .image .cover .tocompare2:hover span {width: 10em; padding: 0 0.8em;} .detail .image .cover .tocompare2:after, .detail .image .cover .tocompare2 span:after {display: block; width: 100%; height: 100%; background: black; opacity: 0; position: absolute; right: 0; top: 0; z-index: 2; content: "";} .detail .image .cover .tocompare2:hover:after, .detail .image .cover .tocompare2:hover span:after {opacity: 0.04;} .detail .image .bt_360 {display: block; width: 2em; height: 2em; position: absolute; top: 0; right: 0; z-index: 20; cursor:pointer; background: url('images/icon-360.png') no-repeat center center; background-size: contain; content: ""; opacity: 0.6; transition: .15s ease-in-out;} .detail .image .bt_360:hover {opacity: 1;} .detail .last-viewed {display: block; width: 100%; height: auto; margin: 1.5em 0 0; position: relative;} .detail .last-viewed.lv2 {display: none;} .detail .last-viewed h2 {display: block; width: 100%; font-size: 1em; font-weight: 500; text-align: center; margin-bottom: 0.5em; color: #252525;} .detail .last-viewed h2 span {display:block; font-size: 0.85em; font-weight: 300; text-align: center;} .detail .last-viewed .swiper-container {display: block; width: 100%; padding: 0 2em; box-sizing: border-box; position: relative;} .detail .last-viewed .swiper-container:after {display: block; width: 2.4em; height: 100%; background: white; position: absolute; right: 0; top: 0; z-index: 30; content: "";} .detail .last-viewed .swiper-container:before {display: block; width: 2.4em; height: 100%; background: white; position: absolute; left: 0; top: 0; z-index: 30; content: "";} .detail .last-viewed .swiper-slide {display: block; width: 30%; padding: 0 0.5em; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .last-viewed .swiper-slide img {display: block; width: 100%;} .detail .last-viewed .swiper-button-prev2, .detail .last-viewed .swiper-button-next2 {display: block; width: 2em; height: 100%; opacity: 0.75; position: absolute; top: 0; z-index: 500; background-size: 0.8em auto; background-repeat: no-repeat; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .last-viewed .swiper-button-prev2 {left: 0; background-image: URL('images/arrow-l.svg'); background-position: left 1em center;} .detail .last-viewed .swiper-button-next2 {right: 0; background-image: URL('images/arrow-r.svg'); background-position: right 1em center;} .detail .last-viewed .swiper-button-prev2:hover, .detail .last-viewed .swiper-button-next2:hover {opacity: 0.4; cursor: pointer;} .detail .brand {display: flex; width: 100%; height: auto; justify-content: center; align-items: center; margin-top: 30px;} .detail .brand img {display: block; width: auto; max-height: 60px;} .detail .brand.b2 {display: none;} .detail .message {display: block; width: 100%; text-align: center; font-size: 0.8em; font-weight: bold; background: #ffd7a4; color: #ad6100; text-transform: uppercase; padding: 0.4em; margin: 1.5em 0; box-sizing: border-box;} .detail .message.m2 {display: none;} .detail .upper .right {display: block; width: 65%; box-sizing: border-box;} .detail .upper .right .tags {display: flex; align-items: flex-start; flex-wrap: wrap; margin: -0.4em 0 0.3em;} .detail .upper .right .tiny-nav, .detail .upper .right .info-text {padding: 0;} .detail .upper .right .info-text {margin-bottom: 1.1em;} .detail .upper .right .info-text h1 {text-align: left; font-size: 1.5em; line-height: 1.05em; margin-bottom: 0.6em;} .detail .upper .right .info-text p {font-size: 0.9em; padding-bottom: 0.82em;} .detail .upper .right .info-text p h1 {color: black; font-weight: 600;} .detail .upper .right .status {display: flex; width: 100%; align-items: center; flex-wrap: wrap; margin: -5px 0 6px; padding-bottom: 1em; border-bottom: solid 1px rgba(0,0,0,0.15);} .detail .upper .right .status .box {display: inline-block; padding: 0.12em 0.47em 0.1em 0.47em; margin-right: 0.6em; color: white; font-size: 1em; font-weight: 500; margin-bottom: 0.3em; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;} .detail .upper .right .status.out-of-stock .box {background: #d0a43a;} .detail .upper .right .status.in-stock .box {background: #58c400;} .detail .upper .right .status .text {display: block; font-size: 1em; color: #7c7c7c;} .detail .upper .right .likes {display: flex; width: 100%; align-items: center; color: #5e87ac; font-size: 0.9em; margin: -0.1em 0 0.1em; padding: 0 !important; font-weight: 600;} .detail .upper .right .likes:before {display: inline-block; width: 1.2em; height: 1.35em; background: URL('images/like.png') no-repeat left center; background-size: 0.9em auto; content: "";} .detail .upper .right .fb-like {display: block; width: 100%; overflow: hidden;} .detail .upper .right .button-video {padding: 0; margin: -0.2em 0 0.5em;} .detail .upper .right .button-video > * {display: flex; align-items: center; background: #252525; font-size: 0.9em; color: #f2f2f2; font-weight: 600; padding: 0.7em; box-sizing: border-box; border-radius: 0.2em; cursor: pointer; transition: .15s ease-in-out;} .detail .upper .right .button-video > *:hover {background: black; color: white;} .detail .upper .right .button-video > * img {display: block; width: 1.6em; margin: 0 0.5em 0 0;} .detail .upper .right .description {display: block; width: 100%; font-size: 0.8em; padding-top: 1.3em; margin-top: 0.25em; border-top: solid 1px rgba(0,0,0,0.15); color:#0e59ba; } .detail .upper .right .description p {display: block; line-height: 1.5em; margin-top: 0.4em;} .detail .upper .right .extras {display: flex; align-items: center; flex-wrap: wrap; font-size: 0.9em; padding: 1.1em 0 0.5em; border-top: solid 1px rgba(0,0,0,0.15); border-bottom: solid 1px rgba(0,0,0,0.15);} .detail .upper .right .guarantee {display: flex; align-items: center; font-weight: 600; font-size: 0.75em; line-height: 1.3em; margin: 0.1em 8em 1.2em 0; box-sizing: border-box;} .detail .upper .right .guarantee span {display: block; height: 1em; font-size: 2.8em; line-height: 1em; border-right: solid 1px #d7d7d7; padding-right: 0.4em; margin: 0.1em 0.4em 0 0;} .detail .upper .right .stamp {display: flex; align-items: center; font-size: 0.75em; font-weight: 500; padding: 1.1em 0; color: #286579; margin-right: 2em; margin-bottom: 1em; background: URL('images/badge.png') no-repeat left center; background-size: auto 100%; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .upper .right .stamp span {display: block; text-align: center; margin-right: 1em; color: #39565f; line-height: 1em; background: white; padding: 2px 1px; border-top: solid 1px #aabdc3; border-bottom: solid 1px #aabdc3; box-sizing: border-box;} .detail .upper .right .stamp:after {display: block; margin-left: 0.6em; font-size: 1.6em; font-weight: 300; content: "\f105"; font-family: fontawesome; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .upper .right .stamp:hover {color: #257f9d;} .detail .upper .right .stamp:hover:after {margin-left: 0.8em;} .detail .upper .right .stamp.s2 {background-image: URL('images/badge2.png'); color: #bc6036; cursor:pointer;} .detail .upper .right .stamp.s2 span {width: 4.5em; background: none; border: none;} .detail .upper .right .stamp.s3 {background-image: URL('images/znacka-vyrobky-z-drahych-kovu.png'); color: #d59b00; cursor:pointer;} .detail .upper .right .stamp.s3 span {width: 4.5em; background: none; border: none;} .detail .upper .right .stamp.s4 {background-image: URL('images/puncovni-urad.png'); color: #1c3261; cursor:pointer;} .detail .upper .right .stamp.s4 span {width: 4.5em; background: none; border: none;} .detail .upper .right .plus {display: block; width: 100%; font-size: 0.9em; margin: 0.9em 0; padding: 0.5em 0 0.9em; border-bottom: solid 1px rgba(0,0,0,0.15);} .detail .upper .right .plus ul li {display: block; font-size: 0.9em; margin-bottom: 0.4em; padding-left: 1.4em; box-sizing: border-box; position: relative;} .detail .upper .right .plus ul li:before {display: inline-block; width: 1em; height: 1em; background: URL("images/watches-service-bullet.png") no-repeat center center; background-size: 100% 100%; position: absolute; left: 0; top: 0.1em; content: "";} .detail .upper .right .plus ul li i {display: inline-block; font-family: fontawesome; font-size: 0.9em; margin-left: 0.4em; color: #d0a43a; cursor: pointer;} .detail .upper .right .plus ul li i.cerny {color: #0000EE; margin-left: 0.2em;} .detail .upper .right .plus ul li .hint {display: none; width: 90%; height: auto; cursor: auto; padding: 2em 4em 2em 2em; font-size: 0.85em; line-height: 1.4em; font-style: italic; position: fixed; left: 5%; bottom: 1em; text-align: left; z-index: 500; background: rgb(33,33,33); color: white; box-sizing: border-box;} .detail .upper .right .plus ul li.showhint .hint {display: block; max-height: 85%; overflow: auto;} .detail .upper .right .plus ul li .hint .close {opacity: 0.4; display: block; width: 1em; height: 1em; position: absolute; right: 1em; top: 1em; background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .detail .upper .right .plus ul li .hint .close:hover {opacity: 0.8;} .detail .upper .right .plus p, .detail .upper .right .parameters h2 {display: block; color: #d0a43a; font-size: 1.1em; font-weight: bold; line-height: 1.3em; margin-bottom: 0.4em;} .detail .upper .right .parameters {display: block; width: 100%; font-size: 0.9em; padding: 0.4em 0 0.8em; margin-bottom: 2em; border-bottom: solid 1px rgba(0,0,0,0.15); box-sizing: border-box;} .detail .upper .right .parameters .line {display: block; width: 100%; padding: 0.15em 0; color: #252525; font-size: 0.9em; line-height: 1.4em;} .detail .upper .right .parameters .line.hidden {display: none;} .detail .upper .right .parameters .line span:first-child {display: inline-block; font-weight: 600; margin-right: 0.5em; color: black;} .detail .upper .right .parameters .line i {display: inline-block; font-family: fontawesome; font-size: 0.8em; margin-left: 0.5em; color: #d0a43a; cursor: pointer;} .detail .upper .right .parameters .line .hint {display: none; width: 90%; height: auto; cursor: auto; padding: 2em 4em 2em 2em; font-size: 1em; background-color:#d0a43a; font-style: italic; position: fixed; left: 5%; bottom: 1em; text-align: left; z-index: 500; /*background: rgb(33,33,33);*/ color: black; box-sizing: border-box;} .detail .upper .right .parameters .line .hint strong { font-size:1.2em; } .detail .upper .right .parameters .line .hint em { text-decoration:underline; cursor:pointer; } .detail .upper .right .parameters .line.showhint .hint{display: block; max-height: 85%; overflow: auto;} .detail .upper .right .parameters .line .hint .close {opacity: 0.4; display: block; width: 1em; height: 1em; position: absolute; right: 2em; top: 1em; background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .detail .upper .right .parameters .line .hint .close:hover {opacity: 0.8;} .stitek i {display: inline-block; font-family: fontawesome; font-size: 1em; margin-left: 0.5em; color: #ffffff; cursor: pointer;} .stitek .hint {display: none; width: 90%; height: auto; cursor: auto; padding: 2em 4em 2em 2em; font-size: 1em; background-color:#d0a43a; font-style: italic; position: fixed; left: 5%; bottom: 1em; text-align: left; z-index: 500; /*background: rgb(33,33,33);*/ color: black; box-sizing: border-box;} .stitek .hint strong { font-size:1.2em; } .stitek .hint em { text-decoration:underline; cursor:pointer; } .stitek.showhint .hint{display: block; max-height: 85%; overflow: auto;} .stitek .hint .close {opacity: 0.4; display: block; width: 1em; height: 1em; position: absolute; right: 2em; top: 1em; background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .stitek .hint .close:hover {opacity: 0.8;} .detail .upper .right .parameters .bt {display: block; font-size: 0.8em; color: #247ea0; font-weight: 600; cursor: pointer; margin-top: 1.2em;} .detail .upper .right .parameters .bt span {display: none;} .detail .upper .right .parameters .bt.v1 span.show {display: block;} .detail .upper .right .parameters .bt.v1 span.hide {display: none;} .detail .upper .right .parameters .bt span.hide {display: block;} .detail .upper .right .parameters .bt span:before {display: inline-block; content: "\f105"; font-family: fontawesome; margin-right: 0.5em;} .detail .upper .right .parameters .bt span.hide:before{content: "\f106";} .detail .upper .right .parameters .bt:hover {text-decoration: underline;} .detail .upper .right .price {display: flex; width: 100%; flex-wrap: wrap; box-sizing: border-box; margin: 0 0 1em;} .detail .upper .right .price .s3 .p1, .detail .upper .right .price .s5 .p1 {display: block; width: 100%; color: #252525; font-size: 0.9em; font-weight: 500; line-height: 1.3em;} .detail .upper .right .price .s5s .p1 span, .detail .upper .right .price .s3s .p1 span {display: block; width: 100%; color: #252525; font-size: 0.5em; font-weight: 500; line-height: 1.3em;} .detail .upper .right .price .s1 .p1, .detail .upper .right .price .s1s .p1, .detail .upper .right .price .s3 .p2, .detail .upper .right .price .s3s .p1, .detail .upper .right .price .s5 .p2, .detail .upper .right .price .s5s .p1, .detail .upper .right .price .s6 .p1, .detail .upper .right .price .s6s .p1, .detail .upper .right .price > p {display: block; width: 100%; color: #252525; font-size: 2em; font-weight: 600; line-height: 1em;} .detail .upper .right .price .s1s .p2, .detail .upper .right .price .s3s .p2, .detail .upper .right .price .s5s .p2, .detail .upper .right .price .s6s .p2 {display: inline-block; padding: 0.3em 0.4em; background: #d0a43a; color: white; font-size: 0.75em; font-weight: bold; margin-right: 0.6em;} .detail .upper .right .price .s1s .p3, .detail .upper .right .price .s3s .p3, .detail .upper .right .price .s5s .p3, .detail .upper .right .price .s6s .p3 {display: inline-block; color: #848484; font-size: 1em; font-weight: bold; text-decoration: line-through; line-height: 1.3em; margin-top: 0.2em;} .detail .upper .right .price .question {display: flex; align-items: center; padding: 0.4em 0; font-size: 1em; font-weight: bold; color: #be8805; background: none; outline: none; border: none; border-bottom: solid 1px #d7d7d7; cursor: pointer;} .detail .upper .right .price .question:before {content:''; display: block; position: relative; width: 1.3em; height: 1.3em; margin-right: 0.35em; background: URL('images/envelope.png') no-repeat center center; background-size: auto 100%;} .detail .upper .right .price .question:after {display: block; margin-left: 0.3em; content: " \f105 \f105"; color:#be8805; font-family: fontawesome; font-size: 0.8em;} .detail .upper .right .buy {display: flex; width: 100%; align-items: center; flex-wrap: wrap; box-sizing: border-box; margin-top: 0.3em;} .detail .upper .right .buy button {font-size: 1em; padding: 0.6em 2em; margin: 0 0.7em 0.4em 0; border: 3px solid #f3e0a4; /*pridano 13.12.23*/border-radius:6px; background-clip:padding-box; } .detail .upper .right .buy p {display: block; font-size: 1em; font-weight: bold; line-height: 1.3em; margin-bottom: 0. 5em;} .detail .buy .radiNabidnemeSlevu {display:block; width: 100%; font-size: 0.9em; margin-bottom: 0.6em; } .detail .buy .radiNabidnemeSlevu > .text {max-width:375px; display:block; background-color:#FDEAC1; padding:10px;border-radius:4px; } .detail .buy .radiNabidnemeSlevu > .text > strong {display: block; font-size: 1.3em; text-align: center;} .detail .buy .radiNabidnemeSlevu > .text > p {display: block;font-size: 0.8em; margin: 0.6em 0px 1.1em 0px; text-align: center;} .detail .upper .right .actions {display: block; max-width: 320px; box-sizing: border-box; margin-top: 10px;} .detail .upper .right .actions .line {display: flex; width: 100%; align-items: center; padding: 10px 0; font-size: 15px; font-weight: bold; color: #210321; background: none; outline: none; border: none; border-bottom: solid 1px #d7d7d7; cursor: pointer;} .detail .upper .right .actions .line:hover {text-decoration: underline;} .detail .upper .right .actions .line:first-child {border-top: solid 1px #d7d7d7;} .detail .upper .right .actions .line:after {display: block; margin-left: 5px; content: " \f105 \f105"; font-family: fontawesome; font-size: 0.8em;} .detail .upper .right .actions .line:before {display: block; width: 20px; height: 18px; margin-right: 9px; content: "";} .detail .upper .right .actions .assistant2:before {background: URL('images/assistant2.png') no-repeat center center; background-size: auto 100%;} .detail .upper .right .actions .question:before {background: URL('images/envelope.png') no-repeat center center; background-size: auto 100%;} .detail .upper .right .actions .to-compare:before {background: URL('images/compare.png') no-repeat center center; background-size: auto 100%;} .detail .popup#assistant {display: none;} .detail .popup#assistant.show {display: flex;} @media screen and (max-width: 860px) { .detail .upper .right .actions {max-width: 280px;} .detail .upper .right .actions .line {padding: 8px 0; font-size: 13px;} .detail .upper .right .actions .line:before { width: 17px; height: 16px; margin-right: 8px;} } @media screen and (max-width: 680px) { .detail .upper .left {width: 100%;} .detail .upper .right {width: 100%; padding-left: 0;} .detail .upper .right .info-text h1 {font-size: 1.5em;} .detail .image.n1 {display: none;} .detail .image.n2 {display: block; margin-top: 1.5em;} .detail .image .cover {max-width: 16em;} .detail .image .cover .swiper-slide {width: 100%;} .detail .image .thumbs {max-width: 26em;} .detail .brand.b1 {display: none;} .detail .brand.b2 {display: flex; margin-bottom: 2em;} .detail .last-viewed.lv1 {display: none;} .detail .last-viewed.lv2 {display: block;} } @media screen and (max-width: 640px) { .detail .bottom .interests .text img {width: 100%; margin: 0 0 1em; float: none;} } .detail .bottom {display: block; width: 100%; padding-top: 2em; margin-top: 1.5em; border-top: solid 1px rgba(0,0,0,0.2);} .cta-parameters {display: flex; width: 100%; height: 9em; justify-content: center; align-items: center; background: #252525; margin-bottom: 4em; position: relative; padding: 0 4em; box-sizing: border-box;} .cta-parameters:after {display: block; width: 100%; height: 1px; background: black; opacity: 0.15; position: absolute; left: 0; bottom: -2em; content: "";} .cta-parameters > div {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden;} .cta-parameters > div:before {display: block; width: 45%; height: 100%; background: url('https://www.tovys.cz/themes/default/images/cta-parameters-img1.jpg') no-repeat center top -2em; background-size: 100% auto; position: absolute; left: -5%; top: 0; z-index: 1; content: "";} .cta-parameters > div:after {display: block; width: 45%; height: 100%; background: url('https://www.tovys.cz/themes/default/images/cta-parameters-img2.jpg') no-repeat center center; background-size: 100% auto; position: absolute; right: -5%; top: 0; z-index: 1; content: "";} .cta-parameters .button {font-weight: 400; padding: 0.7em 1.3em; position: relative; z-index: 3;} @media screen and (max-width: 1080px) { .cta-parameters > div:before {left: -10%; background-position: center center;} .cta-parameters > div:after {right: -10%;} } @media screen and (max-width: 640px) { .cta-parameters > div:before, .cta-parameters > div:after {width: 60%;} } .parameters-list {display: flex; width: 100%; height: 100%; justify-content: center; padding: 1.5em 1.5em 1.5em; box-sizing: border-box; position: fixed; left: -99999px; top: 0; z-index: 100000;} .parameters-list.show {left: 0;} .parameters-list.show:before {opacity: 1;} .parameters-list.show > div {top: 0;} .parameters-list.show.hide {left: -99999px; transition: left .4s ease-in-out; transition-delay: 1s;} .parameters-list.show.hide:before {opacity: 0;} .parameters-list.show.hide > div {top: -5em; opacity: 0;} .parameters-list:before {display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: absolute; left: 0; top: 0; z-index: -1; content: ""; opacity: 0; transition: opacity .4s ease-in-out;} .parameters-list > div {display: block; width: 100%; max-width: 50em; max-height: calc(100vh - 4rem); background: #f5f5f5; position: relative; top: 5em; overflow: hidden; transition: .4s ease-in-out;} .parameters-list > div:after {display: block; width: 100%; width: 100%; height: 1.2rem; background: #f5f5f5; position: absolute; left: 0; bottom: 0; content: ""; z-index: 5;} .parameters-list h2 {display: block; width: calc(100% - 1em); text-align: left; font-size: 1.3em; font-weight: bold; background: #f5f5f5; margin: 0; padding: 2rem 2rem 0.7rem; overflow-y: auto; overflow-x: hidden; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 5;} .parameters-list #close {display: block; width: 1.2em; height: 1.2em; font-size: 1em; cursor: pointer; position: absolute; right: 2rem; top: 2rem; z-index: 10002;} .parameters-list #close span {display: block; width: 100%; height: 3px; background: #cccccc; border-radius: 2px; position: absolute; left: 0; top: calc(50% - 1px); z-index: 1; transition: .2s ease-in-out;} .parameters-list #close:hover span {background: #252525;} .parameters-list #close span:nth-child(1) {transform: rotate(45deg);} .parameters-list #close span:nth-child(2) {transform: rotate(-45deg);} .parameters-list > div .overflow {display: block; width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden;} .parameters-list .items {display: flex; width: 100%; flex-wrap: wrap; padding: 5rem 2rem 1.5rem; box-sizing: border-box;} .parameters-list .items > div {display: block;} .parameters-list .items .category-name {display: flex; width: 100%; height: 3.8em; align-items: center; font-size: 0.75em; color: #252525; font-weight: 500; background: white; border: solid 1px rgba(0,0,0,0.15); position: relative; box-sizing: border-box; transition: .2s ease-in-out; cursor: pointer;} .parameters-list .items .category-name:before {display: block; width: 0.8em; height: 0.8em; background: url('https://www.tovys.cz/themes/default/images/arrow-down.png') no-repeat center center; background-size: 100% auto; position: absolute; right: 0.9em; top: 1.45em; content: ""; transition: .2s ease-in-out;} .parameters-list .items .category-name:after {display: block; width: calc(100% + 2px); height: 0.6em; background: white; margin-left: -1px; border-left: solid 1px #be8805; border-right: solid 1px #be8805; box-sizing: border-box; position: absolute; left: -9999px; bottom: -0.55em; content: ""; transition: opacity .2s ease-in-out;} .parameters-list .items .category-name:hover {border-color: #be8805;} .parameters-list .items .info {display: none; width: 100%; background: white; border: solid 1px #be8805; margin-top: 0.3em; box-sizing: border-box; opacity: 0; transition: .3s ease-in-out;} .parameters-list .items .info > div {display: flex; width: 100%; flex-wrap: wrap;} .parameters-list .items .info > div > div {display: flex; justify-content: space-between; border-top: solid 1px rgba(0,0,0,0.10); box-sizing: border-box;} .parameters-list .items .info > div > div .parameter {display: block; width: calc(100% - 11em); font-size: 0.68em; color: #252525; font-weight: bold;} .parameters-list .items .info > div > div .note {display: block; width: 10em; font-size: 0.7em; color: #666666;} .parameters-list .items .info > div > div .note img {display: block; width: 0.9em; margin-top: 0.25em; float: right;} .parameters-list .items > div.show .category-name {border-color: #be8805;} .parameters-list .items > div.show .category-name::before {transform: rotate(180deg);} .parameters-list .items > div.show .category-name::after {left: 0; opacity: 1;} .parameters-list .items > div.show .info {transition-delay: 0.5s; opacity: 1;} @media screen and (min-width: 961px) { .parameters-list .items > div {width: calc(25% - 0.21em); margin: 0.28em 0.28em 0 0;} .parameters-list .items > div:nth-child(-n+4) {margin-top: 0;} .parameters-list .items > div:nth-child(4n+4) {margin-right: 0;} .parameters-list .items .info {width: calc(400% + 0.84em);} .parameters-list .items > div:nth-child(4n+2) .info {margin-left: calc(-100% - 0.28em);} .parameters-list .items > div:nth-child(4n+3) .info {margin-left: calc(-200% - 0.56em);} .parameters-list .items > div:nth-child(4n+4) .info {margin-left: calc(-300% - 0.84em);} } @media screen and (min-width: 769px) and (max-width: 960px){ .parameters-list .items > div {width: calc(33.33% - 0.2em); margin: 0.3em 0.3em 0 0;} .parameters-list .items > div:nth-child(-n+3) {margin-top: 0;} .parameters-list .items > div:nth-child(3n+3) {margin-right: 0;} .parameters-list .items .info {width: calc(300% + 0.6em);} .parameters-list .items > div:nth-child(3n+2) .info {margin-left: calc(-100% - 0.3em);} .parameters-list .items > div:nth-child(3n+3) .info {margin-left: calc(-200% - 0.6em);} } @media screen and (min-width: 769px) { .parameters-list .items .category-name {padding: 0 2.4em 0 0.7em;} .parameters-list .items .info {padding: 1.4rem;} .parameters-list .items .info > div > div {width: 50%; padding: 0.8em; border-right: solid 1px rgba(0,0,0,0.10);} .parameters-list .items .info > div > div:nth-child(-n+2) {border-top: none; padding-top: 0;} .parameters-list .items .info > div > div:nth-child(odd) {padding-left: 0;} .parameters-list .items .info > div > div:nth-child(even) {border-right: none; padding-right: 0;} .parameters-list .items .info > div > div:nth-last-child(-n+2) {padding-bottom: 0;} } @media screen and (max-width: 769px) { .parameters-list .items .category-name {padding: 0 2.4rem 0 1rem;} .parameters-list .items .info {padding: 1rem;} .parameters-list .items .info > div > div {width: 100%; padding: 0.8em 0;} } @media screen and (min-width: 541px) and (max-width: 768px){ .parameters-list .items > div {width: calc(50% - 0.15em); margin: 0.3em 0.3em 0 0;} .parameters-list .items > div:nth-child(-n+2) {margin-top: 0;} .parameters-list .items > div:nth-child(even) {margin-right: 0;} .parameters-list .items .info {width: calc(200% + 0.3em);} .parameters-list .items > div:nth-child(even) .info {margin-left: calc(-100% - 0.3em);} } @media screen and (max-width: 540px) { .parameters-list .items > div {width: 100%; margin: 0.3em 0 0;} .parameters-list .items > div:nth-child(1) {margin-top: 0;} .parameters-list .items .info {width: 100%;} } .parameters-list .items .info > div > div .parameter i {display: inline-block; font-family: fontawesome; font-size: 1.0em; margin-left: 0.5em; color: #d0a43a; cursor: pointer;} .parameters-list .items .info > div > div .parameter .hint {display: none; width: 90%; height: auto; cursor: auto; padding: 2em 4em 2em 2em; font-size: 1.1em; font-style: italic; position: fixed; left: 5%; bottom: 1em; text-align: left; z-index: 10001; background: rgb(33,33,33); color: white; box-sizing: border-box;} .parameters-list .items .info > div > div .parameter.showhint .hint{display: block; max-height: 85%; overflow: auto;} .parameters-list .items .info > div > div .parameter .hint .close {opacity: 0.4; display: block; width: 1em; height: 1em; position: absolute; right: 2em; top: 1em; background: URL('images/cross2.png') no-repeat center center; background-size: 100%; cursor: pointer;} .parameters-list .items .info > div > div .parameter .hint .close:hover {opacity: 0.8;} .descriptionSmartWatch.dsw2 {margin-top: -1.1em;} .descriptionSmartWatch {display: block; width: 100%; margin-bottom: 1.5em; margin-top: 0em;} .descriptionSmartWatch h2 {margin: 0.8em 0 0 0; font-size: 1.8em; text-align: center; font-weight:600; } .descriptionSmartWatch h3 {display: block; width: 100%; text-align: left; font-size: 1.8em; line-height: 1.2em; font-weight: bold; margin: 0.8em 0 0.7em 0;} .descriptionSmartWatch ul li, .descriptionSmartWatch p {display: block; width: 100%; text-align: justify; font-size: 0.9em; line-height: 1.4em;} .descriptionSmartWatch ul {display: block; width: 100%; margin: 1.5em 0; padding-left: 2.5em; box-sizing: border-box;} .descriptionSmartWatch ul li {padding-left: 0.7em; text-align: left; box-sizing: border-box; position: relative;} .descriptionSmartWatch ul li:before {display: block; content: ""; background: black; width: 0.2em; height: 0.2em; border-radius: 100%; position: absolute; left: 0; top: 0.4em;} .descriptionSmartWatch .media {display: block; width: 100%; /*background: white;*/ margin: 0.6em 0em 0.6em 0em;} .descriptionSmartWatch .media img {display: block; width: 100%; height: auto !important;} .descriptionSmartWatch .media .iframe {display: block; width: 100%; padding-top: 56%; position: relative;} .descriptionSmartWatch .media .iframe iframe {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .descriptionSmartWatch .PKWin_imageBox {display: block; width: 100%; /*background: white;*/ margin: 2em 0;} .descriptionSmartWatch .PKWin_imageBox img {display: block; width: 100%; /*max-width: 900px;*/ height: auto !important; margin: 0 auto;} @media screen and (max-width: 960px) { .descriptionSmartWatch {margin-bottom: 0.8em;} } .eshop-product-addon_eshop-product-addon-component-tile__body .span { font-size:1em !important; } .detail .panels {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; box-sizing: border-box; position: relative; margin: 2em 0 3em;} .detail .panels .panel {display: flex; width: calc(33.33% - 0.2em); justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; padding: 2.2em 1em; box-sizing: border-box; position: relative; overflow: hidden; border-radius: 3px; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .panels .panel.similar {background: URL('images/similar-bg.jpg?r=1') no-repeat center center; background-size: cover;} .detail .panels .panel.similar > img {display: block; width: 100%; max-width: 8em; margin-bottom: 1.2em;} .detail .panels .panel.similar .info {display: block; width: 90%;} .detail .panels .panel.similar .info .logo {display: block; width: 100%; max-width: 8em; margin: 0 auto 1em;} .detail .panels .panel.similar .info .logo.enhanced {-ms-transform: scale(1.3,1.3); -webkit-transform: scale(1.3,1.3); transform: scale(1.3,1.3);} .detail .panels .panel.similar .info p {display: block; width: 100%; text-align: center; font-size: 0.9em; font-weight: 600; color: #212121; margin-bottom: 1em;} .detail .panels .panel.similar .info .button {display: block; width: 8em; margin: 0 auto; padding: 0;} .detail .panels .panel.similar a {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;} .detail .panels .panel.hand {background: URL('images/panel-hand.jpg') no-repeat center center; background-size: cover;} .detail .panels .panel.hand .editor {display: block; max-width: 25em; position: relative;} .detail .panels .panel.hand .editor > img {display: block; width: 100%; height: auto; margin: 0.6em 0 1em; border-radius: 100% 0 0 100%; overflow: hidden;} .detail .panels .panel.hand .watches {display: flex; width: 100%; height: 100%; justify-content: center; align-items. center; align-content: center; flex-wrap: wrap; position: absolute; left: 0; top: 0;} .detail .panels .panel.hand .watches span {display: flex; width: 100%; justify-content: center; align-items: center; align-content: center; margin-left: -26.6%; bottom: 13%; position: relative;} .detail .panels .panel.hand p {display: block; width: 100%; text-align: center; color: white; font-size: 1em; font-weight: bold; padding: 0 10%; box-sizing: border-box; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .panels .panel.hand:hover {-ms-transform: scale(0.98,0.98); -webkit-transform: scale(0.98,0.98); transform: scale(0.98,0.98);} .detail .panels .panel.hand:hover p {color: #f9cf6b;} .detail .panels .panel.hand .watches span img {display: block; width: 11%; height: auto;} .detail .panels .panel.tocompare {background: URL('images/panel-compare.jpg') no-repeat center center; background-size: cover;} .detail .panels .panel.tocompare .slots {display: flex; max-width: 80%; height: auto; justify-content: center; flex-wrap: wrap; margin-bottom: 1em;} .detail .panels .panel.tocompare .slots .slot {display: flex; width: calc(33.33% - 0.3em); justify-content: center; align-items: center; background: white; border-radius: 2px; margin: 0.15em; overflow: hidden; padding: 0.6em; box-sizing: border-box;} .detail .panels .panel.tocompare .slots .slot img {display: block; width: 100%;} .detail .panels .panel.tocompare p {display: block; width: 100%; text-align: center; color: white; font-size: 0.9em; font-weight: bold; padding: 0 10%; box-sizing: border-box; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .panels .panel.tocompare:hover {transform: scale(0.98,0.98);} .detail .panels .panel.tocompare:hover p {color: #f9cf6b;} .detail .panels .panel.tocompare .icon {display: block; width: 1.6em; height: auto; position: absolute; right: 0.8em; top: 0.8em;} .detail .panels .panel.service {background: URL("images/panel-service-img.png") no-repeat left center, URL("images/panel-service-bg.jpg") no-repeat center center; background-size: auto 100%, 100% 100%; position: relative;} .detail .panels .panel.service p {display: block; width: 100%; text-align: center; color: #ffd7a4; font-size: 2em; line-height: 1.3em; font-weight: bold; padding: 0 15%; box-sizing: border-box; text-shadow: 0px 0px 0.2em rgba(0,0,0,0.5); -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .detail .panels .panel.service p span {display: block; line-height: 1.3em;} .detail .panels .panel.service p span.span1 {font-size: 0.65em;} .detail .panels .panel.service p span.span2 {font-size: 0.75em; margin-top: 1em; position: relative;} .detail .panels .panel.service p span.span2:after {display: block; width: 3em; height: 1px; background: white; position: absolute; left: calc(50% - 1.5em); top: -0.5em; content: "";} .detail .panels .panel.assistant {background: URL("images/advisory.jpg") no-repeat center center; background-size: cover;} .detail .panels .panel.assistant:after {display: block; width: 100%; height: 100%; background: URL("images/advisory-watches.png") no-repeat center center; background-size: contain; opacity: 0.25; content: ""; position: absolute; right: 0; top: 0; z-index: 1;} .detail .panels .panel.assistant .text {display: block; width: 100%; padding: 1em; box-sizing: border-box; position: relative; z-index: 2} .detail .panels .panel.assistant .swiper-container {display: block; width: 100%; height: 5em; margin-bottom: 0.9em;} .detail .panels .panel.assistant .swiper-slide {display: flex; height: 100%; justify-content: center; align-items: flex-start; text-align: center; font-size: 1.2em; font-weight: 500; line-height: 1.3em; color: #ffd7a4; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .detail .panels .panel.assistant .input {display: block; width: 100%; max-width: 15em; height: auto; position: relative; margin: 0.5em auto;} .detail .panels .panel.assistant .input input {width: 100%; height: 2.2em; padding-right: 5em; box-sizing: border-box; font-size: 0.8em; border-radius: 2px;} .detail .panels .panel.assistant .input .button {display: flex; width: 6em; height: 2.2em; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; font-size: 0.7em; font-weight: 600; color: white; background: #000e19; border-radius: 2px; padding: 0; position: absolute; right: 0.16em; top: 0.16em; z-index: 2;} .detail .panels .panel.assistant .input .button:hover {background: #093252;} .detail .panels .panel.assistant p {display: block; max-width: 20em; text-align: center; font-size: 0.75em; color: white; font-weight: 300; line-height: 1.4em; margin: 0 auto;} @media screen and (max-width: 960px) { .detail .panels .panel {width: 100%; margin-bottom: 0.25em;} } @media screen and (min-width: 640px) and (max-width: 960px){ .detail .panels .panel.similar {} .detail .panels .panel.similar > img {max-width: 8em; margin: 0 1.5em 0 0;} .detail .panels .panel.similar .info {width: 15em;} .detail .panels .panel.tocompare .slots {max-width: 24em;} } /* .detail .assistant.adv2 {display: none;} .detail .assistant {width: 100%; margin: 30px 0; padding: 60px 40px;} .detail .assistant .text {width: 100%; padding: 0;} .detail .assistant .swiper-container {height: 75px; margin-bottom: 20px;} .detail .assistant .input {width: 100%; max-width: 9rem;} @media screen and (max-width: 3200px) { .detail .assistant:after {background-position: right 3% center; background-size: auto 90%;} } @media screen and (max-width: 2860px) { .detail .assistant:after {background-position: right 2% center; background-size: auto 80%;} .detail .assistant .text {width: 420px;} } @media screen and (max-width: 2500px) { .detail .assistant {padding: 40px 0.7rem;} .detail .assistant:after {background-size: auto 70%;} .detail .assistant .text {width: 360px;} } @media screen and (max-width: 2100px) { .detail .assistant {padding: 0;} .detail .assistant:after {opacity: 0.2; background-position: center center; background-size: auto 300px;} .detail .assistant .text {display: block; width: 100%; padding: 20px 30px 30px;} .detail .assistant .swiper-container {height: 100px; margin-bottom: 10px;} .detail .assistant .swiper-slide {justify-content: center; align-items: center} .detail .assistant .input {width: 100%; max-width: 320px; margin: 6px auto;} .detail .assistant .input .input {padding-right: 90px;} .detail .assistant .input .button {width: 80px; font-size: 11px;} .detail .assistant p {width: 100%; text-align: center;} } @media screen and (max-width: 1800px) { .detail .assistant .swiper-container {height: 70px; margin-bottom: 10px;} .detail .assistant .swiper-slide {font-size: 26px} } @media screen and (max-width: 1500px) { .detail .assistant .swiper-container {height: 64px;} .detail .assistant .swiper-slide {font-size: 24px;} .detail .assistant .swiper-slide br {display: none;} } @media screen and (max-width: 1280px) { .detail .assistant .swiper-container {height: 60px;} .detail .assistant .swiper-slide {font-size: 22px;} } @media screen and (max-width: 960px) { .detail .assistant .swiper-container {height: 54px;} .detail .assistant .swiper-slide {font-size: 19px;} .detail .panels .panel.assistant {width: 100%; padding: 10px;} } @media screen and (max-width: 680px) { .detail .assistant.adv1 {display: none;} .detail .assistant.adv2 {display: block;} .detail .assistant .swiper-container {height: 60px;} .detail .assistant .swiper-slide {font-size: 22px;} } @media screen and (max-width: 480px) { .detail .assistant .swiper-container {height: 54px;} .detail .assistant .swiper-slide {font-size: 20px;} } @media screen and (max-width: 380px) { .detail .assistant .swiper-container {height: 50px;} .detail .assistant .swiper-slide {font-size: 18px;} } */ .detail .bottom .products {margin-bottom: 2em;} .panel .ref {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 5;} .detail .bottom .bigimage {display: block; width: 100%; height: auto; position: relative} .detail .bottom .bigimage:after {display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.6); position: absolute; left: 0; top: 0; content: "";} .detail .bottom .bigimage img {display: block; width: 100%; height: auto;} .detail .bottom .bigimage .text {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; position: absolute; left: 0; top: 0; z-index: 1; padding: 2rem; box-sizing: border-box;} .detail .bottom .bigimage .text h2 {display: block; width: 100%; text-align: center; color: white; font-size: 1.5rem; line-height: 1.03em; font-weight: 600; } .detail .bottom .bigimage .text p {display: block; width: 100%; text-align: center; color: #ffd7a4; font-size: 18px; line-height: 1.4em; font-weight: 600; margin-top: 20px;} .interests {display: block; width: 100%; margin-bottom: 3em;} /* .interests h2 {display: block; width: 100%; text-align: center; color: #d0a43a; font-size: 42px; line-height: 1em; margin-top: 1.5rem;} */ .interests .nav {display: flex; width: 100%; justify-content: center; flex-wrap: wrap; margin: 0 0 1em;} .interests .nav li {display: block; text-align: center; cursor: pointer; font-size: 1em; font-weight: 500; color: #bbbbbb; margin: 0.25em 0.4em; white-space: nowrap; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .interests .nav li.sel, .interests .nav li:hover {color: #d0a43a;} .interests .text {display: block; width: 100%; text-align: justify; font-size: 0.9em; line-height: 1.4em; float: left;} .interests .text img {display: inline-block; width: 20em; height: auto; margin: 0.1em 1em 1em 0; float: left;} .interests .text a {color: #d0a43a; text-decoration: underline;} .interests .text a:hover {text-decoration: none;} @media screen and (max-width: 360px) { .interests .nav li {min-width: 50%;} } .watches-service {display: block; width: 100%; padding: 2.5em 1.5em; margin-bottom: 3em; background: URL("images/watches-service-img.png") no-repeat left center, URL("images/watches-service-bg.jpg") no-repeat center center; background-size: auto 100%, 100% 100%; position: relative;} .watches-service .wrapper {justify-content: flex-end;} .watches-service .wrapper .info {display: block; width: 50%; max-width: 32em; position: relative; z-index: 2; text-shadow: 0 0 0.2em rgba(0,0,0,0.4), 0 0 0.4em rgba(0,0,0,0.6), 0 0 0.6em rgba(0,0,0,0.7);} .watches-service .wrapper .info h2 {display: block; color: white; font-size: 1.8em; margin-bottom: 0.3em; font-weight: bold;} .watches-service .wrapper .info p {display: block; color: #ffd7a4; margin-bottom: 1em; font-size: 0.9em; font-weight: bold;} .watches-service .wrapper .info p:last-of-type {font-size: 1.2em;} .watches-service .wrapper .info ul {display: block; width: 100%; margin-bottom: 1em;} .watches-service .wrapper .info ul li {display: block; width: 100%; font-size: 0.9em; color: white; padding-left: 1.5em; margin-bottom: 0.23em; box-sizing: border-box; position: relative;} .watches-service .wrapper .info ul li:before {display: block; width: 1.1em; height: 1.1em; background: URL("images/watches-service-bullet.png") no-repeat center center; background-size: 100% 100%; position: absolute; left: 0; top: 0; content: "";} .watches-service .wrapper .info ul li:last-of-type:before {display: none;} @media screen and (max-width: 1080px) { .watches-service {background-position: center center;} .watches-service:after {display: block; width: 100%; height: 100%; background: black; opacity: 0.6; position: absolute; left: 0; top: 0; z-index: 1; content: "";} .watches-service .wrapper {justify-content: center;} .watches-service .wrapper .info {width: 100%;} .watches-service .wrapper .info h2, .watches-service .wrapper .info p {text-align: center;} .watches-service .wrapper .info ul {display: flex; justify-content: center; flex-wrap: wrap;} .watches-service .wrapper .info ul li {width: auto; margin: 0.3em;} } .pg-reviews .info-text {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;} .pg-reviews .info-text h1 {width: auto; margin: 0;} @media screen and (max-width: 960px) { .pg-reviews .info-text {display: block;} } .add-review, .add-feedback {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-top: 0.6em;} .add-review p, .add-feedback p {display: block; width: auto; color: #a4a4a4; font-weight: bold; font-size: 1em; margin: 0 0.9em 0 0;} .add-review .button, .add-feedback .button {padding: 1em 1.3em; text-align: left; font-size: 0.9em;} @media screen and (min-width: 960px) { .add-review p, .add-feedback p {width: auto; margin: 0 0.9em 0 0;} } @media screen and (max-width: 960px) { .add-review, .add-feedback {justify-content: center; margin-top: 0.6em;} .add-review p, .add-feedback p {width: 100%; text-align: center; margin: 0 0 0.5em;} .add-review .button, .add-feedback .button {margin: 0 auto;} } .all-reviews {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;} .stars {display: block; position: relative; z-index: 5; overflow: hidden;} .stars svg {display: block; width: 100%; border: solid 1px transparent; box-sizing: border-box;} .stars > div {display: block; height: calc(100% - 4px); position: absolute; left: 2px; top: 2px; z-index: -1; background: #D0A43A; border-right: solid 3px #dbdbdb; box-sizing: border-box;} .stars:before {display: block; width: calc(100% - 3px); height: calc(100% - 3px); position: absolute; left: 1px; top: 1px; z-index: -2; background: #dbdbdb; content: "";} .feedback {display: flex; max-height: 25em; justify-content: space-between; align-content: flex-start; flex-wrap: wrap; margin-top: 0.4em; color: #252525; padding: 1.5em 2em; background: #f2f2f2; border-radius: 3px; border: solid 1px rgba(0,0,0,0.06); position: relative; overflow: auto; box-sizing: border-box;} .feedback .stars {width: 5em; order: 0; margin-bottom: 0.7em;} .feedback .stars svg {fill: #f2f2f2; border-color: #f2f2f2;} .feedback h2, .feedback h3 {display: block; width: 100%; font-size: 1em; font-weight: 500; line-height: 1.3em; margin-bottom: 0; order: 1;} .feedback h2 span, .feedback h3 span {display: inline-block; margin-left: 0.6em; padding-left: 0.7em; border-left: solid 1px #c9c9c9;} .feedback .feedback-content {display: block; width: 100%; max-height: 5em; overflow: hidden; order: 2;} .feedback .feedback-content.show {max-height: 6.8em; overflow-y: auto;} .feedback .feedback-content > div {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;} .feedback p {display: block; width: 100%; font-size: 0.9em; font-style: italic; margin-top: 0.6em; order: 0; overflow: hidden; transition: .15s ease-in-out;} .feedback ul {order: 1; font-size: 0.9em; margin-top: 0.7em;} .feedback ul li {padding-left: 1.4em; margin-bottom: 0.2em; box-sizing: border-box; position: relative;} .feedback ul li:first-letter {text-transform: uppercase;} .feedback ul li:before {display: flex; width: 1em; height: 1em; justify-content: center; align-items: center; background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; box-sizing: border-box; position: absolute; left: 0; top: 0.1em; content: "";} .feedback ul.pros li:before {background-image: URL('images/bullet-pros.svg');} .feedback ul.cons li:before {background-image: URL('images/bullet-cons.svg');} .feedback .full-feedback {display: flex; font-size: 0.8em; color: #666666; text-decoration: underline; font-weight: 600; margin-top: 0.5em; cursor: pointer; order: 3; transition: .15s ease-in-out;} .feedback .full-feedback:hover {color: #252525; text-decoration-color: transparent;} .feedback .full-feedback span {display: inline-block;} .feedback .full-feedback span:nth-child(1) {display: none;} .feedback .full-feedback.show span:nth-child(1) {display: inline-block;} .feedback .full-feedback.show span:nth-child(2) {display: none;} @media screen and (min-width: 768px) { .feedback {width: calc(50% - 0.2em);} .feedback ul {width: calc(50% - 0.8em);} } @media screen and (max-width: 768px) { .feedback {width: 100%;} } .feedbacks-slider {display: block; width: 100%; margin-bottom: 5.5em /*Tovys chtel zvetsit mezeru*/;} .feedbacks-slider h2 {margin-bottom: 0.2em;} .feedbacks-slider .wrapper > .stars {width: 8em; order: 0; margin: 0 auto 0.7em;} .feedbacks-slider .wrapper > .stars svg {fill: white; border-color: white;} .feedbacks-slider .swiper-container {display: block; width: 100%; position: relative;} .feedbacks-slider .swiper-slide {-webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .feedbacks-slider .swiper-button-prev, .feedbacks-slider .swiper-button-next {display: block; opacity: 0.25; position: absolute; top: calc(50% - 0.7rem); width: 1.4rem; height: 1.4rem; z-index: 500; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .feedbacks-slider .swiper-button-prev {left: 0.4rem; background: URL('images/arrow-l.svg') no-repeat center center; background-size: auto 100%;} .feedbacks-slider .swiper-button-next {right: 0.4rem; background: URL('images/arrow-r.svg') no-repeat center center; background-size: auto 100%;} .feedbacks-slider .swiper-button-prev:hover, .feedbacks-slider .swiper-button-next:hover {opacity: 1; cursor: pointer;} .feedbacks-slider .last {display: flex; justify-content: center; align-content: center; align-items: center; flex-wrap: wrap; color: #252525; padding: 1.5em 2em; background: #f2f2f2; border-radius: 3px; border: solid 1px rgba(0,0,0,0.06); position: relative; overflow: auto; box-sizing: border-box;} .feedbacks-slider .last img {display: block; width: 8em;} .feedbacks-slider .last p {display: block; width: 100%; text-align: center; font-size: 1.2em; font-weight: 500; color: #252525; margin: 0.6em 0;} .feedbacks-slider .add-feedback {justify-content: center;} @media screen and (min-width: 768px) { .feedback {width: calc(50% - 0.2em);} } @media screen and (max-width: 768px) { .feedbacks-slider {margin: 1em 0 4em; /*Tovys chtel*/} .feedbacks-slider .swiper-slide {width: 100%;} } /*--NEWS---------------------------------------------------------------------------------------------------------------------------------------------------------------*/ .news .left .menu-text {background-image: URL("images/left-panel-kategorie.png");} .news .news-grid {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; padding: 0 1em; box-sizing: border-box;} .news .news-grid article {display: block; width: calc(50% - 0.6em); margin-bottom: 2.5em;} .news .news-grid article .img {display: block; width: 100%; height: auto; overflow: hidden;} .news .news-grid article .img img {display: block; width: 100%; height: auto; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .news .news-grid article .img:hover img {transform: scale(1.05,1.05); filter: brightness(115%);} .news .news-grid article h2 {display: block; width: 100%; font-size: 1.3em; font-weight: 600; margin: 0.5em 0 0.15em; line-height: 1.3em;} .news .news-grid article h2 a {color: black; text-decoration: none;} .news .news-grid article h2 a:hover {text-decoration: underline;} .news .news-grid article p {display: block; width: 100%; font-size: 1em; font-weight: 300; color: #252525;} .news .news-grid article .button {font-size: 0.7em; padding: 0.6em 0.9em; margin-top: 1.2em;} .news.detail .img-main {display: block; width: 100%;} .news.detail .img-main img {width: 100%; margin-bottom: 5px;} @media screen and (min-width: 768px) { .news .news-grid article p {font-size: 0.9em;} } @media screen and (max-width: 768px) { .news .new-grid {justify-content: center;} .news .right article {width: 100%;} } /* .news.detail .right article p {color: black; margin-top: 15px;} */ .pg-contacts form .right {display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;} .pg-contacts form .left .col {display: block; width: 100%; margin-bottom: 1.2em;} .pg-contacts form .left .col:first-child > *:first-child {margin-top: 0;} .pg-contacts form .left ul {margin-bottom: 1.6em;} .pg-contacts form .left ul.opening li span {display: inline-block; width: 4.5em;} .pg-contacts form .left ul.opening li span.small{width: auto; color: #8b8b8b; font-size: 0.8em;} .pg-contacts form .left .fb, .pg-contacts form .left .insta, .pg-contacts form .left .yt {display: block; width: 100%; max-width: 5em;} .pg-contacts form .left .fb img, .pg-contacts form .left .insta img, .pg-contacts form .left .yt img {display: block; width: 100%; border: none; box-shadow: none;} .pg-contacts form .left .m2 {display: none;} .pg-contacts .map {display: block; width: 100%; padding: 1em; box-sizing: border-box;} .pg-contacts .map img {display: block; width: 100%;} .pg-contacts #form {display: flex; width: 100%; justify-content: flex-end; flex-wrap: wrap; background: #fafafa; border: solid 1px #e0e0e0; padding: 2em; box-sizing: border-box;} .pg-contacts #form h2 {display: block; width: 100%; font-size: 1.5em; color: #323232; font-weight: 500; margin-bottom: 0.8em;} .pg-contacts #form .inputs {display: block; width: calc(40% - 4px); margin-right: 8px;} .pg-contacts #form .input {display: block; width: 100%; height: auto; font-size: 1em; margin-bottom: 8px; position: relative;} .pg-contacts #form .input:last-child {margin-bottom: 0;} .pg-contacts #form .input label {display: flex; width: auto; height: 100%; align-items: center; font-size: 1em; color: #575757; font-weight: 600; position: absolute; top: 0; left: 0.9em;} .pg-contacts #form .input input {display: block; width: 100%; height: 3em; color: black; font-size: 1em; padding: 0px 1em 0px 5em; background: white; border: solid 1px #e0e0e0; border-left: solid 2px #b3b3b3; outline: none; box-sizing: border-box; } .pg-contacts #form .inputs2 {display: block; width: calc(60% - 4px); min-height: 100%; box-sizing: border-box;} .pg-contacts #form .inputs2 textarea {display:block; width: 100%; height: 100%; padding: 1em; font-size: 1em; background: white; border: solid 1px #e0e0e0; outline: none; box-sizing: border-box;} .pg-contacts #form button {font-size: 0.9em; margin-top: 0.8em; padding: 0.6em 1.3em;} @media screen and (max-width: 1080px) { .pg-contacts form .left {order: 1; width: 100%; margin-left: 0; background: none; box-sizing: border-box; border: none;} .pg-contacts form .left h2 {font-size: 1.1em; margin-top: 0;} .pg-contacts form .left .m2 {display: block; padding: 0; margin: 1.5em 0;} .pg-contacts form .left .responsive {display: none;} .pg-contacts form .left .panel-shop {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start; padding: 1em;} .pg-contacts form .left .col {display: block; width: 30%; align-self: stretch; min-height: 100%; box-sizing: border-box;} .pg-contacts form .left ul {order: 0; margin-bottom: 0;} .pg-contacts form .left img {order: 1;} .pg-contacts form .left .fb {margin-top: 1em;} .pg-contacts form .right {order: 0; width: 100%;} .pg-contacts form .right .m1 {display: none;} } @media screen and (max-width: 768px) { .pg-contacts form .left .panel-shop {font-size: 1em;} .pg-contacts form .left .col {width: 100%; margin-bottom: 2em;} .pg-contacts #form .inputs {width: 100%; margin-bottom: 8px;} .pg-contacts #form .inputs2 {width: 100%; height: 15em;} } @media screen and (min-width: 440px) and (max-width: 768px){ .pg-contacts form .left .col:nth-of-type(-n+2){width: 50%;} } /* .pg-faq {display: block; width: 100%;} .pg-faq .questions {display: block; width: 100%; padding: 0 0 2em; box-sizing: border-box;} .pg-faq .questions .topic {display: block; width: 100%; margin-bottom: 2em;} .pg-faq .questions .topic:last-child {margin-bottom: 0px;} .pg-faq .questions .topic h2 {display: block; width: 100%; font-size: 1.5em; font-weight: 600; color: #454545; margin-bottom: 0.7em;} .pg-faq .questions .topic .question {display: block; width: 100%; margin-bottom: 0.3em; border-bottom: solid 1px #ebebeb; padding: 0.5em; box-sizing: border-box;-webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .pg-faq .questions .topic .question a {display: block; width: auto; font-size: 1em; font-weight: 500; color: #be8805; line-height: 1.3em; padding-left: 1em; box-sizing: border-box; position: relative; cursor: pointer;} .pg-faq .questions .topic .question a:hover {text-decoration: underline;} .pg-faq .questions .topic .question:hover, .pg-faq .questions .topic .question.sel {background: #fafafa;} .pg-faq .questions .topic .question a:before {display: inline-block; width: 1em; content: "\f105"; font-family: fontawesome; text-align: center; margin-left: -1em;} .pg-faq .questions .topic .question.sel a:before {content: "\f107";} .pg-faq .questions .topic .question p {display: none; width: 100%; font-size: 1em; font-weight: 400; color: #454545; margin: 0.4em 0; line-height: 1.4em; padding-left: 1em; box-sizing: border-box;} .pg-faq .questions .topic .question.sel p {display: block;} */ .summary {display: block; width: 100%;} .summary .items {display: block; width: 100%;} .summary .items h3 {display: block; width: 100%; font-size: 1.5em; color: #555555; margin: 0.3em 0 0.2em;} .summary .items .item {display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 1.5em 0; border-bottom: solid 1px #dadada; box-sizing: border-box;} .summary .items .item:last-child {border: none;} .summary .items .item .img {display: flex; justify-content: center; align-items: center; width: 4em; height: 4em; margin-right: 0; overflow: hidden; box-sizing: border-box;} .summary .items .item .img img {display: block; width: 100%; height: auto; object-fit: contain;} .summary .items .item p.product {display: block; width: calc(100% - 14em); font-size: 1.1em; line-height: 1em; margin-right: 0.7em; text-align: left;} .summary .items .item p.product a {display: block; width: 100%; color: black; font-weight: 600; text-decoration: none;} .summary .items .item p.product span {display: block; font-weight: 500; font-size: 0.9em; color: #9a9a9a; line-height: 1.03em; margin-top: 0.1em;} .summary .items .item p.product .status {/*display: inline-block; - zruseno 12.12.23*/display: none !important; margin-right: 0.2em;} .summary .items .item .status.instock {color: #68920f;} .summary .items .item .status.out-of-stock {color: #c32f16;} .summary .items .item a:hover {text-decoration: underline;} .summary .items .item p {margin: 0; padding: 0; width: auto;} .summary .items .item .quantity {display: block; width: 4em; font-size: 0.9em;} .summary .items .item .price {display: block; width: 7em; text-align: right; font-weight: 600; font-size: 1.2em; color: black;} .summary .items .item .price span {display: block; font-size: 0.6em; line-height: 1.3em; font-weight: 500; color: #7d7d7d;} .summary .items .item .price span:before {display: inline-block; content: "bez dph:"; margin-right: 0.1em;} .summary .items .item .trash {opacity: 0.3; display: block; width: 1em; height: 1em; margin-left: 1em; cursor: pointer; background: URL('images/cross.svg') no-repeat center top; background-size: 100%; border: none; outline: none; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .summary .items .item .trash:hover {opacity: 0.6;} .summary .items.tran-pay {margin-top: 2em;} .summary .items.tran-pay .items h3 {margin-bottom: 0px;} .summary .items.tran-pay .transport {margin-bottom: 2.5em;} .summary .items.tran-pay .item p.product {width: calc(100% - 280px);} .summary .total {display: flex; width: 100%; height: auto; justify-content: space-between; align-items: center; align-content: center; border-top: solid 2px #d7d7d7; margin-top: 2em; padding: 1em 0; box-sizing: border-box;} .summary .total p {display: block; width: auto; height: auto; padding: 0; margin: 0; font-size: 1.5em; font-weight: 600; color: black;} .summary .total .price {text-align: right; margin-left: 0.9em;} .summary .total .price span {display: block; font-size: 0.6em; line-height: 1.2em; font-weight: 500; color: #7d7d7d;} .summary .total .price span:before {display: inline-block; content: "bez dph:"; margin-right: 0.3em;} @media screen and (max-width: 768px) { .summary .items .item {display: block; position: relative; padding-left: 7em;} .summary .items .item .img {width: 6em; height: 6em; margin-right: 0; position: absolute; left: 0; top: 0;} .summary .items .item p.product {width: 100%; margin: 0 0 0.6em;} .summary .items .item .price {width: 100%; margin-top: 0.6em; text-align: left;} .summary .items .item .trash {display: inline-block; opacity: 0.7; width: auto; height: auto; margin-left: 0; background: black; margin-top: 0.8em; padding: 0.3em 0.4em; box-sizing: border-box;} .summary .items .item .trash:after {display: inline-block; content: "SMAZAT"; color: white; font-size: 0.7em; font-weight: bold;} .summary .items .item .trash:hover {opacity: 1;} .summary .items.tran-pay .item p.product {width: 100%;} } @media screen and (max-width: 540px) { .summary .items.tran-pay .item .img {height: auto; justify-content: flex-start;} .summary .items.tran-pay .item .img img {width: 100%; height: auto;} .summary .items.tran-pay .items .item p.product {width: 100%;} .summary .items.tran-pay .items .item p.price {width: 100%; margin-right: 0;} } .summary.s2 .items .item p.product {width: calc(100% - 17em);} .summary.s2 .tran-pay .price {margin-right: 0px;} @media screen and (max-width: 768px) { .summary.s2 .items .item p.product {width: 100%;} .summary.s2 .tran-pay {margin-top: 1.2em;} .summary.s2 .tran-pay {padding-top: 1em;} .summary.s2 .tran-pay .transport {margin-bottom: 2em;} .summary.s2 .tran-pay .item p.product {width: 100%;} } @media screen and (max-width: 540px) { .summary.s2 .tran-pay .transport {margin-bottom: 1.7em;} .summary.s2 .tran-pay .item .img {width: 6em; height: auto; justify-content: flex-start;} .summary.s2 .tran-pay .item .img img {width: 100%; height: auto;} .summary.s2 .tran-pay .items .item p.product {width: 100%;} .summary.s2 .tran-pay .items .item p.price {width: 100%; margin-right: 0;} } .cart .input1, .cart select, .cart .chkselect {background: #f2f2f2;} /* .cart .cart-top {display: block; width: 100%; background: URL('images/product-gradient.png') no-repeat center bottom; background-size: 100%; border-bottom: solid 1px #ebebeb;} .cart .box {background: #fafafa; border: solid 1px #ebebeb; padding: 1rem 2rem; box-sizing: border-box; border-top: solid 2px #d7d7d7;} */ .cart .cart-nav {display: flex; width: 100%; flex-wrap: wrap;} .cart .cart-nav a {display: block; cursor: default !important; padding: 0.7em 0.6em; font-size: 1em; line-height: 1em; color: #959595; font-weight: 400; border-right: solid 1px #ebebeb; box-sizing: border-box; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .cart .cart-nav a:last-child {margin-right: 0; border: none;} .cart .cart-nav a.active {color: #f9cf6b; font-weight: 500;} .cart .cart-nav a br {display: none;} .cart .buttons {display: flex; width: 100%; justify-content: space-between; align-items: center; margin: 1.5em 0 2em;} .cart .buttons .button:first-child:after {display: none;} .cart .buttons .button:first-child:before {display: inline-block; margin-right: 0.4em; content: " \f104 \f104"; font-family: fontawesome; font-size: 1em;} .cart.step1 .buttons .button:first-child:before {display: none;} .cart .buttons .button:last-child:after {display: inline-block; margin-left: 0.4em; content: " \f105 \f105"; font-family: fontawesome; font-size: 1em;} .cart .buttons .bt_zpet {font-size: 1em; text-decoration: underline; color:Black;} @media screen and (max-width: 540px) { .cart .cart-nav a {width: 25%; text-align: center; line-height: 1.3em;} .cart .cart-nav a br {display: block;} .cart .cart-nav a span {display: none;} } .cart .summary.s2 .items .item .quantity {display: flex; width: 78px; height: 30px; justify-content: space-between; align-items: center; margin-right: 25px; } .cart .summary.s2 .items .item .quantity input {display: block; width: 48px; height: 100%; font-size: 14px; outline: none; box-sizing: border-box; text-align: right; padding: 0 6px; font-weight: 800; border: solid 1px #d4d4d4;} .cart .summary.s2 .items .item .quantity span {opacity: 0.7; display: flex; width: 15px; height: 100%; justify-content: center; align-items: center; background: #1.03a1a; color: white; font-size: 16px; font-weight: bold; cursor: pointer;} .cart .summary.s2 .items .item .quantity span:first-of-type {border-radius: 4px 0 0 4px;} .cart .summary.s2 .items .item .quantity span:last-of-type {border-radius: 0 4px 4px 0;} .cart .summary.s2 .items .item .quantity span:hover {opacity: 1;} .cart .summary.s2 .tran-pay .item .radio {display: block; width: 20px; height: 20px; margin: 10px 0 0;} .cart .account {display: flex; width: 100%; height: auto; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; padding: 0.9rem; box-sizing: border-box; } .cart .account .left, .cart .account .right {display: block; width: calc(50% - 15px); height: auto;} .cart .account .label1 {font-size: 18px; margin: 15px 0 3px; color: #656565;} .cart .account #cart-reg {font-size: 16px;} .cart .account .input1 {width: 100%;} .cart .account a.ref {display: block; color: #7b7b7b; font-size: 14px; margin: 5px 0 0;} .cart .account a.ref:hover {color: #4d4d4d; text-decoration: underline;} .cart .account .box .button {width: 100%; padding: 10px 0; margin: 25px 0 0;} .cart .account .right #password.hidden {display: none;} @media screen and (max-width: 1080px) { .cart .account .left, .cart .account .right {width: calc(50% - 5px);} .cart .account .box .button {font-size: 16px; padding: 9px 0; margin: 20px 0 0;} } @media screen and (max-width: 768px) { .cart .account {padding-top: 20px;} .cart .account .left, .cart .account .right {width: 100%;} .cart .account .right {margin-top: 40px;} .cart .box {padding: 1.4rem 3.4rem;} .cart .account .box .button {font-size: 15px; padding: 8px 0;} } @media screen and (max-width: 540px) { .cart .account .left, .cart .account .right {width: 100%;} .cart .account .right {margin-top: 30px;} .cart .box {padding: 30px 2rem;} } .cart .final .input {display: flex; width: 100%; justify-content: flex-end;} .cart .final .input #chk-terms {width: auto; height: 1em; font-size: 1em; margin: 1.5em 0 0;} .cart.complete .text {display: block; width: 100%; box-sizing: border-box;} .cart.complete .text p {display: block; width: 100%; font-size: 1em; margin-bottom: 1.5em;} .cart.complete .text ul {display: block; width: auto; font-size: 1em; height: auto; margin-bottom: 1.5em;} .cart.complete .text ul li {display: block; height: auto; line-height: 1.2em;} .cart.complete .text ul li:before {display: none;} .cart.complete .text ul li:first-child {font-weight: bold;} /* .profile .right h2 {display: block; width: 100%; font-size: 28px; padding: 0 0.9rem; box-sizing: border-box; margin: 40px 0 10px;} .profile .inputs h2 {padding: 0; margin-top: 10px;} .profile .inputs {display: flex; width: 100%; max-width: 640px; height: auto; flex-wrap: wrap; padding: 0 0.9rem; margin-bottom: 45px; box-sizing: border-box;} .profile .inputs p {display: block; width: 100%; font-size: 17px; color: #747474; line-height: 1.03em;} .profile .inputs .input {display: block; width: 280px; max-width: calc(50% - 14px); margin-right: 14px;} .profile .inputs .input label {font-size: 17px; text-transform: uppercase; margin: 12px 0 4px;} .profile .inputs .input input {width: 100%; height: 40px; background: #f2f2f2; font-size: 16px;} .profile .buttons {display: flex; width: 100%; margin-top: 30px; padding: 0 0.9rem 0.9rem; box-sizing: border-box;} @media screen and (max-width: 960px) { .profile .right h2 {font-size: 25px;} .profile .inputs p {font-size: 16px;} .profile .inputs .input label {font-size: 16px; margin: 12px 0 4px;} .profile .inputs .input input {height: 38px; font-size: 15px;} } @media screen and (max-width: 540px) { .profile .right h2 {font-size: 22px;} .profile .inputs p {font-size: 15px;} .profile .inputs .input {width: 100%; max-width: 300px; margin-right: 0px;} } */ .profile .orders {display: block; width: 100%; margin-bottom: 1em; box-sizing: border-box;} .profile .orders .order {display: flex; width: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; font-size: 1em; padding: 0.85em 0; border-top: solid 1px #dfdfdf; box-sizing: border-box;} .profile .orders .order:last-child {border-bottom: solid 1px #dfdfdf;} .profile .orders .order h3 {display: block; width: 4em;} .profile .orders .order h3 a {color: #be8805; text-decoration: underline;} .profile .orders .order h3 a:hover {text-decoration: none;} .profile .orders .order .date {display: block; width: 4em;} .profile .orders .order .price {display: block; width: calc(100% - 11em); text-align: right;} .compare .porovnaniMobileInfo { display:none; margin-bottom:20px; } .compare .table-box {display: block; width: calc(100% - 1.8rem); max-width: calc(100% - 1.8rem); position: relative; box-sizing: border-box; } .compare .inner {display: block; width: 100%; overflow-x: auto; border-left: solid 16rem #f7f7f7; box-sizing: border-box;} .compare table {max-width: 100%; width: auto; font-size: 0.9em;} .compare table th, .compare table td {min-width: 16rem; line-height: 1.2em; text-align: center; box-sizing: border-box; position: relative;} .compare table th:first-child, .compare table td:first-child {min-width: 16rem; width: 16rem; letter-spacing: -0.02em; font-weight: 600; color: #6e6e6e; text-align: left; position: absolute; left: 0;} .compare table th:first-child {text-align: center; padding: 1.5em 2em;} .compare table th:first-child a {opacity: 0.7; display: block; font-size: 0.9em; color: #676767; padding: 1.3em 0; margin-bottom: 1em; border-bottom: solid 1px #cacaca;} .compare table th:first-child a:hover {opacity: 1; text-decoration: underline;} .compare table th:first-child a.zoom {background: URL('images/icon-search.png') no-repeat center top; background-size: 0.9em;} .compare table th:first-child a.delete {background: URL('images/cross.png') no-repeat center top 3px; background-size: 0.9em;} .compare table thead tr th {vertical-align: top; text-align: center; padding: 1.5em 0.7em 7em; position: relative;} .compare table thead tr th .img {display: inline-block; margin-bottom: 0.7em;} .compare table thead tr th .img img {display: block; width: auto; height: 8em;} .compare table thead tr th h2 {display: flex; width: 100%; justify-content: center; margin-bottom: 0.7em;} .compare table thead tr th h2 a {display: inline-block; font-size: 1em; font-weight: 600; line-height: 1.3em; color: black;} .compare table thead tr th h2 a:hover {text-decoration: underline;} .compare table thead tr th .price {display: block; width: 100%; height: 1em; text-align: center; font-size: 1em; color: #be8805; position: absolute; left: 0; bottom: 6.8em; font-weight: 600;} .compare table thead tr th .price2 {display: block; width: 100%; height: 1.2em; text-align: center; font-size: 0.8em; color: #be8805; position: absolute; left: 0; bottom: 7em;} .compare table thead tr th .price2:after {content: " bez dph";} .compare table thead tr th .buttons {display: flex; width: 100%; justify-content: center; flex-wrap: wrap; position: absolute; bottom: 1em; left: 0;} .compare table thead tr th .buttons a {width: 51%; display:block; align-items: flex-start; text-rendering: auto; letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent: 0px; text-shadow: none; margin: 0em; font: 400 13.3333px Arial;} .compare table thead tr th .buttons a.grey {padding: 0.7em 0.5em; margin-bottom: 0.6em;} .compare table thead tr th .buttons a.remove {display: block; background: none; font-size: 0.8em; text-align: center; text-decoration: underline; color: #888888; cursor: pointer; outline: none; border: none;} .compare table thead tr th .buttons a.remove:hover {text-decoration: none;} .compare table tbody tr td {font-size: 0.9em; padding: 0.7em; border-top: solid 1px #cccccc; vertical-align: top; box-sizing: border-box;} .compare table tbody tr:nth-of-type(odd) td {background: #fafafa;} .compare table tbody tr:nth-of-type(odd) td:first-child {background: none;} @media screen and (max-width: 1080px) { .compare .porovnaniMobileInfo { display:block; } } @media screen and (max-width: 640px) { .compare .inner {border-left: none; padding-bottom: 0;} .compare table {padding-top: 5em;} .compare table th:first-child, .compare table td:first-child {min-width: 100%; width: 100%; background: #f7f7f7; padding-top: 12px;} .compare table th:first-child {display: flex; flex-wrap: wrap; padding: 20px 0; margin-top: -80px; border-top: solid 1px #d0d0d0;} .compare table th:first-child a {margin-right: 30px; padding: 5px 0 5px 24px; margin-bottom: 5px; border-bottom: none;} .compare table th:first-child a.zoom, .compare table th:first-child a.delete {background-position: left center; background-size: 16px;} .compare table tbody tr td {padding-top: 56px;} .compare table tr:first-child th:first-child {background: none;} } /* CROSSSELL */ .popup {display: flex; width: 100%; height: 100%; justify-content: center; align-items: flex-start; background: rgba(250, 250, 250, 0.85); box-sizing: border-box; position: fixed; top: 0; left: 0; z-index: 10000; overflow: auto;} .popup .window {display: block; width: calc(100% - 3em); max-width: 30em; height: auto; background: white; padding: 3.2em 1em 8em; margin: 2em 0; position: relative; box-sizing: border-box; box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);} .popup .window .cross {display: block; width: 1em; height: 1em; background: URL('images/cross.png') no-repeat center center; background-size: 100%; opacity: 0.2; position: absolute; top: 1em; right: 1em;} .popup .window .cross:hover {opacity: 0.4;} .popup .window .title {display: block; width: 100%; font-size: 1.6em; color: #565656; font-weight: 600; text-align: center; margin-bottom: 1em; padding: 0 1em; box-sizing: border-box;} .popup .window .note {display: block; width: 100%; font-size: 0.9em; line-height: 1.1em; color: #565656; text-align: center; margin: -2.2em 0 2.5em;} .popup .window .buttons {display: flex; width: 100%; height: auto; justify-content: center; padding: 0 2.5em 2em; box-sizing: border-box; flex-wrap: wrap; position: absolute; bottom: 0; left: 0;} .popup .window .buttons.two {justify-content: space-between;} .popup .window .buttons.two .button:first-child:after {display: none;} .popup .window .form {display: block; width: 100%; max-width: 20em; margin: 0 auto;} .popup .window .form label {display: block; width: 100%; font-size: 0.9em; font-weight: bold; margin: 1em 0 0.5em;} .popup .window .form textarea {display: block; width: 100%; height: 9em; padding: 1em; background: rgba(0,0,0,0.05); color: black; font-size: 0.9em; border: solid 1px rgba(0,0,0,0.05); box-sizing: border-box;} .popup .window .form p {display: block; width: 100%; font-size: 0.9em; line-height: 1.1em; color: #565656; margin: 0 0 0.5em;} .popup .window .form input[type="text"] {display: block; width: 100%; padding: 1em; background: rgba(0,0,0,0.05); color: black; font-size: 0.9em; border: solid 1px rgba(0,0,0,0.05); box-sizing: border-box;} .popup .crosssell .swiper-container {display: flex; width: 100%; height: auto; padding: 0 1.3em; overflow: hidden; box-sizing: border-box;} .popup .crosssell .swiper-container .product {display: block; width: 33.33%; padding: 0 1em; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;} .popup .crosssell .product .img {padding: 0 1em;} .popup .crosssell .product h3 {margin-bottom: 0.3em;} .popup .crosssell .product h3 a {font-size: 1.1em;} .popup .crosssell .product p {font-size: 0.8em;} .popup .crosssell .product .button {width: 5em; font-size: 0.7em; padding: 0.2em 0; margin: 0px calc(50% - 2.5em);} .popup .crosssell .swiper-button-prev, .popup .crosssell .swiper-button-next {display: block; position: absolute; top: calc(50% - 0.5em); width: 1em; height: 1em; z-index: 500; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .popup .crosssell .swiper-button-prev {left: 0;} .popup .crosssell .swiper-button-next {right: 0;} .popup .formbox {display: flex; max-width: 300px; width: 100%; align-items: flex-start; flex-wrap: wrap; margin: -20px auto;} .popup .formbox .line1 {width: 100%; margin: 25px 0 31px;} .popup .formbox .row {display: flex; width: 100%; flex-wrap: wrap;} .popup .formbox .label1 {margin: 0px 0 5px;} .popup .formbox .input1, .popup .formbox select {max-width: 300px; width: 100%; margin-bottom: 10px; font-size: 16px; font-weight: 400; background-color: #f7f7f7;} .popup .formbox select {width: auto; margin-right: 6px;} .popup .formbox .input-link {display: inline-block; font-size: 14px; font-weight: 500; color: #6d6d6d;} .popup .formbox .input-link:hover {text-decoration: underline;} @media screen and (max-width: 680px) { .popup .crosssell .swiper-container .product {width: 50%;} .popup .crosssell .product .button {margin-top: 1em;} .popup .window .buttons {padding: 0 1.5em 1.5em;} } @media screen and (max-width: 540px) { .popup .crosssell .swiper-container .product {width: 100%;} .popup .crosssell .product .img {padding: 0;} .popup .crosssell .product .img img {width: 150px; margin: 0 auto;} } #cph_obsah_pn_zpravy {padding-top: 2em; font-size: 1.5em; text-align: center;} .formular {display: flex; width: 100%; align-items: flex-start; flex-wrap: wrap; padding: 1.5em 0px; margin: 2em auto;} .formular > div {width:100%;} .formular h1 {display: block; font-size: 1.3em; text-align: center; padding: 0 0 0.8em;} .formular h2 {display:block; text-align: center; font-size: 1.3em; font-weight: 600; padding: 1em 0 0.6em;} .formular .buttons {display: flex; width: 100%; height: auto; justify-content: center; padding: 0 2em 2em; box-sizing: border-box; flex-wrap: wrap; position: absolute; bottom: 0; left: 0;} .formular .buttons.two {justify-content: space-between;} .formular .buttons.two .button:first-child:after {display: none;} .formular a {font-size: 0.9em; text-decoration: underline; color:Black;} .formular .pn_nastaveniMenu a {font-size: 1.2em; margin: 0 0.4em; text-decoration: none;} .formular .pn_nastaveniMenu a i {padding: 0px 5px 0px 0px; } .formular input[type="button"], .formular button {display: inline-block; margin-top: 0.25em; width: 6em; text-align:center; color: white; padding: 0.5em 0; cursor:pointer; background: rgba(33,33,33,1); border: solid 1px rgba(33,33,33,1);} .formular input[type="button"]:hover, .formular button:hover {background-color: #ffffff; color: #000000;} .formular .line1 {width: 100%; margin: 1.3em 0 1.6em;} .formular .row {display: flex; width: 100%; flex-wrap: wrap;} .formular .label1 {margin: 0px 0 5px;} /*.formular input[type="text"], .formular input[type="password"], .formular select { display: block; width: 160px; height: 46px; background: white; border: solid 1px #e0e0e0; padding: 0 16px; font-size: 20px; font-weight: bold; box-sizing: border-box; outline: none; max-width: 300px; width: 100%; margin-bottom: 10px; font-size: 16px; font-weight: 400; background-color: #f7f7f7;} */ .formular select {width: 100%; max-width: 300px; margin-right: 6px;} .formular .input-link {display: inline-block; font-size: 0.75em; font-weight: 500; color: #6d6d6d;} .formular .input-link:hover {text-decoration: underline;} .formular .pn_udaj span {display: block; font-size: 0.9em; padding-bottom: 0.2em;} .formular label {font-size: 1em;} /* .pg-article2 {display: block; width: 100%;} .pg-article2 .wrapper {width: 100% !important; padding: 0 1em 2.5em; margin: 0; box-sizing: border-box;} .pg-article2 article h2 {display: block; width: 100%; font-size: 2em; font-weight: 300; color: black; margin: 1em 0 0;} .pg-article2 article h2:first-of-type {margin-top: 0;} .pg-article2 article h3 {display: block; width: 100%; font-size: 1.6em; font-weight: 400; color: #454545; margin: 0.6em 0 0;} .pg-article2 article p {display: block; width: 100%; font-size: 1em; font-weight: 300; color: #454545; margin: 0.3em 0 0.7em; text-align: justify; line-height: 1.4em;} */ /* SORTIMENT */ .sortiment {display: block; width: 100%; height: auto;} .sortiment .brand-select {display: block; width: 100%; height: auto; box-sizing: border-box;} .sortiment .swiper-container {display: block; width: 100%; height: auto; position: relative; box-sizing: border-box; margin: 0 auto;} .sortiment .swiper-container .swiper-wrapper {padding: 0.3em 0; box-sizing: border-box;} .sortiment .swiper-slide {display: block; height: 5em; opacity: 0.65; margin: 0.3em 0; padding: 0 0.3em; box-sizing: border-box; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .sortiment .swiper-slide span {display: flex; width: 100%; height: 4.5em; justify-content: center; align-items: center; background: white; border-top: solid 3px transparent; border-bottom: solid 3px transparent; overflow: hidden; -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);} .sortiment .swiper-slide span img {display: block; width: 6em; max-width: 80%; height: auto;} .sortiment .swiper-slide.sel, .sortiment .swiper-slide:hover {opacity: 1; cursor: pointer;} .sortiment .swiper-slide.sel span {opacity: 1; border-top: solid 3px #f9c19b;} .sortiment .swiper-button-prev, .sortiment .swiper-button-next {display: none; position: absolute; top: 0; width: 2em; height: 100%; z-index: 500; background: #f2f2f2; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .sortiment .swiper-button-prev {left: 0;} .sortiment .swiper-button-next {right: 0;} .sortiment .swiper-button-prev span, .sortiment .swiper-button-next span {display: block; width: 100%; height: 100%; opacity: 0.3;} .sortiment .swiper-button-prev span {background: URL('images/arrow-l.svg') no-repeat center center; background-size: auto 1.2em;} .sortiment .swiper-button-next span {background: URL('images/arrow-r.svg') no-repeat center center; background-size: auto 1.2em;} .sortiment .swiper-button-prev:hover, .sortiment .swiper-button-next:hover {cursor: pointer;} .sortiment .swiper-button-prev:hover span, .sortiment .swiper-button-next:hover span {opacity: 0.75;} .sortiment .brand-select.show .swiper-container .swiper-wrapper {width: 100% !important; flex-wrap: wrap; position: relative !important; left: 0 !important; transform: none !important;} .sortiment .brand-select.show .swiper-button-prev, .sortiment .brand-select.show .swiper-button-next {display: none;} .sortiment .brand-select .button {display: flex; width: 100%; justify-content: center;} .sortiment .brand-select .button a {display: block; font-size: 0.8em; color: #898989;} .sortiment .brand-select .button a span:nth-child(2) {display: none;} .sortiment .brand-select.show .button a span:nth-child(1) {display: none;;} .sortiment .brand-select.show .button a span:nth-child(2) {display: block;} .sortiment .brand-select .button a:hover {color: #676767; text-decoration: underline;} .sortiment .plan {display: block; width: 100%; height: auto; padding: 1em 0; box-sizing: border-box;} .sortiment .plan .img {display: block; width: 100%; max-width: 1200px; height: auto; position: relative; margin: 0 auto;} .sortiment .plan img {display: block; width: 100%; } .sortiment .plan .sections {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1;} .sortiment .plan .sections img {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;} .sortiment .plan img.sel {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 3;} .sortiment .brand {display: flex; width: 100%; max-width: 1080px; justify-content: space-between; align-items: center; flex-wrap: wrap; margin: 0 auto calc(2rem + 30px); padding: 0 1em; box-sizing: border-box;} .sortiment .brand .about {display: block; width: 40%; text-align: justify; order: 1;} .sortiment .brand .about h2 {display: block; font-size: 2em; font-weight: 400; margin-bottom: 0;} .sortiment .brand .about p {display: block; font-size: 1em;} .sortiment .brand .product {display: block; width: 20%; height: auto; flex-wrap: wrap; position: relative;} .sortiment .brand .product.p1 {order: 0;} .sortiment .brand .product.p2 {order: 2;} .sortiment .brand .product .img {display: block; width: 100%; height: auto; padding: 0px 0.9em 0.6em; margin-bottom: 0.8em; border-radius: 3px; box-sizing: border-box; overflow: hidden; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .sortiment .brand .product .img img {display: block; width: 100%; height: 100%;} .sortiment .brand .product:hover .img {-ms-transform: scale(1.05,1.05); -webkit-transform: scale(1.05,1.05); transform: scale(1.05,1.05);} .sortiment .brand .product h3 {display: flex; width: 100%; justify-content: center;} .sortiment .brand .product h3 a {display: inline-block; width: auto; height: auto; font-size: 1.3em; line-height: 1em; font-weight: medium; text-align: center; color: #191919; box-sizing: border-box;} .sortiment .brand .product h3 a:hover {text-decoration: underline;} .sortiment .brand .product p {display: block; width: 100%; height: auto; font-size: 0.9em; color: #9a9a9a; margin-top: 0.2em; text-align: center; box-sizing: border-box;} .sortiment .brand .product .button {width: 90px; margin: 16px calc(50% - 45px) 0px; font-size: 15px; padding: 5px 0;} .sortiment .brand .collection {display: block; width: 100%; margin-top: calc(2rem + 25px); order: 3;} .sortiment .brand .collection img {display: block; width: 100%; height: auto;} @media screen and (min-width: 1400px) { .sortiment .swiper-container .swiper-slide {width: calc(100% / 5);} } @media screen and (max-width: 1400px) { .sortiment .swiper-container .swiper-slide {width: calc(100% / 4);} } @media screen and (max-width: 768px) { .sortiment .swiper-container .swiper-slide {width: calc(100% / 3);} } @media screen and (max-width: 540px) { .sortiment .swiper-container .swiper-slide {width: calc(100% / 2);} } @media screen and (max-width: 1080px) { .sortiment .brand .about {width: 45%;} } @media screen and (max-width: 768px) { .sortiment .brand {justify-content: space-around;} .sortiment .brand .about {width: 100%; order: 0; margin-bottom: 2.5em;} .sortiment .brand .product {width: calc(50% - 2em); max-width: 11em; margin: 0 0.9em;} .sortiment .brand .product.p1 {order: 1;} } @media screen and (max-width: 540px) { .sortiment .brand .product {width: calc(100% - 10em); margin-top: 2.5em;} } /*--PG-BEST --*/ .best {display: flex; width: 100%; flex-wrap: wrap;} .best a {display: flex; min-height: 100%; justify-content: space-between; align-items: center; flex-wrap: wrap; color: black; padding: 2em; background: URL("images/bg-bests.png") no-repeat center center; background-size: 100% 100%; border-radius: 3px; overflow: hidden; box-sizing: border-box; position: relative;} .best a:after {display: block; width: 100%; height: 100%; background: white; opacity: 0; position: absolute; left: 0; top: 0; content: ""; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .best a img {display: block; width: 6em; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .best a span {display: block; width: calc(100% - 7.5em); text-align: left; font-size: 1em; text-decoration: underline; text-decoration-color: transparent; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .best a:hover:after {opacity: 0.2;} .best a:hover img {transform: scale(1.05,1.05);} .best a:hover span {text-decoration-color: black;} @media screen and (min-width: 1400px) { .best a {width: calc(33.33% - 0.2em); margin: 0.3em 0.3em 0 0;} .best a:nth-child(-n+3) {margin-top: 0;} .best a:nth-child(3n+3) {margin-right: 0;} } @media screen and (min-width: 440px) and (max-width: 1400px){ .best a {width: calc(50% - 0.2em); margin: 0.4em 0.4em 0 0;} .best a:nth-child(-n+2) {margin-top: 0;} .best a:nth-child(even) {margin-right: 0;} } @media screen and (max-width: 768px) { .best a {justify-content: center;} .best a img {width: auto; height: 10em; margin-bottom: 1.5em;} .best a span {width: 100%; text-align: center;} } @media screen and (max-width: 440px) { .best a {width: 100%; margin-top: 0.4em;} .best a:nth-child(1) {margin-top: 0;} } .avatar {display: flex; align-items: center; align-content: center; background: rgba(250,250,250,0.9); border-radius: 3px; padding: 0.3em 0.6em; position: fixed; left: 1.5em; bottom: 1.5em; z-index: 500; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out; cursor: pointer;} .avatar .img {display: block; width: 2.5em; height: 2.5em; margin-right: 0.5em; background: URL('images/ppp/tovys.png') no-repeat center bottom, URL('images/ppp/ppp.jpg') repeat-x center center; background-size: auto 90%, auto 100%; border-radius: 2px;} .avatar p {display: block; color: black; font-size: 0.9em; line-height: 1.3em; font-weight: 600;} .avatar span {display: block; font-size: 0.8em; line-height: 1.3em;} .avatar:hover {background: #ffd7a4; transform: scale(0.95,0.95);} .avatar.hover {background: #ffd7a4; transform: scale(0.95,0.95);} .ppp {display: block; opacity: 0; width: 100%; height: 100%; position: fixed; top: 0; left: -9999px; z-index: 10005; overflow: auto; -webkit-transition: opacity .45s ease-in-out; transition: opacity .45s ease-in-out;} .ppp.show {left: 0; opacity: 1;} .ppp .mask {display: flex; width: 100%; min-height: 100%; justify-content: center; align-items: center; background: rgba(255,215,164,0.9); padding: 1.2em; box-sizing: border-box; position: relative;} .ppp .mask .wndw {display: flex; width: 100%; max-width: 1080px; align-items: center; flex-wrap: wrap; padding: 3.5em 5%; background: white; border-radius: 3px; position: relative; box-sizing: border-box;} .ppp .mask .wndw .cross {display: block; width: 1em; height: 1em; opacity: 0.5; position: absolute; right: 1em; top: 1em; z-index: 10005; cursor: pointer; -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out;} .ppp .mask .wndw .cross:hover {opacity: 1;} .ppp.p1 .mask .wndw {background: URL('images/ppp/ppp.jpg') repeat-x center center; background-size: auto 100%;} .ppp.p1 .mask .wndw .left {display: block; max-width: 30em; position: relative; z-index: 2;} .ppp.p1 .mask .wndw .left h2 {display: block; font-size: 1.35em; font-weight: 600; color: white; margin-bottom: 0.8em;} .ppp.p1 .mask .wndw .left p {display: block; font-size: 0.8em; font-weight: 600; color: white; margin-bottom: 0.5em;} .ppp.p1 .mask .wndw .left p a {color: #ffd7a4;} .ppp.p1 .mask .wndw .left p.large {font-size: 1.1em;} .ppp.p1 .mask .wndw .left .close {display: block; margin: 0.5em 0 0;} .ppp.p1 .mask .wndw .left .close span {display: inline-block; font-size: 0.9em; font-weight: 600; color: #c19583; text-decoration: underline; cursor: pointer;} .ppp.p1 .mask .wndw .left .close span:hover {text-decoration: none;} .ppp.p1 .mask .wndw .tovys {display: block; width: auto; height: 90%;position: absolute; right: 5%; bottom: 0;} .ppp.p1 .mask .wndw .podpis {display: block; width: auto; height: 5em; position: absolute; right: 45%; bottom: 18%;} .ppp.p1 .mask .wndw .input {display: block; width: 100%; max-width: 20em; height: auto; margin-bottom: 1em; position: relative;} .ppp.p1 .mask .wndw .input input {display: block; width: 100%; height: 3em; color: white; font-size: 0.9em; font-weight: 600; padding: 0px 5em 0 1em; background: rgba(0,0,0,0.6); border: none; border-bottom: solid 1px rgba(255,255,255,0.2); outline: none; box-sizing: border-box; } .ppp.p1 .mask .wndw .input input::placeholder {color: #9c6651; opacity: 1;} .ppp.p1 .mask .wndw .input input:-ms-input-placeholder{color: #9c6651;} .ppp.p1 .mask .wndw .input input::-ms-input-placeholder{color: #9c6651;} .ppp.p1 .mask .wndw .input .button {display: flex; width: 2em; height: 2em; justify-content: center; align-items: center; margin: 0; padding: 0; position: absolute; right: 0.25em; top: 0.25em;} .ppp.p1 .mask .wndw .input .button:after {margin-left: 0;} .ppp.p2 .mask .wndw {padding: 0; width: auto;} .ppp.p2 .img {display: block; width: 100%; max-width: 900px; margin: 0 auto;} .ppp.p3 .mask .wndw {justify-content: center;} .ppp.p3 p {display: block; width: 100%; text-align: center; font-size: 17px; margin-bottom: 10px; font-weight: bold;} .ppp.p3 a {display: inline-block; text-align: center; font-size: 22px; color: #1c3261; font-weight: bold; text-decoration: underline;} .ppp.p3 a:hover {text-decoration: none;} @media screen and (max-width: 960px) { .ppp.p1 .mask .wndw .tovys {max-height: 20em;} .ppp.p1 .mask .wndw .podpis {right: 38%;} } @media screen and (max-width: 768px) { .ppp.p1 .mask .wndw {padding: 3em 5% 0;} .ppp.p1 .mask .wndw .left {max-width: 100%; width: 100%;} .ppp.p1 .mask .wndw .left h2 {width: 100%; text-align: center;} .ppp.p1 .mask .wndw .left p {text-align: center;} .ppp.p1 .mask .wndw .tovys {width: 100%; max-width: 20em; height: auto; right: auto; position: relative; left: -1em; margin: 2em auto 0;} .ppp.p1 .mask .wndw .podpis {display: none;} .ppp.p1 .mask .wndw .input {max-width: 20em; margin-left: auto; margin-right: auto;} } .watches-service {display: block; width: 100%; padding: 2.5em 1.5em; margin-bottom: 3em; background: URL("images/watches-service-img.png") no-repeat left center, URL("images/watches-service-bg.jpg") no-repeat center center; background-size: auto 100%, 100% 100%; position: relative;} .watches-service .wrapper {justify-content: flex-end;} .watches-service .wrapper .info {display: block; width: 50%; max-width: 32em; position: relative; z-index: 2; text-shadow: 0 0 0.2em rgba(0,0,0,0.4), 0 0 0.4em rgba(0,0,0,0.6), 0 0 0.6em rgba(0,0,0,0.7);} .watches-service .wrapper .info h2 {display: block; color: white; font-size: 1.8em; margin-bottom: 0.3em; font-weight: bold;} .watches-service .wrapper .info p {display: block; color: #ffd7a4; margin-bottom: 1em; font-size: 0.9em; font-weight: bold;} .watches-service .wrapper .info p:last-of-type {font-size: 1.2em;} .watches-service .wrapper .info ul {display: block; width: 100%; margin-bottom: 1em;} .watches-service .wrapper .info ul li {display: block; width: 100%; font-size: 0.9em; color: white; padding-left: 1.5em; margin-bottom: 0.23em; box-sizing: border-box; position: relative;} .watches-service .wrapper .info ul li:before {display: block; width: 1.1em; height: 1.1em; background: URL("images/watches-service-bullet.png") no-repeat center center; background-size: 100% 100%; position: absolute; left: 0; top: 0; content: "";} .watches-service .wrapper .info ul li:last-of-type:before {display: none;} @media screen and (max-width: 1080px) { .watches-service {background-position: center center;} .watches-service:after {display: block; width: 100%; height: 100%; background: black; opacity: 0.6; position: absolute; left: 0; top: 0; z-index: 1; content: "";} .watches-service .wrapper {justify-content: center;} .watches-service .wrapper .info {width: 100%;} .watches-service .wrapper .info h2, .watches-service .wrapper .info p {text-align: center;} .watches-service .wrapper .info ul {display: flex; justify-content: center; flex-wrap: wrap;} .watches-service .wrapper .info ul li {width: auto; margin: 0.3em;} } .pn_infoPanel.zlute { display:none; background-color:#f9cf6b; font-size:25px; text-align:center; padding:10px 0px 10px 0px; } .ruzneDoruceni { display:none; font-size:20px; border:1px solid black; padding:20px; background-color:#f9cf6b; } .pn_produkty_nicNenalezeno { font-size:20px; margin:80px 0px 80px 0px; border:0px solid black; text-align:center; display:block; width:100%; } .mceContentBody { padding-top:20px; } #bt_b_f { position:absolute; top:480px; left:20px; width: 150px; height:40px; z-index:9999; } @media screen and (max-width: 1800px) { #bt_b_f { top:455px; } } @media screen and (max-width: 1600px) { #bt_b_f { top:430px; } } @media screen and (min-width: 2000px) { #bt_b_f { top: 530px; } } .naseCena.s1 .p1 { color: #d3313c !important; } .naseCena.s1 span { font-weight:600; color: #d3313c !important; } .product.naseCena .price { color: #d3313c !important; } .product.naseCena .price::before { display:block; font-size:0.8em; content:'Výhodná cena:'; color: #d3313c !important; } .categories .vyprodej { color: #d3313c !important; } .tiny-nav h1 { display:inline-block; } .right .info-text .pnBox ul { list-style:none; padding-left:1.25em; margin:0; } .right .info-text .pnBox ul li::before { content: ""; display: inline-block; width: .5em; height: .5em; margin-left: -.75em; margin-right: .5em; background: #000; border-radius: 50%; }