
/* Globalni styly */

* {
	vertical-align: baseline;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	font-size: 100%;
	border: 0 none;
	outline: 0;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	max-width: 100%;
}

html {
	scroll-behavior: smooth;
}

head {
	display: none;
}


body {
	font-family: 'Barlow', sans-serif;
	font-size: 24px;
	overflow-y: scroll;
	min-width: 260px;

	background-repeat: no-repeat;
	background-size: contain;
	background-position: top left, bottom 400px left;
	-webkit-animation-name: usvit;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-fill-mode: forwards;

	-moz-animation-name: usvit;
	-moz-animation-duration: 0.5s;
	-moz-animation-iteration-count: 1;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-fill-mode: forwards;

	-ms-animation-name: usvit;
	-ms-animation-duration: 0.5s;
	-ms-animation-iteration-count: 1;
	-ms-animation-timing-function: ease-in-out;
	-ms-animation-fill-mode: forwards;

	-o-animation-name: usvit;
	-o-animation-duration: 0.5s;
	-o-animation-iteration-count: 1;
	-o-animation-timing-function: ease-in-out;
	-o-animation-fill-mode: forwards;

	animation-name: usvit;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;
}

@-webkit-keyframes usvit{
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@-moz-keyframes usvit{
    0% {-moz-opacity: 0;}
    100% {-moz-opacity: 1;}
}
@-sm-keyframes usvit{
    0% {-moz-opacity: 0;}
    100% {-moz-opacity: 1;}
}
@-o-keyframes usvit{
    0% {-moz-opacity: 0;}
    100% {-moz-opacity: 1;}
}
@keyframes usvit{
    0% {opacity: 0;}
    100% {opacity: 1;}
}

a {
    cursor: pointer;
	color: #00898F;
    text-decoration: underline;
}

.editor .priloha,
.editor img{
    width: unset !important;
    height: auto !important;
}

input, select, label {
	vertical-align: middle;
}

label {
	cursor: pointer;
}

input[type=text],
input[type=password],
input[type=number],
input:not([type]),
textarea,
select{
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 10px;
	color: black !important;
}


input[type=button],
input[type=submit] {
	background-color: #fff;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.5s;
    border-radius: 10px;
    box-shadow: 0 5px 10px 0 black;
    color: black !important;
    min-width: 240px;
    text-transform: uppercase;
}

input[type=submit]:hover {
    text-decoration: underline;
}

input::placeholder {
	color: #aaaaaa;
}


.priloha .text {
	display: block;
	text-align: center;
	font-size: 0.5rem;
}

table {
	clear: both;
	width: 100%;
}

.text.editor table:not(.zakladniTabulka) td {
	padding: 0px 10px 0px 0px;
	vertical-align: top;
}

hr {
	border-bottom: 1px solid #777777;
}

h1, h2, p, ul, ol, table, hr {
	margin: 0px 0px 0px 0px;
}

h1 {
    font-size: min(3.5rem, 8vw);
    font-weight: bold;
    margin-bottom: 1rem;
}

h2 {
    font-weight: bold;
    font-size: min(2.5rem, 8vw);
    margin-bottom: 1rem;
}
.editor h2{
    color: #00898F;
}

h3 {
    font-weight: bold;

}

ul {
    padding-left: 20px;
}

ol {
    padding-left: 20px;
}

strong {
	font-weight: bold;
}

em {
	font-style: italic;
}


.povinnePolicko,
.upozorneni,
.upozorneni a {
	color: #cc0000;
	font-weight: bold;
}

.vnitrek{
    display: block;
    clear: both;
    width: 1280px;
    margin: auto;
    padding: 0 10px;
    max-width: 100%;
}

.flex{
    display: flex;
}
@media only screen and (max-width:1024px){
    input[type=button], input[type=submit] {
        min-width: unset;
    }
    footer .obsah .komponentaSlozka table,
    footer .obsah .komponentaSlozka tbody,
    footer .obsah .komponentaSlozka thead,
    footer .obsah .komponentaSlozka tfoot,
    footer .obsah .komponentaSlozka tr,
    footer .obsah .komponentaSlozka td,
    .editor table,
    .editor tbody,
    .editor thead,
    .editor tfoot,
    .editor tr,
    .editor td{
        display: block !important;
        width: 100% !important;
    }
}
/* Globalni styly *************************************************************/






/* header */
header{
    background:
        url('img/zubarky.png'),
        url('img/zoubek.svg'),
        linear-gradient(#00EAF5, #005A73);
    background-repeat: no-repeat; 
    background-position: center bottom, center 7%, center;
    background-attachment: scroll;
    background-size: min(1280px, 60vw) auto, auto auto, auto auto;
    min-height: 100vh;
}
header #menu{
    display: none;
}
header label[for=menu]{
    display: none;
    padding: 30px;
    background: url(img/menu-dark.svg) scroll no-repeat center center;
    position: absolute;
    right: 10px;
    top: 10px;
}
header #menu:checked ~ label[for=menu]{
    background: url(img/menu-light.svg) scroll no-repeat center center;
}
header > .vnitrek{
    justify-content: space-between;
    padding-top: 10px;
    padding-bottom: 10px;
}
header *{
    color: #005A72 !important;
    text-decoration: none;
}
header .logo{
    font-size: 2rem;
    padding: 10px;
}
header .promenu{
    display: flex;
    gap: 0.5rem;
    align-items: center;
}
header .promenu > a{
    font-size: 1.5rem;
    padding: 0 0.5rem;
    line-height: 60px;
}
header .socnet a{
    text-transform: uppercase;
    font-size: 10px;
    text-align: center;
    display: inline-block;
    width: 60px;
    line-height: 10px;
    padding: 47px 0 3px 0;
}
header .socnet a[href*=tel]{
    background: transparent url(img/phone.svg) scroll no-repeat center center / 36px auto;
}
header .socnet a[href*=mailto]{
    background: transparent url(img/email.svg) scroll no-repeat center center / 36px auto;
}
header a:hover{
    background-color: rgba(255,255,255,0.25) !important;
}
@media only screen and (max-width:1024px){
    header {
        background-position: center calc(100% - 50px), center 150px, center;
        background-size: 363px auto, 300px auto, auto auto;
        min-height: 600px;
    }
    header > .vnitrek{
        flex-direction: column;
        padding: 0;
    }
    header .logo{
        width: calc(100% - 70px);
    }
    header .promenu {
        max-height: 0px;
        overflow: hidden;
        gap: 0.5rem;
        flex-direction: column;
        background: #00ABB8;
        padding: 0px;
        opacity: 0;
        transition: max-height 0s, padding 0s, opacity 0.5s;
    }
    header label[for=menu]{
        display: inline-block;
    }
    header #menu:checked ~ .vnitrek .promenu{
        padding: 10px;
        max-height: 300px;
        opacity: 1;
    }
    header .promenu > a {
        width: 100%;
        text-align: center;
        color: white !important;
    }
    header .socnet a {
        color: white !important;
    }
    header .socnet a[href*=tel]{
        background-image: url(img/phone-light.svg);
    }
    header .socnet a[href*=mailto]{
        background-image: url(img/email-light.svg);
    }
}
/* header */




/* dlazdice */
.homepage .dlazdice{
    justify-content: center;
    margin: -6rem auto 2rem auto;
}
.homepage .dlazdice .slozky{
    display: flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: stretch;
}
.homepage .dlazdice .slozka{
    width: calc(50% - 1rem);
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-decoration: none;
    background: linear-gradient(rgba(0, 234, 245, 0.75),rgba(2, 84, 87, 1));
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25);
    backdrop-filter: blur(10px);
}
.homepage .dlazdice .original{
    padding: 1.5rem 2.5rem 2.5rem 2.5rem;
}
.homepage .dlazdice .nahled{
    padding-top: 80%;
    width: 100%;
    background-position: center center;
    background-size: cover;
    border-top: 3px solid white;
}
.homepage .dlazdice *{
    color: white !important;
}
.homepage .dlazdice .original > *:not(:first-child){
    display: none !important;
}
@media only screen and (max-width:1024px){
    .homepage .dlazdice {
        margin-top: -4rem;
    }
    .homepage .dlazdice .slozky {
        flex-direction: column;
    }
    .homepage .dlazdice .slozka {
        width: 100%;
    }
    .homepage .dlazdice .original {
        padding: 1.5rem 10px 2.5rem 10px;
    }
}
/* dlazdice */




/* katalog */
.katalog{
    margin: 3rem auto min(30rem, 30vw) auto;
}
.katalog[data-klic-slozky="2"]{
    margin: auto;
}
.katalog[data-klic-slozky="9"],
.katalog[data-klic-slozky="10"]{
    margin: auto;
    padding: 0 0 2rem 0;
}
.katalog[data-klic-slozky="9"] > h1,
.katalog[data-klic-slozky="10"] > h1{
    display: none;
}
.katalog[data-klic-slozky="9"] .editor table:first-child,
.katalog[data-klic-slozky="10"] .editor table:first-child {
    background: linear-gradient(#01898F, #02EBF6);
    border-radius: 1rem;
    padding: 2rem 6rem 3rem 6rem;
    margin: 2rem auto;
    position: relative;
    margin-top: -80px;
    backdrop-filter: blur(10px);
    opacity: 0.85;
}
.katalog[data-klic-slozky="9"] .editor table:first-child *,
.katalog[data-klic-slozky="10"] .editor table:first-child *{
    color: white !important;
}
.katalog[data-klic-slozky="9"] .editor table:not(:first-child),
.katalog[data-klic-slozky="10"] .editor table:not(:first-child) {
    margin: 4rem auto;
}
.katalog[data-klic-slozky="9"] .editor table *,
.katalog[data-klic-slozky="10"] .editor table *{
    text-align: justify;
}
.katalog[data-klic-slozky="9"] .editor table:not(:first-child) img,
.katalog[data-klic-slozky="10"] .editor table:not(:first-child) img{
    border-radius: 10px;
}
@media only screen and (max-width:1024px){
    .katalog[data-klic-slozky="9"] .editor table:first-child,
    .katalog[data-klic-slozky="10"] .editor table:first-child {
        padding: 2rem 10px 3rem 10px;
    }
    .katalog[data-klic-slozky="9"] .editor tr,
    .katalog[data-klic-slozky="10"] .editor tr{
        display: flex !important;
        flex-direction: column;
        gap: 2rem;
    }
    .katalog[data-klic-slozky="9"] .editor table:nth-child(2) td:first-child,
    .katalog[data-klic-slozky="9"] .editor table:nth-child(4) td:first-child,
    .katalog[data-klic-slozky="10"] .editor table:nth-child(2) td:first-child,
    .katalog[data-klic-slozky="10"] .editor table:nth-child(4) td:first-child{
        order: 1;
    }
    .katalog[data-klic-slozky="9"] .editor table:nth-child(2) td:first-child *,
    .katalog[data-klic-slozky="9"] .editor table:nth-child(3) td:last-child *,
    .katalog[data-klic-slozky="9"] .editor table:nth-child(4) td:first-child *,
    .katalog[data-klic-slozky="10"] .editor table:nth-child(2) td:first-child *,
    .katalog[data-klic-slozky="10"] .editor table:nth-child(3) td:last-child *,
    .katalog[data-klic-slozky="10"] .editor table:nth-child(4) td:first-child *{
        text-align: center;
        float: none;
    }
}
/* katalog */





/* homepage dlazdice Zhotovujeme */
.katalog[data-klic-slozky="2"]{
    background: linear-gradient(#01898F, #02EBF6);
    border-radius: 1rem;
    padding: 2rem 4rem;
    margin: 2rem auto;
    position: relative;
}
.katalog[data-klic-slozky="2"] h1{
    display: none;
}
.katalog[data-klic-slozky="2"] *{
    color: white !important;
}
.katalog[data-klic-slozky="2"]:after{
    content: ' ';
    display: block;
    position: absolute;
    background: transparent;
    top: 10px;
    bottom: 0px;
    left: 5%;
    right: 5%;
    box-shadow: 0 0 14px 4px rgba(0, 0, 0, 0.25);
    z-index: -1;
}
@media only screen and (max-width:1024px){
    .katalog[data-klic-slozky="2"] {
        padding: 2rem 10px;
    }
}
/* homepage dlazdice Zhotovujeme */




/* slider */
.slider{
    margin: 2rem auto;
    position: relative;
}
body .slider .NahledProduktu003{
    border: 1px solid white;
    flex: 0 0 25%;
    margin: 0;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: none !important;
    cursor: default !important;
}
body .NahledProduktu003 a{
    cursor: default !important;
}
body .NahledProduktu003 .nahled {
    padding-top: 125%;
    margin: 0;
    width: auto;
    border-radius: 1rem;
    overflow: hidden;
}
body .NahledProduktu003 .nahled img{
    transform: scale(1.2);
    cursor: default !important;
}
body .slider .NahledProduktu003 > *:not(a),
body .slider .NahledProduktu003 > a > *:not(.nahled){
    display: none !important;
}
body .komponentaProductSlider .slideLeft,
body .komponentaProductSlider .slideRight {
    background: #00898F;
    opacity: 0.75;
    width: 70px;
    height: 70px;
    border-radius: 35px;
    top: 44%;
}
body .komponentaProductSlider .slideLeft {
    left: 34px;
}
body .komponentaProductSlider .slideRight  {
    right: 34px;
}
body .komponentaProductSlider .slideLeft:before{
    background: url(img/arrowLeft.svg) scroll no-repeat center center / 80% auto;
}
body .komponentaProductSlider .slideRight:before{
    background: url(img/arrowRight.svg) scroll no-repeat center center / 80% auto;
}
body .komponentaProductSlider .slideLeft:before,
body .komponentaProductSlider .slideRight:before  {
    font-size: 0;
    width: 80%;
    height: 80%;
}
@media only screen and (max-width:1024px){
    body .slider .NahledProduktu003{
        flex: 0 0 33.3333%;
    }
}
@media only screen and (max-width:640px) {
    body .slider .NahledProduktu003{
        flex: 0 0 50% !important;
    }
    body .komponentaProductSlider .slideLeft, body .komponentaProductSlider .slideRight {
        width: 36px;
        height: 36px;
        border-radius: 18px;
    }
    body .komponentaProductSlider .slideLeft {
        left: 18px;
    }
    body .komponentaProductSlider .slideRight {
        right: 18px;
    }
}
@media only screen and (max-width:512px) {
    body .slider .NahledProduktu003{
        flex: 0 0 100% !important;
    }
}
@media only screen and (min-width:1536px){
    body .slider .NahledProduktu003{
        flex: 0 0 calc(20% - 1px);
    }
}
@media only screen and (min-width:2048px){
    body .slider .NahledProduktu003{
        flex: 0 0 calc(16.6666% - 10px);
    }
}
/* slider */




/* footer */
footer .obsah{
    min-height: 60vw;
    background: url(img/zapati.jpg) scroll no-repeat center center/cover;
    margin: 285px auto 0 auto;
}
footer .obsah .komponentaSlozka *{
    color: white;
}
footer .obsah .komponentaSlozka .stylVelke{
    font-size: min(80px, 8vw) !important;
}
footer .obsah .komponentaSlozka{
    width: 1024px;
    border-radius: 1rem;
    padding: 3rem 4rem;
    margin: auto;
    backdrop-filter: blur(10px);
}
footer .obsah .komponentaSlozka:first-child{
    background: linear-gradient(rgb(0 90 115 / 90%), rgb(0 234 245 / 90%));
    transform: translateY(-50%);
}
footer .obsah .komponentaSlozka:last-child{
    background: linear-gradient(rgb(0 234 245 / 90%), rgb(0 90 115 / 90%));
    transform: translateY(20%);
}
footer .obsah .komponentaSlozka:last-child:after{
    content: ' ';
    display: block;
    position: absolute;
    background: transparent;
    bottom: -4px;
    left: 5%;
    right: 5%;
    box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.25);
    z-index: -2;
}
footer .obsah .komponentaSlozka:last-child form{
    text-align: center;
}
footer .obsah .komponentaSlozka td{
    padding: 20px;
}
footer .obsah .komponentaSlozka input[type=text],
footer .obsah .komponentaSlozka textarea{
    width: 100%;
}
footer .obsah .komponentaSlozka form div{
    margin-bottom: 10px;
}
footer .mapa{
    display: block;
    padding-top: 400px;
    background: url(img/mapa.jpg) scroll no-repeat center center/cover;
}
footer .black{
    background-color: black;
    color: rgba(255,255,255,0.5);
    text-align: center;
    padding: 1rem;
    font-size: 0.75rem;
}
@media only screen and (max-width:1024px){
    footer .obsah {
        margin: 135px auto 0 auto;
    }
    footer .obsah .komponentaSlozka{
        width: calc(100% - 20px);
        padding: 3rem 1rem;
    }
    footer .obsah .komponentaSlozka td {
        padding: 20px 0;
    }
    footer .obsah .komponentaSlozka:first-child {
        transform: translateY(-100px);
    }
}
/* footer */





/* Formular24 */
.Formular24chyba,
.Formular24odeslano{
    border-radius: 10px;
    padding: 10px;
    text-align: left;
}
.Formular24chyba{
    color: #721c24 !important;
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
}
.Formular24odeslano{
    color: #155724 !important;
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
}
/* Formular24 */




/* carousel */
.carousel{
    margin: 2rem auto;
    opacity: 0;
    background: white;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0px;
    line-height: 0px;
    width: auto !important;
    overflow: hidden;
    opacity: 0;
}
.carousel .slozka{
    display: inline-block;
    border: 1px solid white;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 0px;
    text-align: center;
    transition: margin-left 1s;
    border-radius: 1rem;
}
.carousel .slozka .nahled{
    transition: box-shadow 0.5s;
    display: block;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    padding-top: 125%;
    border-radius: 1rem;
    overflow: hidden;
    transform: scale(1.2);
}
.carousel .slozka img{
    display: none !important;
}
/* carousel */