﻿



.Contact-Container {
    background-color: transparent;
    max-width: 1052px;
    width: 100%;
    margin: 10px auto 10px auto;
    display: flex;
    flex-wrap: wrap;
}


    /*.Contact-Container h1 {
        font-family: Verdana, sans-serif;
        font-size: 18pt;*/ /* Schriftgröße auf 14pt setzen */
        /*font-weight: bold;*/ /* Fett formatieren */
        /*padding: 0 10px;
    }

    .Contact-Container p {
        font-family: Verdana, sans-serif;
        font-size: 10.5pt;*/ /* Schriftgröße auf 14pt setzen */
        /*font-weight: normal;*/ /* Fett formatieren */
        /*padding: 0 10px;
    }*/



.Contact_Headerfeld {
    font-family: Verdana, sans-serif;
    font-size: 18pt;
    font-weight: bold;
    width: 100%;
    padding: 0 10px;
    padding-bottom: 50px;
    background-color: transparent;
}



.Contact_Infofeld_Container {
    width: 100%;
    padding: 0 10px;
    padding-bottom: 10px;
    background-color: transparent;
}

.Contact_Infofeld {
    background-color: transparent;
    min-width: 40%;
    margin: 0 2px;
    position: relative;
    font-family: Verdana, sans-serif;
    font-size: 11pt;
    /*display: flex;*/ /* Hinzugefügt: Flexbox-Container */
    /*flex-direction: column;*/ /* Anordnung der inneren Elemente in einer Spalte */
}


.Text_Input_Container {
    background-color: transparent;
    padding-bottom: 20px;
    margin-left: 10px;
    width: 100%;
    padding-right: 40px;
    white-space: nowrap; /* Verhindert Umbruch */
}

.Norm_TB_Style {
    background-color: white;
    color: black;
    margin-left: 10px;
    width: 100%;
    margin-top: 8px;
    height: 15px;
    border: 2px solid #009048; /* 2 Pixel Rahmen */
    border-radius: 8px; /* Abgerundete Ecken */
    padding: 5px; /* Innenabstand für den Text */
    max-width: 500px; /* Maximale Breite des Textfelds, ändere es nach Bedarf */
}

.Short_TB_Style {
    background-color: white;
    color: black;
    margin-left: 10px;
    width: 40px;
    margin-top: 8px;
    height: 15px;
    border: 2px solid #009048; /* 2 Pixel Rahmen */
    border-radius: 8px; /* Abgerundete Ecken */
    padding: 5px; /* Innenabstand für den Text */
}

.Extra_TB_Style {
    background-color: white;
    color: black;
    margin-left: 10px;
    /*    width: 100%;*/
    width: calc(100% - 67px); /* 100% Breite minus Platz für die kürzere TextBox */
    margin-top: 8px;
    height: 15px;
    border: 2px solid #009048; /* 2 Pixel Rahmen */
    border-radius: 8px; /* Abgerundete Ecken */
    padding: 5px; /* Innenabstand für den Text */
    max-width: 500px; /* Maximale Breite des Textfelds, ändere es nach Bedarf */
}




.Contact_TextStyl {
    font-family: Verdana, sans-serif;
    font-size: 11pt; /* Schriftgröße auf 14pt setzen */
    font-weight: normal; /* Fett formatieren */
    padding: 0 1px;
}


textarea {
    border: 2px solid #009048; /* 2 Pixel Rahmen */
    border-radius: 8px; /* Abgerundete Ecken */
    padding: 8px; /* Innenabstand für den Text */
    max-width: 500px; /* Maximale Breite des Textfelds, ändere es nach Bedarf */
    width:90%;
    margin-left: 10px;
    margin-top: 8px;
    max-width: 500px;
}





.Contact_Checkbox_Container {
    background-color: transparent;
    max-width: Calc(100% - 10px);
    width: 100%;
    margin-left: 10px;
    margin-right: 10px;
    padding: 20px 0px 0px 0px;
}







.Contact_Message_Container {
    background-color: transparent;
    max-width: 95%;
    width: 100%;
    margin-left: 0px;
    padding: 20px 0px 20px 0px;
}













.custom-checkbox label {
    position: relative;
    padding-left: 30px; /* Erhöhe den Abstand zwischen CheckBox und Text */
    margin-left: 10px;
    cursor: pointer; /* Ändere den Cursor, um anzuzeigen, dass auf die CheckBox geklickt werden kann */
}

    .custom-checkbox label::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 20px; /* Breite des Rahmens */
        height: 20px; /* Höhe des Rahmens */
        border: 2px solid #009048; /* Rahmen um das Kästchen */
        border-radius: 5px; /* Abgerundete Ecken */
        box-sizing: border-box;
    }

.custom-checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0; /* Verstecke die tatsächliche CheckBox */
}

    .custom-checkbox input[type="checkbox"] + label::before {
        background: #fff; /* Ändere den Hintergrund des Rahmens in Weiß */
        color: #000; /* Ändere die Textfarbe für das "X" in Schwarz */
        font-size: 16px; /* Ändere die Schriftgröße des "X" */
        content: " "; /* Füge das "X" als Content hinzu */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .custom-checkbox input[type="checkbox"]:checked + label::before {
        background-color: white; /* Hintergrundfarbe des Rahmens, wenn das Kästchen aktiviert ist */
        color: black; /* Textfarbe des "X" ändern, wenn das Kästchen aktiviert ist */
        content: "X"; /* Füge das "X" als Content hinzu */
    }

.Contact_left-align input[type="checkbox"] {
    margin-right: 10px; /* Hier können Sie den gewünschten Abstand anpassen */
}



.Contact-button {
    margin-left: 20px;
    padding: 10px 30px; /* Hier können Sie die Größe anpassen */
    background-color: #007bff; /* Hintergrundfarbe des Buttons */
    color: #fff; /* Textfarbe des Buttons */
    border: none; /* Entfernt die Standardrahmen des Buttons */
    border-radius: 8px; /* Runde Ecken für den Button */
    cursor: pointer; /* Zeigt die Hand als Mauszeiger */
    font-size: 16px; /* Schriftgröße des Buttons */
}

    .Contact-button:hover {
        background-color: #0056b3; /* Hintergrundfarbe des Buttons bei Hover */
    }







.Contact_Consent_Container {
    background-color: transparent;
    display: flex; /* Flexbox verwenden */
    justify-content: flex-start; /* Elemente am linken Rand ausrichten */
    align-items: flex-start; /* Elemente am oberen Rand ausrichten */
}



.Contact_Consent_Text_Container {
    background-color: transparent;
    max-width: 600px;
    width: 600px;
    margin-left: 10px; /* Abstand zwischen Checkbox und Text */
    margin-right:10px;
    padding-bottom:20px;

}

