/* * These styles apply ONLY to the header and footer assets. */ /*OOB FOOTER CSS start * { padding: 0; margin: 0; box-sizing: border-box; } .footer { background: #f5f5f6; color: #555a62; font-size: 14px; line-height: 1.5; padding: 18px 0; } .footer-wrap { padding-left: 18px; padding-right: 18px; max-width: 1236px; margin: 0 auto; } .footer a { color: #0291db; } .footer a:hover { color: #0276b3; } .footer-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: -3px; } .footer-col { padding: 0 3px; } .footer-col-copyRight { justify-content: flex-start; } .footer-col-logo { justify-content: flex-end; } .footer-col-copyRight, .footer-col-logo { flex: 1; display: flex; } .logo { width: 124px; height: 27px; opacity: 0.6; } @media screen and (max-width: 768px) { .footer-row { display: block; } .footer-col { width: 100%; text-align: center; margin: 6px 0; } .footer-col:first-child { margin-top: 0; } .footer-col:last-child { margin-bottom: 0; } .footer-col-copyRight, .footer-col-logo { justify-content: center; } .logo { margin: 0 auto; } } OOB FOOTER CSS END */ /*# sourceMappingURL=styles.css.map */ /*GNav styles */ #global-navigation{ z-index: 100; } /* CUSTOM FOOTER CSS START */ /* * The Typekit service used to deliver this font or fonts for use on websites * is provided by Adobe and is subject to these Terms of Use * http://www.adobe.com/products/eulas/tou_typekit. For font license * information, see the list below. * * proxima-nova: * - http://typekit.com/eulas/00000000000000003b9b093b * - http://typekit.com/eulas/00000000000000003b9b093a * - http://typekit.com/eulas/00000000000000003b9b0939 * - http://typekit.com/eulas/00000000000000003b9b0938 * - http://typekit.com/eulas/00000000000000003b9b0934 * - http://typekit.com/eulas/00000000000000003b9b0935 * - http://typekit.com/eulas/00000000000000003b9b0936 * - http://typekit.com/eulas/00000000000000003b9b0937 * * © 2009-2022 Adobe Systems Incorporated. All Rights Reserved. */ /*{"last_published":"2018-07-26 18:06:00 UTC"}*/ @import url("https://p.typekit.net/p.css?s=1&k=mpv7lfl&ht=tk&f=139.140.173.174.175.176.25136.25137&a=14898271&app=typekit&e=css"); @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/71f83c/00000000000000003b9b093b/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/71f83c/00000000000000003b9b093b/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/71f83c/00000000000000003b9b093b/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype"); font-display:auto;font-style:normal;font-weight:700;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/86b539/00000000000000003b9b093a/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff2"),url("https://use.typekit.net/af/86b539/00000000000000003b9b093a/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("woff"),url("https://use.typekit.net/af/86b539/00000000000000003b9b093a/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i7&v=3") format("opentype"); font-display:auto;font-style:italic;font-weight:700;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/27776b/00000000000000003b9b0939/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff2"),url("https://use.typekit.net/af/27776b/00000000000000003b9b0939/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("woff"),url("https://use.typekit.net/af/27776b/00000000000000003b9b0939/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n6&v=3") format("opentype"); font-display:auto;font-style:normal;font-weight:600;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/256534/00000000000000003b9b0938/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3") format("woff2"),url("https://use.typekit.net/af/256534/00000000000000003b9b0938/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3") format("woff"),url("https://use.typekit.net/af/256534/00000000000000003b9b0938/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i6&v=3") format("opentype"); font-display:auto;font-style:italic;font-weight:600;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/4838bd/00000000000000003b9b0934/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/4838bd/00000000000000003b9b0934/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/4838bd/00000000000000003b9b0934/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype"); font-display:auto;font-style:normal;font-weight:400;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/6aec08/00000000000000003b9b0935/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/6aec08/00000000000000003b9b0935/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/6aec08/00000000000000003b9b0935/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype"); font-display:auto;font-style:italic;font-weight:400;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/3331e6/00000000000000003b9b0936/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff2"),url("https://use.typekit.net/af/3331e6/00000000000000003b9b0936/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff"),url("https://use.typekit.net/af/3331e6/00000000000000003b9b0936/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("opentype"); font-display:auto;font-style:normal;font-weight:500;font-stretch:normal; } @font-face { font-family:"proxima-nova"; src:url("https://use.typekit.net/af/1cd3b2/00000000000000003b9b0937/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3") format("woff2"),url("https://use.typekit.net/af/1cd3b2/00000000000000003b9b0937/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3") format("woff"),url("https://use.typekit.net/af/1cd3b2/00000000000000003b9b0937/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i5&v=3") format("opentype"); font-display:auto;font-style:italic;font-weight:500;font-stretch:normal; } .tk-proxima-nova { font-family: "proxima-nova","Helvetica Neue","Helvetica","Arial",sans-serif; } h1, h2, h3, h4, h5, h6, p,ul,li,a { color: #242d48; font-family: "proxima-nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif; font-size: 100%; font-style: normal; font-weight: normal; line-height: 1.5; } /*** Footer *** */ footer { background-color: #0b2265; color: white; display: flex; flex-flow: row wrap; padding-top: 20px; width: 100%; } footer .footer-top { display: flex; flex-flow: column wrap; padding: 20px 20px 0px 20px; justify-content: space-between; } footer .footer-top .links { display: flex; flex-flow: row wrap; width: 100%; color: white; justify-content: space-between; } footer .footer-top .links .link { display: flex; flex-flow: column nowrap; color: white; font-size: 14px; padding: 10px 15px 10px 0px; width: 50%; } footer .footer-top .links .link a { text-decoration: none; color: white; } footer .footer-top .footer-logo { display: flex; width: 80%; } footer .footer-top .footer-logo img { width: 180px; } footer .footer-bottom { align-items: right; background-color: #0b2265; display: flex; flex-flow: column no wrap; width: 100%; color:white; } footer .footer-bottom .copyrights-and-terms-conditions { display: flex; align-items: center; flex-flow: row nowrap; white-space: nowrap; padding: 20px; } footer .footer-bottom .copyrights-and-terms-conditions ul { display: flex; flex-flow: row wrap; font-size: 16px; line-height: 1.5; width: 100%; } footer .footer-bottom .copyrights-and-terms-conditions ul li { border-left: 1px solid white; list-style: none; padding-right: 10px; padding-left: 10px; white-space: nowrap; color:white } footer .footer-bottom .copyrights-and-terms-conditions ul li:first-child { border-left: 0px; } footer .footer-bottom .copyrights-and-terms-conditions ul li a { display: flex; text-decoration: none; color: white; } footer .footer-top .links .link.japan { white-space: nowrap; } @media screen and (max-width: 1200px) { footer .footer-bottom .copyrights-and-terms-conditions{ padding-left:10px; } footer .footer-bottom .copyrights-and-terms-conditions ul{ padding-left: 0px; font-size: 14px; } } @media screen and (min-width: 1200px) { footer { flex-flow: column; justify-content: flex-start; } footer .footer-top { flex-flow: row nowrap; align-items: center; justify-content: space-between; } footer .footer-top .links { flex-flow: row nowrap; justify-content: flex-end; width: 100%; } footer .footer-top .links .link { flex-flow: row nowrap; font-size: 16px; width: fit-content; } footer .footer-bottom { justify-content: flex-end; } footer .footer-bottom .copyrights-and-terms-conditions ul { flex-flow: row nowrap; font-size: 16px; padding-left:0px; } } /* CUSTOM FOOTER CSS end */

Planual: Chapter 4 - UX Build

4.01-01 Naming Conventions

As short as is practical. Use Alpha numeric to prefix the Page name to help order the pages correctly on the App Contents page

Best Practice article
Understanding Anaplan's UX with Analogies, FAQs and Best Practices

Questions on this topic? See 4.01-01 Naming Conventions in our Planual forum.