body {
    margin: 0;
}

form#pardot-form {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
}

form input, form select {
    border-radius: 4px;
    border: 1px solid var(--ng-color-blue01);
    background: white;
    color: black;
    width: 100%;
    font-family: "BrittiSans-Regular";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    padding: 11px 0 12px 11px;
    height: 100%;
    box-sizing: border-box;
}

.form-field {
    width: 48%;
    height: 44px;
    margin: 0;
}

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

form .policy {
    color: var(--ng-color-blue04);
    font-family: "BrittiSans-Regular";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 15.6px */
}

form .submit input {
    border: 0;
    border-radius: 100px;
    background: var(--ng-color-aqua05);
    height: 54px;
    padding: 16px 24px;
    color: var(--Blue-08, #0B1632);
    font-family: "BrittiSans-Medium";
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
}

/* I am not sure if the design is targeting the specific field or if it is targeting the field based on position */
/*form .company,
form:has(.state[style="display: none;"]) .Practice_Specialty {
    width: 100%;
}*/

.form-field:nth-child(10),
form:has(.state[style="display: none;"]) .form-field:nth-child(18) {
    width: 100%;
}

/* Select arrow styles */
form select,
::picker(select) {
    appearance: none;
}

form .pd-select {
    position: relative;
}

    form .pd-select::after {
        content: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M12.6464%205.64651C12.8417%205.45125%2013.1582%205.45125%2013.3535%205.64651C13.5487%205.84177%2013.5487%206.15828%2013.3535%206.35354L8.35348%2011.3535C8.15822%2011.5488%207.84171%2011.5488%207.64645%2011.3535L2.64645%206.35354C2.45118%206.15828%202.45118%205.84177%202.64645%205.64651C2.84171%205.45125%203.15822%205.45125%203.35348%205.64651L7.99996%2010.293L12.6464%205.64651Z%22%20fill%3D%22black%22%2F%3E%20%3C%2Fsvg%3E");
        height: 16px;
        width: 16px;
        display: block;
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
    }
/* End Select arrow styles */


@media(max-width:508px) {
    .form-field {
        width: 100%;
    }
    form#pardot-form {
        gap: 16px;
    }
}