CSS Reference

You are reading the documentation for Age Gate 2.x. Switch to the documentation for 3.x.
Class Description
.age-restriction Added to the body element.
.age-gate-wrapper A wrapper div containing all age gate content
.age-gate-wrapper.transition.up Transitions the Age Gate up when it is passed successfully (JS mode only)
.age-gate-wrapper.transition.down Transitions the Age Gate down when it is passed successfully (JS mode only)
.age-gate-wrapper.transition.left Transitions the Age Gate left when it is passed successfully (JS mode only)
.age-gate-wrapper.transition.right Transitions the Age Gate right when it is passed successfully (JS mode only)
.age-gate-wrapper.transition.fade Transitions the Age Gate by fading out when it is passed successfully (JS mode only)
.age-gate-background (Alpha 2) Additional element added when using background image
.age-gate Main div containing Age Gate form element
.age-gate-form Class added to the form element
.age-gate-heading The H1 element containing the site title
.age-gate-heading.age-gate-logo The H1 element if you have added a logo
.age-gate-subheading Secondary heading - “Please enter your date of birth” by default
.age-gate-message The message set before the age inputs
.age-gate-challenge Challenge text for Yes/No version
.age-gate-form-elements A UL containing the form fields
.age-gate-form-section LI elements containing the label and input or select fields
.age-gate-label The label for each field
.age-gate-input Added to the select or input fields
.age-gate-remember-wrapper Element wrapping the remember me option
.age-gate-remember Remember me label
.age-gate-submit The default submit button
.age-gate-submit-yes The “Yes” button when using Yes/No option.
.age-gate-submit-no The “No” button when using Yes/No option.
.age-gate-additional-information Wrapper element for the "Additional Content" text
.age-gate-error Wrapper element for the error messages (JS mode)
.age-gate-error-message Paragraph showing input error
.age-gate-loader Wrapper for loading icon (JS mode)
.age-gate-loading-icon SVG loading icon (JS mode)
.age-gate-working Class added to body element when Age Gate is making AJAX requests (JS mode)
.age-gate-sc-wrapper Wrapper for Age Gate generated via shortcode
.age-gate-inline-failed If rechallenge is false, a message with this class will be shown on failure
.age-gate-inline-failed-icon If rechallenge is false, the icon shown in the failed message