@charset "utf-8";

@font-face {
  font-family: 'Roboto';
  src: url("../../fonts/roboto/roboto-bold-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-bold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Roboto';
  src: url("../../fonts/roboto/roboto-bolditalic-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-bolditalic-webfont.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: 'Roboto';
  src: url("../../fonts/roboto/roboto-regular-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-regular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Roboto';
  src: url("../../fonts/roboto/roboto-italic-webfont.woff2") format("woff2"), url("../fonts/roboto/roboto-italic-webfont.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap; }

@font-face {
  font-family: 'Lexend';
  src: url("../../fonts/lexend/subset-lexend-bold.woff2") format("woff2"), url("../fonts/lexend/subset-lexend-bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap; }

@font-face {
  font-family: 'Lexend';
  src: url("../../fonts/lexend/subset-lexend-regular.woff2") format("woff2"), url("../fonts/lexend/subset-lexend-regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap; }

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

form:focus-visible,
input:focus-visible {
    outline: none;
}

body {
    font-family:  "Roboto", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #212529;
    background: #fff;
}


/* TYPOGRAPHY */
h1 {
    font-family: 'Lexend', sans-serif;
    font-size: 70px;
    font-weight: 700;
    line-height: 1.2; 
}

h2 {
    font-family: 'Lexend', sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2; 
}

h3 {
    font-family: 'Lexend', sans-serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.2;
}

h4 {
    font-family: 'Lexend', sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

h5 { /* nepoužito*/
    font-family: 'Lexend', sans-serif;
    font-size: 20px;
    font-weight: 700; /*původně 500 v main.css*/
    line-height: 1.2;
}

h6 {  
    font-family: 'Lexend', sans-serif;
    font-size: 16px; 
    font-weight: 700;
    line-height: 1.2;
}

h1,h2,h3,h4,h5,h6 {
    margin-bottom: 8px;
}

p {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 16px; 
}

.small {
    font-size: 0.875em;
}
.bold {
    font-weight: 700;
}

ul {
    list-style: none;
    padding-left: 15px;
}

ul li {
    padding-bottom: 10px;
}

ul li:before {
    position: relative;
    content: " ";
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 10px;
}

ul ul {
    padding: 10px 0 0 25px;
}

ul li ul li:before {
    position: relative;
    content: " ";
    width: 8px;
    height: 8px;
    display: inline-block;
    margin-right: 10px;
    background-color: #fff;
}

.no-bullet {
    padding: 0;
}

.no-bullet li:before {
    content: none;
}


/* GLOBAL CLASSES */
.container-new {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto; 
    max-width: 1320px;
}

.center,
.text-center {
    text-align: center;
}

.d-flex {
    display: flex;
}

.flex-column {
    flex-direction: column;
}

.gap-16 {
    gap: 16px;
}
.gap-20 {
    gap: 20px;
}
.gap-24 {
    gap: 24px;
}

.d-f-center {
    display: flex;
    justify-content: center;
}

.f-wrap {
    flex-wrap: wrap;
}

.display-none {
    display: none;
}

.display-none-imp {
    display: none !important;
}


.margin-0-auto {
    margin: 0 auto;
}

.margin-t-16 {
    margin-top: 16px;
}
.margin-t-24 {
    margin-top: 24px;
}
.margin-t-48 {
    margin-top: 48px;
}


.margin-b-16 {
    margin-bottom: 16px;
}
.margin-b-24 {
    margin-bottom: 24px;
}
.margin-b-48 {
    margin-bottom: 48px;
}

.margin-tb-48 {
    margin: 48px 0;
}
.margin-tb-24 {
    margin: 24px 0;
}



.wdt-25 {
    width: 25%;
}
.wdt-50 {
    width: 50%;
}
.wdt-65 {
    width: 65%;
}
.wdt-75 {
    width: 75%;
}
.wdt-100 {
    width: 100%;
}

.bg-graphic {
    background-image: url("/img/main-back.svg");
    background-size: 100%;
    background-position: left 20px;
    background-repeat: no-repeat; 
}

@media (max-width: 767.98px) {
    .bg-graphic {
      background-image: none; 
    } 
}

main {
    min-height: 300px;
    background-image: url(/img/main-back.svg);
    background-size: 100%;
    background-position: 0 650px;
    background-repeat: no-repeat;
}



/* MAIN COLORS */
.red {
    color: #DA2128;
}
a.red:hover {
    color: #e3585d;
}

.yellow {
    color: #E1CD00;
}
a.yellow:hover {
    color: #d9b905;
}

.green {
    color: #2C9A42; 
}
a.green:hover {
    color: #35b74f;
}

.orange {
    color: #D77900;
}
a.orange:hover {
    color: #f3a43d;
}

.blue {
    color: #0071CE;
}
a.blue:hover {
    color: #3da3f6;
}

.black {
    color: #000;
}
a.black:hover {
    color: #343434;
}

.grey {
    color: #727272;
}
a.grey:hover {
    color: #9f9f9f;
}



/* BUTTONS */
.button-main,   /* průhledné bg, main text - hover main, text bílý*/ 
.button-light,  /* bílé bg, main text - hover světlý*/
.button-swiper,
.button-main-banner,
.button-portal,
.button-actions,
.button-form {
    font-family: 'Lexend', sans-serif;
    font-weight: 400;
    font-size: 16px;
    display: flex;
    align-items: center;
    width: fit-content;
    gap: 8px;
    padding: 6px 14px;
    text-decoration: none;
    text-transform: uppercase;
} 

.button-portal {
    color: #fff;
    line-height: 1.2;
    padding: 0 20px;
    height: 40px;
    white-space: nowrap;
}

.button-portal:hover,
.button-main:hover {
    color: #fff;
}
 
.button-light,
.button-swiper:hover { 
    background-color: #fff;
} 

.button-swiper {
    color: #fff;
    border: 1px solid #fff;
    margin: 56px 0 24px;
}

.button-main-banner {
    color: #fff;
    border: 1px solid #fff;
}

.button-main-banner:hover {
    color: #000;
    background-color: #fff;
}

.button-footer {
    display: flex;
    align-items: center;
    text-transform: uppercase;
    font-weight: 700;
    text-decoration: none;
}

.button-footer::after {
    content: "";
    display: inline-block;
    background-image: url("/img/icons/arrow-right.svg");
    background-repeat: no-repeat;
    object-fit: cover;
    width: 16px;
    height: 16px;
    margin-left: 5px;
    transition: 0.3s all ease;
}

.button-footer:hover::after {
    transform: translate(2px, 0px);
}

.button-actions {
    font-weight: 700;
    margin-top: 20px;
}

.button-form {
    color: #fff;
    text-transform: uppercase;
    padding: 8px 14px;
    margin-top: 20px;
}


.button-main .icon-arrow,
:is(.button-main, .button-light, .button-swiper, .button-main-banner,) .icon {
    width: 15px;
    max-height: 15px;
}


/* SELECTION BUTTONS */
.selection {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 30px;
}

.selection a {
    font-family: 'Lexend', sans-serif;
    color: #555555;
    text-align: center;
    border: 1px solid #555555;
    padding: 10px 20px;
    text-decoration: none;
}

.selection a:hover,
.selection .active {
    color: #fff;
}

.selection .form-select {
    width: 300px;
}
  


/* FORMS */
form h5 {
    margin: 20px 0 10px;
}

form h6 {
    margin: 16px 0 10px;
}

form .row {
    margin-bottom: 18px;
}

form .row-inline { /* pro radio buttons*/
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.form-label {
    display: block;
    margin-bottom: 8px;
}

.form-control,
.form-select {
    display: block;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    cursor: pointer;
    width: 100%;
    padding: 6px 12px;
}

.form-select {
    appearance: none; 
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px; 
}

.form-control:disabled,
.form-select:disabled {
    background-color: #e9ecef; 
}

.form-check {
    margin-bottom: 18px;
}

.form-check-input {
    appearance: none;
    width: 16px;
    height: 16px;
    margin: 4px 8px 0 0;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0, 0, 0, 0.25);
    float: left;
}

.form-check-input[type="checkbox"] {
    border-radius: 4px; 
}

.form-check-input[type="radio"] {
    border-radius: 50%; 
}

.form-check-input:active {
    filter: brightness(90%); 
}

.form-check-input:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); 
}

.form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd; 
}

.form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e"); 
}

.form-check-input:checked[type="radio"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e"); }

.form-check-input[type="checkbox"]:indeterminate {
    background-color: #0d6efd;
    border-color: #0d6efd;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e"); 
}
.form-check-input:disabled {
    pointer-events: none;
    filter: none;
    opacity: 0.5; 
}
.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
    cursor: default;
    opacity: 0.5; 
}

.radio-input {
    margin-right: 8px;
}

.form-text {
  margin-top: 10px;
  font-size: 14px;
  color: #6c757d; 
}

textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit; 
    margin: 0;
}


/*vykopírované z form css*/
button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
}
.modal-header .close {
    padding: 0 1rem;
    margin: -1rem -1rem -1rem auto;
    font-size: 2rem;
}
.close:not(:disabled):not(.disabled) {
    cursor: pointer;
}





/* TOOLTIP IKONKA */
.tooltip-icon {
    position: absolute;
    background-image: url("/img/info-green.svg"); 
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 24px;
    height: 24px;
    z-index: 100;
    display: inline-block;
    margin: 0 8px;
}
  
.tooltip-box {
    position: absolute;
    text-align: center;
    font-size: 14px;
    background-color: #ffffffed;
    border: 1px solid #2c9942;
    padding: 8px 12px;
    max-width: 200px;
    z-index: 999;
    pointer-events: none;
    transition: opacity 0.2s;
    display: none;
}

.tooltip-box::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 6px;
    border-style: solid;
    border-color: #2c9942 transparent transparent transparent;
}




/* TABLE - fade effect */
.table-wrapper {
    position: relative; 
}

.table-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 150px;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    pointer-events: none;
    display: none;
}

.table-wrapper.overflowing::after {
    display: block;
}

.table-wrapper .table-scroll {
    overflow-x: auto;
}

.table-wrapper .table-scroll table {
    min-width: 100%;
    border-collapse: collapse;
}

.table-wrapper .table-scroll table th,
.table-wrapper .table-scroll table td {
    padding: 8px;
    min-width: 200px;
}

.table-wrapper .table-scroll table th {
    font-family: 'Lexend', sans-serif;
    font-weight: 700;
    text-align: left;
}


/* TABLE */
.table {
    width: 100%;
    border-collapse: collapse;
}

.table th,
.table td {
    padding: 8px;
}

.table-bordered,
.table-bordered :is(tr, th, td) {
    border: 1px solid #dee2e6;
}

.table-lines tr {
   border-bottom: 1px solid #dee2e6;
}

.table-striped tr {
    border-bottom: 1px solid #dee2e6;
}
.table-striped > tr:nth-of-type(odd) > *,
.table-striped tbody > tr:nth-of-type(odd) > * {
    background-color: #f2f2f2;
}

.table-borderless,
.table-borderless thead,
.table-borderless tbody,
.table-borderless tfoot,
.table-borderless tr,
.table-borderless th,
.table-borderless td {
  border: none !important;
}




/* MAP + VIRTUAL - start externí css*/
.ratio {
    position: relative;
    width: 100%; 
}

.ratio::before {
      display: block;
      padding-top: var(--bs-aspect-ratio);
      content: ""; 
}

.ratio > * {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
}
  
.ratio-1x1 {
 --bs-aspect-ratio: 100%; 
}
  
.ratio-4x3 {
    --bs-aspect-ratio: calc(3 / 4 * 100%); 
}
  
.ratio-16x9 {
    --bs-aspect-ratio: calc(9 / 16 * 100%); 
}
  
.ratio-21x9 {
    --bs-aspect-ratio: calc(9 / 21 * 100%); 
}
/* end externí css*/




/* RESPONSIVE DESIGN */
@media (max-width: 1399.98px) {
    .container-new {
        max-width: 1140px;
    }
}

@media (max-width: 1199.98px) {
    .container-new {
        max-width: 960px;
    }
}

@media (max-width: 991.98px) {
    .container-new {
        max-width: 720px;
    }
}

@media (max-width: 767.98px) {
    .container-new {
        max-width: 540px;
    }
}

@media (max-width: 575.98px) {
    .container-new {
        max-width: 100%;
    }
}