pass join flow image background classes through to relevant steps

src/components/join-flow/birthdate-step.jsx

@@ -90,6 +90,7 @@ class BirthDateStep extends React.Component {
                     } = props;
                     return (
                         <JoinFlowStep
+                            headerImgClass="birthdate-step-image"
                             headerImgSrc="/images/join-flow/birthdate-header.png"
                             innerClassName="join-flow-inner-birthdate-step"
                             title={this.props.intl.formatMessage({id: 'registration.birthDateStepTitle'})}

src/components/join-flow/country-step.jsx

@@ -69,6 +69,7 @@ class CountryStep extends React.Component {
                     } = props;
                     return (
                         <JoinFlowStep
+                            headerImgClass="country-step-image"
                             headerImgSrc="/images/join-flow/country-header.png"
                             innerClassName="join-flow-inner-country-step"
                             title={this.props.intl.formatMessage({id: 'registration.countryStepTitle'})}

src/components/join-flow/email-step.jsx

@@ -151,6 +151,7 @@ class EmailStep extends React.Component {
                                     }}
                                 />
                             )}
+                            headerImgClass="email-step-image"
                             headerImgSrc="/images/join-flow/email-header.png"
                             innerClassName="join-flow-inner-email-step"
                             nextButton={this.props.intl.formatMessage({id: 'registration.createAccount'})}

src/components/join-flow/join-flow-step.jsx

@@ -14,6 +14,7 @@ const JoinFlowStep = ({
     description,
     descriptionClassName,
     footerContent,
+    headerImgClass,
     headerImgSrc,
     nextButton,
     onSubmit,
@@ -24,7 +25,12 @@ const JoinFlowStep = ({
     <form onSubmit={onSubmit}>
         <div className="join-flow-outer-content">
             {headerImgSrc && (
-                <div className="join-flow-header-image-wrapper">
+                <div
+                    className={classNames(
+                        'join-flow-header-image-wrapper',
+                        headerImgClass
+                    )}
+                >
                     <img
                         className="join-flow-header-image"
                         src={headerImgSrc}
@@ -80,6 +86,7 @@ JoinFlowStep.propTypes = {
     description: PropTypes.string,
     descriptionClassName: PropTypes.string,
     footerContent: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+    headerImgClass: PropTypes.string,
     headerImgSrc: PropTypes.string,
     innerClassName: PropTypes.string,
     nextButton: PropTypes.node,

src/components/join-flow/welcome-step.jsx

@@ -43,6 +43,7 @@ class WelcomeStep extends React.Component {
                                 id: 'registration.welcomeStepDescriptionNonEducator'
                             })}
                             descriptionClassName="join-flow-welcome-description"
+                            headerImgClass="welcome-step-image"
                             headerImgSrc="/images/join-flow/welcome-header.png"
                             innerClassName="join-flow-inner-welcome-step"
                             nextButton={this.props.createProjectOnComplete ? (