* {
  box-sizing:border-box;
}
:root {
            --primary-color: #007bff;
            --secondary-color: #6c757d;
            --background-color: #f8f9fa;
            --form-background-color: #ffffff;
            --border-color: #ced4da;
            --border-radius: 0.25rem;
            --box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }

        body {
            font-family: 'Arial', sans-serif;
            background-color: var(--background-color);
            padding: 20px;
        }

        #logo {
          display:block;
          margin: 0 auto;
        }

        form {
            background-color: var(--form-background-color);
            padding: 20px;
            border-radius: var(--border-radius);
            box-shadow: var(--box-shadow);
            max-width: 800px;
            margin: auto;
        }

        .form-section {
            margin-bottom: 20px;
        }

        .form-section h2 {
            color: var(--primary-color);
            margin-bottom: 15px;
        }

        .successmessage {
          font-size:24px;font-weight:bold;text-align:center;background:#BCF9C7;color:#000;width:500px;margin:0 auto;border-radius:4px;padding:5px;display:block;margin-bottom:20px;
        }

        .failmessage {
          font-size:24px;font-weight:bold;text-align:center;background:#FE9B9B;color:#000;width:500px;margin:0 auto;border-radius:4px;padding:5px;display:block;margin-bottom:20px;
        }

        label {
            font-size:19px;
            display: block;
            margin-bottom: 0;
            margin-bottom: 25px;
        }

        input, select, textarea {
            width: 100%;
            padding: 10px;
            margin-top:4px;
            border-radius: var(--border-radius);
            border: 1px solid var(--border-color);
            font-size:17px;
        }

        textarea {
            height:200px;
        }

        textarea {
            scrollbar-width: thin; /* For Firefox */
            scrollbar-color: #888 #ffffff; /* Scroll thumb and track */
        }

        /* For Webkit browsers */
        textarea::-webkit-scrollbar {
            width: 12px;
        }

        textarea::-webkit-scrollbar-thumb {
            background: #888;
            border-radius: 6px;
        }

        textarea::-webkit-scrollbar-track {
            background: #ffffff;
        }

        input[type="checkbox"], input[type="radio"] {
            width: auto;
            margin-right: 10px;
            margin-bottom: 0;
        }

        label.checkboxlabel {margin-bottom:15px;}

        input[type="submit"] {
            background-color: var(--primary-color);
            color: white;
            border: none;
            padding: 10px 20px;
            cursor: pointer;
            border-radius: var(--border-radius);
            transition: background-color 0.2s;
        }

        input[type="submit"]:hover {
            opacity:.7;
        }




        @media (max-width: 768px) {
            body {
                padding: 0;
            }

            form {
                padding: 10px;
            }
        }

            @media (max-width: 500px) {

              * {font-size:105%;}



            }