.logo-container 
{
    text-align: center;
    background-color: #f7f8f800;
    padding: 10px;
}
.logo 
{
    width: 250px;
    height: 60px;
    padding: 10px;
    margin-left: auto;
    margin-right: auto;
    position:sticky;
    opacity: 0.6;
}

body 
{
    font-family: 'Poppins';
    background-image: url('https://cms-files-uploads-mvp1.s3.af-south-1.amazonaws.com/logos/ReChargeBackground.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}
.container 
{
    max-width: 800px;
    margin: 0 auto;
    background-color: #fff;
    padding: 4px;
    
}
h2 
{
    text-align: left;
    font-weight: bold;
    font-size: large;
}
h3 
{
    text-align: center;
    font-weight: bolder;
    font-size: x-large;
}
form 
{
    max-width: auto; 
    margin: 0 auto;
}

#TextBoxSize label 
{
    display: inline-block;
    width: 6cm;
    text-align: left;
}
label 
{
    display: block;
    margin-top: 10px;
    text-align: left;
    font-weight: normal;
}

input 
{
    width: 100%; /* Make the input width 100% for responsiveness */
    padding: 8px;
    box-sizing: border-box;
    margin-top: 5px;
    display: inline-block;
}

.custom-input /*if you want to change the size of the input fields*/
{
    width: 50%; /* Adjust the width based on your preference */
    /* Add any other styles you want for the custom input */
}

button 
{
    background-color: #1e1d4e;
    color: white;
    padding: 10px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-right: 10px;
}

button:hover 
{
    background-color: rgb(78, 103, 243);
}


.contact-row 
{
    display: flex;
    align-items: center; /* Align items vertically in the middle */
    margin-bottom: 10px; /* Optional: Add some spacing between contact rows */
}

.contact-row label 
{
    margin-right: 10px; /* Optional: Add some spacing between label and input */
    flex-shrink: 0; /* Prevent label from shrinking */
}

.contact-row input 
{
    flex: 1; /* Expand input to fill available space */
    width: auto; /* Adjust width as needed */
}


.form-row 
{
    display: flex;
    flex-direction: column; /* Stack child elements vertically */
    margin-bottom: 10px; /* Adjust margin as needed */
}

.form-row-heading 
{
    text-align: left; /* Adjust alignment as needed */
    margin-bottom: 10px; /* Adjust margin as needed */
    font-weight: 500;
}

.form-row-content 
{
    display: flex;
    align-items: center;
    font-family: 'Poppins';
    font-size:small;
}

.form-row label 
{
    margin-right: 10px;

    width: auto;
    
}

.form-row input 
{
    flex: 1;
    width: auto;
}
.form-row textarea
{
    flex: 1;
    width: auto;
}
.form-row select
{
    flex: 1;
    width: auto;
    height: 0.9cm;
}

.thank-you-message {
    text-align: center;
    justify-content: center;
    top: 50%;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -70%);
    font-family: 'Poppins';
    font-size: x-large;
}
.form-row-content-thank-you
{
    text-align: center;
    justify-content: center;
    top: 60%;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    font-family: 'Poppins';
    font-size: large;
}
.required-field::before 
{
    content: "*";
    color: red;
    float: left;
}


#TextBoxTeamSize label 
{
    display: inline-block;
    width: 3cm;
    text-align: left;
}

#TextBoxTeamSize1 label 
{
    display: inline-block;
    width: 8cm;
    text-align: left;
}

#EQSize label 
{
    display: inline-block;
    width: 6cm;
    text-align: left;
}

#SQSize label 
{
    display: inline-block;
    width: 3.5cm;
    text-align: left;
}

#DropDownTK label 
{
    display: inline-block;
    width: 10cm;
    text-align: left;
}

/* For mobile devices */
@media only screen and (max-width: 600px) 
{
    .container 
    {
        width: 100%; /* Adjust as needed */
        background-color: #fff;
    }

    .form-row-content,.form-row-heading,.form-row input, .form-row select, .form-row textarea
    {
        margin-bottom: 10px;
        width: 100%;
        flex: 1;
    }

    input, select, textarea 
    {
        width: 100%;
        box-sizing: border-box;
        flex: 1;
    }
}

/* For desktop devices */
@media only screen and (min-width: 601px) 
{
    .container 
    {
        width: 60%; /* Adjust as needed */
        
        margin: 0 auto;
        background-color: #fff;
        padding: 20px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    }

    .form-row-content,.form-row-heading
    {
        margin-right: 10px;
        display: flex;
        align-items: center;
        font-family: 'Poppins';
        font-size:small;
    }

    input, select, textarea 
    {
        width: 80%;
        box-sizing: border-box;
    }
}