Frames
Frames are used to separate a webpage into different sections, with each section being its own window. If possible, avoid using frames because they create usability and accessibility issues. If you must use frames, ensure that each frame has a meaningful title which gives a clear indication of the content within that frame. Also, include a <![CDATA[ element to specify equivalent content for web browsers that do not support frames or are configured not to display them.</p>
<h3>Iframes</h3>
<p>Inline frames (iframes) are used to embed content from one webpage into another (e.g., a video from YouTube or a social media widget). If you incorporate an iframe on your page, ensure that it has a meaningful title. Also, provide alternative content by including a text description between the iframe start and end tags.</p>
<p>For more information, visit <a href="http://webaim.org/techniques/frames/">WebAIM's Creating Accessible Frames and Iframes</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921171 paragraphs-item-921171 paragraph--view-mode--default accordion" id="accordion-921171">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Heading</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Headings help users understand what information is contained on a webpage and how that information is organized. Headings also allow screen-reader and assistive technology users to skim the structure of a page and navigate to or skip over sections.</p>
<p>When designing the structure of your page, follow these best practices.</p>
<ul><li>Use headings to denote a page's structure rather than for visual effect.</li>
<li>Apply heading markup (h1-h6) to all visual headings. Do not format text to make it look like a heading.</li>
<li>Use only one main heading (h1) which should be the page title.</li>
<li>Order headings properly. Subheadings of h1 are h2s, subheadings of h2s are h3s, etc.</li>
<li>Make headings short and descriptive so users can easily find the information they are looking for.</li>
<li>Make sure all headings have associated content (i.e., no empty headings).</li>
</ul><h3><i aria-hidden="true" class="fab fa-drupal"> </i> Drupal Websites</h3>
<p>If your webpage is hosted on the University's Drupal web platform (wsfs.ngskmc-eis.net), you can apply heading styles (Heading 2, Heading 3, etc.) using the Format button on the WYSIWYG toolbar. In Drupal, the page title is marked up as Heading 1, so the first level of subheadings within the page content should be marked up as Heading 2.</p>
<h3><i aria-hidden="true" class="far fa-code"> </i> Non-Drupal Websites</h3>
<p>If your webpage is hosted on the University's web server (web.ngskmc-eis.net) or by a third-party, use correct HTML markup to style headings (h1, h2, h3, etc.). For more information, visit <a href="http://www.w3.org/WAI/tutorials/page-structure/headings/">W3C's Headings</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921176 paragraphs-item-921176 paragraph--view-mode--default accordion" id="accordion-921176">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Images</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Images can enhance content or add visual interest to a webpage, but they are inaccessible to people with visual impairments. To be accessible, all images are required to have an equivalent alternative text (alt text). It is read by screen readers in place of an image, allowing the content and function of the image to be accessible. The most appropriate alt text for an image depends on the purpose of the image within the context of the webpage.</p>
<ul><li>If an image conveys simple information, the alt text should convey the same essential information as the image.</li>
<li>If an image conveys complex information (e.g., a chart or graph), it should include a short alt text and a long description that provides more detail about the image.</li>
<li>If an image is purely decorative, the alt attribute should be empty (alt=""). This tells screen readers to completely ignore the image.</li>
<li>If an image has a caption or is described in adjacent text, the alt attribute should be empty (alt="") so that the information is not read twice by screen readers.</li>
<li>If an image contains text, the alt text should contain the same text.</li>
<li>If an image is linked, the alt text should describe the link's destination.</li>
<li>If an image is used as a button, the alt text should describe the button's purpose.</li>
</ul><p>For more information, visit <a href="http://webaim.org/techniques/alttext/">WebAIM's Alternative Text</a> page.</p>
<h3><i aria-hidden="true" class="fab fa-drupal"> </i> Drupal Websites</h3>
<p>To ensure that websites hosted on the University's Drupal web platform (wsfs.ngskmc-eis.net) meet accessibility requirements, an alt text is required for all images. For instructions on how to add an image in Drupal, visit the <a href="/support/adding-images">Adding Images</a> page.</p>
<h3><i aria-hidden="true" class="far fa-code"> </i> Non-Drupal Websites</h3>
<p>If your webpage is hosted on the University's web server (web.ngskmc-eis.net) or by a third-party, ensure that all images include an appropriate alt text. For more information, visit <a href="http://www.w3.org/WAI/tutorials/images/">W3C's Images Concepts</a> page and <a href="http://webaim.org/techniques/images/">WebAIM's Accessible Images</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921181 paragraphs-item-921181 paragraph--view-mode--default accordion" id="accordion-921181">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Links</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Links are one of the most basic and important elements of a website. They are essential for website navigation and can be used to cross-reference related content. As a result, inaccessible links are one of the biggest issues a website can have.</p>
<h3>When Using Links</h3>
<p>You can improve the usability and accessibility of your links by following these best practices.</p>
<ul><li>Use link text that is meaningful when read out of context. Avoid using redundant or ambiguous link text such as "click here" or "read more".</li>
<li>Keep link text concise. A long link is more likely to break across lines on a webpage, making it look like two links.</li>
<li>Avoid using URLs as link text. If a URL is relatively short such as a site's homepage, it may be used as the link text.</li>
<li>Do not use the same text for links that go to different destinations.</li>
<li>Ensure that links can be navigated using the keyboard.</li>
<li>Style links to make them distinctive from other types of text on a webpage. Underlining links is a standard convention to denote that text is clickable.</li>
</ul><p>For more information, visit <a href="http://webaim.org/techniques/hypertext/">WebAIM's Links and Hypertext</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921186 paragraphs-item-921186 paragraph--view-mode--default accordion" id="accordion-921186">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Plug-ins</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Plug-ins enable web browsers to display a particular file format (PDF, Word, Excel, PowerPoint, etc.). When a webpage links to a file that requires a plug-in to display the content, a link must be provided to a page where the plug-in can be downloaded.</p>
<h3><i aria-hidden="true" class="fab fa-drupal"> </i> Drupal Websites</h3>
<p>If your webpage is hosted on the University's Drupal web platform (wsfs.ngskmc-eis.net), this requirement is automatically met for common file types via the File Viewers link located in the website footer. If you link to a file which requires a plug-in that is not listed on the <a href="/plugins">File Viewers and Plug-ins</a> page, you need to add a link to a page where the plug-in can be downloaded.</p>
<h3><i aria-hidden="true" class="far fa-code"> </i> Non-Drupal Websites</h3>
<p>If your webpage is hosted on the University's web server (web.ngskmc-eis.net) or by a third-party, you can meet this requirement by adding a link to a page where the appropriate plug-in can be downloaded. For a list of plug-ins for common file types, visit the <a href="/plugins">File Viewers and Plug-ins</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921191 paragraphs-item-921191 paragraph--view-mode--default accordion" id="accordion-921191">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Skip-Navigation</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Many websites have redundant navigation links across multiple pages. For screen reader users and users navigating by keyboard, these links can become burdensome if there is no way to efficiently skip past them. To improve the accessibility of your site, include a skip navigation link on each page to allow site visitors to skip over repetitive page elements and get to the main content.</p>
<h3><i aria-hidden="true" class="fab fa-drupal"> </i> Drupal Websites</h3>
<p>If your webpage is hosted on the University's Drupal web platform (wsfs.ngskmc-eis.net), this requirement is automatically met. Every page that is created in Drupal includes a "Skip to content" link.</p>
<h3><i aria-hidden="true" class="far fa-code"> </i> Non-Drupal Websites</h3>
<p>If your webpage is hosted on the University's web server (web.ngskmc-eis.net) or by a third-party, you can meet this requirement by adding a link at the top of each page that goes directly to the main content. For more information, visit <a href="http://webaim.org/techniques/skipnav/">WebAIM's Skip Navigation Links</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921196 paragraphs-item-921196 paragraph--view-mode--default accordion" id="accordion-921196">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Tables</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>Tables should be used to present data; they should not be used to create a page layout. For a data table to be accessible, it needs to include column and/or row headers and markup that associates data cells to their respective headers.</p>
<h3><i aria-hidden="true" class="fab fa-drupal"> </i> Drupal Websites</h3>
<p>If your webpage is hosted on the University's Drupal web platform (wsfs.ngskmc-eis.net), you can easily create accessible tables. When you add a table to your page, make sure to specify column and/or row headers in the Table Properties dialog box. Based on your selection, Drupal will automatically add the appropriate markup to your table to associate data cells with their headers. For instructions on how to add a table in Drupal, visit the <a href="/support/adding-tables">Adding Tables</a> page.</p>
<h3><i aria-hidden="true" class="far fa-code"> </i> Non-Drupal Websites</h3>
<p>If your webpage is hosted on the University's web server (web.ngskmc-eis.net) or by a third-party, make sure to create accessible tables by using the appropriate HTML markup to associate data cells with their headers. For more information, visit <a href="http://www.w3.org/WAI/tutorials/tables/">W3C's Tables Concepts</a> page and <a href="http://webaim.org/techniques/tables/data">WebAIM's Creating Accessible Tables</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921201 paragraphs-item-921201 paragraph--view-mode--default accordion" id="accordion-921201">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Text</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><p>To be accessible, website text must have a high level of readability and legibility. Readability is the ease with which a reader can recognize words, sentences, and paragraphs. Legibility is the ease with which a reader can recognize individual characters in text.</p>
<p>You can improve the accessibility of your text by following these best practices.</p>
<ul><li>Write clearly and concisely.</li>
<li>Structure content with headings and lists.</li>
<li>Use real text rather than text embedded within graphics.</li>
<li>Provide sufficient contrast between text and its background.</li>
<li>Select simple, readable fonts.</li>
<li>Avoid small font sizes.</li>
<li>Use relative units for font size.</li>
<li>Avoid fully-justified text.</li>
<li>Avoid blinking or moving text.</li>
<li>Limit the use of font variations such as <strong>bold</strong>, <em>italics</em>, and ALL CAPITAL LETTERS.</li>
<li>Do not underline text unless the text is a link.</li>
<li>Identify any changes in language (e.g., English to Spanish).</li>
</ul></div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-remove paragraph-width-100 paragraph paragraph--type--content paragraph--id--921206 paragraphs-item-921206 entity_921206 paragraph--view-mode--default paragraphs-item-content">
<div class="clearfix text-formatted field field--name-field-text field--type-text-long field--label-hidden field__items">
<div class="field__item"><h3>Creating Accessible Web Content</h3>
<p>Most web content can be made accessible by following the simple guidelines listed above. For a comprehensive list of web accessibility guidelines and how to meet them, visit <a href="http://webaim.org/standards/wcag/checklist">WebAIM's WCAG 2.0 Checklist</a> page and <a href="http://www.w3.org/WAI/WCAG20/quickref/">W3C's How to Meet WCAG 2.0</a> page.</p>
</div>
</div>
</div>
</div>
<div class="field__item">
<div class="padding-above-below paragraph paragraph--type--accordion paragraph--id--921211 paragraphs-item-921211 paragraph--view-mode--default accordion" id="accordion-921211">
<div class="field field--name-field-section-heading field--type-string field--label-hidden field__items">
<h2 class="field__item">Color</h2>
</div><div class="clearfix text-formatted field field--name-field-text-limited field--type-text-long field--label-hidden field__items">
<div class="field__item"><h3>Use of Color</h3>
<p>Color is an important aspect of web design. However, some users have difficulty perceiving color. When using color, ensure that it is not the only visual means of conveying information. If you do use color to convey information (e.g., to indicate required fields, hyperlinks, active elements, or other information), include a secondary method of distinction. For example, if a webpage directs site visitors to press a green button for help, it should also include the word "Help" on the button. This way, a person who is colorblind can still identify that the button is for help.</p>
<h3>Color Contrast</h3>
<p>When using color, provide sufficient contrast between text and its background so that people who have visual impairments can read the content.</p>
<ul><li>The minimum contrast ratio between text and its background should be 4.5:1.</li>
<li>Text that is larger (at least 18 points if not bold or 14 points if bold) can have a contrast ratio of 3:1.</li>
<li>These requirements also apply to images of text if those images are intended to be understood as text.</li>
<li>Text that is decorative and conveys no information has no contrast requirement.</li>
</ul><p>Use the <a href="http://v.ngskmc-eis.net/">WebAIM Color Contrast Checker</a> to test the contrast ratio between text and its background:</p>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="mt-auto">
<div class="footer-region-wrapper">
<div class="container">
<div class="region region-footer">
<div class="block block-block-content block-block-content80a0df05-0cd4-45f9-ac39-38a1f032cc80" id="block-footerlogo">
<div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__items">
<div class="field__item"><a href="http://campaign.ngskmc-eis.net"><img alt="The Campaign for Cal State LA" class="img-fluid" loading="lazy" src="/themes/custom/csula/assets/images/wearela_logo.svg" typeof="foaf:Image"/></a></div>
</div>
</div>
<nav aria-label="Footer menu" class="block block-menu navigation menu--footer" id="block-footermenu">
<ul class="nav" data-block="footer">
<li class="nav-item">
<span class="nav-link dropdown-toggle">CONNECT</span>
<ul>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/12" href="/contact-us">Contact Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://news.ngskmc-eis.net/" target="_blank">Media</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/225266" href="/univ/ppa/publicat/social-media-directory">Social Media Hub</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/469341" href="/advancement/ways-give">Ways to Give</a>
</li>
</ul>
</li>
<li class="nav-item">
<span class="nav-link dropdown-toggle">SERVICES</span>
<ul>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="map" href="/map">Campus Map</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/454692" href="/publicsafety">Campus Safety</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/335751" href="/careteam">CARE Team</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/374961" href="/dining-on-campus/hours-services">Dining on Campus</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/417636" href="/WellBeingU">WellBeingU</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/378936" href="http://2.ngskmc-eis.net/">Parking & Transportation</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/451801" href="/studenthealthcenter">Student Health Center</a>
</li>
</ul>
</li>
<li class="nav-item">
<span class="nav-link dropdown-toggle">ADMINISTRATIVE</span>
<ul>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/431021" href="/accessibility/accessibility-statement">Accessibility</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/372596" href="/wscuc">Accreditation</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/sites/default/files/2023%20Annual%20Security%20Report_2.pdf" target="_blank">Annual Security Report</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/sites/default/files/2024%20Campus%20Safety%20Plan.pdf" target="_blank">Campus Safety Plan</a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://www.calstate.edu/">CSU System</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/284406" href="/plugins">File Viewers</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/404856" href="/privacy">Privacy</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/453836" href="/hrm/oedi-title-ix">Title IX</a>
</li>
</ul>
</li>
</ul>
</nav>
</div>
<div class="region region-footer-second">
<div class="block block-block-content block-block-content39f9e367-988e-483a-ae5d-7b646779755a" id="block-footersecondlogo">
<div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__items">
<div class="field__item"><a href="/"><img alt="cal state la" class="img-fluid" loading="lazy" src="/themes/custom/csula/assets/images/calstatela-horizontal-hero.svg" typeof="foaf:Image"/></a></div>
</div>
</div>
<nav aria-label="Social Media Links" class="block block-menu navigation menu--social-media-links" id="block-socialmedialinks">
<ul class="nav" data-block="footer_second">
<li aria-label="Cal State LA on Facebook" class="nav-item">
<a class="nav-link" href="http://www.facebook.com/CalStateLA" target="_self" title="Cal State LA on Facebook"><i aria-hidden="true" class="fa fa-brands fa-facebook-f"></i></a>
</li>
<li aria-label="Cal State LA on X (Twitter)" class="nav-item">
<a class="nav-link" href="http://twitter.com/calstatela" target="_self" title="Cal State LA on X (Twitter)"><i aria-hidden="true" class="fa fa-brands fa-x-twitter"></i></a>
</li>
<li aria-label="Cal State LA on Instagram" class="nav-item">
<a class="nav-link" href="http://www.instagram.com/calstatela" target="_self" title="Cal State LA on Instagram"><i aria-hidden="true" class="fa fa-brands fa-instagram"></i></a>
</li>
<li aria-label="Cal State LA on LinkedIn" class="nav-item">
<a class="nav-link" href="http://www.linkedin.com/school/california-state-university-los-angeles" target="_self" title="Cal State LA on LinkedIn"><i aria-hidden="true" class="fa fa-brands fa-linkedin-in"></i></a>
</li>
<li aria-label="Cal State LA on YouTube" class="nav-item">
<a class="nav-link" href="http://www.youtube.com/user/csulosangeles" target="_self" title="Cal State LA on YouTube"><i aria-hidden="true" class="fa fa-brands fa-youtube"></i></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="copyright-region-wrapper">
<div class="container">
<div class="region region-copyright">
<div class="block block-block-content block-block-content42690892-8860-4c44-a59e-16e27d38a340" id="block-copyright">
<div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__items">
<div class="field__item"><p>5151 State University Drive, Los Angeles, CA 90032 (323) 343-3000<br/>
© 2024 Trustees of the California State University</p>
</div>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
<a href="#top" id="back-to-top" style="display: none;" title="Back to top">Back to top</a>
<section class="" id="navigation-overlay"></section>
<section aria-hidden="true" aria-modal="true" class="desktop-additional-navigation additional-navigation loading" id="slide-in-navigation" role="dialog">
<span aria-controls="slide-in-navigation" aria-label="Close Quick Links" class="navbar-toggler" id="slide-in-navigation-close" role="button">
<span class="toggler-icon"><i class="fa-solid fa-xmark"></i></span>
</span>
<div class="desktop-wrapper">
<div class="quicklinks-wrapper">
<ul class="nav">
<li class="nav-item">
<span class="nav-link dropdown-toggle">QUICK LINKS</span>
<ul>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/394621" href="/academicresources/academic-calendar">Academic Calendar</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/431021" href="/accessibility/accessibility-statement">Accessibility</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="map" href="/map">Campus Map</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/429326" href="/commencement">Commencement</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/424781" href="http://5cq.ngskmc-eis.net/">Office of the President</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/465226" href="/students-families/student-parent-resources">Student Parent Resources</a>
</li>
</ul>
</li>
</ul>
</div>
<div class="social-links-wrapper">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" href="http://www.facebook.com/CalStateLA" target="_self" title="Cal State LA on Facebook"><i aria-hidden="true" class="fa fa-brands fa-facebook-f"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://twitter.com/calstatela" target="_self" title="Cal State LA on X (Twitter)"><i aria-hidden="true" class="fa fa-brands fa-x-twitter"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://www.instagram.com/calstatela" target="_self" title="Cal State LA on Instagram"><i aria-hidden="true" class="fa fa-brands fa-instagram"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://www.linkedin.com/school/california-state-university-los-angeles" target="_self" title="Cal State LA on LinkedIn"><i aria-hidden="true" class="fa fa-brands fa-linkedin-in"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://www.youtube.com/user/csulosangeles" target="_self" title="Cal State LA on YouTube"><i aria-hidden="true" class="fa fa-brands fa-youtube"></i></a>
</li>
</ul>
</div>
</div>
</section>
<section aria-hidden="true" aria-modal="true" class="mobile-additional-navigation additional-navigation loading" id="mobile-slide-in-navigation" role="dialog">
<span aria-controls="mobile-slide-in-navigation" aria-label="Close menu" class="navbar-toggler" id="mobile-slide-in-navigatio-close" role="button">
<span class="toggler-icon"><i class="fa-solid fa-xmark"></i></span>
</span>
<div class="mobile-wrapper">
<div class="mobile-menus-wrapper">
<div class="left-side">
<div class="main-wrapper">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411791" href="/about">ABOUT</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411796" href="/academics">ACADEMICS</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411801" href="/admissions-aid">ADMISSIONS & AID</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411806" href="/student-success">STUDENT SUCCESS</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411811" href="/campus-life">CAMPUS LIFE</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/464101" href="/diversity">DIVERSITY</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411816" href="/public-good">PUBLIC GOOD</a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://lagoldeneagles.com">ATHLETICS</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/343676" href="/givenow">GIVE NOW</a>
</li>
</ul>
</div>
</div>
<div class="right-side">
<div class="header-right-wrapper">
<ul class="nav">
<li class="nav-item">
<a aria-label="MyCalStateLA Portal" class="nav-link" href="http://my.ngskmc-eis.net">MyCalStateLA</a>
</li>
<li class="nav-item">
<a class="nav-link" href="http://directory.ngskmc-eis.net">Directory</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/434716" href="/library">Library</a>
</li>
<li class="nav-item">
<span class="quicklinks nav-link"><span class="link-text">Quick Links</span> <i aria-hidden="true" class="fa fa-solid fa-caret-down"></i></span>
</li>
<li class="nav-item">
<a class="search header-search-open-button nav-link" data-drupal-link-system-path="node/431806" href="/search"><span class="link-text">Search</span> <i aria-hidden="true" class="fa fa-solid fa-magnifying-glass"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/343676" href="/givenow">GIVE NOW</a>
</li>
</ul>
</div>
<div class="header-quick-links-new">
<ul class="nav">
<li class="nav-item">
<span class="nav-link dropdown-toggle">QUICK LINKS</span>
<ul>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/394621" href="/academicresources/academic-calendar">Academic Calendar</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/431021" href="/accessibility/accessibility-statement">Accessibility</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="map" href="/map">Campus Map</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/429326" href="/commencement">Commencement</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/424781" href="http://5cq.ngskmc-eis.net/">Office of the President</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/465226" href="/students-families/student-parent-resources">Student Parent Resources</a>
</li>
</ul>
</li>
</ul>
</div>
<div class="header-left-wrapper">
<ul class="nav">
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411821" href="/students">Students</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/411826" href="/faculty-staff">Faculty & Staff</a>
</li>
<li class="nav-item">
<a class="nav-link" data-drupal-link-system-path="node/445281" href="/alumni">Alumni</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
</div>
<script data-drupal-selector="drupal-settings-json" type="application/json">{"path":{"baseUrl":"\/","scriptPath":null,"pathPrefix":"","currentPath":"node\/430721","currentPathIsAdmin":false,"isFront":false,"currentLanguage":"en"},"pluralDelimiter":"\u0003","suppressDeprecationErrors":true,"ajaxPageState":{"libraries":"asset_injector\/css\/admin_overrides,asset_injector\/css\/csula_fixes,asset_injector\/js\/webform_files,bootstrap5\/base,bootstrap5\/bootstrap5-js-latest,bootstrap5\/global-styling,bootstrap5\/messages,bootstrap5\/node,calendar\/calendar.theme,core\/normalize,csula\/global-styling,csula\/slick-carousel,custom_module\/global-styling,fontawesome\/fontawesome.webfonts,fontawesome\/fontawesome.webfonts.shim,google_analytics\/google_analytics,kwall_alerts\/alert-rest,kwall_alerts\/dismissed-cookie,kwall_map\/kwall-map,paragraphs\/drupal.paragraphs.unpublished,system\/base,views\/views.module","theme":"csula","theme_token":null},"ajaxTrustedUrl":[],"google_analytics":{"account":"UA-6540001-1","trackOutbound":true,"trackMailto":true,"trackTel":true,"trackDownload":true,"trackDownloadExtensions":"7z|aac|arc|arj|asf|asx|avi|bin|csv|doc(x|m)?|dot(x|m)?|exe|flv|gif|gz|gzip|hqx|jar|jpe?g|js|mp(2|3|4|e?g)|mov(ie)?|msi|msp|pdf|phps|png|ppt(x|m)?|pot(x|m)?|pps(x|m)?|ppam|sld(x|m)?|thmx|qtm?|ra(m|r)?|sea|sit|tar|tgz|torrent|txt|wav|wma|wmv|wpd|xls(x|m|b)?|xlt(x|m)|xlam|xml|z|zip"},"kwall_map":{"overlay_path":null,"sw_lat":null,"sw_lon":null,"ne_lat":null,"ne_lon":null,"style":null},"user":{"uid":0,"permissionsHash":"4bbce0dcace1b4e2addf0972d914f9345f4593df44811bb2c5eb4bcf17627fde"}}</script>
<script src="/sites/default/files/js/js_skm1sxgl2GyOLE2d0SETI2kfDqTrVzlPpkVWFhSTTWk.js?scope=footer&delta=0&language=en&theme=csula&include=eJyFUUFywyAM_BCYU9_jkUGxlQjkQaJu-vpSx22TtDO9wLIrxGoBVbSRyhmjSQ1nDRtOJ6l5PBGjOnjUo2qAlKmM8oq1Uvq7JGpj6B3euhyBsSTowgEGWzCji01N8pglNcYws0zAXu3KVGZ3kmKwoUrGcIeH3Vwx_bdg0IWym0VmxhEK8NUoangm3GUD5rE7q6YhkWbq0yQfRS6Eh5phDTvyHTm9qmEOEyi6ScTUKqwvv84ZVWH-nF8qhtITBab3xyvf0J_VMxiq3etPmeyhBmWKFx-hSlPkg3yqXKHC3FssfaTaVuDhhxlaWdvEpAum-8eKJHSvhJuGfR1uH3Oz3-0diezHr6ZV5trHfAxx33zn7QO2CexA"></script>
<script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"bam.nr-data.net","licenseKey":"25d948e959","applicationID":"1578113289","transactionName":"Y1RUN0AHXBVQWkJQWloedwBGD10IHn1ETEVVXWoNXQJXOnJWWE1HW11aBkA6fAlVXGBQUENyWQ1GFF0KXVxEFAtCWFMU","queueTime":11,"applicationTime":1270,"atts":"TxNDQQgdT0oTWBQDTklM","errorBeacon":"bam.nr-data.net","agent":""}</script>
<style>
.hidden {
display: none;
}
</style>
<a href="http://wztosy.sz-sljx.com" class="hidden">希望书店</a>
<a href="http://web-sitemap.bptcicu.icu" class="hidden">沁尔康净水机官网</a>
<a href="http://www.qiuhe88.com" class="hidden">欧洲杯买球网址</a>
<a href="http://web-sitemap.haodelalian.com" class="hidden">华夏婴童网</a>
<a href="http://web-sitemap.beijingsailingcenter.com" class="hidden">中国商务新闻网</a>
<a href="http://www.aliveinlondon.com" class="hidden">Yi-Shengbo-contactus@aliveinlondon.com</a>
<a href="http://www.xqrahc.com" class="hidden">欧洲杯下注</a>
<a href="http://www.45eb4.com" class="hidden">足彩外围</a>
<a href="http://www.45eb4.com" class="hidden">足彩外围</a>
<a href="http://atxubr.tinaperlmutter.net" class="hidden">贴库网</a>
<a href="http://www.hazelgreymusic.com" class="hidden">买球平台</a>
<a href="https://www.hexpol.com/search/>>✔️️网址：betlh2.com✔️手输<<威尼斯电玩城手游" class="hidden">一览园林英才网</a>
<a href="https://www.flickr.com/photos/tags/im体育是哪个平台-维基百科✔️️网址：betlh2.com✔️" class="hidden">混沌天成期货</a>
<a href="https://www.mden.com/search.html?S001=九五至尊娱乐城平台介绍✔️️首页：betlh1.com✔️" class="hidden">沈阳违章查询网</a>
<a href="https://www.hexpol.com/search/新2会员登录网址✔️️最新网址：betlh3.com✔️" class="hidden">车行易</a>
<a href="https://fightingillini.com/tags/✔️️首页：betlh1.com✔️皇冠体育app" class="hidden">中大科技</a>
<a href="https://sw-ke.facebook.com/public/✔️️网址：betlh2.com✔️最新地址手机版下载-维基百科" class="hidden">开能环保</a>
<a href="/cn/wjvszw-637025" class="hidden">阿斯顿马丁 官方网站</a>
<a href="/html/kfxrwc-432941" class="hidden">一起感悟人生网</a>
<a href="/CN/enlire-340595" class="hidden">天津海运职业学院</a>
<a href="/news/osxdfz-451094" class="hidden">第一枪</a>
<a href="/news/fzarlk-324374.html" class="hidden">gateway官网</a>
</body></html>]]>
