@font-face { 
    font-family: "segoeui"; 
    src: url("./font/segoeuithis.ttf"); 
    }

@font-face { 
font-family: "leelawadee"; 
src: url("./font/leelawad.ttf"); 
}
        html {
            scroll-behavior: smooth;
        }

        * {
            box-sizing: border-box;
        }

        body {
            font-family: segoeui;
            background-color: #ffffff;
            margin: 0;
            color: #050505;
            position: relative;
            overflow-x: hidden;
        }

        p {
            margin-block-start: 0;
            margin-block-end: 0;
        }

        .full_page {
            display: flex;
            flex-direction: column;
            align-items: center;
            height: 100vh;
            width: 100vw;
        }

        .language {
            display: flex;
            position: absolute;
        }

        #de {
            right: 170px;
            top: 40px;
        }

        #en {
            right: 120px;
            top: 40px;
        }

        header {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            background-color: rgb(232, 235, 229);
            padding: 20px 0;
            gap: 20px;
            font-family: leelawadee;
            font-weight: bold;
            width: 100vw;
        }

        header img {
            height: 200px;
        }

        main {
            display: flex;
            align-items: center;
            flex-direction: column;
            width: 70vw;
        }

        .horizontal_line {
            height: 3px;
            width: 100vw;
            background-color: rgb(126, 126, 126);
            margin-bottom: 50px;
            margin-top: 50px;
        }

        .section {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 16px;
            padding: 20px 0;
            width: 100%;
        }

        .two-text_area {
            display: flex;
            gap:20px;
            width: 100%;
        }

        .two-pics_area {
            display: flex;
            justify-content: space-between;
            width: 100%;
        }

        .sectionPic {
            max-width: 100%;
        }

        .imgTrust {
            width: 48%;
        }

        .linkGreen {
            color: #121757;
            text-decoration: none;
            font-weight: bold;
        }

        .linkGreen:hover {
            color: rgb(0, 193, 252);
        }

        .two-text_area img {
            width: 156px;
            height: 200px;
            object-fit: cover;
        }

        .title_n_text {
            display: flex;
            flex-direction: column;
            gap: 16px;
            flex: 1;
            width: 100%;
        }

        .title {
           font-size: 25px;
           font-weight: bold;
           font-family: leelawadee; 
        }

        footer {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            background-color: black;
            padding: 20px 0;
            width: 100vw;
        }

        .link {
            color: white;
            text-decoration: none;
            font-weight: bold;
            font-size: 22px;
            border-style: solid;
            border-width: 5px;
            border-radius: 20px;
            padding-top: 10px;
            padding-bottom: 12px;
            padding-left: 12px;
            padding-right: 12px;
            background-color: #004a50;
            border-color: #004a50;
        }

        .link:hover {
            border-color: #00afbe;
        }

        .cookie {
           color: #ffffff; 
        }

        .imgContact {
            margin-top: 16px;
        }


@media (max-width: 1000px) {
    main {
        width: 95vw;
    }
}

@media (max-width: 850px) {
        #de{
            right: 100px; 
        }

        #en {
            right: 40px;
        }
}

@media (max-width: 700px) {
        #de{
            right: 70px; 
        }

        #en {
            right: 20px;
        }
        header img{
        height: 100px;    
        }

        .two-pics_area {
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 16px;
        }

        .imgTrust {
            width: 75%;
        }

}

@media (max-width: 450px) {
        h1 {
            font-size: 20px;
        }

        header {
            align-items: start;
            padding-left: 20px;
        }
        
        .section {
            gap: 8px;
        }

        .title {
            font-size: 18px;
        }
        .two-text_area img {
            width: 78px;
            height: 100px;
            gap: 8px;
        }

        .language {
            height: 30px;
            width: 30px;
        }
         #de{
            right: 50px; 
        }

        #en {
            right: 10px;
        }

        .imgTrust {
            width: 100%;
        }

}