Page History
HTML |
---|
<style> @import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap'); :root { /* COLORS */ --color-white: #FFFFFF; --color-blue: #2969F2; --color-blue-dark: #06103D; --color-bright-green: #B4F62A; --color-grey-light: #F5F6F7; /* FONT */ --font-family: 'Red Hat Display', sans-serif; --font-size-base: 16px; --font-main-title: 24px; --font-hero-title: 30px; --font-hero-title-alt: 22px; /* SIZES */ --max-content-size: 1060px; --gap-section-block: 30px; --gap-section-inline: 40px; --gap-default: 16px; --border-radius: 6px; --section-image-width: 390px; } .colorBlue { color: var(--color-blue); } .colorBluDark { color: var(--color-blue-dark); } .brightGreenColor { color: var(--color-bright-green); } .semiBold { font-weight: 600; } .italic { font-style: italic; } .flexBox { display: flex; } .alignItemsCenter { align-items: center; } .alignItemsStart { align-items: flex-start; } .alignItemsEnd { align-items: flex-end; } .flexFull { flex: 1 1 100%; } .flexNone { flex: 0 0 auto; } .justifyContentSpaceBetween { justify-content: space-between; } .flexWrap { flex-wrap: wrap; } .inlineIndent { padding-inline: 5px; } main#CAEOnePager { font-family: var(--font-family); font-size: var(--font-size-base); color: var(--color-grey-dark); max-width: var(--max-content-size); box-shadow: 0 0 3px 1px rgb(0 0 0 / 10%); border-radius: 6px; margin: 3px; } #CAEOnePager h1 { font-size: var(--font-hero-title); margin-block-start: 0; margin-block-end: var(--gap-default); font-weight: normal; color: var(--color-white); } #CAEOnePager h2 { font-size: var(--font-hero-title-alt); margin-block-start: 0; margin-block-end: calc(2 * var(--gap-default)); font-weight: normal; color: var(--color-white); } #CAEOnePager h3 { font-size: var(--font-main-title); margin-block-start: 0; margin-block-end: calc(2 * var(--gap-default)); color: var(--color-blue); font-weight: normal; } #CAEOnePager a:link, #CAEOnePager a:visited, #CAEOnePager a:hover, #CAEOnePager a:active { font-weight: 600; color: var(--color-blue); text-decoration: none; cursor: pointer; word-break: break-all; } #CAEOnePager a:hover { text-decoration: underline; } #CAEOnePager a.white { color: var(--color-white); } main p, main span, main div { margin: 0; padding: 0; } section, header, footer { position: relative; } #CAEOnePager header { border-radius: var(--border-radius) var(--border-radius) 0 0; } #CAEOnePager footer { border-radius: 0 0 var(--border-radius) var(--border-radius); } .row { position: relative; } .row +.row { margin-block-start: var(--gap-default); } .column { position: relative; } .gap-block-start-half { margin-block-start: calc(var(--gap-default) / 2); } .gap-block-start { margin-block-start: var(--gap-default); } .gap-block-start-2 { margin-block-start: calc(var(--gap-default) * 2); } .gap-inline-end-half { margin-inline-end: calc(var(--gap-default) / 2); } .gap-inline-end { margin-inline-end: var(--gap-default); } .gap-inline-end-2 { margin-inline-end: calc(var(--gap-default) * 2); } .gap-inline-end-3 { margin-inline-end: calc(var(--gap-default) * 3); } .gap-inline-end-4 { margin-inline-end: calc(var(--gap-default) * 4); } .gap-inline-end-5 { margin-inline-end: calc(var(--gap-default) * 5); } .content-icon { display: flex; align-self: flex-start; position: relative; inset-block-start: 3px; } .content-icon img { flex: 0 0 auto; width: 20px; object-fit: contain; } .content-label { min-width: 150px; } .content-list { position: relative; display: flex; align-items: center; } .content-list:before { content: ""; color: var(--color-blue); display: inline-block; width: 6px; height: 6px; border: 2px solid var(--color-blue); border-inline-start: 0; border-block-end: 0; transform: rotate(45deg); margin-inline-end: var(--gap-default); } #CAEOnePager section:not(:last-of-type):after { content: ""; width: 0; height: 0; border-style: solid; border-width: 8px 10px 0 10px; border-inline-start-color: transparent; border-block-end-color: transparent; border-inline-end-color: transparent; position: absolute; inset-inline-start: 0; inset-inline-end: 0; margin-inline: auto; inset-block-end: -8px; z-index: 1; } .section-wrapper { padding: var(--gap-section-block) var(--gap-section-inline); } .mimicSectionImageWidth { max-width: 100%; width: var(--section-image-width); } .responsiveSection { gap: calc(var(--gap-default) * 3); } @media screen and (max-width: 1280px) { .responsiveSection { flex-direction: column; align-items: center; } } .section-image { display: flex; } .section-image img { max-width: var(--section-image-width); object-fit: contain; border: 1px solid rgba(0, 0, 0, 0.15); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; } @media screen and (max-width: 1280px) { .section-image img { width: 100%; } } .section-image img:hover { border-color: var(--color-blue); transform: scale(1.015); box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.15); } .qr-code-image { display: flex; } .qr-code-image img { max-width: 100px; } /* SECTION #1 */ .section-1 { color: var(--color-white); background: var(--color-blue-dark); } .section-1 > .section-wrapper > * { position: relative; } .section-1 > .section-wrapper figure { position: absolute; inset-block-start: 0; inset-inline-start: 0; margin: 0; width: 100%; height: 100%; padding-right: calc(var(--gap-section-inline) * 9); box-sizing: border-box; } .section-1 > .section-wrapper figure img { display: block; object-fit: cover; height: 100%; width: 100%; max-width: 100%; max-height: 100%; } .section-1 > .section-wrapper > p.semiBold { margin-block-start: var(--gap-default); } .section-1 > .section-wrapper { position: relative; } .section-1 > .section-wrapper div { position: absolute; inset-block-start: 0; inset-inline-end: 0; height: 100%; } @media screen and (max-width: 1280px) { .section-1 > .section-wrapper div { display: flex; justify-content: center; width: 160px; height: 120px; overflow: hidden; margin: var(--gap-default); border: 2px solid var(--color-white); } .section-1 > .section-wrapper figure { padding-inline-end: 0; } } .section-1 > .section-wrapper img { max-height: 100%; } .section-1 > .section-wrapper:has(div img) { padding-inline-end: calc(var(--gap-section-inline) * 10); } @media screen and (max-width: 1280px) { .section-1 > .section-wrapper:has(div img) { padding-inline-end: var(--gap-section-inline); } } /* SECTION #2 */ .section-2 { color: var(--color-white); background: var(--color-blue); } .section-2:after { border-top-color: var(--color-blue); } .section-2 > .section-wrapper { padding: calc(var(--gap-default) / 3); } .section-2 .section-bar { display: flex; align-items: center; justify-content: center; } /* SECTION #3 */ .section-3 { background: var(--color-grey-light); } .section-3:after { border-top-color: var(--color-grey-light); } /* SECTION #4 */ .section-4 { background: var(--color-white); } .section-4:after { border-top-color: var(--color-white); } /* SECTION #5 */ .section-5 { background: var(--color-grey-light); } .section-5:after { border-top-color: var(--color-grey-light); } @media screen and (max-width: 1280px) { .section-5 .responsiveSection { flex-direction: column; align-items: flex-start; gap: var(--gap-default); } .section-5 .responsiveSection .column { width: auto; } } /* SECTION #6 */ .section-6 { background: var(--color-white); } /* SECTION #7 */ .section-7 { background: var(--color-blue-dark); color: var(--color-white); } .section-7 .footer-container { display: flex; justify-content: space-between; align-items: center; } .content-logo { display: flex; } .content-logo img { flex: 0 0 auto; max-width: 70px; object-fit: contain; } </style> <main id="CAEOnePager"> <header class="section-1"> <div class="section-wrapper"> <figure class="header-image-wrapper"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/cae-lines.svg"></figure> <h1>New to CAE LearningSpace?</h1> <h2>Let Us Show You Around!</h2> <p>Here is what you can expect after you have purchased any of our CAE LearningSpace products, have it installed on your premises and are ready to go.</p> <p class="semiBold brightGreenColor">CAE LearningSpace Support will be there for you!</p> <div><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/hero_thumbs-up.png"></div> </div> </header> <section class="section-2"> <div class="section-wrapper"> <div class="section-bar flexBox alignItemsCenter"> <div class="content-icon gap-inline-end-half"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/warranty.svg"></div> <a class="white" href="https://www.caehealthcare.com/media/files/2020-1113_Support_and_Maintenance_Specs_LearningSpace.pdf" target="_blank">Warranty Specifications</a> </div> </div> </section> <section class="section-3"> <div class="section-wrapper"> <h3>How to Contact Us?</h3> <div class="section-content"> <div class="row flexBox"> <div class="content-icon gap-inline-end"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/email.svg"></div> <div class="content-label semiBold gap-inline-end">Support Email</div> <div class="content-value"><a href="mailto:avs-support@cae.com" target="_blank">avs-support@cae.com</a></div> </div> <div class="row flexBox"> <div class="content-icon gap-inline-end"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/telephone.svg"></div> <div class="content-label semiBold gap-inline-end">Support Phone</div> <div class="content-value"> <a href="tel:1-866-462-7920" target="_blank">1-866-462-7920</a><span class="inlineIndent">‐</span><span>Ext. 3<2</span> </div> </div> <div class="row flexBox"> <div class="content-icon gap-inline-end"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/live-chat.svg"></div> <div class="content-label semiBold gap-inline-end">Chat Live</div> <div class="content-value"> <div class="flexBox flexWrap alignItemsCenter"> <a href="https://help.caelearningspace.com" target="_blank">https://help.caelearningspace.com</a> <span class="inlineIndent">‐</span> <p class="italic">Live Help Available</p> </div> </div> </div> </div> </div> </section> <section class="section-4"> <div class="section-wrapper"> <h3>Customer Support</h3> <div class="flexBox alignItemsStart responsiveSection"> <div class="section-image"> <a href="https://help.caelearningspace.com/cf/download/attachments/90309956/support-timezones-cities.png" target="_blank"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/support-timezones-cities.png"></a> </div> <div class="section-content"> <div class="row flexBox"> <div class="content-label semiBold gap-inline-end-3">AVS Support</div> <div class="content-value semiBold">Business Hours (EST)</div> </div> <div class="row flexBox"> <div class="content-label gap-inline-end-3">Monday - Friday</div> <div class="content-value">2:00 a.m. - 8:00 p.m. (EST)</div> </div> <div class="row flexBox"> <div class="content-label gap-inline-end-3">Saturday - Sunday</div> <div class="content-value">Available if purchased additionally and scheduled with team</div> </div> <div class="row flexBox"> <div class="content-label gap-inline-end-3">US Holidays</div> <div class="content-value">Email and chat-based support from 2:00 a.m. to 4:00 p.m. (EST)</div> </div> </div> </div> </div> </section> <section class="section-5"> <div class="section-wrapper"> <h3>Technical Support</h3> <div class="section-content"> <div class="flexBox alignItemsStart responsiveSection"> <div class="column mimicSectionImageWidth"> <div class="row"> <div class="content-list">Usability Assistance</div> </div> <div class="row"> <div class="content-list">Short Webinars (can be scheduled for assistance)</div> </div> <div class="row"> <div class="content-list">Extra Training (can be purchased)</div> </div> </div> <div class="column"> <div class="row"> <div class="content-list">Server Monitoring</div> </div> <div class="row"> <div class="content-list">Daily Maintenance</div> </div> <div class="row"> <div class="content-list">Live Monitoring for Events</div> </div> </div> </div> </div> </div> </section> <section class="section-6"> <div class="section-wrapper"> <h3>CAE LearningSpace Help Site</h3> <div class="flexBox alignItemsStart responsiveSection"> <div class="section-image"> <a href="https://help.caelearningspace.com/cf/download/attachments/90309956/helpsite.png" target="_blank"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/helpsite.png"></a> </div> <div class="section-content"> <div class="row"> <div class="row"> <div class="content-list">A Regularly Updated Knowledge Base</div> </div> <div class="row"> <div class="content-list">Webinar Videos, Training Videos</div> </div> <div class="row"> <div class="content-list">Notification Emails About New Features and Releases</div> </div> <div class="row"> <div class="content-list">Tips and Tricks</div> </div> <div class="flexBox alignItemsCenter"> <div class="row gap-inline-end-3"> <div class="colorBlue gap-block-start-2">Have no time to read Help site articles?</div> <div class="gap-block-start-half"> <div class="flexBox"> <div class="content-icon gap-inline-end-half"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/play.svg"></div> <a href="https://help.caelearningspace.com/" target="_blank">Watch short videos on the Help site!</a> </div> </div> </div> <div class="qr-code-image"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/qr-code-help-site.png"></div> </div> </div> </div> </div> </div> </section> <footer class="section-7"> <div class="section-wrapper"> <div class="footer-container section-content"> <div class="content-logo"><a href="http://www.cae.com/" target="_blank"><img src="https://help.caelearningspace.com/cf/download/attachments/90309956/cae-logo-white.svg"></a></div> <p>©CAE Inc. 2023. All rights reserved.</p> </div> </div> </footer> </main> |
Overview
Content Tools