@charset "UTF-8";

:root { --highlight: #005f97; --highlight-hover: #005f97; --gray: #f3f3f3; --yellow: #fab800; --yellow-hover: #fbc911; }

*, *::before, *::after {
    box-sizing: inherit;
}
html {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
body>main {
    flex: 1;
    overflow-x:hidden;
}

/* Obecne */
p {margin: 0;padding:0;}

/* Wrappery a helpery pro content */

:root {
    --max-content-width: 1138px;

    /* --content-max-width: 1142px; */
    --content-max-width: 1138px;
    --content-padding-left: 48px;
    --content-padding-right: 48px;
    --content-padding-top: 36px;
    --content-padding-bottom: 36px;
    --content-margin-top: 36px;
    --content-margin-bottom: 36px;
}
.content-max-width {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--content-max-width);
}
.content-padding-x {
    padding-left: var(--content-padding-left);
    padding-right: var(--content-padding-right);
}
.content-padding-y {
    padding-top: var(--content-padding-top);
    padding-bottom: var(--content-padding-bottom);
}
.content-padding-t {
    padding-top: var(--content-padding-top);
}
.content-padding-b {
    padding-bottom: var(--content-padding-bottom);
}
.content-margin-y {
    margin-top: var(--content-margin-top);
    margin-bottom: var(--content-margin-bottom);
}
.content-margin-t {
    margin-top: var(--content-margin-top);
}
.content-margin-b {
    margin-bottom: var(--content-margin-bottom);
}
.content {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--content-max-width);
    padding-left: var(--content-padding-left);
    padding-right: var(--content-padding-right);
    padding-top: var(--content-padding-top);
    padding-bottom: var(--content-padding-bottom);
}
@media screen and (max-width: 1200px) {
    :root {
        --content-padding-left: 1rem;
        --content-padding-right: 1rem;
    }
    .content-max-width {
        max-width: 100vw;
        max-width: 100dvw;
    }
}
@media screen and (max-width: 600px) {
    :root {
        --content-padding-left: 3%;
        --content-padding-right: 3%;
        --content-margin-top: 1rem;
        --content-margin-bottom: 1rem;
    }
}

/* html, body { scroll-behavior: smooth; } */

/******************************************************************************/

.content-menu {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 2em;
    position: relative;
}
.content-menu::before {
    content: "";
    display: block;
    position: absolute;
    left: calc(200px + 1em);
    background: currentColor;
    width: 1px;
    height: 100%;
    opacity: .2;
}
.content-menu > div > h1,
.content-menu > div > .h1 {
    margin-top: 0;
}

@media (max-width: 850px) {
    .content-menu {
        grid-template-columns: 1fr;
    }
    .content-menu::before {
        display: none;
    }
    .content-menu__left {
        position: relative;
    }
    .content-menu__left::before {
        content: "";
        display: block;
        position: absolute;
        left: 0;
        bottom: -1em;
        background: currentColor;
        width: 100%;
        height: 1px;
        opacity: .2;
    }
}

/******************************************************************************/

input, textarea, select { padding: 4px 5px; }
select option[disabled="disabled"] { color: #990033; }
fieldset { background: rgba(230, 230, 230, 0.25); border: 1px solid #dedede; border-radius: 5px; float: left; margin-right: 10px; padding: 5px 10px; }
fieldset legend .fa { color: #aaa; padding: 0 2px; }
fieldset legend .fa:hover { color: #444; }
/* ul { list-style: none; } */
/* ul li::before {content: "»"; color: var(--highlight); display: inline-block; margin-left: -1em; width: 1em; } */

.input { padding: 7px; width: calc(100% - 16px); }
.select { padding: 7px; width: 100%; }
.submit { padding: 10px; width: 100%; }

.responsive-design { font-size: 1em; }

details summary {cursor: pointer;white-space: nowrap;}

/******************************************************************************/

.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: oswald; font-size: 1em; }
.custom-combobox-toggle { margin: -2px 0 0 1px; padding: 8px 2px 8px 1px; }

a[href^="tel"] { color: inherit; text-decoration: none; } /*, a[href^="mail"]*/
a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important; }

/******************************************************************************/

.highlight { color: var(--higlight); }
.highlight2 { color: var(--yellow); }
.nu { text-decoration: none; }
.nu:hover { text-decoration: underline; }
.un { text-decoration: underline; }
.un:hover { text-decoration: none; }
.nn { text-decoration: none; }
.nn:hover { text-decoration: none; }
.nc { text-decoration: none; }
.nc:hover { color: #eb2332; color: #1aa9e6; }
.ui-tooltip { background: #444; border: 0; border-radius: 2px; box-shadow: none; color: #fff; font-family: oswald; font-size: 12px; }
.hidden { display: none; }
.clear { clear: both; }
.text-shadow { text-shadow: 1px 2px 3px #222; }
.center { text-align: center; }
.uppercase { text-transform: uppercase; }
.go-back { display: inline-block; margin-top: 0em; text-transform: lowercase; }

/******************************************************************************/
/* hlášky */

.msg-ok { background: #0a0; color: #fff; margin-bottom: 1em; padding: 5px 15px; }
.msg-error { background: #c00; color: #fff; margin-bottom: 1em; padding: 5px 15px; }
.msg-ok a, .msg-error a { color: #fff; }

/******************************************************************************/

.wrap1 { clear: both; position: relative; width: 100%;}
.wrap2 {
    /* dev */
    /* outline: 1px solid #ffc8c8;  */
}
.wrap2.is-limited {
    max-width: var(--max-content-width, 1280px);
    margin-left: auto;
    margin-right: auto;
}

/* .content {padding: 1em 0;} */
.anchor {display: block;height: 0;width: 0;}

/******************************************************************************/
/* Hlavička */
#wrap-head {
}
.head-content {
    background: var(--color-bg-2);
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding-top: 38px;
    padding-bottom: 38px;
    margin-top: 5vw;
    margin-top: min(5vw, 6em);
}
.head-logo__link {
    --space: 38px;
    display: grid;
    border-right: 1px solid #cbcbcb;
    padding-right: var(--space);
    margin-right: var(--space);
}
.head-logo__picture {
    display: grid;
}
.head-title {
    font-size: 22px;
    font-weight: bold;
    text-wrap: balance;
}
.head-image__img {
    max-height: 190px;
    margin: -16px 0;
}
@media (max-width: 1200px) {
    .head-content {
        margin-top: 0;
    }
}
/******************************************************************************/
/* Hlavička - responzivní*/

@media (max-width: 900px) {
    .head-logo__img {
        max-width: 25vw;
    }
    .head-image__img {
        max-width: 25vw;
    }
}
@media (max-width: 750px) {
    .head-logo__link {
        --space: 20px;
    }
    .head-title {
        font-size: 20px;
        line-height: 1.25;
    }
}

@media (max-width: 500px) {
    .head-content {
        --space: 1rem;
        grid-template-columns: 1fr;
        padding-top: var(--space);
        padding-bottom: var(--space);
    }
    .head-logo__link {
        --space: 1rem;
        border-right: none;
        border-bottom: 1px solid #cbcbcb;
        padding-right: 0;
        margin-right: 0;
        padding-bottom: var(--space);
        margin-bottom: var(--space);
    }
    .head-logo__picture {
        justify-content: center;
    }
    .head-logo__img {
        max-width: 50vw;
    }
    .head-title {
        text-align: center;
    }
    .head-image__img {
        display: none;
    }
}


/******************************************************************************/
/* Mobilní menu */
.mobile-menu {display: none;position: fixed;left: 0;right: 0;bottom: 0;top: 0;background: #00000066;z-index: 99;isolation: isolate;opacity: 0;visibility: hidden;transition: opacity, visibility;transition-duration: .3s, 0s;transition-delay: 0s, .3s;}
.mobile-menu__content {background: white;display: grid;grid-template-areas: ". lang" "logo button" "list list";grid-template-columns: 1fr auto;grid-template-rows: auto auto 1fr;min-height: 100vh;max-height: 100vh;padding: 8px 3% 0px 3%;transition: transform;transition-duration: .3s;transform: translateX(-100%);}
.mobile-menu__logo {grid-area: logo;align-self: center;}
.mobile-menu__lang {grid-area: lang;}
.mobile-menu__list {grid-area: list;padding: 0;margin: 0;list-style: none;margin-top: 1em;}
.mobile-menu__content>.mobile-menu__list {overflow: auto;padding-bottom: 6em;}
.mobile-menu__item {margin-bottom: .5em;font-size: 18px;}
.mobile-menu__item:not(:last-child) {border-bottom: 1px solid #cecece;}
.mobile-menu__item--active {color: var(--color-fg-1);font-weight: 500;}
.mobile-menu__item:hover {color: var(--color-fg-1);}
.mobile-menu__link {text-decoration: none;display: block;padding: 4px;}
.mobile-menu__button {grid-area: button;justify-self: end;}
.mobile-menu__list--2 {margin-top: 0;margin-bottom: 1em;margin-left: .5em;padding-left: .5em;border-left: 1px solid #cecece;}
.mobile-menu__list--2 .mobile-menu__item {font-size: 0.9em;color: var(--color-fg-2);font-weight: 400;}
.mobile-menu__list--2 .mobile-menu__item--active {color: var(--color-fg-1);font-weight: 500;}
body.menu-open .mobile-menu__content {transform: translateX(0%);}
body.menu-open .mobile-menu {opacity: 1;visibility: visible;transition: opacity, visibility;transition-duration: .3s, 0s;transition-delay: 0s, 0s;}
@media (max-width: 850px) {
    .mobile-menu {display: block;}
}

/******************************************************************************/
/* Kroky */
.steps {
    font-weight: bold;
    font-size: 14px;
    line-height: 1;
    margin-top: 20px;
}
.steps__list {
    display: grid;
    grid-auto-flow: column;
}
.steps__link {
    text-decoration: none;
    display: grid;
}
.steps__link--next {
    cursor: not-allowed;
}
.steps__item {
    position: relative;
    --_line-size: 7px;
    --_line-border: var(--color-fg-3);
    --_line-color: transparent;
    --_line-right-padding: 0;
    color: var(--color-fg-3);
    display: flex;
    padding: 1.5em 0 1.5em 0;
    align-items: center;
}
.steps__item::before, .steps__item::after {
    content: "";
    display: block;
    height: var(--_line-size);
    border: 1px solid var(--color-fg-3);
    border-right-width: 0;
    border-left-width: 0;
    background: white;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.steps__item::before {
    box-shadow: 1px 0px var(--color-fg-3);
}
.steps__item::after {
    border: none;
    background: var(--_line-color);
    right: var(--_line-right-padding, 0);
    transform: scaleX(1);
    transform-origin: left;
    transition: .3s transform;
}
.steps__item--next::after {
    transform: scaleX(0);
}
.steps__item--now {
    --_line-color: var(--color-bg-3);
    --_line-border: var(--color-bg-3);
    --_line-right-padding: 1em;
    color: var(--color-fg-2);
}
.steps__link:last-child .steps__item--now {
    --_line-right-padding: 0em;
}
.steps__item--prev {
    --_line-color: var(--color-bg-4);
    --_line-border: var(--color-bg-4);
    color: var(--color-bg-4);
}
.steps__number {
    font-weight: normal;
}
.steps__title {
    margin-left: 1em;
    margin-right: 1em;
    text-wrap: balance;
}

/******************************************************************************/
/* Kroky - responzivní */
@media (max-width: 750px) {
    .steps__link--prev, .steps__link--next {
        display: none;
    }
    .steps__link--now + .steps__link--next {
        display: grid;
    }
}

/******************************************************************************/
/* Formulář */
.brother-form {
    display: grid;
    overflow: hidden;
    align-items: start;
    padding-bottom: 1em;
}

.brother-form input:-webkit-autofill,
.brother-form input:-webkit-autofill:hover,
.brother-form input:-webkit-autofill:focus,
.brother-form input:-webkit-autofill:active{
    -webkit-background-clip: text;
    -webkit-text-fill-color: var(--color-fg-2);
    box-shadow: inset 0 0 20px 20px transparent;
}

.brother-form__step {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-areas: "left middle right";
    gap: 2em;
    align-items: center;
    justify-content: space-between;
    background: white;
    isolation: isolate;
    transform: translateX(calc(100% * (var(--step, 0) - var(--step-now, 1))  ));
    opacity: calc(var(--step) - var(--step-now) + 1);
    transition: .5s transform, .3s opacity;
}
.brother-form__step--1 {
    --step: 1;
    visibility: var(--step-1-visibility, hidden);
}
.brother-form__step--2 {
    --step: 2;
    visibility: var(--step-2-visibility, hidden);
}
.brother-form__step--3 {
    --step: 3;
    visibility: var(--step-3-visibility, hidden);
}
.brother-form__step--4 {
    --step: 4;
    visibility: var(--step-4-visibility, hidden);
}
.brother-form__step--5 {
    --step: 5;
    visibility: var(--step-5-visibility, hidden);
}

.brother-form__step > * {
    /* outline: 1px dashed black; */
}
.brother-form__left { grid-area: left; }
.brother-form__middle {
    grid-area: middle;
    padding-top: 55px;
}
.brother-form__right { grid-area: right; }

.brother-form__button {
    appearance: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    line-height: 1;
    transition: .2s background;
    user-select: none;
}
.brother-form__button-picture {
    display: inline-grid;
}

.brother-form__button--prev {
    background: #ededed;
    width: 60px;
    height: 50px;
    display: grid;
    justify-content: center;
    align-items: center;
}
.brother-form__button--prev:focus-within,
.brother-form__button--prev:hover {
    background: black;
    outline: none;
}

.brother-form__button--next {
    background: var(--color-bg-3);
    color: white;
    font-weight: bold;
    font-size: 14px;
    padding: 2em 3em;
}
.brother-form__button--next .brother-form__button-picture {
    margin-left: 3em;
}
.brother-form__button--next:focus-within,
.brother-form__button--next:hover {
    background: black;
    outline: none;
}

/******************************************************************************/

.brother-form__fields {
    display: grid;
    max-width: 80%;
    font-size: 14px;
    line-height: 1;
    gap: 2em;
}

.brother-form__title {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 1em;
}

/******************************************************************************/

.brother-form__label {
    display: grid;
    position: relative;
}
.brother-form__label::before, .brother-form__label::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: var(--color-fg-3);
}
.brother-form__label::after {
    transform: scaleX(0);
    transform-origin: left center;
    background: var(--color-fg-2);
    transition: .3s transform;
    height: 2px;
}
.brother-form__label:focus-within::after {
    transform: scaleX(1);
}

.brother-form__label-title {
}

.brother-form__input {
    appearance: none;
    border: none;
    font-size: inherit;
    line-height: 1;
    font-weight: bold;
    color: var(--color-fg-2);
    outline: none;
    padding: .5em 0;
}
.brother-form__input::placeholder, .brother-form__label-placeholder {
    color: black;
    opacity: .3;
    font-weight: normal;
}
.brother-form__input:placeholder-shown {}

.brother-form__label-placeholder {
    position: absolute;
    right: 0;
    bottom: 0;
    pointer-events: none;
    padding-bottom: .5em;
    color: transparent;
}
.brother-form__input:placeholder-shown ~ .brother-form__label-placeholder {
    color: inherit;
}

.brother-form__label-picture {
    --_scale: 0;
    --_translateY: 25%;
    position: absolute;
    right: 0;
    bottom: 0;
    opacity: 0;
    transform: translate(100%, var(--_translateY, 25%)) scale(var(--_scale, 0));
    transition: .3s transform, .3s opacity;
    transition-timing-function: cubic-bezier(0.42, 0, 0.56, 1.53);
}
.brother-form__label:focus-within .brother-form__label-picture {
    --_scale: 1;
    opacity: 1;
}
.brother-form__select:focus-within .brother-form__label-picture{
    --_scale: 1;
    opacity: 1;
    --_translateY: 0;
}
/******************************************************************************/

.brother-form__checkbox {
    display: flex;
    align-items: start;
    cursor: pointer;
    user-select: none;
}
.brother-form__checkbox-input {
    margin: 0;
    margin-right: .5em;
}
.brother-form__checkbox-label {
    font-size: 10px;
    margin-top: .2em;
}

/******************************************************************************/

.brother-form__radio-group {
    display: grid;
    gap: 1em;
}
.brother-form__radio-group-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
.brother-form__radio {
    display: flex;
    cursor: pointer;
}
.brother-form__radio-input {
    margin: 0;
    margin-right: .5em;
    cursor: pointer;
    outline: none;
}
.brother-form__radio-input:checked + * {
    color: var(--color-fg-2);
    font-weight: bold;
}
/* .brother-form__radio:focus-within { */
.brother-form__radio:has(:focus-visible) {
    outline: 2px solid var(--color-fg-2);
    border-radius: 2px;
}

.brother-form__radio-group--v2 .brother-form__radio-group-container {
    grid-template-columns: 1fr;
    gap: 16px;
}

/******************************************************************************/


.brother-form__group-img {
    position: relative;
    overflow: hidden;
    margin-top: 2rem;
}
.brother-form__picture-image {
    width: 100%;
    height: auto;
    max-height: 300px;
    object-fit: contain;
    object-position: left;
}
.brother-form__picture {
    display: none;
}
[data-present="inkoust"] .brother-form__picture--inkoust {
    display: block;
}
[data-present="batoh"] .brother-form__picture--batoh {
    display: block;
}

.brother-form__picture {
    position: relative;
}
.brother-form__picture::after {
    content: "";
    display: block;
    padding-top: 66%;
}
.brother-form__picture img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    object-fit: scale-down;
}


/******************************************************************************/
.brother-form__file {
    display: grid;
    gap: 1em;
    position: relative;
}
.brother-form__input--file {
    /* width: .1px; */
    height: .1px;
    opacity: .1;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}
.brother-form__input-file {
    display: grid;
    grid-template-columns: auto 1fr;
    cursor: pointer;
    user-select: none;
}
.brother-form__input-file__button {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-3);
    color: white;
    padding: 1em;
    box-sizing: border-box;
    transition: .2s background;
    white-space: nowrap;
}
.brother-form__input-file__button svg {
    font-size: 1.5em;
    pointer-events: none;
}
.brother-form__input-file__button span {
    margin-left: .5em;
    pointer-events: none;
}

.brother-form__input--file:focus + .brother-form__input-file .brother-form__input-file__button,
.brother-form__input-file__button:hover {
    color: white;
    background: black;
}
.brother-form__input-file__name {
    border: 1px solid var(--color-fg-3);
    padding: 1em;
    box-sizing: border-box;
    display: grid;
    align-items: center;
    overflow-wrap: anywhere;
}

/* Drag and drop */
.brother-form__input-file.dragging {
    outline: 2px dashed var(--color-bg-3);
    outline-offset: 2px;
}
.brother-form__input-file.dragging .brother-form__input-file__button {
    background: var(--color-bg-1);
    color: var(--color-bg-3);
}

/******************************************************************************/


.brother-form__select {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1em;
    position: relative;
}
.brother-form__select-input {
    --shadow: 0px 0px 6px -2px #bdbdbd;
    --shadow-border: inset 0 0 0 2px transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 20 20'%3E%3Cpath fill='%23000' d='M10.103 12.778L16.81 6.08a.69.69 0 0 1 .99.012a.726.726 0 0 1-.012 1.012l-7.203 7.193a.69.69 0 0 1-.985-.006L2.205 6.72a.727.727 0 0 1 0-1.01a.69.69 0 0 1 .99 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .5em center;
    appearance: none;
    border: 1px solid #dbdbdb;
    border-radius: 6px;
    padding: .5em 2.5em .5em 1em;
    outline: none;
    box-shadow: var(--shadow-border), var(--shadow);
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    cursor: pointer;
    color: var(--color-fg-2);
    font-weight: bold;
    box-sizing: border-box;
}
.brother-form__select-input:invalid {
    color: #bdbdbd;
    font-weight: normal;
}
.brother-form__select-input:focus-within {
    --shadow-border: inset 0 0 0 2px var(--color-bg-3);
}
.brother-form__select-input option {
    color: var(--color-fg-2);
    font-weight: bold;
    cursor: pointer;
}

/******************************************************************************/

.brother-form__label-error {
    color: red;
    font-size: 10px;
    position: absolute;
    bottom: -.3em;
    transform: translateY(100%);
    visibility: hidden;
}

.is-error-enabled.brother-form__select-input:invalid ~ .brother-form__label-error,
.is-error-enabled.brother-form__input:invalid ~ .brother-form__label-error {
    visibility: visible;
}

/******************************************************************************/
/* Formulář - responzivní */
@media (max-width: 750px) {
    .brother-form__right {
        display: grid;
        justify-content: end;
    }
    .brother-form__step {
        grid-template-areas:
            "middle middle middle"
            "left right right";
    }
    .brother-form__fields {
        max-width: 100%;
    }
    .brother-form__button--prev {
        padding: 1em 1em;
        height: unset;
        width: unset;
    }
    .brother-form__button--next {
        padding: 1.5em 2em;
    }
    .brother-form__button--next .brother-form__button-picture {
        margin-left: .5em;
    }
}

/******************************************************************************/
/* Patička */
.wrap1--footer-1 {
    margin-top: 3em;
}
.wrap2--footer-1 {
    background: var(--color-bg-2);
    position: relative;
    padding-top: 1em;
    padding-bottom: 1em;
    display: flex;
    flex-wrap: wrap;
    gap: 2em;
}
.foot1-content {
    flex: 1;
    min-width: 50%;
}
.foot1-kangaroo {
    text-align: right;
    display: flex;
    align-items: end;
}
@media (max-width: 1300px) {
    .wrap2--footer-1 {
        --content-padding-left: 60px;
    }
    .foot1-content {gap: 8%}
}

/******************************************************************************/

.cf {background: inherit;overflow: hidden;padding: 0;padding-bottom: 55px;}
.cf__body {color: #646363;margin-top: 80px;}
.cf__col--info {display: grid;grid-template-columns: repeat(auto-fill, minmax(400px,1fr));gap: 0 60px;}
.cf__label {display: grid;grid-template-columns: auto 1fr;align-items: baseline;border-bottom: 1px solid currentColor;font-size: 18px;margin-bottom: 46px;}
.cf__label:focus-within {color: var(--color-fg-1);}
.cf__label span::after {content: ":";}
.cf__label input {appearance: none;border: none;outline: none;color: inherit;background: inherit;}
.cf__label textarea {appearance: none;border: none;outline: none;color: inherit;background: inherit;padding: 0;}
.cf__col--text .cf__label {grid-template-columns: 1fr;}
.cf__foot {display: flex;flex-direction: row-reverse;flex-wrap: wrap;}
.cf__foot-checkbox {flex: 1;}
.cf .checkbox {--mark-checked-color: var(--color-fg-1);}
@media (max-width: 600px) {
    .cf__body {margin-top: 2em;}
    .cf__col--info {grid-template-columns: 1fr;}
    .cf__label {margin-bottom: 1.5em;}
}

/******************************************************************************/
/* Foto galerie - Mřížka */
.gallery-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));gap: 1em;}
.gallery-grid__figure {margin: 0;padding: 0;}
.gallery-grid__picture {display: block;position: relative;max-height: 250px;}
.gallery-grid__picture::before {content: "";padding-top: 100%;display: block;}
.gallery-grid__img {width: 100%;height: 100%;object-fit: cover;position: absolute;left: 0;right: 0;top: 0;bottom: 0;}


/* ! *****************************************************************************/
/* ! *****************************************************************************/

@keyframes shake1 {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -2px) rotate(-1deg); }
    20% { transform: translate(-3px, 0px) rotate(1deg); }
    30% { transform: translate(3px, 2px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 2px) rotate(-1deg); }
    60% { transform: translate(-3px, 1px) rotate(0deg); }
    70% { transform: translate(3px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 2px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
}
@keyframes shake2 {
    0% { transform: rotate(0deg); }
    10% { transform: rotate(-10deg); }
    20% { transform: rotate(10deg); }
    30% { transform: rotate(0deg); }
    40% { transform: rotate(10deg); }
    50% { transform: rotate(-10deg); }
    60% { transform: rotate(0deg); }
    70% { transform: rotate(-10deg); }
    80% { transform: rotate(10deg); }
    90% { transform: rotate(0deg); }
    100% { transform: rotate(-10deg); }
}

/******************************************************************************/
/* obsah */

#homepage #content { display: none; }

/* #breadcrumbs { margin-bottom: 1em; } */
#breadcrumbs {background: transparent;border: none;padding: 0;margin-top: 2em;font-size:14px;}
#breadcrumbs>* {margin: 0 4px;}
#breadcrumbs>:last-child {color: var(--color-fg-1); }
#breadcrumbs a:hover, #breadcrumbs a:focus {color: var(--color-prim);}

#content { margin: auto; padding: 8px 0; }
#content .text { line-height: 1.75em; font-weight: var(--fw-light); }

#content.view-menu-left .content { background: url('../img/bg_content.png') 225px 0 repeat-y; }

/******************************************************************************/
/* pomocná kotva; řeší zafixované menu */

.anchor { position: absolute; top: -100px; }

/******************************************************************************/
/* obsah - levá + pravá strana */

.wrap-left.view-menu-left { display: inline-block; padding-right: 25px; vertical-align: top; width: 200px; }
.wrap-right.view-menu-left { display: inline-block; padding-left: 25px; vertical-align: top; width: calc(100% - 250px); }

#content .wrap-left ul { margin-top: 0; }

/******************************************************************************/
/* fotografie */

.wrap-photo { display: flex;flex-wrap: wrap;justify-content: center;text-align: center; }
.wrap-photo { margin: 1rem 0; }
.wrap-photo img { max-width: 100%; max-height: 15rem; object-fit: contain; }

.photo { display: inline-block; margin: 5px; }
.photo img { height: auto; vertical-align: top; width: 147px; }
.photo:hover img { opacity: 0.95; }

.photo-product { display: inline-block; margin: 1em 28px 8px 0; }
.photo-product .title { font-weight: 300; margin-bottom:.5em; }
.photo-product img {width: 240px;height: 240px;object-fit: cover;}

/******************************************************************************/
/* mapa */

#map-title { }
#map-title .content { font-size: 50px; font-weight: bold; padding: 100px 0; text-align: center; }

#map { position: relative; text-align: center; overflow: hidden;}
#map>div {margin-top: -59px;}
#map .wrap2 { width: 100%; }
#map .content { padding: 0; }

#google-maps { }
#google-maps iframe { pointer-events: none; z-index: -1; }

/******************************************************************************/
/* Loading */
/* ! Nové */
.is-loading {position: relative;}
.is-loading::after {content: "";display: block;color: #f3f3f3;border: 0.2em solid currentColor;border-top-color: transparent;border-radius: 50%;width: 1em;height: 1em;animation: spin 1s infinite;animation-timing-function: cubic-bezier(0.75, 0.29, 0.13, 0.63);position: absolute;top: 50%;left: 50%;z-index:1;}
.is-loading::before {content: "";display: block;background: black;position: absolute;left: 0;right: 0;top: 0;bottom: 0;opacity: .1;z-index:1;}
@keyframes spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

.brother-form__button--next.is-loading::after {font-size: 2rem;}
.brother-form__button--next.is-loading span {visibility: hidden;}

/******************************************************************************/
/* Contact form */

/* #contact-form { background: #3b3330; color: #eee; } */
#contact-form { background-color: var(--contact-form-bg-color); color: var(--contact-form-fg-color-prim); margin-top: 3rem;padding-top: 2rem; }
#contact-form a { color: var(--contact-form-fg-color-link); }


#contact-form .content>* { flex: 1 1 0px; }
#contact-form .content img { object-fit: cover; width: 100%; height: 100%; max-height: 57em; max-width: 100vw; }
.mapsitna { display: none; }

.wrap-contact-form { padding: 2rem 0 2rem 0; }

.contact-form2 { display: flex; flex-direction: column; /* padding: 2em; */ }
.contact-form2 .basic { display: grid; grid-template-columns: 1fr 1fr; justify-items: right; grid-gap: 0 10vw;font-size: 14px; }
.contact-form2 input[type="submit"] {color: var(--contact-form-submit-fg-color);background-color: var(--contact-form-submit-bg-color);width: min-content;margin-left: auto;padding: .7rem 4rem;text-transform: capitalize;font-size: inherit;font-weight: unset;border-radius: var(--contact-form-submit-radius);appearance: none;-moz-appearance: none;-webkit-appearance: none;font-weight: 400;}
.contact-form2 input[type="submit"] {filter: var(--hp-filter-shadow-dark);transition: 0.3s transform, 0.3s background-color;}
.contact-form2 input[type="submit"]:hover, .contact-form2 input[type="submit"]:focus {transform: scale(1.1);background-color: var(--contact-form-submit-bg-color-hover);}

.contact-form2 .basic * { color: var(--contact-form-fg-color-prim); }
.contact-form2 .basic label { width: 100%; border-bottom: 1px solid var(--contact-form-line-color); display: flex; white-space: nowrap; padding: 2rem 0 .1rem 0; }
/* .contact-form2 .required::before { content: '* '; } */
.contact-form2 .not-required > span::after { content: '* '; }
.contact-form2 label > span { font-weight: 500; }
.contact-form2 .basic > label > span { min-width: 130px; }
.contact-form2 .basic label span { padding: 0 .5em 0 .1em; }
.contact-form2 .basic input,
.contact-form2 .basic textarea {border: none;border-radius: unset;width: 100%;height: 1.5em;background-color: transparent;appearance: none; -moz-appearance: none; -webkit-appearance: none;padding-top: 0;padding-bottom: 0;resize: vertical;}
.contact-form2 .basic .textarea {grid-column: 2;grid-row: 1/5;}
.contact-form2 .checkbox { align-self: flex-end; margin: 3rem 0 2rem 0; max-width: 50%; }

.contact-form2 .basic input, .contact-form2 .basic textarea {height: 100%;padding: 0;}
.contact-form2 .basic label.textarea {flex-direction: column;}
.contact-form2 .basic label span {opacity: 0.5;text-transform: uppercase;font-size: 1em;}
.contact-form2 input[type="submit"] {font-weight: 400;text-transform: uppercase;}

.contact-form2 .additional { display: flex; margin: 3rem 0 2rem 0; justify-content: space-between;font-size: 14px; }
.contact-form2 .additional .checkbox { margin: 0; }
.contact-form2 .additional .legend { text-transform: uppercase; }
.contact-form2 span, .contact-form2 .basic label span { font-weight: 600;}

/* checkbox */
.checkbox {
    --mark-border-color: var(--contact-form-line-color);
    --mark-border: 1px solid var(--mark-border-color);
    --mark-color: #000;
    --mark-background: transparent;
    --mark-checked-color: #fff;
    --mark-checked-background: var(--color-prim);
    --mark-size: 1.5em;
    --mark-transition-duration: 0.3s;
}
.checkbox { color: inherit; display: inline-grid; grid-template-columns: auto 1fr; grid-template-areas: "input label"; position: relative; justify-content: center; align-items: center; gap: 0.8em;grid-gap: 0.8em; cursor: pointer; }
.checkbox__input { box-sizing: content-box; grid-area: input; display: grid; grid-template-areas: "mark"; width: var(--mark-size); height: var(--mark-size); border: var(--mark-border, 1px solid currentColor); color: var(--mark-color, currentColor); background: var(--mark-background, transparent); box-shadow: inset 0px 0px 0.1em var(--mark-border-color); }
.checkbox__mark { grid-area: mark; transition: color, background-color; transition-duration: var(--mark-transition-duration); height: var(--mark-size);}
.checkbox__mark > * { opacity: 0; transform: scale(0); transform-origin: left bottom; transition: opacity, transform; transition-duration: var(--mark-transition-duration); }
.checkbox__mark svg { width: 100%; height: 100%; }
.checkbox__input input { grid-area: mark; width: 100%; height: 100%; margin: 0; padding: 0; z-index: -10; appearance: none; -moz-appearance: none; -webkit-appearance: none; }
.checkbox__input input:focus ~ .checkbox__mark {outline: 2px solid;}

.checkbox input:focus { border: none; outline: none; }
.checkbox input:focus + .checkbox__mark, .contact-form2 input[type="submit"]:focus { outline: var(--default-focus-outline); }
.checkbox__input input:checked + .checkbox__mark { color: var(--mark-checked-color); background-color: var(--mark-checked-background); }
.checkbox__input input:checked + .checkbox__mark > * { opacity: 1; transform: scale(1); }
.checkbox__label{user-select:none;}


/* Pomocné */

.f-weight { font-weight: 700; }

.m-0 { margin: 0 !important; }
.m-1 { margin: 0.5rem !important; }
.m-2 { margin: 1rem !important; }
.m-3 { margin: 1.5rem !important; }
.m-4 { margin: 2rem !important; }

.mx-0 { margin-left: 0 !important; margin-right: 0 !important;}
.mx-1 { margin-left: 0.5rem !important; margin-right: 0.5rem !important;}
.mx-2 { margin-left: 1rem !important; margin-right: 1rem !important;}
.mx-3 { margin-left: 1.5rem !important; margin-right: 1.5rem !important;}
.mx-4 { margin-left: 2rem !important; margin-right: 2rem !important;}

.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: 0.5rem !important; }
.ml-2 { margin-left: 1rem !important; }
.ml-3 { margin-left: 1.5rem !important; }
.ml-4 { margin-left: 2rem !important; }

.mr-0 { margin-right: 0 !important;}
.mr-1 { margin-right: 0.5rem !important;}
.mr-2 { margin-right: 1rem !important;}
.mr-3 { margin-right: 1.5rem !important;}
.mr-4 { margin-right: 2rem !important;}

.my-0 { margin-top: 0 !important; margin-bottom: 0 !important;}
.my-1 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important;}
.my-2 { margin-top: 1rem !important; margin-bottom: 1rem !important;}
.my-3 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important;}
.my-4 { margin-top: 2rem !important; margin-bottom: 2rem !important;}

.mb-0 { margin-bottom: 0 !important;}
.mb-1 { margin-bottom: 0.5rem !important;}
.mb-2 { margin-bottom: 1rem !important;}
.mb-3 { margin-bottom: 1.5rem !important;}
.mb-4 { margin-bottom: 2rem !important;}

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.5rem !important; }
.mt-2 { margin-top: 1rem !important; }
.mt-3 { margin-top: 1.5rem !important; }
.mt-4 { margin-top: 2rem !important; }

.p-0 { padding: 0 !important; }
.p-1 { padding: 0.5rem !important; }
.p-2 { padding: 1rem !important; }
.p-3 { padding: 1.5rem !important; }
.p-4 { padding: 2rem !important; }

.px-0 { padding-left: 0 !important; padding-right: 0 !important;}
.px-1 { padding-left: 0.5rem !important; padding-right: 0.5rem !important;}
.px-2 { padding-left: 1rem !important; padding-right: 1rem !important;}
.px-3 { padding-left: 1.5rem !important; padding-right: 1.5rem !important;}
.px-4 { padding-left: 2rem !important; padding-right: 2rem !important;}

.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: 0.5rem !important; }
.pl-2 { padding-left: 1rem !important; }
.pl-3 { padding-left: 1.5rem !important; }
.pl-4 { padding-left: 2rem !important; }

.pr-0 { padding-right: 0 !important;}
.pr-1 { padding-right: 0.5rem !important;}
.pr-2 { padding-right: 1rem !important;}
.pr-3 { padding-right: 1.5rem !important;}
.pr-4 { padding-right: 2rem !important;}

.py-0 { padding-top: 0 !important; padding-bottom: 0 !important;}
.py-1 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important;}
.py-2 { padding-top: 1rem !important; padding-bottom: 1rem !important;}
.py-3 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important;}
.py-4 { padding-top: 2rem !important; padding-bottom: 2rem !important;}

.pb-0 { padding-bottom: 0 !important;}
.pb-1 { padding-bottom: 0.5rem !important;}
.pb-2 { padding-bottom: 1rem !important;}
.pb-3 { padding-bottom: 1.5rem !important;}
.pb-4 { padding-bottom: 2rem !important;}
.pb-5 { padding-bottom: 2.5rem !important;}
.pb-6 { padding-bottom: 3rem !important;}
.pb-7 { padding-bottom: 3.5rem !important;}
.pb-8 { padding-bottom: 4rem !important;}

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.5rem !important; }
.pt-2 { padding-top: 1rem !important; }
.pt-3 { padding-top: 1.5rem !important; }
.pt-4 { padding-top: 2rem !important; }
.pt-5 { padding-top: 2.5rem !important; }
.pt-6 { padding-top: 3rem !important; }
.pt-7 { padding-top: 3.5rem !important; }
.pt-8 { padding-top: 4rem !important; }

.line-height-1 { line-height: 1em }
.line-height-1-1 { line-height: 1.1em }
.line-height-1-2 { line-height: 1.2em }

/******************************************************************************/
/* TinyMCE Responsive */
@media only screen and (max-width: 900px), (max-device-width: 900px) {
    /* tabulka - ceník */
    .table-price-list { width: 100%; }

    /* tabulka - adresa */
    .table-address, .table-address thead, .table-address tbody, .table-address tr, .table-address tr th, .table-address tr td { display: block; height: auto !important; text-align: left !important; width: auto !important; }
    .table-address tr td { margin-bottom: 1em; padding: 0 !important; }
    .table-address tr td:last-child { margin-bottom: 0; }

    .table-opening-hours { display: table; margin-bottom: 1.5em; }
    .table-opening-hours thead { display: table-header-group; }
    .table-opening-hours tbody { display: table-row-group; }
    .table-opening-hours tr { display: table-row; }
    .table-opening-hours tr td { display: table-cell; padding: 0 15px !important; }

    /* tabulka - kontakty */
    .table-contacts, .table-contacts thead, .table-contacts tbody, .table-contacts tr, .table-contacts tr th, .table-contacts tr td { display: block; height: auto !important; text-align: left !important; width: auto !important; }
    .table-contacts tr td { margin-bottom: 2em; padding: 0 !important; }
    .table-contacts tr:last-child td:last-child { margin-bottom: 0; }
}

@media only screen and (max-width: 770px), (max-device-width: 770px) {
    /* responzivní tabulka */
    .responzivni-tabulka, .responzivni-tabulka thead, .responzivni-tabulka tbody, .responzivni-tabulka tr, .responzivni-tabulka tr th, .responzivni-tabulka tr td { display: block; height: auto !important; text-align: left !important; width: auto !important; }
    .responzivni-tabulka tr td { margin-bottom: 1em; padding: 0 !important; }
    .responzivni-tabulka tr:last-child td:last-child { margin-bottom: 0; }
}