/* ::-webkit-scrollbar{
    display: none;
  }  */
/* width */
::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: #d1495c;
    border-radius: none;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #d1495c;
    border-radius: 30px;
}

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

html {
    scroll-behavior: smooth;
}

@keyframes mymove {
    0% {
        transform: translate(0, 0px);
    }

    50% {
        transform: translate(0, 10px);
        opacity: 0.2;
    }

    100% {
        transform: translate(0, -0px);
    }

}

:root {
    --space-3xs: clamp(0.31rem, calc(0.31rem + 0vw), 0.31rem);
    --space-2xs: clamp(0.56rem, calc(0.54rem + 0.11vw), 0.63rem);
    --space-xs: clamp(0.88rem, calc(0.85rem + 0.11vw), 0.94rem);
    --space-s: clamp(1.13rem, calc(1.08rem + 0.21vw), 1.25rem);
    --space-m: clamp(1.69rem, calc(1.62rem + 0.32vw), 1.88rem);
    --space-l: clamp(2.25rem, calc(2.17rem + 0.42vw), 2.5rem);
    --space-xl: clamp(3.38rem, calc(3.25rem + 0.63vw), 3.75rem);
    --space-2xl: clamp(4.5rem, calc(4.33rem + 0.84vw), 5rem);
    --space-3xl: clamp(6.75rem, calc(6.5rem + 1.26vw), 7.5rem);
}

:root {
    --step--2: clamp(0.675rem, 0.6983rem + -0.0188vw, 0.6944rem);
    --step--1: clamp(0.8331rem, 0.7748rem + 0.283vw, 1.125rem);
    --step-0: clamp(1rem, 0.825rem + 0.8485vw, 1.875rem);
    --step-1: clamp(1.2rem, 0.8149rem + 1.8673vw, 3.1256rem);
    --step-2: clamp(1.44rem, 0.6859rem + 3.6564vw, 5.2106rem);
    --step-3: clamp(1.7281rem, 0.3366rem + 6.7467vw, 8.6856rem);
    --step-4: clamp(2.0738rem, -0.4074rem + 12.0297vw, 14.4794rem);
    --step-5: clamp(2.4881rem, -1.8416rem + 20.9927vw, 24.1369rem);
}

:root {
    --red: #d1495c;
    --orange: #edad49;
    --blue3: #013d5b;
    --blue2: #31638e;
    --blue1: #00798b;
    --green: #03FCC9;
}

@font-face {
    font-family: Playfaire;
    src: url(/font/PlayfairDisplay-Bold.ttf);
    font-weight: bold;
}

@font-face {
    font-family: Playfaire;
    src: url(/font/PlayfairDisplay-Regular.ttf);
    font-weight: normal;
}

@font-face {
    font-family: Poppins;
    src: url(/font/Poppins/Poppins-Light.ttf);
    font-weight: light;
}

@font-face {
    font-family: Monst;
    src: url(/font/Montserrat/Montserrat-Bold.ttf);
    font-weight: light;
}

.hidden {
    display: none;
}

.hidden2 {
    display: none;
}

.hidden_MOB_menu {
    display: none;
}

.body {
    min-height: 100%;
    background: rgb(0, 121, 139);
    background: -moz-linear-gradient(157deg, rgba(0, 121, 139, 0) 0%, rgba(3, 247, 198, 0.05103291316526615) 71%, rgba(1, 61, 91, 0.07904411764705888) 100%);
    background: -webkit-linear-gradient(157deg, rgba(0, 121, 139, 0) 0%, rgba(3, 247, 198, 0.05103291316526615) 71%, rgba(1, 61, 91, 0.07904411764705888) 100%);
    background: linear-gradient(157deg, rgba(0, 121, 139, 0) 0%, rgba(3, 247, 198, 0.05103291316526615) 71%, rgba(1, 61, 91, 0.07904411764705888) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00798b", endColorstr="#013d5b", GradientType=1);
}

.border {
    border: 2px solid red;
}
.wrapper{
    overflow-x: hidden;
}
.container {
    max-width: 1440px;
    display: block;
    position: relative;
    padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
    padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
    margin-inline: auto;
    overflow: hidden;
}

.container_individual_0_right {
    margin-right: 0px;
    padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
}

.container_individual_0_left {
    margin-left: 0px;
    padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
}

.center {
    margin-block: auto;
    margin-inline: auto;
}

.center_flex {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.center_text {
    text-align: center;
}

.row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin-top: var(--space-s);

}

.row2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-wrap: nowrap;
}

.row3 {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    text-wrap: nowrap;
}

.right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
}

/*GRID*/
.PC_grid_left_100 {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr;
    min-height: 100vh;
}

.PC_grid_left_150 {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr;
    min-height: 150vh;
}

.PC_grid_right {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: 1fr;
    min-height: 100vh;
}

.MOB_grid {
    display: grid;
    grid-template-rows: 1fr 1fr;

}

.margin_left {
    margin-left: var(--space-3xl);
}

.margin_right {
    margin-right: var(--space-3xl);
}

.margin_top {
    margin-top: var(--space-xl);
}

.margin_bottom {
    margin-bottom: var(--space-xl);
}

/*TEXT*/
a {
    text-decoration: none;
}

p {
    font-family: poppins;
    font-size: var(--step-0);
    color: var(--blue3);
}

.p_welcome p {
    color: var(--blue3);
    font-family: poppins;
    font-size: var(--step-4);
}

.p_welcome span {
    color: var(--orange);
    font-family: poppins;
    font-size: var(--step-5);
}

.span_p {
    font-family: poppins;
    font-size: var(--step-1);
    color: var(--orange);
    font-weight: bold;
}

/*HESLA*/
.heslo_blue {
    font-family: monst;
    font-weight: bold;
    font-size: var(--step-4);
    color: var(--blue3);
}

.heslo_orange {
    font-family: monst;
    font-weight: bold;
    font-size: var(--step-5);
    color: var(--orange);
}

.poppins_hselo_blue {
    color: var(--blue3);
    font-family: poppins;
    font-size: var(--step-4);
}

.poppins_hselo_orange {
    color: var(--orange);
    font-family: poppins;
    font-size: var(--step-5);
}

.nadpis {
    font-family: monst;
    font-weight: bold;
    font-size: 3em;
    color: var(--blue3);
    margin-block: var(--space-s);
}

/*BTN*/
.btn1 {
    font-size: var(--step-1);
    font-family: monst;
    padding: var(--space-s);
    padding-inline: var(--space-l);
    border-radius: var(--space-s);
    text-align: center;
    width: fit-content;
    height: fit-content;
    color: white;
    margin-bottom: 15px;
    background-color: var(--orange);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    transition: 0.5s;
    cursor: pointer;
}

.btn1:hover {
    color: var(--blue3);
}

.btn2 {
    font-size: var(--step-1);
    font-family: monst;
    padding: var(--space-s);
    padding-inline: var(--space-l);
    border-radius: var(--space-s);
    text-align: center;
    width: fit-content;
    height: fit-content;
    color: white;
    margin: 0px;
    background-color: var(--green);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    transition: 0.5s;
    cursor: pointer;
}

.btn2:hover {
    color: var(--blue3);
}

.btn3 {
    font-size: var(--step-1);
    font-family: monst;
    padding: var(--space-s);
    padding-inline: var(--space-l);
    border-radius: var(--space-s);
    text-align: center;
    width: fit-content;
    height: fit-content;
    color: var(--blue3);
    margin-right: var(--space-m);
    border: 1px solid var(--green);
    border-radius: var(--space-s);
    transition: 0.5s;
    cursor: pointer;
}

.btn3:hover {
    color: var(--orange);

}

.btn4 {
    font-size: var(--step-1);
    font-family: monst;
    padding: var(--space-s);
    padding-inline: var(--space-l);
    border-radius: var(--space-s);
    text-align: center;
    width: fit-content;
    height: fit-content;
    color: white;
    margin-bottom: 15px;
    background-color: var(--blue1);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    transition: 0.5s;
    cursor: pointer;
}

.btn4:hover {
    color: var(--red);
}

.online_img {
    width: 100%;
    display: flex;
    flex-direction: row;
    text-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.online_img img {
    max-height: 5vh;
}
.up1 .up2 .up3 .up4{
    max-height: 10vh;
}

@media only screen and (min-width: 0px) and (max-width: 330px) and (orientation: portrait) {

    .center {
        margin-block: 0px;
        margin-inline: 0px;
    }

    .MOB_center_flex {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 100vw;
    }

    .PC_grid_left_100 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: 100vh;
    }

    .PC_grid_right {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .PC_grid_left_150 {

        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: 150vh;

    }

    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: 0px;
    }

    .container_individual_0_right {
        margin-right: 0px;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .container_individual_0_left {
        margin-left: 0px;
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .MOB_padding_both {
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .row {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
        margin-top: var(--space-s);

    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .row3 {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        text-wrap: nowrap;
    }

    .btn3 {
        margin-block: var(--space-xs);
    }

    .padding_right {
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        height: 100%;
    }

    .section1 img {
        order: -1;
        max-width: 70vw;
        justify-self: right;
    }

    .section2 {
        height: auto;
        margin-top: var(--space-l);
    }

    .section3 {
    margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section4 p {
        height: auto;
    }

   .section4 img {
       max-height: 10vh;
       cursor: pointer;
       margin-top: var(--space-xs);
   }

    .section4 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section5 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section6 {
        margin-block: 20vh;
    }

    .section6 img {
        width: 70vw;
        justify-self: left;
    }

    .section7 p {
        height: auto;
    }

    .section7 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section7 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section8 p {
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section8 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section9 {
        margin-block: 20vh;
    }

    .section10 {
        margin-bottom: var(--space-2xl);
    }

    .section10 img {
        order: -1;
        width: 60vw;
        justify-self: right;
    }

    .row2 img {
        max-height: 10vh;
    }

    .section11 {
        width: 100vw;
        margin-bottom: var(--space-2xl);
    }

    .section11 img {
        max-height: 30vh;
        margin-block: var(--space-xs);

    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: cover;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 0px) and (max-width: 570px) and (orientation: landscape) {
    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: 0px;
    }

    .MOB_center_flex {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 100vw;
    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        height: auto;
    }
.section1 img {
    width: 50vw;
    justify-self: right;

}
    .section2 {
        height: auto;
    }

    .section2 p {
        width: 60vw;
        height: auto;
        margin-left: auto;

    }

    .section3 {
    margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section4 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section4 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section4 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        width: 60vw;
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section5 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }
.section6 img{
    max-width: 100%;
}
    .section7 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section7 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section7 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section7 {
        margin-bottom: var(--space-2xl);
    }

    .section7 img {
        order: -1;
        width: 70vw;
        justify-self: right;
    }

    .row2 img {
        max-height: 15vh;
    }

    .section8 p {
        width: 60vw;
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section8 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }
.section10 img{
    max-width: 100%;
}
    .section11 {
        min-height: 100vh;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .section11 img {
        height: 30vh;
        margin-block: var(--space-l);
    }

    .section12 {
        min-height: 40vh;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 331px) and (max-width: 450px) and (orientation: portrait) {
    .center {
        margin-block: 0px;
        margin-inline: 0px;
    }

    .MOB_center_flex {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        max-width: 100vw;
    }

    .PC_grid_left_100 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .PC_grid_right {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .PC_grid_left_150 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .nadpis {
        font-family: monst;
        font-weight: bold;
        font-size: 3em;
        color: var(--blue3);
        margin-block: var(--space-s);
    }

    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: var(--space-l);
    }

    .container_individual_0_right {
        margin-right: 0px;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-block: var(--space-l);
    }

    .container_individual_0_left {
        margin-left: 0px;
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-block: var(--space-l);
    }

    .MOB_padding_both {
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .row {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
        margin-top: var(--space-s);

    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .row3 {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        text-wrap: nowrap;
    }

    .btn3 {
        margin-block: var(--space-xs);
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        height: auto;
    }

    .section1 img {
        width: 70vw;
        order: -1;
        justify-self: right;
    }

    .section3 {
        margin-bottom: var(--space-xs);
            margin-top: var(--space-xs);
    }
    .section3 img {
        max-height: 10vh;
        cursor: pointer;
        margin-top: var(--space-xs);
    }
    .section4 p {
        height: auto;
    }

    .section4 img {
        max-height: 10vh;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section4 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section5 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section6 {
        margin-block: 20vh;
    }

    .section6 img {
        width: 70vw;
        justify-self: left;
    }

    .section7 p {
        height: auto;
    }

    .section7 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section7 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section8 p {
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section8 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section9 {
        margin-block: 20vh;
    }

    .section10 {
        margin-bottom: 20vh;
    }

    .section10 img {
        margin-bottom: var(--space-m);
        order: -1;
        width: 60vw;
        justify-self: right;
    }

    .row2 img {
        max-height: 10vh;
    }

    .section11 {
        width: 100vw;
    }

    .section11 img {
        max-height: 30vh;
        margin-block: var(--space-l);

    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: cover;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 571px) and (max-width: 950px) and (orientation: landscape) {
    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: 0px;
    }

    .MOB_center_flex {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 100vw;
    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        height: auto;
    }
.section1 img {
    width: 50vw;
    justify-self: right;

}
    .section2 {
        height: auto;
    }

    .section2 p {
        width: 60vw;
        height: auto;
        margin-left: auto;

    }

    .section3 {
        margin-bottom: var(--space-xs);
            margin-top: var(--space-xs);
    }

    .section4 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section4 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section4 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        width: 60vw;
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section5 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }
.section6 img{
    max-width: 100%;
}
    .section7 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section7 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section7 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section8 p {
        width: 60vw;
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section8 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }


    .row2 img {
        max-height: 20vh;
    }
.section10 img{
    max-width: 100%;
}
    .section11 {
        min-height: 100vh;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .section11 img {
        height: 30vh;
        margin-block: var(--space-l);
    }

    .section12 {
        min-height: 40vh;

        display: flex;
        flex-direction: column;
        align-items: center;
    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 451px) and (max-width: 900px) and (orientation: portrait) {
    .center {
        margin-block: 0px;
        margin-inline: 0px;
    }

    .MOB_center_flex {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-width: 100vw;
    }

    .PC_grid_left_100 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .PC_grid_right {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .PC_grid_left_150 {
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto;
        min-height: auto;
    }

    .nadpis {
        font-family: monst;
        font-weight: bold;
        font-size: 3em;
        color: var(--blue3);
        margin-block: var(--space-s);
    }

    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: var(--space-l);
    }

    .container_individual_0_right {
        margin-right: 0px;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-block: var(--space-l);
    }

    .container_individual_0_left {
        margin-left: 0px;
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-block: var(--space-l);
    }

    .MOB_padding_both {
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
    }

    .row {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-evenly;
        margin-top: var(--space-s);

    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .row3 {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        text-wrap: nowrap;
    }

    .btn3 {
        margin-block: var(--space-xs);
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        height: auto;
    }

    .section1 img {
        width: 70vw;
        order: -1;
        justify-self: right;
    }

    .section3 {
    margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section4 p {
        height: auto;
    }

    .section4 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section4 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section5 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section6 {
        margin-block: 20vh;

    }

    .section6 img {
        max-width: 60%;
        justify-self: left;
    }

    .section7 p {
        height: auto;
    }

    .section7 img {
        max-width: 100%;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section7 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section8 p {
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        cursor: pointer;
        margin-top: var(--space-xs);
    }

    .section8 .btn2 {
        height: auto;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section9 {
        margin-block: 20vh;
    }

    .section10 {
        margin-bottom: 20vh;
    }

    .section10 img {
        order: -1;
        max-width: 50%;
        justify-self: right;
    }

    .row2 img {
        max-height: 10vh;
    }

    .section11 {
        width: 100vw;
    }

    .section11 img {
        max-height: 30vh;
        margin-block: var(--space-l);

    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: cover;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 951px) and (max-width: 1270px) and (orientation: landscape) {
    .container {
        max-width: 100%;
        display: block;
        position: relative;
        padding-left: clamp(var(--space-xs), 5%, var(--space-xl));
        padding-right: clamp(var(--space-xs), 5%, var(--space-xl));
        margin-inline: auto;
        overflow: hidden;
        margin-block: var(--space-l);
    }

    .PC_grid_right {
        display: grid;
        grid-template-columns: 1fr 2fr;
        grid-template-rows: 1fr;
        min-height: auto;
    }

    .center_flex {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .row2 {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-wrap: nowrap;
    }

    .TER_menu {
        display: none;
    }

    .section1 {
        margin-top: 30vh;
        height: 100%;
    }

.section1 img {
    width: 50vw;
    justify-self: right;

}
    .section2 {
        height: auto;
    }

    .section2 p {
        width: 60vw;
        height: auto;
        margin-left: auto;

    }

    .section3 {
        margin-bottom: var(--space-xs);
            margin-top: var(--space-xs);
    }

    .section4 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section4 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section4 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        width: 60vw;
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section5 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .row2 img {
       max-height: 10vh;
    }

    .section6 {
        margin-block: 20vh;
    }
.section6 img{
    max-width: 100%;
}
    .section7 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section7 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section7 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section8 p {
        width: 60vw;
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section8 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section9 {
        margin-block: 20vh;
    }
.section10 img{
    max-width: 100%;
}
    .section11 {
        height: 70vh;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .section11 img {
        height: 30vh;
        margin-block: var(--space-l);
    }


    .flex {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;

    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    footer p {
        color: var(--orange);
    }
}

@media only screen and (min-width: 1271px) {
    .PC_grid_right {
        display: grid;
        grid-template-columns: 1fr 2fr;
        grid-template-rows: 1fr;
        min-height: auto;
    }

    .TER_menu {
        
        width: fit-content;
        border: 1px solid var(--green);
        border-radius: var(--space-s);
        margin-inline: auto;
        padding-block: var(--space-s);
    }

    .TER_menu_row {
        font-size: var(--step--2);
        width: 80vw;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-evenly;
        text-wrap: nowrap;
    }

    .TER_menu_row p {
        font-size: var(--step--1);
        cursor: pointer;
        transition: 0.5s;
    }

    .TER_menu_row p:hover {
        color: #edad49;
    }
    .section1 {margin-top: 20vh;
        height: auto;
    }
         .section1 img {
             max-width: 55vw;
             justify-self: right;
         }

    .section2 {
        margin-top: var(--space-m);
        height: auto;
    }

    .section2 p {
        width: 60vw;
        height: auto;
        margin-left: auto;

    }

    .section3 {
    margin-bottom: var(--space-l);
        margin-top: var(--space-l);
    }

    .section4 {
        background-image: url(/img/png/ter_bg1.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 100%;
    }

    .section4 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }

    .section4 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section4 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section5 p {
        width: 60vw;
        height: auto;
    }

    .section5 img {
        max-width: 100%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section5 .btn2 {
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }
.section6{
    margin-block: 20%;
}
    .section7 {
        background-image: url(/img/png/ter_bg1.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: 100%;
    }

    .section7 p {
        width: 60vw;
        height: auto;
        margin-left: auto;
    }
.section6 img{
    max-width: 100%;
}
    .section7 img {
        max-width: 100%;
        margin-left: 90%;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section7 .btn2 {
        height: auto;
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }

    .section9 {
        height: 100vh;
    }

    .row2 img {
        width: var(--space-m);
        margin-right: var(--space-s);
    }

    .section8 p {
        width: 60vw;
        height: auto;
    }

    .section8 img {
        max-height: 10vh;
        margin-top: var(--space-xs);
        cursor: pointer;
    }

    .section8 .btn2 {
        margin-left: 50%;
        margin-bottom: var(--space-xs);
        margin-top: var(--space-xs);
    }
.section10 img{
    max-width: 100%;
}
    .section11 {
        height: 70vh;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .section11 img {
        height: 30vh;
        margin-block: var(--space-l);
    }

    .section12 {
        height: 40vh;

        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .flex {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;

    }

    footer {
        height: 30vh;
        background-image: url(/img/png/footer.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    footer p {
        color: var(--orange);
    }
}