:root {
}
body {
    background-color: #dae4e2;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: Metrisch;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

@media (min-width: 500px) {
    .desktop-normal-text {
        font: normal normal 400 20px / 28px Metrisch;
    }
    .desktop-normal-bold {
        font: normal normal bold 26px / 30px Metrisch;
    }
    .desktop-big-bold {
        font: normal normal bold 40px/40px Metrisch;
    }
    .container {
        width: 100vw;
        min-height: 100vh;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        overflow: hidden;
        background-color: #C2D1CF;
    }
    .fejlec {
        display: flex;
        justify-content: center;
        max-height: 800px;
        width: 100%;
        background-color: #979185;
        background-image: url("images/BM_header_repeat.jpg");
        background-repeat: repeat-x;
        background-size: contain;
    }
    .fejlec-image {
        max-height: 800px;
        height: 100%;
        max-width: 100%;
    }
    .szoveg {
        background: #c2d2cf 0% 0% no-repeat border-box;
        color: black;
        text-align: center;
        padding-top: 0px;
        padding-bottom: 67px;
        letter-spacing: 0px;
        margin-top: calc(100vw * -0.05);
    }
    .fullwidth {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .termekek {
        background-color: white;
        padding-top: 200px;
        width: 100%;
        overflow-x: scroll;
        /* scrollbar-color: #dae4e2 #dae4e2; */
        display: flex;
        justify-content: start;
        align-items: baseline;
        background-image: url("images/BM_product_bg_repeat_1080.jpg");
        background-repeat: repeat-x;
        background-size: contain;

    }
    .kapcsolat {
        padding-top: 70px;
        padding-bottom: 70px;
        background-color: #dae4e2;
    }
    .lablec {
        background-color: white;
    }
    .content {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 95%;
    }
    .termekek-container {
        display: flex;
        flex-wrap: nowrap;
    }
  
    .content2 {
        display: flex;
        justify-content: start;
        align-items: start;
        flex-direction: column;
        width: 100%;
    }
    .termek {
        padding-left: 20px;
        padding-right: 25px;
        padding-bottom: 34px;
        padding-top: 10px;
        width: calc(30vw);
        margin-left: 13px;
        margin-right: 13px;
        max-width: 358px;
        min-width: 250px;
    }
    .termek-kep-div {
    }
    .termek-nev {
        margin-top: 50px;
    }
    .termek-leiras {
        margin-top: 30px;
    }
    .termek-kep {
        max-width: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: -200px;
    }
    .termek-img {
        max-width: 100%;
        user-drag: none;
        -webkit-user-drag: none;
        user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
    }
    .kapcsolat-cim {
        text-align: center;
        letter-spacing: 0px;
        color: black;
        text-transform: uppercase;
        margin-bottom: 40px;
    }
    .kapcsolat-text {
        text-align: center;
        letter-spacing: 0px;
        color: black;
    }
    .lablec > .content {
        text-align: center;
        letter-spacing: 0px;
        color: black;
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .logo {
        position: absolute;
        display: flex;
        justify-content: center;
        align-items: start;
        margin-top: 12%;
        margin-left: 34%;
        width: 100%;
    }
    .svg-image {
        top: 0px;
        left: 0px;
        width: 33%;
    }
    .kapcsolat-insta {
        margin-top: 30px;
    }
    .swipe-svg-image {
        width: 70%;
        max-width: 350px;
        margin-bottom: 50px;
    }
}
@media (max-width: 499px) {
    .desktop-normal-text {
        font: normal normal 400 14px / 18px Metrisch;
    }
    .desktop-normal-bold {
        font: normal normal bold 14px / 13px Metrisch;
    }
    .desktop-big-bold {
        font: normal normal bold 18px/18px Metrisch;
    }
    .container {
        width: 100vw;
        min-height: 100vh;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
        background-color: #C2D1CF;
    }
    .fejlec {
        display: flex;
        flex-direction: column;
        justify-content: center;
        max-height: 800px;
        width: 100%;
        background-color: #979185;
        background-image: url("images/BM_header_repeat.jpg");
        background-repeat: repeat-x;
        background-size: contain;
    }
    .fejlec-image {
        max-height: 800px;
        height: 100%;
        max-width: 100%;
    }
    .szoveg {
        background: #c2d2cf 0% 0% no-repeat border-box;
        color: black;
        text-align: center;
        padding-top: 0px;
        padding-bottom: 67px;
        letter-spacing: 0px;
        margin-top: calc(100vw * -0.05);
    }
    .fullwidth {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .termekek {
        background-color: white;
        padding-top: 150px;
        width: 100%;
        overflow-x: scroll;
        /* scrollbar-color: #dae4e2 #dae4e2; */
        display: flex;
        justify-content: start;
        align-items: baseline;
        background-image: url("images/BM_product_bg_repeat_1080.jpg");
        background-repeat: repeat-x;
        background-size: contain;
    }
    .kapcsolat {
        padding-top: 70px;
        padding-bottom: 70px;
        background-color: #dae4e2;
    }
    .lablec {
        background-color: white;
    }
    .content {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 95%;
    }
    .termekek-container {
        display: flex;
        flex-wrap: nowrap;
        gap: 27px;
    }
    .content2 {
        display: flex;
        justify-content: start;
        align-items: start;
        flex-direction: column;
        width: 100%;
    }
    .termek {
        padding-left: 20px;
        padding-right: 25px;
        padding-bottom: 34px;
        padding-top: 10px;
        width: calc(30vw);
        margin-left: 13px;
        margin-right: 13px;
        max-width: 358px;
        min-width: 250px;
    }
    .termek-kep-div {
    }
    .termek-nev {
        margin-top: 50px;
    }
    .termek-leiras {
        margin-top: 30px;
    }
    .termek-kep {
        max-width: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: -150px;
    }
    .termek-img {
        max-width: 50%;
    }
    .kapcsolat-cim {
        text-align: center;
        letter-spacing: 0px;
        color: black;
        text-transform: uppercase;
        margin-bottom: 40px;
    }
    .kapcsolat-text {
        text-align: center;
        letter-spacing: 0px;
        color: black;
    }
    .lablec > .content {
        text-align: center;
        letter-spacing: 0px;
        color: black;
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .logo {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: start;
        padding-top: 30px;
        padding-bottom: 25px;
    }
    .svg-image {
        width: 70%;
    }
    .kapcsolat-insta {
        margin-top: 30px;
    }
    .swipe-svg-image {
        width: 70%;
        max-width: 300px;
        margin-bottom: 30px;
    }
}

