/*--- definice telo+scroll ---*/ BODY { text-align: center; padding-left: 0px; padding-right: 0px; font-family: 'Rubik', sans-serif; background-color: #f5f5f5; overflow-x: hidden; max-width: 100%; position: relative; } html { scroll-padding-top: 120px; } h2, h3, h4, h5, h6, ul, ul li, p{ position: relative; z-index: 1; color: #55565A; } .stranka{ max-width: 100%; overflow-x: hidden; } /* fotogalerie */ div.uvnitr div.foto{ width: 48%; margin-right: 2%; margin-bottom: 2%; height: 360px; float: left; position: relative; margin-top: 2% } div.uvnitr div.foto:nth-of-type(3n){ margin-right: 0%; } div.uvnitr div.foto a{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; } div.uvnitr div.foto a:after{ content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; background-color: rgba(255, 255, 255, 0); } div.uvnitr div.foto a:hover:after{ content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; background-color: rgba(255, 255, 255, .5); } div.uvnitr div.foto .nahled{ width: 100%; height: 360px; } div.uvnitr div.foto p{ font-size: 13px; color: rgba(127, 132, 134, 1); margin-top: 10px; } div.uvnitr div.fotogalerie2 .foto{ width: 48%; margin-right: 2%; margin-bottom: 2%; height: 400px; float: left; position: relative; } div.uvnitr div.fotogalerie2 .foto .nahled{ width: 100%; height: 360px; } div.uvnitr div.fotogalerie2 .foto:nth-of-type(2n){ margin-right: 0%; } div.uvnitr div.fotogalerie2 .foto:nth-of-type(3n){ /* margin-right: 2%; */ } .video{ height: 770px; } @media all and (max-width: 1024px) { div.uvnitr div.foto{ width: 48%; margin-right: 2%; margin-bottom: 2%; height: auto; float: left; position: relative; } div.uvnitr .video{ height: 700px; } div.uvnitr div.foto:nth-of-type(3n){ margin-right: 2%; } div.uvnitr div.foto:nth-of-type(2n){ margin-right: 0%; } } @media all and (max-width: 600px) { div.uvnitr .video{ height: 400px; } div.uvnitr div.foto, .fotogalerie2 .foto{ height: 140px; } div.uvnitr .fotogalerie2 .foto .nahled{ height: 140px; } div.uvnitr div.foto .nahled { width: 100%; height: 140px; } div.uvnitr div.foto p, .fotogalerie2 .foto p{ font-size: 13px; color: rgba(127, 132, 134, 1); margin-top: 10px; text-align: center; } } .stranka.rozmazana { -webkit-filter: blur(5px); filter: blur(5px); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; overflow: hidden; width: 100%; height: 100%; position: fixed; } .stranka.rozmazana::before { content: ""; position: fixed; z-index: 9999; width: 100%; height: 100%; left: 0px; top: 0px; overflow: hidden; background-color: rgba(236, 236, 236, .85); } a.zavrit2{ position: absolute; right: 26px; top: 26px; z-index: 1; color: rgba(0, 0, 0, 1); width: 64px; height: 71px; display: block; line-height: 30px; margin-right: 10px; text-align: center; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } a.zavrit2:hover{ -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; transform: rotate(90deg); } a.zavrit2::before{ content: "+"; position: absolute; left: 26px; top: 20px; width: 20px; height: 20px; font-size: 45px; font-weight: 100; transform: rotate(45deg); color: rgba(85, 86, 90, 1); } a.zavrit2.hidden{ position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; z-index: -1; opacity: 0 } div.vyhledavani, div.zavolej{ background-color: rgba(255, 255, 255, 0); width: 70%; height: 80px; position: fixed; top: 30%; right: 15%; z-index: 9999999; display: block; } div.zavolej{ top: 20%; } div.zavolej ul { text-align: left; display: inline-block; } div.zavolej ul li{ position: relative; line-height: 74px; font-size: 27px; font-size: 1.7em; font-weight: 600; margin-left: 30px; list-style: none; color: rgba(0, 51, 102, 1); border-bottom: solid 1px rgba(0, 51, 102, 1); } div.zavolej ul li:last-of-type{ border-bottom: none; } div.zavolej ul li a{ color: rgba(0, 51, 102, 1); } div.zavolej ul li a:hover{ text-decoration: underline } div.zavolej ul li.tel::before { content: "\f095"; font-family: FontAwesome; top: 2px; left: -35px; font-size: 30px; position: absolute; } div.zavolej ul li.mob::before { content: "\f10b"; font-family: FontAwesome; top: 0px; left: -32px; font-size: 38px; position: absolute; } div.zavolej ul li.email::before { content: "\f2b6"; font-family: Font Awesome\ 5 Free; font-weight: 500; top: 0px; left: -38px; font-size: 28px; position: absolute; } div.zavolej ul li.datova::before { content: ""; background: url(datova.png); background-repeat: no-repeat; background-size: 40px; top: 30px; left: -47px; width: 40px; height: 40px; position: absolute; } ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: rgba(0, 0, 0, 1); opacity: 1; /* Firefox */ } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: rgba(0, 0, 0, 1); } ::-ms-input-placeholder { /* Microsoft Edge */ color: rgba(0, 0, 0, 1); } div.vyhledavani.hidden { display: none; } div.vyhledavani input{ background: none; float: left; line-height: 80px; font-size: 30px; font-weight: 100; color: rgba(0, 0, 0, 1); padding-left: 1%; width: 100%; outline: 0; background: transparent; border: solid rgba(0,0,0,1); border-width: 0 0 3px; } div.vyhledavani button{ cursor: pointer; } div.vyhledavani button span{ background: url(hledej.svg) no-repeat; background-size: contain; width: 60px; height: 60px; display: block; position: absolute; right: 1%; top: 10px; text-indent: -9999px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } @media only screen and (max-width: 700px) { div.vyhledavani, div.zavolej{ background-color: rgba(255, 255, 255, 0); width: 98%; height: 80px; position: fixed; top: 30%; right: 1%; z-index: 9999999; display: block; } div.zavolej{ top: 20%; } div.vyhledavani input{ background: none; float: left; line-height: 60px; font-size: 30px; font-weight: 100; color: rgba(0, 0, 0, 1); padding-left: 2%; width: 98%; outline: 0; background: transparent; border: solid rgba(0,0,0,1); border-width: 0 0 2px; } div.vyhledavani button{ cursor: pointer; } div.vyhledavani button span{ background: url(hledej.svg) no-repeat; background-size: contain; width: 40px; height: 40px; display: block; position: absolute; right: 2%; top: 10px; text-indent: -9999px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } } div.vyhledavani button:hover span{ opacity: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } /* seo nadpis */ .seo-nadpis{ position: absolute; z-index: -1; width: 20%; } .seo-nadpis span { position: absolute; text-indent: -9999px; } * { margin: 0; padding: 0; border: 0; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } @media all and (max-width: 425px) { body:before { content: "320"; } } @media all and (max-width: 560px) { body:before { content: "480"; } } @media all and (max-width: 758px) { body:before { content: "600"; } } @media all and (max-width: 940px) { body:before { content: "768"; } } @media all and (max-width: 1024px) { body:before { content: "1024"; } } body:before { content: "1366"; display: none; } a{ text-decoration: none; } .clear{ clear: both; } .clear.cara { clear: both; border-top: solid 2px #cccccc; width: 100%; } hr{ border-bottom: solid 1px #cccccc; width: 100%; padding-top: 20px; margin-bottom: 50px; } hr.seda{ border-bottom: solid 1px rgba(236, 236, 236, 1); width: 100%; padding-top: 0px; margin-bottom: 20px; } hr.bila{ border-bottom: solid 1px rgba(255, 255, 255, 1); width: 100%; padding-top: 0px; margin-bottom: 20px; } .obsah90{ width: 90%; margin-left: auto; margin-right: auto; text-align: left; } .uvnitr{ width: 90%; max-width: 1600px; margin-left: auto; margin-right: auto; text-align: left; position: relative; display: inline-block; vertical-align: top; } div.col_70 .uvnitr{ width: 92%; max-width: 1600px; margin-left: 4%; margin-right: 4%; text-align: left; position: relative; display: inline-block; vertical-align: top; } .uvnitr.center{ width: 98%; max-width: 1600px; margin-left: auto; margin-right: auto; text-align: center; position: relative; display: inline-block; vertical-align: top; } /* lista info */ div.info, div.info2{ width: auto; text-align: left; position: absolute; z-index: 1; color: #000000; line-height: 40px; height: 40px; top: 30px; right: 90px; min-width: 100%; } div.info.ukazat, div.info2.ukazat{ display: block; } div.info.hidden, div.info2.hidden{ display: none; } .info a{ margin-top: 5px; float: right; color: rgba(204, 204, 204, 1); text-transform: uppercase; padding-left: 20px; padding-right: 20px; font-size: 15px; font-weight: 900; position: relative; z-index: 111111; width: auto; height: 29px; display: block; line-height: 29px; margin-right: 40px; text-align: center; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info2 a, .info2 p{ margin-top: 5px; float: right; color: rgba(204, 204, 204, 1); padding-left: 0px; padding-right: 0px; font-size: 14px; font-weight: 400; position: relative; z-index: 111111; width: auto; height: 29px; display: block; line-height: 29px; text-align: center; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info2 p a{ margin-top: 0px; float: none; color: rgba(204, 204, 204, 1); margin-left: 10px; padding-right: 0px; font-size: 14px; font-weight: 400; position: relative; z-index: 111111; width: auto; height: auto; display: inline-block; line-height: auto; text-align: left; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info2 p a:nth-of-type(1):after{ content: ""; position: absolute; left: -10px; color: rgba(204, 204, 204, 1); } .info2 p a:after{ content: "/"; position: absolute; left: -10px; color: rgba(204, 204, 204, 1); } .info a:hover{ color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info2 a:hover, .info2 a.aktivni{ color: rgba(0, 158, 224, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a:after{ content: ""; position: absolute; left: 0px; top: 0px; z-index: -1; height: 100%; width: 0%; background: rgba(0, 158, 224, 0); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a:hover:after{ content: ""; position: absolute; left: 0px; top: 0px; z-index: -1; background: rgba(0, 158, 224, 1); height: 100%; width: 100%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a.hledej{ margin-right: 40px; padding-left: 0px; height: 0px; width: 40px; text-align: center; color: rgba(204, 204, 204, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a.hledej:hover{ -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a.hledej:hover:after{ content: none; } .info a span{ } .info .you::before{ content: "\f167"; font-family: Font Awesome\ 5 Brands; top: 0px; left: 0px; font-size: 16px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .fcb::before{ content: "\f082"; font-family: Font Awesome\ 5 Brands; top: 0px; left: 0px; font-size: 14px; right: 0px; top: 0px; border-right: none; border-top: none; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .insta::before{ content: "\f16d"; font-family: Font Awesome\ 5 Brands; top: 0px; left: 0px; font-size: 14px; right: 0px; top: 0px; border-right: none; border-top: none; } .info a.mail, .info a.mail:hover, .info a.tel, .info a.tel:hover { margin-right: 0px; width: 40px; margin-right: 40px; height: 29px; line-height: 29px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a.mail::after, .info a.mail:hover::after, .info a.tel::after, .info a.tel:hover::after { display: none; } .info a.mail::before, .info a.mail:hover::before{ content: "\f0e0"; font-family: Font Awesome\ 5 Free; position: relative; font-size: 17px; color: rgba(204, 204, 204, 1); margin-left: -7px; right: 0px; top: 0px; border-right: none; border-top: none; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; background: none } .info p.tel { width: auto; height: 45px; line-height: 45px; margin-right: 0px; margin-top: 6px; padding-left: 10px; padding-right: 10px; position: relative; float: left; margin-left: 50px; font-size: 17px; color: rgba(255, 255, 255, 0.8); } .info a.tel::before, .info a.tel:hover::before{ content: "\f095"; font-family: FontAwesome; font-size: 18px; position: relative; color: rgba(204, 204, 204, 1); margin-left: -7px; right: 0px; top: 0px; border-right: none; border-top: none; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; background: none } .info .tel strong::before{ content: "\f095"; font-family: Font Awesome\ 5 Free; top: -2px; left: 20px; font-size: 11px; position: absolute; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .info .hledej::before, .info .hledej:hover::before{ content: "\f3ee"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 10px; right: auto; width: auto; font-weight: 800; font-size: 20px; right: 0px; top: 0px; border-right: none; border-top: none; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .info a.tel:hover::before, .info a.mail:hover::before, .info a.hledej:hover::before { color: rgba(0, 158, 224, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } /* @media all and (max-width: 640px) { } */ @media all and (max-width: 1325px) { div.info a:nth-of-type(4), div.info a:nth-of-type(5), div.info a:nth-of-type(6) { margin-right: 10px; margin-left: 10px; } } @media all and (max-width: 1220px) { div.info a:nth-of-type(4), div.info a:nth-of-type(5), div.info a:nth-of-type(6) { display: none; } } @media all and (max-width: 1024px) { div.info, div.info2{ width: auto; text-align: left; float: right; position: relative; z-index: 1; color: #000000; line-height: 40px; height: 40px; right: 4%; margin-right: 80px; } div#hlavicka div.uvnitr{ width: 100%; } } @media all and (max-width: 460px) { } /* hlavicka */ div#hlavicka{ width: 100%; max-width: 100%; height: 101px; text-align: center; position: fixed; margin-left: auto; margin-right: auto; top:0px; margin-top: 0px; border-left: none; border-right: none; z-index: 1000; background-color: rgba(255, 255, 255, 1); /*border-bottom: solid 1px #e4e8fd; */ -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div#hlavicka.menuaktiv{ width: 100%; max-width: 100%; height: 101px; text-align: center; position: fixed; margin-left: auto; margin-right: auto; top:0px; margin-top: 0px; border-left: none; border-right: none; z-index: 1000; background-color: rgba(236, 236, 236, 1); /*background-color: rgba(220, 40, 30, 1); */ /*border-bottom: solid 1px #e4e8fd; */ -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div#hlavicka .logo { height: 70px; width: 200px; display: block; position: absolute; z-index: 2; margin-top: 10px; margin-left: 2%; text-align: left; background: url(logo.png) no-repeat; background-position: 0px 0px; background-size: 200px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div#hlavicka.menuaktiv .logo { height: 56px; width: 158px; display: block; position: absolute; z-index: 3; margin-top: 20px; margin-left: 2%; text-align: left; background: url(logo.png) no-repeat; background-position: 0px 0px; background-size: 158px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; filter: grayscale(100%) brightness(200%); } div#hlavicka .logo span{ text-indent: -9999px; position: absolute; } @media all and (max-width: 1024px) { div#hlavicka .logo, div#hlavicka.menuaktiv .logo { height: 56px; width: 158px; display: block; position: absolute; z-index: 1; margin-top: 20px; margin-left: 10px; text-align: left; background: url(logo.png) no-repeat; background-position: 0px 0px; background-size: 158px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div#hlavicka .logo::after { content: none; background: none } div.info a{ margin-right: 0px; } } @media all and (max-width: 700px) { div#hlavicka .logo, div#hlavicka.menuaktiv .logo { height: 42px; width: 110px; display: block; position: absolute; z-index: 1; margin-top: 8px; margin-bottom: 5px; margin-left: 10px; text-align: left; background: url(logo.png) no-repeat; background-position: 0px 0px; background-size: 110px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.info, div.info2{ width: auto; text-align: left; float: right; position: relative; z-index: 1; color: #000000; line-height: 40px; height: 40px; right: 0px; margin-right: 0px; top: 55px; } div.info.ukazat{ border-top: solid 0.5px rgba(153, 153, 153, 1) } div.info2{ border-top: solid 0.5px rgba(153, 153, 153, 0) } div.info a{ float: left; margin-right: 0px; margin-top: 8px; font-size: 12px; padding-left: 0px; padding-right: 0px; border-left: solid 0.5px rgba(153, 153, 153, 1) } .info a.mail, .info a.mail:hover, .info a.tel, .info a.tel:hover { margin-right: 0px; margin-right: 0px; padding-left: 0px; height: 29px; width: 33%; display: inline-block; line-height: 29px; } div.info a.hledej{ display: inline-block; margin-top: 8px; width: 33%; margin-right: 0px; border-left:none } .info a.mail::before, .info a.mail:hover::before, .info a.tel::before, .info a.tel:hover::before { margin-left: 2px; right: 5px; } div.info2 a, div.info2 p{ float: left; margin-left: 5%; font-size: 12px; } div.info2 p{ float: left; margin-left: 5%; width: 100%; font-size: 12px; text-align: left } .info2 p a{ margin-top: 0px; float: none; color: rgba(204, 204, 204, 1); padding-left: 0px; padding-right: 0px; margin-left: 10px; font-size: 12px; font-weight: 400; position: relative; z-index: 111111; width: auto; height: auto; display: inline-block; line-height: auto; text-align: left; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } } /* barvy písma */ p{ font-size: 16px; font-weight: 300; line-height: 24px; margin-bottom: 24px; } div.pruh1{ color: rgba(255, 255, 255, 1); } h3.nadpis1 { font-size: 24px; font-weight: 400; margin-bottom: 20px; text-transform: uppercase; color:rgba(241, 138, 0, 1); } h3.nadpis1 a{ color:rgba(241, 138, 0, 1); } h3.nadpis1 a:hover{ color:rgba(241, 138, 0, 1); text-decoration: underline } h2 { font-size: 38px; line-height: 40px; margin-bottom: 40px; color: #55565A; font-weight: 500; font-family: 'Rubik', serif; position: relative; } h2.nadpis2 { font-size: 55px; line-height: 55px; margin-bottom: 40px; color: rgba(0, 158, 224, 1); font-weight: 600; font-family: 'Rubik', serif; position: relative; text-transform: uppercase; } @media all and (max-width: 1024px) { h2.nadpis2 { font-size: 35px; line-height: 35px; margin-bottom: 20px; } } h2.nadpis2 strong { font-size: 28px; font-weight: 400; font-family: 'Rubik', serif; position: relative; } h2.nadpis3 { font-size: 36px; line-height: 40px; margin-bottom: 40px; color: rgba(241, 138, 0, 1); font-weight: 500; font-family: 'Rubik', serif; position: relative; } h2.nadpis3 i { font-size: 26px; font-style: normal; font-weight: 500; line-height: 30px; font-family: 'Rubik', serif; position: relative; color: #55565A; } h2.nadpis3 strong { font-size: 26px; line-height: 30px; font-weight: 300; font-family: 'Rubik', serif; position: relative; color: #55565A; } h2.nadpis3 i u { font-weight: 500; font-family: 'Rubik', serif; position: relative; color: rgba(241, 138, 0, 1); text-decoration: none } @media all and (max-width: 700px) { } .pruh1{ width: 100%; min-height: 400px; background: url(bg1.png) no-repeat left; background-size: contain; background-color: rgba(23, 23, 23, 1); position: relative; } .pruh2{ width: 100%; min-height: 700px; position: relative; background-size: contain; background-color: rgba(255, 255, 255, 1); } .pruh.bily{ background-color: rgba(255, 255, 255, 1); } .sipkapravavelka{ width: 130%; min-width: 800px; height: 100%; padding-left: 15%; padding-right: 15%; padding-top: 5%; margin-top: -5%; padding-bottom: 5%; background: url(sipka_prava_velka.png) no-repeat right; background-size: cover; text-align: left; color: #55565A } @media all and (max-width: 1024px) { .sipkapravavelka{ width: 100%; padding-left: 0px; min-width: auto } } @media all and (max-width: 700px) { .sipkapravavelka{ width: 100%; margin-top: 0px; padding: 0px; margin-left: 0%; padding-left: 0%; padding-right: 0%; background-color: rgba(255, 255, 255, 1); min-width: auto; } } .sipkalevavelka{ width: 102%; min-width: 600px; height: 100%; right: -2%; position: relative; padding-left: 20%; padding-right: 15%; padding-top: 5%; margin-top: 15%; padding-bottom: 5%; background: url(sipka_leva_velka.png) no-repeat left; background-size: cover; text-align: left; color: #55565A } @media all and (max-width: 700px) { .sipkalevavelka{ width: 104%; margin-top: 2%; margin-left: -4%; padding-left: 5%; padding-right: 5%; background-color: rgba(255, 255, 255, 1); min-width: auto } } .obrazek1{ background-size: cover; width: 60%; height: 100%; position: absolute; left: 0px; top: 0px } .obrazek2{ background-size: cover; width: 60%; height: 100%; position: absolute; right: 0px; top: 0px } @media all and (max-width: 1024px) { .obrazek1{ width: 50%; } } @media all and (max-width: 700px) { .obrazek1{ width: 100%; height: 200px; position: relative; } .obrazek2{ width: 100%; height: 200px; position: relative; right: 0px; top: 0px } } .pruh3{ width: 100%; min-height: 400px; background-color: rgba(236, 236, 236, 1); position: relative; padding-top: 5%; padding-bottom: 5%; } .pruh4{ width: 100%; min-height: 700px; background: url(bg2.png) no-repeat right; background-size: contain; background-color: rgba(23, 23, 23, 1); position: relative; } .pruh4 .obrazek1{ background: url(../slides/slide1.jpg) no-repeat left top; background-size: cover; width: 60%; height: 100%; position: absolute; left: 0px; top: 0px } @media all and (max-width: 700px) { .pruh4 .obrazek1{ width: 100%; height: 200px; position: relative; } } .bunka1{ float: left; width: 23.5%; background-color: rgba(255, 255, 255, .5); height: 320px; margin-left: 2%; margin-right: 0%; color: #55565A; padding: 24px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka1:hover{ background-color: rgba(255, 255, 255, 1); -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.2); box-shadow: 0px 0px 40px rgba(0,0,0,0.2); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka1 h2{ font-family: 'Rubik', serif; color: rgba(241, 138, 0, 1); font-size: 18px; text-transform: uppercase; font-weight: 400; margin-bottom: 15px } .bunka1 a{ color: rgba(241, 138, 0, 1); font-size: 16px; position: relative; clear: both; } .bunka1 a:after{ content: ""; position: absolute; right: -17px; top: -3px; width: 8px; height: 26px; background: url(sipka_prava.png) no-repeat; background-size: 8px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka1:hover a:after{ content: ""; position: absolute; right: -25px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka1:first-of-type{ float: left; width: 23.5%; margin-left: 0%; margin-right: 0%; } .bunka1:last-of-type{ float: left; width: 23.5%; margin-left: 0%; margin-right: 0%; } @media all and (max-width: 1500px) { .bunka1, .bunka1:first-of-type, .bunka1:last-of-type{ width: 48%; margin-bottom: 2%; margin-left: 1%; margin-right: 1%; } } @media all and (max-width: 750px) { .bunka1, .bunka1:first-of-type, .bunka1:last-of-type{ width: 100%; margin-bottom: 2%; margin-left: 0%; margin-right: 0%; height: auto; } } .vice01, .podstranky a.vice01{ display: inline-block; text-decoration: none; color: rgba(112, 112, 112, 1); padding-left: 0px; padding-right: 0px; font-size: 17px; font-family: 'Rubik', serif; font-weight: 400; position: relative; z-index: 1; width: auto; height: 40px; line-height: 40px; min-width: 200px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; border: none } .vice01:hover{ color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01:after{ content: ""; position: absolute; left: 50%; top: 0px; z-index: -1; background: url(tl01_left.png) no-repeat left; height: 40px; width: 1px; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01:before{ content: ""; position: absolute; right: 50%; top: 0px; z-index: -1; background: url(tl01_right.png) no-repeat right; height: 40px; width: 1px; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01 span{ display: inline-block; margin-left: 0px; padding-left: 30px; padding-right: 30px; color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01:hover span{ display: block; color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01 span:after{ content: ""; position: absolute; left: 0px; z-index: -1; background: url(tl01_left_01_b.png) no-repeat left; background-size: cover; height: 40px; width: 50%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01 span:before{ content: ""; position: absolute; right: 0px; z-index: -2; background: url(tl01_right_01_b.png) no-repeat right; background-size: cover; height: 40px; width: 50%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01:hover:after, .sloupec25:hover .vice01:after{ content: ""; position: absolute; left: 0px; top: 0px; z-index: -1; background: url(tl01_left.png) no-repeat left; background-size: cover; height: 40px; width: 50%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice01:hover:before, .sloupec25:hover .vice01:before{ content: ""; position: absolute; right: 0px; top: 0px; z-index: -1; background: url(tl01_right.png) no-repeat right; background-size: cover; height: 40px; width: 50%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice02, .podstranky a.vice02{ display: inline-block; text-decoration: none; color: rgba(255, 255, 255, 1); padding-left: 0px; padding-right: 0px; font-size: 17px; font-family: 'Rubik', serif; font-weight: 400; position: relative; z-index: 1; width: auto; height: 55px; line-height: 55px; padding-left: 40px; padding-right: 40px; margin-bottom: 20px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; border: none } .vice02:hover, .podstranky a.vice02:hover{ color: rgba(241, 138, 0, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice02:after{ content: ""; position: absolute; left: 0%; top: 0px; z-index: -1; background: url(tl01_left.png) no-repeat left; height: 55px; width: 50%; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice02:before{ content: ""; position: absolute; right: 0%; top: 0px; z-index: -1; background: url(tl01_right.png) no-repeat right; height: 55px; width: 50%; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice02:hover:after{ background: url(tl01_left_b.png) no-repeat left; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice02:hover:before{ background: url(tl01_right_b.png) no-repeat right; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .katalog{ max-width: 180px; margin-bottom: 10px; margin-top: 3%; } .marbot20{ margin-bottom: 40px; } button.vice03{ background-color: transparent; cursor: pointer; } .vice03{ display: inline-block; color: rgba(85, 86, 90, 1); padding-left: 0px; padding-right: 0px; font-size: 17px; font-family: 'Rubik', serif; font-weight: 400; position: relative; z-index: 1; width: auto; height: 50px; line-height: 50px; min-width: 220px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; border: none } .vice03:hover{ color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice03:after{ content: ""; position: absolute; left: 0%; top: 0px; z-index: -1; background: url(tl01_left_b.png) no-repeat left; height: 50px; width: 50%; filter: brightness(.9); background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice03:before{ content: ""; position: absolute; right: 0%; top: 0px; z-index: -1; background: url(tl01_right_b.png) no-repeat right; filter: brightness(.9); height: 50px; width: 50%; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice03:hover:after{ background: url(tl01_left.png) no-repeat left; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; filter: brightness(1); } .vice03:hover:before{ background: url(tl01_right.png) no-repeat right; background-size: cover; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; filter: brightness(1); } /* sloupce */ .sloupec50{ width: 50%; vertical-align: top; text-align: left; display: inline-block; position: relative; /* padding: 2%; */ padding-top: 5% } @media all and (max-width: 1024px) { .sloupec50{ width: 100%; padding: 2%; padding-top: 0%; padding-bottom: 0%; float: left; } } .sloupec60{ width: 60%; vertical-align: top; text-align: left; display: inline-block; position: relative; padding: 2%; padding-top: 5% } .sloupec70{ width: 70%; vertical-align: top; text-align: left; display: inline-block; position: relative; padding: 2%; padding-top: 5% } .padding-left5{ padding-left: 10%; } .padding-left10{ padding-left: 10%; } .padding-left15{ padding-left: 15%; } .padding-left20{ padding-left: 20%; } .padding-right10{ padding-right: 10%; } .padding-right15{ padding-right: 15%; } .padding-right20{ padding-right: 20%; } @media all and (max-width: 1024px) { .padding-left15{ padding-left: 0%; } .padding-right15{ padding-right: 0%; } } .sloupec25{ width: 25%; vertical-align: top; text-align: center; display: inline-block; position: relative; padding: 2%; padding-top: 5% } .sloupec25 p{ min-height: 170px; } a.odkazblok{ width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; z-index: 2; } @media all and (max-width: 1024px) { .sloupec25{ width: 50%; padding-bottom: 5%; } } @media all and (max-width: 500px) { .sloupec25{ width: 100%; padding-bottom: 5%; } } .ikona1{ position: relative; padding-top: 120%; width: 100%; height: 100%; background: url(ikona01.png) no-repeat center top; background-size: contain; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona1 h3, .ikona2 h3{ color: rgba(255, 255, 255, 1); text-align: center; font-size: 18px; font-weight: 300; width: 100%; position: absolute; top: 27%; text-transform: uppercase; } .sloupec25:hover .ikona1{ background: url(ikona01_hover.png) no-repeat center top; background-size: contain; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona2{ position: relative; padding-top: 120%; width: 100%; height: 100%; background: url(ikona02.png) no-repeat center top; background-size: contain; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .sloupec25:hover .ikona2{ background: url(ikona02_hover.png) no-repeat center top; background-size: contain; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } /* tlacikta pomocna */ .domluvitschuzku{ position: fixed; color: rgba(255, 255, 255, 1); font-size: 14px; line-height: 17px; text-transform: uppercase; right: -120px; bottom: 80px; width: 199px; height: 77px; z-index: 2; background: url(ikona03.png); background-size: 199px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .domluvitschuzku span{ position: absolute; left: 80px; top: 24px; text-align: left; } .domluvitschuzku:hover{ position: fixed; right: 0px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .center{ text-align: center; } .ikona3 { position: relative; width: 200px; height: 222px; display: inline-block; text-align: left; vertical-align: top; margin: 10px; margin-bottom: -30px; } .ikona3 .pozadi{ background: url(sestiuhelnik_tl_orange.svg); background-size: 200px; filter: opacity(14%) grayscale(100%); width: 200px; height: 222px; display: block; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3 img{ max-width: 90px; margin-left: 55px; margin-top: 70px; height: auto; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3 p{ width: 100%; text-align: center; margin-left: 0px; margin-top: 75px; position: absolute; color: rgba(85, 86, 90, 1.0); font-size: 26px; line-height: 32px; font-weight: 500; font-family: 'Rubik', serif; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; opacity: 0; } .ikona3 p.top15{ top: 15px; } .ikona3:hover p{ opacity: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3:hover .pozadi{ filter: opacity(100%) grayscale(0%); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3:hover img{ opacity: 0; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3.logo img, .ikona3.logo:hover img{ width: 114%; max-width: none; margin-top: -11%; margin-left: -7%; opacity: 1; height: auto; } @media all and (max-width: 700px) { .ikona3 { position: relative; width: 90px; height: 98px; display: inline-block; text-align: left; vertical-align: top; margin: 4px; margin-bottom: -15px; } .ikona3 .pozadi{ background: url(sestiuhelnik_tl_orange.svg) no-repeat top; background-size: 90px; filter: opacity(14%) grayscale(100%); width: 90px; height: 104px; display: block; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3 img{ max-width: 40px; margin-left: 23px; margin-top: 30px; height: auto; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ikona3 p{ width: 100%; text-align: center; margin-left: 0px; margin-top: 27px; position: absolute; color: rgba(85, 86, 90, 1.0); font-size: 17px; line-height: 20px; font-weight: 500; font-family: 'Rubik', serif; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; opacity: 0; } .ikona3 p span{ font-size: 13px; } } .height100 { max-height: 100%; height: 100vh; min-height: 750px; overflow: hidden; } @media all and (max-width: 700px) { .height100 { max-height: 100%; height: auto; min-height: auto; padding-bottom: 20%; overflow: hidden; } } /* paticka stranky */ .paticka{ width: 100%; min-height: 500px; background-color: rgba(236, 236, 236, 1); position: relative; overflow: hidden; } .paticka:after{ content: ""; position: absolute; width: 100%; height: 100%; right: 5%; bottom: -10%; background: url(logo_ikona.svg) no-repeat right bottom; background-size: 400px; filter: opacity(40%) grayscale(100%); } .paticka .odstavec{ width: 23%; margin-right: 2%; display: inline-block; vertical-align: top; margin-top: 40px; } @media all and (max-width: 1270px) { .paticka .odstavec{ width: 23%; margin-right: 2%; display: inline-block; vertical-align: top; margin-top: 40px; } .paticka .odstavec:nth-of-type(5), .paticka .odstavec:nth-of-type(4) { margin-top: 0px; } .paticka .odstavec:nth-of-type(4) .mezera, .paticka .odstavec:nth-of-type(5) .mezera { height: 0px; } } @media all and (max-width: 730px) { .paticka .odstavec{ width: 50%; margin-right: 0%; display: inline-block; vertical-align: top; margin-top: 40px; } .paticka .odstavec:nth-of-type(3), .paticka .odstavec:nth-of-type(4), .paticka .odstavec:nth-of-type(5), .paticka .odstavec:nth-of-type(6) { margin-top: 0px; } .paticka .odstavec:nth-of-type(3) .mezera, .paticka .odstavec:nth-of-type(4) .mezera, .paticka .odstavec:nth-of-type(5) .mezera, .paticka .odstavec:nth-of-type(6) .mezera { height: 0px; } } @media all and (max-width: 480px) { .paticka .odstavec{ width: 100%; margin-right: 0%; display: inline-block; vertical-align: top; margin-top: 40px; border-top: none } .paticka .odstavec:nth-of-type(1) { border-top: none } .paticka .odstavec:nth-of-type(2), .paticka .odstavec:nth-of-type(3), .paticka .odstavec:nth-of-type(4), .paticka .odstavec:nth-of-type(5) { margin-top: 0px; } .paticka .odstavec:nth-of-type(2) .mezera, .paticka .odstavec:nth-of-type(3) .mezera, .paticka .odstavec:nth-of-type(4) .mezera, .paticka .odstavec:nth-of-type(5) .mezera { height: 0px; } } .paticka div.copy{ width: 100%; text-align: left; margin-top: 30px; margin-bottom: 30px; font-size: 14px; font-weight: 300; } .paticka div.copy ul { vertical-align: top; display: inline-block; padding-top: 20px; width: 86%; } .paticka div.copy ul li{ list-style: none; display: inline-block; color: #55565a; font-weight: 300; margin-right: 1%; } .paticka div.copy ul li a{ color: #55565a; font-size: 14px; font-weight: 300; text-decoration: none } @media all and (max-width: 480px) { .paticka div.copy ul{ width: 100%; } .paticka div.copy ul li{ font-weight: 300; color: #55565a; padding-top: 10px; padding-bottom: 10px; display: block; } } .paticka div.copy ul li a:hover{ text-decoration: underline } .paticka div.copy ul li a.aktivni{ color: rgba(0, 158, 224, 1); font-size: 14px; font-weight: 300; text-transform: uppercase; text-decoration: underline } .paticka a.logo{ width: 102px; height: 37px; background: url(logo.png) no-repeat top; background-size: 102px; display: block; display: inline-block; vertical-align: top; margin-right: 2%; } .paticka .odstavec h3{ color: #55565a; font-size: 24px; text-transform: uppercase; font-weight: 800; font-family: 'Rubik', serif; } .paticka .odstavec h4{ color: rgba(0, 158, 224, 1); font-size: 15px; font-weight: 900; text-transform: uppercase; margin-top: 50px; margin-bottom: 12px; } .paticka .odstavec .mezera{ width: 100%; height: 59px; } .paticka .odstavec a.upper{ color: rgba(0, 158, 224, 1); font-size: 14px; font-weight: 300; text-transform: uppercase; text-decoration: underline } .paticka .odstavec a.upper:hover{ text-decoration: none } .paticka .odstavec p{ color: #55565a; font-size: 14px; line-height: 30px; margin-bottom: 14px; } .paticka .odstavec p a{ color: #55565a; } .paticka .odstavec p a:hover{ text-decoration: underline } .paticka .odstavec ul li{ font-size: 15px; list-style: none } .paticka .odstavec ul li a{ line-height: 30px; font-weight: 300; color: #55565a; } .paticka ul.kont li{ margin-left: 20px; font-size: 14px; font-weight: 300; list-style: none; position: relative; } .paticka ul.kont li.mob::before { content: "\f10b"; font-family: FontAwesome; color: #55565a; top: 4px; left: -18px; font-size: 22px; position: absolute; } .paticka ul.kont li.email::before { content: "\f0e0"; font-family: FontAwesome; color: #55565a; top: 8px; left: -20px; font-size: 13px; position: absolute; } @media all and (max-width: 480px) { .paticka .odstavec ul li a{ font-weight: 400; color: #55565a; display: block; } } .paticka .odstavec ul li a:hover{ text-decoration: underline } .vice05{ display: inline-block; color: rgba(255, 255, 255, 1); background-color: rgba(0, 158, 224, 1); font-size: 20px; font-weight: 900; position: relative; z-index: 1; width: auto; line-height: 40px; height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; white-space: nowrap; margin-top: 5px; margin-bottom: 14px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice04{ display: inline-block; color: rgba(255, 255, 255, 1); background-color: rgba(0, 158, 224, 1); font-size: 15px; font-weight: 900; position: relative; z-index: 1; width: auto; height: 30px; line-height: 30px; padding-left: 15px; padding-right: 15px; white-space: nowrap; margin-top: 15px; margin-bottom: 14px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .vice04:hover{ display: inline-block; background-color: rgba(255, 255, 255, 1); color: rgba(0, 158, 224, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } /* podstranky */ .hlavni_obrazek_pruh{ width: 100%; height: 570px; position: relative; } @media all and (max-width: 1400px) { .hlavni_obrazek_pruh { width: 100%; height: 450px; position: relative; } } .hlavni_obrazek_pruh .obrazek1{ width: 65%; height: 100%; position: absolute; left: 0px; top: 0px } .hlavni_obrazek_pruh .obrazek2{ width: 65%; height: 100%; position: absolute; right: 0px; top: 0px } .bunkalevavelka{ width: 100%; /* min-width: 600px;*/ /* height: 100%; */ right: 0%; position: relative; padding-left: 5%; padding-right: 5%; padding-top: 5%; margin-top: 10%; padding-bottom: 5%; background-color: rgba(255, 255, 255, 1); text-align: left; } @media all and (max-width: 1024px) { .hlavni_obrazek_pruh{ width: 100%; height: auto; position: relative; } .hlavni_obrazek_pruh .obrazek1{ width: 100%; height: 300px; position: relative; left: 0px; top: 0px } .hlavni_obrazek_pruh .obrazek2{ width: 100%; height: 300px; position: relative; right: 0px; top: 0px } .bunkalevavelka{ width: 116%; min-width: auto; height: 100%; right: 8%; position: relative; padding-left: 5%; padding-right: 5%; padding-top: 5%; margin-top: 0px; padding-bottom: 5%; background-color: rgba(255, 255, 255, 1); text-align: left; } } @media all and (max-width: 450px) { .hlavni_obrazek_pruh{ width: 100%; height: auto; position: relative; } .hlavni_obrazek_pruh .obrazek1{ width: 100%; height: 250px; position: relative; left: 0px; top: 0px } .hlavni_obrazek_pruh .obrazek2{ width: 100%; height: 250px; position: relative; right: 0px; top: 0px } } .bunkalevavelka h2{ color: rgba(112, 112, 112, 1); font-family: 'Rubik', serif; font-size: 48px; padding-bottom: 5%; font-weight: 500; margin-bottom: 0px; } .bunkalevavelka h2.nadpis{ color: rgba(112, 112, 112, 1); font-family: 'Rubik', serif; font-size: 30px; padding-bottom: 5%; font-weight: 400; } .bunkalevavelka p{ color: rgba(112, 112, 112, 1); font-size: 18px; font-weight: 400; } .bunkalevavelka p a{ color: rgba(112, 112, 112, 1); text-decoration: underline } .bunkalevavelka p a.ram{ text-decoration: none } .podstranky{ padding-top: 80px; padding-bottom: 80px; } .podstranky h2.nadpis2, .podstranky p{ color: #55565A; /* clear: both; */ } .podstranky h2.nadpis2.sedy{ color: rgba(204, 204, 204, 1.0); /* clear: both; */ } .podstranky h2.nadpis2.modry{ color: rgba(0, 158, 224, 1.0); /* clear: both; */ } .podstranky a{ color: rgba(241, 138, 0, 1); text-decoration: underline /* clear: both; */ } .podstranky p a{ color: #55565A; text-decoration: underline /* clear: both; */ } .podstranky h3{ font-size: 20px; font-weight: 500; line-height: 24px; margin-bottom: 24px; color: #55565A; } h3.nadpis1 { font-size: 24px; font-weight: 400; margin-bottom: 20px; text-transform: uppercase; color: rgba(241, 138, 0, 1); } .podstranky ul { margin-bottom: 20px; } .podstranky ul li{ position: relative; font-size: 16px; line-height: 24px; font-weight: 300; margin-left: 15px; color: #55565A; list-style: none } .podstranky ul li:after{ content: ""; position: absolute; left: -15px; top: 7px; width: 10px; height: 10px; background: url(sipka_prava.png) no-repeat left; background-size: 5px; } .podstranky ul.vyhledavani li:after{ display: none; } .podstranky ul.vyhledavani li{ margin-left: 0px; margin-bottom: 30px; } .podstranky ul.vyhledavani li a{ font-weight: 400; color: rgba(241, 138, 0, 1); text-decoration: underline } .podstranky ul.vyhledavani li strong a{ color: #55565A; font-weight: 500; text-decoration: none } .podstranky .odstavec50{ display: inline-block; width: 48%; margin-right: 1.5%; vertical-align: top; } #menu_sub .odstavec50{ display: inline-block; width: 50%; margin-right: 0%; vertical-align: top; } .podstranky .odstavec50:nth-of-type(2n) { display: inline-block; width: 48%; margin-right: 0px; vertical-align: top; } ul.kontakt { margin-left: 0px; margin-bottom: 0px; margin-top: 30px; width: max-content } ul.kontakt.velky { margin-left: auto; margin-right: auto; margin-bottom: 0px; width: max-content } ul.kontakt li { list-style: none; margin-left: 60px; color: #55565A; font-size: 16px; font-weight: 300; line-height: 24px; min-height: 50px; position: relative; padding-top: 15px; padding-bottom: 15px; margin-bottom: 0px; } ul.kontakt.velky li { list-style: none; margin-left: 0px; color: #55565A; font-size: 16px; display: inline-block; font-weight: 400; line-height: 24px; min-height: 80px; position: relative; padding: 15px; padding-top: 50px; margin-bottom: 0px; } ul.kontakt li::after { content: ""; position: absolute; left: -70px; bottom: 0px; height: 1px; width: 60px; background: rgba(0, 0, 0, .1) } ul.kontakt.velky li::after { display: none; } ul.kontakt li a, ul.kontakt li strong { font-size: 16px; font-weight: 500; color: rgba(241, 138, 0, 1); } ul.kontakt.velky li a { font-size: 18px; font-weight: 400; color: #55565A; } ul.kontakt li.tel::before { content: ""; background: url(002-telephone.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: -60px; margin-left: 0px; opacity: 1; top: 30%; } ul.kontakt.velky li.tel::before { content: ""; background: url(002-telephone.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: 50%; margin-left: -20px; opacity: 1; top: 10px; -webkit-filter:invert(1); filter:invert(1); opacity: .6; } ul.kontakt li.email::before { content: ""; background: url(126-email-1.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: -60px; margin-left: 0px; opacity: .1; top: 30%; } ul.kontakt.velky li.email::before { content: ""; background: url(126-email-1.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: 50%; margin-left: -20px; opacity: .6; top: 10px; } ul.kontakt li.cas::before { content: ""; background: url(039-wall-clock.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: -60px; margin-left: 0px; opacity: 0.15; top: 30%; } ul.kontakt li.lokalita::before { content: ""; background: url(121-pin-1.svg) no-repeat; -webkit-filter: grayscale(100%); background-size: 29px; width: 40px; height: 40px; position: absolute; left: -60px; margin-left: 0px; opacity: 0.3; top: 30%; } @media all and (max-width: 700px) { h3.nadpis1 { margin-bottom: 10px } .podstranky .odstavec50{ display: inline-block; width: 100%; margin-right: 0%; margin-bottom: 30px; } .podstranky .odstavec50:nth-of-type(2n) { display: inline-block; width: 100%; margin-right: 0px; margin-bottom: 30px; } } .podstranky .odstavec50 h3 i{ font-size: 14px; font-weight: 300; } /* vypis domu bunky */ div.dumbunka{ display: inline-block; position: relative; width: 32.1%; vertical-align: top; margin-right: 1.5%; margin-bottom: 4%; /* height: 450px; */ height: 550px; background-color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; text-align: center; } div.dumbunka.mensi{ } div.dumbunka:nth-of-type(3n){ margin-right: 0%; } /*div.dumbunka:nth-of-type(3n+1){ clear: both; } */ div.dumbunka .nahled{ position: relative; width: 100%; /* height: 50%; */ height: 60%; overflow: hidden; text-align: left } div.dumbunka.mensi .nahled{ position: relative; width: 100%; /* height: 50%; */ height: 60%; overflow: hidden; margin-bottom: 10px; text-align: left } div.dumbunka .nahled img{ position: absolute; width: 100%; height: auto; } div.dumbunka .nahled img:nth-of-type(1), div.dumbunka:hover .nahled img:nth-of-type(2) { opacity: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka:hover .nahled img:nth-of-type(1), div.dumbunka .nahled img:nth-of-type(2) { opacity: 0; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka .nahled.foto1 img:nth-of-type(1), div.dumbunka:hover .nahled.foto1 img:nth-of-type(1) { position: absolute; min-width: 100%; /* min-height: 270px; */ max-height: 270px; /* height: auto; */ width: auto; opacity: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka.mensi .nahled.foto1 img:nth-of-type(1), div.dumbunka.mensi:hover .nahled.foto1 img:nth-of-type(1){ width: auto; height: 330px; } div.dumbunka:hover{ -moz-box-shadow: 0px 0px 40px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 0px 40px rgba(0,0,0,0.2); box-shadow: 0px 0px 40px rgba(0,0,0,0.2); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka::before{ content: ""; width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: 1; border: solid 4px transparent; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka:hover::before{ content: ""; width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: 1; border: solid 4px rgba(241, 138, 0, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.dumbunka h2{ color: rgba(241, 138, 0, 1); font-size: 23px; margin-bottom: 0px; line-height: inherit; font-weight: 400; text-transform: uppercase; width: 100%; text-align: center; margin-top: 20px; height: 60px; padding-left: 10px; padding-right: 10px; } div.dumbunka h2 a{ color: rgba(241, 138, 0, 1); font-size: 23px; font-weight: 400; } div.dumbunka p{ color: #55565A; font-size: 14px; font-weight: 500; display: inline-block; height: 50px; min-width: 60%; text-align: center; } div.dumbunka.prouzek h2{ color: rgba(241, 138, 0, 1); font-size: 23px; font-weight: 400; text-transform: uppercase; width: auto; text-align: left; margin-top: 40px; margin-left: 30px; height: 50px; vertical-align: top; display: inline-block; position: absolute; } div.dumbunka.prouzek h2.relative{ color: rgba(241, 138, 0, 1); font-size: 23px; font-weight: 400; text-transform: uppercase; width: 100%; text-align: left; margin-top: 40px; margin-left: 0px; padding-left: 30px; height: 50px; vertical-align: top; display: inline-block; position: relative; } div.dumbunka.prouzek p.popis.vyska100{ text-align: left; margin-left: 30px; margin-right: 30px; margin-top: 100px; width: auto; min-width: auto; position: absolute; } div.dumbunka.prouzek p.popis.relative{ text-align: left; padding-left: 30px; padding-right: 30px; margin-top: 0px; margin-bottom: 0px; width: 100%; min-width: auto; position: relative; } div.dumbunka p{ color: #55565A; font-size: 14px; font-weight: 500; display: inline-block; height: 50px; width: 90%; margin-left: 5%; text-align: center; } div.dumbunka p.vyska100 { color: #55565A; font-size: 14px; font-weight: 500; display: inline-block; min-height: 80px; line-height: 24px; width: 90%; text-align: left; margin-bottom: 0px; } div.dumbunka.mensi p.vyska100 { color: #55565A; font-size: 14px; font-weight: 500; display: inline-block; min-height: 140px; line-height: 24px; width: 90%; text-align: left; margin-bottom: 15px; font-weight: 400; } div.dumbunka.mensi p.vyska100.center{ text-align: center } div.dumbunka.prouzek.vyska250{ height: 250px; } div.dumbunka.prouzek{ display: inline-block; position: relative; width: 100%; vertical-align: top; margin-right: 0%; margin-bottom: 4%; height: auto; max-height: 250px; padding-bottom: 20px; background-color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; text-align: left; } div.dumbunka.prouzek .nahled{ display: inline-block; width: 250px; min-height: 250px; float: left; } div.dumbunka.prouzek a.ram.snahledem{ position: relative; top: 180px; left: 30px; vertical-align: top; } div.dumbunka.prouzek a.ram{ position: relative; left: 30px; vertical-align: top; } @media all and (max-width: 1300px) { div.dumbunka{ display: inline-block; position: relative; width: 32%; vertical-align: top; margin-right: 1.5%; margin-bottom: 2%; } div.dumbunka p{ min-width: 80%; } } @media all and (max-width: 1024px) { div.dumbunka{ display: inline-block; position: relative; width: 48.8%; vertical-align: top; margin-right: 1.5%; margin-bottom: 2%; } div.dumbunka:nth-of-type(2n){ margin-right: 0%; } div.dumbunka:nth-of-type(3n){ margin-right: 1.5%; } } @media all and (max-width: 600px) { div.dumbunka.prouzek .nahled{ display: none; } } @media all and (max-width: 600px) { div.dumbunka{ display: inline-block; position: relative; width: 100%; vertical-align: top; margin-right: 0%; margin-bottom: 2%; } div.dumbunka:nth-of-type(2n){ margin-right: 0%; } div.dumbunka:nth-of-type(3n){ margin-right: 0%; } } div.dumbunka p span{ color: #55565A; font-size: 14px; font-weight: 200; text-align: left; display: inline-block; white-space: nowrap; width: 40%; vertical-align: top; } a.ram{ display: inline-block; color: rgba(0, 158, 224, 1); padding-left: 15px; padding-right: 15px; font-size: 17px; font-weight: 900; position: relative; z-index: 1; width: auto; height: 40px; line-height: 40px; text-align: center; text-transform: uppercase; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; border: solid 1px rgba(0, 158, 224, 1); } a.ram:hover{ display: inline-block; color: #ffffff; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; border: solid 1px rgba(0, 158, 224, 1); background-color: rgba(0, 158, 224, 1); } /* cenik */ div.cenik { width: 40%; margin-right: 0px; height: 320px; background-color: rgba(204, 204, 204, .5); display: inline-block; vertical-align: top; margin-bottom: 2%; } div.cenik .cena { margin: 5%; border-bottom: solid 1px rgba(255, 255, 255, 1) } div.cenik p { margin: 5%; color: rgba(102, 102, 102, 1); font-size: 16px; font-weight: 300; } div.cenik h3 { color: rgba(102, 102, 102, 1); font-size: 16px; font-weight: 300; text-transform: uppercase; padding-top: 2%; padding-bottom: 2%; } div.cena:nth-of-type(2) { margin-bottom: 10px; } div.cenik h3 span { display: inline-block; vertical-align: top; line-height: 18px; width: 33%; padding-right: 10%; } div.cenik h3 strong { display: inline-block; vertical-align: top; font-size: 22px; font-weight: 500; text-transform: none; } div.cenik h3 strong.akcni { text-decoration: line-through } div.cenik h3 i { display: inline-block; float: right; vertical-align: top; font-size: 22px; font-weight: 500; text-transform: none; font-style: normal; color: #F18A00; } div.cenik h3 i span { vertical-align: middle; font-size: 18px; font-weight: 300; text-transform: none; font-style: normal; color: #F18A00; } div.cenik p.male { font-size: 14px; } div.cenik p.male span.oranzovy { color: #F18A00; } /* parametry */ div.parametry { width: 60%; display: inline-block; text-align: right; } @media all and (max-width: 1300px) { div.cenik { width: 50%; } div.parametry { width: 50%; } } @media all and (max-width: 1024px) { div.cenik { width: 100%; height: auto; } div.cenik h3 { color: rgba(102, 102, 102, 1); font-size: 16px; font-weight: 300; text-transform: uppercase; padding-top: 0%; padding-bottom: 0%; } div.cenik h3 span { } div.parametry { width: 100%; } } @media all and (max-width: 540px) { div.cenik h3 span { width: 100%; } } div.parametrbunka { width: 48%; margin-left: 2%; margin-bottom: 20px; height: 150px; background-color: rgba(255, 255, 255, 1); display: inline-block; vertical-align: top; } div.parametrbunka:last-of-type { margin-right: 0%; } @media all and (max-width: 1024px) { div.parametrbunka { width: 49%; margin-left: 0px; margin-right: 2%; margin-bottom: 2%; height: 150px; background-color: rgba(255, 255, 255, 1); display: inline-block; vertical-align: top; } div.parametrbunka:nth-of-type(2), div.parametrbunka:nth-of-type(4), div.parametrbunka:nth-of-type(6) { margin-right: 0%; margin-left: 0px; } } @media all and (max-width: 540px) { div.parametrbunka, div.parametrbunka:nth-of-type(3), div.parametrbunka:nth-of-type(6), div.parametrbunka:nth-of-type(9) { width: 49%; margin-right: 2%; margin-bottom: 2%; height: 150px; background-color: rgba(255, 255, 255, 1); display: inline-block; vertical-align: top; } div.parametrbunka:nth-of-type(2), div.parametrbunka:nth-of-type(4), div.parametrbunka:nth-of-type(6), div.parametrbunka:nth-of-type(8) { margin-right: 0%; } } div.parametrbunka p { font-size: 16px; text-transform: uppercase; font-weight: 300; color: #55565A; text-align: center; width: 100%; margin-top: 39px; line-height: 18px; } div.parametrbunka p strong { font-weight: 300; color: #F18A00; padding-top: 14px; display: inline-block; } /* fotogalerie */ div.fotogalerie { margin-top: 65px; } div.fotogalerie a { overflow: hidden; } div.fotogalerie a img { width: auto; min-width: 100%; min-height: 100%; height: auto; } div.fotogalerie a:nth-child(1), div.fotogalerie a:nth-child(8), div.fotogalerie a:nth-child(15) { width: 37%; height: 301px; display: block; float: left; } div.fotogalerie a:nth-child(2), div.fotogalerie a:nth-child(9), div.fotogalerie a:nth-child(16) { width: 61%; display: block; float: left; margin-left: 2%; height: 621px; } div.fotogalerie a:nth-child(3), div.fotogalerie a:nth-child(10), div.fotogalerie a:nth-child(17) { width: 37%; display: block; float: left; margin-left: 0%; margin-top: -285px; height: 621px; } div.fotogalerie a:nth-child(4), div.fotogalerie a:nth-child(11), div.fotogalerie a:nth-child(18) { width: 25%; display: block; float: left; margin-left: 2%; margin-top: 35px; height: 301px; } div.fotogalerie a:nth-child(5), div.fotogalerie a:nth-child(12), div.fotogalerie a:nth-child(19) { width: 34%; display: block; float: left; margin-left: 2%; margin-top: 35px; height: 301px; } div.fotogalerie a:nth-child(6), div.fotogalerie a:nth-child(13), div.fotogalerie a:nth-child(20) { width: 28%; display: block; float: left; margin-left: 0; margin-top: 35px; height: 621px; margin-bottom: 35px; } div.fotogalerie a:nth-child(7), div.fotogalerie a:nth-child(14), div.fotogalerie a:nth-child(21) { width: 70%; display: block; float: left; margin-left: 2%; margin-top: 35px; height: 621px; margin-bottom: 35px; } @media all and (max-width: 800px) { div.fotogalerie a:nth-child(1), div.fotogalerie a:nth-child(8), div.fotogalerie a:nth-child(15) { width: 49%; height: 200px; display: block; float: left; } div.fotogalerie a:nth-child(2), div.fotogalerie a:nth-child(9), div.fotogalerie a:nth-child(16) { width: 49%; display: block; float: left; margin-left: 2%; height: 200px; } div.fotogalerie a:nth-child(3), div.fotogalerie a:nth-child(10), div.fotogalerie a:nth-child(17) { width: 100%; display: block; float: left; margin-left: 0%; margin-top: 2%; height: 300px; } div.fotogalerie a:nth-child(4), div.fotogalerie a:nth-child(11), div.fotogalerie a:nth-child(18) { width: 25%; display: block; float: left; margin-left: 0%; margin-top: 2%; height: 250px; } div.fotogalerie a:nth-child(5), div.fotogalerie a:nth-child(12), div.fotogalerie a:nth-child(19) { width: 73%; display: block; float: left; margin-left: 2%; margin-top: 2%; height: 250px; } div.fotogalerie a:nth-child(6), div.fotogalerie a:nth-child(13), div.fotogalerie a:nth-child(20) { width: 49%; display: block; float: left; margin-left: 0%; margin-top: 2%; margin-bottom: 2%; height: 200px; } div.fotogalerie a:nth-child(7), div.fotogalerie a:nth-child(14), div.fotogalerie a:nth-child(21) { width: 49%; display: block; float: left; margin-left: 2%; margin-top: 2%; margin-bottom: 2%; height: 200px; } } .fotka20 { filter: brightness(93%); width: 20%; display: inline-block; margin: 2% } .fotka100 { filter: brightness(93%); width: 100%; } .fotka80 { width: 80%; } .fotka80.seda { filter: brightness(93%); width: 80%; } .fotka30_prava { float: right; width: 30%; margin-bottom: 30px; height: auto; margin-left: 30px; } @media all and (max-width: 600px) { .fotka30_prava { width: 100%; margin-bottom: 30px; height: auto; margin-left: 0px; } .fotka80 { width: 100%; } .fotka20 { width: 45%; display: inline-block; margin: 2% } } /* Barvy proužku s obrázky */ .pruh { padding-top: 40px; padding-bottom: 40px; position: relative; } .pruh.sedy { background-color: rgba(236, 236, 236, 1); min-height: 20px; padding-top: 40px; padding-bottom: 40px; min-height: inherit; } .pruh.sedy h2{ margin-bottom: 20px; } .pruhbila { background-color: rgba(255, 255, 255, 1); } .pruhseda { background-color: rgba(236, 236, 236, 1); } .pruhcerna2 { background: url(bg2.png) no-repeat right; background-size: contain; background-color: rgba(23, 23, 23, 1); } .pruhcerna1 { background: url(bg1.png) no-repeat left; background-size: contain; background-color: rgba(23, 23, 23, 1); } /* soubory */ div.soubornormal{ width: 22%; min-width: 340px; height: 480px; background-color: #fff; display: inline-block; vertical-align: top; float: none; /* margin-left: 5px; */ margin-top: 20px; margin-bottom: 20px; position: relative; z-index: 1; margin-left: 1%; margin-right: 1%; text-align: center; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } div.soubornormal .img{ display: inline-block; width: 90%; height: 340px; margin-top: 5%; } div.soubornormal p { position: relative; color: #636466; font-size: 15px; font-weight: 300; text-transform: none; margin-top: 10px; display: inline-block; width: 80%; margin-left: 10%; margin-right: 10%; margin-bottom: 20px; min-height: 50px; text-align: center; } div.soubor a.ram, div.soubornormal a.ram{ display: inline-block; bottom: 20px; left: 0px; z-index: 10; } .bannerek{ height: 500px; margin-bottom: 1px } .bannerek h2 { font-family: 'Rubik', serif; color: rgba(255, 255, 255, 1); font-size: 45px; line-height: 50px; font-weight: 600; position: relative; margin-top: 8%; margin-bottom: 20px; margin-left: 0px; width: auto; -webkit-text-shadow: 0px 50px rgba(0, 0, 0, .5); text-shadow: 0px 0px 50px rgba(0, 0, 0, .5); } .bannerek p { position: relative; color: rgba(255, 255, 255, 1); font-size: 20px; font-weight: 400; display: inline-block; line-height: 26px; margin-left: 0px; margin-right: 0px; padding-left: 30px; width: 90%; -webkit-text-shadow: 0px 50px rgba(0, 0, 0, .5); text-shadow: 0px 0px 50px rgba(0, 0, 0, .5); } .bannerek a.vice02 { margin-top: 30px; } .bannerek p:after { content: ""; position: absolute; left: 0px; top: 0px; width: 13px; height: 40px; background: url(sipka_prava.png); background-size: 13px; } /* soubor prouzek */ .souborprouzek { background: url(bg2.png) no-repeat right; background-size: 300px; background-color: rgba(23, 23, 23, 1); width: 100%; min-height: 100px; padding-top: 30px; padding-bottom: 30px; margin-bottom: 4%; position: relative; } .souborprouzek.formular { margin-top: 20px; margin-bottom: 0px; } #form_sub_kotva { margin-top: 200px; } .souborprouzek .uvnitr{ padding-left: 10%; } .souborprouzek .uvnitr h2.nadpis2{ color: #fff; margin-bottom: 0px; } .souborprouzek .uvnitr a.vice02{ position: absolute; right: 0px; top: -7px; } @media all and (max-width: 1246px) { .souborprouzek .uvnitr h2.nadpis2{ color: #fff; margin-bottom: 0px; max-width: 600px; } } @media all and (max-width: 1246px) { .souborprouzek .uvnitr h2.nadpis2{ color: #fff; margin-bottom: 0px; max-width: 600px; } } @media all and (max-width: 1024px) { .souborprouzek .uvnitr a.vice02{ position: relative; right: auto; top: auto; float: left; margin-top: 40px; } } .dod1{ display: inline-block; vertical-align: top; text-align: center; width: 30%; } .dod1 img{ max-width: 300px; max-height: 150px; width: auto; height: auto; } .dod2{ display: inline-block; vertical-align: top; text-align: left; width: 63%; margin-left: 5%; } @media all and (max-width: 1024px) { .dod1{ display: inline-block; vertical-align: top; text-align: center; width: 100%; } .dod1 img{ max-width: 300px; max-height: 150px; width: auto; height: auto; } .dod2{ display: inline-block; vertical-align: top; text-align: left; width: 100%; margin-left: 0%; } } a.you2, a.fcb2, a.insta2, a.pinerest2, a.twitter2, a.linked2 { display: inline-block; width: 60px; height: 40px; vertical-align: top; color: rgba(85, 86, 90, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } a.you2:hover, a.fcb2:hover, a.insta2:hover, a.pinerest2:hover, a.twitter2:hover, a.linked2:hover { color: rgba(241, 138, 0, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } p.hlaska { color: rgba(255, 255, 255, 1); padding: 15px; font-size: 18px; background: rgba(241, 138, 0, 1); } a.you2 span, a.fcb2 span, a.insta2 span, a.pinerest2 span, a.twitter2 span, a.linked2 span { display: none; } a.you2::before { content: "\f167"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } a.fcb2::before { content: "\f082"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } a.insta2::before{ content: "\f16d"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } a.pinerest2::before { content: "\f231"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } a.twitter2::before { content: "\f099"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } a.linked2::before { content: "\f0e1"; font-family: Font Awesome\ 5 Brands; background: none; top: 0px; left: 0px; font-size: 35px; } /* dobeckova navigace */ .pruhdrobeckova{ z-index: 100; width: 100%; text-align: center; position: absolute; } ul#nadpisy-kat{ z-index: 100; width: auto; margin-left: 0px; text-align: right; margin-bottom: 0px; padding-top: 0px; padding-bottom: 20px; padding-top: 20px; display: inline-block; float: right; } .mezera2{ width: 100%; clear: both; position: relative; height: 60px; } @media only screen and (max-width: 1024px) { .pruhdrobeckova{ z-index: 100; width: 100%; text-align: center; background-color: rgba(255, 255, 255, .5); position: relative; } .mezera2{ width: 100%; clear: both; position: relative; height: 20px; } .pruhdrobeckova .uvnitr{ width: 100%; } ul#nadpisy-kat{ z-index: 100; text-align: left; margin-bottom: 0px; width: 100%; float: none; } } ul#nadpisy-kat li{ vertical-align: top; display: inline-block; line-height: 20px; padding-left: 20px; position: relative; } ul#nadpisy-kat li::after{ position: absolute; content: '/'; font-size: 15px; font-weight: 100; right: 0px; right: -15px; color: rgba(112, 112, 112, 1); } ul#nadpisy-kat li:nth-last-of-type(1)::after{ position: absolute; content: ''; } ul#nadpisy-kat li a{ color: rgba(112, 112, 112, 1); font-size: 15px; font-weight: 300; position: relative; line-height: 20px; display: inline-block; text-decoration: underline } ul#nadpisy-kat li a.prvni{ color: rgba(112, 112, 112, 1); font-size: 15px; height: 20px; padding-right: 0px; margin-left: 0px; } ul#nadpisy-kat li a.aktivni{ font-weight: 600; text-decoration: none } /* cookie lista */ .CookiebotWidget-main-logo, #CybotCookiebotDialogHeader, #CybotCookiebotDialogPoweredbyCybot, #CybotCookiebotDialogDetailFooter, #CybotCookiebotDialogPoweredByText { display: none !important; } #CybotCookiebotDialogPoweredbyImage { } #CookiebotWidget { top: inherit !important; bottom: 100px !important; } #CybotCookiebotDialog.CybotEdge .CybotCookiebotDialogContentWrapper { } #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails a { display: block !important; position: relative; } #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails a:after { right: -13px; top: 9px; position: absolute; } #CybotCookiebotDialog.CybotEdge #CybotCookiebotDialogBodyEdgeMoreDetails a { color: rgba(241, 138, 0, 1) !important; } #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyButtonAccept, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonAccept, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll, #CookiebotWidget #CookiebotWidget-buttons #CookiebotWidget-btn-change { background-color: rgba(241, 138, 0, 1) !important; border-color: rgba(241, 138, 0, 1) !important; border-radius: 0px !important; color: #ffffff !important; font-weight: normal !important; font-family: Avenirnextcyr, sans-serif !important; } #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyButtonAccept:hover, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonAccept:hover, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover { background-color: #fff !important; color: rgba(241, 138, 0, 1) !important; } #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonCustomize, #CybotCookiebotDialogFooter #CybotCookiebotDialogBodyLevelButtonLevelOptinAllowallSelection, #CybotCookiebotDialogBodyButtonsWrapper #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton, #CookiebotWidget #CookiebotWidget-buttons #CookiebotWidget-btn-withdraw { border-radius: 0px !important; background-color: transparent; border-color: rgba(241, 138, 0, 1) !important; color: rgba(241, 138, 0, 1) !important; } #CybotCookiebotDialogNav .CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive { border-bottom: 1px solid rgba(241, 138, 0, 1) !important; color: rgba(241, 138, 0, 1) !important; } #CybotCookiebotDialogTabContent .CybotCookiebotDialogBodyLevelButtonSlider { background-color: #999 !important; } #CybotCookiebotDialogTabContent input:checked+.CybotCookiebotDialogBodyLevelButtonSlider { background-color: rgba(241, 138, 0, 1) !important; } .CookiebotWidget-show-consent-details, .CybotCookiebotDialogDetailBodyContentCookieProvider, .CybotCookiebotDialogDetailBodyContentCookieLink, .CybotCookiebotDialogDetailBodyContentCookieContainerButton:hover , .CybotCookiebotDialogNavItem:hover a { color: rgba(241, 138, 0, 1) !important; } #CookiebotWidget .CookiebotWidget-body .CookiebotWidget-consents-list li.CookiebotWidget-approved svg { fill: rgba(241, 138, 0, 1) !important; } #CookiebotWidget .CookiebotWidget-logo svg circle { fill: #666 !important; } #CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton { border-color: rgba(241, 138, 0, 1) !important; border-radius: 0px !important; color: rgba(241, 138, 0, 1) !important; font-weight: normal !important; } /* rezy konstrukci */ .rez{ width: 100%; position: relative; min-height: min-content; } .rez_fotka { width: 45%; min-width: 600px; display: inline-block; vertical-align: top; filter: brightness(93%); position: absolute; } .rez_popis { width: 100%; float: right; vertical-align: top; padding-left: 0px; } .rez_popis h2{ font-size: 22px; color: rgba(241, 138, 0, 1); margin-bottom: 20px; padding-left: 61%; } .rez_popis h3{ padding-left: 61%; font-size: 18px; margin-bottom: 0px; } .rez_popis p{ margin-left: 61%; margin-bottom: 10px; } .rez_popis ul{ margin-left: -0px; } .rez_popis ul li{ width: 100%; padding-left: 50%; margin-bottom: 0.5%; list-style: none } .rez_popis ul li strong{ color: rgba(241, 138, 0, 1); display: inline-block; width: 20%; font-weight: 500; padding-right: 15px; text-align: right; vertical-align: top; } .rez_popis ul li span{ width: 80%; display: inline-block; vertical-align: top; } .podstranky .rez_popis ul li:after { content: ""; position: absolute; right: 90%; left: auto; top: 4px; width: 16px; height: 18px; background: url(sestiuhelnik.png) no-repeat left; background-size: 16px; } .podstranky .rez_popis ul li:before { content: ""; position: absolute; right: 48%; width: 42%; top: 12px; background-color: rgba(35, 31, 32, 1); height: 1px; } /* 52 */ .podstranky .rez_popis ul li.delka52:after { right: 90%; left: auto; } .podstranky .rez_popis ul li.delka52:before { right: 48%; width: 42%; } /* 51 */ .podstranky .rez_popis ul li.delka51:after { right: 85%; left: auto; } .podstranky .rez_popis ul li.delka51:before { right: 48%; width: 38%; } /* 48 */ .podstranky .rez_popis ul li.delka48:after { right: 90%; left: auto; } .podstranky .rez_popis ul li.delka48:before { right: 48%; width: 42%; } /* 47 */ .podstranky .rez_popis ul li.delka47:after { right: 84%; left: auto; } .podstranky .rez_popis ul li.delka47:before { right: 48%; width: 37%; } /* 44 */ .podstranky .rez_popis ul li.delka44:after { right: 80%; left: auto; } .podstranky .rez_popis ul li.delka44:before { right: 48%; width: 33%; } /* 34 */ .podstranky .rez_popis ul li.delka34:after { right: 80%; left: auto; } .podstranky .rez_popis ul li.delka34:before { right: 48%; width: 33%; } /* 33 */ .podstranky .rez_popis ul li.delka33:after { right: 76%; left: auto; } .podstranky .rez_popis ul li.delka33:before { right: 48%; width: 29%; } /* 32 */ .podstranky .rez_popis ul li.delka32:after { right: 75%; left: auto; } .podstranky .rez_popis ul li.delka32:before { right: 48%; width: 27%; } /* 31 */ .podstranky .rez_popis ul li.delka31:after { right: 75%; left: auto; } .podstranky .rez_popis ul li.delka31:before { right: 48%; width: 27%; } /* 28 */ .podstranky .rez_popis ul li.delka28:after { right: 72%; left: auto; } .podstranky .rez_popis ul li.delka28:before { right: 48%; width: 24%; } /* 16 */ .podstranky .rez_popis ul li.delka16:after { right: 66%; left: auto; } .podstranky .rez_popis ul li.delka16:before { right: 48%; width: 19%; } ul.rozsahy { width: 100%; margin-bottom: 30px; background-color: #dcdcdc; } ul.rozsahy li { min-height: 300px; cursor: pointer; position: relative; width: 25%; display: inline-block; background-color: #dcdcdc; text-align: center; margin-left: 0px; padding: 20px; padding-top: 130px; vertical-align: top; min-height: 300px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; list-style: none } ul.rozsahy li:hover { background: rgb(220,220,220); background: linear-gradient(0deg, rgba(220,220,220,1) 10%, rgba(204,204,204,1) 50%, rgba(220,220,220,1) 90%); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.rozsahy li a { /* position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 2; display: none;*/ color: #FFFFFF; } ul.rozsahy li:nth-of-type(1):before, ul.rozsahy li:nth-of-type(2):before, ul.rozsahy li:nth-of-type(3):before { top: 10%; height: 80%; width: 1px; right: 0%; content: ""; position: absolute; background: rgba(235, 137, 4, 1); } @media all and (max-width: 840px) { ul.rozsahy li { width: 50%; min-height: none; } ul.rozsahy li:nth-of-type(1):before, ul.rozsahy li:nth-of-type(2):before, ul.rozsahy li:nth-of-type(3):before { top: 10%; height: 90%; width: 1px; right: 0%; content: ""; position: absolute; background: none; } ul.rozsahy:after { top: 50%; height: 1px; width: 90%; left: 5%; z-index: 2; content: ""; position: absolute; background: rgba(235, 137, 4, 1); } ul.rozsahy:before { top: 5%; height: 90%; z-index: 2; width: 1px; right: 50%; content: ""; position: absolute; background: rgba(235, 137, 4, 1); } } @media all and (max-width: 430px) { ul.rozsahy li { width: 100%; min-height: none; } ul.rozsahy li:nth-of-type(1):before, ul.rozsahy li:nth-of-type(2):before, ul.rozsahy li:nth-of-type(3):before { top: auto; bottom: 0px; height: 1px; width: 90%; right: 5%; content: ""; position: absolute; background: rgba(235, 137, 4, 1); } ul.rozsahy:after { display: none; } ul.rozsahy:before { display: none; } } ul.rozsahy li:nth-of-type(1):after { top: 20px; left: 50%; margin-left: -50px; content: ""; position: absolute; background: url(rozsah_1.png); width: 100px; height: 91px; background-size: 100px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.rozsahy li:nth-of-type(2):after { top: 20px; left: 50%; margin-left: -50px; content: ""; position: absolute; background: url(rozsah_2.png); width: 100px; height: 91px; background-size: 100px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.rozsahy li:nth-of-type(3):after { top: 20px; left: 50%; margin-left: -50px; content: ""; position: absolute; background: url(rozsah_3.png); width: 100px; height: 91px; background-size: 100px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.rozsahy li:nth-of-type(4):after { top: 20px; left: 50%; margin-left: -50px; content: ""; position: absolute; background: url(rozsah_4.png); width: 100px; height: 91px; background-size: 100px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.rozsahy li:hover:nth-of-type(1):after, ul.rozsahy li:hover:nth-of-type(2):after, ul.rozsahy li:hover:nth-of-type(3):after, ul.rozsahy li:hover:nth-of-type(4):after { -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; transform: scale(1.1); } ul.rozsahy li h2 { font-family: 'Rubik', sans-serif; color: rgba(235, 137, 4, 1); text-transform: uppercase; font-size: 20px; margin-bottom: 20px; font-weight: 400; line-height: 24px; } ul.rozsahy li.oznaceny, ul.rozsahy li.oznaceny:hover { background: #000000; background-color: #000000; } ul.rozsahy li.oznaceny p { color: rgba(255, 255, 255, 1); } table { width: auto; margin-bottom: 30px; display: inline-table; } table.rozsah { width: 100%; display: inline-table; margin-bottom: 0px; text-decoration: none } table td { background-color: rgba(236, 236, 236, 1); position: relative; color: #565658; padding: 20px; padding-top: 10px; padding-bottom: 10px; } table.rozsah.hidden { display: none; width: 100%; } table.rozsah td { background-color: rgba(236, 236, 236, 1); position: relative; color: #565658; padding: 20px; padding-top: 10px; padding-bottom: 10px; } table.rozsah td:after { top: 5px; left: 50%; margin-left: -12px; content: ""; position: absolute; background: url(rozsah1.png); width: 24px; height: 28px; background-size: 24px; } table.rozsah td.ano:after { top: 5px; left: 50%; margin-left: -12px; content: ""; position: absolute; background: url(rozsah2.png); width: 24px; height: 28px; background-size: 24px; } table.rozsah tr td:nth-of-type(1):after{ display: none; } table.rozsah tr th{ background-color: rgba(235, 137, 4, 1); color: rgba(255, 255, 255, 1); font-family: 'Rubik', serif; text-align: center; padding: 20px } @media all and (max-width: 430px) { table.rozsah tr th, table.rozsah tr td { padding: 10px } } table.rozsah tr th:nth-of-type(1), table tr th:nth-of-type(1) { text-transform: uppercase; background-color: rgba(123, 124, 126, 1); text-align: left; } table.rozsah tr:nth-of-type(2n) td, table tr:nth-of-type(2n) td { background-color: rgba(255, 255, 255, 1); } table.rozsah tr td.oznaceny, table.rozsah tr th.oznaceny { background-color: #000000; } /* filtr */ .vybrane { padding-top: 15px; padding-bottom: 15px; } .vybrane button { position: relative; display: inline-block; float: left; -moz-border-radius: 5px 5px 5px 5px; width: auto; -webkit-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; margin: 5px; margin-left: 0px; margin-top: 5px; padding: 4px 4px; padding-right: 24px; margin-bottom: 0; font-size: 14px; line-height: 20px; color: #333; text-align: center; text-shadow: 0 1px 1px rgb(255 255 255 / 75%); vertical-align: middle; cursor: pointer; background-color: #ffffff; border: 1px solid #ccc; text-transform: none; } .vybrane button:after { position: absolute; right: 6px; top: 3px; color: #000000; content: "x"; font-weight: 500; font-size: 16px; } .vybrane button:hover { color: #000; background-color: #ccc; border: 1px solid #999999; text-transform: none; } .dalsi_clanky{ background-color: rgba(229, 229, 229, 1); width: 100%; padding: 20px } .dalsi_clanky .dalsi_clanek{ background-color: rgba(255, 255, 255, 1); width: 23%; height: 120px; padding: 10px; text-align: left; display: inline-block; vertical-align: top; margin: 1% } @media all and (max-width: 1300px) { .dalsi_clanky .dalsi_clanek{ background-color: rgba(255, 255, 255, 1); width: 48%; height: 120px; padding: 10px; text-align: left; display: inline-block; vertical-align: top; margin: 1% } } @media all and (max-width: 800px) { .dalsi_clanky .dalsi_clanek{ background-color: rgba(255, 255, 255, 1); width: 98%; height: 120px; padding: 10px; text-align: left; display: inline-block; vertical-align: top; margin: 1% } } .dalsi_clanky .dalsi_clanek img{ float: left; margin-right: 15px; } .dalsi_clanky .dalsi_clanek h3{ font-size: 16px; float: left; display: contents; } .podstranky .dalsi_clanky .dalsi_clanek h3 a{ text-decoration: underline } .dalsi_clanky .dalsi_clanek p.popis_clanek{ font-size: 14px; float: left; } .podstranky a.ram{ text-decoration: none } /* kontakty portrety */ .podstranky .bunkakontakt{ width: 48%; height: 200px; background-color: rgba(255, 255, 255, 1); float: left; margin-bottom: 45px; } .podstranky .bunkakontakt:nth-child(2n) { float: right } @media all and (max-width: 1115px) { .podstranky .bunkakontakt{ width: 100%; height: 200px; background-color: rgba(255, 255, 255, 1); float: left; margin-bottom: 45px; } .podstranky .bunkakontakt:nth-child(2n) { float: left } } .podstranky .bunkakontakt a.nahled{ width: 150px; height: 200px; float: left; } .podstranky .bunkakontakt ul{ float: left; margin-top: 15px; } .podstranky .bunkakontakt ul li{ list-style: none; line-height: 40px; color: rgba(112, 112, 112, 1); } .podstranky .bunkakontakt ul li a{ color: rgba(112, 112, 112, 1); text-decoration: none } .podstranky .bunkakontakt ul li:after{ display: none; } .podstranky .bunkakontakt ul li.jmeno{ font-size: 28px; font-family: 'Rubik', serif; font-weight: 400; } .podstranky .bunkakontakt ul li.pozice{ font-size: 16px; font-weight: 500; color: rgba(241, 138, 0, 1); } .podstranky .bunkakontakt ul li.email, .podstranky .bunkakontakt ul li.telefon{ padding-left: 40px; } .podstranky .bunkakontakt ul li.email::before { content: ""; background: url(126-email-2.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: 0px; margin-left: 0px; top: 5px; } .podstranky .bunkakontakt ul li.telefon::before { content: ""; background: url(161-smartphone-1.svg) no-repeat; background-size: 29px; width: 40px; height: 40px; position: absolute; left: 0; margin-left: 0px; top: 5px; } @media all and (max-width: 600px) { .podstranky .bunkakontakt{ width: 100%; height: 120px; background-color: rgba(255, 255, 255, 1); float: left; margin-bottom: 20px; } .podstranky .bunkakontakt a.nahled{ width: 90px; height: 120px; float: left; } .podstranky .bunkakontakt a.nahled img{ width: 90px; height: 120px; } .podstranky .bunkakontakt ul li{ line-height: 23px; } .podstranky .bunkakontakt ul li.jmeno{ font-size: 20px; font-family: 'Rubik', serif; font-weight: 400; } .podstranky .bunkakontakt ul li.pozice{ font-size: 14px; font-weight: 500; color: rgba(241, 138, 0, 1); } .podstranky .bunkakontakt ul li.email::before { content: ""; background: url(126-email-2.svg) no-repeat; background-size: 15px; width: 20px; height: 20px; position: absolute; left: 0px; margin-left: 0px; top: 6px; } .podstranky .bunkakontakt ul li.telefon::before { content: ""; background: url(161-smartphone-1.svg) no-repeat; background-size: 15px; width: 20px; height: 20px; position: absolute; left: 0; margin-left: 0px; top: 6px; } .podstranky .bunkakontakt ul li.email, .podstranky .bunkakontakt ul li.telefon{ padding-left: 20px; } .podstranky .bunkakontakt ul li.email a, .podstranky .bunkakontakt ul li.telefon a{ font-size: 14px } } .sestiuhelnik{ background: url(sestiuhelnik_tl_orange.svg); background-size: 200px; width: 200px; height: 222px; position: relative; display: inline-block; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; margin-right: 90px; vertical-align: top; } .sestiuhelnik p{ font-size: 16px; position: absolute; top: 50px; width: 200px; margin-top: 40px; text-align: center; font-weight: 500; text-transform: uppercase; color: rgba(153, 153, 153, 1); } .sestiuhelnik p a{ color: rgba(153, 153, 153, 1); } .sestiuhelnik:nth-of-type(3) p{ font-size: 16px; position: absolute; top: 50px; width: 200px; margin-top: 20px; } .sestiuhelnik:nth-of-type(1):after { content: "+"; font-size: 100px; color: rgba(204, 204, 204, 1); position: absolute; right: -80px; top: 50px; } .sestiuhelnik:nth-of-type(3) { margin-right: 0px; } .sestiuhelnik:nth-of-type(2):after { content: "="; font-size: 100px; color: rgba(204, 204, 204, 1); position: absolute; right: -80px; top: 50px; } @media all and (max-width: 880px) { .sestiuhelnik{ background: url(sestiuhelnik_tl_orange.svg) no-repeat; background-size: 160px; width: 160px; height: 180px; position: relative; display: inline-block; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; margin-right: 50px; vertical-align: top; } .sestiuhelnik p{ font-size: 13px; position: absolute; top: 20px; width: 160px; margin-top: 40px; text-align: center; font-weight: 500; text-transform: uppercase; color: rgba(153, 153, 153, 1); } .sestiuhelnik p a{ color: rgba(153, 153, 153, 1); } .sestiuhelnik:nth-of-type(3) p{ font-size: 13px; position: absolute; top: 20px; width: 160px; margin-top: 20px; } .sestiuhelnik:nth-of-type(1):after { content: "+"; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: -52px; top: 40px; } .sestiuhelnik:nth-of-type(3) { margin-right: 0px; } .sestiuhelnik:nth-of-type(2):after { content: "="; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: -52px; top: 40px; } } @media all and (max-width: 652px) { .sestiuhelnik{ background: url(sestiuhelnik_tl_orange.svg) no-repeat top center; background-size: 160px; width: 160px; height: 180px; position: relative; display: inline-block; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; margin-right: 50px; vertical-align: top; margin-left: 0px } .sestiuhelnik:nth-of-type(2), .sestiuhelnik:nth-of-type(3) { margin-left: 0px; margin-right: 0px; } .sestiuhelnik:nth-of-type(3) { margin-left: 0px; width: 300px; margin-right: 0px; } .sestiuhelnik p{ font-size: 13px; position: absolute; top: 20px; width: 160px; margin-top: 40px; text-align: center; font-weight: 500; text-transform: uppercase; color: rgba(153, 153, 153, 1); } .sestiuhelnik p a{ color: rgba(153, 153, 153, 1); } .sestiuhelnik:nth-of-type(3) p{ font-size: 13px; position: absolute; top: 20px; width: 300px; margin-top: 20px; } .sestiuhelnik:nth-of-type(1):after { content: "+"; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: -52px; top: 40px; } .sestiuhelnik:nth-of-type(3) { margin-right: 0px; } .sestiuhelnik:nth-of-type(2):after { content: "="; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: 0px; left: -210px; top: 100px; } } @media all and (max-width: 416px) { .sestiuhelnik{ background: url(sestiuhelnik_tl_orange.svg) no-repeat top center; background-size: 160px; width: 300px; height: 240px; position: relative; display: inline-block; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; margin-right: 0px; vertical-align: top; margin-left: 0px } .sestiuhelnik:nth-of-type(2), .sestiuhelnik:nth-of-type(3) { margin-left: 0px; margin-right: 0px; } .sestiuhelnik:nth-of-type(3) { margin-left: 0px; margin-right: 0px; height: 200px; } .sestiuhelnik p{ font-size: 13px; position: absolute; top: 20px; width: 300px; margin-top: 40px; text-align: center; font-weight: 500; text-transform: uppercase; color: rgba(153, 153, 153, 1); } .sestiuhelnik p a{ color: rgba(153, 153, 153, 1); } .sestiuhelnik:nth-of-type(3) p{ font-size: 13px; position: absolute; top: 20px; width: 300px; margin-top: 20px; } .sestiuhelnik:nth-of-type(1):after { content: "+"; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: 124px; top: 160px; } .sestiuhelnik:nth-of-type(3) { margin-right: 0px; } .sestiuhelnik:nth-of-type(2):after { content: "="; font-size: 80px; color: rgba(204, 204, 204, 1); position: absolute; right: 124px; top: 160px; left: auto; } } .osa { width: 75%; } ul.osa li { display: inline-block; vertical-align: top; width: 220px; margin-top: 90px; margin-left: 0px; position: relative; text-align: right; height: 100px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.osa li:nth-of-type(1):hover:after { transform: scale(1.1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.osa li:after { -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; position: absolute; content:""; left: 80px; top: -70px; width: 160px; height: 160px; border-radius: 50%; background: rgba(0, 158, 224, 1); z-index: -10; } ul.osa li a { position: absolute; left: 0px; top: -90px; width: 100%; height: 160px; z-index: 10; display: block; } .konttext1, .konttext2 { margin-left: 0%; position: relative; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .konttext2:after { content:""; position: absolute; left: 65%; top: -40px; background: url(sipka.png); width: 240px; height: 69px; background-size: 240px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .konttext1.hidden { margin-left: -100%; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .konttext2.hidden { margin-left: -100%; position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } ul.osa li strong { position: absolute; color: rgba(255, 255, 255, 1); font-size: 130px; z-index: 1; font-size: 130px; font-weight: 600; top: -45px; right: -60px; text-align: center; width: 180px; } ul.osa li p { position: absolute; color: rgba(255, 255, 255, 1); font-size: 16px; font-weight: 600; text-transform: uppercase; top: 25px; right: -18px; width: 160px; text-align: center; } ul.osa li p::before { content: ""; position: absolute; right: -50%; margin-right: 40px; top: -20px; width: 30px; height: 30px; border-right: solid 5px rgba(245, 245, 245, 1); border-top: solid 5px rgba(245, 245, 245, 1); transform: rotate(45deg) } ul.osa li p.posledni::before { display: none; } /*h2.nadpis2:after { content: ""; left: 0px; top: -50px; opacity: .4; position: absolute; z-index: -1; width: 340px; height: 340px; background: url(icon.png); filter: contrast(90%); background-size: 340px; }*/ @media all and (max-width: 1330px) { ul.osa { width: 100%; float: none; } .konttext2:after { content:""; position: absolute; left: 62%; top: 120px; background: url(sipka.png); width: 240px; height: 69px; background-size: 240px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; transform: rotate(110deg); } } @media all and (max-width: 1024px) { .konttext2:after { content: ""; position: absolute; left: 80%; top: 70px; background: url(sipka.png); width: 200px; height: 58px; background-size: 200px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; transform: rotate(70deg); } ul.osa li p::before { display: none; } ul.osa li { display: inline-block; vertical-align: top; width: 160px; margin-top: 90px; margin-left: 0px; position: relative; text-align: right; height: 100px; } ul.osa li:after { position: absolute; content:""; left: 10px; top: -70px; width: 140px; height: 140px; border-radius: 50%; background: rgba(0, 158, 224, 1); z-index: -10; } ul.osa li strong { position: absolute; color: rgba(255, 255, 255, 1); font-size: 130px; font-size: 100px; font-weight: 600; top: -45px; right: -20px; text-align: center; width: 140px; } ul.osa li p { position: absolute; color: rgba(255, 255, 255, 1); font-size: 16px; font-weight: 600; text-transform: uppercase; top: 10px; right: 0px; width: 160px; text-align: center; } } /* tlacitko nahoru */ #back-top { position: fixed; bottom: 15px; right: 10px; z-index: 100; } #back-top a { width: 40px; height: 40px; display: block; text-decoration: none; color: #fff; /* zpomalování */ -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; background-color:rgba(0, 158, 224, 1); position: relative; z-index: 11111111; } #back-top a:hover { color: #fff; } #back-top a::before { content: "\f105"; font-family:"FontAwesome"; text-align: center; top: 0px; right: 0px; font-size: 32px; font-weight: 100; position: absolute; z-index: 11111111; color: rgba(255, 255, 255, 1); width: 40px; height: 40px; line-height: 40px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } top-600{ margin-top: -600px; } .top-700{ margin-top: -700px; } .top40{ margin-top: 40%; } .top30{ margin-top: 30%; } .left, .right{ width: 50%; display: inline-block; vertical-align: top; text-align: left; } .bun40{ width: 40%; display: inline-block; vertical-align: top; text-align: left; position: relative; } .bun60{ width: 60%; display: inline-block; vertical-align: top; text-align: left; position: relative; } .bun30{ width: 30%; display: inline-block; vertical-align: top; text-align: left; position: relative; z-index: 2; } .bun70{ width: 69.5%; display: inline-block; vertical-align: top; text-align: left; position: relative; } .bun50{ width: 50%; display: inline-block; vertical-align: top; text-align: left; } .bun50.mensi{ width: 49%; display: inline-block; vertical-align: top; text-align: left; } .bun44{ width: 44%; display: inline-block; vertical-align: top; } .bun44.mez{ width: 44%; margin-right: 8%; } .height600{ height: 600px; } @media all and (max-width: 600px) { .bun50, .bun44{ width: 100%; float: left; } .bun44.mez{ width: 100%; margin-right: 0%; } .height600{ height: auto; } .top40{ margin-top: 0%; } .top30{ margin-top: 0%; } .bun40, .bun60, .bun30, .bun70 { width: 100%; display: inline-block; vertical-align: top; text-align: left; position: relative; } } .left{ position: sticky; position: -webkit-sticky; top: 0; z-index: 3; } .bunka100{ position: relative; z-index: 10; width: 100%; height: 700px; float: left; overflow: hidden; border: solid 0.5px #fafafa; border-left: 0px } .bunka100 img, .bunka50 img{ position: absolute; height: 100%; min-width: 100% -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka100:hover img, .bunka50:hover img{ -webkit-transition: all 10s; -moz-transition: all 10s; -ms-transition: all 10s; -o-transition: all 10s; transition: all 10s; transform: scale(2) } .bunka100 a.vse, .bunka50 a.vse, .bunka30 a.vse{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 4; } .bunka100 h3 a, .bunka50 h3 a{ color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; text-decoration: none } .bunka30 h3 a{ color: rgba(0, 0, 0, 1); text-decoration: none ; font-weight: 400; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka100 .text, .bunka50 .text{ bottom: 5%; position: absolute; width: 100%; } .ostatni .bunka100 .text, .ostatni .bunka50 .text{ bottom: 30%; position: absolute; width: 100%; } .bunka100 h3{ font-size: 40px; font-weight: bold; width: 100%; padding-left: 10%; padding-right: 5%; padding-bottom: 15px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; z-index: 2; position: relative; } .ostatni .bunka50 h3 , .ostatni .bunka50:hover h3 { padding-left: 0px; padding-bottom: 15px; } .ostatni .bunka30 p { } .ostatni .bunka30 h3 { padding-bottom: 0px; margin-bottom: 10px; min-height: 50px; font-size: 21px; } .ostatni .bunka50 h3 a, .ostatni .bunka50:hover h3 a { color: rgba(0, 0, 0, 1); } .ostatni .bunka50 .text h3 a { color: rgba(255, 255, 255, 1); } .bunka50 .text h3, .bunka50:hover .text h3{ font-size: 24px; font-weight: bold; width: 100%; padding-left: 10%; padding-right: 5%; margin-bottom: 0px; padding-bottom: 15px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; z-index: 2; position: relative; } .bunka100 ul li a, .bunka50 ul li a, .bunka100 p, .bunka50 p { font-size: 14px; font-weight: 400; padding-left: 0px; padding-right: 5px; display: inline-block; color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka100 ul, .bunka50 ul, .bunka100 p, .bunka50 p{ position: relative; z-index: 2; padding-left: 0px; margin-left: 10%; } .bunka100 ul li, .bunka50 ul li{ padding-left: 0px; margin-left: 0px; list-style: none; display: inline-block; margin-right: 5px } .bunka50{ position: relative; width: 50%; height: 350px; float: left; border: solid 0.5px #fafafa; overflow: hidden } .ostatni .bunka50{ position: relative; width: 49%; min-height: 490px; float: left; border: solid 0px rgba(255, 255, 255, 1); margin-bottom: 3%; margin-right: 2%; } .ostatni .bunka30{ position: relative; width: 31%; height: 450px; min-height: 450px; float: left; background-color: #ffffff; padding: 1%; margin-bottom: 3%; margin-right: 2%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30 ul.popisky li { width: 100%; text-align: left; font-family: 'Rubik', sans-serif; color: rgba(112, 112, 112, 1); font-size: 16px; font-weight: 400; margin-top: 0px; position: relative; line-height: 40px; list-style: none; height: 40px; border-top: solid 1px rgba(204, 204, 204, .2); margin-bottom: 0px; margin-left: 0px; padding-top: 4px; padding-bottom: 4px; padding-left: 30px; } .ostatni .bunka30.reference{ position: relative; width: 96%; margin: 2%; margin-bottom: 2%; margin-top: 0%; height: 300px; min-height: min-content; float: left; border: solid 0px rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30.reference .nahled{ width: 30%; margin: 2%; height: 86%; display: inline-block; float: left; } .ostatni .bunka30.reference .popisreference{ width: 62%; margin: 2%; margin-left: 0px; margin-right: 2%; height: 80%; display: inline-block; float: left; } .ostatni .bunka30.reference p.zarazeni { min-height: 10px; } .ostatni .bunka30.reference p.spotreba { min-height: 10px; padding: 10px; padding-left: 20px; padding-right: 20px; background: rgba(6, 158, 87, 1); float: left; width: 170px; height: 110px; margin-top: 20px; color: white; position: relative; } .ostatni .bunka30.reference p.spotreba:after { content: ""; transform: rotate(-45deg); width: 40px; height: 40px; background: rgba(6, 158, 87, 1); position: absolute; right: -20px; top: 36px; } .ostatni .bunka30.reference p.plocha { min-height: 10px; margin-top: 30px; float: left; margin-left: 130px; position: relative; } .ostatni .bunka30.reference p.plocha:after { content: ""; background: url(plocha.png); width: 70px; height: 70px; background-size: 70px; position: absolute; left: -80px; top: 8px; } .ostatni .bunka30.reference p.spotreba strong, .ostatni .bunka30.reference p.plocha strong{ font-size: 30px; } .ostatni .bunka30.reference p.spotreba strong sup, .ostatni .bunka30.reference p.plocha strong sup{ font-size: 18px; } .ostatni .bunka30.reference h3 a { font-size: 24px; font-weight: 700; } @media all and (max-width: 900px) { .ostatni .bunka30.reference { height: auto; padding-bottom: 30px; } .ostatni .bunka30.reference .nahled{ width: 200px; margin-top: 5%; height: 200px; margin-left: -100px; left: 50%; display: inline-block; float: left; } .ostatni .bunka30.reference .popisreference{ width: 100%; text-align: center; float: left; } .ostatni .bunka30.reference p.spotreba { min-height: 10px; padding: 10px; padding-left: 20px; padding-right: 20px; background: rgba(6, 158, 87, 1); float: none; display: inline-block; width: 70%; height: auto; margin-top: 20px; color: white; position: relative; } .ostatni .bunka30.reference p.spotreba:after { content: ""; transform: rotate(-45deg); width: 20px; height: 20px; background: rgba(6, 158, 87, 1); position: absolute; right: 50%; margin-right: -10px; top: auto; bottom: -8px; z-index: 0; } .ostatni .bunka30.reference p.plocha { min-height: 10px; margin-top: 30px; float: none; margin-left: 130px; display: inline-block; position: relative; } } .ostatni .bunka30.akt{ position: relative; width: 31%; height: 470px; min-height: 470px; float: left; border: solid 0px rgba(255, 255, 255, 1); margin-bottom: 3%; margin-right: 2%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30 a.vice{ opacity: 0; color: rgba(0, 0, 0, 1); font-weight: 400; text-decoration: none; position: absolute; bottom: 20px; right: 2%; padding: 10px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30:hover a.vice{ opacity: 1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30 a.vice:after{ content: "+"; width: 40px; height: 40px; position: absolute; left: -40px; top: 2px; font-size: 30px; line-height: 40px; text-align: center; color: rgba(255, 255, 255, 1); background-color: rgba(242, 79, 17, 1); border-radius: 50%; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka50 .nahled{ position: relative; width: 100%; height: 75%; margin-bottom: 2%; overflow: hidden; } .ostatni .bunka30 .nahled{ position: relative; width: 100%; height: 50%; margin-bottom: 2%; overflow: hidden; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30:hover .nahled{ filter: brightness(0.7); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka30.akt p.datum{ color: rgba(235,91,37, 1); margin-bottom: 0px; height: auto; min-height: auto } .ostatni .bunka30.akt h3 { padding-bottom: 15px; height: 80px; font-size: 21px; } .ostatni .bunka50:nth-child(2n) { position: relative; width: 49%; float: left; margin-right: 0%; margin-bottom: 2%; } .ostatni .bunka30:nth-child(3n) { position: relative; float: left; margin-right: 0%; /*margin-bottom: 2%;*/ } .ostatni .bunka50.twenty{ height: auto; min-height: auto; overflow: hidden; display: inline-block; vertical-align: top; } .ostatni .bunka50.twenty:nth-child(2n) { height: auto; min-height: auto; overflow: hidden; display: inline-block; vertical-align: top; margin-right: 0%; margin-bottom: 2%; } .os .bunka100:after, .bunka50:after{ content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0, 0); background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.6) 100%); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni .bunka100:after, .ostatni .bunka50:after{ display: none } .ostatni .bunka100 a.vse:after, .ostatni .bunka50 a.vse:after{ content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 75%; min-height: 300px; background: rgba(0,0,0, 0); background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.6) 100%); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni.vypis .bunka50 { min-height: 460px; } .ostatni.vypis .bunka50 .nahled{ height: 80%; } .ostatni .bunka50:hover a.vse:after{ content: ""; position: absolute; left: 0px; top: 0px; height: 75%; width: 100%; background: rgba(255, 255, 255, .85); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni.vypis .bunka50 .nahled:after{ content: ""; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0, 0); background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.6) 100%); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni.vypis .bunka50:hover .nahled:after{ content: ""; position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; background: rgba(255, 255, 255, .7); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .ostatni.vypis .bunka100 a.vse:after, .ostatni.vypis .bunka50 a.vse:after{ display: none; } .bunka50:last-of-type:after{ content: ""; position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; background: rgba(255, 255, 255, .7); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka50:after, .bunka100:after{ content: ""; position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; background: rgba(255, 255, 255, 0); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka50:hover:after, .bunka100:hover:after{ content: ""; position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; background: rgba(255, 255, 255, .7); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka50:last-of-type a.link{ font-size: 18px; font-weight: 600; width: 100%; top: 50%; left: 0px; position: absolute; text-align: center; z-index: 1; color: rgba(0, 0, 0, 1); text-decoration: underline; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka50:last-of-type a.link:hover,.bunka50:hover:last-of-type a.link { -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; text-decoration: none; /*color: rgba(1, 179, 225, 1)*/; } .bunka100:hover .text h3 a, .bunka100:hover .text ul li a, .bunka50:hover .text h3 a, .bunka50:hover .text ul li a, .bunka100:hover .text p, .bunka50:hover .text p { color: rgba(0, 0, 0, 1); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .bunka50:hover, .bunka100:hover { -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -ms-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } /* mobil levy pravy sloupec */ @media all and (max-width: 900px) { .uvnitr{ } .left, .right{ width: 100%; position: relative; } .top-600, .top-700{ margin-top: -30px; padding: 0px } .ostatni .bunka30, .ostatni .bunka30.akt{ width: 49%; } .ostatni .bunka30:nth-child(2n) { position: relative; width: 49%; margin-right: 0%; margin-bottom: 2%; } .ostatni .bunka30:nth-child(3n) { position: relative; width: 49%; margin-right: 2%; margin-bottom: 2%; } .ostatni .bunka30.reference:nth-child(2n) { position: relative; width: 96%; margin-right: 2%; margin-bottom: 2%; } .ostatni .bunka30.reference:nth-child(3n) { position: relative; width: 96%; margin-right: 2%; margin-bottom: 2%; } .bunka100{ width: 100%; border: solid 0.5px rgba(255, 255, 255, 1); border-left: solid 0.5px rgba(255, 255, 255, 1) } .bunka50 { margin-bottom: 0px; } .bunka50 .text{ /* bottom: auto; top: 350px; position: absolute; width: 100%;*/ } /* .bunka50 .text h3, .bunka50 .text ul { margin-bottom: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; margin-left: 0px; } .bunka50 .text h3 a, .bunka50 .text ul li a{ color: rgba(0, 0, 0, 1); } .bunka50:last-of-type a.link{ top: 350px; text-align: left; font-size: 24px; font-weight: bold; } */ .ostatni .bunka50 .text{ top: auto; position: absolute; width: 100%; } .ostatni .bunka50 .text h3, .ostatni .bunka50 .text ul { margin-bottom: 0px; padding-bottom: 0px; padding-left: 5%; padding-right: 0px; margin-left: 0px; } .ostatni .bunka50 .text h3 a, .ostatni .bunka50 .text ul li a{ color: rgba(255, 255, 255, 1); } } @media all and (max-width: 600px) { .bunka100{ height: 380px; margin-bottom: -30px; } .bunka50 { /* margin-bottom: 60px;*/ height: 250px; } .bunka50 .text{ } .ostatni .bunka100 a.vse:after, .ostatni .bunka50 a.vse:after{ height: auto; min-height: 300px; } .ostatni.vypis .bunka50, .ostatni .bunka50 { min-height: min-content; margin-bottom: 45px; } .bunka50 .text h3, .bunka50:hover .text h3 { font-size: 16px; /* margin-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-bottom: 0px;*/ } .ostatni .bunka50 h3, .ostatni .bunka50:hover h3 { padding-left: 20px; } .ostatni .bunka50 h3 a, .ostatni .bunka50:hover h3 a { font-size: 17px; font-weight: bold } .bunka50:last-of-type a.link{ font-size: 17px; font-weight: bold; text-align: center; } .bunka50 .text ul li a{ font-size: 9px; float: left; } .bunka100 ul li a, .bunka50 ul li a { font-size: 9px; } .ostatni .bunka30, .ostatni .bunka30.akt, .ostatni .bunka30:nth-child(2n), .ostatni .bunka30:nth-child(3n) { width: 100%; margin-bottom: 20px; } .ostatni .bunka30 h3, .ostatni .bunka30:nth-child(2n) h3, .ostatni .bunka30:nth-child(3n) h3, .ostatni .bunka30 a.vice, .ostatni .bunka30:nth-child(2n) a.vice, .ostatni .bunka30:nth-child(3n) a.vice, .ostatni .bunka30 p, .ostatni .bunka30:nth-child(2n) p, .ostatni .bunka30:nth-child(3n) p { padding-left: 20px; padding-right: 20px; } .ostatni .bunka50, .ostatni .bunka50:nth-child(2n), .ostatni.vypis .bunka50:nth-child(2n) { width: 100%; height: auto; min-height: min-content; margin-bottom: 45px; } .ostatni .bunka50 .nahled, .ostatni .bunka50:nth-child(2n) .nahled { min-height: 300px; } .ostatni .bunka50 .text{ top: auto; margin-top: 10px; bottom: auto; position: relative; width: 100%; padding-left: 20px; padding-right: 20px; } .ostatni .bunka50 p{ padding-left: 20px; padding-right: 20px; } .ostatni .bunka50 .text ul { display: none; } .ostatni .bunka50 .text h3{ padding-left: 0px; margin-bottom: 15px; } .ostatni .bunka50 .text h3 a{ color: rgba(0, 0, 0, 1); } .ostatni{ padding-left: 0px; padding-right: 0px; } } ul.parametry { position: absolute; right: 0px; bottom: 80px; z-index: 111; width: 46%; background-color: rgba(255, 255, 255, 1); padding: 2% } @media all and (max-width: 1024px) { ul.parametry { position: relative; right: 0px; margin-top: 30px; z-index: 111; width: 100%; background-color: rgba(255, 255, 255, 1); padding: 2% } } ul.parametry li { list-style: none; min-height: 48px; line-height: 48px; padding-left: 20px; padding-right: 20px; clear: both } ul.parametry li:last-child { padding: 15px; padding-top: 5px } ul.parametry li strong { float: right; } ul.parametry li h3 { color: black; margin-bottom: 10px; margin-left: 0px; padding-bottom: 0px; } ul.parametry li:nth-child(odd) { background-color: #ffffff; /* SvÄ›tle šedá */ } ul.parametry li:nth-child(even) { background-color: #f5f5f5; /* BĂ­lá */ } ul.parametry li h4 { color: black; line-height: 20px; font-weight: 700; margin-top: 30px; margin-bottom: 30px; } ul.parametry li h4 strong { color: rgba(235, 91, 37, 1); float: none; }