v0.2.2

You can now modify Element styling in the survey initialization, eg

```
const survey = new Survey({
    styles: {
        Element: {
            root: {
                background: 'gray',
            }
        }
    }
});
```

**Styling**

The element styles you can style from the survey are

'root', 'innerContainer', 'textContainer', 'text', 'subText', 'errorMessage'

Element-specific styling is still done at the element level and can override default styles from the survey, eg

```
const openEnd = new OpenEnd({
    id: 'feedback',
    text: 'Please provide any additional feedback you may have',
    styles:{
        root: {
            background: 'white', // Overrides the gray background set in the survey styles
        },
        textarea: {
            borderRadius: '0px', // Removes the default border radius only on the textarea
        }
    }
});
```

The styling for the survey is the same as before, but there is no question selector 

**Custom validation**

Each question can now take an optional customValidation input that is a function to determine whether the response is valid. The function takes their response as an input. If it fails, it returns a string with the error message. If it passes, it returns true, eg
```
const singleSelect = new SingleSelect({
    id: 'favorite-color',
    text: 'What is your favorite color?',
    options: ['Red', 'Blue', 'Green', 'Yellow'],
    customValidation: (response) => {
        if (response === 'Yellow') {
            return 'Yellow is not a valid option';
        }
        return true;
    }
});
```
This validation is done in addition to the other validation (e.g., was a required question answered, is the the length of an open end above the minimum length specified, ect).

**PageHTML**
```
There is a new plugin called PageHTML that adds an HTML element to every page, eg
const logo = new PageHTML({
    id: 'logo',
    content: '<img src="https://roundtable.ai/images/logo-with-text.svg" alt="Company Logo">',
    position: 'top',
    styles:{
        root: {
            margin: '0 auto',
            width: '100%',
            maxWidth: '180px',
        }
    }
});

survey.addPlugin(logo);
```

The PageHTML takes targetId, which is the id of the div that it will be added to (default 'survey-container') and a position ('top' or 'bottom') the specifies where in the div it should be added

**Rename element**
OrderedScale is now called NumberScale

**SingleSelect other**
You can allow the participant to set an "other" response to SingleSelect by allowOther to true. Optionally you can also pass otherText as the name of this option (default: "Other (please specify)")
```
const singleSelect = new SingleSelect({
    id: 'favorite-color',
    text: 'What is your favorite color?',
    subText: 'Select one option',
    options: ['Red', 'Blue', 'Green', 'Yellow'],
    allowOther: true,
    otherText: 'Other (please be specifi)',
});
```

**Plugin updates**
You can now remove plugins the same way they are added:
survey.removePlugin(logo);